/*
 * SHOPPERLISTIC SA — style.integration.css
 * Single source. Clean. No conflicts. May 2026.
 */

/* ── TOKENS ─────────────────────────────────── */
:root {
    --sl-navy:   #0A1628;
    --sl-navy2:  #132238;
    --sl-or:     #F97316;
    --sl-or2:    #EA6C0E;
    --sl-red:    #DC2626;
    --sl-gray:   #6B7280;
    --sl-off:    #F7F8FA;
    --sl-max:    1360px;
    --sl-px:     24px;
    --sl-font:   'Nunito', system-ui, sans-serif;
}

/* ── GLOBAL ──────────────────────────────────── */
html { overflow-x: hidden; }
body { font-family: var(--sl-font) !important; background: var(--sl-off) !important; overflow-x: clip !important; }
*, *::before, *::after { box-sizing: border-box; }
h1,h2,h3,h4,h5,h6,p,a,span,li,button,input,label { font-family: var(--sl-font) !important; }

/* All product section containers → consistent max-width */
.container, .container-xl, .container-xxl,
.container-fluid.tp-container-fluid {
    max-width: var(--sl-max) !important;
    padding-left: var(--sl-px) !important;
    padding-right: var(--sl-px) !important;
    margin: 0 auto !important; width: 100% !important;
}

/* ── HEADER ──────────────────────────────────── */
.tp-header-area, .tp-header-main, header.header { background: var(--sl-navy) !important; }
.tp-header-top, .tp-header-top-inner { background: #060B14 !important; }
.tp-header-sticky { background: var(--sl-navy) !important; box-shadow: 0 2px 20px rgba(0,0,0,.3) !important; }
.tp-header-search button, .tp-search-btn { background: var(--sl-or) !important; border-color: var(--sl-or) !important; }
.tp-header-action-badge { background: var(--sl-or) !important; color:#fff !important; font-weight:800 !important; }
.tp-header-bottom, .tp-header-bottom.tp-header-bottom-border {
    background: var(--sl-navy2) !important;
    border-top: 1px solid rgba(255,255,255,.06) !important;
    width: 100% !important;
}
.main-menu ul > li > a { color: rgba(255,255,255,.75) !important; font-weight:600 !important; }
.main-menu ul > li > a:hover { color:#fff !important; }
.tp-cat-menu-btn, button[data-bb-toggle="init-categories-dropdown"] {
    background: var(--sl-or) !important; color:#fff !important; font-weight:700 !important; border-radius:8px !important;
}

/* ── CATEGORY DROPDOWN ───────────────────────── */
.tp-category-menu-content { background: var(--sl-navy) !important; border-radius:12px !important; z-index:9999 !important; }
.tp-category-menu nav ul li > a,
.tp-category-menu nav ul li a.has-mega-menu {
    background-color: var(--sl-navy) !important;
    color: rgba(255,255,255,.85) !important;
    border-bottom-color: rgba(255,255,255,.06) !important;
    font-size:13px !important; font-weight:600 !important;
}
.tp-category-menu nav ul li > a:hover,
.tp-category-menu nav ul li a.has-mega-menu:hover {
    background-color: rgba(255,255,255,.07) !important; color: var(--sl-or) !important;
}
.tp-category-menu nav ul li .tp-submenu,
.tp-category-menu nav ul li ul.tp-submenu { background:#fff !important; border-radius:10px !important; box-shadow:0 8px 32px rgba(0,0,0,.12) !important; }
.tp-category-menu nav ul li .tp-submenu li a,
.tp-category-menu nav ul li ul.tp-submenu li a {
    background-color:#fff !important; color:#111827 !important;
    font-size:13px !important; font-weight:600 !important; border-bottom-color:#f3f4f6 !important;
}
.tp-category-menu nav ul li .tp-submenu li a:hover { background:#FFF7ED !important; color:var(--sl-or) !important; }
.tp-category-menu-wrapper,.tp-mega-menu,.tp-category-menu li .tp-submenu,
.tp-category-menu li ul { z-index:9999 !important; overflow:visible !important; }

/* ── NEWSLETTER KILL ─────────────────────────── */
#newsletter-popup, .newsletter-popup, .modal.newsletter-popup,
.tp-newsletter-popup, .tp-newsletter-area, .tp-newsletter-2-area { display:none !important; visibility:hidden !important; }
body.modal-open .modal-backdrop { display:none !important; }
body.modal-open { overflow:auto !important; padding-right:0 !important; }

/* ── BREADCRUMB ──────────────────────────────── */
section.breadcrumb__area, .breadcrumb__area, .tp-breadcrumb-area {
    background:transparent !important; background-color:transparent !important;
    background-image:none !important; padding:14px 0 !important; min-height:unset !important;
}
.breadcrumb__area .breadcrumb__bg { display:none !important; }
.breadcrumb-item, .breadcrumb-item a { color:#555 !important; font-size:13px !important; }
.tp-breadcrumb-title, .breadcrumb__area h1 { font-size:22px !important; font-weight:900 !important; color:var(--sl-navy) !important; }

/* ── HERO — FULL WIDTH 3 COLUMN ──────────────── */
.slh {
    display: grid;
    grid-template-columns: 230px 1fr 230px;
    width: 100%;
    min-height: 500px;
    overflow: hidden;
}

/* LEFT sidebar */
.slh__left {
    background: var(--sl-navy);
    display: flex; flex-direction: column;
    border-right: 1px solid rgba(255,255,255,.06);
    min-width: 0;
}
.slh__left-hd {
    padding: 14px 20px;
    font-size: 12px; font-weight: 800; color: #fff;
    text-transform: uppercase; letter-spacing: .05em;
    border-bottom: 1px solid rgba(255,255,255,.08);
    background: rgba(255,255,255,.04);
}
.slh__left-list { list-style: none; margin: 0; padding: 0; flex: 1; }
.slh__left-list li a {
    display: flex !important; align-items: center !important; gap: 10px !important;
    padding: 9px 16px !important;
    color: rgba(255,255,255,.78) !important;
    background: transparent !important; background-color: transparent !important;
    font-size: 13px !important; font-weight: 600 !important; text-decoration: none !important;
    border-bottom: 1px solid rgba(255,255,255,.04) !important;
    transition: all .15s !important;
}
.slh__left-list li a:hover { background: rgba(255,255,255,.07) !important; color: var(--sl-or) !important; }
.slh__left-icon { font-size: 16px; flex-shrink: 0; width: 22px; text-align: center; }
.slh__left-name { flex: 1; }
.slh__left-arrow { color: rgba(255,255,255,.25); font-size: 14px; }

/* CENTER banner */
.slh__center {
    background: linear-gradient(140deg, #0A1628 0%, #11213b 55%, #0d1b31 100%);
    padding: 44px 48px 36px;
    display: flex; flex-direction: column; justify-content: center;
    position: relative; overflow: hidden;
}
.slh__badge {
    display: inline-block; width: fit-content;
    background: rgba(249,115,22,.12); border: 1px solid rgba(249,115,22,.35);
    color: var(--sl-or); font-size: 11px; font-weight: 800; letter-spacing: .04em;
    padding: 6px 16px; border-radius: 50px; margin-bottom: 18px;
}
.slh__h1 {
    font-size: clamp(38px, 4.2vw, 60px) !important;
    font-weight: 900 !important; color: #fff !important;
    line-height: 1.06 !important; letter-spacing: -1.5px !important;
    margin: 0 0 18px !important;
}
.slh__h1-orange { color: var(--sl-or) !important; display: block; }
.slh__desc {
    font-size: 15px !important; color: rgba(255,255,255,.6) !important;
    line-height: 1.6 !important; margin: 0 0 26px !important; max-width: 400px;
}
.slh__btns { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.slh__btn-main {
    background: var(--sl-or); color: #fff !important; text-decoration: none;
    padding: 12px 22px; border-radius: 10px; font-size: 14px; font-weight: 800; transition: background .2s;
}
.slh__btn-main:hover { background: var(--sl-or2); }
.slh__btn-ghost {
    background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18);
    color: #fff !important; text-decoration: none;
    padding: 12px 22px; border-radius: 10px; font-size: 14px; font-weight: 700; transition: background .2s;
}
.slh__btn-ghost:hover { background: rgba(255,255,255,.14); }
.slh__tiktok {
    display: inline-flex; align-items: center; gap: 6px;
    color: rgba(255,255,255,.5) !important; text-decoration: none !important;
    font-size: 12px; font-weight: 600; margin-bottom: 20px;
}
.slh__tiktok:hover { color: rgba(255,255,255,.9) !important; }
.slh__saving-card {
    background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);
    border-radius: 12px; padding: 12px 18px; width: fit-content;
}
.slh__saving-lbl { font-size: 10px; font-weight: 700; color: rgba(255,255,255,.4); text-transform: uppercase; letter-spacing: .06em; display: block; }
.slh__saving-amt { font-size: 28px; font-weight: 900; color: var(--sl-or); display: block; line-height: 1.1; }
.slh__saving-prod { font-size: 11px; color: rgba(255,255,255,.45); display: block; }
.slh__badge-pct {
    position: absolute; top: 24px; right: 24px;
    width: 86px; height: 86px; border-radius: 50%;
    background: var(--sl-or); display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    box-shadow: 0 0 0 8px rgba(249,115,22,.18);
}
.slh__badge-pct span { font-size: 9px; font-weight: 800; color: rgba(255,255,255,.8); letter-spacing: .04em; }
.slh__badge-pct strong { font-size: 26px; font-weight: 900; color: #fff; line-height: 1; }

/* RIGHT promo cards */
.slh__right {
    display: flex; flex-direction: column;
    border-left: 1px solid rgba(0,0,0,.06);
    position: relative; z-index: 10; /* above widget */
}
.slh__card {
    flex: 1; display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    text-decoration: none; padding: 24px 16px; gap: 2px;
    transition: filter .2s;
}
.slh__card:hover { filter: brightness(.95); }
.slh__card--warm { background: #FFF3E0; border-bottom: 1px solid #FFD8A8; }
.slh__card--dark { background: #180028; }
.slh__card-sup { font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; display: block; text-align: center; }
.slh__card--warm .slh__card-sup { color: var(--sl-or); }
.slh__card--dark .slh__card-sup { color: rgba(255,255,255,.4); }
.slh__card-ttl { font-size: 17px; font-weight: 900; text-align: center; display: block; margin: 3px 0; }
.slh__card--warm .slh__card-ttl { color: var(--sl-navy); }
.slh__card-sub { font-size: 12px; text-align: center; display: block; }
.slh__card--warm .slh__card-sub { color: #92400E; }
.slh__card--dark .slh__card-sub { color: rgba(255,255,255,.4); }

/* Hero responsive */
@media(max-width:1100px) { .slh { grid-template-columns: 200px 1fr 190px; } }
@media(max-width:880px)  { .slh { grid-template-columns: 1fr; } .slh__left { display: none; } .slh__right { flex-direction: row; min-height: 120px; } .slh__card { min-height: 110px; } }

/* ── FLASH SALE WIDGET — push left so it doesn't overlap hero right panel ── */
body > a[style*="fixed"][style*="right: 0"],
body > div[style*="fixed"][style*="right: 0"] { z-index: 5 !important; }

/* ── SECTION SPACING ─────────────────────────── */
.tp-product-area, .tp-flash-sale-area, .tp-product-offer-area,
.ecommerce-products, .ecommerce-flash-sale, .tp-feature-area,
.tp-deal-area, .tp-tab-area { background: var(--sl-off); }

/* ── PRODUCT CARDS ───────────────────────────── */
.tp-product-item, .product-item {
    border-radius: 14px !important; border: 1px solid #EAECF0 !important;
    background: #fff !important; box-shadow: 0 2px 10px rgba(0,0,0,.05) !important;
    transition: transform .2s, box-shadow .2s !important; overflow: hidden !important;
}
.tp-product-item:hover { transform: translateY(-3px) !important; box-shadow: 0 8px 24px rgba(0,0,0,.09) !important; }
.tp-product-thumb { background: #f9f9f9 !important; }
.tp-product-title a { font-size: 13px !important; font-weight: 700 !important; color: #111827 !important; }
.tp-product-title a:hover { color: var(--sl-or) !important; }
.tp-product-price { font-size: 15px !important; font-weight: 900 !important; color: var(--sl-navy) !important; }
.tp-product-price del { font-size: 11px !important; color: #9CA3AF !important; font-weight: 400 !important; }
.tp-product-add-cart-btn { background: var(--sl-navy) !important; color: #fff !important; font-weight: 700 !important; border-radius: 8px !important; font-size: 12px !important; }
.tp-product-add-cart-btn:hover { background: var(--sl-or) !important; }

/* ── FLASH SALE — 5 columns ──────────────────── */
.tp-product-offer-area .swiper-slide,
.tp-product-offer-slider .swiper-slide,
.tp-product-offer-slider-active .swiper-slide { width: 20% !important; min-width: 20% !important; }
.tp-product-offer-area .swiper-wrapper { overflow: visible !important; }
@media(max-width:1199px){.tp-product-offer-area .swiper-slide{width:25%!important;min-width:25%!important;}}
@media(max-width:991px) {.tp-product-offer-area .swiper-slide{width:33.33%!important;min-width:33.33%!important;}}
@media(max-width:767px) {.tp-product-offer-area .swiper-slide{width:50%!important;min-width:50%!important;}}

/* ── GRAB A DEAL ─────────────────────────────── */
.slgd { background: #F3F0FF; padding: 40px 0; width: 100%; }
.slgd__inner { max-width: var(--sl-max); margin: 0 auto; padding: 0 var(--sl-px); }
.slgd__hd { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.slgd__hd-l { display: flex; align-items: center; gap: 12px; }
.slgd__heading { font-size: 22px; font-weight: 900; color: var(--sl-navy); margin: 0; }
.slgd__rbadge { background: #7C3AED; color: #fff; font-size: 9px; font-weight: 900; padding: 3px 10px; border-radius: 50px; letter-spacing: .07em; }
.slgd__today-txt { font-size: 13px; font-weight: 700; color: #7C3AED; }
.slgd__body { display: grid; grid-template-columns: 260px 1fr; gap: 20px; }
.slgd__sb { background: #fff; border-radius: 16px; padding: 20px; border: 1px solid #DDD6FE; }
.slgd__sb-lbl { font-size: 10px; font-weight: 800; color: #aaa; text-transform: uppercase; letter-spacing: .07em; margin: 0 0 12px; }
.slgd__sr { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 10px; background: #f9f9f9; border: 1px solid transparent; margin-bottom: 8px; }
.slgd__sr--on { background: #F5F3FF; border-color: #C4B5FD; }
.slgd__sr-ico { font-size: 18px; }
.slgd__sr-info { flex: 1; }
.slgd__sr-info strong { display: block; font-size: 13px; font-weight: 800; color: var(--sl-navy); }
.slgd__sr-info span { font-size: 11px; color: #888; }
.slgd__sr-now { font-size: 9px; font-weight: 900; color: #7C3AED; border: 1px solid #7C3AED; padding: 2px 7px; border-radius: 50px; white-space: nowrap; }
.slgd__why { background: #F5F3FF; border-radius: 10px; padding: 14px; margin-top: 14px; }
.slgd__why strong { display: block; font-size: 11px; font-weight: 800; color: #5B21B6; margin-bottom: 4px; }
.slgd__why p { font-size: 11px; color: #7C3AED; margin: 0; line-height: 1.5; }
/* Dark deal panel */
.slgd__panel {
    background: linear-gradient(140deg, #0d0022 0%, #1a0040 100%);
    border-radius: 20px; padding: 28px 32px;
    border: 1px solid rgba(124,58,237,.25);
    box-shadow: 0 8px 40px rgba(124,58,237,.12);
    display: flex; flex-direction: column; min-height: 380px;
}
.slgd__panel-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; }
.slgd__live { display: flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 800; color: #F87171; }
.slgd__dot { width: 8px; height: 8px; border-radius: 50%; background: #EF4444; animation: slgd-p 1.2s ease-in-out infinite; }
@keyframes slgd-p{0%,100%{opacity:1}50%{opacity:.2}}
.slgd__timer { font-size: 17px; font-weight: 900; color: rgba(255,255,255,.9); background: rgba(255,255,255,.08); padding: 4px 14px; border-radius: 8px; }
.slgd__content { display: grid; grid-template-columns: 200px 1fr; gap: 24px; align-items: center; flex: 1; margin-bottom: 20px; }
.slgd__img-box { background: rgba(255,255,255,.06); border-radius: 16px; aspect-ratio: 1/1; display: flex; align-items: center; justify-content: center; overflow: hidden; position: relative; }
.slgd__img-box img { width: 100%; height: 100%; object-fit: contain; padding: 12px; }
.slgd__pct-badge { position: absolute; top: 10px; right: 10px; background: #EF4444; color: #fff; font-size: 12px; font-weight: 900; padding: 3px 9px; border-radius: 6px; }
.slgd__name { font-size: 20px; font-weight: 700; color: #fff; margin: 0 0 14px; line-height: 1.4; }
.slgd__prices { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; }
.slgd__price { font-size: 38px; font-weight: 900; color: var(--sl-or); line-height: 1; }
.slgd__orig { font-size: 18px; color: rgba(255,255,255,.3); text-decoration: line-through; }
.slgd__save-chip { background: rgba(239,68,68,.15); border: 1px solid rgba(239,68,68,.3); color: #F87171; font-size: 13px; font-weight: 800; padding: 3px 10px; border-radius: 50px; }
.slgd__stock-lbl { font-size: 12px; font-weight: 700; color: var(--sl-or); display: block; margin-bottom: 5px; }
.slgd__bar { height: 8px; background: rgba(255,255,255,.1); border-radius: 50px; overflow: hidden; }
.slgd__fill { height: 100%; background: linear-gradient(90deg, var(--sl-or), #FBBF24); border-radius: 50px; }
.slgd__btn { display: block; background: #EF4444; color: #fff !important; font-size: 18px; font-weight: 900; text-align: center; padding: 18px; border-radius: 14px; text-decoration: none; transition: background .2s; margin-top: 20px; }
.slgd__btn:hover { background: #DC2626; }
.slgd__empty { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 8px; }
@media(max-width:767px){ .slgd__body{grid-template-columns:1fr;} .slgd__panel{order:-1;} .slgd__content{grid-template-columns:1fr;} }

/* ── TRUST BAR ───────────────────────────────── */
.sl-trust-bar { background: #fff; border-top: 1px solid #EAECF0; border-bottom: 1px solid #EAECF0; padding: 12px 0; width: 100%; }
.sl-trust-bar__inner { max-width: var(--sl-max); margin: 0 auto; padding: 0 var(--sl-px); display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.sl-trust-bar__item { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 150px; }
.sl-trust-bar__title { font-size: 13px; font-weight: 800; color: var(--sl-navy); display: block; }
.sl-trust-bar__sub { font-size: 11px; color: var(--sl-gray); display: block; }

/* ── CATEGORY ICONS ──────────────────────────── */
.sl-caticons { background: #fff; padding: 20px 0; border-bottom: 1px solid #EAECF0; width: 100%; }
.sl-caticons__inner { max-width: var(--sl-max); margin: 0 auto; padding: 0 var(--sl-px); display: grid; grid-template-columns: repeat(8,1fr); gap: 10px; }
.sl-caticons__item { display: flex; flex-direction: column; align-items: center; gap: 7px; text-decoration: none; padding: 14px 6px; border-radius: 14px; border: 1px solid transparent; transition: all .2s; }
.sl-caticons__item:hover { border-color: #EAECF0; background: #FAFAFA; transform: translateY(-2px); }
.sl-caticons__icon-wrap { width: 80px; height: 80px; border-radius: 18px; display: flex; align-items: center; justify-content: center; }
.sl-caticons__icon-wrap span { font-size: 38px; line-height: 1; }
.sl-caticons__name { font-size: 12px; font-weight: 700; color: var(--sl-navy); text-align: center; line-height: 1.3; }
.sl-caticons__count { font-size: 10px; color: var(--sl-gray); }
@media(max-width:991px){ .sl-caticons__inner{grid-template-columns:repeat(4,1fr);} }
@media(max-width:575px){ .sl-caticons__inner{grid-template-columns:repeat(4,1fr);gap:6px;} .sl-caticons__icon-wrap{width:60px;height:60px;} .sl-caticons__icon-wrap span{font-size:28px;} }

/* ── TIKTOK SHOP ─────────────────────────────── */
.sl-ttshop { background: #0d0015; padding: 44px 0; width: 100%; }
.sl-ttshop__inner { max-width: var(--sl-max); margin: 0 auto; padding: 0 var(--sl-px); }
.sl-ttshop__header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; margin-bottom: 20px; }
.sl-ttshop__brand { display: flex; align-items: center; gap: 14px; }
.sl-ttshop__live-badge { display: inline-flex; align-items: center; gap: 5px; font-size: 9px; font-weight: 800; color: #FE2C55; text-transform: uppercase; letter-spacing: .08em; margin-bottom: 3px; }
.sl-ttshop__live-dot { width: 6px; height: 6px; border-radius: 50%; background: #FE2C55; animation: tt-p 1.2s ease-in-out infinite; }
@keyframes tt-p{0%,100%{opacity:1}50%{opacity:.3}}
.sl-ttshop__title { font-size: 20px; font-weight: 900; color: #fff; margin: 0 0 2px; }
.sl-ttshop__handle { font-size: 12px; color: rgba(255,255,255,.45); margin: 0; }
.sl-ttshop__stats { display: flex; gap: 24px; }
.sl-ttshop__stat strong { font-size: 18px; font-weight: 900; color: #25F4EE; display: block; line-height: 1; }
.sl-ttshop__stat span { font-size: 10px; color: rgba(255,255,255,.4); }
.sl-ttshop__header-ctas { display: flex; gap: 10px; }
.sl-ttshop__btn { font-size: 12px; font-weight: 800; padding: 8px 16px; border-radius: 50px; text-decoration: none; transition: all .2s; }
.sl-ttshop__btn--follow { background: transparent; border: 1.5px solid rgba(255,255,255,.3); color: #fff; }
.sl-ttshop__btn--shop { background: #FE2C55; color: #fff; border: 1.5px solid #FE2C55; }
.sl-ttshop__affiliate { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); border-radius: 10px; padding: 10px 16px; display: flex; align-items: center; gap: 10px; margin-bottom: 24px; flex-wrap: wrap; }
.sl-ttshop__affiliate span { font-size: 12px; color: rgba(255,255,255,.7); flex: 1; }
.sl-ttshop__affiliate a { font-size: 12px; font-weight: 800; color: #25F4EE; text-decoration: none; }
.sl-ttshop__grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 14px; margin-bottom: 28px; }
.sl-ttshop__card { text-decoration: none; display: block; }
.sl-ttshop__card-img { position: relative; aspect-ratio: 3/4; border-radius: 12px; overflow: hidden; background: #1a0030; margin-bottom: 10px; }
.sl-ttshop__card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.sl-ttshop__card:hover .sl-ttshop__card-img img { transform: scale(1.05); }
.sl-ttshop__card-overlay { position: absolute; bottom: 0; left: 0; right: 0; background: linear-gradient(to top, rgba(0,0,0,.8), transparent); padding: 20px 10px 8px; }
.sl-ttshop__views { font-size: 10px; color: rgba(255,255,255,.8); font-weight: 600; }
.sl-ttshop__live-chip { position: absolute; top: 8px; left: 8px; background: #FE2C55; color: #fff; font-size: 9px; font-weight: 900; padding: 2px 7px; border-radius: 4px; }
.sl-ttshop__card-name { font-size: 12px; font-weight: 600; color: rgba(255,255,255,.85); margin: 0 0 6px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.sl-ttshop__card-price { font-size: 14px; font-weight: 900; color: #25F4EE; }
.sl-ttshop__card-orig { font-size: 11px; color: rgba(255,255,255,.35); text-decoration: line-through; margin-left: 6px; }
.sl-ttshop__buy-btn { display: block; width: 100%; background: #FE2C55; color: #fff; font-size: 11px; font-weight: 800; text-align: center; padding: 7px; border-radius: 6px; margin-top: 8px; }
.sl-ttshop__footer { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; }
.sl-ttshop__footer-btn { font-size: 14px; font-weight: 800; padding: 12px 28px; border-radius: 50px; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; transition: all .2s; }
.sl-ttshop__footer-btn--primary { background: #FE2C55; color: #fff; }
.sl-ttshop__footer-btn--outline { background: transparent; border: 2px solid rgba(255,255,255,.3); color: #fff; }
@media(max-width:991px){ .sl-ttshop__grid{grid-template-columns:repeat(3,1fr);} }
@media(max-width:575px){ .sl-ttshop__grid{grid-template-columns:repeat(2,1fr);} .sl-ttshop__header-ctas{display:none;} }

/* ── PROMO BANNERS ───────────────────────────── */
.sl-promo-wrap { padding: 0 0 36px; width: 100%; }
.sl-promo-inner { max-width: var(--sl-max); margin: 0 auto; padding: 0 var(--sl-px); display: grid; gap: 16px; }
.sl-promo-cols-3 { grid-template-columns: repeat(3,1fr); }
.sl-promo-cols-2 { grid-template-columns: repeat(2,1fr); }
.sl-promo-banner { position: relative; border-radius: 18px; overflow: hidden; min-height: 180px; display: flex; align-items: flex-end; text-decoration: none; padding: 24px; transition: transform .2s, box-shadow .2s; }
.sl-promo-banner:hover { transform: translateY(-3px); box-shadow: 0 12px 32px rgba(0,0,0,.12); }
.sl-promo-bg-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.sl-promo-banner:hover .sl-promo-bg-img { transform: scale(1.05); }
.sl-promo-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,.65) 0%, rgba(0,0,0,.1) 60%); }
.sl-promo-content { position: relative; z-index: 1; }
.sl-promo-emoji { font-size: 32px; line-height: 1; margin-bottom: 8px; display: block; }
.sl-promo-banner-title { font-size: 20px; font-weight: 900; margin: 0 0 4px; line-height: 1.2; }
.sl-promo-banner-sub { font-size: 13px; margin: 0 0 12px; }
.sl-promo-banner-cta { display: inline-block; font-size: 12px; font-weight: 800; border: 2px solid; border-radius: 50px; padding: 5px 14px; }
@media(max-width:991px){ .sl-promo-cols-3{grid-template-columns:repeat(2,1fr);} }
@media(max-width:575px){ .sl-promo-cols-3,.sl-promo-cols-2{grid-template-columns:1fr;} }

/* ── WINTER SECTION ──────────────────────────── */
.sl-winter { background: linear-gradient(180deg,#EFF6FF 0%,#fff 100%); padding: 36px 0; width: 100%; }
.sl-winter__inner { max-width: var(--sl-max); margin: 0 auto; padding: 0 var(--sl-px); }
.sl-winter__header { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 20px; flex-wrap: wrap; gap: 12px; }
.sl-winter__badge { display: inline-block; background: #1E40AF; color: #fff; font-size: 10px; font-weight: 800; padding: 3px 12px; border-radius: 50px; margin-bottom: 6px; letter-spacing: .06em; }
.sl-winter__title { font-size: 24px; font-weight: 900; color: var(--sl-navy); margin: 0 0 4px; }
.sl-winter__sub { font-size: 13px; color: var(--sl-gray); margin: 0; }
.sl-winter__view-all { font-size: 13px; font-weight: 700; color: #1E40AF; text-decoration: none; }
.sl-winter__grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 16px; }
.sl-winter__card { text-decoration: none; display: block; }
.sl-winter__card-img { aspect-ratio: 1/1; background: #F3F4F6; border-radius: 14px; overflow: hidden; margin-bottom: 10px; display: flex; align-items: center; justify-content: center; }
.sl-winter__card-img img { width: 100%; height: 100%; object-fit: contain; padding: 8px; transition: transform .3s; }
.sl-winter__card:hover .sl-winter__card-img img { transform: scale(1.05); }
.sl-winter__card-name { font-size: 13px; font-weight: 700; color: #111827; margin: 0 0 6px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.sl-winter__price { font-size: 15px; font-weight: 900; color: var(--sl-navy); }
.sl-winter__orig { font-size: 11px; color: #9CA3AF; text-decoration: line-through; margin-left: 6px; }
@media(max-width:991px){ .sl-winter__grid{grid-template-columns:repeat(3,1fr);} }
@media(max-width:575px){ .sl-winter__grid{grid-template-columns:repeat(2,1fr);} }

/* ── B2B BANNER ──────────────────────────────── */
.sl-b2b { background: linear-gradient(135deg,#0A1628,#1E3A5F); padding: 56px 0; width: 100%; }
.sl-b2b__inner { max-width: var(--sl-max); margin: 0 auto; padding: 0 var(--sl-px); display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.sl-b2b__badge { display: inline-block; background: var(--sl-or); color: #fff; font-size: 10px; font-weight: 900; padding: 4px 14px; border-radius: 50px; letter-spacing: .07em; margin-bottom: 14px; }
.sl-b2b__title { font-size: clamp(22px,3vw,34px); font-weight: 900; color: #fff; margin: 0 0 12px; line-height: 1.15; }
.sl-b2b__sub { font-size: 15px; color: rgba(255,255,255,.7); margin: 0 0 24px; line-height: 1.6; }
.sl-b2b__features { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 28px; }
.sl-b2b__feature { font-size: 13px; font-weight: 700; color: rgba(255,255,255,.85); }
.sl-b2b__btn { display: inline-block; background: var(--sl-or); color: #fff !important; font-size: 15px; font-weight: 900; padding: 14px 28px; border-radius: 10px; text-decoration: none; transition: background .2s; }
.sl-b2b__btn:hover { background: var(--sl-or2); }
.sl-b2b__stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.sl-b2b__stat { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1); border-radius: 14px; padding: 22px 18px; text-align: center; }
.sl-b2b__stat strong { display: block; font-size: 26px; font-weight: 900; color: var(--sl-or); margin-bottom: 4px; }
.sl-b2b__stat span { font-size: 12px; color: rgba(255,255,255,.45); }
@media(max-width:767px){ .sl-b2b__inner{grid-template-columns:1fr;} .sl-b2b__visual{display:none;} }

/* ── BUTTONS ─────────────────────────────────── */
.btn-primary,.tp-btn,input[type="submit"],.checkout-btn { background:var(--sl-or) !important; border-color:var(--sl-or) !important; color:#fff !important; font-weight:700 !important; border-radius:8px !important; }
.btn-primary:hover,.tp-btn:hover { background:var(--sl-or2) !important; }
.tp-btn.tp-btn-2 { background:var(--sl-navy) !important; border-color:var(--sl-navy) !important; }
.tp-btn.tp-btn-2:hover { background:var(--sl-or) !important; border-color:var(--sl-or) !important; }
input:focus,textarea:focus,select:focus { border-color:var(--sl-or) !important; box-shadow:0 0 0 3px rgba(249,115,22,.1) !important; outline:none !important; }

/* ── FOOTER ──────────────────────────────────── */
.tp-footer-area,footer { background:var(--sl-navy) !important; color:rgba(255,255,255,.6) !important; }
.tp-footer-widget-title { font-weight:800 !important; font-size:15px !important; color:#fff !important; }
.tp-footer-area a,footer a { color:rgba(255,255,255,.55) !important; text-decoration:none !important; transition:color .2s !important; }
.tp-footer-area a:hover,footer a:hover { color:var(--sl-or) !important; }
.tp-copyright-area { background:#060B14 !important; border-top:1px solid rgba(255,255,255,.06) !important; }
.tp-copyright-text { color:rgba(255,255,255,.3) !important; font-size:12px !important; }
.tp-newsletter-area,.tp-newsletter-2-area { display:none !important; }

/* ── MOBILE GLOBAL ───────────────────────────── */
@media(max-width:575px) {
    :root { --sl-px: 16px; }
    .container { padding-left: var(--sl-px) !important; padding-right: var(--sl-px) !important; }
}

/* Flash sale 5 columns */
.tp-product-offer-area .swiper-wrapper { overflow:visible !important; display:flex !important; flex-wrap:nowrap !important; }
.tp-product-offer-area .swiper-slide,.tp-product-offer-slider-active .swiper-slide { width:20% !important; min-width:20% !important; max-width:20% !important; flex:0 0 20% !important; }
@media(max-width:1199px){.tp-product-offer-area .swiper-slide{width:25%!important;flex:0 0 25%!important;}}
@media(max-width:991px){.tp-product-offer-area .swiper-slide{width:33.33%!important;flex:0 0 33.33%!important;}}
@media(max-width:767px){.tp-product-offer-area .swiper-slide{width:50%!important;flex:0 0 50%!important;}}

/* Fix Botble raw-html-embed wrapper constraining custom sections */
.raw-html-embed { overflow: visible !important; max-width: 100% !important; width: 100% !important; padding: 0 !important; margin: 0 !important; }
.raw-html-embed > .slh { width: 100% !important; }
.raw-html-embed > .slgd { width: 100% !important; }
.raw-html-embed > .sl-trust-bar { width: 100% !important; }
.raw-html-embed > .sl-caticons { width: 100% !important; }
.raw-html-embed > .sl-ttshop { width: 100% !important; }
.raw-html-embed > .sl-promo-wrap { width: 100% !important; }

/* Also fix the page content wrapper Botble uses */
.post-content > .raw-html-embed,
.page-content > .raw-html-embed,
[class*="content"] > .raw-html-embed { width: 100% !important; max-width: 100% !important; }

/* ── Hero proportion fix ── */
.slh {
    grid-template-columns: 230px 1fr 250px !important;
    min-height: unset !important;
    align-items: stretch;
}
.slh__center {
    padding: 32px 40px !important;
    justify-content: flex-start !important;
    gap: 0 !important;
}
.slh__h1 { font-size: clamp(32px, 3.2vw, 48px) !important; margin-bottom: 12px !important; }
.slh__desc { margin-bottom: 20px !important; }
.slh__btns { margin-bottom: 14px !important; }
.slh__tiktok { margin-bottom: 16px !important; }
.slh__saving-card { padding: 10px 16px !important; }
.slh__saving-amt { font-size: 22px !important; }
.slh__badge-pct { width: 76px !important; height: 76px !important; top: 20px !important; right: 20px !important; }
.slh__badge-pct strong { font-size: 22px !important; }

/* Right cards — equal height split */
.slh__right { min-width: 0; }
.slh__card { min-height: 200px !important; }
.slh__card--warm { flex: 1 !important; }
.slh__card--dark { flex: 1 !important; }

/* ── Hero proportion fix ── */
.slh {
    grid-template-columns: 230px 1fr 250px !important;
    min-height: unset !important;
    align-items: stretch;
}
.slh__center {
    padding: 32px 40px !important;
    justify-content: flex-start !important;
    gap: 0 !important;
}
.slh__h1 { font-size: clamp(32px, 3.2vw, 48px) !important; margin-bottom: 12px !important; }
.slh__desc { margin-bottom: 20px !important; }
.slh__btns { margin-bottom: 14px !important; }
.slh__tiktok { margin-bottom: 16px !important; }
.slh__saving-card { padding: 10px 16px !important; }
.slh__saving-amt { font-size: 22px !important; }
.slh__badge-pct { width: 76px !important; height: 76px !important; top: 20px !important; right: 20px !important; }
.slh__badge-pct strong { font-size: 22px !important; }

/* Right cards — equal height split */
.slh__right { min-width: 0; }
.slh__card { min-height: 200px !important; }
.slh__card--warm { flex: 1 !important; }
.slh__card--dark { flex: 1 !important; }

/* ══ HERO PROPORTION OVERRIDE ══ */
html body .slh { grid-template-columns: 220px 1fr 240px !important; min-height: 420px !important; max-height: 480px !important; height: 460px !important; }
html body .slh__left { overflow-y: auto; }
html body .slh__left-list li a { padding: 8px 14px !important; font-size: 14px !important; }
html body .slh__left-hd { padding: 12px 16px !important; font-size: 13px !important; }
html body .slh__center { padding: 28px 36px !important; }
html body .slh__h1 { font-size: clamp(30px,3vw,44px) !important; margin-bottom:10px !important; }
html body .slh__desc { font-size:14px !important; margin-bottom:16px !important; }
html body .slh__btns { margin-bottom:12px !important; }
html body .slh__tiktok { margin-bottom:12px !important; }
html body .slh__saving-card { padding:8px 14px !important; }
html body .slh__saving-amt { font-size:20px !important; }
html body .slh__badge-pct { width:72px !important; height:72px !important; top:16px !important; right:16px !important; }
html body .slh__badge-pct strong { font-size:20px !important; }
html body .slh__card { min-height:0 !important; flex:1 !important; }

/* ══ PRODUCT GRID — fix row collapsing ══ */
.tp-product-thumb { min-height: 200px !important; display:flex !important; align-items:center !important; justify-content:center !important; }
.tp-product-thumb img { width:100% !important; height:200px !important; object-fit:contain !important; }
.tp-product-item { display:flex !important; flex-direction:column !important; height:100% !important; }

/* ══ CATEGORY ICONS — bigger font ══ */
html body .slh__left-list li a span.slh__left-name { font-size:14px !important; font-weight:600 !important; }

/* 5 products per row on all product sections */
.tp-product-area .row > div[class*="col-"],
.tp-tab-area .row > div[class*="col-"],
.ecommerce-products .row > div[class*="col-"] {
    width: 20% !important; flex: 0 0 20% !important; max-width: 20% !important;
}
@media(max-width:1199px){ .tp-product-area .row > div[class*="col-"]{width:25%!important;flex:0 0 25%!important;max-width:25%!important;} }
@media(max-width:991px){ .tp-product-area .row > div[class*="col-"]{width:33.33%!important;flex:0 0 33.33%!important;max-width:33.33%!important;} }
@media(max-width:767px){ .tp-product-area .row > div[class*="col-"]{width:50%!important;flex:0 0 50%!important;max-width:50%!important;} }

/* Flash sale 5 columns - nuclear override */
html body .tp-product-offer-area .swiper-wrapper { display:flex!important; overflow:visible!important; }
html body .tp-product-offer-area .swiper-slide { flex:0 0 20%!important; width:20%!important; min-width:20%!important; max-width:20%!important; }

/* 5 products per row */
.tp-product-area .row > div[class*="col-"],.tp-tab-area .row > div[class*="col-"],.ecommerce-products .row > div[class*="col-"]{width:20%!important;flex:0 0 20%!important;max-width:20%!important;}
@media(max-width:1199px){.tp-product-area .row > div[class*="col-"]{width:25%!important;flex:0 0 25%!important;max-width:25%!important;}}
@media(max-width:991px){.tp-product-area .row > div[class*="col-"]{width:33.33%!important;flex:0 0 33.33%!important;max-width:33.33%!important;}}
@media(max-width:767px){.tp-product-area .row > div[class*="col-"]{width:50%!important;flex:0 0 50%!important;max-width:50%!important;}}

/* Flash sale nuclear */
html body .tp-product-offer-area .swiper-wrapper{display:flex!important;overflow:visible!important;flex-wrap:nowrap!important;}
html body .tp-product-offer-area .swiper-slide{flex:0 0 20%!important;width:20%!important;min-width:20%!important;max-width:20%!important;}

/* Product grid row gap */
.tp-product-area .row, .ecommerce-products .row, .tp-tab-area .row { row-gap: 24px !important; }
.tp-product-item { height: 100% !important; }

/* Flash sale — show 5 slides */
html body .tp-product-offer-area .swiper-wrapper { overflow:visible!important; }
html body .tp-product-offer-area .swiper-slide { flex:0 0 20%!important; width:20%!important; max-width:20%!important; }

/* Product grid row gap */
.tp-product-area .row, .ecommerce-products .row, .tp-tab-area .row { row-gap: 24px !important; }
.tp-product-item { height: 100% !important; }

/* Flash sale — show 5 slides */
html body .tp-product-offer-area .swiper-wrapper { overflow:visible!important; }
html body .tp-product-offer-area .swiper-slide { flex:0 0 20%!important; width:20%!important; max-width:20%!important; }
.tp-product-area .row,.ecommerce-products .row,.tp-tab-area .row{row-gap:24px!important;}
.tp-product-item{height:100%!important;}
html body .tp-product-offer-area .swiper-wrapper{overflow:visible!important;}
html body .tp-product-offer-area .swiper-slide{flex:0 0 20%!important;width:20%!important;max-width:20%!important;}

/* Remove white box/frame around category dropdown */
.tp-header-category-dropdown,
.tp-category-menu-wrapper,
.tp-header-category .tp-category-menu-content,
.tp-category-dropdown-wrapper,
[class*="category-dropdown"] {
    background: #0A1628 !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
}
/* The white panel that wraps the whole dropdown */
.tp-header-category-toggle ~ div,
.tp-cat-menu-list,
.tp-category-menu-content nav {
    background: #0A1628 !important;
    border: none !important;
}

/* Product grid row gap */
.tp-product-area .row, .ecommerce-products .row, .tp-tab-area .row { row-gap: 24px !important; }
.tp-product-item { height: 100% !important; }

/* Flash sale — show 5 slides */
html body .tp-product-offer-area .swiper-wrapper { overflow:visible!important; }
html body .tp-product-offer-area .swiper-slide { flex:0 0 20%!important; width:20%!important; max-width:20%!important; }

/* Hero full-height fix — remove empty space in center */
.tp-slider-area,
.tp-slider-area > section,
.tp-slider-area > div { min-height: unset !important; }

/* The shortcode section wrapper */
section[style*="grid-template-columns"],
div[style*="grid-template-columns: 240px"] {
    min-height: unset !important;
    height: auto !important;
    align-items: stretch !important;
}

/* Hero full-height fix — remove empty space in center */
.tp-slider-area,
.tp-slider-area > section,
.tp-slider-area > div { min-height: unset !important; }

/* The shortcode section wrapper */
section[style*="grid-template-columns"],
div[style*="grid-template-columns: 240px"] {
    min-height: unset !important;
    height: auto !important;
    align-items: stretch !important;
}

/* ── FIX 1: Hero empty space — remove forced min-height, let sidebar drive height ── */
section[style*="grid-template-columns: 240px"] { min-height: unset !important; }
section[style*="grid-template-columns: 240px"] > div:nth-child(2) { min-height: unset !important; }

/* ── FIX 2: Category dropdown — kill white border/background completely ── */
.tp-header-category,
.tp-header-category > div,
.tp-header-category-dropdown,
.tp-category-menu-wrapper,
.tp-category-menu-content,
.tp-category-menu-content *,
.tp-header-cat-btn ~ div,
[data-bb-toggle="init-categories-dropdown"] ~ div,
.tp-category-menu { border: none !important; box-shadow: none !important; outline: none !important; }

/* Kill the white outer wrapper specifically */
.tp-header-category .tp-category-menu-content,
.tp-category-menu-content { background: #0A1628 !important; border: none !important; box-shadow: 0 8px 32px rgba(0,0,0,.4) !important; }

/* The white panel that sits behind the dropdown */
.tp-header-cat-dropdown-wrapper,
.tp-header-category > *:not(button) { background: transparent !important; border: none !important; box-shadow: none !important; }

/* ── FIX 3: Product grid row gap ── */
.tp-product-area .row { row-gap: 28px !important; margin-bottom: 28px !important; }
.ecommerce-products .row { row-gap: 28px !important; }
.tp-tab-content .row { row-gap: 28px !important; }
.tp-product-item { margin-bottom: 0 !important; }

/* ── FIX 4: Force 5 columns on product grids ── */
.tp-product-area .row > [class*="col-"],
.ecommerce-products .row > [class*="col-"],
.tp-tab-content .row > [class*="col-"] {
    width: 20% !important; flex: 0 0 20% !important; max-width: 20% !important;
    padding-left: 10px !important; padding-right: 10px !important;
}
@media(max-width:1199px){
    .tp-product-area .row > [class*="col-"],.ecommerce-products .row > [class*="col-"]{width:25%!important;flex:0 0 25%!important;max-width:25%!important;}
}
@media(max-width:991px){
    .tp-product-area .row > [class*="col-"],.ecommerce-products .row > [class*="col-"]{width:33.33%!important;flex:0 0 33.33%!important;max-width:33.33%!important;}
}
@media(max-width:767px){
    .tp-product-area .row > [class*="col-"],.ecommerce-products .row > [class*="col-"]{width:50%!important;flex:0 0 50%!important;max-width:50%!important;}
}

/* ── Dropdown white wrapper — exact selectors from DevTools ── */
.tp-header-category.tp-category-menu,
.tp-header-category.tp-category-menu.tp-header-category-toggle,
div.tp-header-category {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
nav.tp-category-menu-content {
    background: #0A1628 !important;
    border: none !important;
    box-shadow: 0 8px 32px rgba(0,0,0,.5) !important;
    border-radius: 0 0 12px 12px !important;
    margin-top: 0 !important;
    padding: 0 !important;
}
/* Left panel items already styled dark — ensure nav ul background too */
nav.tp-category-menu-content ul { background: #0A1628 !important; }
nav.tp-category-menu-content ul li { background: #0A1628 !important; }
nav.tp-category-menu-content ul li > a {
    background-color: #0A1628 !important;
    color: rgba(255,255,255,.82) !important;
}
nav.tp-category-menu-content ul li > a:hover {
    background-color: rgba(255,255,255,.06) !important;
    color: #F97316 !important;
}
/* Submenu right panel stays white */
nav.tp-category-menu-content ul li .tp-submenu,
nav.tp-category-menu-content ul li ul.tp-submenu {
    background: #fff !important;
}
nav.tp-category-menu-content ul li .tp-submenu li a,
nav.tp-category-menu-content ul li ul.tp-submenu li a {
    background-color: #fff !important;
    color: #111827 !important;
}
nav.tp-category-menu-content ul li .tp-submenu li a:hover {
    background-color: #FFF7ED !important;
    color: #F97316 !important;
}

/* ── Dropdown white wrapper — exact selectors from DevTools ── */
.tp-header-category.tp-category-menu,
.tp-header-category.tp-category-menu.tp-header-category-toggle,
div.tp-header-category {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
nav.tp-category-menu-content {
    background: #0A1628 !important;
    border: none !important;
    box-shadow: 0 8px 32px rgba(0,0,0,.5) !important;
    border-radius: 0 0 12px 12px !important;
    margin-top: 0 !important;
    padding: 0 !important;
}
/* Left panel items already styled dark — ensure nav ul background too */
nav.tp-category-menu-content ul { background: #0A1628 !important; }
nav.tp-category-menu-content ul li { background: #0A1628 !important; }
nav.tp-category-menu-content ul li > a {
    background-color: #0A1628 !important;
    color: rgba(255,255,255,.82) !important;
}
nav.tp-category-menu-content ul li > a:hover {
    background-color: rgba(255,255,255,.06) !important;
    color: #F97316 !important;
}
/* Submenu right panel stays white */
nav.tp-category-menu-content ul li .tp-submenu,
nav.tp-category-menu-content ul li ul.tp-submenu {
    background: #fff !important;
}
nav.tp-category-menu-content ul li .tp-submenu li a,
nav.tp-category-menu-content ul li ul.tp-submenu li a {
    background-color: #fff !important;
    color: #111827 !important;
}
nav.tp-category-menu-content ul li .tp-submenu li a:hover {
    background-color: #FFF7ED !important;
    color: #F97316 !important;
}

/* ── Dropdown white wrapper — exact selectors from DevTools ── */
.tp-header-category.tp-category-menu,
.tp-header-category.tp-category-menu.tp-header-category-toggle,
div.tp-header-category {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
nav.tp-category-menu-content {
    background: #0A1628 !important;
    border: none !important;
    box-shadow: 0 8px 32px rgba(0,0,0,.5) !important;
    border-radius: 0 0 12px 12px !important;
    margin-top: 0 !important;
    padding: 0 !important;
}
/* Left panel items already styled dark — ensure nav ul background too */
nav.tp-category-menu-content ul { background: #0A1628 !important; }
nav.tp-category-menu-content ul li { background: #0A1628 !important; }
nav.tp-category-menu-content ul li > a {
    background-color: #0A1628 !important;
    color: rgba(255,255,255,.82) !important;
}
nav.tp-category-menu-content ul li > a:hover {
    background-color: rgba(255,255,255,.06) !important;
    color: #F97316 !important;
}
/* Submenu right panel stays white */
nav.tp-category-menu-content ul li .tp-submenu,
nav.tp-category-menu-content ul li ul.tp-submenu {
    background: #fff !important;
}
nav.tp-category-menu-content ul li .tp-submenu li a,
nav.tp-category-menu-content ul li ul.tp-submenu li a {
    background-color: #fff !important;
    color: #111827 !important;
}
nav.tp-category-menu-content ul li .tp-submenu li a:hover {
    background-color: #FFF7ED !important;
    color: #F97316 !important;
}

/* ── Dropdown white wrapper — exact selectors from DevTools ── */
.tp-header-category.tp-category-menu,
.tp-header-category.tp-category-menu.tp-header-category-toggle,
div.tp-header-category {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
nav.tp-category-menu-content {
    background: #0A1628 !important;
    border: none !important;
    box-shadow: 0 8px 32px rgba(0,0,0,.5) !important;
    border-radius: 0 0 12px 12px !important;
    margin-top: 0 !important;
    padding: 0 !important;
}
/* Left panel items already styled dark — ensure nav ul background too */
nav.tp-category-menu-content ul { background: #0A1628 !important; }
nav.tp-category-menu-content ul li { background: #0A1628 !important; }
nav.tp-category-menu-content ul li > a {
    background-color: #0A1628 !important;
    color: rgba(255,255,255,.82) !important;
}
nav.tp-category-menu-content ul li > a:hover {
    background-color: rgba(255,255,255,.06) !important;
    color: #F97316 !important;
}
/* Submenu right panel stays white */
nav.tp-category-menu-content ul li .tp-submenu,
nav.tp-category-menu-content ul li ul.tp-submenu {
    background: #fff !important;
}
nav.tp-category-menu-content ul li .tp-submenu li a,
nav.tp-category-menu-content ul li ul.tp-submenu li a {
    background-color: #fff !important;
    color: #111827 !important;
}
nav.tp-category-menu-content ul li .tp-submenu li a:hover {
    background-color: #FFF7ED !important;
    color: #F97316 !important;
}

/* ── ROW GAP — exact class from curl ── */
.tp-product-arrival-area .row { row-gap: 28px !important; }
.tp-product-item.mb-25 { margin-bottom: 0 !important; }
.tp-product-item { margin-bottom: 0 !important; }

/* ── SUBMENU — match navy theme ── */
nav.tp-category-menu-content ul li .tp-submenu,
nav.tp-category-menu-content ul li ul.tp-submenu {
    background: #132238 !important;
    border: none !important;
    border-left: 1px solid rgba(255,255,255,.08) !important;
    box-shadow: none !important;
}
nav.tp-category-menu-content ul li .tp-submenu li a,
nav.tp-category-menu-content ul li ul.tp-submenu li a {
    background-color: #132238 !important;
    color: rgba(255,255,255,.78) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    border-bottom: 1px solid rgba(255,255,255,.05) !important;
}
nav.tp-category-menu-content ul li .tp-submenu li a:hover {
    background-color: rgba(249,115,22,.1) !important;
    color: #F97316 !important;
}

/* Ads section full width edge to edge */
.tp-ads-area,
.tp-ads-area .container,
.tp-ads-area .container-fluid,
[class*="ads-area"] .container,
[class*="ads-wrapper"],
.tp-banner-area,
.tp-banner-area .container { max-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; width: 100% !important; }
.tp-ads-area img,
[class*="ads-area"] img,
.tp-banner-area img { width: 100% !important; display: block !important; }

/* Nav menu single line */
.tp-header-bottom .main-menu > ul { flex-wrap: nowrap !important; white-space: nowrap !important; }
.tp-header-bottom .main-menu > ul > li > a { white-space: nowrap !important; font-size: 13px !important; padding: 0 14px !important; }

/* B2B page — remove top blank space */
.breadcrumb__area + * { margin-top: 0 !important; }
section.breadcrumb__area { margin-bottom: 0 !important; padding-bottom: 0 !important; }

/* Full-bleed breakout for pages inside container */
.tp-page-area .container { overflow: visible !important; }

/* Nav menu single line */
.tp-header-bottom .main-menu > ul { flex-wrap: nowrap !important; white-space: nowrap !important; }
.tp-header-bottom .main-menu > ul > li > a { white-space: nowrap !important; font-size: 13px !important; padding: 0 14px !important; }

/* Sticky header */
.tp-header-area { position: sticky !important; top: 0 !important; z-index: 9990 !important; }
.tp-header-sticky { position: sticky !important; top: 0 !important; z-index: 9990 !important; }

/* Force all menu items onto one line */
.tp-header-bottom-inner { flex-wrap: nowrap !important; }
.main-menu nav ul { display: flex !important; flex-wrap: nowrap !important; align-items: center !important; }
.main-menu nav > ul > li { flex-shrink: 0 !important; white-space: nowrap !important; }
.main-menu nav > ul > li > a { white-space: nowrap !important; font-size: 12.5px !important; padding: 0 10px !important; letter-spacing: 0 !important; }

/* FIX 3: Sticky header — pure CSS, no JS needed */
.tp-header-area { position: sticky !important; top: 0 !important; z-index: 9999 !important; width: 100% !important; }
.tp-header-top { position: sticky !important; top: 0 !important; z-index: 10000 !important; }

/* Sticky header — exact class from rendered HTML */
.sl-header-main.tp-header-sticky,
.sl-header-main {
    position: sticky !important;
    top: 0 !important;
    z-index: 9999 !important;
    width: 100% !important;
    background: #0A1628 !important;
    box-shadow: 0 2px 20px rgba(0,0,0,.3) !important;
}

/* Make outer header wrapper sticky — this is what needs to stick */
#sl-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 9999 !important;
    width: 100% !important;
}

/* Remove conflicting sticky — let Shofy's JS handle scrolling */
#sl-header { position: relative !important; z-index: 9999 !important; }
.sl-header-main { position: relative !important; }

/* When Shofy adds its sticky class via JS, style it correctly */
.tp-header-sticky.tp-header-sticky-active,
.sl-header-main.sticky-header,
.sl-header-main.header-sticky {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 9999 !important;
    background: #0A1628 !important;
    box-shadow: 0 2px 20px rgba(0,0,0,.25) !important;
    animation: slideDown .3s ease !important;
}
@keyframes slideDown { from { transform: translateY(-100%); } to { transform: translateY(0); } }

/* ── STICKY HEADER: Let Shofy's JS do the work, just style it ── */
/* Remove our broken overrides */
#sl-header { position: relative !important; }
.sl-header-main { position: relative !important; }

/* Style Shofy's native sticky state (class added by Shofy JS on scroll) */
.tp-header-sticky.header-sticky {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 9999 !important;
    background: #0A1628 !important;
    box-shadow: 0 2px 20px rgba(0,0,0,.35) !important;
    animation: slHeaderDrop .25s ease !important;
}
@keyframes slHeaderDrop {
    from { transform: translateY(-100%); }
    to   { transform: translateY(0); }
}

/* Sticky header gap fix — CSS only, no JS needed */
body:has(.tp-header-sticky.header-sticky) {
    padding-top: 155px !important;
}
/* If :has() not supported, fallback */
@supports not (selector(:has(*))) {
    body { scroll-padding-top: 155px; }
}