/**
 * SvichkaVisk v2 — global design tokens & Betheme/Woo overrides.
 * Tokens: design.md §2–§6. Load after mfn-dynamic (priority 101).
 */

/* ==========================================================================
   Design tokens
   ========================================================================== */

:root {
  --sv2-primary: #e2a52e;
  --sv2-primary-hover: #bf7621;
  --sv2-primary-soft: #f4bd4f;
  --sv2-on-primary: #23180f;

  --sv2-ink: #23180f;
  --sv2-text: #2b2117;
  --sv2-text-muted: rgba(43, 33, 23, 0.68);
  --sv2-text-subtle: #6b645c;

  --sv2-bg: #ffffff;
  --sv2-bg-page: #fff8ec;
  --sv2-bg-warm: #f7efe1;
  --sv2-bg-soft: #fffaf1;
  --sv2-card: #ffffff;

  --sv2-border: rgba(116, 73, 25, 0.16);
  --sv2-border-strong: rgba(108, 66, 27, 0.22);
  --sv2-input-border: #e6b482;
  --sv2-input-bg: #f4eddb;
  --sv2-input-bg-focus: #faf7ef;

  --sv2-brown: #6c421b;
  --sv2-accent: #f2654a;
  --sv2-accent-hover: #f28772;
  --sv2-green: #4f7e38;
  --sv2-green-soft: #75973a;

  --sv2-header-bg: #f9f2e4;
  --sv2-footer-bg: #f3d8bb;
  --sv2-action-bar: #6c421b;

  --sv2-shadow-sm: 0 10px 26px rgba(43, 33, 23, 0.06);
  --sv2-shadow-md: 0 18px 48px rgba(43, 33, 23, 0.11);
  --sv2-shadow-lg: 0 26px 70px rgba(43, 33, 23, 0.18);
  --sv2-shadow-primary: 0 14px 30px rgba(226, 165, 46, 0.28);

  --sv2-radius-pill: 999px;
  --sv2-radius-card: 18px;
  --sv2-radius-card-lg: 26px;
  --sv2-radius-input: 12px;

  --sv2-radius-pill-header: 50px;
  --sv2-pill-header-max: 1180px;
  --sv2-pill-header-gutter: 16px;
  --sv2-pill-header-top: 16px;
  --sv2-header-bar-h-mobile: 56px;
  --sv2-header-bar-h-desktop: 51px;
  --sv2-header-gap-below: 16px;
  --sv2-hero-header-gap: 28px;
  --sv2-admin-bar-top-desktop: 32px;
  --sv2-admin-bar-top-mobile: 46px;
  --sv2-border-gold: rgba(212, 175, 55, 0.38);
  --sv2-shadow-pill: 0 16px 48px rgba(43, 33, 23, 0.1), 0 6px 18px rgba(43, 33, 23, 0.06);
  --sv2-shadow-pill-sticky: 0 14px 40px rgba(43, 33, 23, 0.14), 0 4px 14px rgba(43, 33, 23, 0.08);

  --sv2-space-section: clamp(3.625rem, 8vw, 5.375rem);
  --sv2-gutter: clamp(16px, 4vw, 20px);
}

/* Betheme button / Woo CSS variables (override Theme Options inline) */
body {
  --mfn-button-theme-color: var(--sv2-on-primary);
  --mfn-button-theme-color-hover: #ffffff;
  --mfn-button-theme-bg: var(--sv2-primary);
  --mfn-button-theme-bg-hover: var(--sv2-primary-hover);
  --mfn-button-theme-icon-color: var(--sv2-on-primary);
  --mfn-button-theme-icon-color-hover: #ffffff;

  --mfn-button-shop-color: var(--sv2-on-primary);
  --mfn-button-shop-color-hover: #ffffff;
  --mfn-button-shop-bg: var(--sv2-primary);
  --mfn-button-shop-bg-hover: var(--sv2-primary-hover);
  --mfn-button-shop-icon-color: var(--sv2-on-primary);
  --mfn-button-shop-icon-color-hover: #ffffff;

  --mfn-clients-tiles-hover: var(--sv2-primary-hover);
  --mfn-icon-box-icon: var(--sv2-brown);
  --mfn-woo-body-color: var(--sv2-text);
  --mfn-woo-heading-color: var(--sv2-brown);
  --mfn-woo-themecolor: var(--sv2-primary);
  --mfn-woo-bg-themecolor: var(--sv2-primary);
  --mfn-woo-border-themecolor: var(--sv2-primary-hover);
  --mfn-free-delivery-bar: var(--sv2-green);
  --mfn-free-delivery-achieved: var(--sv2-green);
}

/* Homepage legacy aliases → global tokens */
.svv-home {
  --svv-honey: var(--sv2-primary);
  --svv-honey-2: var(--sv2-primary-hover);
  --svv-dark: var(--sv2-ink);
  --svv-text: var(--sv2-text);
  --svv-muted: var(--sv2-text-muted);
  --svv-bg: var(--sv2-bg-page);
  --svv-bg-soft: var(--sv2-bg-warm);
  --svv-card: var(--sv2-card);
  --svv-line: var(--sv2-border);
  --svv-brown: var(--sv2-brown);
  --svv-green: var(--sv2-green);
  --svv-shadow: var(--sv2-shadow-md);
}

/* ==========================================================================
   Page shell
   ========================================================================== */

html,
#Wrapper,
#Content,
.mfn-popup .mfn-popup-content,
.mfn-off-canvas-sidebar .mfn-off-canvas-content-wrapper,
.mfn-cart-holder,
.mfn-header-login,
#Top_bar .search_wrapper,
#Top_bar .top_bar_right .mfn-live-search-box {
  background-color: var(--sv2-bg-page);
}

body {
  color: var(--sv2-text);
}

a {
  color: var(--sv2-accent);
}

a:hover {
  color: var(--sv2-accent-hover);
}

.themecolor,
.woocommerce ul.products li.product .price,
.woocommerce-page ul.products li.product .price,
.woocommerce .product div.entry-summary .price,
.widget_price_filter .price_label .from,
.widget_price_filter .price_label .to {
  color: var(--sv2-primary-hover);
}

.themebg,
.woocommerce span.onsale,
.image_frame span.onsale,
.shop_slider .shop_slider_ul .item_wrapper span.onsale,
#Top_bar .header-cart-count,
#Top_bar .header-wishlist-count {
  background-color: var(--sv2-primary);
}

/* ==========================================================================
   WooCommerce — catalog, product, cart
   ========================================================================== */

.woocommerce ul.products li.product,
.shop_slider .shop_slider_ul .shop_slider_li .item_wrapper .desc {
  background-color: var(--sv2-bg-warm);
  border-radius: var(--sv2-radius-card-lg);
  overflow: hidden;
}

.woocommerce ul.products li.product h3,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  color: var(--sv2-brown);
}

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit,
.woocommerce .single_add_to_cart_button,
.woocommerce ul.products li.product .button {
  min-height: 48px;
  padding: 12px 22px;
  border-radius: var(--sv2-radius-pill);
  font-weight: 700;
  transition:
    transform 0.2s ease,
    background 0.2s ease,
    color 0.2s ease,
    box-shadow 0.2s ease;
}

.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce .single_add_to_cart_button,
.woocommerce ul.products li.product .add_to_cart_button {
  background: linear-gradient(135deg, var(--sv2-primary), var(--sv2-primary-soft));
  color: var(--sv2-on-primary);
  box-shadow: var(--sv2-shadow-primary);
  border: none;
}

.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce .single_add_to_cart_button:hover,
.woocommerce ul.products li.product .add_to_cart_button:hover {
  background: linear-gradient(135deg, var(--sv2-brown), var(--sv2-primary-hover));
  color: #ffffff;
}

.woocommerce .quantity input.qty {
  min-height: 44px;
  font-size: 16px;
}

/* ==========================================================================
   Forms (checkout, contact, search)
   ========================================================================== */

input[type="date"],
input[type="email"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="url"],
select,
textarea,
.woocommerce .quantity input.qty,
.select2-container--default .select2-selection--single {
  font-size: 16px;
  color: var(--sv2-brown);
  background-color: var(--sv2-input-bg);
  border-color: var(--sv2-input-border);
  border-radius: var(--sv2-radius-input);
}

input[type="date"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="text"]:focus,
input[type="url"]:focus,
select:focus,
textarea:focus,
.woocommerce .quantity input.qty:focus {
  color: var(--sv2-brown);
  background-color: var(--sv2-input-bg-focus);
  border-color: var(--sv2-primary);
  outline: none;
}

.select2-container--default .select2-results__option--highlighted[data-selected],
.select2-container--default .select2-results__option[data-selected="true"] {
  background-color: var(--sv2-primary);
  color: var(--sv2-on-primary);
}

/* ==========================================================================
   Typography headings (shop pages, not homepage hero)
   ========================================================================== */

body:not(.home) h1,
body:not(.home) h2,
body:not(.home) h3,
body:not(.home) h4 {
  color: var(--sv2-brown);
}

body:not(.home) h2 {
  color: var(--sv2-brown);
}

/* ==========================================================================
   Mobile-first (design.md §7, mobile-responsive skill)
   ========================================================================== */

.woocommerce ul.products li.product .button,
.woocommerce .single_add_to_cart_button {
  width: 100%;
}

@media (min-width: 576px) {
  .woocommerce ul.products li.product .button {
    width: auto;
  }

  .woocommerce .single_add_to_cart_button {
    width: auto;
  }
}

@media (hover: hover) and (pointer: fine) {
  .woocommerce a.button.alt:hover,
  .woocommerce button.button.alt:hover,
  .woocommerce .single_add_to_cart_button:hover {
    transform: translateY(-2px);
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}