/* ===== ESGMarket update: mini ticker, add-to-cart, mobile modal fix, orders page, seasons ===== */

/* 1. Tiny white announcement bar under the category row */
.esg-mini-ticker{width:100%!important;max-width:none!important;margin:0!important;min-height:0!important;height:26px;padding:0 12px!important;gap:8px!important;border:0!important;border-bottom:1px solid #eee!important;border-radius:0!important;background:#fff!important;box-shadow:none!important;align-items:center}
.esg-mini-ticker .mini-ticker-icon{flex:0 0 auto;font-size:13px;line-height:1}
.esg-mini-ticker .ticker-viewport{background:#fff!important;color:#444!important;height:100%;display:flex;align-items:center}
.esg-mini-ticker .ticker-item{gap:6px!important;padding:0 18px 0 4px!important}
.esg-mini-ticker .ticker-item img,.esg-mini-ticker .ticker-thumb-fallback{display:none!important}
.esg-mini-ticker .ticker-copy{font-size:11px!important;gap:5px!important;color:#444!important}
.esg-mini-ticker .ticker-copy b{font-size:11px;color:var(--orange)}
.esg-mini-ticker .ticker-separator{font-size:12px!important}
html[data-theme="dark"] .esg-mini-ticker,html[data-theme="dark"] .esg-mini-ticker .ticker-viewport{background:#fff!important}
html[data-theme="dark"] .esg-mini-ticker .ticker-copy{color:#444!important}

/* 2. Add to cart right after the quantity */
.detail-actions{display:flex;flex-direction:column;gap:12px;align-items:stretch}
.detail-actions .add-detail-btn{width:100%;padding:15px;font-size:16px;border-radius:999px;box-shadow:0 10px 24px rgba(244,123,32,.30)}
.detail-actions .add-detail-btn.is-remove{background:#fff;color:#c1123f;border:1.5px solid #c1123f;box-shadow:none}
.detail-bar{display:none!important}

/* 3. Checkout / payment / every modal: never cut off by the bottom bar or notch */
.modal{align-items:start!important;align-content:start;-webkit-overflow-scrolling:touch}
.modal>.modal-card{margin:auto 0;max-height:none}
@media(max-width:900px){
  .modal{padding:12px 10px calc(96px + env(safe-area-inset-bottom,0px))!important}
  .checkout-card,.transfer-instructions-card,.cart-card{width:100%!important}
  .checkout-grid{grid-template-columns:minmax(0,1fr)!important}
  #placeOrderBtn,.transfer-instructions-card .btn{position:relative}
}
.mobile-bottom-nav{z-index:95!important}
.modal{z-index:300!important}
@media(max-width:900px){.modal{z-index:300!important}.mobile-bottom-nav{z-index:290!important}}

/* 4. Orders page */
.orders-page{position:fixed;inset:0;z-index:250;background:#f5f5f3;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-bottom:calc(90px + env(safe-area-inset-bottom,0px))}
.orders-page[hidden]{display:none!important}
.orders-topbar{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;background:#fff;border-bottom:1px solid var(--line);padding:calc(10px + env(safe-area-inset-top,0px)) 12px 10px}
.orders-topbar h2{margin:0;font:700 18px Sora,"DM Sans",Arial,sans-serif}
.orders-back{border:0;background:none;font-size:34px;line-height:1;padding:0 10px;color:var(--ink)}
.orders-top-spacer{width:46px}
.orders-body{max-width:760px;margin:0 auto;padding:0 0 10px}
.orders-tabs{display:flex;gap:4px;overflow-x:auto;background:#fff;padding:0 8px;border-bottom:1px solid var(--line);scrollbar-width:none}
.orders-tabs::-webkit-scrollbar{display:none}
.orders-tabs button{flex:0 0 auto;border:0;background:none;padding:13px 12px;font:600 14px "DM Sans",Arial,sans-serif;color:#777;border-bottom:3px solid transparent}
.orders-tabs button.on{color:var(--ink);border-bottom-color:var(--orange)}
.orders-tabs b{color:var(--orange);margin-left:3px;font-size:12px}
.ord-card{background:#fff;margin:10px 0;padding:14px;border-radius:0}
@media(min-width:760px){.ord-card{border-radius:14px}}
.ord-head{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.ord-head h3{margin:0;font:700 16px "DM Sans",Arial,sans-serif}
.ord-status{font-size:12px;font-weight:700;padding:3px 9px;border-radius:99px;background:#fff1e8;color:#b9500a;white-space:nowrap}
.ord-status.ok{background:#e6f6ea;color:#1a7a35}.ord-status.bad{background:#fde8ec;color:#c1123f}
.ord-sub{margin:4px 0 0;font-size:12.5px;color:#777}
.ord-link{display:inline-block;margin-top:8px;color:var(--orange);font-weight:700;font-size:14px;background:none;border:0;padding:0}
.ord-row{display:flex;align-items:center;gap:8px;margin-top:12px;cursor:pointer}
.ord-thumbs{display:flex;gap:8px;flex:1;min-width:0;overflow:hidden}
.ord-thumb{position:relative;flex:0 0 auto;width:72px;height:72px;border-radius:8px;background:#f1f1ef;overflow:hidden}
.ord-thumb img{width:100%;height:100%;object-fit:cover}
.ord-thumb i{position:absolute;right:3px;bottom:3px;background:#000b;color:#fff;font-style:normal;font-size:11px;font-weight:700;padding:1px 6px;border-radius:6px}
.ord-total{text-align:right;flex:0 0 auto;font-size:13px;color:#777}.ord-total b{display:block;font-size:16px;color:var(--ink)}
.ord-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;margin-top:14px;padding-top:12px;border-top:1px solid #f0f0ee}
.ord-btn{border:1.5px solid #222;background:#fff;color:#111;border-radius:999px;padding:9px 16px;font:600 14px "DM Sans",Arial,sans-serif}
.ord-btn.primary{background:var(--orange);border-color:var(--orange);color:#fff}
.ord-btn.soft{border-color:var(--orange);color:var(--orange)}
.ord-box{background:#f7f7f5;border:1px solid #ececea;border-radius:10px;padding:12px;margin-top:12px;font-size:14px}
.ord-box .line{display:flex;justify-content:space-between;gap:10px;padding:4px 0}
.ord-empty{text-align:center;padding:60px 20px;color:#777;background:#fff;margin-top:10px}
.ord-timeline{list-style:none;margin:10px 0 0;padding:0}
.ord-timeline li{position:relative;padding:0 0 16px 26px;font-size:14px}
.ord-timeline li::before{content:"";position:absolute;left:5px;top:5px;width:10px;height:10px;border-radius:50%;background:#ccc}
.ord-timeline li::after{content:"";position:absolute;left:9px;top:16px;bottom:-2px;width:2px;background:#e4e4e1}
.ord-timeline li:last-child::after{display:none}
.ord-timeline li.done::before{background:#1a7a35}.ord-timeline li.now::before{background:var(--orange);box-shadow:0 0 0 4px #fff1e8}
.ord-timeline small{display:block;color:#888}
.ord-item{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid #f0f0ee}
.ord-item .ord-thumb{width:64px;height:64px}
.ord-item p{margin:0;font-size:14px}.ord-item small{color:#777}
.ord-banner{border-radius:12px;padding:14px;margin-top:12px;font-size:14px}
.ord-banner.ok{background:#e6f6ea;color:#14602b;font-weight:600}
.ord-banner.warn{background:#fff1e8;color:#8f3f06}
.ord-steps{display:flex;align-items:flex-start;gap:6px;margin:14px 0}
.ord-step{flex:1;text-align:center;font-size:12px;color:#888}
.ord-step span{display:grid;place-items:center;width:34px;height:34px;margin:0 auto 6px;border-radius:50%;background:#eee;font-weight:700;color:#777}
.ord-step.done span{background:#1a7a35;color:#fff}.ord-step.now span{background:var(--orange);color:#fff}
.ord-step.done,.ord-step.now{color:var(--ink)}
.orders-track-slot{max-width:760px;margin:0 auto}
.orders-track-slot .tracking{padding:18px 14px}
.orders-page .tracking .announcement-ticker{display:none!important}
html[data-theme="dark"] .orders-page{background:#0f0f0e}
html[data-theme="dark"] .orders-topbar,html[data-theme="dark"] .orders-tabs,html[data-theme="dark"] .ord-card,html[data-theme="dark"] .ord-empty{background:#171716;color:#eee}
html[data-theme="dark"] .ord-btn{background:#171716;color:#eee;border-color:#666}
html[data-theme="dark"] .ord-btn.primary{background:var(--orange);border-color:var(--orange);color:#fff}
html[data-theme="dark"] .ord-box{background:#1f1f1d;border-color:#363633}
html[data-theme="dark"] .ord-total b,html[data-theme="dark"] .orders-topbar h2,html[data-theme="dark"] .orders-back{color:#eee}

/* 5. Seasonal themes */
.season-fx{position:fixed;inset:0;z-index:60;pointer-events:none;overflow:hidden}
.season-fx span{position:absolute;top:-8%;animation:esgFall linear infinite;will-change:transform;opacity:.9}
@keyframes esgFall{to{transform:translate3d(var(--dx,20px),112vh,0) rotate(var(--rot,360deg))}}
.season-strip{display:flex;justify-content:center;align-items:center;gap:8px;padding:5px 10px;font:700 12px "DM Sans",Arial,sans-serif;letter-spacing:.2px;color:#fff}
html[data-season="halloween"] .season-strip{background:linear-gradient(90deg,#1b1020,#5a2a05,#1b1020)}
html[data-season="christmas"] .season-strip{background:linear-gradient(90deg,#8e1a2b,#1c6b3c,#8e1a2b)}
html[data-season="newyear"] .season-strip{background:linear-gradient(90deg,#16203d,#7a5a10,#16203d)}
html[data-season="ramadan"] .season-strip{background:linear-gradient(90deg,#0e3b2e,#7a5a10,#0e3b2e)}
html[data-season="eid"] .season-strip{background:linear-gradient(90deg,#0e3b2e,#b88a14,#0e3b2e)}
html[data-season="halloween"] .hero{background-image:radial-gradient(500px 260px at 90% 0,rgba(244,123,32,.18),transparent 70%)}
html[data-season="christmas"] .hero{background-image:radial-gradient(500px 260px at 90% 0,rgba(214,40,57,.12),transparent 70%)}
html[data-season="ramadan"] .hero,html[data-season="eid"] .hero{background-image:radial-gradient(500px 260px at 90% 0,rgba(242,182,50,.20),transparent 70%)}
.brand-mark{position:relative}
.brand-decor.decor-halloween{position:absolute;top:-10px;right:-14px;width:34px;height:34px;pointer-events:none;filter:drop-shadow(0 2px 3px rgba(0,0,0,.3))}
.brand-decor.decor-halloween svg,.brand-decor.decor-ramadan svg{width:100%;height:100%}
@media (prefers-reduced-motion:reduce){.season-fx{display:none}}

/* 6. Seller area */
.seller-intro{padding:16px 14px 4px;color:#555;font-size:15px;line-height:1.5;margin:0}
.sp-card{margin:12px 12px!important;max-width:none}
.sp-form{padding:0}.sp-form .ord-card label,.sp-pay label{display:block;font-weight:600;font-size:14px;margin-top:12px}
.sp-form input:not([type=radio]):not([type=checkbox]),.sp-form textarea,.sp-form select,.sp-pay input{display:block;width:100%;margin-top:6px;padding:12px;border:1px solid #ddd;border-radius:10px;font:inherit;background:#fff;color:#111}
.sp-form .btn.wide{margin-top:16px;width:100%}
.sp-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sp-period{display:grid;gap:8px;margin:12px 0 4px}.sp-period label{display:flex;align-items:center;gap:8px;padding:12px;border:1.5px solid #e4e4e1;border-radius:12px;margin:0}
.sp-agree{display:flex!important;gap:8px;align-items:flex-start;font-weight:500!important}.sp-agree input{width:auto!important;margin-top:3px!important}
.sp-pay b{font-size:14px}
.sp-thread{max-height:48vh;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:2px}
.sp-msg{align-self:flex-start;max-width:86%;background:#f1f1ef;border-radius:14px 14px 14px 4px;padding:10px 12px;font-size:14px;line-height:1.45}
.sp-msg.mine{align-self:flex-end;background:#fff1e8;border-radius:14px 14px 4px 14px}
.sp-msg.warn{background:#fde8ec;color:#8a0f2d;border:1px solid #f5b5c2}
.sp-msg small{display:block;margin-top:4px;color:#888;font-size:11px}
.sp-chat{display:flex;gap:8px;margin-top:12px}.sp-chat input{flex:1;padding:12px;border:1px solid #ddd;border-radius:999px;font:inherit}
html[data-theme="dark"] .sp-form input,html[data-theme="dark"] .sp-form textarea,html[data-theme="dark"] .sp-chat input{background:#1f1f1d;color:#eee;border-color:#444}
html[data-theme="dark"] .sp-msg{background:#262624;color:#eee}

/* 7. Pages always scroll all the way down */
body{padding-bottom:calc(78px + env(safe-area-inset-bottom,0px))!important}
@supports (overflow:clip){body{overflow-x:clip!important}}
html{height:auto;min-height:100%;overflow-x:hidden}
footer{padding-bottom:calc(36px + env(safe-area-inset-bottom,0px))}
#cbMain,#cbSide{padding-bottom:calc(92px + env(safe-area-inset-bottom,0px))!important;-webkit-overflow-scrolling:touch}
.orders-page,.modal,.x-modal{overscroll-behavior:contain}
@media(min-width:901px){body{padding-bottom:0!important}}

/* 8. Sold out */
.so-badge{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);margin:auto;width:max-content;max-width:90%;background:rgba(17,17,17,.82);color:#fff;font:800 13px "DM Sans",Arial,sans-serif;letter-spacing:.6px;text-transform:uppercase;padding:7px 14px;border-radius:999px;pointer-events:none;z-index:2}
.product-media:has(.so-badge) img{filter:grayscale(.85) brightness(.9);opacity:.8}
.product:has(.so-badge) .quick-add{opacity:.35}

/* 9. Speed: skip drawing cards that are far off screen, calm heavy effects */
@media(max-width:900px){.product{content-visibility:auto;contain-intrinsic-size:auto 300px}}
.product-media img,.ord-thumb img{content-visibility:auto}
.esg-lite .season-fx{display:none!important}
.esg-lite *{scroll-behavior:auto!important}
@media (max-width:900px){.header,.mobile-bottom-nav{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}}

/* 10. Announcement bar: always white and tiny, in every theme (id selector beats the older dark rules) */
#homepageAnnouncement,html[data-theme="dark"] #homepageAnnouncement{display:flex;background:#fff!important;border:0!important;border-bottom:1px solid #eee!important;border-radius:0!important;box-shadow:none!important;min-height:0!important;height:26px!important;margin:0!important;padding:0 12px!important;gap:8px!important;width:100%!important;max-width:none!important;align-items:center}
#homepageAnnouncement[hidden]{display:none!important}
#homepageAnnouncement .ticker-label,#homepageAnnouncement .ticker-dot,#homepageAnnouncement .ticker-item img,#homepageAnnouncement .ticker-thumb-fallback{display:none!important}
#homepageAnnouncement .ticker-viewport,html[data-theme="dark"] #homepageAnnouncement .ticker-viewport{background:#fff!important;color:#444!important;-webkit-mask-image:none!important;mask-image:none!important;height:100%;display:flex;align-items:center}
#homepageAnnouncement .ticker-item{background:transparent!important;padding:0 20px 0 0!important;max-width:none!important}
#homepageAnnouncement .ticker-copy,html[data-theme="dark"] #homepageAnnouncement .ticker-copy{font-size:11px!important;color:#444!important;gap:5px!important}
#homepageAnnouncement .ticker-copy span,html[data-theme="dark"] #homepageAnnouncement .ticker-copy span{color:#666!important}
#homepageAnnouncement .ticker-copy b,html[data-theme="dark"] #homepageAnnouncement .ticker-copy b{font-size:11px!important;color:#f47b20!important}
#homepageAnnouncement .ticker-separator{color:#f47b20!important}
#homepageAnnouncement .mini-ticker-icon{flex:0 0 auto;font-size:13px;line-height:1}

/* 11. Season banner: light and soft instead of dark */
html[data-season] .season-strip{background:#fff1e0!important;color:#9a4a00!important;border-bottom:1px solid #f6d9b8;padding:4px 10px;font-size:12px}
html[data-season="christmas"] .season-strip{background:#fdebed!important;color:#9b1c2c!important;border-bottom-color:#f5c8cd}
html[data-season="newyear"] .season-strip{background:#fff7d6!important;color:#7a5a10!important;border-bottom-color:#f0e0a0}
html[data-season="ramadan"] .season-strip,html[data-season="eid"] .season-strip{background:#e8f6ee!important;color:#14602b!important;border-bottom-color:#bfe3cc}

/* 12. One badge only: the season badge replaces the SALE badge in the same spot (top-right of the logo) */
html[data-season] .brand-decor{display:none!important}
.season-badge{position:absolute!important;top:-8px!important;right:-14px!important;left:auto!important;bottom:auto!important;font-size:28px!important;line-height:1;pointer-events:none;background:none!important;filter:drop-shadow(0 2px 3px rgba(0,0,0,.3))}

/* 13. Trends slot (top collection card) */
.trends-slider{position:absolute;inset:0;z-index:0}
.trend-slide{position:absolute;inset:0;opacity:0;transition:opacity .8s ease}
.trend-slide.on{opacity:1}
.trend-slide img,.trend-slide video{width:100%;height:100%;object-fit:cover;display:block}
.hero-feature.has-trends:after{z-index:1}
.hero-feature-overlay{z-index:2}
.trends-dots{position:absolute;top:14px;left:0;right:0;z-index:4;display:flex;justify-content:center;gap:6px}
.trends-dots i{width:22px;height:4px;border-radius:4px;background:rgba(255,255,255,.45);cursor:pointer}
.trends-dots i.on{background:#fff}
.trends-mute{position:absolute;top:26px;right:14px;z-index:4;border:0;border-radius:50%;width:36px;height:36px;background:rgba(0,0,0,.5);color:#fff;font-size:16px}
.trends-mute[hidden]{display:none}
.trends-pulse{animation:trendsPulse 1.2s ease 1}
@keyframes trendsPulse{0%{box-shadow:0 0 0 0 rgba(244,123,32,.7)}100%{box-shadow:0 0 0 24px rgba(244,123,32,0)}}

/* 14. Full-screen Trends viewer */
.trends-page{position:fixed;inset:0;z-index:295;background:#000;color:#fff}
.trends-page[hidden]{display:none!important}
.tp-top{position:absolute;top:0;left:0;right:0;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:calc(10px + env(safe-area-inset-top,0px)) 12px 28px;background:linear-gradient(180deg,rgba(0,0,0,.65),transparent)}
.tp-top b{font:800 17px Sora,"DM Sans",system-ui,sans-serif;letter-spacing:.3px}
.tp-close{border:0;background:rgba(255,255,255,.18);color:#fff;width:40px;height:40px;border-radius:50%;font-size:18px;backdrop-filter:blur(6px)}
.tp-sound{border:0;background:rgba(255,255,255,.18);color:#fff;border-radius:999px;padding:10px 14px;font:700 13px "DM Sans",system-ui,sans-serif;backdrop-filter:blur(6px);min-width:40px}
.tp-feed{height:100%;overflow-y:auto;scroll-snap-type:y mandatory;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.tp-item{position:relative;height:100%;scroll-snap-align:start;scroll-snap-stop:always;display:flex;align-items:center;justify-content:center;background:#000}
.tp-item img{max-width:100%;max-height:100%;object-fit:contain}
.tp-item video{width:100%;height:100%;object-fit:cover}
.tp-play{position:absolute;font-size:46px;color:rgba(255,255,255,.85);pointer-events:none;opacity:0}
.tp-item video:paused~.tp-play{opacity:1}
.tp-cap{position:absolute;left:0;right:0;bottom:0;padding:48px 18px calc(26px + env(safe-area-inset-bottom,0px));background:linear-gradient(0deg,rgba(0,0,0,.75),transparent);pointer-events:none}
.tp-cap h3{margin:0 0 6px;font:800 22px/1.2 Sora,"DM Sans",system-ui,sans-serif;letter-spacing:-.01em}
.tp-cap span{font-size:12px;opacity:.75;font-weight:700}
.tp-empty{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;gap:8px}
.tp-empty-ic{font-size:46px}.tp-empty h3{margin:0;font-size:22px}.tp-empty p{margin:0 0 14px;opacity:.75}

/* 15. Style Me */
.style-card{max-width:1340px;margin:0 auto 22px;padding:18px 20px;display:flex;align-items:center;justify-content:space-between;gap:14px;border-radius:20px;background:linear-gradient(120deg,#171716,#3a2410 70%,#f47b20);color:#fff;box-shadow:var(--shadow-lg,0 18px 40px rgba(0,0,0,.14))}
@media(min-width:1380px){.style-card{border-radius:20px}}
@media(max-width:1340px){.style-card{margin-left:12px;margin-right:12px}}
.style-card h3{margin:4px 0 2px;font:800 20px Sora,"DM Sans",system-ui,sans-serif;letter-spacing:-.01em}
.style-card p{margin:0;font-size:13.5px;opacity:.85}
.style-card-tag{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#ffc58f}
.style-card .btn{flex:0 0 auto;white-space:nowrap}
@media(max-width:600px){.style-card{flex-direction:column;align-items:stretch;text-align:left}.style-card .btn{width:100%}}
.style-hero{margin:12px;padding:24px 18px;border-radius:20px;text-align:center;background:linear-gradient(135deg,#fff7ee,#ffe9d2)}
.style-hero span{font-size:38px}.style-hero h3{margin:6px 0;font:800 22px Sora,"DM Sans",system-ui,sans-serif;color:#141414}.style-hero p{margin:0 0 12px;color:#555;font-size:14.5px;line-height:1.5}
.style-fee{display:inline-block;background:#fff;border-radius:999px;padding:8px 16px;font-size:14px;color:#141414;box-shadow:0 6px 16px rgba(244,123,32,.18)}.style-fee b{color:#f47b20;font-size:17px}
.style-steps{margin:0 0 14px;padding-left:20px;line-height:1.9;font-size:15px}
.sb-board{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:8px}
.sb-card{display:block;text-align:left;border:1px solid #ececea;background:#fff;border-radius:12px;padding:6px;cursor:pointer;color:#141414}
.sb-img{display:block;aspect-ratio:1;border-radius:8px;overflow:hidden;background:#f1f1ef}.sb-img img{width:100%;height:100%;object-fit:cover}
.sb-card b{display:block;font-size:12.5px;margin-top:6px;line-height:1.3;max-height:2.6em;overflow:hidden}
.sb-card em{display:block;font-style:normal;font-weight:800;color:#f47b20;font-size:13px;margin-top:2px}
.sb-card u{display:block;font-size:12px;margin-top:2px;color:#777;text-decoration:none}

/* 16. Product popup: stable layout while choosing colour / size / quantity */
.color-swatch img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:7px}
.detail-image-wrap{contain:layout paint}
.detail-saving,.detail-discount,.detail-price-wrap del{transition:none}
.modal .product{content-visibility:visible!important;contain-intrinsic-size:auto none!important}
.variant,.color-swatch,.qty-box button,.dthumb,.gnav,.add-detail-btn,.rec-tabs button{touch-action:manipulation;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}
.variant{min-height:44px;min-width:48px;transition:background .15s,border-color .15s,color .15s,transform .1s}
.variant:active,.color-swatch:active,.qty-box button:active{transform:scale(.95)}
.color-swatch{transition:border-color .15s,box-shadow .15s,transform .1s}
.color-swatch.active{border-color:#f47b20!important;box-shadow:0 0 0 3px rgba(244,123,32,.22)!important}
.variant.active{background:#141414;color:#fff;border-color:#141414}
.qty-box button{min-width:44px;min-height:44px}