/* Theme mode tokens: dark default, light optional */

:root,
html[data-theme="dark"] {
  --dd-font-heading: "Cormorant Garamond", "Playfair Display", Georgia, serif;
  --dd-font-body: "Montserrat", system-ui, sans-serif;
  --dd-font-script: "Allura", "Brittany Signature", cursive;
  --dd-theme-bg: #141313;
  --dd-theme-charcoal: #262626;
  --dd-theme-obsidian: #050505;
  --dd-theme-surface-variant: #353434;
  --dd-theme-outline: #444748;
  --dd-theme-muted: #c4c7c7;
  --dd-theme-secondary: #e9c176;
  --dd-theme-ink: #f4f4f4;
  --dd-theme-bronze: #8c6d3e;
}

/* Desktop dark: charcoal a drop lighter vs near-black page bg (mobile unchanged) */
@media (min-width: 960px) {
  html[data-theme="dark"],
  html:not([data-theme="light"]) {
    --dd-theme-charcoal: #2f2f2f;
    --dd-theme-surface-variant: #3c3b3b;
  }

  html[data-theme="dark"] .dd-home,
  html:not([data-theme="light"]) .dd-home {
    --dd-charcoal: #2f2f2f;
    --dd-surface-variant: #3c3b3b;
  }
}

html[data-theme="light"] {
  --dd-font-heading: "Cormorant Garamond", "Playfair Display", Georgia, serif;
  --dd-font-body: "Montserrat", system-ui, sans-serif;
  --dd-font-script: "Allura", "Brittany Signature", cursive;
  --dd-theme-bg: #fbf9f4;
  --dd-theme-charcoal: #fbf9f4;
  --dd-theme-obsidian: #ece8e1;
  --dd-theme-surface-variant: #d8d2c9;
  --dd-theme-outline: #c8bfb2;
  --dd-theme-muted: #695f54;
  --dd-theme-secondary: #8c6d3e;
  --dd-theme-ink: #1c1916;
  --dd-theme-bronze: #a07d46;
}

body,
button,
input,
select,
textarea {
  font-family: var(--dd-font-body, "Montserrat", system-ui, sans-serif);
}

h1, h2, h3, h4, h5, h6,
.wd-entities-title,
.wd-entities-title a,
.title,
.product_title {
  font-family: var(--dd-font-heading, "Cormorant Garamond", "Playfair Display", Georgia, serif);
}

/* Script faces — available in the editor; not assigned to headings yet */
.has-allura-font-family,
.dd-script {
  font-family: "Allura", cursive;
}

.has-brittany-signature-font-family {
  font-family: "Brittany Signature", "Allura", cursive;
}

/* WoodMart .wd-label uses --color-gray-800 (white under dark-panel schemes) */
html[data-theme="light"] .wd-label {
  color: var(--dd-theme-ink) !important;
  font-weight: 600;
}

html[data-theme="light"] body,
html[data-theme="light"] .website-wrapper,
html[data-theme="light"] .main-page-wrapper {
  background-color: var(--dd-theme-bg);
}

/* WoodMart page option paints page/header dark — force cream in light mode */
html[data-theme="light"] .woodmart-archive-shop:not(.single-product) :is(.wd-page-content, .whb-header),
html[data-theme="light"] .single-product :is(.wd-page-content, .whb-header),
html[data-theme="light"] .woocommerce-account :is(.wd-page-content, .whb-header),
html[data-theme="light"] .page-id-2142 :is(.wd-page-content, .whb-header),
html[data-theme="light"].page :is(.wd-page-content, .whb-header),
html[data-theme="light"] .whb-header,
html[data-theme="light"] .whb-header .whb-row:not(.whb-top-bar),
html[data-theme="light"] .whb-main-header,
html[data-theme="light"] .whb-general-header,
html[data-theme="light"] .whb-sticky-header,
html[data-theme="light"] .whb-clone {
  background-color: var(--dd-theme-bg) !important;
  background-image: none !important;
}

/* Trust strip stays charcoal in light mode for contrast */
html[data-theme="light"] .whb-header .whb-top-bar,
html[data-theme="light"] .whb-header .whb-top-bar.whb-row {
  background-color: #262626 !important;
  background-image: none !important;
}

/* Light header chrome — Lumina Scholastica */
html[data-theme="light"] .whb-header {
  border-bottom: 1px solid color-mix(in srgb, #c8bfb2 55%, transparent);
}

html[data-theme="light"] .whb-header .wd-nav > li > a,
html[data-theme="light"] .whb-header .wd-nav.wd-nav-main > li > a,
html[data-theme="light"] .whb-header .menu > li > a {
  color: #1c1916 !important;
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html[data-theme="light"] .whb-header .wd-nav > li:hover > a,
html[data-theme="light"] .whb-header .wd-nav > li.current-menu-item > a,
html[data-theme="light"] .whb-header .wd-nav > li.current-menu-ancestor > a,
html[data-theme="light"] .whb-header .wd-nav > li.wd-has-current > a,
html[data-theme="light"] .whb-header .menu > li:hover > a,
html[data-theme="light"] .whb-header .menu > li.current-menu-item > a {
  color: #8c6d3e !important;
  background: transparent !important;
}

html[data-theme="light"] .whb-header .wd-nav-mobile > li > a,
html[data-theme="light"] .whb-header .wd-header-mobile-nav .wd-tools-icon,
html[data-theme="light"] .whb-header .wd-burger-icon,
html[data-theme="light"] .whb-header .wd-nav-opener {
  color: #1c1916 !important;
}

/*
 * MOBILE RULE: no animations / transitions site-wide.
 * WoodMart hides .wd-animation and .wd-product at opacity:0 until JS adds
 * .wd-in / reveal classes — that often never fires on mobile → blank page.
 */
@media (max-width: 1024px) {
  *,
  *::before,
  *::after {
    animation: none !important;
    animation-duration: 0s !important;
    animation-delay: 0s !important;
    transition: none !important;
    transition-duration: 0s !important;
    transition-delay: 0s !important;
    scroll-behavior: auto !important;
  }

  .wd-animation,
  .wd-animation.wd-animation-ready,
  .wd-animation.wd-animation-ready:not(.wd-in),
  .wd-animation.wd-in,
  [class*="wd-animation-"],
  .wd-product,
  .wd-products .wd-product,
  .wd-carousel-item,
  .wd-lazy-fade,
  .wd-show-on-scroll,
  .wd-animated,
  .wd-animated-element,
  .elementor-invisible {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    translate: none !important;
    scale: 1 !important;
    filter: none !important;
    clip-path: none !important;
    --wd-transform-translateX: 0 !important;
    --wd-transform-translateY: 0 !important;
    --wd-transform-scaleX: 1 !important;
    --wd-transform-scaleY: 1 !important;
    --wd-transform-rotateX: 0deg !important;
    --wd-transform-rotateY: 0deg !important;
    --wd-transform-perspective: none !important;
  }

  /* Homepage hero slider must keep WoodMart carousel motion on mobile */
  .dd-home .dd-hero,
  .dd-home .dd-hero *,
  .dd-home .dd-hero *::before,
  .dd-home .dd-hero *::after {
    animation: unset !important;
    animation-duration: unset !important;
    animation-delay: unset !important;
    transition: unset !important;
    transition-duration: unset !important;
    transition-delay: unset !important;
  }

  .dd-home .dd-hero .wd-carousel-item,
  .dd-home .dd-hero .wd-slide,
  .dd-home .dd-hero .wd-carousel-wrap,
  .dd-home .dd-hero .wd-carousel,
  .dd-home .dd-hero .wd-carousel-inner {
    transform: unset !important;
    translate: unset !important;
    scale: unset !important;
    filter: unset !important;
    clip-path: unset !important;
    --wd-transform-translateX: unset !important;
    --wd-transform-translateY: unset !important;
    --wd-transform-scaleX: unset !important;
    --wd-transform-scaleY: unset !important;
  }

  /* Homepage mobile banners (shade-of-dark + bestsellers) */
  .dd-home .dd-mobile-banner,
  .dd-home .dd-mobile-banner *,
  .dd-home .dd-mobile-banner *::before,
  .dd-home .dd-mobile-banner *::after,
  .page-id-10 .dd-mobile-banner,
  .page-id-10 .dd-mobile-banner *,
  .page-id-10 .dd-mobile-banner *::before,
  .page-id-10 .dd-mobile-banner *::after {
    animation: unset !important;
    animation-duration: unset !important;
    animation-delay: unset !important;
    transition: unset !important;
    transition-duration: unset !important;
    transition-delay: unset !important;
  }

  .dd-home .dd-mobile-banner__track,
  .page-id-10 .dd-mobile-banner__track {
    transition: transform 0.45s cubic-bezier(0.25, 0.1, 0.25, 1) !important;
  }
}

/* Injected mount when mobile header has no tools column */
.dd-theme-toggle-slot {
  display: inline-flex !important;
  align-items: center;
  justify-content: flex-end;
  flex: 0 0 auto;
  margin: 0;
  padding-inline: 6px;
}

/* Override local page-scoped --dd-* vars so existing CSS can switch modes */
html[data-theme="light"] .dd-home,
html[data-theme="light"] .dd-about,
html[data-theme="light"] .dd-contact,
html[data-theme="light"] .dd-trust,
html[data-theme="light"] .dd-account,
html[data-theme="light"] .dd-shop,
html[data-theme="light"] .dd-cart,
html[data-theme="light"] .dd-checkout,
html[data-theme="light"] .dd-thankyou,
html[data-theme="light"] .woocommerce-shop,
html[data-theme="light"] .tax-product_cat,
html[data-theme="light"] .tax-product_tag,
html[data-theme="light"] .woocommerce-cart,
html[data-theme="light"] .woocommerce-checkout,
html[data-theme="light"] .woocommerce-order-received,
html[data-theme="light"] .woocommerce-order-pay,
html[data-theme="light"] .woocommerce-account,
html[data-theme="light"] .single-product,
html[data-theme="light"] .page-id-2142 {
  --dd-bg: var(--dd-theme-bg);
  --dd-charcoal: var(--dd-theme-charcoal);
  --dd-obsidian: var(--dd-theme-obsidian);
  --dd-surface-variant: var(--dd-theme-surface-variant);
  --dd-outline: var(--dd-theme-outline);
  --dd-muted: var(--dd-theme-muted);
  --dd-secondary: var(--dd-theme-secondary);
  --dd-ink: var(--dd-theme-ink);
  --dd-bronze: var(--dd-theme-bronze);
  --dd-on-surface: var(--dd-theme-ink);
  --dd-card-bg: #f5f3ee;
}

/* Header tools toggle — sun / moon icon */
.dd-theme-toggle-wrap {
  display: inline-flex !important;
  align-items: center;
  visibility: visible !important;
  opacity: 1 !important;
  margin-inline-end: 0.55rem;
  margin-inline-start: 0;
  flex: 0 0 auto;
}

.dd-theme-toggle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  min-height: 32px;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #f4f4f4 !important;
  cursor: pointer;
  box-shadow: none !important;
  font-size: 0 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  transition: color 0.2s ease, transform 0.2s ease;
}

.dd-theme-toggle:hover {
  color: #e9c176 !important;
  background: transparent !important;
  transform: translateY(-1px);
}

.dd-theme-toggle__icon {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  color: inherit;
}

.dd-theme-toggle__icon svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
  display: none;
}

/* Dark mode → show sun (switch to light). Light mode → show moon (switch to dark). */
.dd-theme-toggle[data-mode="dark"] .dd-theme-toggle__sun,
.dd-theme-toggle[data-mode="light"] .dd-theme-toggle__moon {
  display: block;
}

html[data-theme="light"] .dd-theme-toggle {
  color: #1c1916 !important;
}

html[data-theme="light"] .dd-theme-toggle:hover {
  color: #8c6d3e !important;
  background: transparent !important;
}

/* —— Cart flyout (global header chrome) —— */
.cart-widget-side {
  --dd-flyout-bg: #141313;
  --dd-flyout-ink: #f4f4f4;
  --dd-flyout-muted: #c4c7c7;
  --dd-flyout-border: #353434;
  background: var(--dd-flyout-bg) !important;
  color: var(--dd-flyout-ink) !important;
}

.cart-widget-side .wd-heading,
.cart-widget-side .wd-heading .title,
.cart-widget-side .close-side-widget,
.cart-widget-side .close-side-widget a,
.cart-widget-side .close-side-widget .wd-action-text,
.cart-widget-side .woocommerce-mini-cart-item,
.cart-widget-side .woocommerce-mini-cart-item a,
.cart-widget-side .woocommerce-mini-cart__total,
.cart-widget-side .woocommerce-mini-cart__total strong,
.cart-widget-side .cart-item-link,
.cart-widget-side .product-title,
.cart-widget-side .quantity {
  color: var(--dd-flyout-ink) !important;
}

.cart-widget-side .amount,
.cart-widget-side .woocommerce-Price-amount {
  color: #e9c176 !important;
}

.cart-widget-side .woocommerce-mini-cart__total,
.cart-widget-side .woocommerce-mini-cart__buttons {
  border-color: var(--dd-flyout-border) !important;
}

.cart-widget-side .woocommerce-mini-cart__buttons .button,
.cart-widget-side .woocommerce-mini-cart__buttons a.button {
  border-radius: 0.25rem !important;
  font-family: "Montserrat", system-ui, sans-serif !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  box-shadow: none !important;
}

/* View cart — ghost */
.cart-widget-side .woocommerce-mini-cart__buttons .button:not(.checkout),
.cart-widget-side .woocommerce-mini-cart__buttons a.button:not(.checkout),
.cart-widget-side .woocommerce-mini-cart__buttons .wc-forward:not(.checkout) {
  background: transparent !important;
  color: var(--dd-flyout-ink) !important;
  border: 1px solid var(--dd-flyout-ink) !important;
}

.cart-widget-side .woocommerce-mini-cart__buttons .button:not(.checkout):hover,
.cart-widget-side .woocommerce-mini-cart__buttons a.button:not(.checkout):hover,
.cart-widget-side .woocommerce-mini-cart__buttons .wc-forward:not(.checkout):hover {
  background: #1c1916 !important;
  color: #f4f4f4 !important;
  border-color: #f4f4f4 !important;
}

/* Checkout — gold (never WoodMart green) */
.cart-widget-side .woocommerce-mini-cart__buttons .checkout,
.cart-widget-side .woocommerce-mini-cart__buttons a.checkout,
.cart-widget-side .woocommerce-mini-cart__buttons .button.checkout {
  background: #8c6d3e !important;
  color: #050505 !important;
  border: 1px solid #8c6d3e !important;
}

.cart-widget-side .woocommerce-mini-cart__buttons .checkout:hover,
.cart-widget-side .woocommerce-mini-cart__buttons a.checkout:hover,
.cart-widget-side .woocommerce-mini-cart__buttons .button.checkout:hover {
  background: #e9c176 !important;
  border-color: #e9c176 !important;
  color: #050505 !important;
}

/* Free-shipping progress bar in flyout */
.cart-widget-side .wd-free-progress-bar {
  color: var(--dd-flyout-muted) !important;
}

.cart-widget-side .wd-free-progress-bar .progress-msg {
  color: var(--dd-flyout-ink) !important;
}

.cart-widget-side .wd-free-progress-bar .progress-area {
  background: rgba(255, 255, 255, 0.08) !important;
  border-radius: 0.25rem;
  overflow: hidden;
}

.cart-widget-side .wd-free-progress-bar .progress-bar {
  background-color: #8c6d3e !important;
  background-image: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.2) 25%,
    transparent 25%,
    transparent 50%,
    rgba(255, 255, 255, 0.2) 50%,
    rgba(255, 255, 255, 0.2) 75%,
    transparent 75%,
    transparent
  ) !important;
  background-size: 15px 15px !important;
}

/* Qualified (≥$49): whole bar solid gold (track + fill) */
.cart-widget-side .wd-free-progress-bar:has(.progress-bar[style*="width: 100%"]) .progress-area,
.cart-widget-side .wd-free-progress-bar:has(.progress-bar[style*="width:100%"]) .progress-area {
  background: #e9c176 !important;
}

.cart-widget-side .wd-free-progress-bar .progress-bar[style*="width: 100%"],
.cart-widget-side .wd-free-progress-bar .progress-bar[style*="width:100%"] {
  background-image: none !important;
  background-color: #e9c176 !important;
}

.cart-widget-side .wd-empty-mini-cart .btn,
.cart-widget-side .wd-empty-mini-cart .button,
.cart-widget-side .return-to-shop .button {
  background: transparent !important;
  color: var(--dd-flyout-ink) !important;
  border: 1px solid var(--dd-flyout-ink) !important;
  border-radius: 0.25rem !important;
  box-shadow: none !important;
}

.cart-widget-side .wd-empty-mini-cart .btn:hover,
.cart-widget-side .wd-empty-mini-cart .button:hover,
.cart-widget-side .return-to-shop .button:hover {
  background: #1c1916 !important;
  color: #f4f4f4 !important;
  border-color: #f4f4f4 !important;
}

html[data-theme="light"] .cart-widget-side {
  --dd-flyout-bg: #fbf9f4;
  --dd-flyout-ink: #1c1916;
  --dd-flyout-muted: #695f54;
  --dd-flyout-border: #d8d2c9;
  background: #fbf9f4 !important;
  color: #1c1916 !important;
}

/* Neutralize WoodMart dark-panel scheme so cream flyout keeps readable hover */
html[data-theme="light"] .cart-widget-side.color-scheme-light,
html[data-theme="light"] .cart-widget-side[class*="color-scheme-light"] {
  --color-white: #fff;
  --color-gray-300: #695f54;
  --color-gray-800: #1c1916;
  --color-gray-900: #1c1916;
  --bgcolor-white: #fbf9f4;
  --bgcolor-white-rgb: 251, 249, 244;
  --bgcolor-black-rgb: 28, 25, 22;
  --color-black-rgb: 28, 25, 22;
  --wd-text-color: #1c1916;
  --wd-title-color: #1c1916;
  --wd-entities-title-color: #1c1916;
  --wd-entities-title-color-hover: #8c6d3e;
  --wd-link-color: #1c1916;
  --wd-link-color-hover: #8c6d3e;
  --wd-main-bgcolor: #fbf9f4;
  background: #fbf9f4 !important;
  color: #1c1916 !important;
}

html[data-theme="light"] .cart-widget-side.color-scheme-light,
html[data-theme="light"] .cart-widget-side .wd-heading {
  background: #fbf9f4 !important;
  color: #1c1916 !important;
}

html[data-theme="light"] .cart-widget-side .amount,
html[data-theme="light"] .cart-widget-side .woocommerce-Price-amount {
  color: #8c6d3e !important;
}

html[data-theme="light"] .cart-widget-side .cart-info .wd-entities-title,
html[data-theme="light"] .cart-widget-side .cart-info .wd-entities-title a,
html[data-theme="light"] .cart-widget-side .woocommerce-mini-cart-item a,
html[data-theme="light"] .cart-widget-side .product-title,
html[data-theme="light"] .cart-widget-side .quantity,
html[data-theme="light"] .cart-widget-side .cart-info span.quantity {
  color: #1c1916 !important;
}

html[data-theme="light"] .cart-widget-side .woocommerce-mini-cart > li:hover .cart-info .wd-entities-title,
html[data-theme="light"] .cart-widget-side .woocommerce-mini-cart > li:hover .cart-info .wd-entities-title a,
html[data-theme="light"] .cart-widget-side .woocommerce-mini-cart-item:hover .cart-info .wd-entities-title,
html[data-theme="light"] .cart-widget-side .woocommerce-mini-cart-item:hover .cart-info .wd-entities-title a {
  color: #8c6d3e !important;
}

html[data-theme="light"] .cart-widget-side .woocommerce-mini-cart__buttons .button:not(.checkout):hover,
html[data-theme="light"] .cart-widget-side .woocommerce-mini-cart__buttons a.button:not(.checkout):hover,
html[data-theme="light"] .cart-widget-side .woocommerce-mini-cart__buttons .wc-forward:not(.checkout):hover,
html[data-theme="light"] .cart-widget-side .wd-empty-mini-cart .btn:hover,
html[data-theme="light"] .cart-widget-side .wd-empty-mini-cart .button:hover,
html[data-theme="light"] .cart-widget-side .return-to-shop .button:hover {
  background: #1c1916 !important;
  color: #fbf9f4 !important;
  border-color: #1c1916 !important;
}

@media (max-width: 1024px) {
  .dd-theme-toggle-wrap {
    margin-inline-start: 0.35rem;
  }
}
