/* Public scope includes body portals, but is absent on every admin route.
   The single dark media rule is controlled through CSSOM by theme-init. */
:root:has([data-public-site]) {
  color-scheme: light;
  --public-theme: light;
  --text-heading: var(--brand-primary);
  --text-link: var(--brand-secondary);
  --text-secondary: #5c7084;
  --footer-text-secondary: #526b80;
  --warning: #87540b;
  --control-border: #7a8c9e;
  --control-hover: #edf3f5;
  --control-error: #b42318;
  --button-danger: #b42318;
  --tab-active: #026773;
  --photo-heading: #092c4e;
  --photo-text: #31465a;
  --accent-soft: color-mix(in srgb, var(--brand-secondary) 10%, white);
  --image-scrim: rgb(6 24 43 / .72);
}
:root:has([data-public-site]) :is(input:not([type="range"]):not([type="checkbox"]):not([type="radio"]),select,textarea) {
  border-color: var(--control-border);
}
:root:has([data-public-site]) :is(input,select,textarea)[aria-invalid="true"] { border-color:var(--control-error); }
:root:has([data-public-site]) :is(button.border,a.inline-flex.border) { border-color:var(--control-border); }
:root:has([data-public-site]) .mobile-tab-bar__item--active { color:var(--tab-active); }
:root:has([data-public-site]) :is(.bg-brand-accent,.bg-\[var\(--brand-accent\)\]).text-brand-primary { background-color:var(--brand-accent); color:var(--brand-primary); }
/* Keep artwork intact; a separate scrim gives copy a predictable contrast. */
:root:has([data-public-site]) .home-special-offers__card--has-photo {
  background-image:linear-gradient(105deg, var(--image-scrim) 0%, var(--image-scrim) 52%, rgb(6 24 43 / .1) 100%),var(--card-bg-image);
}
:root:has([data-public-site]) :is(.home-special-offers__card-desc,.home-special-offers__card-detail) { color:var(--text-inverse); }

/* Available header width changes when the rail is pinned. Adapt its optional
   labels to the container, rather than letting the contact text overlap. */
:root:has([data-public-site]) .public-site-header { container:public-header / inline-size; }
:root:has([data-public-site]) :is(.public-site-header__contacts,.public-site-header__contact,.public-site-header__toolbar) { flex-shrink:0; }
@container public-header (max-width: 1250px) {
  .public-site-header__action-label { display:none; }
}
@container public-header (max-width: 1080px) {
  .public-site-header__contacts > div { display:none; }
}

/*
  Desktop header — inset panel (same gutters as catalog cards / seo-footer).
  Light + dark: outer shell transparent; fill only on __inner.
  Mobile/tablet header stays full-bleed.
*/
:root:has([data-public-site]) .public-site-header {
  height: auto;
  border-bottom: none;
  background: transparent;
  padding-top: var(--home-block-gap, 0.75rem);
  padding-left: var(--shell-content-pad-left, 1rem);
  padding-right: var(--shell-content-pad-right, 1rem);
  padding-bottom: 0;
}
:root:has([data-public-site]) .public-site-header__inner {
  box-sizing: border-box;
  height: var(--shell-topbar-height, 5.75rem);
  border: 1px solid var(--shell-topbar-border, var(--border));
  border-radius: var(--radius-md);
  background: var(--shell-topbar-bg, var(--surface));
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}
@media (min-width: 640px) {
  :root:has([data-public-site]) .public-site-header__inner {
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
  }
}

.public-theme-switch { color:var(--text-primary); min-width:0; margin:0 0 12px; border:0; padding:0; }
.public-theme-switch legend { color:inherit; font-size:12px; font-weight:700; margin-bottom:8px; }
.public-theme-switch__modes { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:4px; }
.public-theme-switch__mode { position:relative; min-width:0; cursor:pointer; }
.public-theme-switch__mode input { position:absolute; width:1px; height:1px; opacity:0; }
.public-theme-switch__mode span { display:flex; min-height:48px; height:100%; flex-direction:column; align-items:center; justify-content:center; gap:4px; padding:6px 3px; font-size:11px; line-height:1.3; text-align:center; border:1px solid var(--control-border); border-radius:4px; color:var(--text-primary); background:var(--surface); }
.public-theme-switch__mode input:checked + span { background:var(--brand-secondary); color:var(--text-inverse); border-color:var(--brand-accent); }
.public-theme-switch__mode input:focus-visible + span { outline:2px solid var(--focus); outline-offset:2px; }
.mobile-shell-drawer .public-theme-switch {
  text-align: center;
}
.mobile-shell-drawer .public-theme-switch legend {
  color: var(--text-inverse);
  display: block;
  width: 100%;
  margin-inline: auto;
  margin-bottom: 8px;
  padding: 0;
  float: none;
  text-align: center;
}
.public-theme-switch--compact { position:relative; flex:0 0 44px; width:44px; height:44px; margin:0; display:grid; place-items:center; color:var(--text-heading,var(--brand-primary)); }
.public-theme-switch--compact select { position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; }
.public-theme-switch--compact:focus-within { outline:2px solid var(--focus); outline-offset:0; border-radius:4px; }

@media (prefers-color-scheme: dark) {
  :root:has([data-public-site]) {
    color-scheme: dark;
    --public-theme: dark;
    --background: #071522;
    --surface: #102538;
    --surface-muted: #182f43;
    --text-primary: #edf4fa;
    --text-heading: #edf4fa;
    --text-secondary: #b0c2d3;
    --footer-text-secondary: #b0c2d3;
    --text-inverse: #ffffff;
    --glass-text: var(--text-primary);
    --glass-text-muted: var(--text-secondary);
    --text-link: #61d9d0;
    --border: #365066;
    --border-strong: #8199ad;
    --control-border: #8199ad;
    --control-hover: #203d53;
    --control-error: #ffaba5;
    --focus: #61d9d0;
    --success: #73dfb1;
    --warning: #f3cd83;
    --danger: #ffaba5;
    --tab-active: #61d9d0;
    --accent-soft: #183c48;
    --shell-content-surface: var(--background);
    --shell-submenu-surface: var(--surface);
    --shell-content-bg: var(--background);
    --shadow-sm: 0 1px 3px rgb(0 0 0 / .25);
    --shadow-md: 0 8px 24px rgb(0 0 0 / .3);
    --shadow-lg: 0 18px 48px rgb(0 0 0 / .4);
  }
  /* Existing Tailwind colour roles. Background brand colours stay unchanged. */
  :root:has([data-public-site]) :is(.text-brand-primary,.text-slate-900,.text-gray-900) { color:var(--text-heading); }
  :root:has([data-public-site]) :is(.text-brand-secondary,.text-brand-accent) { color:var(--text-link); }
  :root:has([data-public-site]) :is(.text-slate-500,.text-slate-600,.text-gray-500,.text-gray-600) { color:var(--text-secondary); }
  :root:has([data-public-site]) :is(.bg-white,.bg-white\/95,.bg-white\/90) { background-color:var(--surface); }
  :root:has([data-public-site]) :is(.bg-slate-50,.bg-gray-50,.bg-neutral-50,.bg-neutral-100) { background-color:var(--surface-muted); }
  :root:has([data-public-site]) .hover\:bg-white:hover { background-color:var(--control-hover); }
  :root:has([data-public-site]) :is(.hover\:text-brand-secondary,.hover\:text-brand-primary):hover { color:var(--text-link); }
  :root:has([data-public-site]) .bg-danger { background-color:var(--button-danger); }
  :root:has([data-public-site]) :is(input,textarea,select)::placeholder { color:var(--text-secondary); opacity:1; }
  :root:has([data-public-site]) :is(input,select,textarea) { accent-color:var(--brand-accent); }
  :root:has([data-public-site]) :is(input,select,textarea):disabled { background-color:var(--surface-muted); color:var(--text-secondary); }
  :root:has([data-public-site]) .ui-select { color:var(--text-primary); }
  :root:has([data-public-site]) :is(.bg-brand-accent,.bg-\[var\(--brand-accent\)\]).text-brand-primary { color:var(--brand-primary); }
  :root:has([data-public-site]) .home-quick-actions__icon { background:var(--accent-soft); color:var(--text-link); }
  :root:has([data-public-site]) .home-quick-actions__title { color:var(--text-secondary); }
  :root:has([data-public-site]) .home-quick-actions__action:hover { background:var(--control-hover); }
  /* Brand marks use CSS-mask + currentColor (BrandLogo) — no dark-mode PNG plate. */
  :root:has([data-public-site]) .bg-danger:hover { background-color:var(--button-danger); }
  :root:has([data-public-site]) :is(button,a):is(.bg-brand-primary,.bg-brand-secondary) { box-shadow:inset 0 0 0 1px var(--control-border); }
  :root:has([data-public-site]) ::selection { background:var(--brand-secondary); color:var(--text-inverse); }

  /* CMS overrides are preserved in light mode. Dark chrome gets semantic roles,
     rather than reusing a light palette supplied by the header/menu editor. */
  :root:has([data-public-site]) :is(.public-site-header,.mobile-shell-header) {
    --shell-topbar-bg: var(--surface) !important;
    --shell-topbar-background: var(--surface) !important;
    --shell-topbar-border: var(--border) !important;
    --shell-topbar-text: var(--text-primary) !important;
    --shell-topbar-muted: var(--text-secondary) !important;
    --shell-topbar-icon: var(--text-primary) !important;
    --shell-topbar-hover: var(--text-link) !important;
    --shell-topbar-focus: var(--focus) !important;
    color: var(--text-primary);
  }
  /* Mobile/tablet header stays a full-bleed surface bar. */
  :root:has([data-public-site]) .mobile-shell-header {
    background: var(--surface);
  }
  /* Desktop inset panel fill already set above; dark tokens override colors. */
  :root:has([data-public-site]) .public-site-header__inner {
    border-color: var(--border);
    background: var(--surface);
  }
  :root:has([data-public-site]) :is(.public-site-header__logo-image--filled,.mobile-shell-header span[data-testid="shell-brand-logo-image"]) { background-color:var(--text-primary) !important; }
  :root:has([data-public-site]) :is(.public-site-header__logo-text,.mobile-shell-header [data-testid="shell-brand-logo-text"]) { color:var(--text-primary) !important; }
  :root:has([data-public-site]) :is(.public-site-header__logo-image:not(.public-site-header__logo-image--filled),.mobile-shell-header img[data-testid="shell-brand-logo-image"]) { background:var(--text-inverse); border-radius:4px; padding:4px; }
  :root:has([data-public-site]) :is(.mobile-shell-drawer,.portal-sidebar,.desktop-navigation-shell,.public-app-shell) {
    --shell-menu-rail-from: #102c40 !important;
    --shell-menu-rail-to: #123a48 !important;
    --shell-menu-text-color: #edf4fa !important;
    --shell-menu-icon-color: var(--text-primary) !important;
    --shell-menu-text-hover: var(--text-inverse) !important;
    --shell-menu-active-text: var(--text-heading) !important;
    --shell-menu-active-icon: var(--text-link) !important;
    --shell-menu-submenu-surface: var(--surface) !important;
    --shell-submenu-surface: var(--surface) !important;
  }
  :root:has([data-public-site]) .mobile-tab-bar { color:var(--text-primary); }
  :root:has([data-public-site]) .mobile-tab-bar__item { color:var(--text-primary); }
  :root:has([data-public-site]) .mobile-tab-bar__item--active { color:var(--tab-active); }
  :root:has([data-public-site]) .mobile-tab-bar__surface { filter:drop-shadow(0 -3px 10px rgb(0 0 0 / .4)); }
  /* Keep navigation readable even when a bright photograph is behind it. */
  :root:has([data-public-site]) .portal-sidebar__glass,
  :root:has([data-public-site]) .mobile-shell-drawer::before {
    background:linear-gradient(160deg,
      color-mix(in srgb, var(--shell-menu-rail-from) 97%, transparent),
      color-mix(in srgb, var(--shell-menu-rail-to) 97%, transparent));
  }
  @media (min-width: 768px) {
    :root:has([data-public-site]) .mobile-shell-drawer {
      background:linear-gradient(160deg,
        color-mix(in srgb, var(--shell-menu-rail-from) 97%, transparent),
        color-mix(in srgb, var(--shell-menu-rail-to) 97%, transparent));
    }
  }

  :root:has([data-public-site]) :is(.home-advantages) {
    --advantages-border:var(--border);
    --advantages-title:var(--text-heading);
    --advantages-desc:var(--text-secondary);
    --advantages-accent:var(--text-link);
    --advantages-accent-hover:var(--text-link);
    --advantages-divider:var(--border);
  }
  :root:has([data-public-site]) .home-car-picker__media { background:var(--surface-muted); }
  /* Catalogue text sits on its own scrim; the photograph remains unchanged. */
  :root:has([data-public-site]) .home-catalog-entries__content { background:linear-gradient(var(--surface) 80%,transparent); }
  :root:has([data-public-site]) .home-catalog-entries__title { color:var(--text-heading); }
  :root:has([data-public-site]) .home-catalog-entries__description { color:var(--text-secondary); }
  :root:has([data-public-site]) .home-slide--hero { color:var(--photo-heading); }
  :root:has([data-public-site]) .home-slide--hero .home-slide__button--secondary { background:var(--surface); color:var(--text-heading); border-color:var(--control-border); }
  :root:has([data-public-site]) :is(.home-slide__link,.home-slide--hero .home-slide__link) { color:var(--brand-secondary); }
}