/* shop-classic-theme.css — extracted from shop-classic.html (no rule edits). Build: 20260821 */
        /* === TYPOGRAPHY (Dashboard → Customization → Typography; --font-* set on :root by script-classic.js) === */
        .top-bar-custom { font-size: var(--font-top-bar); }
        .menu-bar-link,
        #desktop-nav-container a { font-size: var(--font-nav); }
        .header--shwapno .menu-bar-link { font-size: var(--font-category-pill, var(--font-nav)); }
        .header-icon-link { font-size: var(--font-nav); }
        .shwapno-pill { font-size: var(--font-category-pill); }
        .site-footer,
        .site-footer .footer-link,
        .site-footer p,
        .site-footer span,
        .site-footer a:not(.social-btn) { font-size: var(--font-footer); }
        .discount-badge,
        .discount-badge span { font-size: var(--font-badge) !important; }
        .card-order-btn,
        .shwapno-add-btn,
        .card-order-now-btn,
        .card-call-btn { font-size: var(--font-button) !important; }
        .classic-card .card-content h3,
        .product-card.product-card--shwapno h3,
        .product-card--daraz h3,
        .product-card--order-call .product-card-link h3,
        .product-card--arazshop h3,
        .product-card--gb-card .gb-card-title,
        .app-style-card h3 { font-size: var(--font-product-title) !important; }
        .classic-card .price-row span.font-bold,
        .product-card--shwapno .shwapno-price-row .font-bold,
        .product-card--shwapno .font-bold.text-base,
        .product-card--daraz .font-bold.text-sm,
        .product-card--chaldal .chaldal-card-price,
        .product-card--order-call .price-row .font-bold,
        .product-card--arazshop .arazshop-sale-price,
        .product-card--gb-card .gb-card-sale-price { font-size: var(--font-product-price) !important; }
        .classic-card .card-content > span.text-green-600,
        .classic-card .card-content > span.text-red-600,
        .product-card--shwapno .shwapno-card-delivery,
        .product-card--shwapno .shwapno-price-mrp,
        .app-style-card .p-2 > p { font-size: var(--font-card-description) !important; }
        #cart-drawer,
        #cart-drawer .cart-item-row,
        #cart-drawer p,
        #cart-drawer span,
        #cart-drawer button { font-size: var(--font-cart-drawer); }
        #cart-drawer .fa-solid,
        #cart-drawer .fa-regular { font-size: 1em; }
        
        a { text-decoration: none; color: inherit; }
        a:focus-visible, button:focus-visible, [role="button"]:focus-visible { outline: 2px solid var(--accent-color); outline-offset: 2px; }
        /* Accessibility: 48px min tap targets on mobile */
        @media (max-width: 767px) {
            .header-icon-link, .mobile-menu-toggle, .cart-toggle { min-width: 48px; min-height: 48px; display: inline-flex; align-items: center; justify-content: center; }
            .main-swiper-nav { width: 48px; height: 48px; }
        }
        img { display: block; }
        
        /* === UPDATED CONTAINER (FIXED LAYOUT) === */
        .container {
            width: 100%;
            margin-left: auto;
            margin-right: auto;
            padding-left: 1rem;
            padding-right: 1rem;
        }

        /* Responsive Breakpoints for Container */
        @media (min-width: 640px) {
            .container { max-width: 640px; }
        }
        @media (min-width: 768px) {
            .container { max-width: 768px; padding-left: 1.5rem; padding-right: 1.5rem; }
        }
        @media (min-width: 1024px) {
            .container { max-width: 1024px; padding-left: 2rem; padding-right: 2rem; }
        }
        @media (min-width: 1280px) {
            .container { max-width: 1250px; } /* Standard Desktop */
        }
        @media (min-width: 1536px) {
            .container { max-width: 1380px; } /* Large Desktop */
        }
        /* desktopContentSideGapPx → --desktop-content-side-gap (script). Large blank at viewport edge is often (100vw − shell max-width)/2, not that gap; use ?layoutDebug=1 on the shop URL to inspect. */
        :root {
            --desktop-side-gutter: var(--desktop-content-side-gap, 0px);
            --home-centered-max-width: 1380px;
            --pixel-home-shell-width: 1320px;
            --pixel-home-shell-pad: 0px;
            --pixel-home-border: #e5e7eb;
            --pixel-home-radius: 8px;
        }

        /* Classic home: boxed layout (banner + categories aligned with main container) */
        #home-view.layout-home-boxed .main-swiper-wrapper {
            border-radius: 0.75rem;
        }
        #pc-slider-area .main-swiper-wrapper {
            border-radius: 12px 12px 0 0;
        }
        #pc-category-section {
            background-color: transparent;
            border-bottom: 0;
            border-top: 1px solid var(--card-border);
            border-radius: 0 0 12px 12px;
            overflow: hidden;
        }
        #pc-category-section .category-swiper {
            padding: 6px 8px 10px;
        }
        @media (min-width: 1024px) {
            #desktop-header .container,
            #pc-hero-section #classic-pc-hero-stack,
            #classic-pc-below-slider,
            #classic-home-main-content,
            #category-subnav-bar .container {
                max-width: var(--pixel-home-shell-width);
                margin-left: auto;
                margin-right: auto;
            }
            #desktop-header {
                box-shadow: none;
                border-bottom: 1px solid var(--pixel-home-border);
            }
            #desktop-header .header-el-top-row {
                padding-top: 9px;
                padding-bottom: 9px;
            }
            #desktop-header .header-el-top-row > .container {
                gap: 12px;
                padding-left: var(--desktop-side-gutter, 0px);
                padding-right: var(--desktop-side-gutter, 0px);
            }
            #desktop-header .header-el-menu-bar {
                height: 34px;
            }
            #desktop-header .header-el-menu-bar > .container {
                padding-left: var(--desktop-side-gutter, 0px);
                padding-right: var(--desktop-side-gutter, 0px);
            }
            #pc-hero-section #classic-pc-hero-stack {
                padding-left: var(--desktop-side-gutter, 0px);
                padding-right: var(--desktop-side-gutter, 0px);
                padding-top: 8px;
            }
            #pc-slider-area {
                height: 300px;
                border: 1px solid var(--pixel-home-border);
                border-radius: var(--pixel-home-radius) var(--pixel-home-radius) 0 0;
                overflow: hidden;
            }
            #pc-slider-area .main-swiper-wrapper {
                border-radius: 0;
            }
            #desktop-category-sidebar {
                width: 250px;
            }
            #classic-pc-below-slider {
                padding-left: var(--desktop-side-gutter, 0px);
                padding-right: var(--desktop-side-gutter, 0px);
            }
            #pc-small-banners {
                margin-top: 8px;
                gap: 8px;
            }
            #pc-small-banners > * {
                height: 122px;
                min-height: 122px;
            }
            #pc-category-section {
                margin-top: 8px;
                border: 1px solid var(--pixel-home-border);
                border-radius: 0 0 var(--pixel-home-radius) var(--pixel-home-radius);
                background: #fff;
            }
            #pc-category-section .category-swiper {
                padding: 8px 8px 9px;
            }
            #pc-category-section .category-card-shwapno {
                border-radius: var(--cat-radius-pc, 7px);
                box-shadow: none;
                border-color: #dfe3e8;
            }
            #pc-category-section .category-card-shwapno-label {
                font-size: 12px;
                padding: 7px 8px;
                border-radius: 0 0 min(10px, var(--cat-radius-pc, 10px)) min(10px, var(--cat-radius-pc, 10px));
            }
            .homepage-features-section-slot {
                padding-top: 8px;
                padding-bottom: 2px;
            }
            .homepage-features-grid {
                gap: var(--optional-feature-grid-gap, 10px);
            }
            .homepage-feature-card {
                min-height: 66px;
                border-radius: 6px;
                box-shadow: none;
                padding: 9px 12px;
            }
            .section-header {
                margin-bottom: 10px;
                padding-top: 4px;
                padding-bottom: 4px;
            }
            .section-title {
                font-size: 30px;
                letter-spacing: 0.01em;
                font-weight: 800;
            }
            #classic-home-main-content {
                margin-top: 12px;
                padding-left: calc(var(--classic-product-side-padding, 0px) + var(--desktop-side-gutter, 0px));
                padding-right: calc(var(--classic-product-side-padding, 0px) + var(--desktop-side-gutter, 0px));
            }
            #main-product-grid.products-grid {
                border-radius: 8px;
                padding: 10px;
                gap: 10px;
                box-shadow: none;
            }
            #main-product-grid .classic-card {
                border-radius: 6px;
                box-shadow: none;
            }
        }

        #pc-banner-wrapper .swiper-slide { display: flex; align-items: center; justify-content: center; background: #f3f4f6; }
        #pc-banner-wrapper .swiper-slide img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; object-fit: cover !important; object-position: center; }
        .banner-slide-split { display: grid !important; grid-template-columns: 1fr 1fr; min-height: 100%; }
        .banner-slide-split .banner-text-side { display: flex; flex-direction: column; justify-content: center; padding: 2.5rem 2.5rem 3rem; position: relative; overflow: hidden; background: linear-gradient(135deg, #064e3b 0%, #065f46 50%, #047857 100%); }
        .banner-slide-split .banner-text-side::before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 20% 30%, rgba(255,255,255,0.08) 0%, transparent 45%), radial-gradient(circle at 80% 70%, rgba(255,255,255,0.06) 0%, transparent 40%); pointer-events: none; }
        .banner-slide-split .banner-text-side .banner-title { font-size: clamp(1.25rem, 2.2vw, 1.75rem); font-weight: 800; line-height: 1.35; color: #fff; margin-bottom: 0.75rem; text-shadow: 0 1px 2px rgba(0,0,0,0.2); }
        .banner-slide-split .banner-text-side .banner-subtitle { font-size: clamp(0.875rem, 1.2vw, 1rem); color: rgba(255,255,255,0.9); line-height: 1.5; }
        .banner-slide-split .banner-image-side { position: relative; overflow: hidden; }
        .banner-slide-split .banner-image-side img { object-fit: cover !important; object-position: center; }
        .main-swiper-wrapper { position: relative; }
        .main-swiper-nav { position: absolute; top: 50%; transform: translateY(-50%); z-index: 20; width: 40px; height: 40px; border-radius: 50%; background: rgba(255,255,255,0.9); color: #111; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 2px 8px rgba(0,0,0,0.15); transition: all 0.2s; border: none; }
        .main-swiper-nav:hover { background: #fff; box-shadow: 0 4px 12px rgba(0,0,0,0.2); }
        .main-swiper-nav.prev { left: 12px; }
        .main-swiper-nav.next { right: 12px; }
        .main-swiper .swiper-pagination { bottom: 16px !important; }
        .main-swiper .swiper-pagination-bullet { background: rgba(255,255,255,0.6); opacity: 1; }
        .main-swiper .swiper-pagination-bullet-active { background: #fff !important; transform: scale(1.2); }

        .custom-scrollbar::-webkit-scrollbar { width: 5px; }
        .custom-scrollbar::-webkit-scrollbar-track { background: #f1f1f1; }
        .custom-scrollbar::-webkit-scrollbar-thumb { background: #d1d5db; border-radius: 5px; }
        .custom-scrollbar::-webkit-scrollbar-thumb:hover { background: #9ca3af; }
        .custom-scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }
        .custom-scrollbar-hide::-webkit-scrollbar { display: none; }

        .swiper-pagination-bullet-active { background: var(--accent-color) !important; opacity: 1; }

        .sidebar-link { display: flex; align-items: center; gap: 12px; padding: 11px 20px; border-bottom: 1px solid #f3f4f6; font-size: 14px; color: var(--text-primary); transition: 0.2s; cursor: pointer; background: var(--card-bg); }
        .sidebar-link:hover { background-color: var(--body-bg); color: #111827; padding-left: 25px; }
        .sidebar-link img { width: 20px; height: 20px; object-fit: contain; }
        /* Shwapno-exact PC left category column (matches shwapno.com megamenu column feel) */
        #pc-slider-area.pc-layout-shwapno-left #desktop-category-sidebar.sidebar--shwapno-pc.shwapno-sidebar-wrap,
        #desktop-category-sidebar.sidebar--shwapno-pc.shwapno-sidebar-wrap {
            display: flex !important;
            flex-direction: column;
            height: 100%;
            min-height: 0;
            width: 268px !important;
            flex-shrink: 0;
            background: #fff !important;
            border-right: 1px solid #e5e7eb;
            overflow: hidden;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-sidebar-list {
            flex: 1 1 auto;
            min-height: 0;
            overflow-y: auto;
            overflow-x: hidden;
            scrollbar-width: none;
            -ms-overflow-style: none;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-sidebar-list::-webkit-scrollbar { display: none; }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-cat-row {
            position: relative;
            border-bottom: 1px solid #eef2f6;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-cat-row > .shwapno-cat {
            padding-right: 14px;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-cat {
            display: flex;
            align-items: center;
            gap: 12px;
            min-height: 46px;
            padding: 0 18px;
            background: #fff;
            color: #111827;
            font-size: var(--font-sidebar-category, 14px);
            font-weight: 400;
            text-decoration: none;
            transition: background-color 0.15s ease;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-cat:hover { background: #f8fafc; }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-cat-ico {
            width: calc(var(--font-sidebar-category-icon, 22px) + 6px);
            height: calc(var(--font-sidebar-category-icon, 22px) + 6px);
            flex-shrink: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 6px;
            background: #f9fafb;
            border: 1px solid #eef2f6;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-cat-ico-img {
            width: var(--font-sidebar-category-icon, 22px);
            height: var(--font-sidebar-category-icon, 22px);
            object-fit: contain;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-cat-ico-fa { font-size: calc(var(--font-sidebar-category-icon, 22px) * 0.6); color: #6b7280; }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-cat-name {
            flex: 1 1 auto;
            min-width: 0;
            line-height: 1.25;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-cat-chev {
            font-size: 10px;
            color: #9ca3af;
            transition: color 0.15s ease;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-cat-chev.is-muted {
            color: #d1d5db;
            opacity: 0.85;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-cat:hover .shwapno-cat-chev:not(.is-muted) { color: var(--accent-color, #dc2626); }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-flyout {
            position: fixed;
            left: 0;
            top: 0;
            min-width: 360px;
            max-width: min(560px, calc(100vw - 24px));
            max-height: min(420px, calc(100vh - 24px));
            overflow-y: auto;
            overflow-x: hidden;
            padding: 14px 16px;
            background: #fff;
            border: 1px solid #e5e7eb;
            border-radius: 10px;
            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
            z-index: 9998;
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transition: opacity 0.12s ease;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-flyout.is-visible {
            opacity: 1;
            visibility: visible;
            pointer-events: auto;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-flyout-title {
            font-weight: 700;
            font-size: var(--font-heading, 14px);
            color: #111827;
            margin-bottom: 10px;
            padding-bottom: 8px;
            border-bottom: 1px solid #f3f4f6;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-flyout-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 4px 14px;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-flyout-link {
            display: block;
            padding: 6px 8px;
            border-radius: 6px;
            font-size: var(--font-card-description, 13px);
            color: #374151;
            text-decoration: none;
            line-height: 1.35;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-flyout-link:hover {
            color: var(--accent-color, #dc2626);
            background: #f8fafc;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-flyout--products {
            min-width: 280px;
            max-width: min(400px, calc(100vw - 24px));
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-flyout-products {
            display: flex;
            flex-direction: column;
            gap: 2px;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-flyout-product-row {
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 8px 8px;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-flyout-product-row:hover .shwapno-flyout-product-name {
            color: var(--accent-color, #dc2626);
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-flyout-product-thumb {
            flex-shrink: 0;
            width: 44px;
            height: 44px;
            border-radius: 8px;
            border: 1px solid #eef2f6;
            background: #fff;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-flyout-product-thumb img {
            width: 100%;
            height: 100%;
            object-fit: contain;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-flyout-product-meta {
            flex: 1 1 auto;
            min-width: 0;
            display: flex;
            flex-direction: column;
            gap: 2px;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-flyout-product-name {
            font-size: var(--font-card-description, 13px);
            font-weight: 600;
            color: #111827;
            line-height: 1.3;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-flyout-product-price {
            font-size: 12px;
            line-height: 1.25;
        }
        #desktop-category-sidebar.shwapno-sidebar-wrap .shwapno-flyout-price-sale {
            font-weight: 700;
            color: var(--price-text, #dc2626);
        }

        /* === LARGE CATEGORY CARD (size from --cat-size-pc / admin sizeDesktop) === */
        .cat-card { 
            background: transparent; 
            padding: 10px; 
            display: flex; 
            flex-direction: column; 
            align-items: center; 
            justify-content: flex-start; 
            text-align: center; 
            height: auto; 
            cursor: pointer; 
            border: none; 
            transition: 0.2s; 
        }
        .cat-card:hover { transform: translateY(-5px); }
        
        .cat-card img { 
            width: 100%; 
            height: 100%; 
            object-fit: cover; 
            border-radius: var(--cat-radius-pc, 50%); 
            border: 4px solid #ffffff; 
            background-color: var(--accent-color); 
            padding: 0;
            margin-bottom: 0;
            box-shadow: 0 4px 10px rgba(0, 104, 55, 0.3); 
            transition: 0.3s;
        }
        
        .cat-card:hover img {
            box-shadow: 0 6px 15px rgba(0, 104, 55, 0.5);
            border-color: var(--accent-color);
        }

        .cat-card span { font-size: 16px; font-weight: 700; color: var(--text-primary); line-height: 1.2; text-transform: capitalize; }

        /* PC: sizeDesktop (--cat-size-pc) caps card/slide size so grid cols never stretch icons */
        @media (min-width: 768px) {
            #pc-category-section .cat-card > div:first-child {
                width: var(--cat-size-pc, 170px);
                max-width: 100%;
                aspect-ratio: 1;
                margin: 0 auto;
            }
            #pc-category-section .cat-card img {
                width: 100% !important;
                height: 100% !important;
            }
            #pc-category-section .category-swiper .swiper-slide {
                width: var(--cat-size-pc, 170px) !important;
                flex-shrink: 0;
            }
            #pc-category-section .category-grid-inner {
                justify-items: center;
            }
            #pc-category-section .category-grid-card > div[style*="aspect-ratio"] {
                width: var(--cat-size-pc, 170px);
                max-width: 100%;
            }
            #pc-category-section .category-card-shwapno {
                width: var(--cat-size-pc, 170px);
                max-width: 100%;
            }
            .all-categories-grid .category-grid-card > div[style*="aspect-ratio"] {
                width: var(--cat-size-pc, 170px);
                max-width: 100%;
            }
            .all-categories-grid .category-card-shwapno {
                width: var(--cat-size-pc, 170px);
                max-width: 100%;
            }
            .all-categories-grid {
                justify-items: center;
            }
        }
        
        .mobile-cat-card { display: flex; flex-direction: column; align-items: center; justify-content: start; height: auto; }
        .mobile-banner-swiper .swiper-slide img { object-fit: cover !important; object-position: center; max-width: 100%; max-height: 100%; }
        .mobile-banner-swiper .swiper-pagination { bottom: 5px !important; }

        /* Main banner: force slide/wrapper to container height so full image is visible (override global .swiper-slide height: auto) */
        #pc-slider-area .main-swiper,
        #pc-slider-area .main-swiper .swiper-wrapper,
        #pc-slider-area .main-swiper .swiper-slide,
        #mobile-slider-area .mobile-banner-swiper,
        #mobile-slider-area .mobile-banner-swiper .swiper-wrapper,
        #mobile-slider-area .mobile-banner-swiper .swiper-slide { height: 100% !important; }
        #pc-slider-area .main-swiper .swiper-slide,
        #mobile-slider-area .mobile-banner-swiper .swiper-slide { min-height: 0; }

        /* Mobile main slider: full viewport width (dashboard: bannerConfig.mobileMainSliderLayout fullBleed) */
        @media (max-width: 767px) {
            #mobile-slider-area.mobile-slider-area--full-bleed {
                width: 100vw;
                max-width: 100vw;
                margin-left: calc(50% - 50vw);
                margin-right: calc(50% - 50vw);
                border-radius: 0;
                box-shadow: none;
            }
        }

        /* PC main slider: full bleed (dashboard: bannerConfig.desktopMainSliderLayout fullBleed) */
        @media (min-width: 768px) {
            #pc-slider-area.pc-slider-area--full-bleed {
                width: 100vw !important;
                max-width: 100vw;
                margin-left: calc(50% - 50vw) !important;
                margin-right: calc(50% - 50vw) !important;
            }
            #pc-slider-area.pc-slider-area--full-bleed .main-swiper-wrapper {
                border-radius: 0;
            }
            /* centerTrade: full-image slides only (not split layout) — favor upper subject, less “cut off” feel */
            #pc-slider-area.pc-slider-area--center-trade #pc-banner-wrapper .swiper-slide:not(.banner-slide-split) img {
                object-position: center 28%;
            }
        }

        .section-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; padding: 10px 5px; background: transparent; }
        .section-title { font-size: var(--font-heading, 20px); font-weight: 700; color: var(--section-title); }
        body.section-header-style--centered .section-header { justify-content: center; text-align: center; flex-wrap: wrap; gap: 10px; }
        body.section-header-style--centered .section-header .view-more-btn { margin-left: 0; }
        body.section-header-style--underline .section-title { padding-bottom: 8px; border-bottom: 3px solid var(--accent-color); display: inline-block; }
        
        .flash-section { padding: 10px 0 20px 0; margin-bottom: 20px; width: 100%; }
        .flash-timer { display: flex; align-items: center; gap: 5px; }
        .timer-box { background: var(--accent-color); color: white; width: 30px; height: 30px; border-radius: 4px; font-size: 14px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
        
        .flash-swiper { padding: 5px 2px !important; overflow: hidden; }
        .swiper-slide { height: auto !important; display: flex; }

        .view-more-btn { background: var(--btn-secondary-bg); color: var(--btn-secondary-text); font-size: 12px; padding: 6px 15px; border-radius: 4px; font-weight: 600; transition: 0.2s; cursor: pointer; border: none; display: flex; align-items: center; gap: 5px; }
        .view-more-btn:hover { opacity: 0.9; transform: translateY(-1px); }

        #classic-home-main-content {
            padding-left: calc(1rem + var(--classic-product-side-padding, 0px));
            padding-right: calc(1rem + var(--classic-product-side-padding, 0px));
        }
        .products-grid { display: grid; grid-template-columns: repeat(var(--product-grid-cols-mobile, 3), 1fr); gap: var(--classic-product-gap-mobile, 10px); width: 100%; }
        @media (min-width: 768px) {
            .products-grid { grid-template-columns: repeat(var(--product-grid-cols-desktop, 5), 1fr); gap: var(--classic-product-gap-desktop, 15px); width: 100%; }
        }
        .all-categories-grid { width: 100%; }
        @media (min-width: 768px) { .all-categories-grid { grid-template-columns: repeat(var(--per-row-desk), 1fr) !important; } }
        /* Chaldal-style category cards: full image only, rectangular, height from dashboard Size (PC/Mobile) */
        .category-card-chaldal { min-height: 56px; }
        .category-grid-inner.category-grid--chaldal { align-items: stretch; }
        .all-categories-grid.category-grid--chaldal .category-card-chaldal { height: var(--chaldal-h-mob, 96px); }
        @media (min-width: 768px) { .all-categories-grid.category-grid--chaldal .category-card-chaldal { height: var(--chaldal-h-pc, 170px); } }

        /* Shwapno-style category cards: square (height = width), image top, rounded label bar (yellow/theme), subtle card radius */
        .category-card-shwapno { aspect-ratio: 1; width: 100%; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.06); border: 1px solid var(--card-border); border-radius: var(--cat-radius-pc, 8px); display: flex; flex-direction: column; }
        .category-card-shwapno:hover { box-shadow: 0 6px 16px rgba(0,0,0,0.1); }
        .category-card-shwapno .category-card-shwapno-img { flex: 1; min-height: 0; position: relative; }
        .category-card-shwapno .category-card-shwapno-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
        .category-card-shwapno-label { flex-shrink: 0; padding: 10px 12px; text-align: center; font-weight: 700; font-size: 14px; color: var(--category-shwapno-label-text, #000000); background-color: var(--category-shwapno-label-bg, #facc15); border-radius: 0 0 min(12px, var(--cat-radius-pc, 12px)) min(12px, var(--cat-radius-pc, 12px)); }
        .category-swiper .swiper-slide { height: auto; }
        .mobile-cat-swiper .swiper-slide { height: auto; }

        /* Horizontal row before Swiper bundle CSS loads (avoids vertical FOUC) */
        .category-swiper .swiper-wrapper,
        .mobile-cat-swiper .swiper-wrapper {
            display: flex;
            flex-wrap: nowrap;
            box-sizing: content-box;
        }
        .category-swiper:not(.swiper-initialized),
        .mobile-cat-swiper:not(.swiper-initialized) {
            overflow: hidden;
        }
        .category-swiper:not(.swiper-initialized) .swiper-slide,
        .mobile-cat-swiper:not(.swiper-initialized) .swiper-slide {
            flex-shrink: 0;
            width: var(--cat-size-pc, 170px);
            max-width: 100%;
        }
        @media (max-width: 767px) {
            .mobile-cat-swiper:not(.swiper-initialized) .swiper-slide {
                width: calc((100% - 20px) / 3);
                max-width: none;
            }
        }

        .classic-card { 
            background: var(--card-bg); 
            border: 1px solid var(--card-border); 
            border-radius: 8px; 
            display: flex; 
            flex-direction: column; 
            position: relative; 
            transition: all 0.2s ease; 
            width: 100%; 
            height: 100%;
            overflow: hidden; 
        }
        .classic-card:hover { box-shadow: 0 10px 25px rgba(0,0,0,0.08); border-color: #d1d5db; transform: translateY(-2px); }

        /* Classic card size: presets (small / medium / large) */
        .classic-card--small .classic-img-wrapper { max-height: 140px; padding: 6px; }
        .classic-card--small .card-content { padding: 8px; }
        .classic-card--small .card-content h3 { font-size: 11px; min-height: 28px; }
        .classic-card--small .price-row span { font-size: 12px; }
        .classic-card--large .classic-img-wrapper { padding: 14px; min-height: 200px; }
        .classic-card--large .card-content { padding: 14px; }
        .classic-card--large .card-content h3 { font-size: 13px; min-height: 36px; }
        .classic-card--large .price-row span { font-size: 15px; }
        /* Classic card custom pixel size (admin sets width × height px) */
        .classic-card--custom .classic-img-wrapper { aspect-ratio: auto; }

        .classic-img-wrapper { 
            width: 100%; 
            aspect-ratio: 1/1; 
            overflow: hidden; 
            border-bottom: 1px solid #f3f4f6; 
            padding: 10px; 
            display: flex; 
            align-items: center; 
            justify-content: center; 
            background: white; 
            position: relative; 
        }
        
        .classic-img { max-width: 100%; max-height: 100%; object-fit: contain; transition: opacity 0.4s ease-in-out, transform 0.5s ease; }
        
        .img-secondary {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: contain;
            padding: 10px;
            opacity: 0; 
            z-index: 2;
            transition: opacity 0.4s ease-in-out;
        }
        .classic-card:hover .img-secondary { opacity: 1; }
        
        .discount-badge { 
            position: absolute; 
            top: 10px; 
            left: 10px; 
            right: auto;
            background-color: #ef4444; 
            color: white; 
            padding: 2px 6px;
            border-radius: 4px; 
            display: flex; 
            flex-direction: column; 
            align-items: center; 
            justify-content: center; 
            font-size: 11px; 
            font-weight: bold; 
            line-height: 1.2; 
            z-index: 10; 
            box-shadow: 0 2px 5px rgba(0,0,0,0.1); 
            min-width: 32px;
        }
        
        .card-content { padding: 12px; flex-grow: 1; display: flex; flex-direction: column; text-align: left; }
        .classic-title { font-size: 14px; font-weight: 600; color: var(--text-primary); margin-bottom: 4px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; height: 38px; line-height: 1.35; }
        .star-rating { color: var(--star-rating-color, #fbbf24); font-size: 10px; margin-bottom: 4px; display: flex; gap: 1px; }
        .price-row { display: flex; align-items: baseline; gap: 6px; margin-top: auto; margin-bottom: 0px; flex-wrap: wrap; }
        .classic-old-price { color: var(--text-secondary); text-decoration: line-through; font-size: 12px; }
        .classic-price { color: var(--price-text); font-weight: 800; font-size: 16px; }
        
        .card-order-btn { 
            background: var(--btn-primary-bg); 
            color: var(--btn-primary-text); 
            border: none; 
            font-weight: 700; 
            font-size: 12px; 
            text-transform: uppercase; 
            cursor: pointer; 
            transition: all 0.2s ease; 
            display: inline-flex; 
            align-items: center; 
            justify-content: center; 
            gap: 5px; 
        }
        .card-order-btn:hover { opacity: 0.9; transform: translateY(-1px); }

        /* Chaldal + circle: keep white fill + primary icon (must override .card-order-btn solid fill) */
        .chaldal-card-plus.card-order-btn,
        .chaldal-card-plus {
            background: var(--product-card-add-icon-bg, var(--card-bg, #fff)) !important;
            color: var(--product-card-add-icon, var(--btn-primary-bg)) !important;
            border-color: var(--product-card-add-icon, var(--btn-primary-bg)) !important;
            border-style: solid;
        }
        .chaldal-card-plus.card-order-btn i,
        .chaldal-card-plus i { color: inherit; }
        .btn-wishlist-action:hover, .btn-quickview-action:hover, .btn-compare-action:hover { background-color: var(--btn-primary-bg) !important; color: white !important; }
        .chaldal-card-plus:hover,
        .chaldal-card-plus.card-order-btn:hover {
            background-color: var(--product-card-add-icon, var(--btn-primary-bg)) !important;
            border-color: var(--product-card-add-icon, var(--btn-primary-bg)) !important;
            color: var(--btn-primary-text, #fff) !important;
        }
        .product-card--chaldal.chaldal-card-border { border: 1px dotted var(--product-card-border, var(--card-border, #d1d5db)); }
        .product-card--chaldal.chaldal-card-border:hover { border-color: color-mix(in srgb, var(--product-card-border, var(--card-border, #9ca3af)) 85%, #000); }
        .product-card--chaldal .chaldal-card-price { color: var(--sale-price-color, var(--price-text)); }
        .product-card--chaldal .chaldal-card-title { color: var(--product-card-title, var(--text-primary)); }

        .app-style-card { transition: box-shadow 0.2s ease, border-color 0.2s ease; }
        .app-style-card:hover { box-shadow: 0 6px 16px rgba(0,0,0,0.08); border-color: #d1d5db; }
        .product-card--minimal { transition: box-shadow 0.2s, transform 0.2s; }
        .product-card--minimal:hover { box-shadow: 0 6px 16px rgba(0,0,0,0.08); transform: translateY(-2px); }
        .product-card--image-focus { transition: box-shadow 0.2s, border-color 0.2s; }
        .product-card--image-focus:hover { box-shadow: 0 6px 16px rgba(0,0,0,0.08); }

        .product-card--chaldal { transition: box-shadow 0.2s, transform 0.2s; }
        .product-card--chaldal:hover { box-shadow: 0 6px 16px rgba(0,0,0,0.08); }
        .product-card--chaldal .chaldal-card-img-wrap { position: relative; overflow: visible; }
        .product-card--daraz { transition: box-shadow 0.2s; }
        .product-card--daraz:hover { box-shadow: 0 8px 20px rgba(0,0,0,0.1); }
        .product-card--arazshop { transition: box-shadow 0.2s; }
        .product-card--arazshop:hover { box-shadow: 0 8px 20px rgba(0,0,0,0.1); }
        .product-card--arazshop .arazshop-card-img { position: relative; }
        .product-card--arazshop .arazshop-discount-badge {
            position: absolute;
            top: 6px;
            right: 6px;
            z-index: 2;
            width: 52px;
            height: 52px;
            border-radius: 9999px;
            border: 2px dashed var(--badge-discount-bg, var(--accent-color, #ef4444));
            background: var(--card-bg, #fff);
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
            line-height: 1.15;
            font-size: 9px;
            font-weight: 700;
            color: var(--text-primary, #111);
            pointer-events: none;
        }
        .product-card--arazshop .arazshop-star-row .arazshop-star { font-size: 10px; color: var(--card-border, #d1d5db); }
        .product-card--arazshop .arazshop-star-row .arazshop-star--filled { color: var(--star-rating-color, #fbbf24); }
        .product-card--arazshop .arazshop-sale-price { color: var(--sale-price-color, var(--price-text, #ea580c)); }
        .product-card--arazshop .arazshop-old-price { font-size: 11px; }
        .product-card--arazshop .arazshop-order-btn { min-height: 36px; }
        .product-card--arazshop .arazshop-cart-btn { min-height: 36px; }
        .product-card--shwapno { transition: box-shadow 0.2s, transform 0.2s; }
        .product-card--shwapno:hover { box-shadow: 0 6px 16px rgba(0,0,0,0.08); }
        .product-card--shwapno .card-order-btn:hover { opacity: 0.9; }
        .product-card--shwapno .shwapno-card-img-wrap { position: relative; }
        .product-card--shwapno .shwapno-discount-ribbon {
            position: absolute;
            top: 0;
            left: 0;
            z-index: 4;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: flex-start;
            min-width: 38px;
            max-width: 52px;
            padding: 5px 4px 11px;
            background: var(--badge-discount-bg, var(--accent-color, #ef4444));
            color: #fff;
            font-weight: 800;
            line-height: 1.15;
            text-align: center;
            box-shadow: 0 2px 6px rgba(0,0,0,0.18);
            pointer-events: none;
            clip-path: polygon(
                0 0,
                100% 0,
                100% calc(100% - 5px),
                90% 100%,
                80% calc(100% - 5px),
                70% 100%,
                60% calc(100% - 5px),
                50% 100%,
                40% calc(100% - 5px),
                30% 100%,
                20% calc(100% - 5px),
                10% 100%,
                0 calc(100% - 5px)
            );
        }
        .product-card--shwapno .shwapno-discount-ribbon__amount {
            font-size: 10px;
            letter-spacing: -0.02em;
            word-break: break-word;
        }
        .product-card--shwapno .shwapno-discount-ribbon__off {
            font-size: 9px;
            font-weight: 800;
            margin-top: 2px;
            letter-spacing: 0.04em;
        }
        .product-card--shwapno .shwapno-price-row { width: 100%; }
        @media (max-width: 767px) {
            .product-card--shwapno .shwapno-add-btn { padding-top: 6px; padding-bottom: 6px; font-size: 12px; }
            .product-card--shwapno .shwapno-card-minus,
            .product-card--shwapno .shwapno-card-plus { width: 28px; height: 28px; font-size: 14px; }
            .product-card--shwapno .shwapno-discount-ribbon { min-width: 34px; padding: 4px 3px 10px; }
            .product-card--shwapno .shwapno-discount-ribbon__amount { font-size: 9px; }
            .product-card--shwapno .shwapno-discount-ribbon__off { font-size: 8px; }
        }

        .small-banners--big-small { grid-template-columns: 1fr 1fr !important; grid-template-rows: 1fr 1fr; }
        .small-banners--big-small > *:first-child { grid-row: span 2; min-height: 0; }
        .small-banners--big-small > *:first-child img { width: 100%; height: 100%; object-fit: cover; }
        .small-banners--count-1 { grid-template-columns: 1fr !important; }
        .small-banners--count-2 { grid-template-columns: repeat(2, 1fr) !important; }
        #pc-small-banners > * { height: var(--small-banner-height-desktop, 150px); min-height: var(--small-banner-height-desktop, 150px); }
        #mobile-small-banners > * { height: var(--small-banner-height-mobile, 80px); min-height: var(--small-banner-height-mobile, 80px); }
        #pc-small-banners > * a.small-banner-link, #mobile-small-banners > * a.small-banner-link { display: block; width: 100%; height: 100%; }
        #pc-small-banners > * img, #mobile-small-banners > * img { width: 100%; height: 100%; object-fit: cover; }

        .promo-banner--default { border-radius: 8px; overflow: hidden; height: var(--promo-banner-height-desktop, 150px); }
        .promo-banner--full-bleed { border-radius: 0; overflow: hidden; height: var(--promo-banner-height-desktop, 150px); }
        .promo-banner--full-bleed img { border-radius: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
        .promo-banner--card { border: 1px solid var(--card-border); box-shadow: 0 4px 12px rgba(0,0,0,0.08); border-radius: 12px; overflow: hidden; padding: 4px; background: var(--card-bg); height: var(--promo-banner-height-desktop, 150px); }
        .promo-banner--card img { border-radius: 8px; width: 100%; height: 100%; object-fit: cover; }
        @media (max-width: 767px) {
            .promo-banner--default, .promo-banner--full-bleed, .promo-banner--card { height: var(--promo-banner-height-mobile, 120px); }
        }
        .promo-banner--default img { width: 100%; height: 100%; object-fit: cover; display: block; }

        /* Home text announcement strip (dashboard-controlled; classic home only) */
        .home-announcement-strip {
            background: #e0f7fa;
            color: #0d47a1;
            border-radius: 8px;
            padding: 12px 14px;
            border: 1px solid rgba(13, 71, 161, 0.12);
        }
        .home-announcement-strip__title { font-weight: 700; font-size: 0.9375rem; line-height: 1.35; margin: 0; }
        .home-announcement-strip__body { font-size: 0.8125rem; line-height: 1.45; margin: 0.35rem 0 0; color: #1565c0; }
        .home-announcement-strip__cta {
            display: inline-block;
            margin-top: 0.5rem;
            font-weight: 700;
            font-size: 0.8125rem;
            color: #0d47a1;
            text-decoration: underline;
            text-underline-offset: 3px;
        }
        .home-announcement-strip__cta:hover { color: #01579b; }
        .home-announcement-strip__cta.is-disabled { pointer-events: none; cursor: default; text-decoration: none; color: #1565c0; }
        .homepage-features-section-slot { padding: 2px 0 4px; }
        .homepage-features-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--optional-feature-grid-gap, 12px); }
        .our-brands-section .our-brands-title { font-weight: 800; letter-spacing: 0.02em; }
        .our-brands-swiper {
            width: 100%;
            overflow: hidden;
        }
        .our-brands-swiper .swiper-wrapper.our-brands-grid {
            display: flex;
            align-items: stretch;
        }
        .our-brands-swiper .swiper-slide {
            height: auto;
            box-sizing: border-box;
        }
        .our-brands-swiper .our-brand-card {
            width: 100%;
            height: 100%;
        }
        .our-brand-card {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 8px;
            padding: 12px 8px;
            border: 1px solid var(--card-border);
            border-radius: 12px;
            background: var(--card-bg);
            text-decoration: none;
            color: var(--text-primary);
            transition: border-color 0.15s ease, box-shadow 0.15s ease;
            min-height: 96px;
        }
        .our-brand-card:hover {
            border-color: color-mix(in srgb, var(--accent-color) 45%, var(--card-border));
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
        }
        .our-brand-card__media {
            width: 64px;
            height: 48px;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .our-brand-card__logo {
            max-width: 100%;
            max-height: 100%;
            object-fit: contain;
        }
        .our-brand-card__fallback {
            width: 40px;
            height: 40px;
            border-radius: 9999px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: color-mix(in srgb, var(--accent-color) 12%, transparent);
            color: var(--accent-color);
            font-weight: 800;
            font-size: 16px;
        }
        .our-brand-card__name {
            font-size: 12px;
            font-weight: 600;
            text-align: center;
            line-height: 1.25;
            max-width: 100%;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        @media (min-width: 768px) {
            .our-brand-card { min-height: 110px; }
        }
        .homepage-feature-card { border: 1px solid var(--optional-feature-card-border, var(--card-border)); border-radius: 10px; background: var(--optional-feature-card-bg, var(--card-bg)); padding: 12px 10px; display: flex; align-items: center; gap: 10px; min-height: 74px; box-shadow: var(--optional-feature-card-shadow, 0 1px 2px rgba(0,0,0,0.05)); }
        .homepage-feature-icon { width: 34px; height: 34px; border-radius: 9999px; background: var(--optional-feature-icon-bg, rgba(255, 161, 22, 0.12)); border: 1px solid var(--optional-feature-icon-border, rgba(255, 161, 22, 0.28)); color: var(--optional-feature-icon-color, var(--accent-color)); font-size: 15px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
        .homepage-feature-title { margin: 0; font-size: 13px; line-height: 1.25; font-weight: 700; color: var(--optional-feature-title-color, var(--text-primary)); }
        .homepage-feature-subtitle { margin: 2px 0 0; font-size: 11px; line-height: 1.35; color: var(--optional-feature-subtitle-color, var(--text-secondary)); }
        .recommended-for-you-wrap .recommended-for-you-title {
            text-transform: uppercase;
            letter-spacing: 0.04em;
            font-weight: 800;
            width: 100%;
            text-align: center;
        }
        body.section-header-style--default .recommended-for-you-wrap .section-header,
        body.section-header-style--underline .recommended-for-you-wrap .section-header {
            justify-content: center;
        }
        .recommended-for-you-wrap .recommended-for-you-swiper .swiper-slide { height: auto; }

        /* Product carousels: horizontal row before Swiper bundle CSS/init (CBS, recommended, flash, category rows) */
        .recommended-for-you-swiper .swiper-wrapper,
        .category-banner-cbs-swiper .swiper-wrapper,
        .flash-swiper .swiper-wrapper,
        .category-row-swiper .swiper-wrapper {
            display: flex;
            flex-wrap: nowrap;
            box-sizing: content-box;
        }
        .recommended-for-you-swiper:not(.swiper-initialized),
        .category-banner-cbs-swiper:not(.swiper-initialized),
        .flash-swiper:not(.swiper-initialized),
        .category-row-swiper:not(.swiper-initialized) {
            overflow: hidden;
        }
        .recommended-for-you-swiper:not(.swiper-initialized) .swiper-slide,
        .category-banner-cbs-swiper:not(.swiper-initialized) .swiper-slide,
        .flash-swiper:not(.swiper-initialized) .swiper-slide,
        .category-row-swiper:not(.swiper-initialized) .swiper-slide {
            flex-shrink: 0;
            width: calc((100% - (var(--product-grid-cols-mobile, 3) - 1) * 10px) / var(--product-grid-cols-mobile, 3));
        }
        @media (min-width: 768px) {
            .recommended-for-you-swiper:not(.swiper-initialized) .swiper-slide,
            .category-banner-cbs-swiper:not(.swiper-initialized) .swiper-slide,
            .flash-swiper:not(.swiper-initialized) .swiper-slide,
            .category-row-swiper:not(.swiper-initialized) .swiper-slide {
                width: calc((100% - (var(--product-grid-cols-desktop, 5) - 1) * 10px) / var(--product-grid-cols-desktop, 5));
            }
        }

        @media (max-width: 767px) {
            #mobile-hero-section .mobile-hero-slanted-nav.slanted-tab-nav--visible {
                width: 100vw;
                max-width: 100vw;
                margin-left: calc(50% - 50vw);
                margin-right: calc(50% - 50vw);
            }
            .home-announcement-strip--mobile:not(.hidden) {
                width: 100vw;
                max-width: 100vw;
                margin-left: calc(50% - 50vw);
                margin-right: calc(50% - 50vw);
                border-radius: 0;
                border-left: none;
                border-right: none;
                padding-left: max(1rem, env(safe-area-inset-left, 0px));
                padding-right: max(1rem, env(safe-area-inset-right, 0px));
                box-sizing: border-box;
            }
            .homepage-feature-card {
                min-height: 70px;
            }
            .home-new-arrival-band:not(.hidden) {
                width: 100vw;
                max-width: 100vw;
                margin-left: calc(50% - 50vw);
                margin-right: calc(50% - 50vw);
                box-sizing: border-box;
                background: #fff5e9;
                color: #d48806;
                text-align: center;
                padding: 1rem max(1rem, env(safe-area-inset-left, 0px)) 1rem max(1rem, env(safe-area-inset-right, 0px));
                margin-bottom: 0.75rem;
            }
            .home-nar-cat-grid:not(.hidden) {
                width: 100vw;
                max-width: 100vw;
                margin-left: calc(50% - 50vw);
                margin-right: calc(50% - 50vw);
                box-sizing: border-box;
                padding: 0 max(0.75rem, env(safe-area-inset-left, 0px)) 0.75rem max(0.75rem, env(safe-area-inset-right, 0px));
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 10px;
            }
            .home-fab-post-banners:not(.hidden) {
                width: 100vw;
                max-width: 100vw;
                margin-left: calc(50% - 50vw);
                margin-right: calc(50% - 50vw);
                box-sizing: border-box;
                display: flex;
                flex-direction: column;
                gap: 8px;
                margin-bottom: 0.75rem;
                padding-left: env(safe-area-inset-left, 0px);
                padding-right: env(safe-area-inset-right, 0px);
            }
        }
        @media (min-width: 768px) {
            .homepage-features-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--optional-feature-grid-gap, 14px); }
            .homepage-feature-card { min-height: 82px; padding: 14px 12px; }
            .homepage-feature-title { font-size: 14px; }
            .homepage-feature-subtitle { font-size: 12px; }
        }
        .home-nar-cat-grid__card {
            display: block;
            background: #f3f4f6;
            border-radius: 10px;
            overflow: hidden;
            text-decoration: none;
            color: inherit;
            min-height: 140px;
            position: relative;
            -webkit-tap-highlight-color: transparent;
        }
        .home-nar-cat-grid__card:active { opacity: 0.92; }
        .home-nar-cat-grid__img-wrap {
            position: relative;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 12px 10px 20px;
            min-height: 120px;
            box-sizing: border-box;
        }
        .home-nar-cat-grid__img-wrap::after {
            content: '';
            position: absolute;
            bottom: 10px;
            left: 50%;
            transform: translateX(-50%);
            width: 55%;
            height: 10px;
            border-radius: 50%;
            background: rgba(0, 0, 0, 0.08);
            filter: blur(6px);
            pointer-events: none;
            z-index: 0;
        }
        .home-nar-cat-grid__img-wrap img {
            position: relative;
            z-index: 1;
            max-width: 100%;
            max-height: 110px;
            width: auto;
            height: auto;
            object-fit: contain;
        }
        .home-nar-cat-grid__placeholder {
            position: relative;
            z-index: 1;
            width: 72px;
            height: 72px;
            border-radius: 8px;
            background: linear-gradient(135deg, #e5e7eb, #d1d5db);
        }
        .home-new-arrival-band__text {
            display: block;
            font-weight: 800;
            font-size: 0.8125rem;
            letter-spacing: 0.12em;
            text-transform: uppercase;
            font-stretch: condensed;
            line-height: 1.3;
        }

        .home-fab-post-banners__item {
            display: block;
            position: relative;
            overflow: hidden;
            aspect-ratio: 16 / 10;
            min-height: 180px;
            -webkit-tap-highlight-color: transparent;
        }
        .home-fab-post-banners__item img {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
        .home-fab-post-banners__caption {
            position: absolute;
            left: 0;
            right: 0;
            bottom: 0;
            padding: 1.35rem 0.75rem 0.875rem;
            text-align: center;
            font-weight: 800;
            font-size: 0.9375rem;
            letter-spacing: 0.05em;
            color: #fff;
            text-shadow: 0 1px 4px rgba(0, 0, 0, 0.85);
            line-height: 1.2;
            pointer-events: none;
            background: linear-gradient(to top, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.25) 50%, transparent 100%);
        }

        /* Phase 3: Featured section */
        .featured-section--default { }
        .featured-section--compact .flex.justify-between { margin-bottom: 8px; }
        .featured-section--compact .text-lg { font-size: 1rem; }
        .featured-section--compact .flash-section { padding: 6px 0 12px 0; }
        /* Featured grid uses same column settings as admin (product grid PC/Mobile) */
        .featured-section--grid .products-grid { display: grid; gap: var(--classic-product-gap-mobile, 10px); grid-template-columns: repeat(var(--product-grid-cols-mobile, 3), 1fr); }
        @media (min-width: 768px) { .featured-section--grid .products-grid { grid-template-columns: repeat(var(--product-grid-cols-desktop, 5), 1fr); } }

        /* Phase 3: Category rows */
        .category-rows--card .category-row { margin-bottom: 20px; border: 1px solid var(--card-border); border-radius: 12px; padding: 16px; box-shadow: 0 2px 8px rgba(0,0,0,0.06); background: var(--card-bg); }
        .category-rows--minimal .category-row { margin-bottom: 16px; }
        .category-rows--minimal .category-row .flex { gap: 8px; }

        .category-row { margin-bottom: 30px; width: 100%; }

        /* Grocery-style category row header (Chaldal-like reference) */
        .category-row-header--grocery {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 12px;
            margin-bottom: 12px;
            padding: 4px 2px 12px;
            background: transparent;
            border-bottom: 1px solid #E5E7EB;
        }
        .category-row-title--grocery {
            margin: 0;
            font-size: var(--font-heading, 20px);
            font-weight: 700;
            color: #1F2937;
            line-height: 1.25;
        }
        .category-row-title--grocery::after {
            content: '';
            display: block;
            width: 40px;
            height: 3px;
            background: var(--gb-brand-orange, var(--accent-color, #f97316));
            margin-top: 6px;
            border-radius: 2px;
        }
        .view-all-link {
            flex-shrink: 0;
            margin-top: 2px;
            font-size: 12px;
            font-weight: 700;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            color: var(--gb-brand-orange, var(--accent-color, #f97316));
            text-decoration: none;
            white-space: nowrap;
        }
        .view-all-link:hover {
            text-decoration: underline;
            opacity: 0.9;
        }
        .category-row__mobile-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 10px;
        }
        @media (min-width: 768px) {
            .category-row--grid2-mobile .category-row__mobile-grid {
                display: none;
            }
        }
        .category-row-swiper {
            padding-bottom: 28px !important;
        }
        .category-row .swiper-pagination,
        .home-manual-cat-rows-root .swiper-pagination {
            position: relative;
            margin-top: 10px;
            bottom: 0 !important;
        }
        .category-row .swiper-pagination-bullet,
        .home-manual-cat-rows-root .swiper-pagination-bullet {
            width: 8px;
            height: 8px;
            opacity: 1;
            background: transparent;
            border: 1.5px solid var(--accent-color, #f97316);
        }
        .category-row .swiper-pagination-bullet-active,
        .home-manual-cat-rows-root .swiper-pagination-bullet-active {
            background: var(--accent-color, #f97316);
            border-color: var(--accent-color, #f97316);
        }

        /* Grocery product card */
        .product-card--grocery {
            border-color: var(--product-card-border, var(--card-border, #e5e7eb));
            overflow: hidden;
        }
        .product-card--grocery.grocery-card-border {
            border-color: var(--product-card-border, var(--card-border, #e5e7eb));
        }
        .grocery-card-badges {
            position: absolute;
            inset: 8px 8px auto 8px;
            z-index: 2;
            display: flex;
            justify-content: space-between;
            gap: 6px;
            pointer-events: none;
        }
        .grocery-card-badge {
            display: inline-block;
            font-size: 10px;
            font-weight: 700;
            line-height: 1.2;
            padding: 3px 7px;
            border-radius: 4px;
            color: #fff;
        }
        .grocery-card-badge--offered,
        .grocery-card-badge--new {
            background: var(--gb-brand-orange, var(--accent-color, #f97316));
        }
        .grocery-card-badge--save {
            background: var(--badge-discount-bg, #16a34a);
            margin-left: auto;
        }
        .grocery-card-title {
            color: var(--product-card-title, var(--text-primary, #111827));
        }
        .grocery-card-sale-price {
            color: var(--sale-price-color, var(--accent-color, #ea580c));
        }
        .grocery-card-old-price {
            font-size: 12px;
            color: var(--text-secondary, #9ca3af);
        }
        .product-card--grocery .grocery-card-cart-btn.card-order-btn {
            width: 100%;
            margin-top: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            padding: 10px 12px;
            min-height: 44px;
            border-radius: 6px;
            border: 1.5px solid var(--btn-primary-bg, var(--accent-color, #f97316));
            background: transparent !important;
            color: var(--btn-primary-bg, var(--accent-color, #f97316)) !important;
            font-size: 13px;
            font-weight: 700;
            box-shadow: none;
            transform: none;
        }
        .product-card--grocery .grocery-card-cart-btn.card-order-btn:hover {
            background: color-mix(in srgb, var(--btn-primary-bg, var(--accent-color, #f97316)) 10%, transparent) !important;
            opacity: 1;
            transform: none;
        }

        /* Ghorer Bazar card style (global productDisplayStyle = ghorerbazarCard) */
        .product-card--gb-card {
            overflow: hidden;
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
            border-radius: 8px;
            border-color: var(--product-card-border, var(--card-border, #e5e7eb));
        }
        .product-card--gb-card.gb-card-border {
            border-color: var(--product-card-border, var(--card-border, #e5e7eb));
        }
        .gb-card-img-wrap {
            background: #ffffff;
        }
        .gb-card-title {
            color: #333333;
            font-weight: 500;
            font-size: var(--font-product-title, 14px);
        }
        .gb-card-sale-price {
            color: var(--sale-price-color, var(--btn-primary-bg, #E8751A));
            font-size: var(--font-product-price, 16px);
            font-weight: 700;
        }
        .gb-card-old-price {
            font-size: 12px;
            color: var(--text-secondary, #9ca3af);
        }
        .gb-card-save-pill {
            display: inline-block;
            font-size: 11px;
            font-weight: 700;
            line-height: 1.2;
            padding: 2px 8px;
            border-radius: 999px;
            background: #dcfce7;
            color: #166534;
            white-space: nowrap;
        }

        /* Home category rows — manual multi-tab mode (#category-rows-container) */
        .home-manual-cat-rows-root { width: 100%; }
        .home-manual-tabs-scroll {
            display: flex;
            flex-wrap: nowrap;
            gap: 0.5rem;
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            padding-bottom: 4px;
            scrollbar-width: thin;
            scrollbar-color: var(--card-border) transparent;
        }
        .home-manual-tabs-scroll::-webkit-scrollbar { height: 5px; }
        .home-manual-tabs-scroll::-webkit-scrollbar-thumb {
            background: var(--card-border);
            border-radius: 999px;
        }
        button.home-manual-tab {
            flex: 0 0 auto;
            margin: 0;
            cursor: pointer;
            font: inherit;
            font-size: 0.875rem;
            font-weight: 600;
            line-height: 1.25rem;
            padding: 0.375rem 0.85rem;
            border-radius: 9999px;
            border: 1px solid var(--card-border);
            background: var(--card-bg);
            color: var(--text-primary);
            transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
        }
        button.home-manual-tab:hover {
            border-color: color-mix(in srgb, var(--accent-color) 55%, var(--card-border));
        }
        button.home-manual-tab.is-active {
            background: color-mix(in srgb, var(--accent-color) 16%, var(--card-bg));
            border-color: var(--accent-color);
            color: var(--text-primary);
        }
        button.home-manual-tab:focus { outline: none; }
        button.home-manual-tab:focus-visible {
            box-shadow: 0 0 0 2px var(--card-bg), 0 0 0 4px var(--accent-color);
        }

        /* HOME SECTION GAPS + COMPOSER */
        [data-home-section-off="1"] { display: none !important; }
        #pc-slider-area { margin-bottom: var(--section-gap-banner-cat-desktop); }
        #pc-category-section { margin-top: var(--section-gap-banner-cat-desktop); }
        #mobile-slider-area { margin-bottom: var(--section-gap-banner-cat-mobile); }
        #mobile-category-section { margin-top: var(--section-gap-banner-cat-mobile); }
        #classic-home-main-content { margin-top: var(--section-gap-cat-products-desktop); }
        #pc-small-banners, #mobile-small-banners { gap: var(--section-gap-small-banner-row); }
        .homepage-features-section-slot,
        .our-brands-section,
        .recommended-for-you-wrap,
        .category-banner-section,
        .gb-top-selling,
        #flash-sale-section { margin-top: var(--section-gap-block-desktop); }
        @media (max-width: 767px) {
            #classic-home-main-content { margin-top: var(--section-gap-cat-products-mobile); }
            .homepage-features-section-slot,
            .our-brands-section,
            .recommended-for-you-wrap,
            .category-banner-section,
            .gb-top-selling,
            #flash-sale-section { margin-top: var(--section-gap-block-mobile); }
            .site-footer { margin-top: var(--section-gap-footer-mobile, 24px); }
        }

        /* FOOTER STYLES */
        .site-footer { 
            background-color: var(--footer-bg); 
            color: var(--footer-text); 
            padding-top: 40px; 
            margin-top: var(--section-gap-footer-desktop, 40px);
            border-top: 4px solid var(--footer-accent); 
            width: 100%; 
        }
        
        .footer-body-text {
            color: color-mix(in srgb, var(--footer-text) 78%, transparent);
        }
        .footer-heading-text {
            color: var(--footer-text);
        }
        .footer-legal-text {
            color: color-mix(in srgb, var(--footer-text) 55%, transparent);
        }
        .footer-copy-divider {
            border-top: 1px solid var(--footer-accent);
        }
        .site-footer .footer-contact-hover:hover {
            color: var(--footer-text);
        }
        .footer-link {
            transition: 0.3s;
            color: color-mix(in srgb, var(--footer-text) 72%, transparent);
            font-size: 14px;
            display: block;
            margin-bottom: 8px;
        }
        .footer-link:hover {
            color: var(--footer-text);
            padding-left: 5px;
        }
        
        .social-btn {
            width: 36px;
            height: 36px;
            border-radius: 50%;
            background: #374151;
            display: flex;
            align-items: center;
            justify-content: center;
            color: var(--footer-text);
            transition: 0.3s;
        }
        .social-btn:hover { background: var(--footer-accent); transform: translateY(-3px); }
        .footer--centered .container { text-align: center; }
        /* Centered desktop: single column stack; mobile uses same 2-col grid as columns mode */
        @media (min-width: 768px) {
            .footer--centered .footer-columns-grid {
                grid-template-columns: 1fr;
                max-width: 480px;
                margin-left: auto;
                margin-right: auto;
            }
        }
        .footer--centered .flex.gap-3 { justify-content: center; }
        .footer--centered .border-t { margin-top: 1rem; }
        @media (max-width: 767px) {
            .site-footer {
                padding-top: 24px;
                margin-top: 24px;
            }
            .site-footer .footer-link {
                margin-bottom: 4px;
            }
        }
        @media (min-width: 768px) {
            .site-footer {
                padding-top: 40px;
                margin-top: 40px;
            }
            .site-footer .footer-link {
                margin-bottom: 8px;
            }
        }

        /* === Category + Banner (Classic home, after Recommended) === */
        .category-banner-section:not(.hidden) {
            border: 1px solid var(--card-border);
            border-radius: 1rem;
            background: color-mix(in srgb, var(--card-bg) 96%, var(--body-bg));
            padding: 0.875rem 1rem 1rem;
            box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
        }
        @media (min-width: 768px) {
            .category-banner-section:not(.hidden) {
                padding: 1rem 1.25rem 1.125rem;
            }
        }
        .category-banner-section .section-title {
            color: var(--section-title, var(--text-primary));
        }
        #category-banner-aside-desktop a,
        #category-banner-aside-mobile a {
            box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06);
        }
        .category-banner-tabs-scroll {
            display: flex;
            flex-wrap: nowrap;
            gap: 0.5rem;
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            padding-bottom: 4px;
            margin-bottom: 0.75rem;
            scrollbar-width: thin;
            scrollbar-color: var(--card-border) transparent;
        }
        .category-banner-tabs-scroll::-webkit-scrollbar {
            height: 5px;
        }
        .category-banner-tabs-scroll::-webkit-scrollbar-thumb {
            background: var(--card-border);
            border-radius: 999px;
        }
        button.cbs-tab {
            flex: 0 0 auto;
            margin: 0;
            cursor: pointer;
            font: inherit;
            font-size: 0.875rem;
            font-weight: 600;
            line-height: 1.25rem;
            padding: 0.375rem 0.875rem;
            border-radius: 9999px;
            border: 1px solid color-mix(in srgb, var(--cbs-tab-inactive-text, #374151) 22%, var(--cbs-tab-inactive-bg, #fff));
            background: var(--cbs-tab-inactive-bg, #fff);
            color: var(--cbs-tab-inactive-text, #374151);
            transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
        }
        button.cbs-tab:hover {
            border-color: color-mix(in srgb, var(--cbs-tab-inactive-text, #374151) 35%, var(--cbs-tab-inactive-bg, #fff));
        }
        button.cbs-tab.is-active {
            background: var(--cbs-tab-active-bg, #facc15);
            color: var(--cbs-tab-active-text, #111827);
            border-color: color-mix(in srgb, var(--cbs-tab-active-text, #111827) 28%, var(--cbs-tab-active-bg, #facc15));
            box-shadow: 0 0 0 1px color-mix(in srgb, var(--cbs-tab-active-text, #111827) 15%, transparent);
        }
        button.cbs-tab:focus {
            outline: none;
        }
        button.cbs-tab:focus-visible {
            box-shadow: 0 0 0 2px var(--card-bg, #fff), 0 0 0 4px var(--cbs-tab-active-bg, #facc15);
        }
        .category-banner-cbs-swiper {
            border-radius: 0.75rem;
            padding: 0.25rem 0 0.125rem;
        }

        /* === NEW HEADER STYLES === */
        /* layout.searchBarWidth (dashboard) → --search-max-width on :root via script-classic applySectionDesigns */
        .desktop-search-box {
            width: 100%;
            max-width: var(--search-max-width, 36rem) !important;
        }
        .top-bar-custom { background-color: var(--top-bar-bg); border-bottom: 1px solid #d1e7dd; color: var(--top-bar-text); }
        
        .header-search-input { width: 100%; border: none; border-right: none; border-radius: 6px 0 0 6px; padding: 11px 20px; outline: none; font-size: 15px; background: var(--card-bg); color: var(--text-primary); }
        .header-search-btn { background: var(--search-btn-bg, #ffd400); color: var(--search-btn-text, #111111); border: none; padding: 0 30px; font-size: 18px; cursor: pointer; border-radius: 0 6px 6px 0; transition: filter 0.3s; }
        .header-search-btn:hover { filter: brightness(0.9); }
        
        .header-icon-link { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: var(--header-text); cursor: pointer; text-decoration: none; position: relative; }
        .header-icon-link:hover { color: #374151; }
        
        .header-icon-badge {
            position: absolute; top: -8px; right: -8px; 
            background-color: var(--accent-color); color: white; 
            font-size: 10px; font-weight: bold; 
            width: 18px; height: 18px; 
            border-radius: 50%; 
            display: flex; align-items: center; justify-content: center;
        }
        .header--minimal .header-el-location,
        .header--minimal .header-el-wishlist,
        .header--minimal .header-el-compare,
        .header--minimal .header-el-menu-bar { display: none !important; }
        .header--minimal .desktop-search-box { max-width: var(--search-max-width, 100%) !important; }

        /* Shwapno / Swapno desktop — parity with swapno.com: logo | location | search | app | বাংলা | sign-in | cart */
        .header--shwapno .header-el-wishlist,
        .header--shwapno .header-el-compare { display: none !important; }
        .header--shwapno .header-shwapno-social { display: none !important; }
        .header--shwapno .header-el-pc-nav-links { display: none !important; }
        .header--shwapno #desktop-fabrilife-inline-nav { display: none !important; }

        .header--shwapno {
            --shwapno-row-py: 10px;
            --shwapno-gap: 10px;
            --shwapno-chip-h: 34px;
        }
        .header--shwapno .header-el-top-row {
            border-bottom-color: color-mix(in srgb, var(--header-text) 18%, transparent) !important;
            padding-top: var(--shwapno-row-py) !important;
            padding-bottom: var(--shwapno-row-py) !important;
        }
        .header--shwapno .header-el-top-row .container {
            flex-wrap: nowrap;
            justify-content: flex-start !important;
            align-items: center;
            gap: 0;
        }
        /* Logo → location and right icon cluster gaps are dashboard vars; auth-cluster → cart margin still --shwapno-gap on .header--shwapno */
        .header--shwapno .header-el-top-row .container #header-location-btn.header-shwapno-o-loc {
            margin-inline-start: var(--shwapno-gap-logo-loc);
        }
        .header--shwapno .header-el-top-row .container .desktop-search-box.header-shwapno-o-search {
            margin-inline-start: var(--shwapno-gap-main);
        }
        .header--shwapno .header-el-top-row .container .header-shwapno-o-app.header-shwapno-desktop-app {
            margin-inline-start: var(--shwapno-gap-app);
        }
        .header--shwapno .header-el-top-row .container .header-shwapno-left-cluster {
            margin-inline-start: var(--shwapno-gap-lang);
        }
        .header--shwapno .header-el-top-row .container .header-shwapno-o-right {
            margin-inline-start: var(--shwapno-gap);
        }
        .header--shwapno .header-shwapno-o-logo { flex-shrink: 0; }
        .header--shwapno .header-shwapno-o-logo img { width: auto; object-fit: contain; max-height: none; }
        .header--shwapno .header-shwapno-left-cluster { display: flex !important; align-items: center; gap: var(--shwapno-gap-auth); flex-shrink: 0; }
        .header--shwapno .header-shwapno-o-loc { flex-shrink: 0; }
        .header--shwapno .header-shwapno-o-search {
            flex: 1 1 320px;
            min-width: 140px;
            max-width: none;
        }
        .header--shwapno .header-shwapno-o-right {
            margin-left: auto;
            flex-shrink: 0;
            display: flex;
            align-items: center;
            gap: var(--shwapno-gap-right);
        }
        .header--shwapno .header-shwapno-o-right .header-icon-link { font-size: var(--header-icon-size-pc); }
        .header--shwapno .header-shwapno-o-right .header-icon-link i.text-xl { font-size: var(--header-icon-size-pc); }

        .header-shwapno-o-app { display: none !important; }
        .header-shwapno-left-cluster { display: none; }
        .header-shwapno-desktop-app { display: none !important; }
        .header--shwapno .header-shwapno-o-app.header-shwapno-desktop-app { display: inline-flex !important; }

        .header--shwapno .shwapno-header-outline-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 4px;
            min-height: var(--shwapno-chip-h);
            padding: 3px 10px;
            border: 1px solid color-mix(in srgb, var(--header-text) 50%, transparent);
            border-radius: 3px;
            background: transparent;
            color: var(--header-text);
            font-size: var(--shwapno-auth-font-size, 11px);
            font-weight: 600;
            text-decoration: none;
            cursor: pointer;
            white-space: nowrap;
            line-height: 1.15;
            transition: background 0.15s, border-color 0.15s, color 0.15s;
        }
        .header--shwapno .shwapno-header-outline-btn:hover {
            background: color-mix(in srgb, var(--header-text) 10%, var(--header-bg));
            color: var(--header-text);
            border-color: color-mix(in srgb, var(--header-text) 70%, transparent);
        }
        .header--shwapno .shwapno-header-signin i { font-size: var(--shwapno-auth-icon-size, 12px); }

        .shwapno-header-app-pill {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            padding: 8px 14px;
            border-radius: 9999px;
            background: linear-gradient(135deg, var(--btn-primary-bg, #ffc107) 0%, #ff9800 100%);
            color: var(--btn-primary-text, #111827);
            font-size: 12px;
            font-weight: 700;
            text-decoration: none;
            border: none;
            white-space: nowrap;
            line-height: 1.2;
            transition: filter 0.15s;
        }
        .shwapno-header-app-pill:hover { filter: brightness(1.03); color: var(--btn-primary-text, #111827); }
        .header--shwapno .header-shwapno-o-app.shwapno-header-app-pill {
            padding: 5px 12px;
            gap: 5px;
            font-size: 11px;
            font-weight: 600;
            line-height: 1.2;
            color: #ffffff !important;
            background: linear-gradient(90deg, #ff7a18 0%, color-mix(in srgb, var(--btn-primary-bg, #ffc400) 92%, #fff 8%) 100%);
            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
        }
        .header--shwapno .header-shwapno-o-app.shwapno-header-app-pill i {
            font-size: 13px;
            color: #ffffff;
        }
        .header--shwapno .header-shwapno-o-app.shwapno-header-app-pill:hover {
            filter: brightness(1.06);
            color: #ffffff !important;
        }

        .header--shwapno .header-shwapno-o-app.header-shwapno-desktop-app.header-shwapno-app-img-link {
            padding: 0 !important;
            background: transparent !important;
            border: none !important;
            box-shadow: none !important;
            min-height: 0;
            align-items: center;
        }
        .header--shwapno .header-shwapno-app-img {
            display: block;
            height: auto;
            max-height: 40px;
            width: auto;
            max-width: min(200px, 28vw);
            object-fit: contain;
        }

        .header--shwapno #header-location-btn {
            min-width: 0 !important;
            max-width: min(100%, 300px);
            padding: 4px 10px !important;
            border: 1px solid color-mix(in srgb, var(--header-text) 52%, transparent) !important;
            border-radius: 3px;
            background: transparent !important;
            gap: 6px;
        }
        .header--shwapno #header-location-btn .header-loc-deliver-label { display: none !important; }
        .header--shwapno #header-location-text {
            color: var(--header-text) !important;
            font-size: 11px;
            font-weight: 600;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            max-width: 240px;
        }
        .header--shwapno #header-location-btn .w-8.h-8 {
            width: auto !important; height: auto !important; min-width: 0;
            padding: 0; border: none !important; background: transparent !important;
            color: var(--header-text) !important;
        }
        .header--shwapno #header-location-btn .w-8.h-8 i { font-size: 14px; }

        .header--shwapno .desktop-search-box {
            display: flex;
            align-items: stretch;
        }
        .header--shwapno .header-search-input {
            border: none !important;
            border-radius: 5px 0 0 5px;
            border-right: none;
            flex: 1;
            min-width: 0;
            padding: 9px 14px !important;
            font-size: 14px !important;
            background: var(--card-bg, #ffffff) !important;
            color: var(--text-primary, #111827);
            box-shadow: none;
        }
        .header--shwapno .header-search-input::placeholder { color: var(--text-secondary, #9ca3af); }
        .header--shwapno .header-search-btn {
            background: var(--search-btn-bg, #ffd400) !important;
            color: var(--search-btn-text, #111111) !important;
            border-radius: 0 5px 5px 0;
            width: 46px;
            min-width: 46px;
            max-width: 46px;
            padding: 0 !important;
            display: inline-flex !important;
            align-items: center;
            justify-content: center;
            border: none !important;
            flex-shrink: 0;
            font-size: 16px;
        }
        .header--shwapno .header-search-btn:hover { filter: brightness(0.96); }

        /* Shwapno PC: menu bar visible; left trigger matches sidebar width + “SHOP BY CATEGORY” */
        #btn-browse-categories .browse-categories-label--shwapno { display: none; align-items: center; gap: 10px; flex: 1 1 auto; min-width: 0; }
        #btn-browse-categories .browse-categories-label--default { display: flex; align-items: center; gap: 8px; }
        .header--shwapno #btn-browse-categories {
            width: 268px;
            max-width: 100%;
            flex-shrink: 0;
            padding-left: 18px;
            padding-right: 14px;
            justify-content: space-between;
        }
        .header--shwapno #btn-browse-categories .browse-categories-label--default { display: none !important; }
        .header--shwapno #btn-browse-categories .browse-categories-label--shwapno { display: flex !important; }
        .header--shwapno #btn-browse-categories .browse-categories-label--shwapno span {
            font-weight: 700;
            font-size: var(--font-sidebar-header, 12px);
            letter-spacing: 0.06em;
            text-transform: uppercase;
            white-space: nowrap;
        }
        .header--shwapno #btn-browse-categories .browse-categories-label--shwapno .fa-bars { font-size: 14px; color: #374151; }

        /* Shwapno mobile header – only on mobile to avoid duplicate header on desktop */
        #mobile-header-shwapno { display: none; }
        @media (max-width: 767px) {
            #mobile-header-shwapno.header-style-active { display: block; }
        }
        @media (min-width: 768px) {
            #mobile-header-shwapno { display: none !important; }
        }
        #mobile-header-shwapno .shwapno-row1 { display: flex; align-items: center; gap: var(--header-gap-main); padding: 10px 12px; min-height: 48px; background: var(--header-bg); color: var(--header-text); border-bottom: 1px solid color-mix(in srgb, var(--header-text) 18%, transparent); }
        #mobile-header-shwapno .shwapno-logo-wrap { flex-shrink: 0; }
        #mobile-header-shwapno .shwapno-logo-wrap img { width: auto; max-height: none; object-fit: contain; }
        #mobile-header-shwapno .shwapno-search-wrap { flex: 1; min-width: 0; position: relative; display: flex; align-items: stretch; }
        #mobile-header-shwapno .shwapno-search-wrap input { width: 100%; padding: 10px 48px 10px 12px; border-radius: 6px 0 0 6px; border: none; border-right: none; background: var(--card-bg, #ffffff); color: var(--text-primary, #111827); font-size: 14px; outline: none; }
        #mobile-header-shwapno .shwapno-search-wrap .shwapno-search-btn { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); width: 40px; height: 34px; display: flex; align-items: center; justify-content: center; border: none; border-radius: 4px; background: var(--search-btn-bg, #ffd400); color: var(--search-btn-text, #111111); cursor: pointer; transition: filter 0.15s; }
        #mobile-header-shwapno .shwapno-search-wrap .shwapno-search-btn:hover, #mobile-header-shwapno .shwapno-search-wrap .shwapno-search-btn:active { filter: brightness(0.96); }
        #mobile-header-shwapno .shwapno-search-wrap .shwapno-search-btn i { font-size: 1rem; }
        #mobile-header-shwapno .shwapno-search-wrap input::placeholder { color: var(--text-secondary); }
        #mobile-header-shwapno .shwapno-category-bar { display: flex; align-items: center; gap: 8px; padding: 8px 12px; background: var(--card-bg); border-bottom: 1px solid var(--card-border); overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
        #mobile-header-shwapno .shwapno-category-bar::-webkit-scrollbar { display: none; }
        /* Shwapno mobile: cart icon much smaller */
        #mobile-header-shwapno .cart-toggle i.fa-cart-shopping { font-size: 1rem; }
        .shwapno-pill { flex-shrink: 0; padding: 5px 12px; border-radius: 9999px; background: var(--category-pill-bg, #ffffff); color: var(--category-pill-text, #000000); font-size: 12px; font-weight: 600; text-decoration: none; white-space: nowrap; transition: 0.2s; border: 1px solid var(--card-border); }
        .shwapno-pill:hover { filter: brightness(0.96); }

        .menu-bar-link { font-size: 14px; font-weight: 600; color: var(--menu-text); display: flex; align-items: center; gap: 6px; transition: 0.2s; }
        .menu-bar-link:hover { color: #111827; }
        .header-nav-link { text-decoration: none; }
        .header-nav-link:hover { text-decoration: underline; text-underline-offset: 4px; }

        #category-subnav-bar { border-bottom: 1px solid var(--card-border); background-color: var(--card-bg); }
        #category-subnav-inner { display: flex; align-items: center; gap: 10px; padding: 10px 0; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; white-space: nowrap; }
        #category-subnav-inner::-webkit-scrollbar { display: none; }
        #category-subnav-inner a.category-subnav-link { flex-shrink: 0; font-size: 13px; font-weight: 600; text-decoration: none; color: var(--menu-text); padding: 6px 12px; border-radius: 9999px; border: 1px solid var(--card-border); transition: color 0.2s, background 0.2s, border-color 0.2s; }
        #category-subnav-inner a.category-subnav-link:hover { color: #111827; }
        #category-subnav-inner a.category-subnav-link.is-active { color: var(--accent-color); border-color: var(--accent-color); background: color-mix(in srgb, var(--accent-color) 12%, transparent); }
        @media (max-width: 767px) {
            #category-subnav-bar:not(.hidden) { display: none !important; }
        }

        /* Category listing page (mobile-first, reference layout) */
        #category-hero-banner { display: none; margin-bottom: 12px; border-radius: 12px; overflow: hidden; border: 1px solid var(--card-border); background: var(--card-bg); }
        #category-hero-banner.is-visible { display: block; }
        #category-hero-banner img { width: 100%; max-height: var(--category-listing-banner-max-mobile, 200px); object-fit: cover; display: block; vertical-align: middle; }
        @media (min-width: 768px) {
            #category-hero-banner img { max-height: var(--category-listing-banner-max-desktop, 240px); }
        }
        #category-mobile-filter-sort {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            padding: 10px 0;
            margin-bottom: 8px;
            border-top: 1px solid var(--card-border);
            border-bottom: 1px solid var(--card-border);
        }
        @media (min-width: 768px) {
            #category-mobile-filter-sort { display: none; }
        }
        #category-view:not(.category-view--listing) .category-filter-open-wrap { display: none !important; }
        #category-view:not(.category-view--listing) #category-mobile-filter-sort { justify-content: flex-end; }
        #category-filter-open-btn {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            font-size: 14px;
            font-weight: 600;
            color: var(--text-primary);
            background: transparent;
            border: none;
            padding: 6px 0;
            cursor: pointer;
        }
        #category-mobile-sort-wrap {
            display: flex;
            align-items: center;
            gap: 6px;
            flex-shrink: 0;
            min-width: 0;
        }
        #category-mobile-sort-wrap .category-sort-label { font-size: 13px; color: var(--text-secondary); white-space: nowrap; }
        #category-sort-select-mobile {
            max-width: 150px;
            padding: 6px 8px;
            border-radius: 6px;
            border: 1px solid var(--card-border);
            font-size: 12px;
            font-weight: 600;
            background: var(--card-bg);
            color: var(--text-primary);
        }
        #category-desktop-toolbar { display: none; flex-direction: column; gap: 12px; }
        @media (min-width: 768px) {
            #category-desktop-toolbar { display: flex; flex-direction: row; justify-content: space-between; align-items: center; }
        }
        #category-products-grid.category-page-grid {
            --product-grid-cols-mobile: 2;
        }
        @media (min-width: 768px) {
            #category-products-grid.category-page-grid {
                grid-template-columns: repeat(var(--product-grid-cols-desktop, 5), 1fr);
            }
        }
        #category-filter-sheet {
            position: fixed;
            inset: 0;
            z-index: 1100;
            visibility: hidden;
            opacity: 0;
            transition: opacity 0.25s ease, visibility 0.25s;
            pointer-events: none;
        }
        #category-filter-sheet.is-open {
            visibility: visible;
            opacity: 1;
            pointer-events: auto;
        }
        #category-filter-sheet-backdrop {
            position: absolute;
            inset: 0;
            background: rgba(0,0,0,0.45);
        }
        #category-filter-sheet-panel {
            position: absolute;
            left: 0;
            right: 0;
            bottom: 0;
            max-height: 72vh;
            border-radius: 16px 16px 0 0;
            background: var(--card-bg);
            box-shadow: 0 -8px 32px rgba(0,0,0,0.12);
            display: flex;
            flex-direction: column;
            transform: translateY(100%);
            transition: transform 0.28s ease;
        }
        #category-filter-sheet.is-open #category-filter-sheet-panel {
            transform: translateY(0);
        }
        #category-filter-sheet-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 14px 16px;
            border-bottom: 1px solid var(--card-border);
            font-weight: 700;
            font-size: 16px;
            color: var(--text-primary);
        }
        #category-filter-sheet-close {
            width: 36px;
            height: 36px;
            border: none;
            border-radius: 8px;
            background: transparent;
            color: var(--text-secondary);
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        #category-filter-sheet-inner {
            padding: 16px;
            overflow-y: auto;
            -webkit-overflow-scrolling: touch;
        }
        #category-filter-sheet-inner .category-filter-sheet-link {
            display: block;
            padding: 12px 14px;
            margin-bottom: 8px;
            border-radius: 10px;
            border: 1px solid var(--card-border);
            text-decoration: none;
            font-weight: 600;
            font-size: 14px;
            color: var(--text-primary);
            transition: background 0.15s, border-color 0.15s;
        }
        #category-filter-sheet-inner .category-filter-sheet-link:hover {
            background: color-mix(in srgb, var(--accent-color) 8%, transparent);
        }
        #category-filter-sheet-inner .category-filter-sheet-link.is-active {
            border-color: var(--accent-color);
            color: var(--accent-color);
            background: color-mix(in srgb, var(--accent-color) 10%, transparent);
        }
        #category-filter-sheet-inner .category-filter-sheet-muted {
            font-size: 13px;
            color: var(--text-secondary);
            margin-bottom: 12px;
        }

        /* Category listing facet filters (PC sidebar + mobile sheet) */
        #category-sidebar .cat-facet-wrap,
        #category-filter-sheet-inner .cat-facet-wrap {
            margin-top: 0;
        }
        #category-sidebar .cat-side-list {
            position: relative;
        }
        #category-sidebar .cat-side-row {
            position: relative;
        }
        #category-sidebar .cat-side-link {
            position: relative;
        }
        #category-sidebar .cat-side-chev {
            opacity: 0.65;
            transition: color .18s ease, transform .18s ease, opacity .18s ease;
        }
        #category-sidebar .cat-side-chev-muted {
            opacity: 0.22;
        }
        #category-sidebar .cat-side-row.has-flyout:hover > .cat-side-link .cat-side-chev,
        #category-sidebar .cat-side-row.has-flyout:focus-within > .cat-side-link .cat-side-chev {
            opacity: 1;
            color: var(--accent-color);
            transform: translateX(1px);
        }
        #category-sidebar .cat-side-flyout {
            position: fixed;
            min-width: 220px;
            max-width: 280px;
            display: none;
            z-index: 80;
            background: var(--card-bg);
            border: 1px solid var(--card-border);
            border-radius: 12px;
            padding: 10px;
            box-shadow: 0 10px 28px rgba(15, 23, 42, 0.12);
            overflow-y: auto;
        }
        #category-sidebar .cat-side-flyout.is-visible {
            display: block;
        }
        #category-sidebar .cat-side-flyout-title {
            font-size: 11px;
            font-weight: 700;
            text-transform: uppercase;
            color: var(--text-secondary);
            margin-bottom: 8px;
            letter-spacing: .06em;
        }
        #category-sidebar .cat-side-flyout-grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: 4px;
        }
        #category-sidebar .cat-side-flyout-link {
            font-size: 13px;
            color: var(--text-primary);
            border-radius: 8px;
            padding: 6px 8px;
            line-height: 1.25;
            display: block;
            transition: background-color .16s ease, color .16s ease;
        }
        #category-sidebar .cat-side-flyout-link:hover {
            background: #f8fafc;
            color: var(--accent-color);
        }
        #category-sidebar .cat-facet-block,
        #category-filter-sheet-inner .cat-facet-block {
            border-bottom: 1px solid var(--card-border);
            padding-bottom: 12px;
            margin-bottom: 12px;
        }
        #category-sidebar .cat-facet-block:last-of-type,
        #category-filter-sheet-inner .cat-facet-block:last-of-type {
            border-bottom: none;
            margin-bottom: 0;
            padding-bottom: 0;
        }
        #category-sidebar .cat-facet-heading,
        #category-filter-sheet-inner .cat-facet-heading {
            font-size: 0.7rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: 0.06em;
            color: var(--text-secondary);
            margin-bottom: 0.5rem;
        }
        #category-sidebar .cat-facet-heading--inline,
        #category-filter-sheet-inner .cat-facet-heading--inline {
            margin-bottom: 0;
        }
        #category-sidebar .cat-facet-row,
        #category-filter-sheet-inner .cat-facet-row {
            display: flex;
            align-items: center;
            gap: 0.5rem;
            font-size: 0.875rem;
            color: var(--text-primary);
            padding: 0.3rem 0;
            cursor: pointer;
            margin: 0;
        }
        #category-sidebar .cat-facet-cb,
        #category-filter-sheet-inner .cat-facet-cb {
            flex-shrink: 0;
            width: 1rem;
            height: 1rem;
            accent-color: var(--accent-color);
        }
        #category-sidebar .cat-facet-label,
        #category-filter-sheet-inner .cat-facet-label {
            flex: 1;
            min-width: 0;
        }
        #category-sidebar .cat-facet-count,
        #category-filter-sheet-inner .cat-facet-count {
            color: var(--text-secondary);
            font-size: 0.75rem;
            flex-shrink: 0;
        }
        #category-sidebar .cat-facet-tag-list,
        #category-filter-sheet-inner .cat-facet-tag-list {
            max-height: 14rem;
            overflow-y: auto;
        }

        /* Category price range: dual stacked range inputs + accent track */
        #category-sidebar .cat-price-dual-wrap,
        #category-filter-sheet-inner .cat-price-dual-wrap {
            position: relative;
            height: 36px;
            margin-top: 6px;
            --cat-price-left: 0%;
            --cat-price-right: 0%;
        }
        #category-sidebar .cat-price-dual-track,
        #category-filter-sheet-inner .cat-price-dual-track {
            position: absolute;
            left: 0;
            right: 0;
            top: 50%;
            transform: translateY(-50%);
            height: 6px;
            border-radius: 3px;
            pointer-events: none;
            z-index: 0;
            background: linear-gradient(
                90deg,
                var(--card-border) 0%,
                var(--card-border) var(--cat-price-left),
                var(--accent-color) var(--cat-price-left),
                var(--accent-color) calc(100% - var(--cat-price-right)),
                var(--card-border) calc(100% - var(--cat-price-right)),
                var(--card-border) 100%
            );
        }
        #category-sidebar .cat-price-range,
        #category-filter-sheet-inner .cat-price-range {
            position: absolute;
            left: 0;
            width: 100%;
            top: 0;
            height: 36px;
            margin: 0;
            padding: 0;
            background: none;
            -webkit-appearance: none;
            appearance: none;
            pointer-events: none;
            z-index: 1;
        }
        #category-sidebar .cat-price-range--min,
        #category-filter-sheet-inner .cat-price-range--min {
            z-index: 2;
        }
        #category-sidebar .cat-price-range::-webkit-slider-runnable-track,
        #category-filter-sheet-inner .cat-price-range::-webkit-slider-runnable-track {
            height: 6px;
            background: transparent;
            border: none;
            border-radius: 3px;
        }
        #category-sidebar .cat-price-range::-webkit-slider-thumb,
        #category-filter-sheet-inner .cat-price-range::-webkit-slider-thumb {
            -webkit-appearance: none;
            appearance: none;
            pointer-events: auto;
            width: 18px;
            height: 18px;
            border-radius: 50%;
            background: #fff;
            border: 2px solid var(--accent-color);
            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
            cursor: pointer;
            margin-top: -6px;
        }
        #category-sidebar .cat-price-range::-moz-range-track,
        #category-filter-sheet-inner .cat-price-range::-moz-range-track {
            height: 6px;
            background: transparent;
            border: none;
            border-radius: 3px;
        }
        #category-sidebar .cat-price-range::-moz-range-thumb,
        #category-filter-sheet-inner .cat-price-range::-moz-range-thumb {
            pointer-events: auto;
            width: 18px;
            height: 18px;
            border-radius: 50%;
            background: #fff;
            border: 2px solid var(--accent-color);
            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
            cursor: pointer;
        }

        .all-categories-btn { width: auto; display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: 15px; cursor: pointer; color: var(--menu-text); position: relative; }
        
        /* Dropdown Menu Styles */
        #desktop-category-dropdown {
            transform-origin: top;
            transition: all 0.2s ease;
        }
        
        #mobile-nav-drawer { position: fixed; top: 0; left: 0; height: 100%; width: 280px; background: var(--card-bg); z-index: 1000; transform: translateX(-100%); transition: 0.3s; }
        #mobile-nav-drawer.open { transform: translateX(0); }
        
        #cart-drawer { position: fixed; top: 0; right: 0; height: 100%; width: 320px; background: var(--card-bg); z-index: 1000; transform: translateX(100%); transition: 0.3s; display: flex; flex-direction: column; }
        #cart-drawer.open { transform: translateX(0); }
        .cart-drawer--sheet { top: auto; right: 0; left: 0; width: 100%; height: 70vh; max-height: 90vh; border-radius: 16px 16px 0 0; transform: translateY(100%); box-shadow: 0 -4px 20px rgba(0,0,0,0.15); }
        .cart-drawer--sheet.open { transform: translateY(0); }
        .cart-drawer--minimal { width: 300px; border-left: 1px solid var(--card-border); padding: 12px; }
        body.cart-icon--grocery .header-icon-link.cart-toggle,
        body.cart-icon--grocery .mobile-search-section .cart-toggle,
        body.cart-icon--grocery #mobile-header-shwapno .cart-toggle,
        body.cart-icon--grocery #mobile-header-center-trade .cart-toggle { display: none !important; }

        /* Center-trade (FABRILIFE-style) desktop: slimmer brand row */
        .header--centerTrade .header-el-location,
        .header--centerTrade .header-el-compare { display: none !important; }

        @media (min-width: 768px) {
            .header--centerTrade .header-el-menu-bar {
                display: none !important;
            }
            .header--centerTrade .header-nav-links {
                display: none !important;
            }
            .header--centerTrade #desktop-fabrilife-inline-nav.desktop-fabrilife-inline-nav {
                display: flex !important;
                align-items: center;
                gap: var(--header-gap-nav);
                min-width: 0;
                flex: 0 1 auto;
                max-width: min(42%, 28rem);
                overflow-x: auto;
                -webkit-overflow-scrolling: touch;
                scrollbar-width: none;
            }
            .header--centerTrade #desktop-fabrilife-inline-nav::-webkit-scrollbar {
                display: none;
            }
            .header--centerTrade .desktop-fabrilife-nav-link {
                flex-shrink: 0;
                text-transform: uppercase;
                font-size: 0.8125rem;
                font-weight: 600;
                letter-spacing: 0.04em;
                color: var(--header-text);
                text-decoration: none;
                white-space: nowrap;
            }
            .header--centerTrade .desktop-fabrilife-nav-link:hover {
                opacity: 0.82;
            }
            /* Fabrilife-style: search sits in the open band between inline nav and right icons */
            .header--centerTrade .desktop-search-box {
                flex-grow: 0 !important;
                flex: 0 1 auto;
                max-width: var(--search-max-width, min(22rem, 26vw)) !important;
                width: 100%;
                min-width: 11rem;
                margin-left: auto;
            }
            .header--centerTrade .header-search-input {
                border: 1px solid #e5e7eb;
                border-right: none;
                border-radius: 6px 0 0 6px;
                padding: 10px 16px;
                font-size: 14px;
                background: #f3f4f6;
                color: var(--text-primary);
            }
            .header--centerTrade .header-search-btn.desktop-search-btn {
                background: #e8e8ea;
                color: #374151;
                border: 1px solid #e5e7eb;
                border-left: none;
                border-radius: 0 6px 6px 0;
                padding: 0 18px;
            }
            .header--centerTrade .header-search-btn.desktop-search-btn:hover {
                filter: brightness(0.97);
            }
            .header--centerTrade .header-el-top-row .container {
                flex-wrap: nowrap;
                justify-content: flex-start;
                gap: 1rem;
                max-width: none;
                width: 100%;
                padding-left: 1.5rem;
                padding-right: 1.5rem;
            }
            @media (min-width: 1024px) {
                .header--centerTrade .header-el-top-row .container {
                    padding-left: 2rem;
                    padding-right: 2rem;
                }
            }
        }

        /* Center-trade mobile header */
        #mobile-header-center-trade { display: none; }
        @media (max-width: 767px) {
            #mobile-header-center-trade.header-style-active { display: block; }
        }
        @media (min-width: 768px) {
            #mobile-header-center-trade { display: none !important; }
        }
        #mobile-header-center-trade .center-trade-row1 {
            display: grid;
            grid-template-columns: 44px 1fr auto;
            align-items: center;
            gap: var(--header-gap-main);
            padding: 8px 12px;
            min-height: 52px;
            background: var(--header-bg);
            color: var(--header-text);
            border-bottom: 1px solid var(--card-border);
        }
        #mobile-header-center-trade .center-trade-menu { display: flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; }
        #mobile-header-center-trade .center-trade-logo-wrap {
            display: flex;
            justify-content: center;
            align-items: center;
            min-width: 0;
        }
        #mobile-header-center-trade .center-trade-logo-wrap img { width: auto; max-height: none; object-fit: contain; }
        #mobile-header-center-trade .center-trade-actions {
            display: flex;
            align-items: center;
            gap: var(--header-gap-icons);
        }
        #mobile-header-center-trade .center-trade-icon-btn {
            display: flex;
            align-items: center;
            justify-content: center;
            min-width: 44px;
            min-height: 44px;
            border: none;
            background: transparent;
            color: var(--header-icon);
            cursor: pointer;
            border-radius: 8px;
            text-decoration: none;
        }
        #mobile-header-center-trade .center-trade-icon-btn:hover { background: rgba(0,0,0,0.06); }
        #mobile-header-center-trade .center-trade-icon-btn .header-icon-badge {
            top: 4px;
            right: 2px;
        }

        /* Slanted tab nav (mobile, home) */
        #slanted-tab-nav { display: none; }
        #slanted-tab-nav.slanted-tab-nav--visible { display: block; }
        @media (min-width: 768px) {
            #slanted-tab-nav.slanted-tab-nav--visible { display: none !important; }
        }
        .slanted-tab-nav-track {
            display: flex;
            align-items: stretch;
            gap: 0;
            padding: 0 12px 10px;
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            scrollbar-width: none;
            background: var(--card-bg);
            border-bottom: 1px solid var(--card-border);
        }
        .slanted-tab-nav-track::-webkit-scrollbar { display: none; }
        .slanted-tab-item {
            flex: 1 1 auto;
            min-width: 72px;
            max-width: 140px;
            text-align: center;
            padding: 10px 14px 10px 18px;
            font-size: 12px;
            font-weight: 700;
            text-decoration: none;
            color: var(--menu-text);
            background: rgba(0,0,0,0.04);
            clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%);
            margin-left: -10px;
            position: relative;
            z-index: 1;
            transition: background 0.2s, color 0.2s;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        .slanted-tab-item:first-child {
            margin-left: 0;
            clip-path: polygon(0 0, 100% 0, calc(100% - 8px) 100%, 0 100%);
            padding-left: 12px;
        }
        .slanted-tab-item.is-active {
            background: var(--menu-bg);
            color: var(--accent-color);
            z-index: 2;
            box-shadow: 0 1px 0 var(--card-border);
        }

        /* Equal-width text tabs (Category display → mobile hero bar) */
        #slanted-tab-nav.mobile-hero-tab-nav--equal .hero-equal-tabs-track {
            display: flex;
            align-items: stretch;
            width: 100%;
            background: var(--card-bg);
            border-bottom: 1px solid var(--card-border);
        }
        #slanted-tab-nav.mobile-hero-tab-nav--equal .hero-equal-tab-item {
            flex: 1 1 0;
            min-width: 0;
            text-align: center;
            padding: 12px 6px;
            font-size: 11px;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.02em;
            text-decoration: none;
            color: var(--menu-text);
            border-right: 1px solid var(--card-border);
            display: flex;
            align-items: center;
            justify-content: center;
            transition: background 0.2s, color 0.2s;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        #slanted-tab-nav.mobile-hero-tab-nav--equal .hero-equal-tab-item:last-child {
            border-right: none;
        }
        #slanted-tab-nav.mobile-hero-tab-nav--equal .hero-equal-tab-item.is-active {
            background: rgba(0, 0, 0, 0.06);
            color: var(--menu-text);
        }
        @media (max-width: 767px) {
            #mobile-hero-section .mobile-cat-strip--suppressed-mobile { display: none !important; }
        }

        body.mobile-bottom-nav-hidden #bottom-nav-classic { display: none !important; }
        @media (max-width: 767px) {
            body.mobile-bottom-nav-hidden #main-content-area {
                padding-bottom: max(0.75rem, env(safe-area-inset-bottom, 0px)) !important;
            }
        }
        #grocery-cart-widget.grocery-cart-widget--active { display: block !important; }
        
        #cart-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 999; display: none; }
        
        /* Mobile: ensure home content and mobile hero can show (fallback if JS runs late) */
        @media (max-width: 767px) {
            #main-content-area { display: block; }
            #home-view:not(.hidden) { display: block; }
            html[data-spa-route="product"] #home-view { display: none !important; }
            #mobile-hero-section:not(.hidden) { display: block !important; }
        }
        /* Hide Bottom Nav on PC */
        @media (min-width: 768px) {
            #bottom-nav-classic, #mobile-checkout-bar { display: none !important; }
        }
        
        #bottom-nav-classic { 
            position: fixed; bottom: 0; left: 0; width: 100%; height: 60px; 
            background: white; box-shadow: 0 -2px 10px rgba(0,0,0,0.05); 
            display: grid; grid-template-columns: repeat(5, 1fr); 
            align-items: center; justify-items: center; border-top: 1px solid #eee; z-index: 900;
        }
        
        .bottom-nav-item {
            display: flex; flex-direction: column; align-items: center; justify-content: center;
            color: #6b7280; text-decoration: none; width: 100%; height: 100%; gap: 2px;
        }
        .bottom-nav-item.active, .bottom-nav-item:hover { color: var(--accent-color); }
        .bottom-nav--center-prominent { padding-bottom: 8px; }
        .bottom-nav--center-prominent .bottom-nav-item:nth-child(3) { transform: translateY(-8px); font-size: 1.1rem; }
        .bottom-nav--center-prominent .bottom-nav-item:nth-child(3) i { font-size: 1.4rem; }
        .bottom-nav--icons-only .bottom-nav-item span { display: none; }
        .bottom-nav--icons-only .bottom-nav-item { gap: 0; }

        .shipping-option {
            cursor: pointer; border: 2px solid var(--card-border); border-radius: 0.5rem; padding: 1rem;
            transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); display: flex; justify-content: space-between; align-items: center; background-color: var(--card-bg);
        }
        .shipping-option:hover { background-color: var(--body-bg); }
        .shipping-option.active { border-color: var(--accent-color); background-color: var(--body-bg); box-shadow: 0 0 0 1px var(--accent-color); }
        .shipping-option .checkmark { display: none; color: var(--accent-color); font-size: 1.25rem; }
        .shipping-option.active .checkmark { display: block; }

        .payment-option {
            cursor: pointer; border: 2px solid var(--card-border); border-radius: 0.75rem; padding: 0.9rem 1rem;
            transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); display: flex; justify-content: space-between; align-items: center;
            gap: 0.75rem; background-color: var(--card-bg); min-height: 3.5rem; margin-bottom: 0.65rem;
        }
        .payment-option:hover { background-color: var(--body-bg); }
        .payment-option.active { border-color: var(--accent-color); background-color: var(--body-bg); box-shadow: 0 0 0 1px var(--accent-color); }
        .payment-option.is-disabled { opacity: 0.55; pointer-events: none; cursor: not-allowed; }
        .payment-option .payment-option-icon {
            width: 2.5rem; height: 2.5rem; border-radius: 0.65rem; display: flex; align-items: center; justify-content: center;
            flex-shrink: 0; background: color-mix(in srgb, var(--accent-color) 12%, #fff); color: var(--accent-color); font-size: 1.05rem;
        }
        .payment-option.active .payment-option-icon { background: color-mix(in srgb, var(--accent-color) 22%, #fff); }
        .payment-option .checkmark { display: none; color: var(--accent-color); font-size: 1.25rem; flex-shrink: 0; }
        .payment-option.active .checkmark { display: block; }
        .payment-badge {
            display: inline-flex; align-items: center; font-size: 10px; font-weight: 700; letter-spacing: 0.02em;
            padding: 0.15rem 0.45rem; border-radius: 999px; margin-left: 0.35rem; vertical-align: middle;
            background: color-mix(in srgb, var(--accent-color) 15%, #fff); color: var(--accent-color);
        }
        .payment-badge--muted { background: #f3f4f6; color: #6b7280; }
        .payment-option-amount { font-weight: 700; font-size: 0.9rem; color: var(--text-primary, #111); white-space: nowrap; }
        .payment-option-amount-sub { display: block; font-size: 10px; font-weight: 500; color: #6b7280; margin-top: 2px; }
        .payment-trust-strip {
            display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem;
            margin-top: 0.75rem; padding: 0.65rem 0.75rem; border-radius: 0.65rem;
            background: #f8fafc; border: 1px solid #e5e7eb; font-size: 12px; color: #64748b;
        }
        .payment-trust-strip .payment-logos { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem; }
        .payment-trust-strip .payment-logo-pill {
            display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.2rem 0.45rem;
            border-radius: 0.35rem; background: #fff; border: 1px solid #e5e7eb; font-size: 11px; font-weight: 700; color: #334155;
        }
        .payment-trust-strip .payment-logo-pill i { font-size: 12px; }
        .payment-online-hint { margin-top: 0.5rem; font-size: 11px; color: #64748b; }
        @media (max-width: 480px) {
            .payment-option { align-items: flex-start; flex-wrap: wrap; }
            .payment-option-right { width: 100%; display: flex; justify-content: space-between; align-items: center; padding-left: 3.25rem; margin-top: -0.15rem; }
        }

        .toast-notification {
            position: fixed; top: 20px; left: 50%; transform: translateX(-50%) translateY(-20px);
            background: #333; color: white; padding: 12px 24px; border-radius: 8px;
            box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1);
            z-index: 9999; opacity: 0; visibility: hidden;
            transition: all 0.3s cubic-bezier(0.68, -0.55, 0.27, 1.55);
            display: flex; align-items: center; gap: 10px; font-weight: 500;
        }
        .toast-notification.show { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
        .toast-notification.success { background-color: #10B981; }
        .toast-notification.error { background-color: #EF4444; }

        .checkout-submit-btn:disabled { background-color: #9CA3AF; cursor: not-allowed; opacity: 0.8; }
        #mobile-checkout-bar { z-index: 950 !important; }

        @media (max-width: 767px) {
            #detail-cta-bar, #mobile-checkout-bar { border-top: 1px solid var(--card-border); }
        }

        .social-share-btn { width: 32px; height: 32px; border-radius: 50%; background: #f3f4f6; display: flex; align-items: center; justify-content: center; color: #4b5563; transition: 0.2s; }
        .social-share-btn:hover { background: #333; color: white; }
        
        .variant-btn {
            border: 1px solid #e5e7eb; padding: 8px 16px; border-radius: 50px; font-size: 13px; font-weight: 600; background: white; color: var(--text-primary); transition: all 0.2s; box-shadow: 0 1px 2px rgba(0,0,0,0.05);
        }
        .variant-btn.active {
            background: var(--accent-color); color: white; border-color: var(--accent-color); box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06);
        }
        
        .qty-box { display: flex; border: 1px solid #d1d5db; border-radius: 4px; overflow: hidden; }
        .qty-btn { width: 40px; height: 40px; background: #f9fafb; border: none; font-size: 16px; color: #374151; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: 0.2s; }
        .qty-btn:hover { background: #e5e7eb; }
        .qty-input { width: 50px; text-align: center; border-left: 1px solid #d1d5db; border-right: 1px solid #d1d5db; outline: none; font-weight: bold; font-size: 16px; }

        .btn-call { background-color: #4ade80; color: white; } .btn-call:hover { background-color: #22c55e; }
        .btn-whatsapp { background-color: #16a34a; color: white; } .btn-whatsapp:hover { background-color: #15803d; }
        .btn-messenger { background-color: #3b82f6; color: white; } .btn-messenger:hover { background-color: #2563eb; }
        .detail-save-pct-badge {
            display: inline-block;
            margin-left: 0.35rem;
            padding: 0.15rem 0.45rem;
            border-radius: 0.25rem;
            font-size: 0.75rem;
            font-weight: 800;
            vertical-align: middle;
            background: #16a34a;
            color: #fff;
        }
        #product-detail-view.detail-layout--mobileCommerceV1 #detail-contact-row {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 0.5rem;
        }
        #product-detail-view.detail-layout--mobileCommerceV1 #detail-contact-row .btn-call { grid-column: 2; grid-row: 1; }
        #product-detail-view.detail-layout--mobileCommerceV1 #detail-contact-row .btn-whatsapp { grid-column: 1; grid-row: 1; }
        #product-detail-view.detail-layout--mobileCommerceV1 #detail-contact-row .btn-messenger { display: none !important; }
        #product-detail-view.detail-layout--mobileCommerceV1 #detail-cta-bar .btn-buy-now {
            background-color: #111827 !important;
            color: #fff !important;
        }

        /* Default: media row stacks main + thumbs (unchanged from pre-wrapper layout) */
        .detail-media-row { display: block; min-width: 0; }

        /* mobileCommerceV2: thumbs column on the left of main (DOM order main then thumbs → row-reverse) */
        #product-detail-view.detail-layout--mobileCommerceV2 #detail-media-row {
            display: flex;
            flex-direction: row-reverse;
            align-items: stretch;
            gap: 0.75rem;
            min-height: 350px;
        }
        @media (min-width: 768px) {
            #product-detail-view.detail-layout--mobileCommerceV2 #detail-media-row {
                min-height: 450px;
            }
        }
        #product-detail-view.detail-layout--mobileCommerceV2 #detail-media-row .zoom-container {
            flex: 1;
            min-width: 0;
            margin-bottom: 0;
        }
        #product-detail-view.detail-layout--mobileCommerceV2 .thumb-swiper-container {
            width: 4.5rem;
            flex-shrink: 0;
            margin-top: 0;
            margin-bottom: 0;
            padding: 28px 0;
            height: 350px;
            box-sizing: border-box;
            display: flex;
            flex-direction: column;
            align-self: stretch;
        }
        @media (min-width: 768px) {
            #product-detail-view.detail-layout--mobileCommerceV2 .thumb-swiper-container {
                height: 450px;
            }
        }
        #product-detail-view.detail-layout--mobileCommerceV2 .thumb-swiper {
            width: 100%;
            flex: 1;
            min-height: 0;
            height: auto;
            max-height: none;
        }
        #product-detail-view.detail-layout--mobileCommerceV2 .thumb-swiper .swiper-slide {
            height: auto;
        }
        #product-detail-view.detail-layout--mobileCommerceV2 .swiper-slide-thumb-active {
            border-color: var(--btn-primary-bg, var(--accent-color)) !important;
        }
        #product-detail-view.detail-layout--mobileCommerceV2 .thumb-swiper-container .thumb-nav-btn {
            width: 100% !important;
            height: 22px !important;
            left: 0 !important;
            right: 0 !important;
        }
        #product-detail-view.detail-layout--mobileCommerceV2 .thumb-swiper-container .thumb-prev {
            top: 0 !important;
            bottom: auto !important;
            margin-top: 0 !important;
        }
        #product-detail-view.detail-layout--mobileCommerceV2 .thumb-swiper-container .thumb-next {
            bottom: 0 !important;
            top: auto !important;
            margin-top: 0 !important;
        }

        #product-detail-view.detail-layout--mobileCommerceV2 #detail-cta-bar,
        #product-detail-view.detail-layout--mobileCommerceV2 #detail-contact-row {
            display: none !important;
        }
        @media (max-width: 767px) {
            #product-detail-view.detail-layout--mobileCommerceV2 {
                padding-bottom: 1rem;
            }
        }

        /* V2: reorder column — actions then brand then long description (matches reference) */
        #product-detail-view.detail-layout--mobileCommerceV2 #product-detail-info-column {
            display: flex;
            flex-direction: column;
        }
        #product-detail-view.detail-layout--mobileCommerceV2 #detail-action-stack {
            order: 25;
        }
        #product-detail-view.detail-layout--mobileCommerceV2 #detail-brand-status-wrap {
            order: 26;
        }
        #product-detail-view.detail-layout--mobileCommerceV2 #detail-long-desc-block {
            order: 30;
        }

        #product-detail-view.detail-layout--mobileCommerceV2 #detail-four-action-grid {
            gap: 0.65rem;
        }
        #product-detail-view.detail-layout--mobileCommerceV2 #detail-four-action-grid .btn-buy-now {
            background-color: #14532d !important;
            color: #fff !important;
            border: none;
        }
        /* Solid orange Add to cart (reference) */
        #product-detail-view.detail-layout--mobileCommerceV2 #detail-four-action-grid .btn-add-cart {
            background-color: var(--btn-primary-bg, #f97316) !important;
            color: var(--btn-primary-text, #fff) !important;
            border: none !important;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
        }
        #product-detail-view.detail-layout--mobileCommerceV2 #detail-four-action-grid .btn-detail-call-v2 {
            background-color: #1d4ed8 !important;
            color: #fff !important;
        }
        #product-detail-view.detail-layout--mobileCommerceV2 #detail-four-action-grid .btn-detail-call-v2:hover {
            filter: brightness(1.05);
        }

        /* mobileCommerceArazshop: Arazshop stacked CTAs + shipping box — all breakpoints */
        #product-detail-view.detail-layout--mobileCommerceArazshop #detail-sku-row { display: none !important; }
        #product-detail-view.detail-layout--mobileCommerceArazshop #detail-price-wrap { display: none !important; }
        #product-detail-view.detail-layout--mobileCommerceArazshop #detail-price-arazshop-wrap { display: block !important; }
        #product-detail-view.detail-layout--mobileCommerceArazshop #detail-brand-status-wrap { display: none !important; }
        #product-detail-view.detail-layout--mobileCommerceArazshop #fomo-container { display: none !important; }
        #product-detail-view.detail-layout--mobileCommerceArazshop #detail-qty-row { display: none !important; }
        #product-detail-view.detail-layout--mobileCommerceArazshop #detail-cta-bar { display: none !important; }
        #product-detail-view.detail-layout--mobileCommerceArazshop #detail-contact-row { display: none !important; }
        #product-detail-view.detail-layout--mobileCommerceArazshop #detail-four-action-grid { display: none !important; }
        #product-detail-view.detail-layout--mobileCommerceArazshop #detail-arazshop-action-stack { display: flex !important; }
        #product-detail-view.detail-layout--mobileCommerceArazshop #detail-category-line.arazshop-visible { display: block !important; }
        #product-detail-view.detail-layout--mobileCommerceArazshop #detail-shipping-payment-box.arazshop-visible { display: block !important; }
        #product-detail-view.detail-layout--mobileCommerceArazshop .variant-btn.active {
            background: #16a34a !important;
            border-color: #16a34a !important;
            color: #fff !important;
        }
        #product-detail-view.detail-layout--mobileCommerceArazshop #product-detail-info-column {
            display: flex;
            flex-direction: column;
        }
        #product-detail-view.detail-layout--mobileCommerceArazshop #detail-title { order: 1; }
        #product-detail-view.detail-layout--mobileCommerceArazshop #detail-price-arazshop-wrap { order: 2; }
        #product-detail-view.detail-layout--mobileCommerceArazshop #detail-short-desc { order: 3; margin-bottom: 1rem; }
        #product-detail-view.detail-layout--mobileCommerceArazshop #detail-variants-wrap { order: 4; }
        #product-detail-view.detail-layout--mobileCommerceArazshop #detail-action-stack { order: 5; }
        #product-detail-view.detail-layout--mobileCommerceArazshop #detail-category-line { order: 6; }
        #product-detail-view.detail-layout--mobileCommerceArazshop #detail-shipping-payment-box { order: 7; }
        #product-detail-view.detail-layout--mobileCommerceArazshop #detail-long-desc-block { order: 8; }
        @media (max-width: 767px) {
            #product-detail-view.detail-layout--mobileCommerceArazshop {
                padding-bottom: 1rem;
            }
            #product-detail-view.detail-layout--mobileCommerceArazshop > div {
                border: none !important;
                box-shadow: none !important;
                border-radius: 0 !important;
                padding-left: 0.75rem !important;
                padding-right: 0.75rem !important;
            }
        }
        @media (min-width: 768px) {
            #product-detail-view.detail-layout--mobileCommerceArazshop #detail-arazshop-action-stack {
                max-width: 420px;
            }
        }
        #detail-arazshop-action-stack {
            display: none;
            flex-direction: column;
            gap: 0.65rem;
            margin-top: 0.5rem;
            margin-bottom: 1rem;
        }
        #detail-arazshop-action-stack .btn-arazshop-order {
            background-color: #16a34a;
            color: #fff;
            border: none;
        }
        #detail-arazshop-action-stack .btn-arazshop-order:hover { background-color: #15803d; }
        #detail-arazshop-action-stack .btn-arazshop-cart {
            background-color: #fff;
            color: #16a34a;
            border: 2px solid #16a34a;
        }
        #detail-arazshop-action-stack .btn-arazshop-cart:hover { background-color: #f0fdf4; }
        #detail-arazshop-action-stack .btn-arazshop-whatsapp {
            background-color: #25D366;
            color: #fff;
            border: none;
        }
        #detail-arazshop-action-stack .btn-arazshop-whatsapp:hover { background-color: #1da851; }
        #detail-arazshop-action-stack .btn-arazshop-call {
            background-color: #2563eb;
            color: #fff;
            border: none;
        }
        #detail-arazshop-action-stack .btn-arazshop-call:hover { background-color: #1d4ed8; }
        #detail-arazshop-action-stack .btn-arazshop-messenger {
            background: linear-gradient(135deg, #0084ff 0%, #a855f7 100%);
            color: #fff;
            border: none;
        }
        #detail-arazshop-action-stack .btn-arazshop-messenger:hover { filter: brightness(1.05); }
        #detail-arazshop-action-stack button {
            width: 100%;
            padding: 0.875rem 1rem;
            border-radius: 0.5rem;
            font-weight: 700;
            font-size: 0.95rem;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 0.5rem;
            cursor: pointer;
            transition: background 0.2s, filter 0.2s;
        }
        #detail-shipping-payment-box {
            background: #eff6ff;
            border: 1px solid #bfdbfe;
            color: #1e3a5f;
            line-height: 1.6;
        }
        #detail-shipping-payment-box .arazshop-ship-row {
            display: flex;
            justify-content: space-between;
            gap: 0.5rem;
        }

        /* Tabbed product description (Arazshop style) */
        .detail-desc-tab-bar {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 0.75rem 1rem;
            margin-bottom: 0;
            padding-bottom: 0.75rem;
            border-bottom: 1px solid #e5e7eb;
        }
        .detail-desc-tab-btn {
            border: none;
            background: transparent;
            color: var(--text-primary, #111827);
            font-weight: 700;
            font-size: 0.95rem;
            padding: 0.45rem 1rem;
            border-radius: 9999px;
            cursor: pointer;
            transition: background 0.2s, color 0.2s;
        }
        .detail-desc-tab-btn.detail-desc-tab--active {
            background-color: #16a34a;
            color: #fff;
        }
        .detail-desc-tabs-card {
            margin-top: 0.75rem;
            padding: 1rem;
            border: 1px solid #e5e7eb;
            border-radius: 0.5rem;
            background: #fff;
        }
        .arazshop-desc-content {
            font-size: 0.875rem;
            line-height: 1.65;
            color: var(--text-primary, #111827);
            word-break: break-word;
        }
        .arazshop-desc-content p { margin-bottom: 0.65rem; }
        .arazshop-desc-content h2,
        .arazshop-desc-content h3,
        .arazshop-desc-content h4 {
            font-weight: 800;
            font-size: 1rem;
            margin: 1rem 0 0.5rem;
            display: flex;
            align-items: flex-start;
            gap: 0.35rem;
        }
        .arazshop-desc-content h2::before,
        .arazshop-desc-content h3::before,
        .arazshop-desc-content h4::before {
            content: '◆';
            color: #2563eb;
            font-size: 0.75rem;
            line-height: 1.4;
            flex-shrink: 0;
        }
        .arazshop-desc-content ul,
        .arazshop-desc-content ol {
            list-style: none;
            padding-left: 0;
            margin: 0.5rem 0 0.75rem;
        }
        .arazshop-desc-content li {
            position: relative;
            padding-left: 1.15rem;
            margin-bottom: 0.45rem;
        }
        .arazshop-desc-content ul li::before,
        .arazshop-desc-content ol li::before {
            content: '▸';
            color: #16a34a;
            font-weight: 700;
            position: absolute;
            left: 0;
            top: 0;
        }
        .arazshop-desc-content strong { font-weight: 700; }

        .mobile-commerce-fbt { border-radius: 0.75rem; border: 1px solid var(--card-border); overflow: hidden; background: var(--card-bg); }
        .mobile-commerce-fbt h4 { font-size: 1rem; font-weight: 800; padding: 0.75rem 1rem; margin: 0; color: var(--text-primary); border-bottom: 1px solid var(--card-border); }
        .mobile-commerce-fbt-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.5rem; padding: 0.75rem; }
        @media (max-width: 480px) {
            .mobile-commerce-fbt-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        }
        .mobile-commerce-fbt-card { border: 1px solid var(--card-border); border-radius: 0.5rem; padding: 0.5rem; background: #fff; position: relative; min-height: 120px; }
        .mobile-commerce-fbt-card .fbt-card-check { position: absolute; bottom: 6px; right: 6px; width: 1.1rem; height: 1.1rem; accent-color: var(--btn-primary-bg); }
        .mobile-commerce-fbt-footer {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: space-between;
            gap: 0.75rem;
            padding: 0.75rem 1rem;
            background: var(--btn-primary-bg);
            color: var(--btn-primary-text);
        }
        .mobile-commerce-fbt-footer .fbt-total-line { font-size: 1.1rem; font-weight: 800; }
        .mobile-commerce-fbt-footer .fbt-save-line { font-size: 0.8rem; opacity: 0.95; margin-top: 0.15rem; }
        .mobile-commerce-fbt-footer .fbt-add-bundle-btn {
            background: #fff;
            color: var(--btn-primary-bg);
            font-weight: 800;
            padding: 0.55rem 1rem;
            border-radius: 0.375rem;
            border: none;
            cursor: pointer;
            font-size: 0.85rem;
        }
        .mobile-commerce-fbt-footer .fbt-add-bundle-btn:hover { filter: brightness(0.95); }
        .btn-add-cart { background-color: var(--btn-primary-bg); color: var(--btn-primary-text) !important; } .btn-add-cart:hover { opacity: 0.9; }
        .btn-buy-now { background-color: var(--btn-primary-bg); color: #ffffff !important; } .btn-buy-now:hover { opacity: 0.9; }
        /* Product detail CTA: ghee-style — outline Add to Cart + solid Buy Now, always two columns */
        #detail-cta-bar .btn-add-cart {
            background-color: var(--card-bg);
            color: var(--btn-primary-bg) !important;
            border: 2px solid var(--btn-primary-bg);
            box-shadow: none;
        }
        #detail-cta-bar .btn-add-cart:hover {
            opacity: 1;
            background-color: color-mix(in srgb, var(--btn-primary-bg) 10%, var(--card-bg));
        }
        @supports not (background: color-mix(in srgb, red, blue)) {
            #detail-cta-bar .btn-add-cart:hover { filter: brightness(0.97); }
        }

        /* Product detail: info column (title, price, description, buttons) always visible below image on mobile */
        #product-detail-info-column { display: flex !important; visibility: visible !important; flex-direction: column; min-height: 1px; }
        #product-detail-view:not(.hidden) #product-detail-info-column { display: flex !important; visibility: visible !important; }

        .zoom-container { overflow: hidden; cursor: crosshair; position: relative; }
        .zoom-img { transition: transform 0.1s ease-out; transform-origin: center center; will-change: transform; display: block; max-width: 100%; max-height: 100%; object-fit: contain; }
        @media (max-width: 768px) { .zoom-container { cursor: default; } }

        #size-chart-modal { background-color: rgba(0, 0, 0, 0.75); backdrop-filter: blur(2px); }

        .fire-text { background: linear-gradient(to right, #f97316, #dc2626); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-weight: 800; }
        .fomo-container { background-color: #fff7ed; border: 1px solid #fed7aa; border-radius: 6px; padding: 10px; margin-top: 10px; margin-bottom: 10px; position: relative; overflow: hidden; }
        .fomo-pulse { animation: pulse-red 2s infinite; }
        @keyframes pulse-red { 0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(220, 38, 38, 0.7); } 70% { transform: scale(1); box-shadow: 0 0 0 10px rgba(220, 38, 38, 0); } 100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(220, 38, 38, 0); } }
        .stock-progress-bg { width: 100%; height: 6px; background-color: #e5e7eb; border-radius: 3px; margin-top: 8px; overflow: hidden; display: none; }
        .stock-progress-bar { height: 100%; background: linear-gradient(90deg, #ef4444, #f97316); width: 100%; transition: width 1s ease-in-out; border-radius: 3px; }

        #scroll-top-btn {
            transition: all 0.3s ease-in-out;
            opacity: 0;
            transform: translateY(20px);
            pointer-events: none;
        }
        #scroll-top-btn.show-scroll-btn {
            opacity: 1;
            transform: translateY(0);
            pointer-events: auto;
        }

        /* === VIDEO GALLERY STYLES === */
        #detail-video-player { width: 100%; height: 100%; object-fit: contain; }

        /* === NEW THUMBNAIL SWIPER STYLES (Alibaba/Amazon Like) === */
        .thumb-swiper-container {
            position: relative;
            margin-top: 10px;
            padding: 0 25px; /* Space for arrows */
            min-width: 0;
            overflow: hidden;
        }
        .thumb-swiper {
            width: 100%;
            max-width: 100%;
            height: 70px; /* Fixed height for thumbs */
            padding: 2px 0;
        }
        .swiper-slide-thumb {
            opacity: 0.6;
            transition: 0.3s;
            cursor: pointer;
            border: 2px solid transparent;
            border-radius: 4px;
            overflow: hidden;
            position: relative;
            background: #fff;
        }
        .swiper-slide-thumb img {
            width: 100%;
            height: 100%;
            object-fit: contain;
        }
        .swiper-slide-thumb-active {
            opacity: 1;
            border-color: var(--accent-color);
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        }
        /* Tiny Navigation Arrows */
        .thumb-nav-btn {
            color: #555 !important;
            width: 20px !important;
            height: 100% !important;
            top: 0 !important;
            margin-top: 0 !important;
            background: rgba(255,255,255,0.8);
            border-radius: 2px;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .thumb-nav-btn::after { font-size: 14px !important; font-weight: bold; }
        .thumb-prev { left: 0 !important; }
        .thumb-next { right: 0 !important; }
        .thumb-nav-btn:hover { background: #f0f0f0; color: black !important; }

        /* Video Badge on Thumb */
        .video-badge {
            position: absolute;
            top: 50%; left: 50%;
            transform: translate(-50%, -50%);
            width: 24px; height: 24px;
            background: rgba(0,0,0,0.6);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-size: 10px;
            z-index: 10;
            pointer-events: none;
        }

        /* #loading-overlay: hidden placeholder for tryDismissBootLoadingOverlay / IP paths (no visible boot UI) */

        /* Boot skeleton — shown only when SSR did not inject visible home HTML (prevents footer jump) */
        .home-boot-skeleton {
            width: 100%;
            min-height: 820px;
            margin-bottom: 1.5rem;
            animation: home-boot-shimmer 1.2s ease-in-out infinite;
        }
        .home-boot-skeleton__hero {
            width: 100%;
            height: 280px;
            max-height: 42vh;
            border-radius: 12px;
            background: linear-gradient(90deg, #e5e7eb 25%, #f3f4f6 50%, #e5e7eb 75%);
            background-size: 200% 100%;
            margin-bottom: 1rem;
        }
        @media (min-width: 768px) {
            .home-boot-skeleton__hero { height: 420px; max-height: none; }
        }
        .home-boot-skeleton__cats {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 12px;
            margin-bottom: 1.5rem;
        }
        .home-boot-skeleton__cat {
            aspect-ratio: 1;
            border-radius: 12px;
            background: #e5e7eb;
        }
        .home-boot-skeleton__grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 12px;
        }
        @media (min-width: 768px) {
            .home-boot-skeleton__grid { grid-template-columns: repeat(3, 1fr); gap: 16px; }
            .home-boot-skeleton__cats { grid-template-columns: repeat(6, 1fr); }
        }
        .home-boot-skeleton__card {
            min-height: 180px;
            border-radius: 12px;
            background: #e5e7eb;
        }
        @keyframes home-boot-shimmer {
            0% { background-position: 200% 0; }
            100% { background-position: -200% 0; }
        }
        /* When SSR painted content, skeleton is removed server-side; JS also dismisses */
        body.ssr-home-ready #home-boot-skeleton { display: none !important; }

        /* Paint order: SSR product grid stays hidden until above-fold (hero/cats) is ready */
        body:not(.home-above-fold-ready) #just-for-you-section[data-ssr-home="1"] {
            display: none !important;
        }
        body.ssr-home-pending:not(.home-above-fold-ready) #home-boot-skeleton {
            display: block;
        }