/* JESSIE — Shared light and After-Hours Luxury theme */
:root {
  color-scheme: light;
  --jt-bg: #fffafa;
  --jt-surface: #ffffff;
  --jt-surface-soft: #fff5f7;
  --jt-text: #21171a;
  --jt-muted: #78696d;
  --jt-border: #eadde0;
  --jt-red: #a81735;
  --jt-deep: #640b20;
  --jt-shadow: 0 18px 48px rgba(55, 14, 27, .09);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --jt-bg: #080708;
  --jt-surface: #211018;
  --jt-surface-soft: #30131d;
  --jt-text: #ffffff;
  --jt-muted: #c5b8be;
  --jt-border: #58303b;
  --jt-red: #650d25;
  --jt-deep: #14070b;
  --jt-shadow: 0 18px 48px rgba(0, 0, 0, .24);
}

/* Shared theme toggle */
.jessie-theme-toggle {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-width: 42px;
  min-height: 42px;
  padding: 9px 12px;
  border: 1px solid var(--jt-border);
  border-radius: 999px;
  background: var(--jt-surface);
  color: var(--jt-text);
  font: inherit;
  line-height: 1;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition:
    background-color .2s ease,
    border-color .2s ease,
    color .2s ease,
    transform .2s ease;
}

.jessie-theme-toggle:hover {
  border-color: var(--jt-red);
}

.jessie-theme-toggle:active {
  transform: scale(.97);
}

.jessie-theme-toggle:focus-visible {
  outline: 2px solid var(--jt-red);
  outline-offset: 3px;
}

.jessie-theme-toggle .jessie-theme-icon {
  font-size: 19px;
}

.jessie-theme-toggle .jessie-theme-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .04em;
}

html[data-theme="dark"] body {
  background-color: var(--jt-bg);
  color: var(--jt-text);
}

html[data-theme="dark"] .siteHead,
html[data-theme="dark"] .shopCleanHead,
html[data-theme="dark"] .head,
html[data-theme="dark"] .jessieAdminHeader {
  background-color: rgba(33, 28, 31, .97) !important;
  color: var(--jt-text);
  border-color: var(--jt-border) !important;
}

html[data-theme="dark"] .siteHead a,
html[data-theme="dark"] .shopCleanHead a,
html[data-theme="dark"] .head a,
html[data-theme="dark"] .jessieAdminHeader a,
html[data-theme="dark"] .logo {
  color: var(--jt-text);
}

html[data-theme="dark"] .logo span,
html[data-theme="dark"] .eyebrow {
  color: var(--jt-red);
}

html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select {
  background-color: var(--jt-surface);
  color: var(--jt-text);
  border-color: var(--jt-border);
}

html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder {
  color: var(--jt-muted);
  opacity: 1;
}

html[data-theme="dark"] .box,
html[data-theme="dark"] .order,
html[data-theme="dark"] .auth-card,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .modal,
html[data-theme="dark"] .drawer,
html[data-theme="dark"] .cartDrawer,
html[data-theme="dark"] .product-card,
html[data-theme="dark"] .productCard {
  background-color: var(--jt-surface);
  color: var(--jt-text);
  border-color: var(--jt-border);
  box-shadow: var(--jt-shadow);
}

html[data-theme="dark"] .muted,
html[data-theme="dark"] .shopCleanHead small {
  color: var(--jt-muted);
}

html[data-theme="dark"] .jessie-theme-toggle {
  background: var(--jt-surface-soft);
  border-color: var(--jt-border);
  color: var(--jt-text);
}

@media (prefers-reduced-motion: reduce) {
  .jessie-theme-toggle {
    transition: none;
  }
}
/* JESSIE DARK MODE — Existing page colour tokens */
html[data-theme="dark"] {
  /* Shared storefront tokens */
  --red: #650d25;
  --deep: #650d25;
  --rose: #381521;
  --soft: #30131d;
  --ink: #ffffff;
  --muted: #c5b8be;
  --line: #58303b;
  --white: #211018;
  --paper: #211018;
  --bg: #080708;
  --shadow: 0 18px 48px rgba(0, 0, 0, .24);

  /* JESSIE admin dashboard tokens */
  --j-red: #650d25;
  --j-red-dark: #8b1835;
  --j-red-soft: #381521;
  --j-ink: #ffffff;
  --j-muted: #c5b8be;
  --j-line: #58303b;
  --j-bg: #080708;
  --j-white: #211018;
}

/* Shared page surfaces and text */
html[data-theme="dark"] body {
  background-color: var(--jt-bg);
  color: var(--jt-text);
}

html[data-theme="dark"] .box,
html[data-theme="dark"] .order,
html[data-theme="dark"] .auth-card,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .modal,
html[data-theme="dark"] .drawer,
html[data-theme="dark"] .cartDrawer,
html[data-theme="dark"] .product-card,
html[data-theme="dark"] .productCard {
  background-color: var(--jt-surface);
  color: var(--jt-text);
  border-color: var(--jt-border);
}

html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select {
  background-color: var(--jt-surface);
  color: var(--jt-text);
  border-color: var(--jt-border);
}

html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder {
  color: var(--jt-muted);
  opacity: 1;
}
/* JESSIE THEME HEADER PLACEMENT FIX */
html[data-theme="dark"] .jessieAdminHeader .jessie-theme-toggle {
  justify-self: end;
}

.jessieAdminHeader {
  grid-template-columns: minmax(0, 1fr) auto auto;
}

.jessieAdminHeader .jessie-theme-toggle {
  grid-column: 2;
  grid-row: 1;
  justify-self: end;
  margin-right: 0;
}

.jessieAdminHeader .jessieMenuButton {
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
}

@media (max-width: 760px) {
  .head > .jessie-theme-toggle {
    margin-left: auto;
  }

  .jessie-theme-toggle .jessie-theme-label {
    display: none;
  }

  .jessie-theme-toggle {
    min-width: 40px;
    min-height: 40px;
    padding: 8px;
  }
}

/* JESSIE — cohesive dark theme refinement */
html[data-theme="dark"] {
  --jt-bg: #080708;
  --jt-surface: #211018;
  --jt-surface-soft: #30131d;
  --jt-text: #ffffff;
  --jt-muted: #c5b8be;
  --jt-border: #58303b;
  --jt-red: #650d25;
  --jt-deep: #14070b;

  --red: #650d25;
  --deep: #8b1835;
  --rose: #381521;
  --soft: #30131d;
  --ink: #ffffff;
  --muted: #c5b8be;
  --line: #58303b;
  --white: #211018;
  --paper: #211018;
  --bg: #080708;
  --shadow: 0 16px 40px rgba(0, 0, 0, 0.28);

  --j-red: #650d25;
  --j-red-dark: #8b1835;
  --j-red-soft: #381521;
  --j-ink: #ffffff;
  --j-muted: #c5b8be;
  --j-line: #58303b;
  --j-bg: #080708;
  --j-white: #211018;
}

html[data-theme="dark"] body {
  background: var(--jt-bg);
  color: var(--jt-text);
}

html[data-theme="dark"] :is(
  .siteHead,
  .shopCleanHead,
  .head,
  .jessieAdminHeader,
  .box,
  .order,
  .auth-card,
  .panel,
  .modal,
  .drawer,
  .cartDrawer,
  .product-card,
  .productCard
) {
  background-color: var(--jt-surface);
  color: var(--jt-text);
  border-color: var(--jt-border);
  box-shadow: var(--jt-shadow);
}

html[data-theme="dark"] :is(
  h1, h2, h3, h4, p, label, li, td, th,
  .title, .product-title, .productTitle,
  .price, .product-price, .productPrice
) {
  color: var(--jt-text);
}

html[data-theme="dark"] :is(
  small, .muted, .description, .subtitle,
  .product-description, .productDescription
) {
  color: var(--jt-muted);
}

html[data-theme="dark"] :is(
  input, textarea, select
) {
  background-color: var(--jt-surface-soft);
  color: var(--jt-text);
  border-color: var(--jt-border);
}

html[data-theme="dark"] :is(input, textarea, select)::placeholder {
  color: var(--jt-muted);
  opacity: 1;
}

html[data-theme="dark"] a {
  color: #8b1835;
}

html[data-theme="dark"] :is(
  button, .btn, .button, [type="button"], [type="submit"]
) {
  border-color: var(--jt-border);
}

html[data-theme="dark"] :is(
  .siteHead a, .shopCleanHead a, .head a,
  .jessieAdminHeader a
) {
  color: var(--jt-text);
}

html[data-theme="dark"] :is(
  .jessie-theme-toggle, .jessie-theme-toggle:hover
) {
  background: var(--jt-surface-soft);
  color: var(--jt-text);
  border-color: var(--jt-border);
}

html[data-theme="dark"] :is(
  .product-card, .productCard, .box, .panel, .order
):hover {
  border-color: #754052;
}


/* JESSIE DARK LUXURY — ALL PAGE SURFACES */
html[data-theme="dark"] {
  --jt-bg: #080708;
  --jt-surface: #211018;
  --jt-surface-soft: #30131d;
  --jt-text: #ffffff;
  --jt-muted: #c5b8be;
  --jt-border: #58303b;
  --jt-red: #650d25;
  --jt-deep: #14070b;
  --jt-shadow: 0 16px 40px rgba(0,0,0,.42);

  --red: #650d25;
  --deep: #14070b;
  --rose: #381521;
  --soft: #30131d;
  --ink: #ffffff;
  --muted: #c5b8be;
  --line: #58303b;
  --white: #211018;
  --paper: #211018;
  --bg: #080708;
  --shadow: 0 16px 40px rgba(0,0,0,.42);

  --j-red: #650d25;
  --j-red-dark: #8b1835;
  --j-red-soft: #381521;
  --j-ink: #ffffff;
  --j-muted: #c5b8be;
  --j-line: #58303b;
  --j-bg: #080708;
  --j-white: #211018;
}

html[data-theme="dark"] body {
  background: #080708 !important;
  color: #ffffff;
}

html[data-theme="dark"] :is(
  main, .main, .page, .page-content, .pageContent,
  .container, .content, .content-wrap, .dashboard,
  .dashboard-content, .customer-dashboard, .rider-dashboard,
  .admin-dashboard, .shopMain, .shopPage, .checkoutPage,
  .accountPage, .wishlistPage, .productPage
) {
  background-color: #080708;
  color: #ffffff;
}

html[data-theme="dark"] :is(
  .box, .order, .auth-card, .panel, .modal, .drawer,
  .cartDrawer, .product-card, .productCard, .order-card,
  .orderCard, .stat-card, .statCard, .dashboard-card,
  .dashboardCard, .admin-card, .adminCard, .customer-card,
  .customerCard, .rider-card, .riderCard, .form-card,
  .formCard, .table-wrap, .tableWrap, .empty-state,
  .emptyState, .filterPanel, .shopToolbar
) {
  background-color: #211018;
  color: #ffffff;
  border-color: #58303b;
  box-shadow: 0 12px 32px rgba(0,0,0,.38);
}

html[data-theme="dark"] :is(
  h1, h2, h3, h4, h5, label, legend, th, td,
  .title, .product-title, .productTitle, .price,
  .product-price, .productPrice, .stat-value,
  .statValue, .order-number, .orderNumber
) {
  color: #ffffff;
}

html[data-theme="dark"] :is(
  p, small, .muted, .subtitle, .description,
  .product-description, .productDescription,
  .helper-text, .help-text, .form-hint, .timestamp
) {
  color: #c5b8be;
}

html[data-theme="dark"] :is(
  input, textarea, select, option
) {
  background-color: #14070b;
  color: #ffffff;
  border-color: #58303b;
}

html[data-theme="dark"] :is(
  input, textarea, select
)::placeholder {
  color: #c5b8be;
  opacity: 1;
}

html[data-theme="dark"] :is(
  button, .btn, .button, a.button,
  input[type="button"], input[type="submit"],
  input[type="reset"]
) {
  background-color: #14070b;
  color: #ffffff;
  border-color: #650d25;
}

html[data-theme="dark"] :is(
  button, .btn, .button, a.button,
  input[type="button"], input[type="submit"],
  input[type="reset"]
):hover {
  background-color: #30131d;
  border-color: #8b1835;
}

html[data-theme="dark"] a {
  color: #d8a8b7;
}

html[data-theme="dark"] :is(
  .siteHead, .shopCleanHead, .head, .jessieAdminHeader
) {
  background-color: #14070b;
  color: #ffffff;
  border-color: #58303b;
}

html[data-theme="dark"] :is(
  .siteHead a, .shopCleanHead a, .head a,
  .jessieAdminHeader a, .logo
) {
  color: #ffffff;
}

html[data-theme="dark"] :is(
  table, thead, tbody, tr
) {
  background-color: #211018;
  color: #ffffff;
  border-color: #58303b;
}

html[data-theme="dark"] :is(
  .badge, .status, .status-badge, .order-status
) {
  border-color: #754052;
}

/* JESSIE SITE-WIDE DARK CONTRAST RULES */


/* JESSIE SITE-WIDE DARK CONTRAST RULES */
html[data-theme="dark"] {
  color-scheme: dark;
}
html[data-theme="dark"] body {
  background: #080708 !important;
  color: #ffffff !important;
}
html[data-theme="dark"] body :is(
  h1,h2,h3,h4,h5,h6,p,li,label,legend,th,td,dt,dd,
  strong,b,small,summary,figcaption,caption,blockquote
) {
  color: #ffffff !important;
}
html[data-theme="dark"] body :is(
  main,section,article,.page,.page-content,.content,
  .container,.main-content,.dashboard,.shopMain,.shopPage
) {
  color: #ffffff;
}
html[data-theme="dark"] body :is(
  .card,.panel,.product-card,.productCard,.order-card,
  .stat-card,.dashboard-card,.modal-content,.dropdown-menu,
  .filterPanel,.filters,.shopToolbar
) {
  background-color: #211018 !important;
  color: #ffffff !important;
  border-color: #58303b !important;
}
html[data-theme="dark"] body :is(
  header,nav,footer,.site-header,.site-footer,
  .navbar,.dropdown,.menu-panel
) {
  background-color: #080708;
  color: #ffffff;
}
html[data-theme="dark"] body :is(
  input,textarea,select
) {
  background-color: #14070b !important;
  color: #ffffff !important;
  border-color: #58303b !important;
}
html[data-theme="dark"] body input::placeholder,
html[data-theme="dark"] body textarea::placeholder {
  color: #c5b8be !important;
  opacity: 1;
}
html[data-theme="dark"] body :is(
  button,.btn,a.btn,input[type="submit"],input[type="button"]
) {
  background-color: #14070b;
  color: #ffffff;
  border-color: #650d25;
}
html[data-theme="dark"] body :is(
  a,.back-home,.backHome
) {
  color: #ffffff;
}
html[data-theme="dark"] body :is(
  .announcement,.announcement-bar,.announcementBar,
  .ticker,.marquee,.moving-text,.promo-bar,marquee
) {
  background-color: #c8102e !important;
  color: #ffffff !important;
}
html[data-theme="dark"] body :is(
  .announcement,.announcement-bar,.announcementBar,
  .ticker,.marquee,.moving-text,.promo-bar,marquee
) * {
  color: #ffffff !important;
}
html[data-theme="dark"] body :is(
  .muted,.secondary-text,.description,.helper-text,
  .subtitle,.text-muted
) {
  color: #c5b8be !important;
}
html[data-theme="dark"] body table,
html[data-theme="dark"] body thead,
html[data-theme="dark"] body tbody,
html[data-theme="dark"] body tr {
  background-color: #080708;
  color: #ffffff;
}
html[data-theme="dark"] body td,
html[data-theme="dark"] body th {
  border-color: #58303b;
}


/* JESSIE MENU CONTRAST: white surface, red controls */
html[data-theme="dark"] body #mobileNav .modalCard,
html[data-theme="dark"] body #mobileNav .mobileMenuCard {
  background-color: #ffffff !important;
  color: #c8102e !important;
}
html[data-theme="dark"] body #mobileNav .modalHead,
html[data-theme="dark"] body #mobileNav .mobileLinks {
  background-color: #ffffff !important;
  color: #c8102e !important;
}
html[data-theme="dark"] body #mobileNav .mobileLinks a,
html[data-theme="dark"] body #mobileNav .modalClose,
html[data-theme="dark"] body #mobileNav .modalHead .logo {
  color: #c8102e !important;
}
html[data-theme="dark"] body #mobileNav .mobileLinks a {
  border-bottom-color: #f0c3cc !important;
}
html[data-theme="dark"] body #mobileNav .modalClose {
  background-color: #ffffff !important;
  border-color: #c8102e !important;
}
