/* ================================================================
   STEAMPUNK THEME — custom.css
   Inspirat din MindGearSoftware (mindgearsoftware.com)
   Fonturi: Cinzel Decorative · Pirata One · Metamorphous
   Fundal: Lemn deschis / Pergament cald
   ================================================================ */

/* === FONTS IMPORT (bunny.net — EU CDN, Google Fonts drop-in) === */
@import url('https://fonts.bunny.net/css?family=cinzel-decorative:400,700,900|pirata-one:400|metamorphous:400&display=swap');

/* ===== VARIABILE STEAMPUNK ===== */
:root {
    --brass:        #8B4513;
    --copper:       #B7410E;
    --brass-light:  #c47a3a;
    --copper-light: #c8602a;
    --gold-vivid:   #B7410E;

    --bg-main:  #F4E4BC;
    --bg-panel: #EBD8AA;
    --bg-card:  #E2D1A4;
    --bg-dark:  #34544F;
    --bg-dark2: #1a1410;

    --text:       #2D1B02;
    --text-sub:   #5a3a10;
    --text-light: #f5f5dc;

    --border:      #c8a060;
    --border-dark: #3a2e1e;

    /* Bootstrap overrides */
    --bs-body-bg:           #F4E4BC;
    --bs-body-color:        #2D1B02;
    --bs-primary:           #8B4513;
    --bs-body-font-family:  'Metamorphous', Georgia, serif;
    --bs-link-color:        #B7410E;
    --bs-link-hover-color:  #8B4513;
    --bs-border-color:      #c8a060;
    --bs-secondary-color:   #8B4513;
}

/* ===== SCROLLBAR ===== */
::-webkit-scrollbar         { width: 10px; }
::-webkit-scrollbar-track   { background: #c4a870; }
::-webkit-scrollbar-thumb   { background: linear-gradient(#8a6200, #7a3800); border-radius: 5px; }

/* ===== BODY ===== */
body {
    font-family: 'Metamorphous', Georgia, serif !important;
    background-color: #F4E4BC !important;
    color: #2D1B02 !important;
}

/* ===== TITLURI ===== */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    color: var(--brass) !important;
    letter-spacing: 2px;
}

/* ===== LINK-URI ===== */
a { color: var(--copper) !important; text-decoration: none !important; }
a:hover { color: var(--brass) !important; }

/* ================================================================
   HEADER
   ================================================================ */
.header {
    background-color: rgba(52, 84, 79, 0.98) !important;
    border-bottom: 3px solid var(--copper-light) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.8) !important;
    backdrop-filter: blur(10px);
    color: var(--text-light) !important;
    position: relative !important;
    z-index: 1000 !important;
}

/* Wrapper: logo | ---- meniu ---- | actiuni */
.header__wrapper {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
}

/* Logo — primul, nemiscabil */
.header__logo {
    order: 0 !important;
    position: static !important;
    left: auto !important;
    transform: none !important;
    flex-shrink: 0 !important;
}

.header__logo-text,
.header__logo a,
.header__logo span {
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    color: var(--brass-light) !important;
    font-weight: 900 !important;
    letter-spacing: 4px;
}

/* Meniu — al doilea, ia tot spatiul ramas, O SINGURA LINIE */
.header__menu {
    order: 1 !important;
    margin-left: auto !important;
    flex-shrink: 1 !important;
    overflow: visible !important;
}

.header__menu-list {
    flex-wrap: nowrap !important;
    overflow: visible !important;
    white-space: nowrap;
    gap: 0 !important;
}

/* Item meniu — padding redus, fara letter-spacing, sa incapa pe o linie */
.header__menu a,
.header__menu a:active,
.header__menu-list > li > a {
    font-family: 'Metamorphous', Georgia, serif !important;
    color: var(--text-light) !important;
    text-decoration: none !important;
    padding: 7px 10px !important;
    border: 2px solid transparent !important;
    transition: 0.3s !important;
    letter-spacing: 0 !important;
    font-size: 0.88rem !important;
    white-space: nowrap !important;
    background-color: transparent !important;
    display: block !important;
}

.header__menu a:hover,
.header__menu-item--active > a,
.header__menu-wide .nav-link:hover,
.header__menu-wide .nav-link:focus,
.header__menu-wide .nav-link.active {
    color: var(--brass-light) !important;
    border-color: var(--copper-light) !important;
    background: rgba(181, 166, 66, 0.12) !important;
}

/* Actiuni — al treilea */
.header__actions {
    order: 2 !important;
    margin-left: 16px !important;
    flex-shrink: 0 !important;
}

.header__actions a, .header__actions button { color: var(--text-light) !important; }
.header__actions a:hover, .header__actions button:hover { color: var(--brass-light) !important; }

/* Valuta (EUR/RON) — span/div care nu sunt a sau button */
.header__actions span,
.header__actions [class*="currency"],
.header__actions [class*="money"],
.header__actions [class*="price-format"],
.header__actions [class*="switcher"] > span,
.header__actions [class*="switcher"] > div {
    color: var(--text-light) !important;
}

/* Dropdown selector limba — text inchis pe fundal deschis */
.header__actions [role="tooltip"] a,
.header__actions [role="tooltip"] span,
.header__actions .tooltip a,
.header__actions .tooltip span,
.header__actions .dropdown-menu a,
.header__actions [class*="lang"] a,
.header__actions [class*="language"] a,
.header__actions [class*="switcher"] a {
    color: var(--text) !important;
    white-space: nowrap !important;
}

/* Container dropdown limba — latime suficienta */ac
.header__actions [role="tooltip"],
.header__actions .tooltip,
.header__actions [class*="lang"] ul,
.header__actions [class*="language"] ul,
.header__actions [class*="switcher"] ul {
    min-width: 140px !important;
    width: auto !important;
}

.header__actions [role="tooltip"] a:hover,
.header__actions .tooltip a:hover,
.header__actions .dropdown-menu a:hover,
.header__actions [class*="lang"] a:hover,
.header__actions [class*="language"] a:hover {
    color: var(--brass) !important;
    background-color: rgba(139, 69, 19, 0.08) !important;
}

/* Tab-uri (Detalii, Descriere etc.) */
.nav-tabs .nav-link {
    color: var(--text) !important;
    background: transparent !important;
    border-color: transparent !important;
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    letter-spacing: 1px;
}
.nav-tabs .nav-link:hover,
.nav-tabs .nav-link:focus,
.nav-tabs .nav-link.active {
    color: var(--brass) !important;
    border-color: var(--border) var(--border) var(--bg-main) !important;
    background: var(--bg-main) !important;
}

/* ================================================================
   HERO / SLIDER
   ================================================================ */
.widget-slider, .bslots__content, [class*="hero"] {
    border-bottom: 2px solid var(--border-dark);
    position: relative;
}

.widget-slider::after, .bslots__content::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(52,84,79,0.2) 0%, rgba(52,84,79,0.5) 100%);
    pointer-events: none;
    z-index: 1;
}

.bslots__content h2, .bslots__content h3, .bslots__content p,
.widget-slider h2, .widget-slider h3, .widget-slider p,
.slider-text, .slider-caption {
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    color: var(--text-light) !important;
    text-shadow: 2px 2px 10px rgba(0,0,0,0.9), 0 0 20px rgba(0,0,0,0.7) !important;
}

.bslots__content .btn, .widget-slider .btn {
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    color: var(--text-light) !important;
    background: rgba(52, 84, 79, 0.7) !important;
    border: 2px solid var(--brass-light) !important;
    letter-spacing: 2px;
    text-transform: uppercase;
    z-index: 2;
    position: relative;
}

/* ── BSLOT SLIDER — titlu fluid + fundal steampunk ── */
/* Font + marime fluida: 24px (mobil mic) → 60px (desktop) */
.bslot-slider__title {
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    color: var(--text-light) !important;
    text-shadow: 2px 2px 10px rgba(0,0,0,0.9), 0 0 20px rgba(0,0,0,0.7) !important;
    font-size: clamp(1.5rem, 5vw, 3.75rem) !important;
    line-height: 1.18 !important;
    word-break: break-word !important;
}

.bslot-slider__subtitle {
    font-family: 'Metamorphous', Georgia, serif !important;
    color: var(--text-light) !important;
    text-shadow: 1px 1px 6px rgba(0,0,0,0.8) !important;
    font-size: clamp(0.75rem, 1.8vw, 1.125rem) !important;
    line-height: 1.4 !important;
}

/* Fundal continut slider — inlocuim albul semitransparent cu steampunk */
/* Platforma seteaza padding: 15px 30px 0px — corectam la padding egal sus/jos */
.bslot-slider__content {
    background: rgba(26, 16, 8, 0.62) !important;
    border: 1px solid rgba(200, 160, 60, 0.3) !important;
    border-radius: 3px !important;
    backdrop-filter: blur(3px) !important;
    padding: 16px 30px !important;
    display: inline-flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
}

/* Titlu fara margin-bottom ca sa nu dezechilibreze centrarea */
.bslot-slider__title {
    margin-bottom: 0 !important;
}

/* Subtitle gol — ascuns ca sa nu adauge spatiu */
.bslot-slider__subtitle:empty {
    display: none !important;
}

/* Subtitle cu continut — spatiu deasupra */
.bslot-slider__subtitle:not(:empty) {
    margin-top: 8px !important;
    margin-bottom: 0 !important;
}

/* Mobil: fortam latime mai mare si reducem letter-spacing ca sa incapa textul */
@media (max-width: 767px) {
    .bslot-slider__content {
        width: 88% !important;
        max-width: 88% !important;
        padding: 12px 14px 12px !important;
    }
    .bslot-slider__title {
        letter-spacing: 0.5px !important;
        font-size: clamp(1.5rem, 6.5vw, 2.5rem) !important;
    }
    .bslot-slider__subtitle {
        font-size: 0.8rem !important;
    }
}

/* ================================================================
   BANDA FEATURES
   ================================================================ */
.widget-features, .widget-features__wrapper,
[class*="widget-features"], .features-bar {
    background-color: #c0a068 !important;
    border-top: 2px solid var(--border) !important;
    border-bottom: 2px solid var(--border) !important;
    color: var(--text) !important;
}

/* Aliniere iconiță + text la TOP în fiecare celulă */
.bslot-multi-icon__cell {
    align-items: start !important;
}

/* Eliminare fundal alb din spatele iconițelor logo */
.bslot-multi-icon__image-wrapper {
    background: transparent !important;
}
.bslot-multi-icon__image {
    background: transparent !important;
    mix-blend-mode: multiply;
}

[class*="widget-features"] strong, [class*="widget-features"] h6,
[class*="widget-features"] .h6, [class*="features"] strong, [class*="features"] b {
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    color: var(--text) !important;
    letter-spacing: 1px;
    font-size: 0.8rem !important;
}

[class*="widget-features"] span, [class*="widget-features"] p,
[class*="widget-features"] small, [class*="features"] span, [class*="features"] small {
    color: var(--text-sub) !important;
    font-family: 'Metamorphous', Georgia, serif !important;
}

/* ================================================================
   BANNERE
   ================================================================ */
.widget-banner, .widget-banner__wrapper {
    border: 1px solid var(--border);
    position: relative;
    overflow: hidden;
}

/* Fix: wrapper banner cu aspect-ratio forțat → înălțime determinată de imagine */
.bslot-single-file__image-wrapper {
    aspect-ratio: auto !important;
    height: auto !important;
}
.bslot-single-file__image {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    vertical-align: top !important;
}

.widget-banner__heading, .widget-banner h2,
.widget-banner h3, .widget-banner a {
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    color: var(--text-light) !important;
    text-shadow: 2px 2px 8px rgba(0,0,0,0.8);
    letter-spacing: 3px;
    text-transform: uppercase;
}

.widget-banner .btn, .widget-banner__cta {
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    color: var(--text-light) !important;
    background: rgba(52, 84, 79, 0.65) !important;
    border: 2px solid var(--brass-light) !important;
    padding: 10px 24px !important;
    letter-spacing: 2px;
    text-transform: uppercase;
    transition: 0.3s !important;
    border-radius: 3px !important;
}
.widget-banner .btn:hover, .widget-banner__cta:hover {
    background: rgba(52, 84, 79, 0.85) !important;
    border-color: var(--copper-light) !important;
    color: var(--brass-light) !important;
    box-shadow: 0 0 20px rgba(181, 166, 66, 0.3);
    transform: translateY(-3px);
}

/* ================================================================
   CATEGORII
   ================================================================ */
.categories__content--grid, .categories__content,
.category-block, [class*="widget-categories"] {
    background-color: var(--bg-panel) !important;
    color: var(--text) !important;
}

.categories__content--grid .category__name, .category-block__name, .category__name {
    color: var(--text) !important;
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    font-size: 0.65rem !important;
    letter-spacing: 1px;
}

.categories__content--grid .category__image-container img,
.categories__content--grid .category__no-image img,
.category-block__image-container img { border: 3px solid var(--brass) !important; }

.category:hover img, .category-block:hover img { border-color: var(--copper) !important; }
.category:hover .category__name, .category-block:hover .category__name { color: var(--brass) !important; }

/* ================================================================
   PRODUSE — CARD
   border auriu permanent · hover gradient luminos · umbra 3D
   ================================================================ */
.product--compact {
    background-color: var(--bg-card) !important;
    color: color-mix(in srgb, var(--bg-card), black 85%) !important;
    border: 2px solid var(--border) !important;
    position: relative !important;
    overflow: hidden !important;
    /* Umbra 3D — card „flotant" */
    box-shadow:
        0 2px  0   rgba(0, 0, 0, 0.18),
        0 6px 16px rgba(0, 0, 0, 0.18),
        0 1px  3px rgba(212, 168, 0, 0.18) !important;
    transition:
        border-color 0.35s ease,
        box-shadow   0.35s ease,
        transform    0.35s ease !important;
}

.product--grid {
    background-color: var(--bg-card) !important;
    color: color-mix(in srgb, var(--bg-card), black 85%) !important;
    border: none !important;
    position: relative !important;
    overflow: visible !important;
    box-shadow:
        0 8px 20px rgba(0, 0, 0, 0.2) !important;
    transition:
        box-shadow   0.35s ease,
        transform    0.35s ease !important;
}

.product--grid::before {
    content: '';
    position: absolute !important;
    top: -10px !important;
    left: -10px !important;
    right: -10px !important;
    bottom: -10px !important;
    border: 10px solid transparent !important;
    border-image-source: url('https://f.cdnmp.net/401754215/content/border.png?rv=1778711632') !important;
    border-image-slice: 65 !important;
    border-image-repeat: round !important;
    pointer-events: none !important;
    z-index: -1 !important;
}

/* Strat lumina aurie — invizibil pana la hover */
.product--compact::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(
        ellipse at 50% 30%,
        rgba(255, 215, 0, 0.18) 0%,
        rgba(181, 166, 66, 0.10) 40%,
        transparent 68%
    );
    opacity: 0;
    transition: opacity 0.45s ease;
    pointer-events: none;
    z-index: 0;
}

.product--grid::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(
        ellipse at 50% 30%,
        rgba(255, 215, 0, 0.18) 0%,
        rgba(181, 166, 66, 0.10) 40%,
        transparent 68%
    );
    opacity: 0;
    transition: opacity 0.45s ease;
    pointer-events: none;
    z-index: 0;
}

/* Continut deasupra stratului de lumina */
.product--compact > *, .product--grid > * { position: relative; z-index: 1; }

/* Hover */
.product--compact:hover {
    border-color: var(--gold-vivid) !important;
    box-shadow:
        0 0   0  2px  rgba(212, 168, 0, 0.55),
        0 10px 30px   rgba(0, 0, 0, 0.30),
        0 0  24px     rgba(212, 168, 0, 0.22) !important;
    transform: translateY(-6px) !important;
}

.product--grid:hover {
    box-shadow:
        0 0   0  2px  rgba(212, 168, 0, 0.55),
        0 10px 30px   rgba(0, 0, 0, 0.30),
        0 0  24px     rgba(212, 168, 0, 0.22) !important;
    transform: translateY(-6px) !important;
}

.product--compact:hover::before { opacity: 1; }
.product--grid:hover::after { opacity: 1; }

/* ================================================================
   SLIDER PRODUCTS — Same steampunk border as grid
   ================================================================ */
.product--slider {
    background-color: var(--bg-card) !important;
    color: color-mix(in srgb, var(--bg-card), black 85%) !important;
    border: none !important;
    position: relative !important;
    overflow: visible !important;
    box-shadow:
        0 8px 20px rgba(0, 0, 0, 0.2) !important;
    transition:
        box-shadow   0.35s ease,
        transform    0.35s ease !important;
}

.product--slider::before {
    content: '';
    position: absolute !important;
    top: -10px !important;
    left: -10px !important;
    right: -10px !important;
    bottom: -10px !important;
    border: 10px solid transparent !important;
    border-image-source: url('https://f.cdnmp.net/401754215/content/border.png?rv=1778711632') !important;
    border-image-slice: 65 !important;
    border-image-repeat: round !important;
    pointer-events: none !important;
    z-index: -1 !important;
}

.product--slider::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(
        ellipse at 50% 30%,
        rgba(255, 215, 0, 0.18) 0%,
        rgba(181, 166, 66, 0.10) 40%,
        transparent 68%
    );
    opacity: 0;
    transition: opacity 0.45s ease;
    pointer-events: none;
    z-index: 0;
}

.product--slider > * { position: relative; z-index: 1; }

.product--slider:hover {
    box-shadow:
        0 0   0  2px  rgba(212, 168, 0, 0.55),
        0 10px 30px   rgba(0, 0, 0, 0.30),
        0 0  24px     rgba(212, 168, 0, 0.22) !important;
    transform: translateY(-6px) !important;
}

.product--slider:hover::after { opacity: 1; }

/* Imagine */
.product__image, .slider-image {
    background-color: #d4bc82 !important;
    border-bottom: 1px solid var(--border);
    aspect-ratio: 1 / 1 !important;
    overflow: hidden !important;
    width: 100% !important;
    max-width: 100% !important;
}

.product__image img, .slider-image img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    max-width: none !important;
    max-height: none !important;
}

/* Date produs */
.product__data { background-color: var(--bg-card) !important; padding: 10px 12px 14px !important; color: var(--text) !important; }

/* Nume */
.product__name, .product__name a,
.product--compact .product__name, .product--grid .product__name {
    font-family: 'Metamorphous', Georgia, serif !important;
    color: var(--text) !important;
}
.product__name a:hover { color: var(--brass) !important; }

/* Descriere */
.product__description, .product--compact .product__description {
    color: var(--text) !important;
    font-family: 'Metamorphous', Georgia, serif !important;
}

/* Categorie */
.product__category, .product__category a, .product--compact .product__category {
    color: var(--text-sub) !important;
    font-family: 'Metamorphous', Georgia, serif !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 0.72rem !important;
}

/* Preturi — listing catalog */
/* Fix centrare text slider pe mobil (inclusiv ultimele slide-uri) */
@media (max-width: 767px) {
    .splide__slide { text-align: center !important; }
    .bslot-slider__content, .slider-text, .slider-caption {
        text-align: center !important;
        justify-content: center !important;
        align-items: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}
.product__info--price-net,
.product__info--price-gross,
[class*="price-net"],
[class*="price-gross"],
.price {
    color: #2D1B02 !important;
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    font-weight: 900 !important;
    font-size: 1.18rem !important;
    text-shadow: none !important;
}

/* Pret vechi */
.product__info--rrp-price-gross, [class*="rrp-price"], del, s, .old-price {
    color: #8a7060 !important;
    opacity: 0.75;
    font-size: 0.85rem !important;
    text-decoration: line-through !important;
}

/* Badge discount */
.slider-image__badge,
.grid-image__badge,
.grid-image__badge--price-discount,
[class*="badge-discount"], [class*="badge-promo"],
.discount-badge, .product__badge,
.badge--promo, .badge--discount, .badge--sale,
[class*="badge"][class*="promo"],
[class*="badge"][class*="sale"],
[class*="badge"][class*="new"],
.product-badge {
    background-color: #6B1F2A !important;
    color: #f5e6d0 !important;
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    font-weight: 700;
    letter-spacing: 1px;
    border-radius: 2px !important;
    border: 1px solid #8B2535 !important;
    text-shadow: none !important;
}

/* Wishlist */
.product__actions button, .product__actions a {
    color: var(--text) !important;
    background: rgba(226, 207, 160, 0.85) !important;
    border: 1px solid var(--border) !important;
    transition: 0.3s !important;
}
.product__actions button:hover, .product__actions a:hover {
    color: var(--brass) !important;
    border-color: var(--brass) !important;
    background: rgba(226, 207, 160, 1) !important;
}

/* ================================================================
   PRODUSE — COS: muta butonul langa inimioară (pe imagine)
   Inimioară stânga · Coș dreapta · același strip 41px
   ================================================================ */

/* ================================================================
   STRIP INIMIOARĂ — reset complet de la regulile globale .btn
   Cauza problemelor: .grid-image__save-wishlist are clasa btn btn-icon,
   deci primea gradient întunecat, border brass și transform:translateY(-3px) la hover.
   ================================================================ */

/* Strip inimioară: position: absolute ancorată la bottom: 0 al imaginii.
    CAUZA BUG: .grid-image__actions are top fix (px) setat de platformă.
    La resize, imaginea se micșorează → top fix depășește înălțimea imaginii
    → strip-ul iese din .grid-image → tăiat de overflow: hidden al .product--grid.
    FIX: pe desktop ridicăm containerul imaginii în față, ca să nu fie acoperit. */
/* ================================================================
   PRODUCT DATA — LAYERING FIX
   Push product description behind heart/cart buttons
   ================================================================ */

.product--grid .product__data {
    position: static !important;
    z-index: auto !important;
    pointer-events: none !important;
    padding-bottom: 52px !important; /* 41px strip + 11px breathing room */
}

/* Re-activam pointer events doar pe link-uri si butoane din product__data */
.product--grid .product__data a,
.product--grid .product__data button {
    pointer-events: auto !important;
}

.product--grid .grid-image {
    position: static !important;
}

/* Strip inimioară: sempre vizibil */
.product--grid .grid-image__actions {
    position: absolute !important;
    bottom: 0 !important;
    top: auto !important;
    left: 0 !important;
    width: 50% !important;
    height: 41px !important;
    background: rgba(226,207,160,0.95) !important;
    border-top: 1px solid #c8a060 !important;
    border-right: 1px solid #c8a060 !important;
    border-bottom: 1px solid #c8a060 !important;
    border-left: 1px solid #c8a060 !important;
    justify-content: center !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: flex !important;
    align-items: center !important;
    transition: opacity 0.3s !important;
    z-index: 1000 !important;
    overflow: visible !important;
}

.product--grid .grid-image__actions:hover {
    background: rgba(226, 207, 160, 0.85) !important;
    box-shadow: inset 0 0 0 2px var(--border) !important;
}

.product--grid .grid-image__save-wishlist {
    width: 100% !important;
    height: 100% !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
    color: #2D1B02 !important;
    transition: color 0.3s !important;
    padding: 0 !important;
    font-size: 26px !important;
    line-height: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    z-index: 1001 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

.product--grid .grid-image__save-wishlist::before {
    content: '' !important;
    display: block !important;
    width: 28px !important;
    height: 28px !important;
    background-image: url('https://f.cdnmp.net/401754215/content/steamheart.png?rv=1777887586') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    transition: opacity 0.2s !important;
}

.product--grid .grid-image__save-wishlist:hover::before {
    opacity: 0.75 !important;
}

.product--grid .grid-image__save-wishlist svg,
.product--grid .grid-image__save-wishlist img,
.product--grid .grid-image__save-wishlist i {
    display: none !important;
}

/* Strip coș — jumătatea dreaptă */
.product--grid .product__actions {
    position: absolute !important;
    bottom: 0 !important;
    top: auto !important;
    left: auto !important;
    right: 0 !important;
    width: 50% !important;
    height: 41px !important;
    background: rgba(226,207,160,0.95) !important;
    border-top: 1px solid #c8a060 !important;
    border-right: 1px solid #c8a060 !important;
    border-bottom: 1px solid #c8a060 !important;
    border-left: 1px solid #c8a060 !important;
    box-shadow: none !important;
    padding: 0 !important;
    z-index: 999 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    opacity: 1 !important;
    visibility: visible !important;
    transition: opacity 0.3s !important;
}

.product--grid .product__actions:hover {
    background: rgba(226, 207, 160, 0.85) !important;
    box-shadow: inset 0 0 0 2px var(--border) !important;
}

.product--grid .product__add-to-cart {
    width: 100% !important;
    height: 100% !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    font-size: 0 !important;
    line-height: 0 !important;
    color: transparent !important;
    transform: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 1001 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

.product--grid .product__actions .product__add-to-cart::before {
    content: '' !important;
    display: block !important;
    width: 28px !important;
    height: 28px !important;
    flex-shrink: 0 !important;
    background-image: url('https://f.cdnmp.net/401754215/content/steambasket.png?rv=1777888489') !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    transition: opacity 0.2s !important;
}

.product--grid .product__actions .product__add-to-cart:hover::before {
    opacity: 0.75 !important;
}

/* ================================================================
   ANIMATIE FADE-IN STAGGERED — 40 produse, easing fluid
   Easing: cubic-bezier(0.22, 1, 0.36, 1) = ease-out-quart
   Durata: 0.55s, delay: 0.05s per produs
   animation-fill-mode: both => invizibil inainte de start
   ================================================================ */
@keyframes steamFadeIn {
    from { opacity: 0; transform: translateY(18px) scale(0.975); }
    to   { opacity: 1; transform: translateY(0)    scale(1);     }
}

/* Spacing between products — show borders clearly */
.products-grid__items,
.products-list__items {
    gap: 40px !important;
    padding: 30px 20px 20px 30px !important;
}

/* Mobile: reduce spacing so products aren't cramped */
@media (max-width: 1024px) {
    .products-grid__items,
    .products-list__items {
        gap: 20px !important;
        padding: 20px 15px 15px 20px !important;
    }
}

@media (max-width: 767px) {
    .products-grid__items,
    .products-list__items {
        gap: 14px !important;
        padding: 15px 10px 10px 15px !important;
    }
}

.products-grid__items > .product--grid,
.products-list__items > .product--compact {
    animation: steamFadeIn 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.products-grid__items > .product--grid:nth-child(1),
.products-list__items > .product--compact:nth-child(1)  { animation-delay: 0.03s; }
.products-grid__items > .product--grid:nth-child(2),
.products-list__items > .product--compact:nth-child(2)  { animation-delay: 0.08s; }
.products-grid__items > .product--grid:nth-child(3),
.products-list__items > .product--compact:nth-child(3)  { animation-delay: 0.13s; }
.products-grid__items > .product--grid:nth-child(4),
.products-list__items > .product--compact:nth-child(4)  { animation-delay: 0.18s; }
.products-grid__items > .product--grid:nth-child(5),
.products-list__items > .product--compact:nth-child(5)  { animation-delay: 0.23s; }
.products-grid__items > .product--grid:nth-child(6),
.products-list__items > .product--compact:nth-child(6)  { animation-delay: 0.28s; }
.products-grid__items > .product--grid:nth-child(7),
.products-list__items > .product--compact:nth-child(7)  { animation-delay: 0.33s; }
.products-grid__items > .product--grid:nth-child(8),
.products-list__items > .product--compact:nth-child(8)  { animation-delay: 0.38s; }
.products-grid__items > .product--grid:nth-child(9),
.products-list__items > .product--compact:nth-child(9)  { animation-delay: 0.43s; }
.products-grid__items > .product--grid:nth-child(10),
.products-list__items > .product--compact:nth-child(10) { animation-delay: 0.48s; }
.products-grid__items > .product--grid:nth-child(11),
.products-list__items > .product--compact:nth-child(11) { animation-delay: 0.53s; }
.products-grid__items > .product--grid:nth-child(12),
.products-list__items > .product--compact:nth-child(12) { animation-delay: 0.58s; }
.products-grid__items > .product--grid:nth-child(13),
.products-list__items > .product--compact:nth-child(13) { animation-delay: 0.63s; }
.products-grid__items > .product--grid:nth-child(14),
.products-list__items > .product--compact:nth-child(14) { animation-delay: 0.68s; }
.products-grid__items > .product--grid:nth-child(15),
.products-list__items > .product--compact:nth-child(15) { animation-delay: 0.73s; }
.products-grid__items > .product--grid:nth-child(16),
.products-list__items > .product--compact:nth-child(16) { animation-delay: 0.78s; }
.products-grid__items > .product--grid:nth-child(17),
.products-list__items > .product--compact:nth-child(17) { animation-delay: 0.83s; }
.products-grid__items > .product--grid:nth-child(18),
.products-list__items > .product--compact:nth-child(18) { animation-delay: 0.88s; }
.products-grid__items > .product--grid:nth-child(19),
.products-list__items > .product--compact:nth-child(19) { animation-delay: 0.93s; }
.products-grid__items > .product--grid:nth-child(20),
.products-list__items > .product--compact:nth-child(20) { animation-delay: 0.98s; }
.products-grid__items > .product--grid:nth-child(21),
.products-list__items > .product--compact:nth-child(21) { animation-delay: 1.03s; }
.products-grid__items > .product--grid:nth-child(22),
.products-list__items > .product--compact:nth-child(22) { animation-delay: 1.08s; }
.products-grid__items > .product--grid:nth-child(23),
.products-list__items > .product--compact:nth-child(23) { animation-delay: 1.13s; }
.products-grid__items > .product--grid:nth-child(24),
.products-list__items > .product--compact:nth-child(24) { animation-delay: 1.18s; }
.products-grid__items > .product--grid:nth-child(25),
.products-list__items > .product--compact:nth-child(25) { animation-delay: 1.23s; }
.products-grid__items > .product--grid:nth-child(26),
.products-list__items > .product--compact:nth-child(26) { animation-delay: 1.28s; }
.products-grid__items > .product--grid:nth-child(27),
.products-list__items > .product--compact:nth-child(27) { animation-delay: 1.33s; }
.products-grid__items > .product--grid:nth-child(28),
.products-list__items > .product--compact:nth-child(28) { animation-delay: 1.38s; }
.products-grid__items > .product--grid:nth-child(29),
.products-list__items > .product--compact:nth-child(29) { animation-delay: 1.43s; }
.products-grid__items > .product--grid:nth-child(30),
.products-list__items > .product--compact:nth-child(30) { animation-delay: 1.48s; }
.products-grid__items > .product--grid:nth-child(31),
.products-list__items > .product--compact:nth-child(31) { animation-delay: 1.53s; }
.products-grid__items > .product--grid:nth-child(32),
.products-list__items > .product--compact:nth-child(32) { animation-delay: 1.58s; }
.products-grid__items > .product--grid:nth-child(33),
.products-list__items > .product--compact:nth-child(33) { animation-delay: 1.63s; }
.products-grid__items > .product--grid:nth-child(34),
.products-list__items > .product--compact:nth-child(34) { animation-delay: 1.68s; }
.products-grid__items > .product--grid:nth-child(35),
.products-list__items > .product--compact:nth-child(35) { animation-delay: 1.73s; }
.products-grid__items > .product--grid:nth-child(36),
.products-list__items > .product--compact:nth-child(36) { animation-delay: 1.78s; }
.products-grid__items > .product--grid:nth-child(37),
.products-list__items > .product--compact:nth-child(37) { animation-delay: 1.83s; }
.products-grid__items > .product--grid:nth-child(38),
.products-list__items > .product--compact:nth-child(38) { animation-delay: 1.88s; }
.products-grid__items > .product--grid:nth-child(39),
.products-list__items > .product--compact:nth-child(39) { animation-delay: 1.93s; }
.products-grid__items > .product--grid:nth-child(40),
.products-list__items > .product--compact:nth-child(40) { animation-delay: 1.98s; }

@media (prefers-reduced-motion: reduce) {
    .products-grid__items > .product--grid,
    .products-list__items > .product--compact {
        animation: none !important;
        opacity: 1 !important;
    }
}

/* ================================================================
   BUTOANE GLOBALE
   ================================================================ */
.btn,
button[type="submit"],
button[type="button"] {
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    color: var(--text-light) !important;
    background: linear-gradient(135deg, #2a1a06, #3d2810) !important;
    border: 2px solid var(--brass) !important;
    border-radius: 3px !important;
    letter-spacing: 1px;
    text-transform: uppercase;
    transition: 0.4s !important;
    box-shadow: 0 3px 12px rgba(0,0,0,0.3) !important;
}

.btn:hover, .btn:focus,
button[type="submit"]:hover, button[type="button"]:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 20px rgba(0,0,0,0.35), 0 0 15px rgba(138,98,0,0.25) !important;
    border-color: var(--copper) !important;
    color: var(--brass-light) !important;
    background: linear-gradient(135deg, #3d2810, #5a3c18) !important;
}

.btn-primary {
    background: linear-gradient(135deg, #2a1a06, #3d2810) !important;
    border-color: var(--brass) !important;
    color: var(--text-light) !important;
}

/* Quantity stepper +/- — Bootstrap seteaza culoare inchisa pe <strong>,
   o resetam explicit la culoarea luminoasa */
.quantity-spinner__button strong {
    color: var(--text-light) !important;
    -webkit-text-fill-color: var(--text-light) !important;
}

/* btn-link — trebuie transparent, fara gradient (ex: buton lupa search) */
.btn-link,
button.btn-link {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    color: var(--copper) !important;
    text-transform: none !important;
    transform: none !important;
}
.btn-link:hover,
button.btn-link:hover {
    background: transparent !important;
    color: var(--brass) !important;
    transform: none !important;
    box-shadow: none !important;
}

/* btn-close (Bootstrap) — specificitate crescuta (0,2,1) ca sa bata button[type="button"] (0,1,1) */
button[type="button"].btn-close,
button.btn-close {
    background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23f5f5dc'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center / 1em auto no-repeat !important;
    border: none !important;
    box-shadow: none !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    transform: none !important;
    opacity: 0.8 !important;
}
button[type="button"].btn-close:hover,
button.btn-close:hover { opacity: 1 !important; transform: none !important; box-shadow: none !important; }

/* btn-close din search drawer — stilizat steampunk (vezi sectiunea SEARCH DRAWER) */

/* Iconite SVG din header (lupa, cont, cos) — culoare luminoasa pe bg inchis */
.header__action svg,
.header__action .icon,
.header__action-icon svg {
    color: var(--text-light) !important;
    fill: var(--text-light) !important;
}

/* ================================================================
   SEARCH DRAWER — bara de cautare
   ================================================================ */
.search-drawer,
.offcanvas-top.search-drawer {
    background-color: var(--bg-panel) !important;
    border-bottom: 2px solid var(--border) !important;
}

/* Layout: body (cu form) + header (cu X) pe aceeasi linie */
.search-drawer .offcanvas-content {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
}

/* Ascundem offcanvas-header-ul subtire (slicer-ul bej) */
.search-drawer .offcanvas-header {
    order: 2 !important;
    flex-shrink: 0 !important;
    width: auto !important;
    height: auto !important;
    padding: 0 12px !important;
    background-color: transparent !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.search-drawer .offcanvas-title {
    display: none !important;
}

/* Body — ocupa spatiul ramas */
.search-drawer .offcanvas-body {
    order: 1 !important;
    flex: 1 !important;
    padding: 0 !important;
}

/* Div-ul .search are bg alb din platforma — il resetam */
.search-drawer .search {
    background-color: transparent !important;
}

/* Inputul de search — culoare usor mai deschisa decat fundalul */
.search-drawer .search__input,
.search-drawer input[type="search"] {
    background-color: var(--bg-main) !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 14px 16px !important;
    font-size: 1rem !important;
    height: auto !important;
    color: var(--text) !important;
}
.search-drawer .search__input:focus,
.search-drawer input[type="search"]:focus {
    background-color: var(--bg-main) !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}

/* X nativ webkit din input[type=search] — ascuns */
.search-drawer input[type="search"]::-webkit-search-cancel-button,
.search-drawer input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none !important;
    display: none !important;
}

/* Butonul de clear al platformei — ascuns */
.search-drawer .search__button-clear {
    display: none !important;
}

/* Butonul lupa (submit) — transparent, fara border */
.search-drawer .search__button {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 16px !important;
    color: var(--text-sub) !important;
    transform: none !important;
}
.search-drawer .search__button:hover {
    color: var(--brass) !important;
    transform: none !important;
    box-shadow: none !important;
    background: transparent !important;
}
.search-drawer .search__button svg,
.search-drawer .search__button .icon {
    color: var(--text-sub) !important;
    fill: var(--text-sub) !important;
}

/* ── X STEAMPUNK — buton inchidere search drawer ──
   Specificitate (0,3,1) ca sa bata button[type="button"].btn-close (0,2,1) */
.search-drawer button[type="button"].btn-close,
.search-drawer button.btn-close {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    background: radial-gradient(circle at 40% 35%, #5a3c18, #2a1a06) !important;
    border: 2px solid var(--brass) !important;
    box-shadow:
        0 0 8px rgba(139, 69, 19, 0.5),
        inset 0 1px 0 rgba(200, 160, 60, 0.2) !important;
    opacity: 1 !important;
    transform: none !important;
    cursor: pointer !important;
    transition: box-shadow 0.25s, border-color 0.25s !important;
    flex-shrink: 0 !important;
    /* Inlocuim SVG-ul Bootstrap cu X-ul nostru via pseudo */
    color: transparent !important;
    font-size: 0 !important;
}
.search-drawer button[type="button"].btn-close::after,
.search-drawer button.btn-close::after {
    content: '✕' !important;
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    font-size: 0.9rem !important;
    color: var(--brass-light) !important;
    line-height: 1 !important;
    display: block !important;
    text-shadow: 0 0 6px rgba(196, 122, 58, 0.6) !important;
}
.search-drawer button[type="button"].btn-close:hover,
.search-drawer button.btn-close:hover {
    border-color: var(--copper-light) !important;
    box-shadow:
        0 0 14px rgba(184, 115, 51, 0.7),
        inset 0 1px 0 rgba(200, 160, 60, 0.3) !important;
    transform: none !important;
    background: radial-gradient(circle at 40% 35%, #7a5020, #3d2810) !important;
}

/* Autocomplete dropdown — alb → pergament */
.search__list,
[class*="search__autocomplete"],
[data-search-autocomplete-results],
.search__results,
.autocomplete__list {
    background-color: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    box-shadow: 0 6px 20px rgba(0,0,0,0.25) !important;
    color: var(--text) !important;
}

.search__list-item,
.search__result,
.autocomplete__item {
    background-color: var(--bg-card) !important;
    color: var(--text) !important;
    border-bottom: 1px solid rgba(200,160,96,0.3) !important;
}

.search__list-item:hover,
.search__result:hover,
.autocomplete__item:hover {
    background-color: var(--bg-panel) !important;
    color: var(--brass) !important;
}

/* ================================================================
   BUTON PREFERINTE COOKIE-URI — platforma
   Selectori mirrored din cookie-policy.css pentru specificitate maxima
   ================================================================ */
.cookie-policy-overlay .btn-link,
.cookie-policy-overlay .cookie-policy-overlay__preferences,
.cookie-policy-overlay .cookie-policy-overlay__preferences--desktop,
.cookie-policy-overlay .cookie-policy-overlay__preferences--mobile {
    color: #ffffff !important;
    opacity: 0.9 !important;
    text-decoration: none !important;
}
.cookie-policy-overlay .btn-link:hover,
.cookie-policy-overlay .cookie-policy-overlay__preferences:hover,
.cookie-policy-overlay .cookie-policy-overlay__preferences--desktop:hover,
.cookie-policy-overlay .cookie-policy-overlay__preferences--mobile:hover {
    color: #ffffff !important;
    opacity: 1 !important;
    text-decoration: underline !important;
}

/* ================================================================
   COOKIE BANNER — #cookie-banner (cookie-consent.js)
   Regulile globale button[type="button"] cu !important suprascriu
   inline styles. Resetam explicit pentru acest banner.
   ================================================================ */
#cookie-banner button[type="button"],
#cookie-banner button {
    font-family: inherit !important;
    font-size: 0.8rem !important;
    letter-spacing: 0.5px !important;
    text-transform: none !important;
    cursor: pointer !important;
    transition: 0.2s !important;
    box-shadow: none !important;
    transform: none !important;
    padding: 8px 20px !important;
    border-radius: 2px !important;
}

/* Buton Refuz */
#cookie-banner button:first-of-type {
    background: transparent !important;
    border: 2px solid rgba(181, 166, 66, 0.35) !important;
    color: #f5f5dc !important;
}
#cookie-banner button:first-of-type:hover {
    background: rgba(181, 166, 66, 0.08) !important;
    border-color: rgba(181, 166, 66, 0.65) !important;
    color: #f5f5dc !important;
    transform: none !important;
    box-shadow: none !important;
}

/* Buton Accept */
#cookie-banner button:last-of-type {
    background: rgba(181, 166, 66, 0.18) !important;
    border: 2px solid #b5a642 !important;
    color: #b5a642 !important;
}
#cookie-banner button:last-of-type:hover {
    background: rgba(181, 166, 66, 0.32) !important;
    border-color: #d4a800 !important;
    color: #d4a800 !important;
    transform: none !important;
    box-shadow: none !important;
}

/* ================================================================
   FILTRE SIDEBAR — Steampunk Enhanced
   Titluri: cerneala #1A0F00 · Optiuni: piele #4E2C10
   Checkboxes: surub alama → nivet cupru aprins
   Separator: teava cupru dubla
   ================================================================ */

/* Titluri sectiuni filtre — cerneala inchisa */
.facets-sidebar .facet__title > span, .facet__title > span {
    background: var(--bg-main) !important;
    color: #1A0F00 !important;
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    font-size: 0.82rem !important;
    font-weight: 700 !important;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 0 8px 0 0 !important;
}

.facets-sidebar .facet__title, .facet__title {
    border-left: 3px solid #8B4513 !important;
    color: #1A0F00 !important;
    padding-left: 6px !important;
}

/* Separator — linie dubla de cupru cu punct central */
.facets-sidebar .facet__title::before, .facet__title::before {
    background: linear-gradient(to right,
        transparent 0%,
        #b87333 15%,
        #b87333 85%,
        transparent 100%) !important;
    height: 2px !important;
    box-shadow: 0 3px 0 rgba(184,115,51,0.25) !important;
}

.facet__title .icon, .facet__title svg, .facet__title i {
    color: var(--brass) !important;
    fill: var(--brass) !important;
}

/* Optiuni filtre — text piele */
.facets-sidebar .facet__option, .facets-sidebar .facet__path {
    padding-left: 10px !important;
    color: #4E2C10 !important;
    font-family: 'Metamorphous', Georgia, serif !important;
}
.facet__option label, .facet__option span {
    color: #4E2C10 !important;
    font-family: 'Metamorphous', Georgia, serif !important;
}

/* Tag-uri tip pill (ex: Material — Metal, Wood, Fabric...) */
.facet__options--tag {
    background: transparent !important;
}
.facet__option--tag,
.facets-sidebar .facet__option--tag {
    padding-left: 10px !important;
    background: transparent !important;
    border: none !important;
    outline: none !important;
}

.facet__option--tag a,
.facets-sidebar .facet__option--tag a {
    display: inline-block !important;
    background: linear-gradient(135deg, var(--bg-card), var(--bg-panel)) !important;
    color: #4E2C10 !important;
    border: 1.5px solid #c8902a !important;
    border-radius: 3px !important;
    padding: 3px 10px !important;
    font-family: 'Metamorphous', Georgia, serif !important;
    font-size: 0.82rem !important;
    text-decoration: none !important;
    transition: all 0.25s ease !important;
    box-shadow: inset 0 1px 0 rgba(255,220,120,0.25), 0 1px 3px rgba(0,0,0,0.18) !important;
}

.facet__option--tag a:hover,
.facets-sidebar .facet__option--tag a:hover {
    background: linear-gradient(135deg, #d4a850, #c8902a) !important;
    color: var(--text-light) !important;
    border-color: #e8b840 !important;
    box-shadow: 0 0 8px rgba(200,144,42,0.45), 0 1px 4px rgba(0,0,0,0.25) !important;
    transform: translateY(-1px) !important;
}

/* Opțiune tag activă/selectată — bec aprins steampunk */
.facet__option--tag a.active,
.facet__option--active .facet__option--tag a,
.facets-sidebar .facet__option--tag a.active,
.facets-sidebar .facet__option--active .facet__option--tag a {
    background: linear-gradient(135deg, #ff8c00, #c04800) !important;
    color: #fffdf0 !important;
    border-color: #ffe060 !important;
    font-weight: 700 !important;
    box-shadow:
        0 0  6px rgba(255, 220,   0, 0.90),
        0 0 14px rgba(255, 140,   0, 0.65),
        0 0 28px rgba(255,  80,   0, 0.35),
        0 1px 4px rgba(0, 0, 0, 0.30) !important;
    transform: none !important;
}

/* Hover — glow cupru incins */
.facets-sidebar .facet__option:hover,
.facet__option:hover {
    background: rgba(184, 115, 51, 0.10) !important;
    border-radius: 2px;
    transition: background 0.2s ease;
}

.facets-sidebar .facet__option:hover label,
.facet__option:hover label {
    color: #8B4513 !important;
    text-shadow: 0 0 10px rgba(184, 115, 51, 0.55) !important;
}

/* ── BEC STEAMPUNK: stins (sticlă fumurie vizibilă) → aprins (incandescent) ── */
.facets-sidebar input[type="checkbox"],
.facet__option input[type="checkbox"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 20px !important;
    height: 20px !important;
    border-radius: 50% 50% 38% 38% / 58% 58% 42% 42% !important;
    border: 2px solid #c8902a !important;
    /* Sticla fumurie — vizibila ca bec, usor inchisa */
    background: radial-gradient(
        circle at 35% 28%,
        #c8b478 0%,
        #9e7830 30%,
        #6a4a10 60%,
        #3e2404 85%,
        #1e0c00 100%
    ) !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
    box-shadow:
        inset 0 2px 5px rgba(0, 0, 0, 0.45),
        inset 0 -2px 4px rgba(200, 160, 60, 0.20),
        0 0 0 1px rgba(200, 144, 42, 0.35),
        0 1px 3px rgba(0, 0, 0, 0.35) !important;
    transition: all 0.35s ease !important;
    vertical-align: middle !important;
}

/* Bifat — bec aprins, incandescent */
.facets-sidebar input[type="checkbox"]:checked,
.facet__option input[type="checkbox"]:checked {
    background: radial-gradient(
        circle at 36% 30%,
        #fffdf0 0%,
        #fff280 12%,
        #ffcc30 32%,
        #ff8c00 58%,
        #c04800 80%,
        #6a2000 100%
    ) !important;
    border-color: #ffe060 !important;
    box-shadow:
        inset 0 1px 6px rgba(255, 255, 220, 0.35),
        0 0  6px rgba(255, 220,   0, 1.00),
        0 0 14px rgba(255, 160,   0, 0.85),
        0 0 28px rgba(255, 100,   0, 0.55),
        0 0 50px rgba(255,  60,   0, 0.25),
        0 2px 5px rgba(0, 0, 0, 0.35) !important;
}

/* ================================================================
   SIDEBAR CATALOG — rama masina de scris
   ================================================================ */
.catalog__aside, .page__aside, .facets-sidebar, .catalog__sidebar {
    background-color: var(--bg-panel) !important;
    color: var(--text) !important;
    border-right: 3px double #c8902a !important;
    border-left: 2px solid #e8c870 !important;
    box-shadow:
        inset -4px 0 10px rgba(0,0,0,0.07),
        3px 0 8px rgba(0,0,0,0.12) !important;
}

/* ================================================================
   MAIN CONTENT
   ================================================================ */
main, .main, #main-content, .page-content,
[class*="page__content"], .page__body, .catalog__products {
    background-color: transparent !important;
    color: var(--text) !important;
}

/* ================================================================
   HEADING PAGINA — animatie handwriting
   ================================================================ */
@keyframes steamHandwrite {
    from {
        clip-path: inset(0 100% 0 0);
        opacity: 0.2;
    }
    to {
        clip-path: inset(0 0% 0 0);
        opacity: 1;
    }
}

.page__heading, h1.page__heading,
.catalog__heading, h1.catalog__heading {
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    font-size: 2.6rem !important;
    background: linear-gradient(90deg,
        #8B4513 0%, #c47a3a 30%, #e8b840 55%, #c47a3a 75%, #8B4513 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    animation: steamHandwrite 1.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards !important;
}

/* ================================================================
   HEADING SECTIUNI PRODUSE
   ================================================================ */
.products-compact > h2, .products-slider > h2,
.widget h2, .widget h3,
[class*="section"] > h2, [class*="section"] > h3 {
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    color: var(--brass) !important;
    border-bottom: 2px solid var(--border) !important;
    padding-bottom: 10px !important;
    letter-spacing: 3px;
    text-transform: uppercase;
}

/* ================================================================
   TABS PRODUS
   ================================================================ */
.nav-tabs { border-bottom: 2px solid var(--border) !important; background-color: transparent !important; }

.nav-tabs-content, .tab-content, .tab-pane {
    background-color: var(--bg-panel) !important;
    border: 1px solid var(--border) !important;
    border-top: none !important;
    color: var(--text) !important;
    padding: 1.5rem !important;
}

/* ================================================================
   TABEL DETALII PRODUS
   ================================================================ */
table, .table { color: var(--text) !important; background-color: var(--bg-panel) !important; }

th {
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    color: var(--brass) !important;
    border-color: var(--border) !important;
    background-color: var(--bg-card) !important;
}

td { border-color: var(--border) !important; color: var(--text) !important; background-color: var(--bg-panel) !important; }

.table-striped > tbody > tr:nth-of-type(odd) > *,
tbody tr:nth-child(odd) td, tbody tr:nth-child(odd) {
    background-color: var(--bg-card) !important;
    color: var(--text) !important;
    --bs-table-striped-bg: var(--bg-card) !important;
    --bs-table-striped-color: var(--text) !important;
    --bs-table-accent-bg: var(--bg-card) !important;
}

tbody tr:nth-child(even) td, tbody tr:nth-child(even) {
    background-color: var(--bg-panel) !important;
    color: var(--text) !important;
}

tbody tr:hover td, tbody tr:hover { background-color: rgba(138, 98, 0, 0.12) !important; }

/* ================================================================
   ACCORDION
   Bootstrap classes + Platform BEM classes (accordion__item etc.)
   ================================================================ */
.accordion, .accordion-item,
.accordion__item, .accordion__item--flush,
.accordion__item--description {
    background-color: var(--bg-panel) !important;
    border-color: var(--border) !important;
    color: var(--text) !important;
}

.accordion-button,
.accordion__header, .accordion__header button {
    background: var(--bg-card) !important;
    color: var(--text) !important;
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    letter-spacing: 1px;
    border-color: var(--border) !important;
    box-shadow: none !important;
}

.accordion-button:not(.collapsed) { background-color: var(--brass) !important; color: var(--text-light) !important; }
.accordion-body,
.accordion__collapse,
.accordion__body { background-color: var(--bg-panel) !important; color: var(--text) !important; }

/* Justified text in description */
.accordion__collapse p,
.accordion-body p, .accordion__body p,
.accordion__collapse li,
.accordion-body li, .accordion__body li { text-align: justify !important; }

/* Exceptie: cutia dark Repere Tehnice (div cu inline style #111111) */
.accordion__collapse [style*="111111"] li,
.accordion__collapse [style*="111111"] p { text-align: left !important; }

/* ================================================================
   FOOTER
   ================================================================ */
.footer, footer {
    background-color: #34544F !important;
    border-top: 3px solid var(--copper-light) !important;
    color: var(--text-light) !important;
}

.footer__widgets, .footer__widgets > section {
    background-color: #34544F !important;
    border-bottom: 1px solid var(--border-dark) !important;
    color: var(--text-light) !important;
}

.footer__blocks { background-color: #34544F !important; color: var(--text-light) !important; }
.footer a { color: var(--copper-light) !important; }
.footer a:hover { color: var(--brass-light) !important; }

.footer h5, .footer h6, .footer .h5, .footer .h6, .footer__heading {
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    color: var(--brass-light) !important;
    letter-spacing: 2px;
}

.footer p, .footer span, .footer li {
    color: #c4a574 !important;
    font-family: 'Metamorphous', Georgia, serif !important;
}

/* ================================================================
   INPUTURI / FORMULARE
   ================================================================ */
input, textarea, select, .form-control, .form-select, .search-inline__form input {
    background-color: #f0e4c4 !important;
    color: var(--text) !important;
    border: 1px solid var(--border) !important;
    font-family: 'Metamorphous', Georgia, serif !important;
    border-radius: 2px !important;
}

input:focus, textarea:focus, select:focus, .form-control:focus, .form-select:focus {
    background-color: #f8efd8 !important;
    color: var(--text) !important;
    border-color: var(--brass) !important;
    box-shadow: 0 0 0 3px rgba(138, 98, 0, 0.2) !important;
    outline: none !important;
}

input::placeholder, textarea::placeholder { color: #7a5a30 !important; opacity: 0.8 !important; }

/* ================================================================
   CARDURI GENERICE
   ================================================================ */
.card { background-color: var(--bg-card) !important; border-color: var(--border) !important; color: var(--text) !important; }
.card-body { background-color: var(--bg-card) !important; color: var(--text) !important; }
.card-header {
    background-color: var(--bg-panel) !important;
    border-bottom-color: var(--border) !important;
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    color: var(--brass) !important;
}
.card-footer { background-color: var(--bg-panel) !important; border-top-color: var(--border) !important; color: var(--text) !important; }

/* ================================================================
   DROPDOWN-URI
   ================================================================ */
.dropdown-menu, .autocomplete-results, .search-results__dropdown {
    background-color: #f0e4c4 !important;
    border: 1px solid var(--border) !important;
    box-shadow: 0 8px 25px rgba(0,0,0,0.25) !important;
}

.dropdown-item, .dropdown-item a { color: var(--text) !important; font-family: 'Metamorphous', Georgia, serif !important; }
.dropdown-item:hover, .dropdown-item:focus { background-color: rgba(138, 98, 0, 0.12) !important; color: var(--brass) !important; }
.dropdown-divider { border-color: var(--border) !important; }

/* ================================================================
   PAGINARE
   ================================================================ */
.page-link {
    background-color: var(--bg-card) !important;
    border-color: var(--border) !important;
    color: var(--copper) !important;
    font-family: 'Metamorphous', Georgia, serif !important;
}
.page-link:hover { background-color: var(--bg-panel) !important; border-color: var(--brass) !important; color: var(--brass) !important; }
.page-item.active .page-link { background-color: var(--brass) !important; border-color: var(--copper) !important; color: var(--text-light) !important; }

/* ================================================================
   ALERTE
   ================================================================ */
.alert {
    background-color: #e8d8a8 !important;
    border-color: var(--border) !important;
    color: var(--text) !important;
    font-family: 'Metamorphous', Georgia, serif !important;
}
.alert-success { border-left: 4px solid #4a7a4a !important; }
.alert-warning  { border-left: 4px solid var(--brass) !important; }
.alert-danger, .alert-error { border-left: 4px solid #8a3a3a !important; }

/* ================================================================
   DIVERSE
   ================================================================ */
hr { border-color: var(--border) !important; opacity: 0.6; }
.text-muted, .text-secondary { color: #5a3a10 !important; }
.bg-white, .bg-light, .bg-gray-100 { background-color: var(--bg-panel) !important; color: var(--text) !important; }
section, .container, .container-fluid { background-color: transparent; color: var(--text); }

/* ================================================================
   MODAL
   ================================================================ */
.modal-content { background-color: var(--bg-panel) !important; border: 1px solid var(--border) !important; color: var(--text) !important; }
.modal-header {
    border-bottom-color: var(--border) !important;
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    background-color: var(--bg-card) !important;
    color: var(--text) !important;
}
.modal-title { color: var(--brass) !important; font-family: 'Cinzel Decorative', Georgia, serif !important; }
.modal-footer { border-top-color: var(--border) !important; background-color: var(--bg-card) !important; }
.modal-backdrop { background-color: rgba(52, 84, 79, 0.75) !important; }

@media (max-width: 767px) {
    .modal-dialog {
        width: calc(100vw - 1rem) !important;
        max-width: calc(100vw - 1rem) !important;
        margin: 0.5rem auto !important;
    }

    .modal-content {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    .modal-body {
        overflow-x: hidden !important;
        word-break: break-word;
    }
}

/* ================================================================
   COOKIE POLICY (platforma)
   ================================================================ */
.cookie-policy, [class*="cookie-policy"] {
    background-color: var(--bg-panel) !important;
    border-top: 2px solid var(--copper) !important;
    color: var(--text) !important;
    font-family: 'Metamorphous', Georgia, serif !important;
}

/* ================================================================
   CART / WISHLIST / OFFCANVAS
   ================================================================ */
.cart-summary, .wishlist, .offcanvas {
    background-color: var(--bg-panel) !important;
    border-color: var(--border) !important;
    color: var(--text) !important;
}

.offcanvas-header {
    border-bottom: 1px solid var(--border) !important;
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    color: var(--brass) !important;
    background-color: var(--bg-card) !important;
}

/* ================================================================
   SORT / SELECT CATALOG
   ================================================================ */
.catalog-actions select, .catalog-actions .form-select {
    background-color: var(--bg-card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}

.catalog-actions .btn, .catalog-actions button {
    background: linear-gradient(135deg, #2a1a06, #3d2810) !important;
    color: var(--text-light) !important;
    border-color: var(--border) !important;
}

/* ================================================================
   GALERIE PRODUS — thumbnails
   Nu atingem layout-ul principal (Splide slider imagini mari).
   Doar facem toate thumbnailurile vizibile.
   ================================================================ */

/* Track-ul principal: overflow:hidden explicit - slide-urile sa nu iasa */
.product-summary__main-images .splide__track {
    overflow: hidden !important;
}

/* Track thumbnailuri: overflow visible - toate se vad */
.product-summary__thumbnails--ttb .splide__track {
    overflow: visible !important;
    height: auto !important;
    width: 100% !important;
}

/* Lista thumbnailuri: wrap + transform blocat */
.product-summary__thumbnails--ttb .splide__list {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    transform: none !important;
    height: auto !important;
    gap: 6px !important;
    width: 100% !important;
}

/* Thumbnail: 90px patrat, border steampunk */
.product-summary__thumbnails--ttb .splide__slide {
    width: 90px !important;
    min-width: 90px !important;
    height: 90px !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
    display: block !important;
    overflow: hidden !important;
    border: 1px solid var(--border) !important;
    transition: border-color 0.2s !important;
}

.product-summary__thumbnails--ttb .splide__slide:hover,
.product-summary__thumbnails--ttb .splide__slide.is-active {
    border-color: var(--brass) !important;
}

.product-summary__thumbnails--ttb .splide__slide img,
.product-summary__thumbnails--ttb .splide__slide figure {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    margin: 0 !important;
    display: block !important;
}

.product-summary__thumbnails--ttb .splide__arrows,
.product-summary__thumbnails--ttb .splide__pagination { display: none !important; }

/* ================================================================
   PRETURI PAGINA PRODUS — contrast + umbra text
   ================================================================ */
.product-summary__info--price-gross {
    color: #2D1B02 !important;
    font-size: 1.65rem !important;
    font-weight: 900 !important;
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    text-shadow: none !important;
}

.product-summary__info--old-price-gross {
    color: #8a7060 !important;
    opacity: 0.8 !important;
    font-size: 0.95rem !important;
    text-decoration: line-through !important;
    font-family: 'Metamorphous', Georgia, serif !important;
}

.product-summary__info--price-row {
    display: flex !important;
    align-items: baseline !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
}

/* ================================================================
   TEXT GRI → GALBEN AURIU
   ================================================================ */
.breadcrumb-item.active,
.breadcrumb-item.active > span,
.breadcrumb-item + .breadcrumb-item::before { color: #5a3a10 !important; opacity: 1 !important; }

.product-attributes__value, .product-attributes__name { color: #5a3a10 !important; }

.product-summary__info--sku,
.product-summary__info--sku span,
.product-summary__info--shipping { color: #5a3a10 !important; font-style: italic; }

/* Descriere catalog (text sub titlul categoriei) */
.catalog__description,
.catalog__heading + p,
.catalog-description,
[class*="catalog__desc"],
.page__description,
.category__description,
.category-summary__description-collapse,
.category-summary__description-collapse *,
.brand-summary__description p,
.brand-summary__description li {
    color: var(--text) !important;
    opacity: 1 !important;
}

.brand-summary__description p,
.brand-summary__description li { text-align: justify !important; }

/* ================================================================
   BLOG — Titlu steampunk + border ornamentat cu colțuri
   ================================================================ */

/* ── Titlu BLOG injectat deasupra articolelor ── */
.widget-articles .widget-header {
    display: block;
    text-align: center;
    padding-bottom: 16px;
}

.widget-articles .widget-header::before {
    content: '⚙ BLOG ⚙';
    display: block;
    font-family: 'Cinzel Decorative', Georgia, serif;
    font-size: clamp(1.5rem, 3vw, 2.2rem);
    font-weight: 700;
    color: var(--brass);
    letter-spacing: 0.35em;
    text-align: center;
    text-shadow: 1px 2px 4px rgba(0,0,0,0.18);
    padding: 28px 0 14px;
}

.widget-articles .widget-header::after {
    content: '';
    display: block;
    height: 2px;
    background: linear-gradient(
        90deg,
        transparent     0%,
        var(--border)  10%,
        var(--brass)   30%,
        var(--copper)  50%,
        var(--brass)   70%,
        var(--border)  90%,
        transparent   100%
    );
    margin: 0 60px;
}

/* ── Articol — container cu border dublu ornamentat ── */
/* Grid pe ul = randuri de inaltime egala; li flex = article umple celula */
.widget-articles ul {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 24px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.widget-articles li {
    display: flex !important;
    width: 100% !important;
}

@media (max-width: 767px) {
    .widget-articles ul {
        grid-template-columns: 1fr !important;
    }
}

.article {
    position: relative;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    width: 100% !important;
    padding: 28px 24px 20px !important;
    background: var(--bg-card) !important;
    border: 2px solid var(--brass) !important;
    box-shadow:
        0 0 0 1px var(--border),
        inset 0 0 0 1px rgba(200, 160, 96, 0.35),
        0 6px 18px rgba(45, 27, 2, 0.15);
    transition: box-shadow 0.3s ease, transform 0.25s ease;
}

.article:hover {
    box-shadow:
        0 0 0 1px var(--brass),
        inset 0 0 0 1px rgba(200, 160, 96, 0.5),
        0 10px 26px rgba(45, 27, 2, 0.25);
    transform: translateY(-2px);
}

/* ── Colțuri ornamentate — stil ┌ ┐ └ ┘ ── */

/* Colț stânga-sus */
.article::before {
    content: '';
    position: absolute;
    top: 5px;
    left: 5px;
    width: 22px;
    height: 22px;
    border-top: 3px solid var(--copper);
    border-left: 3px solid var(--copper);
    pointer-events: none;
    z-index: 2;
}

/* Colț dreapta-jos */
.article::after {
    content: '';
    position: absolute;
    bottom: 5px;
    right: 5px;
    width: 22px;
    height: 22px;
    border-bottom: 3px solid var(--copper);
    border-right: 3px solid var(--copper);
    pointer-events: none;
    z-index: 2;
}

/* article__data creste si impinge article__info la baza */
.article__data {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
}

/* Colț dreapta-sus (via .article__data, nearest positioned ancestor = .article) */
.article__data::before {
    content: '';
    position: absolute;
    top: 5px;
    right: 5px;
    width: 22px;
    height: 22px;
    border-top: 3px solid var(--copper);
    border-right: 3px solid var(--copper);
    pointer-events: none;
    z-index: 2;
}

/* Colț stânga-jos (via .article__data) */
.article__data::after {
    content: '';
    position: absolute;
    bottom: 5px;
    left: 5px;
    width: 22px;
    height: 22px;
    border-bottom: 3px solid var(--copper);
    border-left: 3px solid var(--copper);
    pointer-events: none;
    z-index: 2;
}

/* ── Linie decorativă sub titlul articolului ── */
.article__name {
    position: relative;
    margin-bottom: 10px;
    padding-bottom: 10px;
}

.article__name::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(
        90deg,
        transparent,
        var(--brass)  30%,
        var(--copper) 50%,
        var(--brass)  70%,
        transparent
    );
}

/* ── Titlu link articol ── */
.article__name-link {
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
    color: var(--brass) !important;
    letter-spacing: 0.04em;
}

.article__name-link:hover {
    color: var(--copper) !important;
    text-decoration: none !important;
}

/* ── Excerpt ── */
.article__excerpt {
    flex: 1 !important;
    color: var(--text-sub) !important;
    font-family: 'Metamorphous', Georgia, serif !important;
    font-size: 0.88rem !important;
    line-height: 1.65 !important;
    margin-bottom: 12px;
    text-align: justify !important;
}

/* ── Metadate: dată, categorie, autor ── */
.article__info {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px 10px !important;
    align-items: center !important;
    margin-top: auto !important;
    padding-top: 10px !important;
    font-size: 0.78rem !important;
    color: var(--text-sub) !important;
    font-family: 'Metamorphous', Georgia, serif !important;
}

.article__date { color: var(--text-sub) !important; }

.article__category-link {
    color: var(--copper) !important;
    font-weight: 600 !important;
    border: 1px solid var(--copper) !important;
    padding: 1px 7px !important;
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    transition: background 0.2s, color 0.2s;
}

.article__category-link:hover {
    background: var(--copper) !important;
    color: var(--text-light) !important;
}

.article__author {
    color: var(--text-sub) !important;
    font-style: italic;
}

/* ================================================================
   MOBILE — strip-uri mereu vizibile + border responsive
   ================================================================ */
@media (max-width: 767px) {
    .product--grid {
        border: none !important;
    }

    .product--grid::before {
        top: -4px !important;
        left: -4px !important;
        right: -4px !important;
        bottom: -4px !important;
        border: 4px solid transparent !important;
        border-image-source: url('https://f.cdnmp.net/401754215/content/border.png?rv=1778711632') !important;
        border-image-slice: 40 !important;
        border-image-repeat: round !important;
    }

    .product--slider {
        border: none !important;
    }

    .product--slider::before {
        top: -4px !important;
        left: -4px !important;
        right: -4px !important;
        bottom: -4px !important;
        border: 4px solid transparent !important;
        border-image-source: url('https://f.cdnmp.net/401754215/content/border.png?rv=1778711632') !important;
        border-image-slice: 40 !important;
        border-image-repeat: round !important;
    }

    .product--grid .grid-image {
        position: static !important;
    }

    .product--grid .product__data {
        position: static !important;
        pointer-events: none !important;
        padding-bottom: 52px !important;
    }

    .product--grid .grid-image__actions {
        position: absolute !important;
        bottom: 0 !important;
        top: auto !important;
        left: 0 !important;
        right: auto !important;
        width: 50% !important;
        height: 41px !important;
        z-index: 1000 !important;
        opacity: 1 !important;
    }

    .product--grid .grid-image__save-wishlist {
        z-index: 1001 !important;
        opacity: 1 !important;
    }

    .product--grid .product__actions {
        position: absolute !important;
        bottom: 0 !important;
        top: auto !important;
        right: 0 !important;
        left: auto !important;
        width: 50% !important;
        height: 41px !important;
        z-index: 999 !important;
        opacity: 1 !important;
    }

    .product--grid .product__add-to-cart {
        z-index: 1001 !important;
        opacity: 1 !important;
    }
}

/* Desktop override final — pune inimioara deasupra oricarui layer al platformei */
.catalog__products .product--grid .grid-image,
.products-grid__items .product--grid .grid-image,
.product--grid .grid-image {
    position: static !important;
}

.catalog__products .product--grid .grid-image__actions,
.products-grid__items .product--grid .grid-image__actions,
.product--grid .grid-image__actions {
    z-index: 1001 !important;
}

/* Card overflow: hidden taia strip-ul — forțăm visible pe card si compact */
.product--grid,
.product--compact {
    overflow: visible !important;
}

/* ================================================================
   LANSĂRI — titlu secțiune: mărit, centrat, steampunk
   ================================================================ */
#widget-w_b1n7sbaayr > div:nth-child(1) > div > h2 {
    text-align: center !important;
    margin-bottom: 24px !important;
    display: block !important;
    width: 100% !important;
}

#widget-w_b1n7sbaayr > div:nth-child(1) > div > h2 > span {
    color: rgb(139, 69, 19) !important;
    -webkit-text-fill-color: rgb(139, 69, 19) !important;
    font-family: 'Cinzel Decorative', Georgia, serif !important;
    font-size: clamp(1.8rem, 3.5vw, 2.8rem) !important;
    font-weight: 900 !important;
    letter-spacing: 6px !important;
    text-align: center !important;
    display: block !important;
    text-shadow: 1px 2px 6px rgba(0,0,0,0.18) !important;
}

/* ================================================================
   BANNER PAGINARE — puncte active vizibile (Splide .is-active)
   Vizate: bannere cu slider în afara sliderului principal hero.
   ================================================================ */

/* Punct inactiv — sticlă fumurie */
.widget-banner .splide__pagination__page,
.bslot-multi-banner .splide__pagination__page,
#widget-w_b1n7sbaayr .splide__pagination__page,
[id^="widget-"] .splide__pagination__page {
    width: 11px !important;
    height: 11px !important;
    border-radius: 50% !important;
    background: rgba(200, 160, 96, 0.30) !important;
    border: 2px solid rgba(200, 160, 96, 0.60) !important;
    opacity: 1 !important;
    transition: background 0.3s ease, border-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease !important;
    margin: 0 4px !important;
}

/* Punct activ — bec aprins steampunk */
.widget-banner .splide__pagination__page.is-active,
.bslot-multi-banner .splide__pagination__page.is-active,
#widget-w_b1n7sbaayr .splide__pagination__page.is-active,
[id^="widget-"] .splide__pagination__page.is-active {
    background: rgb(139, 69, 19) !important;
    border-color: #e8b840 !important;
    transform: scale(1.45) !important;
    box-shadow:
        0 0  6px rgba(232, 184,  64, 0.90),
        0 0 14px rgba(255, 140,   0, 0.65),
        0 0 26px rgba(255,  80,   0, 0.30) !important;
}

/* IMPORTANT. Daca nu mai apare mesajul care anunta ca nu mai platesc shipping de aici
este problema!!!
=============
=============
=============*/
.header-sticky {
  padding-top: 0 !important;
  transition: none !important;
}
body.header-sticky {
  padding-top: 0 !important;
}



/* ================================================================
   STEAMHEART — grid-image + slider-image (precomenzi + lansari)
   ================================================================ */
.grid-image__save-wishlist svg,
.grid-image__save-wishlist img,
.grid-image__save-wishlist i,
.slider-image__save-wishlist svg,
.slider-image__save-wishlist img,
.slider-image__save-wishlist i {
    display: none !important;
}

.grid-image__save-wishlist,
.slider-image__save-wishlist {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
    cursor: pointer !important;
    padding: 0 !important;
    color: transparent !important;
    font-size: 0 !important;
}

.grid-image__save-wishlist::before,
.slider-image__save-wishlist::before {
    content: '' !important;
    display: block !important;
    width: 28px !important;
    height: 28px !important;
    background-image: url('https://f.cdnmp.net/401754215/content/steamheart.png?rv=1777887586') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    transition: opacity 0.2s !important;
    flex-shrink: 0 !important;
}

.grid-image__save-wishlist:hover::before,
.slider-image__save-wishlist:hover::before {
    opacity: 0.75 !important;
}

/* ================================================================
   FLOATING BUTTON — Oscar AI Agent
   Pozitionarea si stilizarea Oscar se face via JS (oscar-shadow-fix.js)
   direct pe .app-container si .floating-button din shadow DOM.
   Aici doar setam z-index-ul host-ului.
   ================================================================ */

#mp-chatbot-root {
    z-index: 9999 !important;
}

/* ── CHECKOUT: butonul e în Light DOM (div > div > section > button).
   Îl stilizăm direct: Oscar ca background, X vizibil deasupra. ── */
button.floating-button {
    position: relative !important;
    width: 56px !important;
    height: 56px !important;
    border-radius: 50% !important;
    background-image: url('https://f.cdnmp.net/401754215/content/oscar.png?rv=1778704755') !important;
    background-color: #34544F !important;
    background-size: 90% !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    border: 2px solid #8B4513 !important;
    box-shadow: 0 4px 14px rgba(0,0,0,0.4), 0 0 0 1px rgba(200,160,96,0.25) !important;
    outline: none !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease !important;
}

button.floating-button:hover {
    border-color: #c8602a !important;
    box-shadow:
        0 8px 22px rgba(0,0,0,0.45),
        0 0 18px rgba(183,65,14,0.4),
        0 0 0 2px rgba(200,160,96,0.4) !important;
    transform: scale(1.08) rotate(-8deg) !important;
}

/* Ascundem iconița nativă de chat, lăsăm X-ul vizibil */
button.floating-button .mp-icon--bubbleMessageText {
    display: none !important;
}

button.floating-button .mp-icon--altClose {
    color: #f5f5dc !important;
    position: relative !important;
    z-index: 1 !important;
}

button.floating-button .notification-badge {
    display: none !important;
}

/* Mobile — Oscar deasupra săgeților */
@media (max-width: 767px) {
    #mp-chatbot-root {
        bottom: 134px !important;
        right: 19px !important;
        width: 50px !important;
        height: 50px !important;
        max-width: calc(100vw - 24px) !important;
    }

    button.floating-button {
        width: 50px !important;
        height: 50px !important;
    }
}