/* ═══════════════════════════════════════════════════════════
   SHOP Furnitura — Mobile Styles
   Цей файл підключається ПІСЛЯ app.css і містить ВСІ мобільні правила.
   Десктопний app.css НЕ редагується.
   
   Брейкпоінти:
   ≤1100px — tablet landscape
   ≤760px  — tablet portrait / великі телефони  
   ≤480px  — смартфони
   ≤380px  — малі смартфони
   ═══════════════════════════════════════════════════════════ */

/* ═══ 1. NAVBAR ═══════════════════════════════════════════ */

/* -- Tablet ≤1100px -- */
@media(max-width:1100px){
    .nav-inner{padding:0 1rem;gap:1rem}
}

/* -- Mobile ≤760px -- */
@media(max-width:760px){
    /* Hide desktop-only elements */
    .topbar{display:none!important}
    .nav-links{display:none!important}
    .logo-sub{display:none!important}
    .catalog-btn{display:none!important}
    .search-bar{flex:0 0 auto;max-width:none;position:static}
    .search-input{display:none!important}
    .search-btn{border-radius:10px!important;width:40px;height:40px;padding:0!important;display:flex!important;align-items:center;justify-content:center;background:var(--blue-ghost)!important;border:1.5px solid var(--blue-pale)!important}
    .search-btn svg{stroke:var(--blue-bright)}
    .search-btn:hover{background:var(--blue-pale)!important}
    
    /* Navbar layout */
    .nav-inner{height:54px;padding:0 .5rem!important;gap:.3rem!important;display:flex!important;align-items:center!important}
    nav{position:fixed!important;top:0;left:0;right:0;z-index:200}
    body{padding-top:56px}
    .logo{flex:1;min-width:0}
    .logo-top{font-size:.88rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    
    /* Burger button */
    .burger-btn{display:flex!important;order:-1;flex-direction:column;justify-content:center;align-items:center;width:40px;height:40px;padding:7px;gap:4px;background:var(--blue-ghost);border:1.5px solid var(--blue-pale);border-radius:10px;cursor:pointer;flex-shrink:0;margin-right:.1rem}
    .burger-btn span{display:block;width:17px;height:2px;background:var(--blue-bright);border-radius:2px;transition:all .3s}
    .burger-btn.active{background:var(--blue-bright);border-color:var(--blue-bright)}
    .burger-btn.active span{background:#fff}
    .burger-btn.active span:nth-child(1){transform:rotate(45deg) translate(4px,4px)}
    .burger-btn.active span:nth-child(2){opacity:0}
    .burger-btn.active span:nth-child(3){transform:rotate(-45deg) translate(4px,-4px)}
    
    /* Cabinet icon */
    .cabinet-link span{display:none!important}
    .cabinet-link{font-size:0!important;padding:0!important;gap:0!important;width:40px;height:40px;min-width:40px;display:flex!important;align-items:center;justify-content:center;border:1.5px solid var(--blue-pale);border-radius:10px;background:var(--blue-ghost)}
    .cabinet-link svg{width:18px;height:18px;flex-shrink:0}
    
    /* Cart icon */
    .cart-link span:not(.cart-count){display:none!important}
    .cart-link{font-size:0!important;padding:0!important;gap:0!important;width:40px;height:40px;min-width:40px;display:flex!important;align-items:center;justify-content:center;border:1.5px solid var(--blue-pale)!important;border-radius:10px!important;background:var(--blue-ghost)!important;position:relative}
    .cart-link svg{width:18px;height:18px;flex-shrink:0}
    .cart-count{font-size:.55rem!important;min-width:16px;height:16px;position:absolute;top:-5px;right:-5px}
}

/* -- Small phones ≤480px -- */
@media(max-width:480px){
    .nav-inner{padding:0 .3rem!important;gap:.25rem!important}
    .burger-btn{width:38px;height:38px}
    .cabinet-link{min-width:38px;min-height:38px;padding:.4rem .5rem!important}
    .cart-link{min-width:38px;min-height:38px;padding:.4rem .5rem!important}
    .search-btn{width:38px;height:38px}
    .logo-top{font-size:.85rem}
}

/* -- Tiny phones ≤380px -- */
@media(max-width:380px){
    .nav-inner{gap:.2rem!important}
    .logo-top{font-size:.78rem}
}



/* Hide search close button globally */
.search-close{display:none!important}

/* ═══ 1b. MOBILE SEARCH EXPAND ═══════════════════════════ */

@media(max-width:760px){
    /* When search is expanded, show full bar */
    .search-bar.expanded{position:absolute!important;left:0;right:0;top:0;bottom:0;z-index:10;background:#fff;display:flex!important;max-width:100%!important;padding:.5rem;align-items:center;gap:.3rem}
    .search-bar.expanded .search-input{display:block!important;flex:1;border:1.5px solid var(--blue-pale);border-radius:var(--radius-sm) 0 0 var(--radius-sm);height:42px;font-size:.85rem}
    .search-bar.expanded .search-btn{border-radius:0 var(--radius-sm) var(--radius-sm) 0!important;background:var(--blue-bright)!important;border:1.5px solid var(--blue-bright)!important;height:42px;width:44px}
    .search-bar.expanded .search-btn svg{stroke:#fff!important}
    .search-bar.expanded .search-close{display:flex!important}
    .search-close{display:none;align-items:center;justify-content:center;width:36px;height:36px;background:none;border:none;font-size:1.1rem;color:var(--gray-500);cursor:pointer;flex-shrink:0;border-radius:8px}
    .search-close:hover{background:var(--gray-100)}
}

/* ═══ 2. SIDEBAR + MOBILE FILTER ═════════════════════════ */

@media(max-width:760px){
    /* Hide sidebar, show via button */
    .sidebar{display:none!important}
    .sidebar.mobile-open{display:block!important;position:fixed;top:0;left:0;width:280px;height:100vh;z-index:1000;box-shadow:4px 0 24px rgba(0,0,0,.15);overflow-y:auto;animation:slideInSidebar .3s ease;border-radius:0 14px 14px 0!important;border:none!important}
    
    /* Overlay */
    .sidebar-overlay{display:none!important;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:999}
    .sidebar-overlay.active{display:block!important}
    
    /* Filter button */
    .mobile-filter-btn{display:inline-flex!important;align-items:center;gap:.4rem;padding:.55rem 1.2rem;background:var(--blue-bright)!important;color:#fff!important;border:none!important;border-radius:var(--radius-sm);font-size:.8rem;font-weight:600;cursor:pointer;font-family:inherit;margin-top:.5rem;margin-bottom:.8rem;box-shadow:0 2px 8px rgba(37,99,235,.25)}
    .mobile-filter-btn:hover{background:var(--blue-mid)!important}
}
.filter-apply-wrap{display:none}
@media(max-width:760px){.filter-apply-wrap{display:block;position:sticky;bottom:0;padding:.8rem;background:#fff;border-top:1.5px solid var(--gray-200);box-shadow:0 -4px 12px rgba(0,0,0,.08)}.filter-apply-btn{width:100%;padding:.7rem;background:var(--blue-bright);color:#fff;border:none;border-radius:10px;font-size:.85rem;font-weight:700;cursor:pointer;font-family:inherit}.filter-apply-btn:hover{background:var(--blue-mid)}}
.sidebar-close-btn{display:none}
@media(max-width:760px){.sidebar-close-btn{display:block;margin-left:auto;background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;padding:0;line-height:1;opacity:.8}.sidebar-close-btn:hover{opacity:1}
    .sidebar-header{position:sticky;top:0;z-index:10}}
@keyframes slideInSidebar{from{transform:translateX(-100%)}to{transform:translateX(0)}}

/* Hide filter button on desktop */
@media(min-width:761px){
    .mobile-filter-btn{display:none!important}
}


/* ═══ 3. CATALOG / CATEGORIES ════════════════════════════ */

@media(max-width:1100px){
    .page-layout{grid-template-columns:1fr}.sidebar{grid-column:auto;grid-row:auto}.main-content{grid-column:auto;grid-row:auto}
    .cat-grid-main{grid-template-columns:repeat(2,1fr)}
    .products-grid{grid-template-columns:repeat(3,1fr)}
}

@media(max-width:760px){
    .page-layout{padding:0 .8rem 2rem!important}
    .main-content{padding:0}
    .products-grid{grid-template-columns:repeat(2,1fr)!important;gap:.5rem}
    .product-card-body{padding:.5rem .5rem .6rem}
    .product-card-name{font-size:.72rem;-webkit-line-clamp:2;line-height:1.3}
    .product-card-sku{font-size:.58rem;margin-bottom:.3rem}
    .price-current{font-size:.82rem}
    .price-old{font-size:.62rem}
    .btn-add-cart{padding:.4rem;font-size:.68rem}
    .catalog-title{font-size:1.15rem;overflow-wrap:break-word;word-break:break-word}
    .cat-compact-grid{grid-template-columns:repeat(2,1fr)!important}
    /* Category cards equal height */
    .cat-compact-grid{align-items:stretch!important}
    .cat-compact-card{display:flex!important;flex-direction:column!important;height:100%!important}
    .cat-compact-img{flex-shrink:0!important}
    .cat-compact-body{flex:1!important;display:flex!important;flex-direction:column!important;justify-content:center!important}
    .cat-compact-name{font-size:.82rem!important;line-height:1.25!important}
    .cat-compact-count{font-size:.68rem!important}

}

@media(max-width:480px){
    .cat-compact-grid{grid-template-columns:repeat(2,1fr)!important}
    /* Category cards equal height */
    .cat-compact-grid{align-items:stretch!important}
    .cat-compact-card{display:flex!important;flex-direction:column!important;height:100%!important}
    .cat-compact-img{flex-shrink:0!important}
    .cat-compact-body{flex:1!important;display:flex!important;flex-direction:column!important;justify-content:center!important}
    .cat-compact-name{font-size:.82rem!important;line-height:1.25!important}
    .cat-compact-count{font-size:.68rem!important}

}


/* ═══ 4. BREADCRUMBS ═════════════════════════════════════ */

@media(max-width:600px){
    .breadcrumb-bar{padding:.5rem 1rem}
    .breadcrumb-inner{font-size:.65rem;flex-wrap:wrap;gap:.2rem}
}


/* ═══ 5. MOBILE PROMOS ═══════════════════════════════════ */

.mobile-promos{display:none}
@media(max-width:760px){
    .mobile-promos{display:none;margin-bottom:.8rem;background:var(--white);border:1.5px solid var(--gray-200);border-radius:12px;padding:.6rem .8rem;box-shadow:0 1px 4px rgba(37,99,235,.06)}
    .mobile-promos-header{display:flex;align-items:center;gap:.4rem;margin-bottom:.5rem}
    .mobile-promos-fire{font-size:.9rem}
    .mobile-promos-title{font-family:'Unbounded',sans-serif;font-size:.78rem;font-weight:700;color:var(--blue-deep)}
    .mobile-promos-all{margin-left:auto;font-size:.68rem;font-weight:600;color:var(--blue-bright);text-decoration:none;white-space:nowrap}
    .mobile-promos-scroll{display:flex;gap:.4rem;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:2px}
    .mobile-promos-scroll::-webkit-scrollbar{display:none}
    .mobile-promo-chip{display:flex;align-items:center;gap:.35rem;padding:.35rem .6rem;background:var(--white);border:1.5px solid var(--gray-200);border-radius:8px;text-decoration:none;white-space:nowrap;flex-shrink:0}
    .mobile-promo-chip:hover,.mobile-promo-chip.active{border-color:var(--blue-bright);background:var(--blue-ghost)}
    .mobile-promo-pct{font-family:'Unbounded',sans-serif;font-size:.62rem;font-weight:800;padding:.15rem .35rem;border-radius:4px;flex-shrink:0}
    .mobile-promo-name{font-size:.72rem;font-weight:600;color:var(--gray-700)}
}


/* ═══ 6. HOMEPAGE ════════════════════════════════════════ */

@media(max-width:760px){
    .hero{padding:2.5rem 1.2rem 2rem}
    .hero-inner{grid-template-columns:1fr}
    .hero-visual{display:none}
    .hero-title{font-size:1.6rem}
    .hero-actions{flex-direction:column;gap:.5rem}
    .btn-hero-primary,.btn-hero-outline{width:100%;text-align:center;justify-content:center;display:inline-flex!important}
    .features{padding:.8rem!important}
    .features-inner{grid-template-columns:1fr 1fr!important;gap:0!important;border:1.5px solid var(--gray-200)!important;border-radius:12px!important;overflow:hidden!important;background:var(--white)!important;padding:0!important}
    .feature-item{border-right:1px solid var(--gray-100)!important;border-bottom:1px solid var(--gray-100)!important;padding:.7rem .6rem!important;display:flex!important;align-items:center!important;gap:.5rem!important;background:var(--white)!important}
    .feature-item:nth-child(2n){border-right:none!important}
    .feature-item:nth-child(n+3){border-bottom:none!important}
    .feature-icon{width:28px!important;height:28px!important;min-width:28px!important;border-radius:8px!important;font-size:.8rem!important}
    .feature-text-title{font-size:.72rem!important;font-weight:600!important;line-height:1.2!important;margin-bottom:1px!important}
    .feature-text-sub{font-size:.58rem!important;color:var(--gray-400)!important;line-height:1.2!important}
    .cat-grid{grid-template-columns:repeat(2,1fr)}
    .info-bottom-inner{grid-template-columns:1fr}
    .footer-inner{grid-template-columns:1fr!important;gap:1rem}
}

@media(max-width:480px){
    .hero-title{font-size:1.3rem}
    .hero-tag{font-size:.6rem;padding:.2rem .6rem}
    .hero-desc{font-size:.78rem}
    .cat-grid{grid-template-columns:repeat(2,1fr)}
}



/* ═══ 6b. FEATURES COMPACT ═══════════════════════════════ */

@media(max-width:760px){
    .info-bottom{padding:1rem .8rem!important}
    .info-bottom-inner{display:grid!important;grid-template-columns:1fr 1fr!important;gap:.6rem!important}
    .info-item{padding:.6rem!important;gap:.5rem!important}
    .info-item-icon{width:32px!important;height:32px!important;font-size:1rem!important;flex-shrink:0}
    .info-item-title{font-size:.72rem!important}
    .info-item-sub{font-size:.62rem!important}
}

@media(max-width:480px){
    .info-bottom-inner{grid-template-columns:1fr 1fr!important}
}

/* ═══ 6c. HOMEPAGE REORDER + COMPACT HERO ════════════════ */

@media(max-width:760px){
    /* Flex container for reordering */
    .home-sections{display:flex!important;flex-direction:column!important}
    .home-banners-row{display:flex!important;flex-direction:column!important;padding:.4rem .8rem!important;gap:.5rem!important;order:2!important}
    .home-banners-row > a:first-child{display:none!important}
    
    /* Reorder: Hero → Categories → Bestsellers → Promo → Features → Cashback → New */
    .hero{order:1!important}
    #home-categories{order:3!important}
    #home-bestsellers{order:4!important}
    #home-new{order:5!important}
    #home-features{order:6!important}
    #home-cashback{order:7!important}
    
    /* Compact Hero */
    .hero{padding:1.8rem 1rem 1.5rem!important}
    .hero-tag{font-size:.58rem!important;padding:.18rem .5rem!important;margin-bottom:.5rem!important}
    .hero-title{font-size:1.5rem!important;margin-bottom:1rem!important;line-height:1.15!important}
    .hero-desc{display:none!important}
    .hero-actions{gap:.4rem!important;margin-bottom:.8rem!important}
    .btn-hero-primary{padding:.65rem 1.5rem!important;font-size:.82rem!important}
    .btn-hero-outline{padding:.55rem 1rem!important;font-size:.78rem!important}
    .hero-stats{display:flex!important;justify-content:space-between!important;width:100%!important;gap:0!important;margin-top:0!important}
    .hero-stats .stat{flex:1!important;text-align:center!important}
    .hero-stats .stat-num{font-size:1.15rem!important}
    .hero-stats .stat-label{font-size:.58rem!important}
    
    /* Hide hero visual on mobile (categories shown separately) */
    .hero-visual{display:none!important}
    
    /* Categories section compact */
    #home-categories{padding:1rem .8rem!important}
    #home-categories .section-header{margin-bottom:.8rem!important}
    #home-categories .section-title{font-size:1.1rem!important}
    #home-categories .section-tag{font-size:.6rem!important}
    
    /* Promo banner compact */
    #home-categories .promo-banner{padding:.6rem!important;margin-bottom:.8rem!important;gap:.4rem!important;flex-direction:column!important;text-align:center!important}
    #home-categories .promo-badge{font-size:.85rem!important}
    #home-categories .promo-title{font-size:.78rem!important}
    #home-categories .promo-desc{font-size:.65rem!important}
    #home-categories .promo-btn{width:100%!important;justify-content:center!important;font-size:.75rem!important;padding:.5rem!important}
    
    /* Cashback compact */
    #home-cashback{padding:.5rem .8rem!important}
    #home-cashback .cashback-promo{flex-direction:column!important;text-align:center!important;padding:.7rem 1rem!important;gap:.5rem!important;border-radius:12px!important}
    #home-cashback .cashback-promo>div:first-child{flex-direction:column!important;gap:.5rem!important;align-items:center!important}
    #home-cashback .cashback-promo>div:last-child{display:none!important}
}

/* ═══ 7. PRODUCT PAGE ════════════════════════════════════ */

/* Tablet — single column */
@media(max-width:900px){
    .product-page{grid-template-columns:1fr!important;gap:1.5rem!important;padding:1rem!important}
    .product-gallery{position:static!important}
}

/* Mobile — optimised for conversion */
@media(max-width:600px){
    .product-page{display:flex!important;flex-direction:column!important;gap:.6rem!important;padding:.6rem .8rem 80px!important}
    
    /* Gallery first */
    .product-gallery{order:1!important;width:100%!important}
    .gallery-main{max-height:300px!important;aspect-ratio:auto!important;border-radius:12px!important;border-width:1px!important;margin-bottom:0!important}
    .gallery-main img{width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important}
    
    /* Thumbnails - clear row below photo */
    .gallery-thumbs{display:flex!important;width:100%!important;margin-top:.5rem!important;margin-bottom:.6rem!important;gap:.4rem!important;flex-wrap:wrap!important}
    .gallery-thumb{width:52px!important;height:52px!important;border-radius:8px!important}
    
    /* Product info below gallery */
    .product-info{order:2!important;display:flex!important;flex-direction:column!important;width:100%!important;gap:.1rem!important}
    
    /* Badges */
    .product-badges-row{margin-bottom:.4rem!important}
    .badge-sale,.badge-new,.badge-hit{font-size:.68rem!important;padding:.2rem .6rem!important}
    
    /* Name - clear, readable */
    .product-name{font-size:1.05rem!important;line-height:1.3!important;margin-bottom:.2rem!important;margin-top:0!important;width:100%!important}
    .product-sku{font-size:.68rem!important;margin-bottom:.5rem!important}
    
    /* Price - prominent, no background box */
    .product-price-block{background:transparent!important;border:none!important;padding:.3rem 0!important;margin-bottom:.4rem!important}
    .product-price-block [style*="background:#dc2626"]{display:none!important}
    .product-price-main{font-size:1.3rem!important}
    .product-price-old{font-size:.78rem!important}
    .product-price-save{font-size:.62rem!important;padding:.15rem .45rem!important}
    .product-price-unit{font-size:.68rem!important;margin-top:.15rem!important}
    
    /* Stock */
    .product-stock{font-size:.75rem!important;margin-bottom:.6rem!important}
    
    /* Characteristics */
    .product-chars{margin-bottom:.6rem!important}
    .chars-title{font-size:.8rem!important;margin-bottom:.4rem!important}
    .chars-row{font-size:.73rem!important}
    .chars-key{padding:.35rem .6rem .15rem!important;font-size:.67rem!important}
    .chars-val{padding:.15rem .6rem .35rem!important;font-size:.73rem!important}
    
    /* Order row — full width, stacked */
    .product-order-row{flex-direction:column!important;border-radius:12px!important;margin-bottom:.5rem!important;min-height:auto!important;overflow:hidden!important}
    .product-order-row .product-qty{border-right:none!important;border-bottom:1.5px solid var(--gray-200)!important;width:100%!important}
    .product-order-row .qty-btn{height:46px!important;flex:1!important}
    .product-order-row .qty-input{height:46px!important;flex:1!important}
    .product-total-box{padding:.6rem .8rem!important;justify-content:center!important}
    .product-total-value{font-size:1.05rem!important}
    .btn-cart-big{font-size:.85rem!important;padding:.75rem!important;border-radius:12px!important}
    .btn-quick-order{order:8!important;margin-top:.3rem!important}
    .product-cta-row{flex-direction:column!important;gap:.4rem!important}
    .product-cta-row .btn-quick-order{width:100%!important;padding:.7rem!important}
    .product-trust{order:9!important}
    .product-chars{order:10!important}
    .product-description{order:11!important}
    
    /* Details & description */
    .product-details{margin-top:.6rem!important;padding-top:.6rem!important}
    .detail-row{font-size:.73rem!important}
    .product-description{font-size:.78rem!important;margin-top:.6rem!important}
    
    /* Hide product-mobile-top if exists */
    .product-mobile-top{display:none!important;height:0!important;margin:0!important;padding:0!important}
}



/* ═══ 7b. PRODUCT PAGE ENHANCEMENTS ═════════════════════ */

/* Sale badge on photo */
.gallery-sale-badge{position:absolute;top:.6rem;left:.6rem;z-index:5;background:#dc2626;color:#fff;font-family:'Unbounded',sans-serif;font-size:.75rem;font-weight:700;padding:.35rem .8rem;border-radius:8px;box-shadow:0 2px 8px rgba(220,38,38,.3)}
.gallery-main{position:relative}

@media(max-width:760px){
    /* Breadcrumbs compact */
    .breadcrumb-bar{padding:.3rem .6rem!important}
    .breadcrumb-inner{font-size:.6rem!important;gap:.15rem!important}
    .breadcrumb-inner a,.breadcrumb-inner span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px;display:inline-block;vertical-align:middle}
    
    /* Thumbnails bigger */
    .gallery-thumb{width:56px!important;height:56px!important;border-radius:8px!important}
    
    /* Sale badge on mobile */
    .gallery-sale-badge{font-size:.7rem!important;padding:.3rem .7rem!important;top:.5rem!important;left:.5rem!important}
    
    /* Badges row - show on mobile */
    .product-badges-row{display:none!important}
    
    /* Price block - more prominent */
    .product-price-main{font-size:1.4rem!important;font-weight:800!important}
    .product-price-row{gap:.5rem!important;align-items:center!important}
    
    /* Order row more compact */
    .product-order-row{margin-top:.3rem!important}
    
    /* Hide duplicate details section (chars already show this) */
    .product-details{display:none!important}
}

/* ═══ 8. STICKY CART BAR ═════════════════════════════════ */

.mobile-sticky-cart{display:none}
@media(max-width:600px){
    .mobile-sticky-cart{display:flex;align-items:center;gap:.6rem;position:fixed;bottom:0;left:0;right:0;z-index:500;background:#fff;padding:.6rem .8rem;border-top:1.5px solid var(--gray-200);box-shadow:0 -4px 20px rgba(0,0,0,.1);transform:translateY(100%);transition:transform .3s ease}
    .mobile-sticky-cart.visible{transform:translateY(0)}
    .sticky-cart-price{display:flex;flex-direction:column;flex-shrink:0;min-width:70px}
    .sticky-cart-current{font-family:'Unbounded',sans-serif;font-size:1rem;font-weight:800;color:var(--blue-deep);line-height:1.1}
    .sticky-cart-old{font-size:.68rem;color:var(--gray-400);text-decoration:line-through}
    .sticky-cart-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:.4rem;padding:.7rem;background:var(--blue-bright);color:#fff;border:none;border-radius:10px;font-size:.85rem;font-weight:700;font-family:'Inter',sans-serif;cursor:pointer;white-space:nowrap}
    .sticky-cart-btn:hover{background:var(--blue-mid)}
    .sticky-cart-btn.added{background:var(--green)}
}


/* ═══ 9. CART PAGE ═══════════════════════════════════════ */

@media(max-width:600px){
    .cart-page{padding:1rem}
    .cart-title{font-size:1.1rem;margin-bottom:1rem}
    .cart-item{display:grid!important;grid-template-columns:60px minmax(0,1fr) auto!important;grid-template-rows:auto auto!important;gap:.3rem .5rem!important;padding:.7rem!important;position:relative!important;align-items:start!important}
    .cart-item-img{grid-row:1/3!important;grid-column:1!important;width:60px!important;height:60px!important}
    .cart-item-info{grid-row:1!important;grid-column:2/4!important;min-width:0!important;padding-right:28px!important}
    .cart-item-info .cart-item-name{font-size:.8rem!important;line-height:1.35!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
    .cart-item-info .cart-item-sku{font-size:.62rem!important}
    .cart-item-remove{position:absolute!important;top:.5rem!important;right:.5rem!important;font-size:.95rem!important}
    .cart-item-qty{grid-row:2!important;grid-column:2!important;justify-self:start!important}
    .cart-item-qty .qty-btn{width:32px!important;height:32px!important;font-size:.85rem!important}
    .cart-item-qty .qty-input{width:42px!important;height:32px!important;font-size:.78rem!important}
    .cart-item-price{grid-row:2!important;grid-column:3!important;text-align:right!important;align-self:center!important}
    .cart-item-price .cart-item-price-val{font-size:.88rem!important}
    .cart-item-price .cart-item-price-unit{font-size:.6rem!important}
    .cart-summary{padding:1rem}
    .cart-summary-total{font-size:1.1rem}
    .cart-actions{flex-direction:column}
    .cart-actions .btn-primary,.cart-actions .btn-secondary{width:100%;text-align:center;justify-content:center}
}


/* ═══ 10. CHECKOUT ═══════════════════════════════════════ */

@media(max-width:600px){
    .checkout-page{padding:1rem}
    .checkout-title{font-size:1.1rem}
    .checkout-section{padding:1rem;margin-bottom:1rem}
    .option-cards{gap:.35rem}
    .option-card{padding:.45rem .7rem;font-size:.75rem;flex:1 1 auto;min-width:0;justify-content:center;text-align:center}
    .np-dropdown{max-height:200px}
    .np-item{padding:.5rem .7rem;font-size:.75rem}
}


/* ═══ 11. CABINET ════════════════════════════════════════ */

@media(max-width:760px){
    .cab-wrap{max-width:100vw!important;overflow-x:hidden!important;padding:1rem .8rem!important}
    .cab-tabs{gap:0;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-wrap:nowrap;white-space:nowrap}
    .cab-tabs::-webkit-scrollbar{display:none}
    .cab-tab{padding:.5rem .7rem;font-size:.72rem;flex-shrink:0}
    .cab-stats{grid-template-columns:1fr 1fr;gap:.5rem}
    .cab-stat{padding:.7rem}
    .cab-stat-value{font-size:.9rem}
    .cab-cashback{flex-direction:column!important;gap:.6rem!important;padding:.8rem!important;text-align:center!important;overflow:hidden!important}
    .cab-cashback-icon{margin:0 auto!important;width:36px!important;height:36px!important}
    .cab-cashback-amount{text-align:center!important;font-size:1rem!important}
    .cab-addresses{grid-template-columns:1fr;gap:.6rem}
    .cab-order{font-size:.72rem!important}
    .cab-profile-row{flex-direction:column;gap:.2rem}
    .cab-wrap [style*="grid-template-columns: 1fr 1fr"],.cab-wrap [style*="grid-template-columns:1fr 1fr"]{grid-template-columns:1fr!important}
    .cab-wrap [style*="grid-template-columns:repeat"]{grid-template-columns:repeat(2,1fr)!important;gap:.4rem!important}
}


/* ═══ 12. PROMOTIONS PAGE ════════════════════════════════ */

@media(max-width:600px){
    .promo-banner{padding:.8rem;gap:.5rem;flex-direction:column;text-align:center}
    .promo-left{flex-direction:column;gap:.5rem}
    .promo-btn{width:100%;justify-content:center}
    .promo-strip{padding:.7rem;gap:.5rem;flex-direction:column}
    .promo-strip-btn{width:100%;justify-content:center}
    .cashback-promo{flex-direction:column!important;text-align:center!important;padding:.6rem 1rem!important;gap:.5rem!important}
    .cashback-promo>div:first-child{flex-direction:column!important;gap:.5rem!important;align-items:center!important}
    .cashback-promo>div:last-child{display:none!important}
}



/* ═══ 12b. PROMOTIONS PAGE MOBILE ════════════════════════ */

@media(max-width:760px){
    /* Hero compact */
    .promo-hero{padding:1.5rem 1rem!important}
    .promo-hero h1{font-size:1.15rem!important}
    .promo-hero p{font-size:.75rem!important}
    
    /* Grid single column */
    .promo-wrap{padding:1rem .8rem!important}
    .promo-grid{grid-template-columns:1fr!important;gap:.8rem!important}
    
    /* Card horizontal layout */
    .promo-card{flex-direction:row!important;border-radius:12px!important}
    .promo-card-banner{min-height:auto!important;width:90px!important;min-width:90px!important;padding:.8rem!important;border-radius:12px 0 0 12px!important}
    .promo-discount{font-size:1.5rem!important}
    .promo-discount span{font-size:.7rem!important}
    .promo-card-badge{display:none!important}
    
    /* Body compact - fix overflow */
    .promo-card-body{padding:.6rem .7rem!important;min-width:0!important;overflow:hidden!important}
    .promo-card-cat{font-size:.6rem!important;margin-bottom:.2rem!important}
    .promo-card h3{font-size:.75rem!important;margin-bottom:.2rem!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
    .promo-card p{font-size:.65rem!important;line-height:1.35!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
    
    /* Footer compact - fix overflow */
    .promo-card-foot{margin-top:.4rem!important;padding-top:.4rem!important;flex-wrap:nowrap!important;gap:.3rem!important}
    .promo-card-timer{font-size:.6rem!important;min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
    .promo-card-btn{padding:.25rem .5rem!important;font-size:.65rem!important;white-space:nowrap!important;flex-shrink:0!important}
    
    /* Loyalty section */
    .loyalty-section{margin-top:1.5rem!important}
    .loyalty-title{font-size:.95rem!important;margin-bottom:1rem!important}
}

/* ═══ 13. TOAST / MODALS ═════════════════════════════════ */

@media(max-width:480px){
    .toast-notification{left:1rem;right:1rem;transform:none;font-size:.78rem;padding:.6rem 1rem;border-radius:10px}
    .toast-notification.show{bottom:1rem}
    .cart-modal{padding:1.5rem;max-width:95vw}
    .cart-modal-buttons{flex-direction:column;gap:.5rem}
    .cart-modal-btn{width:100%}
}


/* ═══ 14. GLOBAL OVERFLOW FIX ════════════════════════════ */

@media(max-width:760px){html{overflow-x:clip}}
@media(max-width:760px){body{overflow-x:hidden;max-width:100vw;width:100%}}
@media(max-width:760px){
    .main-content{display:flex;flex-direction:column;overflow:visible!important}
    .main-content .catalog-title-row{order:1;margin-bottom:.5rem}
    .main-content .mobile-filter-btn{order:2;margin-top:0;margin-bottom:0}
    .main-content .sort-bar{order:3;margin-bottom:.8rem}
    .main-content .subcategories-section{order:4}
    .main-content .products-grid{order:5}
    .main-content .pagination{order:6}
    .main-content .catalog-info-bar{order:7;margin-bottom:.6rem}
    .main-content .sidebar-overlay{order:0}
    .main-content > div:last-child{order:8}
    .mobile-filter-sort-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.8rem;order:2}
    .mobile-filter-sort-row .sort-pills{display:flex;gap:.3rem;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;flex:1}
    .mobile-filter-sort-row .sort-pills::-webkit-scrollbar{display:none}
}

@media(max-width:760px){

    .main-content .catalog-title-row{order:1;margin-bottom:.5rem;margin-top:.6rem}
    .main-content .mobile-filter-btn{order:2;margin-top:0;margin-bottom:0}
    .main-content .sort-bar{order:3;margin-bottom:.8rem}
    .main-content .subcategories-section{order:4}
    .main-content .products-grid{order:5}
    .main-content .pagination{order:6}
    .main-content .pagination{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;justify-content:flex-start;padding-bottom:4px}
    .main-content .pagination::-webkit-scrollbar{display:none}
    .main-content .catalog-info-bar{order:7;margin-top:1rem;margin-bottom:.6rem}
    .main-content .sidebar-overlay{order:0}
    .main-content > div:last-child{order:8}
    .mobile-filter-sort-row{display:flex;align-items:center;gap:.5rem;order:2;background:var(--off-white);padding:.6rem .8rem;margin:0 -.8rem}
    .mobile-filter-sort-row.stuck{position:fixed;top:56px;left:0;right:0;z-index:100;background:var(--white);padding:.6rem 1rem;margin:0;box-shadow:0 2px 8px rgba(0,0,0,.1);border-bottom:1px solid var(--gray-200)}
    .mfs-placeholder{display:none}
    .mfs-placeholder.visible{display:block}
    .mfs-btn{display:flex;align-items:center;justify-content:center;gap:.4rem;flex:1;padding:.6rem .8rem;background:var(--white);color:var(--gray-800);border:1.5px solid var(--gray-200);border-radius:10px;font-size:.8rem;font-weight:600;cursor:pointer;font-family:inherit;transition:all .2s;box-shadow:0 1px 4px rgba(0,0,0,.06)}
    .mfs-btn:active{background:var(--blue-ghost);border-color:var(--blue-bright)}
    .mfs-btn:first-child{background:var(--blue-bright);color:#fff;border-color:var(--blue-bright)}
    .mfs-btn:first-child:active{background:var(--blue-mid)}
    .sort-pill{padding:.3rem .6rem;border-radius:var(--radius-sm);font-size:.68rem;font-weight:500;background:var(--white);color:var(--gray-600);border:1.5px solid var(--gray-200);white-space:nowrap;text-decoration:none;transition:all .2s}
    .sort-pill.active{font-weight:700;background:var(--blue-bright);color:#fff;border-color:var(--blue-bright)}
    .main-content .sort-bar{display:none!important}
    .sort-sheet-overlay{display:none!important;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:998}
    .sort-sheet-overlay.active{display:block!important}
    .sort-sheet{display:block!important;position:fixed;bottom:0;left:0;right:0;background:#fff;border-radius:16px 16px 0 0;z-index:999;transform:translateY(100%);transition:transform .3s ease;box-shadow:0 -8px 30px rgba(0,0,0,.15);padding-bottom:calc(1rem + env(safe-area-inset-bottom,0))}
    .sort-sheet.active{transform:translateY(0)}
    .sort-sheet-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.2rem .6rem;border-bottom:1px solid var(--gray-100)}
    .sort-sheet-title{font-family:Unbounded,sans-serif;font-size:.85rem;font-weight:700;color:var(--gray-800)}
    .sort-sheet-close{background:none;border:none;font-size:1.5rem;color:var(--gray-400);cursor:pointer;padding:0;line-height:1}
    .sort-sheet-option{display:flex;align-items:center;justify-content:space-between;padding:.85rem 1.2rem;font-size:.85rem;color:var(--gray-700);text-decoration:none;transition:background .15s;border-bottom:1px solid var(--gray-100)}
    .sort-sheet-option:last-child{border-bottom:none}
    .sort-sheet-option:hover,.sort-sheet-option:active{background:var(--blue-ghost)}
    .sort-sheet-option.active{color:var(--blue-bright);font-weight:700;background:var(--blue-ghost)}
    .mobile-filter-sort-row .sort-pills{display:flex;gap:.3rem;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;flex:1;position:relative;mask-image:linear-gradient(to right,#000 85%,transparent);-webkit-mask-image:linear-gradient(to right,#000 85%,transparent)}
    .mobile-filter-sort-row .sort-pills::-webkit-scrollbar{display:none}
}

*,*::before,*::after{box-sizing:border-box}


.section,.catalog-section{overflow:hidden}

@media(max-width:760px){
    body{overflow-x:hidden!important;width:100vw!important;max-width:100vw!important}
    .checkout-page,.cart-page,.promo-wrap{max-width:100vw!important;overflow:hidden!important;box-sizing:border-box!important}
    .checkout-section{max-width:100%!important;box-sizing:border-box!important}
    nav,.breadcrumb-bar,.hero,.features,.section,.footer{max-width:100vw!important;overflow:hidden!important}
}

/* ═══ 15. GLOBAL HELPERS ═════════════════════════════════ */

/* Overlay (hidden by default, activated by JS) */
.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:999}
.sidebar-overlay.active{display:block}

/* Filter button hidden on desktop */
.mobile-filter-btn{display:none}

/* ── Related products mobile scroll ── */
@media(max-width:900px){
    .related-grid-wrap{width:100vw!important;max-width:none!important;margin-left:calc(-50vw + 50%)!important;padding:0!important;overflow-x:scroll!important;overflow-y:visible!important;-webkit-overflow-scrolling:touch;scrollbar-width:none}
    .related-grid-wrap::-webkit-scrollbar{display:none}
    .products-grid.related-grid{
        display:flex!important;
        flex-wrap:nowrap!important;
        gap:.8rem!important;
        overflow:visible!important;
        padding:0 1rem 1rem!important;
        grid-template-columns:none!important;
        width:max-content!important
    }
    .products-grid.related-grid .product-card{
        min-width:60vw!important;
        max-width:65vw!important;
        flex:0 0 60vw!important
    }
    .products-grid.related-grid .product-card:first-child{margin-left:.5rem!important}
}

/* Hide gallery thumbs on mobile — swipe replaces them */
@media(max-width:900px){
    .gallery-thumbs{display:none!important}
}

/* Related section — less padding on mobile */
@media(max-width:900px){
    .related-inner{padding:0 .5rem!important;overflow:visible!important}
    .related-section{padding:1.2rem 0 2rem!important;overflow:visible!important}
}

@media(max-width:900px){
    
}

/* Pricing variants mobile */
@media(max-width:760px){
.pricing-variants{grid-template-columns:1fr 1fr;gap:.4rem;margin-bottom:.5rem}
.pricing-card{padding:.5rem .6rem;border-radius:8px}
.pricing-label{font-size:.65rem;margin-bottom:.2rem}
.pricing-label-opt{font-size:.65rem}
.pricing-main .price-current{font-size:1.15rem}
.pricing-main .price-per{font-size:.7rem}
.pricing-main .price-old{font-size:.7rem}
.pricing-save{font-size:.65rem;padding:.05rem .35rem;margin-top:.15rem}
.pricing-pack{font-size:.65rem;margin-top:.1rem}
}

/* ── CATEGORY BESTSELLERS (mobile) ───────── */
@media(max-width:760px){
.category-bestsellers{padding:1rem;margin-bottom:1rem;border-radius:10px}
.bestsellers-title{font-size:.78rem}
.bestsellers-grid{grid-template-columns:repeat(2,1fr)!important;gap:.6rem!important}
}

/* ── RECENTLY VIEWED (mobile) ────────────── */
@media(max-width:760px){

}

/* ── CART CROSS-SELL (mobile) ────────────── */
@media(max-width:760px){
.cart-crosssell{padding:1rem;margin-top:1.5rem}
.cart-crosssell-title{font-size:.75rem}
.cart-crosssell-grid{grid-template-columns:repeat(2,1fr);gap:.6rem}
}

/* ── PERSONALIZED RECOMMENDATIONS (mobile) ── */
@media(max-width:760px){
.personal-recs-wrap{padding:.8rem;border-radius:10px}

/* CHARS COLLAPSE MOBILE */
.chars-toggle{font-size:.75rem;padding:.45rem .8rem;width:100%;justify-content:center}

/* PREORDER MOBILE */
.btn-preorder{font-size:.72rem;padding:.5rem .8rem}
.preorder-cta{padding:.8rem}
}
/* ══════════════════════════════════════════════
   STORES PAGE — MOBILE
   ══════════════════════════════════════════════ */
@media(max-width:760px) {
    
    .stores-hero { padding: 1.5rem 1.2rem; margin-bottom: 1rem; }
    .stores-hero h1 { font-size: 1.2rem; }
    
    .stores-grid { grid-template-columns: 1fr; gap: .8rem; }
    .stores-info-row { grid-template-columns: 1fr; gap: .6rem; }
    .store-card-actions { flex-direction: column; }
    .btn-store-route, .btn-store-call, .btn-store-catalog { justify-content: center; }
}

/* ══════════════════════════════════════════════
   BUSINESS PAGE — MOBILE
   ══════════════════════════════════════════════ */
@media(max-width:760px) {
    }

@media(max-width:760px) {
    .stores-ua-map { margin-bottom: 1rem; }
}

@media(max-width:760px) {
    
    .ua-map-svg { max-height: 240px; }
}

/* ── STORES PAGE v2 MOBILE ── */
@media(max-width:760px) {
    .stores-page { padding: 0 .8rem 1.5rem; }
    .sp-header { flex-direction: column; align-items: flex-start; gap: .2rem; }
    .sp-header h1 { font-size: 1.1rem; }
    .sp-top-row { grid-template-columns: 1fr; }
    .sp-map-card { max-height: 200px; }
    .sp-info-strip { grid-template-columns: repeat(3, 1fr); gap: .3rem; }
    .sp-city-filter { gap: .3rem; }
    .sp-pill { font-size: .72rem; padding: .3rem .6rem; }
    .sp-cards-grid { grid-template-columns: 1fr; }
    .sp-card-actions { flex-direction: column; }
    .sp-btn { justify-content: center; }
}

/* ── BUSINESS PAGE v2 MOBILE ── */
@media(max-width:760px) {
    .biz-page { padding: 0 .8rem 1.5rem; }
    .bz-header { flex-direction: column; gap: .3rem; }
    .bz-header h1 { font-size: 1.1rem; }
    .bz-header-sub { text-align: left; max-width: 100%; }
    .bz-steps { grid-template-columns: 1fr; }
    .bz-tiers { grid-template-columns: 1fr; }
    .bz-tier-featured { order: -1; }
    .bz-benefits { grid-template-columns: 1fr; }
    .bz-path { flex-direction: column; align-items: center; }
    .bz-path-step { max-width: 100%; width: 100%; }
    .bz-path-line { width: 2px; height: 20px; margin: 0; }
    .bz-cta { flex-direction: column; text-align: center; }
    .bz-cta-actions { flex-direction: column; width: 100%; }
    .bz-cta-btn { justify-content: center; }
}

/* Hide filter nudge on mobile */
@media(max-width:760px){
.pf-nudge{display:none}
}
@media(max-width:760px){
.home-sections{display:flex;flex-direction:column}
#home-categories{order:1}
#home-bestsellers{order:2}
#home-new{order:3}
#home-personal{order:4}
}
@media(max-width:760px){
.related-header{padding-left:0!important;margin-left:calc(-50vw + 50% + .5rem)!important;width:100vw!important}
}
@media(max-width:760px){
.cab-order{display:grid!important;grid-template-columns:auto auto 1fr auto;grid-template-rows:auto auto;gap:.15rem .4rem!important;align-items:center;padding:.65rem .7rem!important}
.cab-order-num{grid-column:1;grid-row:1;font-size:.78rem;font-weight:700}
.cab-order-type{grid-column:2;grid-row:1;font-size:.6rem!important;padding:.1rem .35rem!important}
.cab-order-date{grid-column:3;grid-row:1;font-size:.68rem;color:var(--gray-400);text-align:right}
.cab-badge{grid-column:4;grid-row:1;font-size:.6rem!important;padding:.15rem .45rem!important}
.cab-order-sum{grid-column:1/3;grid-row:2;font-size:.82rem;font-weight:700;text-align:left!important}
.cab-order-items{grid-column:3;grid-row:2;font-size:.68rem;color:var(--gray-400);text-align:right}
.cab-order-action{grid-column:4;grid-row:2;font-size:.72rem;font-weight:600;text-align:right}
}

/* ═══ RV RECENTLY VIEWED — MOBILE ═══ */
@media(max-width:760px){
    .rv-section{overflow:visible!important;padding:.5rem 0 1rem!important}
    .rv-inner{overflow:visible!important;border:none!important;box-shadow:none!important;padding:.5rem 0!important;background:transparent!important;width:100vw!important;max-width:none!important;margin-left:calc(-50vw + 50%)!important;overflow-x:scroll!important;-webkit-overflow-scrolling:touch;scrollbar-width:none}
    .rv-inner::-webkit-scrollbar{display:none}
    .rv-title{font-size:.73rem}
    .rv-scroll{display:flex!important;flex-wrap:nowrap!important;overflow:visible!important;gap:.5rem;padding:0 1rem .4rem!important;width:max-content!important}
    .rv-card{flex:0 0 38vw;padding:.45rem;border-radius:8px;flex-shrink:0;border:1.5px solid var(--gray-200)}
    .rv-card-img{border-radius:6px}
    .rv-card-name{font-size:.62rem;min-height:1.6em}
    .rv-card-price{font-size:.72rem}
}

/* ═══ CHECKOUT — MOBILE COMPACT ═══ */
@media(max-width:760px){
    .checkout-page{padding:.6rem .5rem!important}
    .checkout-title{font-size:1.05rem!important;margin-bottom:.8rem!important}
    .checkout-section{padding:.8rem .7rem!important;margin-bottom:.8rem!important;border-radius:10px!important}
    .checkout-section-title{font-size:.8rem!important;margin-bottom:.6rem!important;padding-bottom:.35rem!important}
    .form-group{margin-bottom:.6rem!important}
    .form-label{font-size:.72rem!important;margin-bottom:.25rem!important}
    .form-input{padding:.5rem .7rem!important;font-size:.8rem!important;border-radius:8px!important}
    .form-textarea{min-height:60px!important}
    .form-row{gap:.5rem!important}
    .option-cards{gap:.35rem!important}
    .option-card{padding:.4rem .7rem!important;font-size:.75rem!important;border-radius:8px!important}
    .option-card__dot{width:14px!important;height:14px!important}
    .option-card.active .option-card__dot::after{top:2.5px!important;left:2.5px!important;width:5px!important;height:5px!important}
    .saved-selector{padding:.6rem!important;margin-top:.5rem!important;margin-bottom:.6rem!important}
    .saved-selector>label{font-size:.65rem!important;margin-bottom:.35rem!important}
    .saved-cards{gap:.35rem!important}
    .saved-card{padding:.35rem .55rem!important;font-size:.7rem!important}
    .cart-summary{padding:1rem!important;margin-bottom:.8rem!important}
    .cart-summary [style*="font-size:1.3rem"]{font-size:1.1rem!important}
    .cart-cashback{padding:.8rem!important;margin-bottom:.8rem!important}
    #storeOptions .option-card{padding:.5rem .6rem!important}
    #storeOptions .option-card strong{font-size:.75rem!important}
    #storeOptions .option-card span[style*="font-size:.72rem"]{font-size:.65rem!important}
    #submitBtn{padding:.75rem!important;font-size:.88rem!important}
}
