/* Shared light/dark theme. The navigation deliberately stays white in both. */
:root {
  --theme-bg: #fff;
  --theme-surface: #fff;
  --theme-raised: #f5f6f3;
  --theme-text: #191a18;
  --theme-muted: #676f66;
  --theme-border: #dce1d8;
  --theme-gold: #cbaa66;
}
html[data-theme="light"] { color-scheme: light; }
html[data-theme="dark"] {
  color-scheme: dark;
  --theme-bg: #151a1d;
  --theme-surface: #20272b;
  --theme-raised: #293136;
  --theme-text: #f0f3ef;
  --theme-muted: #b6c0b8;
  --theme-border: #3c4749;
  --theme-gold: #edcc87;
  --muted: #b6c0b8;
  --paper: #20272b;
  --line: #3c4749;
}

.header {
  position: sticky;
  top: 0;
  z-index: 20;
  border-bottom-color: #e1e4de;
  background: #fff;
  color: #191a18;
  color-scheme: light;
  box-shadow: 0 2px 12px #14221a05;
}
.header .brand { color: #191a18; }
.header .brand img { filter: none; }
.header nav { color: #252c27; }
.header nav a[aria-current="page"],
.header nav a:hover { color: #c92722; }
.header .header-actions { gap: 12px; flex: none; }
.header .language { color: #939b92; }
.header .language button { color: #6c756b; }
.header .language button[aria-pressed="true"] { color: #191a18; }
.header .header-quote {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  gap: 8px;
  min-height: 44px;
  padding: 11px 15px;
  border: 1px solid #b7211e;
  border-radius: 7px;
  background: #c92722;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
  white-space: nowrap;
}
.header .header-quote:hover { background: #ab201c; border-color: #ab201c; }
.header .header-quote svg { width: 17px; height: 17px; }
#theme-toggle {
  display: grid;
  place-items: center;
  flex: none;
  width: 44px;
  height: 44px;
  min-width: 44px;
  padding: 0;
  border: 1px solid #dce1d8;
  border-radius: 50%;
  background: #f5f6f2;
  color: #485044;
}
#theme-toggle:hover { border-color: #cbb47e; background: #f5efdF; color: #685323; }
#theme-toggle[aria-pressed="true"] { border-color: #dbca9d; background: #f7f0de; color: #866521; }
#theme-toggle [data-theme-icon] { display: grid; place-items: center; }
#theme-toggle svg { width: 20px; height: 20px; }
#theme-toggle [data-theme-label] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}
.header :is(button, a):focus-visible { outline: 3px solid #2368b4; outline-offset: 3px; }

html[data-theme="dark"] body { background: var(--theme-bg); color: var(--theme-text); }
html[data-theme="dark"] :is(.showcase, .about-page, .catalog-page) { background: var(--theme-bg); }
html[data-theme="dark"] .deals-section { background: #1b2225; border-color: #303b3e; }
html[data-theme="dark"] .deals-section h2,
html[data-theme="dark"] :is(.about-page, .catalog-top) .eyebrow { color: #ef796c; }
html[data-theme="dark"] .classification-note { border-color: #baa269; background: #353126; color: #ddd2b4; }
html[data-theme="dark"] .showcase .rail-controls button { background: #252e32; border-color: #3d484b; color: #ecf1e9; }
html[data-theme="dark"] .showcase .rail-controls button:hover:not(:disabled) { background: #354044; border-color: #b29b67; }
html[data-theme="dark"] .vehicle-rail .vehicle-card.rail-card,
html[data-theme="dark"] .vehicle-card.inventory-card { border-color: #3a4548; background: linear-gradient(145deg, #293135, #1e2529); box-shadow: 0 3px 14px #0002; }
html[data-theme="dark"] .vehicle-rail .rail-card:hover,
html[data-theme="dark"] .vehicle-card.inventory-card:hover { border-color: #7b745c; box-shadow: 0 5px 22px #0003; }
html[data-theme="dark"] .inventory-card .card-body { background: linear-gradient(135deg, #2a3236, #20282c); border-color: #3d484a; }
html[data-theme="dark"] .vehicle-card .card-body { color: #f0f3ee; }
html[data-theme="dark"] .vehicle-card .card-media { background: #242d30; }
html[data-theme="dark"] .vehicle-card :is(.card-mileage, .inventory-card-meta) { color: #b9c3bb; }
html[data-theme="dark"] .vehicle-rail .rail-card .card-details-link { color: #d6decd; }
html[data-theme="dark"] .vehicle-rail .rail-card .card-details-link:hover,
html[data-theme="dark"] .vehicle-card .card-body h3 :is(button, a):hover { color: #efd294; }
html[data-theme="dark"] .vehicle-rail .rail-card .card-contact { color: #d4dddf; }
html[data-theme="dark"] .vehicle-rail .rail-card .card-contact::before { border-color: #526063; background: #354144; }
html[data-theme="dark"] .vehicle-rail .rail-card .card-contact:is(:hover, :focus-visible)::before { border-color: #94a3a0; background: #465457; }
html[data-theme="dark"] .vehicle-rail .rail-card .card-contact.whatsapp { color: #a1e2b2; }
html[data-theme="dark"] .vehicle-rail .rail-card .card-contact.whatsapp::before { border-color: #427b58; background: #284937; }
html[data-theme="dark"] .vehicle-rail .rail-card .card-contact.whatsapp:is(:hover, :focus-visible)::before { border-color: #71ac82; background: #365f46; }
html[data-theme="dark"] .inventory-card-actions > button { border-color: #68786c; background: #334539; color: #f2f6ee; }
html[data-theme="dark"] .inventory-card-actions > button:hover { background: #415746; }
html[data-theme="dark"] .inventory-card-actions .card-contact { border-color: #52615b; background: #303e37; color: #e0e8db; }
html[data-theme="dark"] .inventory-card-actions .card-contact:hover { background: #435248; }
html[data-theme="dark"] .inventory-card-actions .card-contact.whatsapp { border-color: #437959; background: #254634; color: #b0e3b7; }
html[data-theme="dark"] .inventory-card-actions .card-contact.whatsapp:hover { background: #345d43; }

html[data-theme="dark"] .catalog-page .catalog-top { background: linear-gradient(130deg, #222a2f, #192125); border-color: #354145; }
html[data-theme="dark"] .catalog-page .catalog-search > label:first-child,
html[data-theme="dark"] .catalog-page .sort-label select,
html[data-theme="dark"] .filter-panel { border-color: #475356; background: #222c30; color: #f0f3ed; box-shadow: inset 0 1px 0 #ffffff05; }
html[data-theme="dark"] .catalog-search input { color: #f0f3ed; }
html[data-theme="dark"] .catalog-search input::placeholder { color: #aab6ac; }
html[data-theme="dark"] .filter-panel[open] { border-color: #9f936d; box-shadow: 0 4px 16px #0002; }
html[data-theme="dark"] .filter-panel > summary:hover { background: #303d41; }
html[data-theme="dark"] .filter-panel[open] > summary { border-color: #465356; }
html[data-theme="dark"] .filter-panel > summary :is(.filter-value, .filter-chevron),
html[data-theme="dark"] .filter-panel > summary > :is(svg, [data-icon]):last-child { color: #bcc6bd; }
html[data-theme="dark"] .filter-options label,
html[data-theme="dark"] .price-inputs label { color: #d4ddcf; }
html[data-theme="dark"] .filter-panel-body > p:not(.filter-error),
html[data-theme="dark"] .filter-explanation,
html[data-theme="dark"] #active-filter-summary,
html[data-theme="dark"] .catalog-page .inventory-meta { color: #b7c1b5; }
html[data-theme="dark"] .price-inputs input { border-color: #5b6867; background: #182124; color: #f4f5ee; }
html[data-theme="dark"] .price-inputs input::placeholder { color: #a6b1a3; }
html[data-theme="dark"] .price-presets button,
html[data-theme="dark"] .category-filters .filter { border-color: #485650; background: #273530; color: #e6ecdf; }
html[data-theme="dark"] .category-filters .filter.active { border-color: #c0a568; background: #67542e; color: #fff1c8; }
html[data-theme="dark"] .category-filters .filter:hover:not(.active),
html[data-theme="dark"] .price-presets button:hover { background: #3a4940; border-color: #83917a; }
html[data-theme="dark"] .price-presets button:is([aria-pressed="true"], .active) { border-color: #c0a568; background: #53492f; color: #ffe3a7; }
html[data-theme="dark"] #clear-filters { color: #ded9bd; }
html[data-theme="dark"] #clear-filters:hover:not(:disabled) { background: #384238; color: #fff0bc; }
html[data-theme="dark"] #clear-filters:disabled { color: #8b978b; }
html[data-theme="dark"] .filter-error,
html[data-theme="dark"] #active-filter-summary.filter-error { border-color: #a16851; background: #482f27; color: #ffd1bc; }
html[data-theme="dark"] .price-inputs input[aria-invalid="true"] { border-color: #d28164; background: #402c26; }
html[data-theme="dark"] .button.dark { border-color: #657261; background: #344336; color: #f2f5ed; }
html[data-theme="dark"] .button.dark:hover { background: #465844; }
html[data-theme="dark"] .button.white { color: #20251e; }

html[data-theme="dark"] .about-facts,
html[data-theme="dark"] .contact-panel { border-color: #3d4845; background: linear-gradient(135deg, #252e31, #1c2528); }
html[data-theme="dark"] .about-intro p.about-lead { color: #f0f3ed; }
html[data-theme="dark"] .contact-panel > p:not(.eyebrow) { color: #b9c3b7; }
html[data-theme="dark"] body:not([data-page="home"]) > footer { background: #11191b; color: #e4eade; border-color: #3c4744; }
html[data-theme="dark"] body:not([data-page="home"]) > footer .brand img { filter: brightness(0) invert(1); }
html[data-theme="dark"] .home-contact { border-top: 1px solid #303a34; background: #1b2522; }
html[data-theme="dark"] .home-contact .eyebrow { color: #edb49f; }
html[data-theme="dark"] .banner-tabs button { background: #353f40; color: #e3e7df; }
html[data-theme="dark"] .banner-tabs button[aria-pressed="true"] { background: #20282b; color: #f2d087; border-top-color: #d5b36c; }

html[data-theme="dark"] #vehicle-dialog { border-color: #53605d; background: #20282c; color: #eff3ea; }
html[data-theme="dark"] #vehicle-dialog .dialog-top { border-color: #45524e; background: #222b30f5; }
html[data-theme="dark"] #vehicle-dialog .detail-identification { color: #bcc7ba; }
html[data-theme="dark"] #vehicle-dialog .detail-vin strong { color: #e1e7d9; }
html[data-theme="dark"] #vehicle-dialog .detail-trim { border-color: #4f5e53; }
html[data-theme="dark"] #vehicle-dialog #close-dialog { background: #3b4747; color: #f2f5ec; }
html[data-theme="dark"] #vehicle-dialog #close-dialog:hover { background: #52615a; }
html[data-theme="dark"] #vehicle-dialog .detail-photos { background: radial-gradient(ellipse at center, #354044, #20282d); }
html[data-theme="dark"] #vehicle-dialog .gallery-controls button { color: #20271f; }
html[data-theme="dark"] #vehicle-dialog details.condition-box { border-color: #485651; background: linear-gradient(135deg, #2b3539, #232e31); }
html[data-theme="dark"] #vehicle-dialog .condition-box > summary:hover { background: #37463f; }
html[data-theme="dark"] #vehicle-dialog .condition-box[open] > summary { border-color: #4b5951; }
html[data-theme="dark"] #vehicle-dialog .condition-box > summary [data-condition-hint],
html[data-theme="dark"] #vehicle-dialog .condition-box > summary > :is(svg, [data-icon]):last-child { color: #b8c5b3; }
html[data-theme="dark"] #vehicle-dialog .condition-box > p,
html[data-theme="dark"] #vehicle-dialog .condition-box .detail-description p { color: #d4dfcc; }
html[data-theme="dark"] #vehicle-dialog .detail-bottom { border-color: #455249; }
html[data-theme="dark"] #vehicle-dialog .detail-contact { color: #c8d4bd; }
html[data-theme="dark"] #vehicle-dialog .detail-facts dt { color: #b7c3ae; }

@media (max-width: 1240px) { .header .header-phone { display: none; } }
@media (max-width: 900px) {
  .header .header-inner { gap: 12px; }
  .header nav { gap: 16px; }
  .header .header-actions { gap: 8px; }
  .header .header-quote { padding-inline: 11px; }
}
@media (max-width: 760px) {
  html { scroll-padding-top: 120px; }
  .header .header-inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 0 6px;
    height: auto;
    min-height: 106px;
    padding-top: 8px;
  }
  .header .brand { grid-column: 1; grid-row: 1; gap: 7px; min-width: 0; }
  .header .brand img { width: 33px; height: 36px; }
  .header .brand > span { font-size: 25px; letter-spacing: -1.1px; }
  .header .brand small { font-size: 7px; letter-spacing: 1.3px; }
  .header .header-actions { display: contents; }
  .header .header-quote { grid-column: 2; grid-row: 1; padding: 10px; font-size: 11px; gap: 6px; }
  .header #theme-toggle { grid-column: 3; grid-row: 1; justify-self: end; }
  .header nav {
    display: flex;
    grid-column: 1 / 3;
    grid-row: 2;
    width: 100%;
    min-width: 0;
    height: 44px;
    margin: 5px 0 0;
    border-top: 1px solid #eef0e9;
    gap: 0;
    align-items: stretch;
  }
  .header nav a { display: flex; justify-content: center; align-items: center; flex: 1 1 0; min-width: 0; padding-inline: 3px; border-bottom: 2px solid transparent; font-size: 11px; white-space: nowrap; }
  .header nav a[aria-current="page"] { border-bottom-color: #c92722; }
  .header .language { grid-column: 3; grid-row: 2; align-self: stretch; justify-self: end; justify-content: flex-end; min-width: 70px; margin-top: 5px; border-top: 1px solid #eef0e9; gap: 2px; }
  .header .language button { min-width: 31px; min-height: 44px; padding: 8px 3px; font-size: 11px; }
}
@media (max-width: 360px) {
  .header .header-inner { width: calc(100% - 28px); gap: 0 4px; }
  .header .header-quote { padding-inline: 8px; gap: 5px; }
  .header nav a { font-size: 10px; padding-inline: 2px; }
}