/* ============================================================
   KINGSTER PREMIUM BRAND SYSTEM — v3.0
   Dark luxury: Matte Black · Graphite · Emerald Cyan accent
   Palette: #050505 · #1A1D21 · #FFFFFF · #C7CCD4 · #00C8C8
   ============================================================ */

/* ── 1. DESIGN TOKENS ─────────────────────────────────────── */
:root {
    --kb-black:    #050505;
    --kb-card:     #1A1D21;
    --kb-card-2:   #111315;
    --kb-card-3:   #0D1014;
    --kb-silver:   #C7CCD4;
    --kb-silver-2: #8C9199;
    --kb-silver-3: #2E333A;
    --kb-white:    #FFFFFF;
    --kb-accent:   #00C8C8;
    --kb-accent-d: #00A8A8;
    --kb-accent-g: rgba(0,200,200,0.10);
    --kb-silver-m: #D9DDE3;
    --kb-gold:     #D9DDE3;
    --kb-gold-g:   rgba(217,221,227,0.12);
    --kb-red:      #FF4757;

    --primary:      #FFFFFF;
    --primary-dark: #00C8C8;
    --primary-color:#00C8C8;
    --secondary:    #C7CCD4;
    --white:        #FFFFFF;
    --black:        #050505;
    --text:         #FFFFFF;
    --text-2:       #C7CCD4;
    --text-3:       #8C9199;
    --bg:           #1A1D21;
    --bg-2:         #111315;
    --bg-3:         #1A1D21;
    --bg-4:         rgba(0,200,200,0.06);
    --bg-5:         #0D1014;
    --bg-6:         #0D1014;
    --bg-7:         #111315;
    --line:         #2E333A;
    --success:      #00C8C8;
    --critical:     #FF4757;
    --on-surface:   #FFFFFF;
    --surface:      #111315;
    --link:         #C7CCD4;
    --link-hover:   #00C8C8;

    --white-04: rgba(255,255,255,0.04);
    --white-10: rgba(255,255,255,0.10);
    --white-20: rgba(255,255,255,0.20);
    --white-60: rgba(255,255,255,0.60);

    --sh-card:  0 4px 24px rgba(0,0,0,0.70);
    --sh-accent:0 0 20px rgba(0,200,200,0.20);
    --sh-silver:0 0 16px rgba(217,221,227,0.15);

    --tr-fast: 150ms ease;
    --tr-base: 250ms ease;
    --tr-slow: 350ms ease;

    --r-sm:  12px;
    --r-md:  16px;
    --r-lg:  20px;
    --r-xl:  28px;
}

/* ── 2. GLOBAL FOUNDATION ─────────────────────────────────── */
html { background: var(--kb-black); }

body {
    background: var(--kb-black) !important;
    color: var(--kb-white) !important;
}

body::-webkit-scrollbar { width: 4px; }
body::-webkit-scrollbar-track { background: var(--kb-black); }
body::-webkit-scrollbar-thumb { background: var(--kb-accent); border-radius: 99px; }

h1, h2, h3, h4, h5, h6 { color: var(--kb-white) !important; }

a { color: var(--kb-silver); transition: color var(--tr-base); }
a:hover { color: var(--kb-accent); }

p { color: var(--kb-silver); }

hr, .line, [class*="divider"] {
    border-color: var(--kb-silver-3) !important;
    background: var(--kb-silver-3) !important;
}

::selection { background: var(--kb-accent); color: #000; }

/* ── 3. HEADER ────────────────────────────────────────────── */
.logo-site img,
.preload-logo img,
img.logo-light,
img.logo-dark {
    filter: brightness(0) invert(1) !important;
}

.header-main,
.tf-header,
[class*="header-s"],
.header-abs,
.header-abs-2,
.header-abs-3 {
    background: rgba(5,5,5,0.97) !important;
    border-bottom: 1px solid var(--kb-silver-3) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
}

.header-inner,
.header-inner_wrap,
.tf-header .container-full,
.tf-header .container,
.tf-header .header-wrap,
.tf-header .header-content,
.tf-header .header-bottom,
.tf-header .box-quick-search,
.tf-header .form-search,
.tf-header .nav-bottom { background: transparent !important; }

.header-topbar,
.topbar,
[class*="topbar"] {
    background: #030303 !important;
    border-bottom: none !important;
    color: var(--kb-silver) !important;
}
.header-topbar *, .topbar * { color: var(--kb-silver) !important; }

.header-main.is-sticky,
.tf-header.is-sticky,
[class*="header-s"].is-sticky {
    background: rgba(5,5,5,0.98) !important;
    box-shadow: 0 2px 32px rgba(0,0,0,0.8) !important;
}

.menu-main-2 > li > a,
.nav-main > li > a,
.menu-nav li a,
.nav-link-main,
[class*="nav-item"] > a {
    color: var(--kb-white) !important;
    font-weight: 500;
    transition: color var(--tr-base) !important;
}
.menu-main-2 > li > a:hover,
.nav-main > li > a:hover,
.menu-nav li a:hover,
[class*="nav-item"] > a:hover {
    color: var(--kb-accent) !important;
}
.menu-main-2 > li.current > a,
.menu-main-2 > li.active > a,
.nav-main > li.active > a {
    color: var(--kb-accent) !important;
}

.header-action-icon,
.header-action-item svg,
.header-action-item i {
    color: var(--kb-white) !important;
    fill: var(--kb-white) !important;
}
.header-action-item:hover .header-action-icon,
.header-action-item:hover svg,
.header-action-item:hover i {
    color: var(--kb-accent) !important;
    fill: var(--kb-accent) !important;
}

.count-cart,
.count-wishlist,
.count-compare,
[class*="count-"] {
    background: var(--kb-accent) !important;
    color: #000 !important;
    font-weight: 600;
}

.mega-menu,
.nav-dropdown,
.dropdown-menu,
.sub-menu,
[class*="nav-mega"],
[class*="mega-item"] {
    background: #0A0C0E !important;
    border: 1px solid var(--kb-silver-3) !important;
    box-shadow: 0 16px 48px rgba(0,0,0,0.8) !important;
}
.mega-menu a, .nav-dropdown a, .dropdown-menu a, .sub-menu a {
    color: var(--kb-silver) !important;
}
.mega-menu a:hover, .nav-dropdown a:hover, .dropdown-menu a:hover, .sub-menu a:hover {
    color: var(--kb-accent) !important;
    background: rgba(0,200,200,0.06) !important;
}

.categories-dropdown .dropdown-menu,
.box-nav-category,
.nav-category-wrap .dropdown-content {
    background: #0A0C0E !important;
    border: 1px solid var(--kb-silver-3) !important;
}
.categories-dropdown .dropdown-item,
.box-nav-category .item-category a { color: var(--kb-silver) !important; }
.categories-dropdown .dropdown-item:hover,
.box-nav-category .item-category a:hover {
    background: rgba(0,200,200,0.06) !important;
    color: var(--kb-accent) !important;
}

.offcanvas,
.mobile-offcanvas,
[class*="offcanvas"] {
    background: #080A0C !important;
    border-color: var(--kb-silver-3) !important;
}
.offcanvas * { color: var(--kb-silver) !important; }
.offcanvas .nav-link:hover,
.offcanvas a:hover { color: var(--kb-accent) !important; }

/* ── 4. PRODUCT CARDS ─────────────────────────────────────── */
.card-product,
.product-item,
[class*="product-card"],
.tf-product-item {
    background: var(--kb-card) !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-md) !important;
    transition: transform var(--tr-base), box-shadow var(--tr-base), border-color var(--tr-base) !important;
    overflow: hidden !important;
}
.card-product:hover,
.product-item:hover,
[class*="product-card"]:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.65), 0 0 0 1px rgba(0,200,200,0.20) !important;
    border-color: rgba(0,200,200,0.25) !important;
}

.card-product_wrapper,
.product-thumb,
.product-image-wrap,
[class*="product-img"] {
    background: #111315 !important;
    overflow: hidden !important;
}

.card-product_info,
.product-info,
[class*="product-content"] {
    background: var(--kb-card) !important;
    padding: 12px 14px 14px !important;
}

.card-product_info .product-name,
.card-product_info h3,
.product-name a,
.product-title a {
    color: var(--kb-white) !important;
    font-weight: 600;
    transition: color var(--tr-base) !important;
}
.product-name a:hover, .product-title a:hover { color: var(--kb-accent) !important; }

.price-new,
.product-price .new-price,
[class*="price-new"],
.price-on-sale {
    color: var(--kb-white) !important;
    font-weight: 700;
}
.price-old,
.product-price .old-price,
[class*="price-old"],
.text-decoration-line-through {
    color: var(--kb-silver-2) !important;
}

.product-badge_item,
.badge-new, .badge-sale,
[class*="product-badge"],
.badge {
    border-radius: 8px !important;
    font-weight: 600 !important;
    font-size: 11px !important;
}
.badge-new,
.product-badge_item.new {
    background: var(--kb-accent) !important;
    color: #000 !important;
}
.badge-sale,
.product-badge_item.sale {
    background: #FF4757 !important;
    color: #fff !important;
}
.badge-featured,
.product-badge_item.featured,
.badge-premium,
[class*="badge-gold"],
[class*="badge-vip"] {
    background: transparent !important;
    border: 1px solid var(--kb-silver-m) !important;
    color: var(--kb-silver-m) !important;
}

/* ── PRODUCT CARD ACTION BUTTONS ──────────────────────────── */
.product-action_list .box-icon,
.card-product__actions .box-icon,
.product-action_list a.box-icon,
.card-product__actions a.box-icon,
li.action-add-to-cart .box-icon,
li.action-wishlist .box-icon,
li.action-compare .box-icon,
li.action-quick-view .box-icon {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    max-width: 40px !important;
    max-height: 40px !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 50% !important;
    background-color: rgba(26,29,33,0.95) !important;
    border: 1px solid rgba(46,51,58,0.80) !important;
    color: var(--kb-white) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    overflow: hidden !important;
    transition: background-color 250ms ease, border-color 250ms ease, box-shadow 250ms ease !important;
    box-shadow: none !important;
}
.product-action_list .box-icon:hover,
.card-product__actions .box-icon:hover,
li.action-add-to-cart .box-icon:hover,
li.action-wishlist .box-icon:hover,
li.action-compare .box-icon:hover,
li.action-quick-view .box-icon:hover {
    background-color: var(--kb-accent) !important;
    border-color: var(--kb-accent) !important;
    color: #000 !important;
    box-shadow: 0 0 16px rgba(0,200,200,0.35) !important;
}
.product-action_list .box-icon .icon,
.card-product__actions .box-icon .icon {
    color: inherit !important;
    font-size: 18px !important;
    line-height: 1 !important;
    display: flex !important;
}

.product-action_list .box-icon .tooltip,
.card-product__actions .box-icon .tooltip,
.hover-tooltip .tooltip {
    background: #111315 !important;
    color: var(--kb-white) !important;
    border: 1px solid var(--kb-silver-3) !important;
    font-size: 12px !important;
    border-radius: 8px !important;
    white-space: nowrap !important;
}

.star-rating .filled,
.star-rating i.active,
[class*="rating"] .filled,
.tf-star-rating .active {
    color: var(--kb-silver-m) !important;
    fill: var(--kb-silver-m) !important;
}
.star-rating .empty,
[class*="rating"] .empty { color: var(--kb-silver-3) !important; }

/* ── 5. BUTTONS ───────────────────────────────────────────── */

/* Primary — White bg, Black text, Cyan hover */
.tf-btn,
.btn-primary,
.btn-add-to-cart,
.btn-buy-now,
button.tf-btn,
a.tf-btn {
    background: var(--kb-white) !important;
    color: var(--kb-black) !important;
    border: none !important;
    border-radius: 40px !important;
    font-weight: 700 !important;
    transition: all var(--tr-base) !important;
    box-shadow: 0 4px 20px rgba(255,255,255,0.10) !important;
}
.tf-btn:hover,
.btn-primary:hover,
.btn-add-to-cart:hover,
.btn-buy-now:hover,
button.tf-btn:hover {
    background: var(--kb-accent) !important;
    color: #000 !important;
    box-shadow: 0 6px 24px rgba(0,200,200,0.30) !important;
    transform: translateY(-1px);
}
.tf-btn:active,
.btn-primary:active { transform: translateY(0); }

/* Secondary / outline — transparent, white border, cyan hover */
.tf-btn.btn-secondary,
.tf-btn.btn-outline,
.tf-btn-line,
.btn-outline-dark,
.btn-outline-secondary,
.btn-secondary {
    background: transparent !important;
    border: 1px solid var(--kb-white) !important;
    color: var(--kb-white) !important;
    border-radius: 40px !important;
    box-shadow: none !important;
    font-weight: 600 !important;
    transition: all var(--tr-base) !important;
}
.tf-btn.btn-secondary:hover,
.tf-btn.btn-outline:hover,
.tf-btn-line:hover,
.btn-outline-dark:hover,
.btn-outline-secondary:hover {
    border-color: var(--kb-accent) !important;
    color: var(--kb-accent) !important;
    background: transparent !important;
    box-shadow: 0 0 12px rgba(0,200,200,0.15) !important;
}

/* Dark/ghost button */
.tf-btn.btn-dark,
.btn-dark {
    background: #1A1D21 !important;
    border: 1px solid var(--kb-silver-3) !important;
    color: var(--kb-white) !important;
    border-radius: 40px !important;
}
.tf-btn.btn-dark:hover, .btn-dark:hover {
    border-color: var(--kb-accent) !important;
    color: var(--kb-accent) !important;
    background: #1A1D21 !important;
}

/* Amazon buy button — keep brand orange */
a[href*="amazon"],
.btn-amazon {
    background: #FF9900 !important;
    color: #000 !important;
    border: 2px solid #e47911 !important;
    border-radius: var(--r-sm) !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}
a[href*="amazon"]:hover { background: #e68900 !important; color: #000 !important; }

/* ── 6. FORMS & INPUTS ────────────────────────────────────── */
input, select, textarea,
.tf-input, .form-control,
[class*="input-"], [class*="select-"] {
    background: #111315 !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-sm) !important;
    color: var(--kb-white) !important;
    transition: border-color var(--tr-base), box-shadow var(--tr-base) !important;
}
input::placeholder, textarea::placeholder {
    color: var(--kb-silver-2) !important;
    opacity: 0.7;
}
input:focus, select:focus, textarea:focus,
.tf-input:focus, .form-control:focus {
    background: #111315 !important;
    border-color: var(--kb-accent) !important;
    box-shadow: 0 0 0 3px rgba(0,200,200,0.15) !important;
    color: var(--kb-white) !important;
    outline: none !important;
}

select option { background: #111315; color: var(--kb-white); }
label, .form-label { color: var(--kb-silver) !important; }
input[type="checkbox"],
input[type="radio"] { accent-color: var(--kb-accent) !important; }

/* ── 7. FOOTER ────────────────────────────────────────────── */
.tf-footer,
.footer,
footer,
[class*="footer-s"],
.bg-dark.footer,
.footer.position-relative {
    background: #030303 !important;
    border-top: 1px solid var(--kb-silver-3) !important;
    color: var(--kb-silver) !important;
}
.tf-footer *, .footer *, footer * { color: var(--kb-silver) !important; }
.tf-footer h1,.tf-footer h2,.tf-footer h3,.tf-footer h4,.tf-footer h5,.tf-footer h6,
.footer h1,.footer h2,.footer h3,.footer h4,.footer h5,.footer h6 {
    color: var(--kb-white) !important;
}
.tf-footer a, .footer a { color: var(--kb-silver) !important; transition: color var(--tr-base) !important; }
.tf-footer a:hover, .footer a:hover { color: var(--kb-accent) !important; }

.footer-bottom,
[class*="footer-bottom"] {
    background: #020202 !important;
    border-top: 1px solid var(--kb-silver-3) !important;
}

.tf-footer .form-control,
.tf-footer input,
.footer .newsletter-form input {
    background: #0A0C0E !important;
    border-color: var(--kb-silver-3) !important;
    color: var(--kb-white) !important;
}

.payment-item img, .footer-payment img {
    filter: grayscale(40%) brightness(0.9) !important;
    opacity: 0.8;
    transition: opacity var(--tr-base);
}
.payment-item img:hover { opacity: 1; filter: none !important; }

/* ── 8. BREADCRUMB ────────────────────────────────────────── */
.tf-breadcrumb,
.breadcrumb,
[class*="breadcrumb"] { background: transparent !important; }
.breadcrumb-item,
.breadcrumb-item a,
.tf-breadcrumb a { color: var(--kb-silver-2) !important; }
.breadcrumb-item.active,
.breadcrumb-item:last-child { color: var(--kb-white) !important; }
.breadcrumb-item + .breadcrumb-item::before { color: var(--kb-silver-3) !important; }

/* ── 9. SECTIONS & PAGE WRAPPERS ──────────────────────────── */
.main-content,
.site-content,
#wrapper,
.flat-spacing,
[class*="flat-spacing"],
.section,
[class*="section-"] { background: var(--kb-black) !important; }

.heading-section,
[class*="heading-section"],
.section-title { color: var(--kb-white) !important; }
.heading-section .text,
[class*="heading-section"] .text { color: var(--kb-silver) !important; }

/* ── 10. PRODUCT DETAIL PAGE ──────────────────────────────── */
.product-info-top,
.product-detail,
.flat-product-detail { background: var(--kb-black) !important; }
.product-info-top h1,
.product-detail h1 { color: var(--kb-white) !important; }
.product-info-top .price-wrap,
.product-detail .price-wrap { background: transparent !important; }

.quantity-control,
.wg-quantity {
    background: #111315 !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-sm) !important;
}
.quantity-control button,
.wg-quantity button {
    background: transparent !important;
    color: var(--kb-white) !important;
    border: none !important;
}
.quantity-control input,
.wg-quantity input {
    background: transparent !important;
    border: none !important;
    color: var(--kb-white) !important;
    box-shadow: none !important;
}

/* Buy box: label + qty stepper + Add To Cart + Buy It Now.
   The wrapper is plain layout — card look belongs to the stepper only. */
.tf-product-total-quantity {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 20px 0 0 !important;
}
.tf-product-total-quantity > .title {
    color: var(--kb-silver) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    margin-bottom: 12px !important;
}
.tf-product-total-quantity .group-action {
    display: flex !important;
    align-items: stretch !important;
    gap: 14px !important;
    background: transparent !important;
    border: none !important;
    margin-bottom: 14px !important;
}
.wg-quantity {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    height: 56px !important;
    min-width: 140px !important;
    padding: 0 10px !important;
    flex: 0 0 auto !important;
}
.wg-quantity .btn-quantity {
    width: 40px !important;
    height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 10px !important;
    transition: background var(--tr-base) !important;
}
.wg-quantity .btn-quantity:hover {
    background: rgba(255,255,255,0.08) !important;
}
.wg-quantity input.quantity-product {
    width: 44px !important;
    height: 40px !important;
    text-align: center !important;
    font-weight: 600 !important;
    -moz-appearance: textfield;
}
.wg-quantity input.quantity-product::-webkit-outer-spin-button,
.wg-quantity input.quantity-product::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.tf-product-total-quantity .btn-action-price {
    height: 56px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Compact vertical rhythm in the buy area: swatch → availability → quantity */
.bb-product-attribute-swatch-title {
    margin-bottom: 10px !important;
}
.bb-product-attribute-swatch-list {
    margin-bottom: 0 !important;
}
.pr_switch_wrap {
    margin: 0 !important;
}
.pr_switch_wrap:empty {
    display: none !important;
}
.tf-product-availability {
    margin: 16px 0 !important;
}
.tf-product-total-quantity {
    margin-top: 4px !important;
}

/* Trust seal: dark-blue Razorpay logo needs a light chip to be visible */
.tf-product-trust-seal .list-card .card-item {
    background: #FFFFFF !important;
    border-radius: 12px !important;
    padding: 10px 22px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}
.tf-product-trust-seal .list-card .card-item img {
    max-height: 34px !important;
    width: auto !important;
    display: block !important;
}
.tf-product-trust-seal .text-seal {
    color: var(--kb-silver) !important;
    margin-bottom: 14px !important;
}

/* ── 57. POLICY PAGES (kb-policy) ────────────────────────────
   Mobile-friendly long-form policy layout. */
.kb-policy {
    max-width: 860px;
    margin: 0 auto;
    padding: 48px 20px 90px;
    color: var(--kb-silver) !important;
}
.kb-policy h2 {
    color: var(--kb-white) !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    margin: 38px 0 14px !important;
    line-height: 1.4 !important;
}
.kb-policy p,
.kb-policy li {
    color: var(--kb-silver) !important;
    font-size: 15px !important;
    line-height: 1.85 !important;
    margin-bottom: 12px !important;
}
.kb-policy ul {
    list-style: disc !important;
    padding-left: 24px !important;
    margin: 8px 0 18px !important;
}
.kb-policy li { margin-bottom: 6px !important; }
.kb-policy strong { color: var(--kb-white) !important; }
.kb-policy a { color: var(--kb-accent) !important; text-decoration: underline !important; }
.kb-policy .kb-updated {
    background: var(--kb-card);
    border: 1px solid var(--kb-silver-3);
    border-radius: var(--r-sm);
    display: inline-block;
    padding: 8px 18px;
    margin-bottom: 8px;
}
@media (max-width: 767px) {
    .kb-policy { padding: 32px 16px 70px; }
    .kb-policy h2 { font-size: 19px !important; }
}

/* Policy note under Buy It Now */
.kb-policy-note {
    margin: 14px 0 0 !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
    color: #9AA0A8 !important;
}
.kb-policy-note a {
    color: var(--kb-accent) !important;
    text-decoration: underline !important;
}

/* ── 58. SHOP FILTER SIDEBAR / TOOLBAR / PAGINATION ──────────
   The theme leaves these light-on-light; align to dark brand. */
.bb-product-filter,
.widget-facet {
    background: var(--kb-card) !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-md) !important;
    padding: 18px !important;
    margin-bottom: 16px !important;
}
.bb-product-filter-title {
    color: var(--kb-white) !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    border-color: var(--kb-silver-3) !important;
    background: transparent !important;
}
.bb-product-filter,
.bb-product-filter p,
.bb-product-filter label,
.bb-product-filter span,
.bb-product-filter li {
    color: var(--kb-silver) !important;
}
.bb-product-filter-link {
    color: var(--kb-silver) !important;
    transition: color var(--tr-base) !important;
}
.bb-product-filter-link:hover,
.bb-product-filter-link.active {
    color: var(--kb-accent) !important;
}
.bb-product-filter input[type="checkbox"],
.bb-product-filter input[type="radio"] {
    accent-color: var(--kb-accent) !important;
    width: 16px;
    height: 16px;
}
.widget-price input,
.bb-product-filter input[type="text"],
.bb-product-filter input[type="number"] {
    background: #111315 !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: 8px !important;
    color: var(--kb-white) !important;
}
.widget-price input::placeholder { color: #6F757D !important; }

/* Shop toolbar (sort / layout switch) */
.tf-shop-control {
    background: var(--kb-card) !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-sm) !important;
    padding: 10px 14px !important;
}
.tf-shop-control,
.tf-shop-control * { color: var(--kb-silver) !important; }
.tf-control-sorting .text-sort-value { color: var(--kb-white) !important; }
.tf-dropdown-sort {
    background: var(--kb-card) !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-sm) !important;
}
.tf-dropdown-sort * { color: var(--kb-silver) !important; }
.tf-view-layout-switch { background: transparent !important; }
.tf-view-layout-switch.active { background: var(--kb-accent) !important; border-radius: 8px !important; }
.tf-view-layout-switch.active * { color: #000 !important; }

/* Pagination — active page was white-on-white */
.tf-page-pagination .pag-item {
    background: var(--kb-card) !important;
    border: 1px solid var(--kb-silver-3) !important;
    color: var(--kb-silver) !important;
    border-radius: 10px !important;
    min-width: 40px;
    min-height: 40px;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all var(--tr-base) !important;
}
.tf-page-pagination .pag-item:hover:not(.disabled):not(.active) {
    border-color: var(--kb-accent) !important;
    color: var(--kb-accent) !important;
}
.tf-page-pagination .pag-item.active {
    background: var(--kb-white) !important;
    color: #050505 !important;
    border-color: var(--kb-white) !important;
    font-weight: 700 !important;
}
.tf-page-pagination .pag-item.disabled { opacity: .4 !important; }

/* ── 59. SOCIAL LOGIN + FOCUS STATES ─────────────────────────
   Google button was an off-brand red; align + accessibility. */
.social-icons .google,
.social-login-lg .google,
a.google, button.google {
    background: var(--kb-card) !important;
    color: var(--kb-white) !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: 40px !important;
    transition: border-color var(--tr-base) !important;
}
.social-icons .google:hover,
a.google:hover, button.google:hover {
    border-color: var(--kb-accent) !important;
    color: var(--kb-accent) !important;
    background: var(--kb-card) !important;
}

/* Keyboard focus visibility (WCAG) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid var(--kb-accent) !important;
    outline-offset: 2px !important;
}

/* Minimum touch targets on small screens */
@media (max-width: 767px) {
    .tf-btn, .btn, .pag-item, .header-action-item,
    .toolbar-bottom a, .footer .list-card li a {
        min-height: 44px;
    }
}

/* Footer payment icons: uniform white chips */
.footer .list-card li,
footer .list-card li {
    background: #FFFFFF !important;
    border-radius: 8px !important;
    padding: 5px 10px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 34px !important;
}
.footer .list-card li img,
footer .list-card li img {
    height: 22px !important;
    width: auto !important;
    max-width: 56px !important;
    object-fit: contain !important;
    display: block !important;
}

.product-attribute,
[class*="attribute"] {
    border-color: var(--kb-silver-3) !important;
    color: var(--kb-white) !important;
}
.product-attribute .item,
[class*="attribute"] .item {
    background: #111315 !important;
    border: 1px solid var(--kb-silver-3) !important;
    color: var(--kb-silver) !important;
    border-radius: var(--r-sm) !important;
    transition: all var(--tr-base) !important;
}
.product-attribute .item:hover,
[class*="attribute"] .item:hover {
    border-color: var(--kb-accent) !important;
    color: var(--kb-accent) !important;
}
.product-attribute .item.active,
.product-attribute .item.selected,
[class*="attribute"] .item.active {
    border-color: var(--kb-accent) !important;
    background: rgba(0,200,200,0.08) !important;
    color: var(--kb-white) !important;
}

.product-tab,
.tab-product,
[class*="product-tab"] { border-bottom: 1px solid var(--kb-silver-3) !important; }
.product-tab .nav-link,
.tab-product .nav-link,
[class*="product-tab"] .nav-link {
    color: var(--kb-silver) !important;
    background: transparent !important;
    border: none !important;
    border-bottom: 2px solid transparent !important;
    border-radius: 0 !important;
    transition: all var(--tr-base) !important;
}
.product-tab .nav-link.active,
.tab-product .nav-link.active,
[class*="product-tab"] .nav-link.active {
    color: var(--kb-accent) !important;
    border-bottom-color: var(--kb-accent) !important;
    background: transparent !important;
}
.tab-content,
.product-tab-content,
.tab-product-info { background: transparent !important; color: var(--kb-silver) !important; }

.product-gallery-thumb,
.thumb-gallery,
[class*="gallery-thumb"] .item {
    border: 2px solid var(--kb-silver-3) !important;
    border-radius: var(--r-sm) !important;
    background: #111315 !important;
    overflow: hidden !important;
    transition: border-color var(--tr-base) !important;
}
.product-gallery-thumb.active,
[class*="gallery-thumb"] .item.active { border-color: var(--kb-accent) !important; }

[class*="view-count"],
[class*="viewing"],
.product-viewers { color: var(--kb-accent) !important; font-weight: 600; }

/* ── 11. SHOP / FILTER SIDEBAR ────────────────────────────── */
.shop-sidebar,
.filter-sidebar,
[class*="sidebar"] {
    background: var(--kb-card) !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-md) !important;
}
.widget-filter,
.filter-widget,
[class*="widget-filter"] { border-bottom: 1px solid var(--kb-silver-3) !important; }
.widget-filter h3,
.filter-widget h3,
[class*="widget"] .widget-title { color: var(--kb-white) !important; }

.noUi-target,
[class*="price-range"] .noUi-target {
    background: var(--kb-silver-3) !important;
    border: none !important;
    border-radius: 99px !important;
    height: 4px !important;
}
.noUi-connect { background: var(--kb-accent) !important; }
.noUi-handle {
    background: var(--kb-white) !important;
    border: 2px solid var(--kb-accent) !important;
    box-shadow: 0 0 8px rgba(0,200,200,0.30) !important;
    border-radius: 50% !important;
}
.noUi-handle:before, .noUi-handle:after { display: none !important; }

.filter-check .item,
[class*="filter-"] .item { color: var(--kb-silver) !important; transition: color var(--tr-base) !important; }
.filter-check .item:hover,
[class*="filter-"] .item:hover { color: var(--kb-accent) !important; }
.filter-check .item.active,
[class*="filter-"] .item.active { color: var(--kb-accent) !important; }

.shop-toolbar,
.filter-toolbar,
[class*="shop-toolbar"] {
    background: var(--kb-card) !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-md) !important;
}
.shop-toolbar select { background: #111315 !important; border-color: var(--kb-silver-3) !important; }

/* ── 12. CART & MINI-CART ─────────────────────────────────── */
.mini-cart,
.canvas-cart,
[class*="mini-cart"],
.offcanvas-cart {
    background: #080A0C !important;
    border-color: var(--kb-silver-3) !important;
}
.mini-cart * { color: var(--kb-silver) !important; }
.mini-cart h2, .mini-cart h3, .mini-cart .cart-item-name { color: var(--kb-white) !important; }
.mini-cart .price-new, .canvas-cart .price-new { color: var(--kb-white) !important; }
.mini-cart .btn-remove,
[class*="cart"] .btn-remove {
    color: var(--kb-silver-2) !important;
    background: transparent !important;
    border: none !important;
    transition: color var(--tr-base) !important;
}
.mini-cart .btn-remove:hover { color: #FF4757 !important; }
.cart-total,
[class*="cart-total"] { border-top: 1px solid var(--kb-silver-3) !important; color: var(--kb-white) !important; }

.wg-cart,
.table-cart,
.cart-table,
table.cart { background: transparent !important; }
.wg-cart tbody tr,
table.cart tbody tr {
    border-bottom: 1px solid var(--kb-silver-3) !important;
    background: transparent !important;
    transition: background var(--tr-base) !important;
}
.wg-cart tbody tr:hover,
table.cart tbody tr:hover { background: rgba(255,255,255,0.03) !important; }
.wg-cart td, table.cart td,
.wg-cart th, table.cart th { color: var(--kb-silver) !important; border-color: var(--kb-silver-3) !important; }

/* ── 13. CHECKOUT ─────────────────────────────────────────── */
.checkout-form,
.wg-checkout,
[class*="checkout"] {
    background: var(--kb-card) !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-md) !important;
}
.checkout-form h3,
.wg-checkout h3,
[class*="checkout"] h3 {
    color: var(--kb-white) !important;
    border-bottom: 1px solid var(--kb-silver-3) !important;
    padding-bottom: 12px !important;
}
.order-summary,
[class*="order-summary"] {
    background: #0A0C0E !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-md) !important;
}

/* ── 14. ACCOUNT / DASHBOARD ──────────────────────────────── */
.account-wrapper,
.customer-dashboard,
[class*="account-"] {
    background: var(--kb-card) !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-md) !important;
}
.account-wrapper h2,
.customer-dashboard h2,
.account-title { color: var(--kb-white) !important; }

.account-sidebar,
.dashboard-sidebar,
[class*="account-nav"] {
    background: #0A0C0E !important;
    border-right: 1px solid var(--kb-silver-3) !important;
}
.account-sidebar a,
.dashboard-sidebar a { color: var(--kb-silver) !important; }
.account-sidebar a.active,
.dashboard-sidebar a.active { color: var(--kb-accent) !important; background: rgba(0,200,200,0.06) !important; }

.table, table { color: var(--kb-silver) !important; border-color: var(--kb-silver-3) !important; }
.table thead, table thead { background: #0A0C0E !important; border-bottom: 1px solid var(--kb-silver-3) !important; }
.table thead th, table thead th { color: var(--kb-white) !important; font-weight: 600 !important; border-color: var(--kb-silver-3) !important; }
.table tbody tr, table tbody tr { border-bottom: 1px solid rgba(46,51,58,0.5) !important; transition: background var(--tr-base) !important; }
.table tbody tr:hover, table tbody tr:hover { background: rgba(255,255,255,0.03) !important; }
.table td, .table th, table td, table th { border-color: var(--kb-silver-3) !important; }

.badge-success, .status-success { background: rgba(0,200,200,0.12) !important; color: var(--kb-accent) !important; border: 1px solid rgba(0,200,200,0.30) !important; }
.badge-warning, .status-pending { background: rgba(217,221,227,0.10) !important; color: var(--kb-silver-m) !important; border: 1px solid rgba(217,221,227,0.25) !important; }
.badge-danger, .badge-error { background: rgba(255,71,87,0.12) !important; color: #FF4757 !important; border: 1px solid rgba(255,71,87,0.25) !important; }
.badge-info { background: rgba(0,200,200,0.10) !important; color: var(--kb-accent) !important; border: 1px solid rgba(0,200,200,0.20) !important; }

/* ── 15. MODALS ───────────────────────────────────────────── */
.modal-content,
.tf-modal .modal-content,
[class*="modal-content"] {
    background: #0A0C0E !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-lg) !important;
    color: var(--kb-white) !important;
}
.modal-header,
[class*="modal-header"] { border-bottom: 1px solid var(--kb-silver-3) !important; background: transparent !important; }
.modal-header h4, .modal-header h5, .modal-title { color: var(--kb-white) !important; }
.modal-footer { border-top: 1px solid var(--kb-silver-3) !important; }
.btn-close { filter: invert(1) !important; opacity: 0.6 !important; }
.btn-close:hover { opacity: 1 !important; }
.modal-backdrop { background: rgba(0,0,0,0.85) !important; }

.sign-modal,
.register-modal,
[class*="sign-modal"],
[class*="register-modal"] { background: #0A0C0E !important; }
.quick-view-modal,
[class*="quick-view"] { background: #080A0C !important; }

/* ── 16. SEARCH ───────────────────────────────────────────── */
.search-modal,
[class*="search-modal"] {
    background: rgba(5,5,5,0.97) !important;
    backdrop-filter: blur(20px) !important;
}
.search-modal .form-search input,
[class*="search-modal"] input {
    background: #111315 !important;
    border: 1px solid var(--kb-silver-3) !important;
    color: var(--kb-white) !important;
    border-radius: var(--r-md) !important;
}
.search-modal .form-search input:focus,
[class*="search-modal"] input:focus {
    border-color: var(--kb-accent) !important;
    box-shadow: 0 0 0 3px rgba(0,200,200,0.15) !important;
}
.search-result-item,
[class*="search-result"] .item {
    border-bottom: 1px solid var(--kb-silver-3) !important;
    color: var(--kb-white) !important;
    transition: background var(--tr-base) !important;
}
.search-result-item:hover { background: rgba(0,200,200,0.05) !important; }

/* ── 17. PAGINATION ───────────────────────────────────────── */
.pagination,
[class*="pagination"] { gap: 6px !important; }
.page-item .page-link,
.pagination .page-link {
    background: #111315 !important;
    border: 1px solid var(--kb-silver-3) !important;
    color: var(--kb-silver) !important;
    border-radius: var(--r-sm) !important;
    transition: all var(--tr-base) !important;
}
.page-item .page-link:hover,
.pagination .page-link:hover {
    background: rgba(0,200,200,0.08) !important;
    border-color: var(--kb-accent) !important;
    color: var(--kb-accent) !important;
}
.page-item.active .page-link,
.pagination .active .page-link {
    background: var(--kb-accent) !important;
    border-color: var(--kb-accent) !important;
    color: #000 !important;
    box-shadow: 0 0 12px rgba(0,200,200,0.30) !important;
}

/* ── 18. ALERTS & NOTIFICATIONS ───────────────────────────── */
.alert,
[class*="alert-"] { border-radius: var(--r-sm) !important; border: none !important; }
.alert-success { background: rgba(0,200,200,0.10) !important; color: var(--kb-accent) !important; border-left: 3px solid var(--kb-accent) !important; }
.alert-danger, .alert-error { background: rgba(255,71,87,0.10) !important; color: #FF4757 !important; border-left: 3px solid #FF4757 !important; }
.alert-warning { background: rgba(217,221,227,0.08) !important; color: var(--kb-silver-m) !important; border-left: 3px solid var(--kb-silver-m) !important; }
.alert-info { background: rgba(0,200,200,0.08) !important; color: var(--kb-accent) !important; border-left: 3px solid var(--kb-accent) !important; }

/* ── 19. NEWSLETTER POPUP ─────────────────────────────────── */
.newsletter-popup,
[class*="newsletter-popup"] {
    background: #080A0C !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-lg) !important;
}
.newsletter-popup h2, .newsletter-popup h3 { color: var(--kb-white) !important; }
.newsletter-popup p { color: var(--kb-silver) !important; }

/* ── 20. SWIPER / CAROUSELS ───────────────────────────────── */
.swiper-pagination-bullet {
    background: var(--kb-silver-3) !important;
    opacity: 1 !important;
    transition: all var(--tr-base) !important;
}
.swiper-pagination-bullet-active {
    background: var(--kb-accent) !important;
    transform: scale(1.3);
    box-shadow: 0 0 8px rgba(0,200,200,0.40) !important;
}

.tf-sw-nav-2,
.tf-sw-nav-circle,
.nav-next-swiper,
.nav-prev-swiper,
.swiper-button-next,
.swiper-button-prev,
[class*="nav-next"],
[class*="nav-prev"],
.btn-next-swiper,
.btn-prev-swiper {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 50% !important;
    background: rgba(26,29,33,0.95) !important;
    border: 1px solid rgba(46,51,58,0.80) !important;
    color: var(--kb-white) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: background 250ms ease, border-color 250ms ease, box-shadow 250ms ease !important;
    box-shadow: none !important;
    overflow: hidden !important;
}
.tf-sw-nav-2:hover,
.tf-sw-nav-circle:hover,
.nav-next-swiper:hover,
.nav-prev-swiper:hover,
.swiper-button-next:hover,
.swiper-button-prev:hover,
[class*="nav-next"]:hover,
[class*="nav-prev"]:hover {
    background: var(--kb-accent) !important;
    border-color: var(--kb-accent) !important;
    color: #000 !important;
    box-shadow: 0 0 18px rgba(0,200,200,0.35) !important;
}
.tf-sw-nav-2 i, .tf-sw-nav-2 svg, .tf-sw-nav-2 span,
.tf-sw-nav-circle i, .tf-sw-nav-circle svg,
.nav-next-swiper i, .nav-next-swiper svg,
.nav-prev-swiper i, .nav-prev-swiper svg {
    color: inherit !important;
    fill: currentColor !important;
    font-size: 18px !important;
    line-height: 1 !important;
}
.swiper-button-next::after,
.swiper-button-prev::after {
    font-size: 16px !important;
    color: var(--kb-white) !important;
    font-weight: 700 !important;
}
.swiper-button-next:hover::after,
.swiper-button-prev:hover::after { color: #000 !important; }
.tf-sw-nav-2.swiper-button-disabled,
.tf-sw-nav-circle.swiper-button-disabled,
.swiper-button-disabled {
    opacity: 0.35 !important;
    pointer-events: none !important;
    background: rgba(26,29,33,0.5) !important;
    border-color: rgba(46,51,58,0.4) !important;
}
.tf-sw-nav-2.style-large,
[class*="nav-"].style-large { width: 56px !important; height: 56px !important; }
.ec-cross-sale-section .nav-next-swiper,
.ec-cross-sale-section .nav-prev-swiper {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
}

/* ── 21. ACCORDION ────────────────────────────────────────── */
.accordion-item,
[class*="accordion-item"] {
    background: #111315 !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-sm) !important;
    margin-bottom: 8px !important;
}
.accordion-button,
[class*="accordion-button"] {
    background: transparent !important;
    color: var(--kb-white) !important;
    font-weight: 600 !important;
}
.accordion-button::after { filter: invert(1) !important; }
.accordion-button:not(.collapsed) {
    background: transparent !important;
    color: var(--kb-accent) !important;
    box-shadow: none !important;
}
.accordion-body { color: var(--kb-silver) !important; }
.accordion-collapse { background: #111315 !important; }

/* ── 22. PRELOADER ────────────────────────────────────────── */
.preload,
.preloader,
[class*="preload"] { background: var(--kb-black) !important; }
.preloader .spinner,
[class*="preload"] .spinner {
    border-color: var(--kb-silver-3) !important;
    border-top-color: var(--kb-accent) !important;
}

/* ── 23. SCROLL TO TOP ────────────────────────────────────── */
#goTop,
.go-top,
.progress-wrap,
.scroll-to-top,
#scrollToTop,
[class*="scroll-top"] {
    background: var(--kb-accent) !important;
    border: none !important;
    border-radius: 50% !important;
    box-shadow: 0 4px 16px rgba(0,200,200,0.35) !important;
    color: #000 !important;
}
#goTop:hover, .go-top:hover {
    background: var(--kb-accent-d) !important;
    box-shadow: 0 6px 24px rgba(0,200,200,0.50) !important;
}
#goTop .icon, .go-top .icon,
#goTop i, .go-top i { color: #000 !important; fill: #000 !important; }
#goTop .border-progress, .go-top .border-progress { display: none !important; }
.progress-wrap svg path,
.scroll-to-top svg { stroke: #000 !important; fill: #000 !important; }

/* ── 24. TOOLBAR BOTTOM (MOBILE) ──────────────────────────── */
.toolbar-bottom,
[class*="toolbar-bottom"] {
    background: #050505 !important;
    border-top: 1px solid var(--kb-silver-3) !important;
}
.toolbar-bottom a { color: var(--kb-silver) !important; }
.toolbar-bottom a.active { color: var(--kb-accent) !important; }

/* ── 25. NICE SELECT / CUSTOM SELECTS ─────────────────────── */
.nice-select,
[class*="nice-select"] {
    background: #111315 !important;
    border: 1px solid var(--kb-silver-3) !important;
    color: var(--kb-white) !important;
    border-radius: var(--r-sm) !important;
}
.nice-select.open { border-color: var(--kb-accent) !important; }
.nice-select .list {
    background: #0A0C0E !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-sm) !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.6) !important;
}
.nice-select .option { color: var(--kb-silver) !important; }
.nice-select .option:hover,
.nice-select .option.focus { background: rgba(0,200,200,0.08) !important; color: var(--kb-accent) !important; }
.nice-select .option.selected { color: var(--kb-accent) !important; }
.nice-select::after { border-color: var(--kb-silver) transparent transparent !important; }

/* ── 26. TOOLTIPS ─────────────────────────────────────────── */
.tooltip .tooltip-inner {
    background: #111315 !important;
    border: 1px solid var(--kb-silver-3) !important;
    color: var(--kb-white) !important;
    border-radius: var(--r-sm) !important;
}
.tooltip .tooltip-arrow { border-bottom-color: #111315 !important; }

/* ── 27. PROGRESS BARS ────────────────────────────────────── */
.progress, [class*="progress-bar-wrap"] {
    background: var(--kb-silver-3) !important;
    border-radius: 99px !important;
    height: 6px !important;
}
.progress-bar, [class*="progress-bar"] {
    background: var(--kb-accent) !important;
    border-radius: 99px !important;
}

/* ── 28. REVIEW STARS ─────────────────────────────────────── */
.review-form,
[class*="review-form"] {
    background: var(--kb-card) !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-md) !important;
    padding: 24px !important;
}
.review-item,
[class*="review-item"] { border-bottom: 1px solid var(--kb-silver-3) !important; }
.review-author { color: var(--kb-white) !important; }
.review-content { color: var(--kb-silver) !important; }

/* ── 29. HERO BANNER ──────────────────────────────────────── */
.hero-banner,
[class*="hero-banner"],
.flat-hero,
[class*="hero-home"] { background: var(--kb-black) !important; }
[class*="hero"] .overlay,
[class*="banner"] .overlay {
    background: linear-gradient(135deg, rgba(5,5,5,0.7) 0%, rgba(5,5,5,0.2) 100%) !important;
}

/* ── 30. WISHLIST ─────────────────────────────────────────── */
.wishlist-wrap,
[class*="wishlist"] {
    background: var(--kb-card) !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-md) !important;
}

/* ── 31. COMPARE ──────────────────────────────────────────── */
.compare-table,
[class*="compare"] table { background: transparent !important; border-color: var(--kb-silver-3) !important; }
.compare-table th { background: #0A0C0E !important; color: var(--kb-white) !important; }
.compare-table td { background: var(--kb-card) !important; color: var(--kb-silver) !important; }

/* ── 32. BLOG / POSTS ─────────────────────────────────────── */
.blog-item,
.post-card,
[class*="blog-item"],
[class*="post-card"] {
    background: var(--kb-card) !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-md) !important;
    transition: transform var(--tr-base), box-shadow var(--tr-base) !important;
}
.blog-item:hover, .post-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: var(--sh-card) !important;
}
.blog-item .post-title a,
[class*="blog-item"] .post-title a { color: var(--kb-white) !important; }
.blog-item .post-title a:hover,
[class*="blog-item"] .post-title a:hover { color: var(--kb-accent) !important; }
.blog-item .post-meta,
[class*="blog-item"] .post-meta { color: var(--kb-silver-2) !important; }

.ck-content, .post-content, [class*="post-content"] { color: var(--kb-silver) !important; }
.ck-content h2, .ck-content h3, .post-content h2, .post-content h3 { color: var(--kb-white) !important; }
.ck-content a { color: var(--kb-accent) !important; }
.ck-content ul li::marker { color: var(--kb-accent) !important; }
.ck-content table th { background: #0A0C0E !important; color: var(--kb-white) !important; border-color: var(--kb-silver-3) !important; }
.ck-content table td { border-color: var(--kb-silver-3) !important; color: var(--kb-silver) !important; }

/* ── 33. CONTACT FORM ─────────────────────────────────────── */
.contact-form,
.wg-contact,
[class*="contact-form"] {
    background: var(--kb-card) !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-md) !important;
    padding: 32px !important;
}

/* ── 34. FEATURED / HIGHLIGHT SECTIONS ───────────────────── */
[class*="counter-"], [class*="count-"] .number,
[class*="stat-"] .number { color: var(--kb-white) !important; font-weight: 700 !important; }
[class*="counter-"] .label,
[class*="stat-"] .label { color: var(--kb-silver) !important; }

.flat-feature,
[class*="feature-"],
.box-feature,
[class*="service-card"] {
    background: var(--kb-card) !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-md) !important;
    transition: all var(--tr-base) !important;
}
.flat-feature:hover, [class*="feature-"]:hover {
    border-color: rgba(0,200,200,0.30) !important;
    box-shadow: 0 0 20px rgba(0,200,200,0.08) !important;
}
.flat-feature .icon-wrap,
[class*="feature-"] .icon-wrap { color: var(--kb-accent) !important; }

.testimonial-item,
[class*="testimonial"] {
    background: var(--kb-card) !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-md) !important;
}
.testimonial-item .author-name { color: var(--kb-white) !important; }
.testimonial-item .review-text { color: var(--kb-silver) !important; }

/* ── 35. GLASSMORPHISM CARDS ──────────────────────────────── */
.glass-card,
[class*="glass-"],
.glassmorphism {
    background: rgba(26,29,33,0.75) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    border: 1px solid rgba(46,51,58,0.6) !important;
    border-radius: var(--r-lg) !important;
}

/* ── 36. BACKGROUND UTILITIES ─────────────────────────────── */
.bg-white, .bg-light, .bg-surface,
[class*="bg-white"], [class*="bg-light"] { background: var(--kb-card) !important; }
.bg-main, .bg-dark, .bg-black, .bg-main-2,
.bg-main-3, .bg-main-4, .bg-main-5 { background: var(--kb-black) !important; }
.bg-primary { background: var(--kb-white) !important; }
.bg-secondary { background: var(--kb-silver-3) !important; }

.text-white { color: var(--kb-white) !important; }
.text-secondary, .text-muted, .cl-text-3 { color: var(--kb-silver-2) !important; }
.text-primary { color: var(--kb-accent) !important; }
.text-success { color: var(--kb-accent) !important; }
.text-danger { color: #FF4757 !important; }
.text-warning { color: var(--kb-silver-m) !important; }
.text-info { color: var(--kb-accent) !important; }

/* ── 37. BORDERS & DIVIDERS ───────────────────────────────── */
[class*="border-"], .border { border-color: var(--kb-silver-3) !important; }

/* ── 38. HOVER ANIMATIONS ─────────────────────────────────── */
.card, [class*="-card"] { transition: transform var(--tr-base), box-shadow var(--tr-base) !important; }
.hover-glow-accent:hover { box-shadow: 0 0 24px rgba(0,200,200,0.25) !important; }

/* ── 39. LOADING STATES ───────────────────────────────────── */
.spinner-border { border-color: var(--kb-silver-3) !important; border-top-color: var(--kb-accent) !important; }
.spinner-grow { background: var(--kb-accent) !important; }
.skeleton, [class*="skeleton"] {
    background: linear-gradient(90deg, #111315 25%, #1a1d21 50%, #111315 75%) !important;
    background-size: 200% 100% !important;
    animation: skeleton-loading 1.5s infinite !important;
}
@keyframes skeleton-loading {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* ── 40. PRODUCT SPECIFICATION TABLE ──────────────────────── */
.product-specification,
[class*="specification"] { background: transparent !important; }
.product-specification table,
[class*="specification"] table { border-color: var(--kb-silver-3) !important; }
.product-specification tr,
[class*="specification"] tr { border-bottom: 1px solid var(--kb-silver-3) !important; }
.product-specification tr:hover { background: rgba(255,255,255,0.03) !important; }
.product-specification td:first-child { color: var(--kb-silver) !important; font-weight: 500 !important; }
.product-specification td:last-child { color: var(--kb-white) !important; }

/* ── 41. FLASH SALE / COUNTDOWN ───────────────────────────── */
.flash-sale-wrap,
[class*="flash-sale"],
[class*="countdown"] {
    background: #0A0C0E !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-md) !important;
}
.countdown-time,
[class*="countdown-block"] {
    background: #111315 !important;
    border: 1px solid var(--kb-silver-3) !important;
    color: var(--kb-white) !important;
    border-radius: var(--r-sm) !important;
}
.countdown-label { color: var(--kb-silver-2) !important; }

/* ── 42. PRODUCT VIDEO ────────────────────────────────────── */
.bb-product-video,
[class*="product-video"] {
    background: #000 !important;
    border-radius: var(--r-md) !important;
    overflow: hidden !important;
}
.bb-product-video__unmute {
    background: rgba(0,0,0,0.7) !important;
    border: 1px solid rgba(255,255,255,0.2) !important;
    backdrop-filter: blur(8px) !important;
    border-radius: 50% !important;
    color: #fff !important;
    transition: all var(--tr-base) !important;
}
.bb-product-video__unmute:hover {
    background: var(--kb-accent) !important;
    border-color: var(--kb-accent) !important;
    color: #000 !important;
}

/* ── 43. CATEGORY CARDS ───────────────────────────────────── */
.category-item,
[class*="category-v"],
[class*="cate-item"] {
    background: var(--kb-card) !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-md) !important;
    transition: all var(--tr-base) !important;
    overflow: hidden !important;
}
.category-item:hover,
[class*="category-v"]:hover,
[class*="cate-item"]:hover {
    border-color: rgba(0,200,200,0.30) !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.5) !important;
}
.category-item .cate-name,
[class*="cate-item"] .name,
[class*="category-"] .title { color: var(--kb-white) !important; }

/* ── 44. SHORTCODE / ZOOM ─────────────────────────────────── */
[class*="zoom-product"],
[class*="product-feature-zoom"],
[class*="style-3-pdp"] { background: transparent !important; }

/* ── 45. TOASTS / SNACKBARS ───────────────────────────────── */
.toast,
[class*="toast"] {
    background: #111315 !important;
    border: 1px solid var(--kb-silver-3) !important;
    color: var(--kb-white) !important;
    border-radius: var(--r-sm) !important;
}
.toast-header { background: #0A0C0E !important; border-bottom: 1px solid var(--kb-silver-3) !important; color: var(--kb-white) !important; }

/* ── 46. PREMIUM SILVER ACCENTS ───────────────────────────── */
.badge-premium-gold,
.vip-badge,
.featured-ribbon,
.limited-edition-tag,
.premium-icon { color: var(--kb-silver-m) !important; }
.luxury-border { border-color: var(--kb-silver-m) !important; box-shadow: 0 0 8px rgba(217,221,227,0.15) !important; }
.product-badge_item.featured::before,
[class*="ribbon-featured"] { background: var(--kb-silver-m) !important; color: #000 !important; }

/* ── 47. ICON COLORS ──────────────────────────────────────── */
.icon, svg, [class*="ti-"], [class*="icon-"] {
    color: var(--kb-white);
    transition: color var(--tr-base);
}
.icon-secondary { color: var(--kb-silver) !important; }
.icon-interactive, .icon-action { color: var(--kb-accent) !important; }
.icon-tech, .icon-cyan { color: var(--kb-accent) !important; }

/* ── 48. RESPONSIVE ───────────────────────────────────────── */
@media (max-width: 767px) {
    .header-main, [class*="header-s"] { padding: 8px 0 !important; }
    .mini-cart, .offcanvas { width: 100% !important; max-width: 360px !important; }
}

/* ── 49. SMOOTH PAGE TRANSITIONS ──────────────────────────── */
* { scroll-behavior: smooth; }
a, button, input, select, textarea,
.card-product, .blog-item, .category-item {
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

/* ── 50. HIDE EMPTY PLACEHOLDER SECTIONS ─────────────────── */
img[src=""],
img:not([src]),
img[src="#"] { display: none !important; }
.widget-payment-methods:empty,
.list-card:empty,
.widget-payment-item:empty { display: none !important; }

/* Hide 76×48 broken payment placeholder images everywhere */
img[width="76"] { display: none !important; }
li:has(> img[width="76"]),
li:has(img[width="76"]) { display: none !important; }
.card-item:has(img[width="76"]) { display: none !important; }
.tf-product-trust-seal .list-card li img[width="76"],
.widget-payment-methods .list-card li img[width="76"],
.list-card li img[width="76"] { display: none !important; }

/* ── 51. SEARCH BAR — UNIFIED PILL ───────────────────────── */
.form_search-product.bb-form-quick-search,
.form-search-nav.bb-form-quick-search {
    background: #111315 !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: 40px !important;
    display: flex !important;
    align-items: stretch !important;
    overflow: hidden !important;
    box-shadow: none !important;
    padding: 0 !important;
}
.form_search-product.bb-form-quick-search:focus-within,
.form-search-nav.bb-form-quick-search:focus-within {
    border-color: var(--kb-accent) !important;
    box-shadow: 0 0 0 2px rgba(0,200,200,0.15) !important;
}
.bb-form-quick-search .select-category {
    background: transparent !important;
    border: none !important;
    border-right: 1px solid rgba(46,51,58,0.6) !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 !important;
    border-radius: 0 !important;
}
.bb-form-quick-search .select-category select,
.bb-form-quick-search .dropdown_product_cate {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
    color: var(--kb-white) !important;
    border-radius: 0 !important;
    padding: 0 28px 0 16px !important;
    height: 44px !important;
    min-width: 120px !important;
    cursor: pointer !important;
    font-size: 13px !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23C7CCD4' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 10px center !important;
}
.bb-form-quick-search .select-category select:focus,
.bb-form-quick-search .dropdown_product_cate:focus {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
.bb-form-quick-search .br-line.type-vertical { display: none !important; }

/* Theme's custom select UI (replaces the native select) — must sit
   seamlessly inside the single pill: no own border/background. */
.bb-form-quick-search .tf-select-custom {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    color: var(--kb-white) !important;
    height: 44px !important;
    line-height: 44px !important;
    padding: 0 32px 0 20px !important;
    min-width: 132px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    position: relative !important;
}
.bb-form-quick-search .tf-select-custom::after {
    content: '' !important;
    position: absolute !important;
    right: 14px !important;
    top: 50% !important;
    width: 10px !important;
    height: 7px !important;
    transform: translateY(-50%) !important;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23C7CCD4' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / contain !important;
    border: none !important;
}
.bb-form-quick-search .tf-select-custom:hover { color: var(--kb-accent) !important; }

/* Custom dropdown panel */
.bb-form-quick-search .select-options {
    background: var(--kb-card) !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-sm) !important;
    box-shadow: 0 12px 36px rgba(0,0,0,0.6) !important;
    overflow: hidden !important;
}
.bb-form-quick-search .select-options li,
.bb-form-quick-search .select-options a,
.bb-form-quick-search .select-options span {
    color: var(--kb-silver) !important;
}
.bb-form-quick-search .select-options li:hover,
.bb-form-quick-search .select-options li:hover a {
    background: rgba(255,255,255,0.06) !important;
    color: var(--kb-accent) !important;
}
.bb-form-quick-search .select-options .header-select-option {
    border-bottom: 1px solid var(--kb-silver-3) !important;
    background: #111315 !important;
}
.bb-form-quick-search .fieldset-search,
.bb-form-quick-search fieldset {
    background: transparent !important;
    border: none !important;
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 !important;
    margin: 0 !important;
    min-width: 0 !important;
}
.bb-form-quick-search .ipt,
.bb-form-quick-search .fieldset-search input[type="text"],
.bb-form-quick-search fieldset input[type="text"] {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
    color: var(--kb-white) !important;
    border-radius: 0 !important;
    flex: 1 !important;
    padding: 0 12px !important;
    height: 44px !important;
    font-size: 14px !important;
    width: 100% !important;
}
.bb-form-quick-search .ipt:focus,
.bb-form-quick-search fieldset input:focus {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
.bb-form-quick-search .btn-action {
    background: transparent !important;
    border: none !important;
    color: var(--kb-silver) !important;
    padding: 0 18px !important;
    height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: color var(--tr-base) !important;
    flex-shrink: 0 !important;
    border-radius: 0 40px 40px 0 !important;
}
.bb-form-quick-search .btn-action:hover { color: var(--kb-accent) !important; }
.bb-form-quick-search .btn-action svg,
.bb-form-quick-search .btn-action i { color: inherit !important; }

/* ── 52. BOOTSTRAP CARDS & ACCOUNT PAGE DARK THEME ────────── */
.card {
    background: var(--kb-card) !important;
    border-color: var(--kb-silver-3) !important;
    color: var(--kb-silver) !important;
}
.card-body { background: transparent !important; }
.card-header {
    background: rgba(255,255,255,0.03) !important;
    border-bottom-color: var(--kb-silver-3) !important;
    color: var(--kb-white) !important;
}
.card-footer {
    background: rgba(255,255,255,0.03) !important;
    border-top-color: var(--kb-silver-3) !important;
}
.card-title { color: var(--kb-white) !important; }
.card-text { color: var(--kb-silver) !important; }

.card.bg-primary, .card[class*="bg-primary"] { background: rgba(0,200,200,0.08) !important; border-color: rgba(0,200,200,0.20) !important; }
.card.bg-success, .card[class*="bg-success"] { background: rgba(0,200,200,0.08) !important; border-color: rgba(0,200,200,0.20) !important; }
.card.bg-warning, .card[class*="bg-warning"] { background: rgba(217,221,227,0.08) !important; border-color: rgba(217,221,227,0.20) !important; }
.card.bg-info,    .card[class*="bg-info"]    { background: rgba(0,200,200,0.08) !important; border-color: rgba(0,200,200,0.20) !important; }
.card.bg-danger,  .card[class*="bg-danger"]  { background: rgba(255,71,87,0.08) !important; border-color: rgba(255,71,87,0.20) !important; }

.btn-success { background: var(--kb-accent) !important; border-color: var(--kb-accent) !important; color: #000 !important; }
.btn-success:hover { background: var(--kb-accent-d) !important; border-color: var(--kb-accent-d) !important; }
.btn-warning { background: var(--kb-silver-m) !important; border-color: var(--kb-silver-m) !important; color: #000 !important; }
.btn-warning:hover { background: #c8ccd2 !important; }
.btn-info { background: var(--kb-accent) !important; border-color: var(--kb-accent) !important; color: #000 !important; }
.btn-outline-secondary { border-color: var(--kb-silver-3) !important; color: var(--kb-silver) !important; background: transparent !important; }
.btn-outline-secondary:hover { background: rgba(255,255,255,0.06) !important; border-color: var(--kb-silver) !important; color: var(--kb-white) !important; }

.bg-primary.bg-opacity-20 { background: rgba(0,200,200,0.15) !important; }
.bg-success.bg-opacity-20 { background: rgba(0,200,200,0.15) !important; }
.bg-warning.bg-opacity-20 { background: rgba(217,221,227,0.15) !important; }
.bg-info.bg-opacity-20    { background: rgba(0,200,200,0.15) !important; }

.bb-customer-page { background: var(--kb-black) !important; }
.bb-customer-page .customer-body { background: transparent !important; }
.bb-customer-page .bg-white,
.bb-customer-page [class*="bg-white"] {
    background: #0A0C0E !important;
    border-color: var(--kb-silver-3) !important;
}
.bb-customer-page .border-bottom { border-color: var(--kb-silver-3) !important; }
.bb-customer-sidebar-wrapper {
    background: #080A0C !important;
    border-right: 1px solid var(--kb-silver-3) !important;
}
.bb-customer-sidebar { background: transparent !important; }
.bb-customer-sidebar-heading { border-bottom: 1px solid var(--kb-silver-3) !important; }
.bb-customer-sidebar-heading .name { color: var(--kb-white) !important; }
.bb-customer-sidebar-heading .email { color: var(--kb-silver-2) !important; }
.bb-customer-navigation .nav-link {
    color: var(--kb-silver) !important;
    border-radius: var(--r-sm) !important;
    transition: all var(--tr-base) !important;
}
.bb-customer-navigation .nav-link:hover { background: rgba(0,200,200,0.06) !important; color: var(--kb-accent) !important; }
.bb-customer-navigation .nav-link.active { background: rgba(0,200,200,0.10) !important; color: var(--kb-accent) !important; }
.bb-customer-navigation .nav-link i,
.bb-customer-navigation .nav-link svg { color: inherit !important; }
.bb-customer-profile-wrapper {
    background: var(--kb-card) !important;
    border: 1px solid var(--kb-silver-3) !important;
    border-radius: var(--r-md) !important;
}
.bb-customer-profile-wrapper h2,
.bb-customer-profile-wrapper .h4 { color: var(--kb-white) !important; }
.bb-customer-profile-wrapper p { color: var(--kb-silver) !important; }
.bb-customer-sidebar-heading .bg-success { background: var(--kb-accent) !important; }
.bb-customer-page .text-muted { color: var(--kb-silver-2) !important; }
.bb-customer-page .fw-semibold { color: var(--kb-white) !important; }
.bg-primary .text-white, .bg-success .text-white,
.bg-warning .text-white, .bg-info .text-white { color: #fff !important; }

/* ── 53. WHATSAPP SUPPORT BUTTON ──────────────────────────── */
.whatsapp-support-btn {
    position: fixed !important;
    bottom: 28px !important;
    left: 28px !important;
    z-index: 9999 !important;
    width: 52px !important;
    height: 52px !important;
    border-radius: 50% !important;
    background: #25D366 !important;
    color: #fff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 4px 20px rgba(37,211,102,0.45) !important;
    text-decoration: none !important;
    transition: transform 250ms ease, box-shadow 250ms ease, background 250ms ease !important;
    border: none !important;
}
.whatsapp-support-btn:hover {
    background: #1ebe5d !important;
    color: #fff !important;
    transform: scale(1.10) !important;
    box-shadow: 0 6px 28px rgba(37,211,102,0.60) !important;
    text-decoration: none !important;
}
.whatsapp-support-btn svg { flex-shrink: 0; }
.whatsapp-support-btn::before {
    content: '' !important;
    position: absolute !important;
    inset: -4px !important;
    border-radius: 50% !important;
    border: 2px solid rgba(37,211,102,0.45) !important;
    animation: wa-pulse 2s ease-in-out infinite !important;
    pointer-events: none !important;
}
@keyframes wa-pulse {
    0%   { transform: scale(1);   opacity: 1; }
    70%  { transform: scale(1.25);opacity: 0; }
    100% { transform: scale(1.25);opacity: 0; }
}

/* ── 54. PRINT ────────────────────────────────────────────── */
@media print {
    body { background: #fff !important; color: #000 !important; }
    .header-main, .footer, .toolbar-bottom { display: none !important; }
}

/* ── 55. PRODUCT DESCRIPTION READABILITY ─────────────────────
   Editor content carries inline styles like color:rgb(0,0,0)
   which are invisible on the dark theme. !important beats
   inline styles, so force readable colors on all content. */
.product-infor-desc,
.product-infor-desc *,
.desc-pop,
.desc-pop *,
.tf-product-description,
.tf-product-description *,
[class*="product-description"] *,
.widget-tabs .widget-content-inner,
.widget-tabs .widget-content-inner *,
.tab-content .tab-pane,
.tab-content .tab-pane p,
.tab-content .tab-pane span,
.tab-content .tab-pane li,
.tf-pr-attrs td,
.tf-pr-attrs th {
    color: var(--kb-silver) !important;
}

.product-infor-desc h1, .product-infor-desc h2, .product-infor-desc h3,
.product-infor-desc h4, .product-infor-desc h5, .product-infor-desc h6,
.product-infor-desc strong, .product-infor-desc b,
.tf-product-description h1, .tf-product-description h2, .tf-product-description h3,
.tf-product-description h4, .tf-product-description strong, .tf-product-description b,
.widget-tabs .widget-content-inner h1, .widget-tabs .widget-content-inner h2,
.widget-tabs .widget-content-inner h3, .widget-tabs .widget-content-inner h4,
.widget-tabs .widget-content-inner strong, .widget-tabs .widget-content-inner b,
.tab-content .tab-pane h1, .tab-content .tab-pane h2, .tab-content .tab-pane h3,
.tab-content .tab-pane h4, .tab-content .tab-pane strong, .tab-content .tab-pane b {
    color: var(--kb-white) !important;
}

.product-infor-desc a,
.tf-product-description a,
.widget-tabs .widget-content-inner a {
    color: var(--kb-accent) !important;
}

/* ── 60. PRODUCT CONTENT TYPE SCALE ──────────────────────────
   Editor content arrives with tiny body text and oversized
   embedded headings; normalize into a clear hierarchy. */

/* Buy-column description (right of gallery) */
.product-infor-desc,
.product-infor-desc p,
.product-infor-desc span,
.product-infor-desc div {
    font-size: 14.5px !important;
    line-height: 1.8 !important;
}
.product-infor-desc h1,
.product-infor-desc h2,
.product-infor-desc h3 {
    font-size: 17px !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;
    margin: 20px 0 8px !important;
    letter-spacing: 0.2px !important;
}
.product-infor-desc h4,
.product-infor-desc h5,
.product-infor-desc h6 {
    font-size: 15px !important;
    font-weight: 700 !important;
    margin: 14px 0 6px !important;
}
.product-infor-desc ul,
.product-infor-desc ol {
    list-style: disc !important;
    padding-left: 20px !important;
    margin: 6px 0 14px !important;
}
.product-infor-desc li {
    font-size: 14px !important;
    line-height: 1.75 !important;
    margin-bottom: 4px !important;
    list-style: disc !important;
}
.product-infor-desc p { margin-bottom: 10px !important; }

/* Description tab (full-width section below the gallery) */
.widget-tabs .widget-content-inner,
.widget-tabs .widget-content-inner p,
.widget-tabs .widget-content-inner span,
.tab-content .tab-pane p,
.tab-content .tab-pane span {
    font-size: 15px !important;
    line-height: 1.85 !important;
}
.widget-tabs .widget-content-inner h1,
.tab-content .tab-pane h1 {
    font-size: 28px !important;
    line-height: 1.3 !important;
    margin: 0 0 6px !important;
}
.widget-tabs .widget-content-inner h2,
.tab-content .tab-pane h2 {
    font-size: 22px !important;
    line-height: 1.35 !important;
    margin: 22px 0 10px !important;
}
.widget-tabs .widget-content-inner h3,
.tab-content .tab-pane h3 {
    font-size: 19px !important;
    line-height: 1.4 !important;
    margin: 20px 0 8px !important;
}
.widget-tabs .widget-content-inner ul,
.tab-content .tab-pane ul {
    list-style: disc !important;
    padding-left: 22px !important;
    margin: 8px 0 16px !important;
}
.widget-tabs .widget-content-inner li,
.tab-content .tab-pane li {
    font-size: 15px !important;
    line-height: 1.8 !important;
    margin-bottom: 5px !important;
    list-style: disc !important;
}
.widget-tabs .widget-content-inner p,
.tab-content .tab-pane p { margin-bottom: 12px !important; }

@media (max-width: 767px) {
    .widget-tabs .widget-content-inner h1,
    .tab-content .tab-pane h1 { font-size: 23px !important; }
    .widget-tabs .widget-content-inner h2,
    .tab-content .tab-pane h2 { font-size: 19px !important; }
    .widget-tabs .widget-content-inner h3,
    .tab-content .tab-pane h3 { font-size: 17px !important; }
}

/* ── 56. STICKY ADD-TO-CART BAR ──────────────────────────────
   Theme default is a white bar; restyle to match dark brand. */
.tf-sticky-btn-atc {
    background: #0E1013 !important;
    border-top: 1px solid var(--kb-silver-3) !important;
    box-shadow: 0 -8px 28px rgba(0,0,0,0.6) !important;
}
/* Product info (image, name, SKU, price) — left side */
.tf-sticky-btn-atc .tf-sticky-atc-product,
.tf-sticky-btn-atc .tf-sticky-atc-product * {
    color: var(--kb-white) !important;
}
.tf-sticky-btn-atc .tf-sticky-atc-product del,
.tf-sticky-btn-atc .tf-sticky-atc-product s {
    color: #8C9199 !important;
}
.tf-sticky-btn-atc .prd_img img {
    background: #FFFFFF !important;
    border-radius: 8px !important;
}

/* Action buttons — right side. Add To Cart: white pill, dark text. */
.tf-sticky-btn-atc .tf-btn.btn-add-to-cart,
.tf-sticky-btn-atc .tf-btn.btn-add-to-cart * {
    background: #FFFFFF !important;
    color: #050505 !important;
}
.tf-sticky-btn-atc .tf-btn.btn-add-to-cart {
    height: 48px !important;
    padding: 0 26px !important;
    display: inline-flex !important;
    align-items: center !important;
    border-radius: 40px !important;
}
.tf-sticky-btn-atc .tf-btn.btn-add-to-cart:hover,
.tf-sticky-btn-atc .tf-btn.btn-add-to-cart:hover * {
    background: var(--kb-accent) !important;
    color: #000 !important;
}
.tf-sticky-btn-atc .tf-btn.btn-add-to-cart * {
    background: transparent !important;
}

/* Buy now: outline pill on the dark bar */
.tf-sticky-btn-atc .btn-buy-now,
.tf-sticky-btn-atc .btn-buy-now * {
    background: transparent !important;
    color: var(--kb-white) !important;
}
.tf-sticky-btn-atc .btn-buy-now {
    border: 1.5px solid var(--kb-silver-3) !important;
    height: 48px !important;
    padding: 0 26px !important;
    display: inline-flex !important;
    align-items: center !important;
    border-radius: 40px !important;
}
.tf-sticky-btn-atc .btn-buy-now:hover {
    border-color: var(--kb-accent) !important;
}
.tf-sticky-btn-atc .btn-buy-now:hover * {
    color: var(--kb-accent) !important;
}
.tf-sticky-btn-atc select,
.tf-sticky-btn-atc .form-select {
    background: var(--kb-card) !important;
    color: var(--kb-white) !important;
    border: 1px solid var(--kb-silver-3) !important;
}


/* ── CAPACITY / SIZE PILL BUTTONS (text layout, dark theme) ── */
.tf-product-info-wrap .variant-size .size-btn:not(.select-item) {
    background: transparent !important;
    border: 1.5px solid var(--kb-silver-3) !important;
    color: var(--kb-silver) !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    min-width: 72px !important;
    height: 40px !important;
    padding: 0 16px !important;
    transition: all 0.2s ease !important;
}
.tf-product-info-wrap .variant-size .size-btn:not(.select-item):hover {
    border-color: var(--kb-accent) !important;
    color: var(--kb-accent) !important;
}
.tf-product-info-wrap .variant-size .size-btn:not(.select-item).active {
    background: var(--kb-white) !important;
    color: #0E1013 !important;
    border-color: var(--kb-white) !important;
    font-weight: 700 !important;
}
.tf-product-info-wrap .variant-size .size-btn:not(.select-item).disabled {
    opacity: 0.35 !important;
    pointer-events: none !important;
}
.tf-product-info-wrap .variant-size .variant-picker-values {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
}
.tf-product-info-wrap .variant-size .variant-picker-label {
    margin-bottom: 10px !important;
}


/* ── GALLERY THUMBS: rebuilt slides must be immediately visible ── */
/* rebuildGalleryFromVariation builds thumb slides with stagger-item (no stagger-finished)     */
/* theme.css .stagger-wrap .stagger-item { opacity: 0 } keeps rebuilt thumbs invisible         */
.tf-product-media-thumbs .stagger-item {
    opacity: 1 !important;
    transform: none !important;
}

/* -- PRODUCT CARD: star rating colours -- */
.card-product__rating .icon-Star:not(.cl-text-3) {
    color: #f5a623 !important;
}
.card-product__rating .icon-Star.cl-text-3 {
    color: #8a8a99 !important;
}
.card-product__rating span.text-muted {
    color: #9a9aaa !important;
}

/* -- PRODUCT DETAIL PAGE: rating stars + review count visibility -- */
/* Make bb-product-rating stars visible on dark theme */
.tf-product-info-wrap .bb-product-rating {
    display: inline-block !important;
    vertical-align: middle !important;
}
/* Review count text: bright and readable */
.tf-product-info-wrap .meta_rate .text-caption-01 {
    color: var(--kb-silver, #c7ccd4) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}
/* meta row: align items and give breathing room */
.tf-product-info-wrap .product-infor-meta {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
}
.tf-product-info-wrap .meta_rate {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
}

/* -- PRODUCT CARD: sold count badge -- */
.card-product_info .kb-sold-count {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    font-weight: 500;
    color: var(--kb-silver-3, #9a9aaa);
    margin-top: 2px;
}
.card-product_info .kb-sold-count .icon {
    font-size: 11px;
    color: var(--kb-accent, #00c8c8);
}
