/* RED-20 Storefront UI 2026
   Built as a visual layer over the original Classic theme.
   Cart, checkout, product, auth and database logic remain in the original PHP/JS. */

:root{
  --r20-orange:#ff5a00;
  --r20-orange-dark:#e84f00;
  --r20-orange-soft:#fff3ec;
  --r20-ink:#20242a;
  --r20-muted:#6b7280;
  --r20-line:#e8ebef;
  --r20-bg:#f5f6f8;
  --r20-card:#fff;
  --r20-success:#16864b;
  --r20-radius:14px;
  --r20-shadow:0 5px 22px rgba(25,30,38,.07);
}

html{scroll-behavior:smooth}
body{background:var(--r20-bg)!important;color:var(--r20-ink);font-family:Poppins,Arial,sans-serif!important;padding-bottom:0}
a{transition:color .18s ease,background .18s ease,border-color .18s ease,transform .18s ease}
.main-content{max-width:1480px!important;width:100%!important;margin-left:auto!important;margin-right:auto!important;padding-left:18px!important;padding-right:18px!important}

/* Header */
#header{background:#fff!important;box-shadow:0 2px 15px rgba(0,0,0,.055);position:sticky;top:0;z-index:1030}
#header .topbar{min-height:31px!important;border-bottom:1px solid var(--r20-line);background:#fff!important;font-size:11px}
#header .navbar{min-height:76px;padding-top:9px!important;padding-bottom:9px!important;gap:16px}
#header .navbar-brand{margin-right:16px!important}
#header .brand-logo-link{max-height:56px!important;max-width:150px!important;object-fit:contain}
.navbar-top-search-box{border:2px solid var(--r20-orange)!important;border-radius:13px!important;overflow:hidden!important;background:#fff;box-shadow:none!important;min-height:47px}
.navbar-top-search-box .select2-container,.mobile-search .select2-container{width:100%!important}
.navbar-top-search-box .select2-selection,.mobile-search .select2-selection{border:0!important;min-height:43px!important;border-radius:0!important;display:flex!important;align-items:center!important}
.navbar-top-search-box .select2-selection__rendered,.mobile-search .select2-selection__rendered{padding-left:14px!important;color:#555!important;font-size:13px}
.navbar-top-search-box .select2-selection__arrow,.mobile-search .select2-selection__arrow{top:9px!important}
#header .nav-link,#header .link-color{color:var(--r20-ink)!important;font-weight:600}
#header .nav-link:hover,#header .link-color:hover{color:var(--r20-orange)!important}

/* Global cards / controls */
.card,.content-area,.filter-section,.product-page-content,.address-card,.order-card{border:1px solid var(--r20-line)!important;border-radius:var(--r20-radius)!important;box-shadow:0 3px 18px rgba(20,25,35,.045)!important;background:#fff!important}
.form-control,.form-input,.custom-select,.select2-selection{border-radius:10px!important;border-color:#dfe3e8!important;min-height:42px}
.form-control:focus,.form-input:focus{border-color:var(--r20-orange)!important;box-shadow:0 0 0 3px rgba(255,90,0,.10)!important}
.button,.btn,.buttons,.add-to-cart{border-radius:10px!important}
.btn-primary,.button-warning,.button-success,.buttons.btn-6-3{background:var(--r20-orange)!important;border-color:var(--r20-orange)!important;color:#fff!important}
.btn-primary:hover,.button-warning:hover,.button-success:hover,.buttons.btn-6-3:hover{background:var(--r20-orange-dark)!important;border-color:var(--r20-orange-dark)!important}
.pagination .page-link{border-radius:9px!important;margin:0 3px;color:var(--r20-ink)}
.pagination .active .page-link{background:var(--r20-orange)!important;border-color:var(--r20-orange)!important}
.table{background:#fff;border-radius:12px;overflow:hidden}
.table thead th{background:#fafafa;border-bottom:1px solid var(--r20-line)!important;font-size:12px;white-space:nowrap}

/* Homepage banner */
.banner-swiper{border-radius:18px!important;overflow:hidden;background:#fff;box-shadow:var(--r20-shadow)}
.banner-swiper img{width:100%;aspect-ratio:3.4/1;object-fit:cover;display:block}
.banner-swiper .swiper-button-next,.banner-swiper .swiper-button-prev{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.92);box-shadow:0 3px 12px rgba(0,0,0,.1)}

/* Homepage categories */
.category-section{background:#fff!important;border:1px solid var(--r20-line);border-radius:16px!important;padding:14px!important;margin-top:14px;box-shadow:none!important;overflow:hidden}
.category-section-title h3{font-size:21px!important;font-weight:750!important;text-align:left;margin:0 0 10px!important;color:var(--r20-ink)!important}
.category-section ul.d-flex{display:grid!important;grid-template-columns:repeat(8,minmax(0,1fr));width:100%;gap:10px!important;margin:0;padding:0!important}
.category-section ul.d-flex li{min-width:0;background:#fff;border:1px solid var(--r20-line);border-radius:13px;padding:9px 5px}
.category-section ul.d-flex li img{height:68px!important;width:100%;object-fit:contain}
.category-section ul.d-flex li h4{font-size:11px!important;line-height:1.25;margin:5px 0 0;font-weight:650;color:var(--r20-ink)}

/* Brands */
.product-section{border:1px solid var(--r20-line)!important;border-radius:16px!important;box-shadow:none!important;background:#fff!important;padding-left:12px!important;padding-right:12px!important}
.product-section h3,.featured-section-title .section-title{font-size:20px!important;font-weight:750!important;letter-spacing:-.2px;color:var(--r20-ink)!important}
.featured-section-view-more,.red20-view-all{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 12px;border-radius:9px;background:var(--r20-orange-soft);color:var(--r20-orange)!important;font-size:11px;font-weight:750;text-decoration:none!important;white-space:nowrap}
.brand_image{height:74px!important;background:#fafafa;border:1px solid var(--r20-line);border-radius:12px;display:flex;align-items:center;justify-content:center;padding:8px}
.brand_img{max-height:58px!important;max-width:100%;object-fit:contain}

/* Explore More */
.red20-explore-section{margin:14px 0;background:var(--explore-bg,#fff7f2);border:1px solid rgba(255,90,0,.16);border-radius:18px;padding:15px;overflow:hidden}
.red20-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.red20-section-head h2{margin:0;font-size:22px;line-height:1.1;color:var(--r20-ink);font-weight:700}
.red20-section-head h2 strong{color:var(--r20-orange)}
.red20-section-head p{font-size:11px;color:var(--r20-muted);margin:4px 0 0}
.red20-explore-scroll{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:10px}
.red20-explore-card{min-width:0;background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:14px;padding:8px;text-align:center;text-decoration:none!important;box-shadow:0 3px 10px rgba(30,30,30,.035)}
.red20-explore-card:hover{transform:translateY(-2px);border-color:rgba(255,90,0,.35)}
.red20-explore-image{display:flex;height:86px;align-items:center;justify-content:center;border-radius:10px;background:#fafafa;overflow:hidden}
.red20-explore-image img{max-width:100%;max-height:100%;object-fit:contain}
.red20-explore-name{display:block;margin-top:7px;font-size:10.5px;font-weight:700;line-height:1.2;color:var(--r20-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* UNIFIED HOMEPAGE PRODUCT GRID: disables product carousel presentation only */
.product-section .product-image-swiper{overflow:visible!important}
.product-section .product-image-swiper>.swiper-wrapper{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:10px!important;transform:none!important;height:auto!important}
.product-section .product-image-swiper>.swiper-wrapper>.swiper-slide{width:auto!important;margin:0!important;height:auto!important}
.product-section .product-image-swiper-next,.product-section .product-image-swiper-prev{display:none!important}

/* Product card shared */
.product-grid{height:100%;background:#fff!important;border:1px solid var(--r20-line)!important;border-radius:13px!important;overflow:hidden!important;box-shadow:none!important;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.product-grid:hover{transform:translateY(-2px);border-color:#dfe2e7!important;box-shadow:0 7px 20px rgba(25,30,38,.07)!important}
.product-grid .product-image{height:190px!important;background:#fafafa!important;padding:9px!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden}
.product-grid .product-image-container{height:100%!important;width:100%!important;display:flex!important;align-items:center!important;justify-content:center!important}
.product-grid .product-image img,.product-grid img.pic-1{max-height:100%!important;max-width:100%!important;width:auto!important;object-fit:contain!important}
.product-grid .product-content{padding:9px 10px 11px!important;text-align:left!important;background:#fff!important}
.product-grid .title,.product-grid .title a,.product-grid .title_wrap{font-size:11.5px!important;line-height:1.35!important;font-weight:550!important;color:var(--r20-ink)!important;height:31px!important;min-height:31px!important;overflow:hidden!important;margin:0!important;text-decoration:none!important;display:-webkit-box!important;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.product-grid #price,.product-grid .price,.product-grid .product-price{font-size:15px!important;font-weight:750!important;color:var(--r20-ink)!important}
.product-grid .striped-price,.product-grid del,.product-grid s{font-size:9px!important;color:#9aa0aa!important}
.product-grid .product-new-label,.product-grid .product-discount-label{background:#e9362b!important;color:#fff!important;border-radius:7px!important;font-size:9px!important;padding:4px 6px!important;left:7px!important;top:7px!important}
.product-grid .social{right:6px!important;top:6px!important}
.product-grid .social li a{width:29px!important;height:29px!important;line-height:29px!important;border-radius:50%!important;background:#fff!important;border:1px solid var(--r20-line)!important;color:#444!important;font-size:11px!important}
.product-grid .product-rating-small{margin:3px 0!important;padding:0 7px!important;min-height:12px}
.product-grid .add-to-cart{width:100%!important;display:flex!important;align-items:center!important;justify-content:center!important;min-height:32px!important;padding:5px 7px!important;margin-top:5px!important;border:1px solid var(--r20-orange)!important;background:var(--r20-orange-soft)!important;color:var(--r20-orange)!important;font-size:10px!important;font-weight:750!important;text-decoration:none!important}
.product-grid .add-to-cart:hover{background:var(--r20-orange)!important;color:#fff!important}

/* Products / category listing */
.filter-section{padding:12px!important}
.filter-section .sort-by{background:#fff;border-bottom:1px solid var(--r20-line)}
.grid-view{border:1px solid var(--r20-line);width:34px;height:34px;border-radius:9px!important;display:inline-flex;align-items:center;justify-content:center;margin-left:5px;color:var(--r20-ink)}
#product_list_view_btn{display:none!important} /* App UI uses one consistent grid */
.red20-product-cell{padding-left:5px!important;padding-right:5px!important;margin-bottom:10px!important;flex:0 0 16.666667%!important;max-width:16.666667%!important}
#product-filters,.filter_attributes{border-radius:14px!important;background:#fff!important}
.category-image{border:1px solid var(--r20-line);border-radius:12px;overflow:hidden;background:#fafafa;margin:auto}

/* Product detail */
.product-page-content{padding:14px!important}
.product-page-content .product-title{font-weight:750!important;color:var(--r20-ink)!important;line-height:1.25}
.product-page-content .gallery-top,.product-page-content .product-preview-image-section-md{border-radius:14px;overflow:hidden;background:#fff}
.product-page-details .price{font-size:24px!important;font-weight:800;color:var(--r20-ink)}
.product-page-details hr{border-color:var(--r20-line)}
.num-in{border-radius:10px!important;overflow:hidden;border:1px solid var(--r20-line)}

/* Cart / checkout */
.cart-product,.shopping-cart-sm,.checkout-page .card{border-radius:14px!important}
.cart-product{border-bottom:1px solid var(--r20-line)!important;padding-top:12px!important;padding-bottom:12px!important}
.cart-product .product-image img{border-radius:10px;object-fit:contain;background:#fafafa}
.cart-product-title{font-weight:650;color:var(--r20-ink)}
.checkout-page .summary,.cart-summary,.order-summary{position:sticky;top:100px}

/* Account / order / forms */
.my-account-sidebar,.user-sidebar{border-radius:14px!important;overflow:hidden;background:#fff;border:1px solid var(--r20-line)}
.my-account-sidebar a,.user-sidebar a{border-bottom:1px solid #f1f2f4!important}
.my-account-sidebar a:hover,.user-sidebar a:hover{background:var(--r20-orange-soft)!important;color:var(--r20-orange)!important}

/* Modal polish */
.iziModal{border-radius:16px!important;overflow:hidden!important}
.iziModal-header{background:var(--r20-orange)!important}

/* Mobile app tabbar */
.red20-mobile-tabbar{display:none}

@media (max-width:1199px){
  .product-section .product-image-swiper>.swiper-wrapper{grid-template-columns:repeat(5,minmax(0,1fr))!important}
  .red20-product-cell{flex-basis:20%!important;max-width:20%!important}
  .category-section ul.d-flex,.red20-explore-scroll{grid-template-columns:repeat(6,minmax(0,1fr))}
}

@media (max-width:767.98px){
  body{padding-bottom:67px!important;background:#f5f6f8!important}
  .main-content{padding-left:7px!important;padding-right:7px!important}
  #header{position:sticky;top:0}
  #header .topbar{display:none!important}
  #header .navbar{min-height:52px!important;padding:6px 8px!important;display:grid!important;grid-template-columns:34px 86px 34px;justify-content:space-between!important;align-items:center!important}
  #header .navbar-toggler{padding:3px!important;width:32px!important;height:32px!important}
  #header .navbar-brand{margin:0!important;text-align:center!important}
  #header .brand-logo-link{max-height:35px!important;max-width:86px!important}
  #header .shopping-cart-sidebar-btn{display:flex!important;width:32px;height:32px;align-items:center;justify-content:center;font-size:18px}
  #header .container.d-lg-none{grid-column:1/-1;padding:0!important;margin-top:4px}
  .mobile-search{margin:0!important}
  .mobile-search .select2-selection{border:1.5px solid var(--r20-orange)!important;border-radius:10px!important;min-height:38px!important}

  .banner-swiper{border-radius:10px!important;margin-top:7px}
  .banner-swiper img{aspect-ratio:2.25/1;min-height:116px}
  .banner-swiper .swiper-button-next,.banner-swiper .swiper-button-prev{display:none!important}

  .category-section{margin-top:7px!important;padding:8px 5px!important;border-radius:12px!important}
  .category-section-title h3{font-size:15px!important;margin:0 4px 7px!important}
  .category-section ul.d-flex{display:flex!important;overflow-x:auto!important;gap:6px!important;scrollbar-width:none;padding-bottom:3px!important;justify-content:flex-start!important}
  .category-section ul.d-flex::-webkit-scrollbar,.red20-explore-scroll::-webkit-scrollbar{display:none}
  .category-section ul.d-flex li{flex:0 0 68px!important;width:68px!important;padding:5px 3px!important;border-radius:9px!important}
  .category-section ul.d-flex li img{height:45px!important}
  .category-section ul.d-flex li h4{font-size:8px!important;margin-top:3px!important}

  .product-section{padding:7px 5px!important;margin-top:7px!important;margin-bottom:7px!important;border-radius:12px!important}
  .product-section .my-4,.product-section .my-3{margin-top:7px!important;margin-bottom:7px!important}
  .product-section h3,.featured-section-title .section-title{font-size:14px!important;margin-bottom:1px!important}
  .featured-section-title{margin:5px 2px!important}
  .featured-section-title .title-sm{font-size:8px!important;color:var(--r20-muted)}
  .featured-section-title hr{margin:7px 0!important}
  .featured-section-view-more,.red20-view-all{min-height:27px;padding:0 8px;font-size:8px;border-radius:7px}

  .red20-explore-section{margin:7px 0;padding:8px 6px;border-radius:12px}
  .red20-section-head{margin-bottom:7px;padding:0 2px}
  .red20-section-head h2{font-size:15px}
  .red20-section-head p{font-size:8px;margin-top:1px}
  .red20-explore-scroll{display:flex;overflow-x:auto;gap:6px;padding-bottom:2px}
  .red20-explore-card{flex:0 0 72px;width:72px;padding:5px;border-radius:10px}
  .red20-explore-image{height:52px;border-radius:7px}
  .red20-explore-name{font-size:7.5px;margin-top:4px}

  /* Four product cards per row, like a compact shopping app. */
  .product-section .product-image-swiper>.swiper-wrapper{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:4px!important}
  .red20-product-cell{flex:0 0 25%!important;max-width:25%!important;padding-left:2px!important;padding-right:2px!important;margin-bottom:4px!important}
  /* Any other customer page that renders the original .product-grid also becomes four-up on mobile. */
  .row > [class*="col-"]:has(> .product-grid){flex:0 0 25%!important;max-width:25%!important;padding-left:2px!important;padding-right:2px!important;margin-bottom:4px!important}
  .filter-section .row{margin-left:-2px!important;margin-right:-2px!important}

  .product-grid{border-radius:8px!important}
  .product-grid:hover{transform:none;box-shadow:none!important}
  .product-grid .product-image{height:78px!important;padding:3px!important}
  .product-grid .product-content{padding:4px 4px 5px!important}
  .product-grid .title,.product-grid .title a,.product-grid .title_wrap{font-size:7.4px!important;line-height:1.28!important;height:19px!important;min-height:19px!important;font-weight:550!important}
  .product-grid #price,.product-grid .price,.product-grid .product-price,.product-grid [id="price"]{font-size:9.5px!important;line-height:1.1!important}
  .product-grid .striped-price,.product-grid del,.product-grid s{font-size:6.5px!important}
  .product-grid .product-new-label,.product-grid .product-discount-label{font-size:6px!important;padding:2px 3px!important;border-radius:4px!important;left:3px!important;top:3px!important}
  .product-grid .social{right:2px!important;top:2px!important}
  .product-grid .social li:not(:first-child){display:none!important}
  .product-grid .social li a{width:20px!important;height:20px!important;line-height:20px!important;font-size:7px!important}
  .product-grid .product-rating-small{display:none!important}
  .product-grid .add-to-cart{min-height:23px!important;padding:2px!important;font-size:0!important;margin-top:3px!important;border-radius:6px!important}
  .product-grid .add-to-cart i{font-size:9px!important;margin:0!important}
  .product-grid .add-to-cart::after{content:'+';font-size:10px;font-weight:900;margin-left:2px}
  .product-grid p.mb-2.mt-2{margin:3px 0!important;line-height:1!important;white-space:nowrap}

  .filter-section{padding:6px!important;border-radius:10px!important}
  .filter-section .sort-by{padding:5px 0!important}
  .filter-section .dropdown-label,.filter-section #product_grid_view_btn{display:none!important}
  .filter-section .dropdown-toggle{font-size:9px!important;min-height:30px!important;padding:4px 7px!important}
  .filter-section .ele-wrapper .form-group{max-width:100%!important;flex:0 0 100%!important;padding-right:0!important;margin:0!important}
  #product_sort_by{height:34px!important;min-height:34px!important;font-size:9px!important}
  .category-section .row>.col-md-2{flex:0 0 25%;max-width:25%;padding:3px}
  .category-section .category-image{width:100%!important}

  /* Product page turns into app-style stacked view. */
  .product-page-content{border:0!important;border-radius:0!important;padding:7px!important;box-shadow:none!important}
  .product-page-content .product-title{font-size:17px!important}
  .product-page-details .price{font-size:19px!important}
  .product-page-details .buttons{width:100%;min-height:40px;margin:3px 0!important}

  /* Cart / checkout become touch-friendly cards. */
  .cart-product{border:1px solid var(--r20-line)!important;border-radius:10px!important;margin-bottom:6px!important;padding:7px!important}
  .cart-product-title{font-size:10px!important}
  .checkout-page .summary,.cart-summary,.order-summary{position:static!important}
  .table-responsive{border-radius:10px}

  /* Fixed bottom app navigation */
  .red20-mobile-tabbar{position:fixed;display:grid;grid-template-columns:repeat(5,1fr);left:0;right:0;bottom:0;height:62px;padding-bottom:env(safe-area-inset-bottom);background:rgba(255,255,255,.98);border-top:1px solid #e3e6ea;box-shadow:0 -4px 18px rgba(0,0,0,.07);z-index:1090}
  .red20-mobile-tabbar a{display:flex;flex-direction:column;align-items:center;justify-content:center;text-decoration:none!important;color:#717782;font-size:7.5px;font-weight:600;gap:2px;min-width:0}
  .red20-mobile-tabbar i{font-size:17px}
  .red20-mobile-tabbar a.active,.red20-mobile-tabbar a:hover{color:var(--r20-orange)!important}

  .whatsapp-icon{bottom:74px!important;right:9px!important}
  #chat-button{bottom:74px!important}
}

/* Extremely small phones: still honor requested four columns, but tighten images/type. */
@media (max-width:360px){
  .product-grid .product-image{height:70px!important}
  .product-grid .title,.product-grid .title a,.product-grid .title_wrap{font-size:6.8px!important}
  .product-grid #price,.product-grid .price,.product-grid .product-price,.product-grid [id="price"]{font-size:8.8px!important}
}

/* =========================================================
   RED-20 V2 — ONE-ROW HORIZONTAL HOMEPAGE SECTIONS
   Keeps sections.row_order + original cart/product logic.
   Every featured category is one non-wrapping row.
   ========================================================= */
.red20-horizontal-section{position:relative;overflow:hidden!important}
.red20-horizontal-section .featured-section-title .align-items-center{gap:10px}
.red20-section-actions{display:flex!important;align-items:center;justify-content:flex-end;gap:8px;margin-left:auto!important}
.red20-scroll-buttons{display:flex;align-items:center;gap:5px}
.red20-scroll-arrow{width:32px;height:32px;border:1px solid var(--r20-line);border-radius:50%;background:#fff;color:var(--r20-ink);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.04);transition:.18s ease}
.red20-scroll-arrow:hover{background:var(--r20-orange);border-color:var(--r20-orange);color:#fff}
.red20-scroll-arrow i{font-size:11px}

.red20-products-scroll{width:100%;overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch;scroll-behavior:smooth;scroll-snap-type:x proximity;overscroll-behavior-inline:contain;padding:2px 2px 10px;scrollbar-width:none;touch-action:pan-x pan-y}
.red20-products-scroll::-webkit-scrollbar{display:none}
.red20-products-track{display:flex!important;flex-wrap:nowrap!important;align-items:stretch;gap:10px!important;width:100%;min-width:100%;transform:none!important;height:auto!important}
.red20-product-slide{flex:0 0 210px!important;width:210px!important;max-width:210px!important;height:auto!important;margin:0!important;scroll-snap-align:start}
.red20-product-slide .product-grid{height:100%!important}

/* A subtle fade at the right edge hints that more products can be scrolled. */
.red20-horizontal-section::after{content:"";position:absolute;right:0;top:92px;bottom:10px;width:24px;pointer-events:none;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.88));z-index:2}

@media (max-width:1199px) and (min-width:768px){
  .red20-product-slide{flex-basis:190px!important;width:190px!important;max-width:190px!important}
}

@media (max-width:767.98px){
  .red20-horizontal-section{padding-left:5px!important;padding-right:5px!important}
  .red20-horizontal-section .featured-section-title{margin:4px 1px 5px!important}
  .red20-horizontal-section .featured-section-title .row{margin:0!important}
  .red20-horizontal-section .featured-section-title .align-items-center{padding:0!important;display:flex!important;flex-wrap:nowrap!important;gap:6px}
  .red20-horizontal-section .featured-section-title .col-md-6{padding:0!important;flex:1 1 auto!important;width:auto!important;min-width:0}
  .red20-section-actions{padding:0!important;flex:0 0 auto!important;width:auto!important;margin-top:0!important;gap:5px!important}
  .red20-scroll-buttons{display:none!important} /* finger swipe is the primary mobile control */
  .red20-horizontal-section .featured-section-view-more{min-height:25px!important;padding:0 7px!important;font-size:7.5px!important}
  .red20-horizontal-section .featured-section-title hr{margin:5px 0 4px!important}

  .red20-products-scroll{margin-left:0!important;margin-right:-5px!important;padding:1px 5px 7px 0!important;scroll-padding-left:0;scroll-snap-type:x mandatory}
  .red20-products-track{gap:7px!important;padding-right:16px!important}

  /* App-style discovery: 2 complete cards + about half of the next card. */
  .red20-product-slide{flex:0 0 38.5%!important;width:38.5%!important;max-width:38.5%!important;scroll-snap-align:start}

  /* Homepage horizontal cards are intentionally larger than 4-up listing cards. */
  .red20-horizontal-section .red20-product-slide .product-grid{border-radius:10px!important}
  .red20-horizontal-section .red20-product-slide .product-grid .product-image{height:126px!important;padding:6px!important}
  .red20-horizontal-section .red20-product-slide .product-grid .product-content{padding:6px 6px 7px!important}
  .red20-horizontal-section .red20-product-slide .product-grid .title,
  .red20-horizontal-section .red20-product-slide .product-grid .title a,
  .red20-horizontal-section .red20-product-slide .product-grid .title_wrap{font-size:10px!important;line-height:1.3!important;height:27px!important;min-height:27px!important;font-weight:600!important}
  .red20-horizontal-section .red20-product-slide .product-grid #price,
  .red20-horizontal-section .red20-product-slide .product-grid .price,
  .red20-horizontal-section .red20-product-slide .product-grid .product-price,
  .red20-horizontal-section .red20-product-slide .product-grid [id="price"]{font-size:12.5px!important;line-height:1.15!important}
  .red20-horizontal-section .red20-product-slide .product-grid .striped-price,
  .red20-horizontal-section .red20-product-slide .product-grid del,
  .red20-horizontal-section .red20-product-slide .product-grid s{font-size:8px!important}
  .red20-horizontal-section .red20-product-slide .product-grid .product-new-label,
  .red20-horizontal-section .red20-product-slide .product-grid .product-discount-label{font-size:7px!important;padding:3px 4px!important;border-radius:5px!important;left:4px!important;top:4px!important}
  .red20-horizontal-section .red20-product-slide .product-grid .social{right:3px!important;top:3px!important}
  .red20-horizontal-section .red20-product-slide .product-grid .social li:not(:first-child){display:none!important}
  .red20-horizontal-section .red20-product-slide .product-grid .social li a{width:23px!important;height:23px!important;line-height:23px!important;font-size:8px!important}
  .red20-horizontal-section .red20-product-slide .product-grid .product-rating-small{display:none!important}
  .red20-horizontal-section .red20-product-slide .product-grid p.mb-2.mt-2{margin:4px 0!important}
  .red20-horizontal-section .red20-product-slide .product-grid .add-to-cart{min-height:28px!important;padding:3px 5px!important;margin-top:4px!important;border-radius:7px!important;font-size:8px!important;line-height:1!important;white-space:nowrap!important}
  .red20-horizontal-section .red20-product-slide .product-grid .add-to-cart i{font-size:9px!important;margin-right:3px!important}
  .red20-horizontal-section .red20-product-slide .product-grid .add-to-cart::after{content:none!important}

  .red20-horizontal-section::after{top:58px;bottom:7px;width:16px}
}

@media (max-width:360px){
  .red20-product-slide{flex-basis:39%!important;width:39%!important;max-width:39%!important}
  .red20-horizontal-section .red20-product-slide .product-grid .product-image{height:112px!important}
  .red20-horizontal-section .red20-product-slide .product-grid .title,
  .red20-horizontal-section .red20-product-slide .product-grid .title a,
  .red20-horizontal-section .red20-product-slide .product-grid .title_wrap{font-size:9px!important}
}