/* Shared storefront and admin theme. Existing light colours remain the baseline. */
:root {
  --theme-foreground: #fffefa;
  --theme-photo-stage: #f5f3ec;
  --theme-accent-wash: rgba(31, 113, 108, .07);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --ink: #f1eee4;
  --ink-2: #d1dcd2;
  --muted: #a6b6ac;
  --paper: #101816;
  --paper-2: #1c2925;
  --white: #17211e;
  --line: rgba(211, 230, 214, .16);
  --deep: #091310;
  --deep-2: #102720;
  --teal: #a6cbb6;
  --teal-light: #bbd8bd;
  --acid: #d7eb9b;
  --orange: #e7a184;
  --danger: #ffa79a;
  --shadow: 0 20px 50px rgba(0, 0, 0, .25);
  --theme-foreground: #f1eee4;
  --theme-accent-wash: rgba(166, 203, 182, .08);
}

.theme-toggle {
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  display: inline-grid;
  place-items: center;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: transparent;
  color: inherit;
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease;
}
.theme-toggle:hover { border-color: var(--teal); background: var(--theme-accent-wash); }
.theme-toggle:focus-visible { outline: 3px solid var(--teal); outline-offset: 4px; }
.theme-toggle svg { display: block; width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.theme-toggle .theme-icon-sun { display: none; }
html[data-theme="dark"] .theme-toggle .theme-icon-sun { display: block; }
html[data-theme="dark"] .theme-toggle .theme-icon-moon { display: none; }
.admin-header-actions { display: flex; align-items: center; gap: 1rem; }
.admin-header .theme-toggle { border-color: rgba(255, 255, 255, .24); color: #f1eee4; }

.header-inner { grid-template-columns: minmax(125px, 1fr) auto auto; gap: clamp(.8rem, 1.5vw, 1.5rem); }
.desktop-nav { gap: clamp(.7rem, 1.5vw, 1.35rem); font-size: .8rem; }
.header-actions { gap: .4rem; }
.announcement { font-size: .68rem; letter-spacing: .06em; }
.announcement a { text-underline-offset: 3px; }
.announcement a:hover { text-decoration: underline; }
.hero-grid { min-height: 650px; padding-block: clamp(4.5rem, 7vw, 6.5rem); }
.hero-lede { max-width: 490px; }
.category-section { padding-block: clamp(4rem, 6vw, 6rem); }
.category-card { min-height: 260px; }
.catalogue-section { padding-block: clamp(4.5rem, 7vw, 7rem); }
.catalogue-delivery { margin: 1rem 0 0; color: var(--teal); font-size: .83rem; line-height: 1.6; }

.delivery-benefits { border-bottom: 1px solid var(--line); background: var(--white); }
.delivery-benefits-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); padding-block: 1.65rem; }
.delivery-benefit { min-width: 0; display: flex; align-items: center; gap: 1rem; padding-inline: clamp(1rem, 3vw, 2.5rem); }
.delivery-benefit:first-child { padding-left: 0; }
.delivery-benefit:last-child { padding-right: 0; }
.delivery-benefit + .delivery-benefit { border-left: 1px solid var(--line); }
.benefit-icon { flex: 0 0 42px; width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: var(--teal); }
.benefit-icon svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.delivery-benefit strong { display: block; font-size: .84rem; font-weight: 700; line-height: 1.4; }
.delivery-benefit p { margin: .25rem 0 0; color: var(--muted); font-size: .72rem; line-height: 1.55; }
.cart-delivery-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 0 0 .85rem; padding-bottom: .85rem; border-bottom: 1px solid var(--line); color: var(--muted); font-size: .78rem; }
.cart-delivery-row strong { color: var(--teal); font-weight: 750; }
.delivery-summary-note { margin: 1rem 0 0; padding: .8rem; border-radius: 10px; background: var(--theme-accent-wash); color: var(--ink-2); font-size: .72rem; line-height: 1.65; }
#checkoutDelivery { color: var(--teal); }

.delivery-section { padding-block: clamp(4.5rem, 8vw, 7.5rem); border-top: 1px solid var(--line); background: var(--paper); }
.delivery-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); align-items: center; gap: clamp(2rem, 7vw, 7rem); }
.delivery-grid > div:first-child > h2 { margin: 0; max-width: 650px; font-family: var(--font-sans); font-size: clamp(3rem, 5vw, 5rem); font-weight: 600; letter-spacing: -.025em; line-height: 1.12; }
.delivery-grid > div:first-child > p:not(.eyebrow) { max-width: 510px; margin: 1.5rem 0 0; color: var(--muted); font-size: .95rem; line-height: 1.8; }
.delivery-card { padding: clamp(1.5rem, 3vw, 2.5rem); border: 1px solid var(--line); border-radius: 22px; background: var(--white); }
.delivery-card > strong { display: block; color: var(--teal); font-family: var(--font-sans); font-size: clamp(3.2rem, 5vw, 4.5rem); font-weight: 600; letter-spacing: -.025em; line-height: 1; }
.delivery-card h3 { margin: .5rem 0 0; color: var(--ink); font-family: var(--font-sans); font-size: 1.7rem; font-weight: 600; line-height: 1.2; }
.delivery-card > p:not(.eyebrow) { margin: .8rem 0 0; color: var(--muted); font-size: .82rem; line-height: 1.7; }
.delivery-facts { margin: 1.5rem 0 0; }
.delivery-facts > div { display: flex; justify-content: space-between; gap: 1rem; padding: .9rem 0; border-top: 1px solid var(--line); }
.delivery-facts dt { color: var(--muted); font-size: .76rem; }
.delivery-facts dd { margin: 0; color: var(--ink); font-size: .76rem; font-weight: 650; text-align: right; }

/* Foregrounds on permanently dark areas are independent of the surface token. */
html[data-theme="dark"] :is(.hero, .standards-section, .tracker-preview-card, .site-footer, .hero-card-copy strong, .button-ghost-light, .toast, .admin-header) { color: var(--theme-foreground); }
html[data-theme="dark"] .hero { background: radial-gradient(ellipse at 85% 25%, rgba(86, 126, 97, .14), transparent 55%), var(--deep); }
html[data-theme="dark"] .hero-card { background: rgba(27, 44, 35, .95); }
html[data-theme="dark"] .hero-lede { color: #b9c6b9; }
html[data-theme="dark"] :is(.hero-meta span, .specimen-kicker, .hero-card-copy, .preview-entry div span, .standard-list p, .standards-copy > p:not(.eyebrow), .footer-brand p) { color: #a7b5a8; }
html[data-theme="dark"] .orbit-label { color: #92a28f; }
html[data-theme="dark"] .site-header { background: rgba(16, 24, 22, .94); }
html[data-theme="dark"] .brand-mark { border: 1px solid rgba(215, 235, 155, .25); }
html[data-theme="dark"] .basket-button { border-color: var(--line); background: var(--paper-2); color: var(--ink); }
html[data-theme="dark"] .button-dark,
html[data-theme="dark"] .admin-page .primary-button { background: var(--acid); color: var(--deep); }
html[data-theme="dark"] .button-dark:hover,
html[data-theme="dark"] .admin-page .primary-button:hover { background: #e5f5b8; }
html[data-theme="dark"] :is(.filter-chip.active, .filter-chip:hover, .tracker-tab.active) { border-color: var(--teal); background: var(--teal); color: var(--deep); }
html[data-theme="dark"] :is(.small-button.complete, .success-mark, .account-avatar) { color: var(--deep); }
html[data-theme="dark"] .small-button:hover { border-color: var(--teal); }
html[data-theme="dark"] .account-cta { background: #203e31; color: var(--theme-foreground); }
html[data-theme="dark"] .footer-grid a,
html[data-theme="dark"] .footer-link { color: #b1c0b3; }
html[data-theme="dark"] :is(.footer-grid a:hover, .footer-link:hover) { color: var(--acid); }
html[data-theme="dark"] .footer-bottom { color: #98a797; }
html[data-theme="dark"] .product-card { background: #1a2721; border-color: rgba(211, 230, 214, .15); }
html[data-theme="dark"] .product-status:not(.stock-unavailable) { color: var(--teal); }
html[data-theme="dark"] .stock-unavailable { color: #b7b9ad; }
html[data-theme="dark"] :is(.product-art, .product-photo, .has-product-photo, .product-detail-art, .inventory-photo) { background: var(--theme-photo-stage); color: #10201f; }
html[data-theme="dark"] .micro-label { background: #fffefa; color: #10201f; }
html[data-theme="dark"] .product-index { color: #52635a; }
html[data-theme="dark"] .quick-add { color: #10201f; border-color: rgba(16, 32, 31, .25); background: rgba(255, 254, 250, .92); }
html[data-theme="dark"] .quick-add:hover { color: var(--deep); background: var(--acid); }
html[data-theme="dark"] .quick-add:disabled:hover { color: #10201f; background: rgba(255, 254, 250, .92); }
html[data-theme="dark"] .skeleton-card { background: linear-gradient(100deg, #1b2922 20%, #26362d 45%, #1b2922 70%); background-size: 200% 100%; }
html[data-theme="dark"] .cart-drawer { border-left: 1px solid var(--line); }
html[data-theme="dark"] :is(.modal, .order-dialog) { border: 1px solid var(--line); }
html[data-theme="dark"] .modal::backdrop,
html[data-theme="dark"] .order-dialog::backdrop { background: rgba(2, 8, 5, .78); }
html[data-theme="dark"] :is(.form-error, .text-button.danger) { color: var(--danger); }
html[data-theme="dark"] .status-badge.skipped { color: #efb298; }
html[data-theme="dark"] .status-badge { background: rgba(166, 203, 182, .1); }
html[data-theme="dark"] :is(.stack-form input, .stack-form select, .stack-form textarea, .inventory-form input, .admin-login-form input, .search-form input, .search-form select) { border-color: rgba(211, 230, 214, .25); }
html[data-theme="dark"] :is(input, textarea)::placeholder { color: #92a498; opacity: 1; }
html[data-theme="dark"] :is(select, select option) { color: var(--ink); background-color: var(--paper); }
html[data-theme="dark"] :is(button, a, input, select, textarea):focus-visible { outline-color: var(--acid); }
html[data-theme="dark"] :is(.stack-form input, .stack-form select, .stack-form textarea):focus { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(166, 203, 182, .16); }
html[data-theme="dark"] :is(.checkout-account-note, .consent-check) { border-color: var(--line); background: var(--theme-accent-wash); }
html[data-theme="dark"] .social-login-button { background: var(--paper); }
html[data-theme="dark"] .provider-google { background: #fffefa; color: #1f716c; }
html[data-theme="dark"] .provider-apple { background: #d9e1d6; color: var(--deep); }
html[data-theme="dark"] .stack-form .payment-option { background: var(--paper); }
html[data-theme="dark"] .stack-form .payment-option-selected { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(166, 203, 182, .1); }
html[data-theme="dark"] .payment-method-icon { background: var(--deep); color: var(--acid); }
html[data-theme="dark"] :is(.payment-option-disabled .payment-method-icon, .payment-method-badge.unavailable) { background: #26352d; color: #b8c4b8; }
html[data-theme="dark"] .crypto-connection-status { background: var(--paper); border-color: #607866; }
html[data-theme="dark"] .mobile-nav { background: rgba(16, 24, 22, .97); }
html[data-theme="dark"] .mobile-nav b { color: var(--deep); }
html[data-theme="dark"] .admin-page .summary-grid small { color: #e1c784; }
html[data-theme="dark"] .admin-page td { border-bottom-color: var(--line); }
html[data-theme="dark"] .admin-page :is(.orders-error, .detail-error) { background: #30221e; border-color: #775046; color: var(--danger); }
html[data-theme="dark"] .admin-page .inventory-summary article:last-child { background: var(--theme-accent-wash); }

@media (max-width: 1080px) {
  .header-inner { grid-template-columns: 1fr auto; }
  .hero-grid { min-height: 590px; }
  .delivery-benefit { gap: .75rem; padding-inline: 1rem; }
  .delivery-benefit strong { font-size: .78rem; }
  .delivery-benefit p { font-size: .68rem; }
}

@media (max-width: 820px) {
  .header-actions .theme-toggle { display: inline-grid; }
  .hero-grid { min-height: auto; padding-block: 4.5rem 2rem; }
  .delivery-grid { grid-template-columns: 1fr; gap: 2rem; }
  .delivery-card { max-width: 620px; width: 100%; }
  .delivery-benefit { gap: .6rem; padding-inline: .8rem; }
  .benefit-icon { flex-basis: 34px; width: 34px; height: 34px; }
  .benefit-icon svg { width: 18px; height: 18px; }
  .category-card { min-height: 250px; }
}

@media (max-width: 600px) {
  .announcement { gap: .25rem .5rem; padding-block: .65rem; font-size: .57rem; line-height: 1.6; }
  .header-inner { gap: .75rem; }
  .theme-toggle { flex-basis: 44px; }
  .hero-grid { padding-block: 3.6rem 1.8rem; }
  .hero-lede { margin-top: 1.5rem; font-size: 1rem; }
  .hero-meta { margin-top: 2rem; }
  .delivery-benefits-grid { grid-template-columns: 1fr; padding-block: .4rem; }
  .delivery-benefit,
  .delivery-benefit:first-child,
  .delivery-benefit:last-child { padding: .9rem .2rem; gap: .85rem; }
  .delivery-benefit + .delivery-benefit { border-left: 0; border-top: 1px solid var(--line); }
  .delivery-benefit strong { font-size: .83rem; }
  .delivery-benefit p { margin-top: .15rem; font-size: .71rem; }
  .category-section { padding-block: 3.5rem; }
  .category-section .section-heading { margin-bottom: 1.75rem; }
  .category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; border: 0; }
  .category-card { min-height: 130px; padding: .9rem; justify-content: flex-end; border: 1px solid var(--line); border-radius: 12px; }
  .category-card:last-child { grid-column: 1 / -1; min-height: 92px; padding-left: 76px; justify-content: center; }
  .category-index, .category-card i { display: none; }
  .category-orb { width: 35px; height: 35px; top: 13px; left: 16px; transform: none; }
  .category-card:hover .category-orb { transform: scale(1.06); }
  .category-card:last-child .category-orb { left: 19px; top: calc(50% - 20px); width: 40px; height: 40px; }
  .category-card strong { font-size: 1.08rem; line-height: 1.15; }
  .category-card > span:last-of-type { font-size: .62rem; }
  .catalogue-section { padding-block: 3.7rem; }
  .catalogue-delivery { margin-top: .9rem; font-size: .78rem; }
  .product-art { height: 285px; }
  .delivery-section { padding-block: 3.7rem; }
  .delivery-grid > div:first-child > h2 { font-size: 3rem; }
  .delivery-grid > div:first-child > p:not(.eyebrow) { font-size: .89rem; }
  .delivery-card { padding: 1.4rem; border-radius: 18px; }
  .delivery-card h3 { font-size: 1.5rem; }
  .delivery-facts dt, .delivery-facts dd { font-size: .72rem; }
  .admin-header-actions { gap: .7rem; }
  .mobile-nav { height: calc(66px + env(safe-area-inset-bottom, 0px)); padding-bottom: env(safe-area-inset-bottom, 0px); }
  body:not(.admin-page) { padding-bottom: calc(66px + env(safe-area-inset-bottom, 0px)); }
  html[data-theme="dark"] .admin-page td { border: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .theme-toggle { transition: none; }
}

/* Keep delivery copy and its action distinct at every width. */
.delivery-grid > div:first-child > .button { margin-top: 1.5rem; }
.delivery-card > .benefit-icon { margin-bottom: 1.3rem; }
.cart-delivery-row { margin-top: .75rem; }
html[data-theme="dark"] .button-accent:hover { background: #e5f5b8; }
@media (max-width: 600px) {
  .admin-page .auth-panel h1 { font-size: clamp(2.25rem, 10vw, 3rem); }
}
html[data-theme="dark"] .admin-page .inventory-summary article:last-child { background: var(--paper); }
html[data-theme="dark"] .admin-page .inventory-summary article:nth-child(3) { background: var(--theme-accent-wash); }