/* Shared theme surface for every Doppio route, including standalone panels. */
:root {
  color-scheme: light;
  --theme-bg: #120c08;
  --theme-surface: #1b130e;
  --theme-surface-2: #261a13;
  --theme-ink: #f8f1e8;
  --theme-muted: #c2b2a6;
  --theme-line: #4a3528;
}

:root[data-theme="dark"] {
  color-scheme: dark;
}

:root[data-theme="dark"] body {
  background: var(--theme-bg) !important;
  color: var(--theme-ink) !important;
}

/* Dark site typography: override legacy light-mode declarations that otherwise
   leave isolated headings, links and labels black. */
:root[data-theme="dark"] :is(.site-page, .site-page main, .site-page section, .site-page article, .site-page aside, .site-page footer) :is(h1,h2,h3,h4,h5,h6,strong,b,a,label,button) {
  color: #f8f1e8 !important;
}
:root[data-theme="dark"] :is(.site-page, .site-page main, .site-page section, .site-page article, .site-page aside, .site-page footer) :is(p,small,span,time,li,dt,dd) {
  color: #c2b2a6 !important;
}
:root[data-theme="dark"] :is(.site-page) :is(.overline,.label,.eyebrow,.price,.read,.contact-links i,.store-category-heading>span,.checkout-heading>span,.careers-hero-copy>span,.careers-intro>span) {
  color: #dda95b !important;
}
:root[data-theme="dark"] :is(.site-page) :is(em,.hero-center h1,.branch-content h2,.hero-side,.scroll-cue) {
  color: #f1d1bd !important;
}
:root[data-theme="dark"] :is(.site-page) :is(.glass,.data-card,.feature,.cart-panel,.checkout-form,.checkout-section,.store-gate,.coffee-choice-dialog,.product-editorial,.signature-card,.about-copy,.login-panel) {
  background-color: #1b130e !important;
  color: #f8f1e8 !important;
  border-color: #4a3528 !important;
}
:root[data-theme="dark"] :is(.site-page) :is(input,select,textarea) {
  background: #261a13 !important;
  color: #f8f1e8 !important;
  border-color: #654a3a !important;
}

/* Admin, order, warehouse and employee panels are intentionally light-only. */
:root[data-theme="light"] body.admin-body,
:root[data-theme="light"] body.order-report-page,
:root[data-theme="light"] body.ware-page,
:root[data-theme="light"] body.ware-login-page,
:root[data-theme="light"] body.employee-auth,
:root[data-theme="light"] body.employee-dashboard {
  background: #f3f0eb !important;
  color: #17130f !important;
}
:root[data-theme="light"] body.admin-body :is(h1,h2,h3,h4,h5,h6,strong,b,a,label,button) {
  color: #17130f;
}
:root[data-theme="light"] body.admin-body :is(p,small,span,time,li) {
  color: #756d65;
}
:root[data-theme="light"] body.admin-body .admin-header :is(a,button,span) {
  color: #fff !important;
}
:root[data-theme="light"] body.admin-body .admin-header .button.ghost {
  color: #fff !important;
}
:root[data-theme="light"] body.order-report-page :is(.order-report-panel,.order-report-summary article) {
  background: #fff !important;
  color: #17130f !important;
  border-color: #d8d1c8 !important;
}

/* Shared navigation contrast: the icon SVGs are authored in black, so invert
   them only on dark surfaces. These rules apply to every page using .site-nav. */
:root[data-theme="dark"] .v2-nav.site-nav {
  background: rgba(23, 18, 15, .97) !important;
  color: #f8f1e8 !important;
  border-bottom-color: #4a3528 !important;
  box-shadow: 0 8px 28px rgba(0, 0, 0, .28);
}
:root[data-theme="dark"] .v2-nav.site-nav nav,
:root[data-theme="dark"] .v2-nav.site-nav nav a,
:root[data-theme="dark"] .site-nav-actions,
:root[data-theme="dark"] .site-cart,
:root[data-theme="dark"] .nav-reserve {
  color: #f8f1e8 !important;
}
:root[data-theme="dark"] .v2-nav.site-nav nav a:hover,
:root[data-theme="dark"] .v2-nav.site-nav nav a.active,
:root[data-theme="dark"] .site-nav-actions .nav-icon:hover {
  color: #f1d1bd !important;
}
:root[data-theme="dark"] .v2-nav.site-nav .nav-icon img {
  filter: invert(1) brightness(1.15) contrast(1.08) !important;
}
:root[data-theme="dark"] .v2-nav.site-nav .v2-logo,
:root[data-theme="dark"] .v2-nav.site-nav .v2-logo .brand-logo-frame {
  background: transparent !important;
}
:root[data-theme="dark"] .v2-nav.site-nav .v2-logo .brand-logo-frame img {
  filter: none !important;
}
:root[data-theme="dark"] .v2-nav.site-nav .language-switch {
  background: #261a13 !important;
  color: #f8f1e8 !important;
  border-color: #d9c9bd !important;
}
:root[data-theme="dark"] .v2-nav.site-nav .nav-reserve {
  border-bottom-color: #f1d1bd !important;
}
:root[data-theme="dark"] .v2-nav.site-nav .nav-menu-toggle {
  background: #261a13 !important;
  border: 1px solid #654a3a !important;
  border-radius: 9px;
}
:root[data-theme="dark"] .v2-nav.site-nav nav::after {
  background: #17100c;
}

@media (max-width: 900px) {
  :root[data-theme="dark"] .v2-nav.site-nav,
  :root[data-theme="dark"] .v2-nav.site-nav.scrolled {
    background: rgba(23, 18, 15, .98) !important;
    border-bottom-color: #4a3528 !important;
  }
  :root[data-theme="dark"] .v2-nav.site-nav nav {
    background: #17100c !important;
    border-bottom-color: #4a3528 !important;
  }
  :root[data-theme="dark"] .v2-nav.site-nav nav a {
    color: #f8f1e8 !important;
    border-bottom-color: #3d2d24 !important;
  }
}

:root[data-theme="dark"] :is(.employee-auth, .employee-dashboard, .ware-login-page, .ware-page) {
  background: var(--theme-bg) !important;
  color: var(--theme-ink) !important;
}

:root[data-theme="dark"] :is(.employee-auth main, .leave-card, .ware-login-card,
  .ware-category-grid article, .ware-category-grid details > div,
  #ware-category-dialog, .employee-dashboard > header) {
  background: var(--theme-surface) !important;
  color: var(--theme-ink) !important;
  border-color: var(--theme-line) !important;
}

:root[data-theme="dark"] :is(.employee-auth, .employee-dashboard, .ware-page, .ware-login-page) :is(p, small, .employee-intro p, .ware-heading p, .ware-login-card p, .ware-open > small) {
  color: var(--theme-muted) !important;
}

:root[data-theme="dark"] :is(.employee-auth input, .leave-fields input, .leave-fields select,
  .leave-fields textarea, .ware-login-card input, #ware-category-dialog input,
  .admin-search input, .item-dialog input, .item-dialog select, .item-dialog textarea) {
  background: var(--theme-surface-2) !important;
  color: var(--theme-ink) !important;
  border-color: #654a3a !important;
}

:root[data-theme="dark"] :is(.employee-auth button, .leave-submit, .ware-login-card button,
  .ware-add, .ware-page > header, .employee-dashboard > header button,
  .calendar-head button, .ware-back) {
  background: #f1d1bd !important;
  color: #17120f !important;
  border-color: #f1d1bd !important;
}

:root[data-theme="dark"] .ware-page > header {
  background: #17100c !important;
  color: var(--theme-ink) !important;
}

:root[data-theme="dark"] :is(.calendar-day, .leave-row, .ware-empty, .ware-items-empty) {
  background: #211710 !important;
  color: var(--theme-ink) !important;
  border-color: var(--theme-line) !important;
}

:root[data-theme="dark"] :is(.customer-auth-page, .customer-account-page) {
  background: var(--theme-bg) !important;
  color: var(--theme-ink) !important;
}

:root[data-theme="dark"] .customer-login-shell {
  background: linear-gradient(135deg, #120c08 55%, #2a1710) !important;
}

:root[data-theme="dark"] :is(.customer-login-card, .account-profile-card, .account-form, .account-orders, .account-subscriptions) {
  background: var(--theme-surface) !important;
  color: var(--theme-ink) !important;
  border-color: var(--theme-line) !important;
}

:root[data-theme="dark"] .customer-login-card input,
:root[data-theme="dark"] .account-form input,
:root[data-theme="dark"] .account-form select,
:root[data-theme="dark"] .account-form textarea {
  background: var(--theme-surface-2) !important;
  color: var(--theme-ink) !important;
  border-color: #654a3a !important;
}