/*
 * BAZARARAD — Handmade Design System V1
 * Scope: theme Handmade / custom.css
 * Source of truth: Bazararad visual foundation
 */

:root {

  /* ==============================================================
     BRAND — VERDE ARĂDEAN
     ============================================================= */

  --bz-green-50:  #F4FBEF;
  --bz-green-100: #E8F6DF;
  --bz-green-200: #B7E89A;
  --bz-green-300: #9DDA7D;
  --bz-green-400: #78C95D;
  --bz-green-500: #58A94A;
  --bz-green-600: #2F7F2B;
  --bz-green-700: #256522;
  --bz-green-800: #1D511B;
  --bz-green-900: #143914;

  --bz-brand-primary: #2F7F2B;
  --bz-brand-action: #2F7F2B;
  --bz-brand-action-hover: #256522;

  /* ==============================================================
     SURFACES
     ============================================================== */

  --bz-white: #FFFFFF;
  --bz-warm-white: #FCFCF8;

  /* ==============================================================
     TEXT
     ============================================================== */

  --bz-ink: #17251A;
  --bz-text: #263329;
  --bz-text-secondary: #536057;
  --bz-text-muted: #778078;

  /* ==============================================================
     ACCENTS
     ============================================================== */

  --bz-clay: #C87552;
  --bz-gold: #D7A83D;

  /* ==============================================================
     SEMANTIC
     ============================================================== */

  --bz-success: #2F7F2B;
  --bz-error: #B42318;
  --bz-warning: #B7791F;
  --bz-info: #2563A6;

  /* ==============================================================
     BORDERS
     ============================================================== */

  --bz-border: #DDE5DA;
  --bz-border-subtle: #EAF0E7;
  --bz-border-active: #78C95D;
  --bz-border-focus: #2F7F2B;

  /* ==============================================================
     RADIUS
     ============================================================== */

  --bz-radius-xs: 4px;
  --bz-radius-sm: 8px;
  --bz-radius-md: 12px;
  --bz-radius-lg: 16px;
  --bz-radius-xl: 24px;
  --bz-radius-pill: 999px;

  /* ==============================================================
     SHADOWS
     ============================================================== */

  --bz-shadow-xs:
    0 1px 2px rgba(23, 37, 26, .05);

  --bz-shadow-sm:
    0 2px 8px rgba(23, 37, 26, .07);

  --bz-shadow-md:
    0 6px 18px rgba(23, 37, 26, .10);

  --bz-shadow-lg:
    0 12px 32px rgba(23, 37, 26, .13);

  --bz-shadow-xl:
    0 20px 48px rgba(23, 37, 26, .16);

  /* ==============================================================
     TYPOGRAPHY
     ============================================================== */

  --bz-font-ui:
    Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Helvetica, Arial, sans-serif;

  --bz-font-heading:
    Manrope, Inter, -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, Helvetica, Arial, sans-serif;

  /* ==============================================================
     ACCESSIBILITY
     ============================================================== */

  --bz-focus-ring:
    0 0 0 3px rgba(47, 127, 43, .24);

  /* ==============================================================
     LAYOUT / SPACING
     ============================================================== */

  --bz-space-1: 4px;
  --bz-space-2: 8px;
  --bz-space-3: 12px;
  --bz-space-4: 16px;
  --bz-space-5: 20px;
  --bz-space-6: 24px;
  --bz-space-8: 32px;
  --bz-space-10: 40px;
  --bz-space-12: 48px;
  --bz-space-16: 64px;
  --bz-space-20: 80px;

  --bz-content-max: 1320px;

  /* ==============================================================
     MOTION
     ============================================================== */

  --bz-transition-fast:
    140ms cubic-bezier(.2, .8, .2, 1);

  --bz-transition:
    220ms cubic-bezier(.2, .8, .2, 1);

  --bz-transition-slow:
    320ms cubic-bezier(.2, .8, .2, 1);
}

/* ================================================================
   GLOBAL FOUNDATION
   ================================================================ */

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--bz-font-ui);
  color: var(--bz-text);
  background: var(--bz-white);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--bz-font-heading);
  color: var(--bz-ink);
  font-weight: 700;
}

p {
  color: var(--bz-text);
}

a {
  color: var(--bz-brand-primary);
  transition:
    color var(--bz-transition-fast),
    opacity var(--bz-transition-fast);
}

a:hover {
  color: var(--bz-brand-action-hover);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
  outline: 0;
  box-shadow: var(--bz-focus-ring);
}

/* ================================================================
   BUTTON FOUNDATION
   Only generic interactive controls; component-specific rules
   remain available to Handmade modules.
   ================================================================ */

button,
.btn,
input[type="button"],
input[type="submit"],
input[type="reset"] {
  font-family: var(--bz-font-ui);
  border-radius: var(--bz-radius-sm);
  transition:
    background-color var(--bz-transition),
    color var(--bz-transition),
    border-color var(--bz-transition),
    box-shadow var(--bz-transition),
    transform var(--bz-transition-fast);
}

/* ================================================================
   FORM FOUNDATION
   ============================================================== */

input,
select,
textarea {
  font-family: var(--bz-font-ui);
  color: var(--bz-text);
  border-color: var(--bz-border);
  border-radius: var(--bz-radius-sm);
}

input::placeholder,
textarea::placeholder {
  color: var(--bz-text-muted);
}

/* ================================================================
   CARD FOUNDATION
   ============================================================== */

.card,
.product-miniature,
.products .product,
.js-product-miniature {
  border-radius: var(--bz-radius-lg);
  border-color: var(--bz-border-subtle);
}

/* ================================================================
   BADGE FOUNDATION
   ============================================================== */

.badge,
.label,
.product-flag {
  font-family: var(--bz-font-ui);
  border-radius: var(--bz-radius-pill);
}

/* ================================================================
   REDUCED MOTION
   ============================================================== */

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* ================================================================
   RESPONSIVE FOUNDATION
   ============================================================== */

@media (max-width: 767px) {
  :root {
  }
}

/* ========================================================================
   BAZARARAD — HANDMADE — DESIGN SYSTEM V1
   CONTROLLED LEGACY OVERRIDE LAYER
   ======================================================================== */

:root {
  --bz-force-body-font: var(--bz-font-ui);
}

/* BODY / GENERAL TYPOGRAPHY */
html body {
  color: var(--bz-text);
  background-color: var(--bz-white);
  font-family: var(--bz-font-ui);
}

/* HEADINGS */
html body h1,
html body h2,
html body h3,
html body h4,
html body h5,
html body h6 {
  color: var(--bz-ink);
  font-family: var(--bz-font-heading);
}

/* LINKS */
html body a {
  color: var(--bz-brand-primary);
}

html body a:hover,
html body a:focus-visible {
  color: var(--bz-brand-action-hover);
}

/* BUTTONS — exclude third-party embedded widgets */
html body button:not([class*="gsi"]):not([class*="google"]),
html body .btn,
html body .button,
html body input[type="submit"],
html body input[type="button"] {
  font-family: var(--bz-font-ui);
  border-radius: var(--bz-radius-md);
  transition:
    background-color .14s cubic-bezier(.2,.8,.2,1),
    color .14s cubic-bezier(.2,.8,.2,1),
    border-color .14s cubic-bezier(.2,.8,.2,1),
    box-shadow .14s cubic-bezier(.2,.8,.2,1),
    transform .14s cubic-bezier(.2,.8,.2,1);
}

/* PRIMARY ACTIONS */
html body .btn-primary,
html body .add-to-cart,
html body .ajax_add_to_cart_button,
html body button[name="submit"],
html body input[type="submit"] {
  background-color: var(--bz-brand-action);
  color: var(--bz-white);
  border-color: var(--bz-brand-action);
  box-shadow: var(--bz-shadow-sm);
}

html body .btn-primary:hover,
html body .btn-primary:focus-visible,
html body .add-to-cart:hover,
html body .add-to-cart:focus-visible,
html body .ajax_add_to_cart_button:hover,
html body .ajax_add_to_cart_button:focus-visible,
html body button[name="submit"]:hover,
html body button[name="submit"]:focus-visible,
html body input[type="submit"]:hover,
html body input[type="submit"]:focus-visible {
  background-color: var(--bz-brand-action-hover);
  border-color: var(--bz-brand-action-hover);
  color: var(--bz-white);
  box-shadow: var(--bz-shadow-md);
}

/* FORMS */
html body input:not([type="hidden"]),
html body select,
html body textarea {
  font-family: var(--bz-font-ui);
  color: var(--bz-text);
  background-color: var(--bz-white);
  border-color: var(--bz-border);
  border-radius: var(--bz-radius-md);
}

html body input:not([type="hidden"]):focus,
html body select:focus,
html body textarea:focus {
  border-color: var(--bz-border-focus);
  outline: none;
  box-shadow: var(--bz-focus-ring);
}

/* PRODUCT CARDS */
html body .product-miniature {
  border-radius: var(--bz-radius-lg);
  color: var(--bz-text);
  font-family: var(--bz-font-ui);
}

html body .product-miniature:hover {
  box-shadow: var(--bz-shadow-md);
}

/* PRODUCT CARD TYPOGRAPHY */
html body .product-miniature h2,
html body .product-miniature h3,
html body .product-miniature h4,
html body .product-miniature .product-title {
  color: var(--bz-ink);
  font-family: var(--bz-font-heading);
}

/* PRODUCT BADGES */
html body .product-flag {
  border-radius: var(--bz-radius-pill);
  font-family: var(--bz-font-ui);
}

html body .product-flag.new {
  color: var(--bz-white);
  background-color: var(--bz-brand-action);
  border-color: var(--bz-brand-action);
}

html body .product-flag.out_of_stock {
  color: var(--bz-ink);
  background-color: var(--bz-green-100);
  border-color: var(--bz-green-200);
}

/* NAVIGATION */
html body nav a,
html body .menu a,
html body .dropdown-item {
  font-family: var(--bz-font-ui);
}

html body nav a:hover,
html body nav a:focus-visible,
html body .menu a:hover,
html body .menu a:focus-visible,
html body .dropdown-item:hover,
html body .dropdown-item:focus-visible {
  color: var(--bz-brand-primary);
}

/* GENERIC PANELS / CARDS */
html body .card,
html body .panel,
html body .box {
  border-radius: var(--bz-radius-lg);
  border-color: var(--bz-border-subtle);
}

/* ACCESSIBILITY */
html body :focus-visible {
  outline: 2px solid var(--bz-border-focus);
  outline-offset: 2px;
}

/* MOTION */
@media (prefers-reduced-motion: reduce) {
  html body *,
  html body *::before,
  html body *::after {
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}


/* ========================================================================
   BAZARARAD — HANDMADE — DESIGN SYSTEM V1 — REPAIR V2
   Chromium-proven legacy visual overrides
   ======================================================================== */

/* ------------------------------------------------------------------------
   HERO / HOMEPAGE DECORATIVE TITLES
   ------------------------------------------------------------------------ */

html body h3[style*="color"],
html body h1[style*="color"],
html body .marck-script,
html body .home-title,
html body .section-title,
html body .block-title {
  color: var(--bz-ink);
}

/*
 * Handmade's decorative "New Arrivals" heading is intentionally moved
 * onto the Bazararad heading system.
 */
html body h3 {
  color: var(--bz-ink);
}

/*
 * Preserve semantic emphasis while removing the legacy decorative font.
 */
html body h1,
html body h2,
html body h3,
html body h4,
html body h5,
html body h6 {
  font-family: var(--bz-font-heading);
}

/* ------------------------------------------------------------------------
   LEGACY #3A3A3A / #387769 VISUAL OVERRIDES
   ------------------------------------------------------------------------ */

html body {
  --legacy-handmade-dark: var(--bz-text);
}

html body .dropdown-item,
html body .dropdown-submenu,
html body .nav-arrows,
html body .top-menu a,
html body #top-menu a {
  color: var(--bz-text);
  border-color: var(--bz-border);
}

html body .dropdown-item:hover,
html body .dropdown-item:focus-visible,
html body .dropdown-submenu:hover,
html body .dropdown-submenu:focus-visible,
html body .top-menu a:hover,
html body .top-menu a:focus-visible,
html body #top-menu a:hover,
html body #top-menu a:focus-visible {
  color: var(--bz-brand-primary);
}

/* ------------------------------------------------------------------------
   SEARCH / FORM CONTROLS
   ------------------------------------------------------------------------ */

html body input.ui-autocomplete-input,
html body .ui-autocomplete-input,
html body input[type="search"] {
  color: var(--bz-text);
  background-color: var(--bz-white);
  border: 1px solid var(--bz-border);
  border-radius: var(--bz-radius-md);
  font-family: var(--bz-font-ui);
  box-shadow: var(--bz-shadow-xs);
}

html body input.ui-autocomplete-input::placeholder,
html body .ui-autocomplete-input::placeholder,
html body input[type="search"]::placeholder {
  color: var(--bz-text-muted);
  opacity: 1;
}

html body input.ui-autocomplete-input:focus,
html body .ui-autocomplete-input:focus,
html body input[type="search"]:focus {
  color: var(--bz-text);
  border-color: var(--bz-border-focus);
  box-shadow: var(--bz-focus-ring);
  outline: none;
}

/* ------------------------------------------------------------------------
   SEARCH / CLOSE / AUXILIARY BUTTONS
   ------------------------------------------------------------------------ */

html body button.bonsearch_btn,
html body button.popup-close {
  color: var(--bz-ink);
  background-color: transparent;
  border-color: transparent;
  box-shadow: none;
  border-radius: var(--bz-radius-md);
}

html body button.bonsearch_btn:hover,
html body button.bonsearch_btn:focus-visible,
html body button.popup-close:hover,
html body button.popup-close:focus-visible {
  color: var(--bz-brand-primary);
  background-color: var(--bz-green-50);
  border-color: var(--bz-border-subtle);
  box-shadow: var(--bz-shadow-xs);
}

/* ------------------------------------------------------------------------
   PRODUCT CARDS
   ------------------------------------------------------------------------ */

html body article.product-miniature {
  color: var(--bz-text);
  border-color: var(--bz-border-subtle);
  border-radius: var(--bz-radius-lg);
  box-shadow: var(--bz-shadow-sm);
  background-color: var(--bz-white);
  font-family: var(--bz-font-ui);
}

html body article.product-miniature:hover {
  border-color: var(--bz-green-200);
  box-shadow: var(--bz-shadow-md);
}

html body article.product-miniature .thumbnail-container {
  color: var(--bz-text);
  border-color: transparent;
  box-shadow: none;
}

/* Product titles */
html body article.product-miniature .product-title,
html body article.product-miniature .product-title a,
html body article.product-miniature .h3,
html body article.product-miniature h3 {
  color: var(--bz-ink);
  font-family: var(--bz-font-heading);
}

html body article.product-miniature .product-title a:hover,
html body article.product-miniature .product-title a:focus-visible {
  color: var(--bz-brand-primary);
}

/* Prices */
html body article.product-miniature .price,
html body article.product-miniature .product-price-and-shipping {
  color: var(--bz-brand-primary);
  font-family: var(--bz-font-ui);
}

/* ------------------------------------------------------------------------
   PRODUCT BADGES — FINAL NORMALIZATION
   ------------------------------------------------------------------------ */

html body .product-flag {
  font-family: var(--bz-font-ui);
  border-radius: var(--bz-radius-pill);
  box-shadow: none;
}

html body .product-flag.new {
  color: var(--bz-white);
  background-color: var(--bz-brand-action);
  border-color: var(--bz-brand-action);
}

html body .product-flag.out_of_stock {
  color: var(--bz-ink);
  background-color: var(--bz-green-100);
  border-color: var(--bz-green-200);
}

/* ------------------------------------------------------------------------
   GENERIC VISIBLE BUTTONS
   ------------------------------------------------------------------------ */

html body button:not(.slick-arrow):not(.bonsearch_btn):not(.popup-close),
html body .btn:not(.btn-link),
html body input[type="submit"],
html body input[type="button"] {
  font-family: var(--bz-font-ui);
  border-radius: var(--bz-radius-md);
}

html body button:not(.slick-arrow):not(.bonsearch_btn):not(.popup-close):not(.btn-primary):hover,
html body .btn:not(.btn-link):not(.btn-primary):hover {
  border-color: var(--bz-brand-primary);
  box-shadow: var(--bz-shadow-sm);
}

/* ------------------------------------------------------------------------
   VISIBLE TEXT ELEMENTS — REMOVE LEGACY DEFAULT DARK GRAY
   ------------------------------------------------------------------------ */

html body .product-description,
html body .product-information,
html body .product-reference,
html body .product-condition,
html body .product-meta,
html body .product-details {
  color: var(--bz-text);
  font-family: var(--bz-font-ui);
}

html body .product-description strong,
html body .product-information strong,
html body .product-details strong {
  color: var(--bz-ink);
}

/* ------------------------------------------------------------------------
   ACCESSIBILITY / FOCUS
   ------------------------------------------------------------------------ */

html body a:focus-visible,
html body button:focus-visible,
html body input:focus-visible,
html body select:focus-visible,
html body textarea:focus-visible {
  outline: 2px solid var(--bz-border-focus);
  outline-offset: 2px;
}

/* ------------------------------------------------------------------------
   MOTION
   ------------------------------------------------------------------------ */

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


/* ========================================================================
   HANDMADE — FINAL COMPUTED-CSS REPAIR
   Browser-proof corrections
   ======================================================================== */

:root {
  --bz-radius-xs: 4px !important;
  --bz-radius-sm: 8px !important;
  --bz-radius-md: 12px !important;
  --bz-radius-lg: 16px !important;
  --bz-radius-xl: 24px !important;
  --bz-radius-pill: 999px !important;
}

/* Product cards: computed radius must be exactly 16px */
html body article.product-miniature,
html body .product-miniature {
  border-radius: 16px !important;
}

/* Explicit Bazararad component radius */
html body .bz-card,
html body .bz-surface,
html body .bz-panel {
  border-radius: 16px !important;
}

html body .bz-card-xl,
html body .bz-surface-xl {
  border-radius: 24px !important;
}

/* Search/form control normalization */
html body input.ui-autocomplete-input,
html body .ui-autocomplete-input,
html body input[type="search"] {
  color: var(--bz-text) !important;
  background-color: var(--bz-white) !important;
  border: 1px solid var(--bz-border) !important;
  border-radius: var(--bz-radius-md) !important;
  box-shadow: var(--bz-shadow-xs) !important;
  font-family: var(--bz-font-ui) !important;
}

html body input.ui-autocomplete-input::placeholder,
html body .ui-autocomplete-input::placeholder,
html body input[type="search"]::placeholder {
  color: var(--bz-text-muted) !important;
  opacity: 1 !important;
}

/* Navigation dropdown */
html body .dropdown-item,
html body .dropdown-submenu,
html body .nav-arrows {
  color: var(--bz-text) !important;
  border-color: var(--bz-border) !important;
  font-family: var(--bz-font-ui) !important;
}

html body .dropdown-item:hover,
html body .dropdown-item:focus-visible,
html body .dropdown-submenu:hover,
html body .dropdown-submenu:focus-visible {
  color: var(--bz-brand-primary) !important;
}

/* Decorative Handmade heading must no longer inject its legacy
   green + Marck Script visual identity. */
html body h3 {
  color: var(--bz-ink);
  font-family: var(--bz-font-heading);
}

html body h1 {
  color: var(--bz-ink);
  font-family: var(--bz-font-heading);
}


/* HANDMADE-CRITICAL-NORMALIZATION-01-BEGIN */
@import url("handmade-critical-normalization.css");
/* HANDMADE-CRITICAL-NORMALIZATION-01-END */