/*
 * Healey Brothers refined site palette
 *
 * Primary action:   #0E6FB7
 * Primary hover:    #0B5B96
 * Structural navy:  #071A37
 * Body copy:        #52657F
 * Soft section:     #F5F9FC
 * Highlight tint:   #EAF3F8
 * Border/divider:   #D7E3EC
 * Hero edge:        #E1EDF4
 */

:root {
  --blue: #0E6FB7 !important;
  --blue2: #0B5B96 !important;
  --blue-lt: #EAF3F8 !important;
  --blue-dim: rgba(14, 111, 183, 0.09) !important;

  --gold: #0E6FB7 !important;
  --gold2: #0B5B96 !important;
  --gold-lt: #EAF3F8 !important;
  --gold-bd: rgba(14, 111, 183, 0.22) !important;

  --ink: #071A37 !important;
  --ink2: #24364E !important;
  --muted: #52657F !important;

  --line: #D7E3EC !important;
  --soft: #F5F9FC !important;
  --soft2: #EAF3F8 !important;

  --dark: #071A37 !important;
}

/* Keep white as the dominant site surface. */
html,
body {
  background: #FFFFFF !important;
  color: #071A37;
}

/* Shared page heroes use a restrained blue-gray treatment. */
.page-hero {
  background:
    linear-gradient(
      115deg,
      #F8FBFD 0%,
      #EAF3F8 58%,
      #E1EDF4 100%
    ) !important;
}

.page-hero::after {
  background:
    radial-gradient(
      ellipse at 62% 42%,
      rgba(14, 111, 183, 0.08),
      transparent 70%
    ) !important;
}

/* Homepage hero is slightly brighter and more neutral. */
.hero-card {
  background:
    linear-gradient(
      115deg,
      rgba(255, 255, 255, 0.97) 0%,
      rgba(255, 255, 255, 0.91) 42%,
      rgba(255, 255, 255, 0.20) 100%
    ),
    linear-gradient(
      140deg,
      #F8FBFD 0%,
      #EAF3F8 48%,
      #E1EDF4 100%
    ) !important;
}

.hero-fade {
  background:
    linear-gradient(
      to right,
      rgba(248, 251, 253, 1) 0%,
      rgba(234, 243, 248, 0.72) 34%,
      rgba(234, 243, 248, 0) 70%
    ) !important;
}

/* Alternate sections stay neutral instead of heavily blue. */
.brands-section,
.deals-section,
.section-soft,
.soft-section,
section.soft,
.bg-soft {
  background: #F5F9FC !important;
}

/* White cards remain distinct over soft sections. */
.card,
.panel,
.deal,
.brand,
.task,
.quote,
.price-card,
.inventory-card,
.vehicle-card {
  background-color: #FFFFFF;
}

/* Main actions retain the required Healey blue. */
.btn.primary,
.btn.blue,
.btn.gold,
.nav-cta {
  background: #0E6FB7 !important;
  border-color: #0E6FB7 !important;
  color: #FFFFFF !important;
  box-shadow:
    0 8px 20px rgba(14, 111, 183, 0.20) !important;
}

.btn.primary:hover,
.btn.primary:focus-visible,
.btn.blue:hover,
.btn.blue:focus-visible,
.btn.gold:hover,
.btn.gold:focus-visible,
.nav-cta:hover,
.nav-cta:focus-visible {
  background: #0B5B96 !important;
  border-color: #0B5B96 !important;
}

/* Dark buttons and structural panels return to navy. */
.btn.dark {
  background: #071A37 !important;
  border-color: #071A37 !important;
  color: #FFFFFF !important;
}

.btn.dark:hover,
.btn.dark:focus-visible {
  background: #102B4E !important;
  border-color: #102B4E !important;
}

.btn.outline {
  background: transparent !important;
  color: #0E6FB7 !important;
  border-color: #0E6FB7 !important;
}

.btn.outline:hover,
.btn.outline:focus-visible {
  background: #EAF3F8 !important;
  color: #0B5B96 !important;
}

/* Functional blue controls. */
.filter-chip:hover,
.filter-chip.active,
.inventory-filter-chip:hover,
.inventory-filter-chip.active,
.deal-dot.active {
  background: #0E6FB7 !important;
  border-color: #0E6FB7 !important;
  color: #FFFFFF !important;
}

.inventory-filter-row-search-control {
  border-color: #0E6FB7 !important;
}

.inventory-filter-row-search-control button,
form#inventoryHeroSearchForm
  .inventory-sidebar-search-control button,
.inventory-consolidated-search-control button,
.inventory-hero-search button {
  background: #0E6FB7 !important;
  border-color: #0E6FB7 !important;
  color: #FFFFFF !important;
}

.inventory-filter-row-search-control button:hover,
.inventory-filter-row-search-control button:focus-visible,
form#inventoryHeroSearchForm
  .inventory-sidebar-search-control button:hover,
form#inventoryHeroSearchForm
  .inventory-sidebar-search-control button:focus-visible,
.inventory-consolidated-search-control button:hover,
.inventory-consolidated-search-control button:focus-visible,
.inventory-hero-search button:hover,
.inventory-hero-search button:focus-visible {
  background: #0B5B96 !important;
  border-color: #0B5B96 !important;
}

.inventory-filter-row-search-control:focus-within,
.inventory-consolidated-search-control:focus-within,
.inventory-hero-search-control:focus-within {
  border-color: #0E6FB7 !important;
  box-shadow:
    0 0 0 4px rgba(14, 111, 183, 0.14),
    0 12px 28px rgba(14, 111, 183, 0.10) !important;
}

/* Text hierarchy. */
body,
.section-sub,
.hero-sub,
.card p,
.deal span,
.task span,
blockquote,
.breadcrumb,
.form-help,
.field-help {
  color: #52657F;
}

h1,
h2,
h3,
h4,
h5,
h6,
.section-title,
.price,
.vehicle-title {
  color: #071A37;
}

.eyebrow,
.eyebrow-blue,
.eyebrow-gold,
.textlink,
.see-all,
.breadcrumb a,
.toggle-checks,
.status,
.inv-final-price {
  color: #0E6FB7 !important;
}

/* Light blue is reserved for subtle highlights only. */
.bigicon,
.bigicon.blue,
.bigicon.gold,
.bigicon-gold,
.bigicon-blue,
.stat-icon,
.role-tag,
.inv-badge.new,
.badge-sm,
.q-icon {
  background: #EAF3F8 !important;
  border-color: rgba(14, 111, 183, 0.16) !important;
}

.bigicon svg,
.bigicon.blue svg,
.bigicon.gold svg,
.bigicon-gold svg,
.bigicon-blue svg,
.q-icon svg {
  stroke: #0E6FB7 !important;
}

.stat-icon,
.role-tag,
.inv-badge.new,
.badge-sm {
  color: #0E6FB7 !important;
}

/* Structural navy panels. */
.rating {
  background: #071A37 !important;
}

.admin-topbar,
.login-screen,
.setup-page {
  background:
    linear-gradient(
      135deg,
      #071A37 0%,
      #0A3E66 62%,
      #0E6FB7 100%
    ) !important;
}

/* Softer separators and borders. */
hr,
.divider,
.price-divider,
.card,
.panel,
.deal,
.brand,
.task,
.quote,
.quick,
.inventory-card,
.vehicle-card,
.filter-group {
  border-color: #D7E3EC;
}

input,
select,
textarea,
button,
.sort-select {
  border-color: #D7E3EC;
}

input:focus,
select:focus,
textarea:focus,
button:focus-visible {
  outline-color: #0E6FB7;
}

input[type="checkbox"],
input[type="radio"],
input[type="range"] {
  accent-color: #0E6FB7;
}

/* Positive pricing keeps its separate green meaning. */
.savings,
.price-savings,
.healey-savings,
.positive,
.success {
  color: #178342 !important;
}

/* Prevent the previous lighter blue from acting as a button color. */
[style*="#4B9BCB"],
[style*="#4b9bcb"] {
  --legacy-light-blue: #0B5B96;
}

@media (max-width: 580px) {
  .hero-card {
    background:
      linear-gradient(
        180deg,
        rgba(248, 251, 253, 0.97) 0%,
        rgba(234, 243, 248, 0.87) 60%,
        rgba(248, 251, 253, 0.97) 100%
      ),
      linear-gradient(
        140deg,
        #F8FBFD 0%,
        #E1EDF4 100%
      ) !important;
  }
}