/* RED20-V11-IMAGE-CART-CHECKOUT-ACCOUNT-20260902
   Presentation-only patch. Product/cart/checkout/account business logic remains in the original PHP/JS.
*/
:root{--r20:#ff5a00;--r20-dark:#20242a;--r20-muted:#6b7280;--r20-line:#e8eaee;--r20-soft:#f7f8fa;--r20-green:#169b62}

/* ---------- CATEGORY IMAGES: use direct processed URL and fit the frame ---------- */
html body .red20-all-category-card{background:#fff!important;border:1px solid var(--r20-line)!important;border-radius:16px!important;padding:8px!important;box-shadow:0 3px 12px rgba(25,30,36,.04)!important}
html body .red20-all-category-media{display:flex!important;align-items:center!important;justify-content:center!important;width:100%!important;aspect-ratio:1/1!important;background:#fff!important;border-radius:13px!important;padding:7px!important;overflow:hidden!important}
html body .red20-all-category-media img{display:block!important;width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;object-position:center!important;padding:0!important;margin:0!important}
html body .red20-all-category-name{font-weight:800!important;color:var(--r20-dark)!important;text-align:center!important;line-height:1.25!important;margin-top:4px!important}

html body .red20-category-hero{background:#fff!important;border:1px solid var(--r20-line)!important;border-radius:20px!important;overflow:hidden!important;box-shadow:0 5px 18px rgba(25,30,36,.04)!important}
html body .red20-category-hero-media{display:flex!important;align-items:center!important;justify-content:center!important;background:#fff!important;padding:10px!important;overflow:hidden!important}
html body .red20-category-hero-media img{display:block!important;width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;object-position:center!important;border-radius:14px!important}

html body .listing-page .red20-subcategory-grid{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:14px!important;margin:0!important}
html body .listing-page .red20-subcategory-grid>[class*="col-"]{width:auto!important;max-width:none!important;flex:none!important;padding:0!important;margin:0!important}
html body .listing-page .red20-subcategory-grid .category-image{width:100%!important;max-width:none!important;border:1px solid var(--r20-line)!important;border-radius:16px!important;background:#fff!important;overflow:hidden!important;box-shadow:0 3px 12px rgba(25,30,36,.04)!important}
html body .listing-page .red20-subcategory-grid .category-image>a{display:flex!important;align-items:center!important;justify-content:center!important;height:155px!important;padding:8px!important;background:#fff!important;overflow:hidden!important}
html body .listing-page .red20-subcategory-grid .category-image img{display:block!important;width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;object-position:center!important;padding:0!important;margin:0!important}
html body .listing-page .red20-subcategory-grid .social{display:flex!important;align-items:center!important;justify-content:center!important;min-height:46px!important;padding:8px!important;background:#fff!important}
html body .listing-page .red20-subcategory-grid .social span{font-size:12px!important;font-weight:800!important;line-height:1.25!important;color:var(--r20-dark)!important;text-align:center!important}

/* ---------- CART: simple desktop card + mobile app-style product cards ---------- */
html body .red20-cart-breadcrumb,html body .red20-checkout-breadcrumb{background:#fff!important;border-bottom:1px solid var(--r20-line)!important;padding:12px 0!important}
html body .red20-cart-breadcrumb .responsive-breadcrumb,html body .red20-checkout-breadcrumb .responsive-breadcrumb{display:flex!important;align-items:center!important;justify-content:space-between!important;min-height:auto!important}
html body .red20-cart-breadcrumb h2,html body .red20-checkout-breadcrumb h2{font-size:24px!important;margin:0!important;color:var(--r20-dark)!important}
html body .red20-cart-breadcrumb .breadcrumb,html body .red20-checkout-breadcrumb .breadcrumb{margin:0!important;background:transparent!important;padding:0!important}

html body .red20-cart-page{background:var(--r20-soft)!important;padding:20px 0 42px!important}
html body .red20-cart-page>.main-content>.row{align-items:flex-start!important}
html body .red20-cart-page .col-xl-8{background:#fff!important;border:1px solid var(--r20-line)!important;border-radius:18px!important;padding:14px 16px!important;margin-top:0!important;box-shadow:0 5px 20px rgba(25,30,36,.04)!important}
html body .red20-cart-page .col-xl-4{margin-top:0!important;padding-left:18px!important}
html body .red20-cart-page .cart-product-summary{position:sticky!important;top:104px!important;background:#fff!important;border:1px solid var(--r20-line)!important;border-radius:18px!important;padding:20px!important;box-shadow:0 5px 20px rgba(25,30,36,.05)!important}
html body .red20-cart-page .cart-product-summary h3{font-size:20px!important;font-weight:800!important;color:var(--r20-dark)!important;margin-bottom:12px!important}
html body .red20-cart-page .table-cart-product{width:100%!important;margin:0!important;overflow:visible!important}
html body .red20-cart-page .table-cart-product thead th{font-size:11px!important;text-transform:uppercase!important;letter-spacing:.02em!important;border-top:0!important;border-bottom:1px solid var(--r20-line)!important;padding:10px 8px!important}
html body .red20-cart-page .cart-product-desc-list td{vertical-align:middle!important;border-top:1px solid #f0f1f3!important;padding:12px 8px!important}
html body .red20-cart-page .widget-image img,html body .red20-cart-page .cart-product-image img{width:82px!important;height:82px!important;object-fit:contain!important;border:1px solid #f0f1f3!important;border-radius:12px!important;background:#fff!important;padding:4px!important}
html body .red20-cart-page .cart-product-title{font-size:13px!important;line-height:1.35!important;margin:0 0 6px!important}
html body .red20-cart-page .cart-product-title a{color:var(--r20-dark)!important;font-weight:700!important}
html body .red20-cart-page .button{border-radius:10px!important;box-shadow:none!important}
html body .red20-cart-page #checkout .block{width:100%!important;min-height:48px!important;background:var(--r20)!important;color:#fff!important;border:0!important;border-radius:12px!important;font-weight:900!important;font-size:15px!important}
html body .red20-cart-page .total-price td{font-size:18px!important;font-weight:900!important;color:var(--r20-dark)!important;border-top:1px solid var(--r20-line)!important;padding:14px 0!important}

/* ---------- CHECKOUT: clear two-step feel, sticky summary ---------- */
html body .red20-checkout-page{background:var(--r20-soft)!important;padding:20px 0 48px!important}
html body .red20-checkout-page>.main-content>form>.row{align-items:flex-start!important}
html body .red20-checkout-page .col-xl-8{background:#fff!important;border:1px solid var(--r20-line)!important;border-radius:18px!important;padding:22px!important;margin-top:0!important;box-shadow:0 5px 20px rgba(25,30,36,.04)!important}
html body .red20-checkout-page .col-xl-4{margin-top:0!important;padding-left:18px!important}
html body .red20-checkout-page .checkout-form-title{font-size:22px!important;font-weight:900!important;color:var(--r20-dark)!important;margin:0 0 16px!important}
html body .red20-checkout-page .ship-details-wrapper{border:1px solid var(--r20-line)!important;border-radius:15px!important;padding:16px!important;background:#fff!important;margin-bottom:14px!important}
html body .red20-checkout-page .shipped-details{background:var(--r20-soft)!important;border-radius:12px!important;padding:13px 14px!important;margin-top:8px!important}
html body .red20-checkout-page .shipped-details p{margin:3px 0!important;font-size:12px!important;line-height:1.45!important}
html body .red20-checkout-page .form-control{min-height:44px!important;border:1px solid #dfe3e8!important;border-radius:10px!important;box-shadow:none!important;background:#fff!important}
html body .red20-checkout-page textarea.form-control{min-height:100px!important}
html body .red20-checkout-page .payment-methods .row{gap:8px!important}
html body .red20-checkout-page .payment-methods .py-4{padding:9px!important;border:1px solid var(--r20-line)!important;border-radius:12px!important;background:#fff!important;min-height:64px!important;display:flex!important;align-items:center!important}
html body .red20-checkout-page .payment-gateway-images{max-height:30px!important;max-width:72px!important;object-fit:contain!important}
html body .red20-checkout-page .checkout-order-wrapper{position:sticky!important;top:104px!important;background:#fff!important;border:1px solid var(--r20-line)!important;border-radius:18px!important;padding:18px!important;box-shadow:0 5px 20px rgba(25,30,36,.05)!important}
html body .red20-checkout-page .checkout-title h1{font-size:20px!important;font-weight:900!important;color:var(--r20-dark)!important;margin:0 0 12px!important}
html body .red20-checkout-page .product-checkout .border-line{padding:10px 0!important;border-bottom:1px solid #f0f1f3!important}
html body .red20-checkout-page .product-checkout .widget-image img{width:58px!important;height:58px!important;object-fit:contain!important;border:1px solid #f0f1f3!important;border-radius:10px!important;padding:3px!important;background:#fff!important}
html body .red20-checkout-page .product-title{font-size:12px!important;font-weight:700!important;line-height:1.35!important;color:var(--r20-dark)!important}
html body .red20-checkout-page #redeem_btn,html body .red20-checkout-page #place_order_btn{background:var(--r20)!important;color:#fff!important;border:0!important;border-radius:11px!important;font-weight:900!important}
html body .red20-checkout-page #place_order_btn{width:100%!important;min-height:50px!important;margin-top:16px!important;font-size:15px!important}
html body .red20-checkout-page .total-price td{font-size:17px!important;font-weight:900!important;color:var(--r20-dark)!important}

/* ---------- ACCOUNT: app-like navigation and cleaner cards/forms ---------- */
html body .red20-account-page{background:var(--r20-soft)!important;padding-bottom:48px!important}
html body .red20-account-page>.main-content{padding-top:16px!important}
html body .red20-account-page .user-detail{background:#fff!important;border:1px solid var(--r20-line)!important;border-radius:16px!important;padding:14px 16px!important;box-shadow:0 3px 14px rgba(25,30,36,.04)!important}
html body .red20-account-nav{border:1px solid var(--r20-line)!important;border-radius:16px!important;box-shadow:none!important;padding:8px!important;overflow:hidden!important}
html body .red20-account-nav .nav-item{margin-top:2px!important}
html body .red20-account-nav .nav-link{border-radius:11px!important;color:#4b5563!important;padding:5px!important}
html body .red20-account-nav .nav-link.active{background:#fff2eb!important;color:var(--r20)!important;font-weight:800!important}
html body .red20-account-nav .sidebar-text{padding:8px 9px!important}
html body .red20-account-nav h6{font-size:12px!important;text-transform:none!important;font-weight:700!important}
html body .red20-account-nav i{width:24px!important;text-align:center!important;color:inherit!important}
html body .red20-account-dashboard .col-md-8.col-12.row{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important;margin:0!important}
html body .red20-account-dashboard .col-md-8.col-12.row>.card{width:auto!important;max-width:none!important;margin:0!important;padding:0!important;border:1px solid var(--r20-line)!important;border-radius:15px!important;background:#fff!important;box-shadow:0 3px 12px rgba(25,30,36,.04)!important;overflow:hidden!important}
html body .red20-account-dashboard .card-header{border:0!important;font-size:12px!important;font-weight:800!important;color:var(--r20-dark)!important;padding:13px 8px 4px!important}
html body .red20-account-dashboard .card-body{padding:10px 8px 16px!important}
html body .red20-account-dashboard .dashboard-icon{font-size:26px!important;color:var(--r20)!important}
html body .red20-account-profile .col-md-8.col-12{background:#fff!important;border:1px solid var(--r20-line)!important;border-radius:18px!important;padding:20px!important;box-shadow:0 5px 20px rgba(25,30,36,.04)!important}
html body .red20-account-profile .avatar{width:94px!important;height:94px!important;object-fit:cover!important;border-radius:50%!important;border:4px solid #fff2eb!important}
html body .red20-account-profile .form-control{min-height:44px!important;border:1px solid #dfe3e8!important;border-radius:10px!important;box-shadow:none!important}
html body .red20-account-profile .submit_btn{min-height:44px!important;border-radius:11px!important;background:var(--r20)!important;color:#fff!important;border:0!important;font-weight:900!important;padding:0 22px!important}

@media(max-width:767.98px){
  /* Main category: 3 across and image actually fills the available frame. */
  html body .red20-all-categories-shell{padding-left:9px!important;padding-right:9px!important}
  html body .red20-all-categories-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
  html body .red20-all-category-card{padding:5px!important;border-radius:12px!important}
  html body .red20-all-category-media{padding:3px!important;border-radius:10px!important}
  html body .red20-all-category-name{font-size:9.5px!important;min-height:26px!important;display:flex!important;align-items:center!important;justify-content:center!important}

  html body .red20-category-hero{margin:10px 8px 14px!important;border-radius:14px!important}
  html body .red20-category-hero-media{height:190px!important;padding:8px!important}
  html body .red20-category-hero-copy{padding:10px 12px!important}
  html body .red20-category-hero-copy h1{font-size:18px!important}

  /* Subcategories: exactly 2 per row, vertical page scroll. */
  html body .listing-page .red20-subcategory-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;padding:0 8px!important}
  html body .listing-page .red20-subcategory-grid .category-image>a{height:142px!important;padding:5px!important}
  html body .listing-page .red20-subcategory-grid .social{min-height:42px!important;padding:6px!important}
  html body .listing-page .red20-subcategory-grid .social span{font-size:10.5px!important}

  /* Cart: each item is a compact shopping-app card. */
  html body .red20-cart-breadcrumb,html body .red20-checkout-breadcrumb{display:none!important}
  html body .red20-cart-page{padding:8px 8px 84px!important}
  html body .red20-cart-page>.main-content{padding:0!important}
  html body .red20-cart-page>.main-content>.row{margin:0!important}
  html body .red20-cart-page .col-xl-8,html body .red20-cart-page .col-xl-4{width:100%!important;max-width:none!important;flex:none!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important}
  html body .red20-cart-page .cart-table-wrapper{background:transparent!important}
  html body .red20-cart-page .table-cart-product{display:block!important;background:transparent!important}
  html body .red20-cart-page .table-cart-product thead{display:none!important}
  html body .red20-cart-page .table-cart-product tbody{display:block!important}
  html body .red20-cart-page .table-cart-product .cart-product-desc-list{display:grid!important;grid-template-columns:82px minmax(0,1fr) 32px!important;gap:5px 9px!important;background:#fff!important;border:1px solid var(--r20-line)!important;border-radius:14px!important;padding:10px!important;margin-bottom:8px!important;position:relative!important}
  html body .red20-cart-page .table-cart-product .cart-product-desc-list td{display:block!important;border:0!important;padding:0!important;width:auto!important;min-width:0!important}
  html body .red20-cart-page .table-cart-product .cart-product-desc-list td:nth-child(1){grid-column:1;grid-row:1/5!important}
  html body .red20-cart-page .table-cart-product .cart-product-desc-list td:nth-child(2){grid-column:2;grid-row:1!important}
  html body .red20-cart-page .table-cart-product .cart-product-desc-list td:nth-child(3){grid-column:2;grid-row:2!important;font-size:13px!important;font-weight:900!important;color:var(--r20)!important}
  html body .red20-cart-page .table-cart-product .cart-product-desc-list td:nth-child(4){display:none!important}
  html body .red20-cart-page .table-cart-product .cart-product-desc-list td:nth-child(5){grid-column:2;grid-row:3!important}
  html body .red20-cart-page .table-cart-product .cart-product-desc-list td:nth-child(6){grid-column:2;grid-row:4!important;font-size:11px!important;color:var(--r20-muted)!important}
  html body .red20-cart-page .table-cart-product .cart-product-desc-list td:nth-child(7){grid-column:3;grid-row:1!important;text-align:center!important}
  html body .red20-cart-page .widget-image img,html body .red20-cart-page .cart-product-image img{width:82px!important;height:82px!important}
  html body .red20-cart-page .cart-product-title{font-size:11.5px!important;margin:0!important}
  html body .red20-cart-page .save-for-later{font-size:9px!important;padding:5px 7px!important;margin-top:5px!important}
  html body .red20-cart-page .product-quantity{transform:scale(.88)!important;transform-origin:left center!important}
  html body .red20-cart-page .cart-product-summary{position:static!important;margin-top:10px!important;border-radius:14px!important;padding:15px!important}
  html body .red20-cart-page .cart-product-summary h3{font-size:17px!important}
  html body .red20-cart-page #checkout .block{min-height:50px!important}

  /* Checkout: address/payment first, summary below, one thumb-friendly column. */
  html body .red20-checkout-page{padding:8px 8px 86px!important}
  html body .red20-checkout-page>.main-content{padding:0!important}
  html body .red20-checkout-page>.main-content>form>.row{margin:0!important}
  html body .red20-checkout-page .col-xl-8,html body .red20-checkout-page .col-xl-4{width:100%!important;max-width:none!important;flex:none!important;padding:12px!important;margin:0 0 9px!important;border-radius:14px!important}
  html body .red20-checkout-page .checkout-form-title{font-size:18px!important;margin-bottom:10px!important}
  html body .red20-checkout-page .ship-details-wrapper{padding:12px!important;border-radius:12px!important}
  html body .red20-checkout-page .payment-methods .row{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important;margin:0!important}
  html body .red20-checkout-page .payment-methods .row>[class*="col-"]{width:auto!important;max-width:none!important;flex:none!important;padding:0!important}
  html body .red20-checkout-page .payment-methods .py-4{min-height:58px!important;padding:7px!important}
  html body .red20-checkout-page .checkout-order-wrapper{position:static!important;border:0!important;box-shadow:none!important;padding:0!important}
  html body .red20-checkout-page .checkout-title h1{font-size:18px!important}
  html body .red20-checkout-page #place_order_btn{position:sticky!important;bottom:72px!important;z-index:5!important;box-shadow:0 5px 18px rgba(255,90,0,.22)!important}

  /* Account: top horizontal app tabs + 2-column dashboard. */
  html body .red20-account-page{padding:6px 8px 84px!important}
  html body .red20-account-page>.main-content{padding:0!important}
  html body .red20-account-page .col-md-12.mt-5{margin-top:8px!important;padding:0!important}
  html body .red20-account-page>.main-content>.row{margin:0!important}
  html body .red20-account-page>.main-content>.row>.col-md-4,html body .red20-account-page>.main-content>.row>.col-md-8{padding:0!important;width:100%!important;max-width:none!important;flex:none!important}
  html body .red20-account-nav{display:flex!important;flex-direction:row!important;gap:5px!important;overflow-x:auto!important;overflow-y:hidden!important;white-space:nowrap!important;padding:6px!important;margin:8px 0 10px!important;scrollbar-width:none!important;border-radius:13px!important}
  html body .red20-account-nav::-webkit-scrollbar{display:none!important}
  html body .red20-account-nav .nav-item{flex:0 0 auto!important;margin:0!important}
  html body .red20-account-nav .nav-link{padding:0!important}
  html body .red20-account-nav .sidebar-text{padding:9px 10px!important}
  html body .red20-account-nav h6{font-size:10.5px!important}
  html body .red20-account-nav i{width:auto!important;margin-right:4px!important}
  html body .red20-account-dashboard .col-md-8.col-12.row{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;padding:0!important}
  html body .red20-account-dashboard .card-header{font-size:10.5px!important;padding-top:10px!important}
  html body .red20-account-dashboard .dashboard-icon{font-size:23px!important}
  html body .red20-account-profile .col-md-8.col-12{padding:14px!important;border-radius:14px!important}
  html body .red20-account-profile .form-row{display:block!important}
  html body .red20-account-profile .form-group.col-md-6{width:100%!important;max-width:none!important;padding:0!important}
  html body .red20-account-profile .avatar{width:78px!important;height:78px!important}
}