/* ═══════════════════════════════════════════════════════════════════════
   ChinaHub — header, refined (ch-hdr-lux.css)
   Only the look: «All categories», ship-to, account, cart, and the category row.
   Desktop: one family of soft «pills» with round icon chips.
   Phones: the category row comes back as a neat row of chips under the header,
   scrolling sideways inside itself, the products right below it.
   Remove the one line that loads this file and the header is exactly as before.
   ═══════════════════════════════════════════════════════════════════════ */

/* ───────── desktop header ───────── */
@media (min-width:981px){
  /* All categories — bigger, with an orange chip */
  html.ch-lux body #ch-main-header .cat-btn{height:52px!important;min-width:0!important;padding:0 18px 0 7px!important;gap:11px!important;border-radius:999px!important;
    background:#fff!important;border:1.5px solid #ECECF0!important;box-shadow:0 1px 2px rgba(16,24,40,.05),0 8px 18px -14px rgba(16,24,40,.35)!important;
    color:#111318!important;font-size:15.5px!important;font-weight:800!important;letter-spacing:-.01em;cursor:pointer;
    transition:border-color .18s ease,background-color .18s ease,box-shadow .18s ease,transform .12s ease!important}
  html.ch-lux[dir="rtl"] body #ch-main-header .cat-btn{padding:0 7px 0 18px!important}
  html.ch-lux body #ch-main-header .cat-btn svg.grid{box-sizing:border-box;width:38px!important;height:38px!important;padding:11px;border-radius:50%;flex:none;
    color:#fff!important;background:linear-gradient(180deg,#FF7A1A,#E85400)!important;box-shadow:0 8px 16px -8px rgba(232,84,0,.75)}
  html.ch-lux body #ch-main-header .cat-btn > svg:last-child:not(.grid){width:12px!important;height:12px!important;color:#9A9AA0!important;transition:transform .2s ease}
  html.ch-lux body #ch-main-header .cat-btn:hover{border-color:#FFCFAF!important;background:#FFF8F3!important;box-shadow:0 10px 22px -14px rgba(232,84,0,.55)!important}
  html.ch-lux body #ch-main-header .cat-btn:hover > svg:last-child:not(.grid),
  html.ch-lux body #ch-main-header .cat-btn[aria-expanded="true"] > svg:last-child:not(.grid){transform:rotate(180deg);color:#E24E00!important}
  html.ch-lux body #ch-main-header .cat-btn:active{transform:scale(.985)}

  /* ship-to · account · cart — one calm family */
  html.ch-lux body #ch-main-header .acts{gap:4px!important;align-items:center!important}
  html.ch-lux body #ch-main-header .acts > .act,
  html.ch-lux body #ch-main-header .acts > .act-cart{position:relative;display:flex!important;align-items:center!important;gap:10px!important;height:56px!important;
    padding:6px 14px 6px 7px!important;border-radius:18px!important;border:1px solid transparent!important;background:transparent!important;
    text-decoration:none!important;transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease!important}
  html.ch-lux[dir="rtl"] body #ch-main-header .acts > .act,
  html.ch-lux[dir="rtl"] body #ch-main-header .acts > .act-cart{padding:6px 7px 6px 14px!important}
  html.ch-lux body #ch-main-header .acts > .act:hover,
  html.ch-lux body #ch-main-header .acts > .act-cart:hover{background:#F7F7F9!important;border-color:#EEEEF2!important}
  html.ch-lux body #ch-main-header .acts .act-text{flex-direction:column;justify-content:center;gap:1px;line-height:1.25!important}   /* shown or hidden by the header itself */
  html.ch-lux body #ch-main-header .acts .act-text .top{font-size:11.5px!important;font-weight:600!important;color:#8A8A90!important;line-height:1.2!important}
  html.ch-lux body #ch-main-header .acts .act-text .btm{font-size:14px!important;font-weight:800!important;color:#111318!important;line-height:1.3!important;white-space:nowrap}
  /* the flag in a round frame */
  html.ch-lux body #ch-main-header #topFlag{width:38px!important;height:38px!important;border-radius:50%!important;overflow:hidden!important;flex:none;display:block!important;
    box-shadow:0 0 0 2px #fff,0 0 0 3.5px #ECECF0,0 6px 14px -8px rgba(16,24,40,.45)!important;background:#F2F2F5}
  html.ch-lux body #ch-main-header #topFlag img{width:100%!important;height:100%!important;object-fit:cover!important;border-radius:50%!important;display:block}
  /* the account icon */
  html.ch-lux body #ch-main-header #actAccount .act-ico{width:38px!important;height:38px!important;border-radius:50%!important;background:#FFF1E6!important;color:#E24E00!important;
    box-shadow:inset 0 0 0 1px #FFE0CC}
  html.ch-lux body #ch-main-header #actAccount .act-ico svg{width:19px!important;height:19px!important}
  html.ch-lux body #ch-main-header #actAccount .acct-initial{width:38px!important;height:38px!important;font-size:15px!important;background:linear-gradient(180deg,#FF7A1A,#E85400)!important;color:#fff!important}
  /* the cart: an orange chip, the count on its corner */
  html.ch-lux body #ch-main-header .act-cart .cart-ic{position:relative;width:42px!important;height:42px!important;border-radius:50%!important;flex:none;display:grid!important;place-items:center;
    color:#fff!important;background:linear-gradient(180deg,#FF7A1A,#E85400)!important;box-shadow:0 10px 18px -10px rgba(232,84,0,.8)!important}
  html.ch-lux body #ch-main-header .act-cart .cart-ic svg{width:19px!important;height:19px!important}
  html.ch-lux body #ch-main-header .act-cart #cart-badge{position:absolute!important;top:3px!important;left:auto!important;right:auto!important;inset-inline-start:36px!important;
    min-width:21px!important;height:21px!important;padding:0 5px!important;border-radius:999px!important;border:2px solid #fff!important;background:#111318!important;color:#fff!important;
    font-size:11px!important;font-weight:900!important;line-height:17px!important;text-align:center;box-shadow:0 4px 10px -4px rgba(0,0,0,.5)!important}
  html.ch-lux body #ch-main-header .act-cart:hover .cart-ic{transform:translateY(-1px)}
  html.ch-lux body #ch-main-header .act-cart .cart-ic{transition:transform .18s ease}

  /* the category row: soft pills */
  html.ch-lux body #ch-cat-nav{background:rgba(255,255,255,.96)!important;border-bottom:1px solid #EEEEF2!important;box-shadow:0 10px 24px -22px rgba(16,24,40,.35)!important}
  html.ch-lux body #ch-cat-nav .cat-nav-list{align-items:center!important;gap:4px!important;min-height:54px}
  html.ch-lux body #ch-cat-nav .cat-nav-list > a,
  html.ch-lux body #ch-cat-nav .chv-more-b{display:inline-flex!important;align-items:center!important;height:38px!important;padding:0 15px!important;border-radius:999px!important;
    font-size:14.5px!important;font-weight:700!important;color:#2A2C33!important;text-decoration:none!important;white-space:nowrap;
    background:transparent!important;border:0!important;transition:background-color .15s ease,color .15s ease!important}
  html.ch-lux body #ch-cat-nav .cat-nav-list > a:hover,
  html.ch-lux body #ch-cat-nav .chv-more-b:hover{background:#F4F4F6!important;color:#111318!important}
  html.ch-lux body #ch-cat-nav .cat-nav-list > a.active{background:#FFF1E6!important;color:#E24E00!important;font-weight:800!important;box-shadow:inset 0 0 0 1px #FFDCC5}
  html.ch-lux body #ch-cat-nav .cn-ind{display:none!important}
}

/* ───────── smaller laptops: the same look, a little tighter, so the search box keeps its room ───────── */
@media (min-width:981px) and (max-width:1365px){
  html.ch-lux body #ch-main-header .cat-btn{height:46px!important;padding:0 14px 0 6px!important;gap:9px!important;font-size:14.5px!important}
  html.ch-lux[dir="rtl"] body #ch-main-header .cat-btn{padding:0 6px 0 14px!important}
  html.ch-lux body #ch-main-header .cat-btn svg.grid{width:34px!important;height:34px!important;padding:10px}
  html.ch-lux body #ch-main-header .acts{gap:2px!important}
  html.ch-lux body #ch-main-header .acts > .act,
  html.ch-lux body #ch-main-header .acts > .act-cart{height:50px!important;padding:5px 9px 5px 5px!important;gap:8px!important;border-radius:16px!important}
  html.ch-lux[dir="rtl"] body #ch-main-header .acts > .act,
  html.ch-lux[dir="rtl"] body #ch-main-header .acts > .act-cart{padding:5px 5px 5px 9px!important}
  html.ch-lux body #ch-main-header #topFlag,
  html.ch-lux body #ch-main-header #actAccount .act-ico,
  html.ch-lux body #ch-main-header #actAccount .acct-initial{width:34px!important;height:34px!important}
  html.ch-lux body #ch-main-header .act-cart .cart-ic{width:38px!important;height:38px!important}
  html.ch-lux body #ch-main-header .act-cart #cart-badge{inset-inline-start:32px!important}
  html.ch-lux body #ch-main-header .acts .act-text .btm{font-size:13px!important}
  html.ch-lux body #ch-cat-nav .cat-nav-list > a,html.ch-lux body #ch-cat-nav .chv-more-b{padding:0 12px!important;font-size:14px!important}
}

/* ───────── phones and tablets: the category row comes back as chips ───────── */
@media (max-width:980px){
  /* the row sticks right under the phone header; when the header slides away on scroll, the site's own header script
     lifts every bar stuck under it — this row included — to the top, and brings it back down when the header returns */
  html.ch-lux.ch-catbar-m body #ch-cat-nav{display:block!important;position:sticky!important;top:var(--chv-hh,47px)!important;z-index:850!important;height:auto!important;
    background:rgba(255,255,255,.97)!important;-webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px);
    border-bottom:1px solid #EEEEF2!important;box-shadow:0 8px 18px -18px rgba(16,24,40,.4)!important;transition:top .25s ease}
  /* a page with its own sticky bar under the header (filters, tabs…): this row stays in place, so the two never overlap */
  html.ch-lux.ch-catbar-m.ch-catbar-static body #ch-cat-nav{position:relative!important;top:auto!important;z-index:2!important}
  html.ch-lux.ch-catbar-m body #ch-cat-nav > :not(.w){display:none!important}            /* the desktop mega menu stays hidden here */
  html.ch-lux.ch-catbar-m body #ch-cat-nav .w{max-width:none!important;padding:0!important;margin:0!important}
  html.ch-lux.ch-catbar-m body #ch-cat-nav .cat-nav-list{display:flex!important;flex-wrap:nowrap!important;align-items:center!important;gap:8px!important;height:auto!important;min-height:0!important;
    padding:10px 12px!important;margin:0!important;overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;
    scrollbar-width:none;overscroll-behavior-x:contain;
    -webkit-mask-image:linear-gradient(90deg,#000 86%,transparent);mask-image:linear-gradient(90deg,#000 86%,transparent)}
  html.ch-lux[dir="rtl"].ch-catbar-m body #ch-cat-nav .cat-nav-list{-webkit-mask-image:linear-gradient(270deg,#000 86%,transparent);mask-image:linear-gradient(270deg,#000 86%,transparent)}
  html.ch-lux.ch-catbar-m body #ch-cat-nav .cat-nav-list::-webkit-scrollbar{display:none}
  html.ch-lux.ch-catbar-m body #ch-cat-nav .cat-nav-list > a{flex:0 0 auto!important;display:inline-flex!important;align-items:center!important;height:36px!important;padding:0 15px!important;
    border-radius:999px!important;background:#F4F4F6!important;border:1px solid #EDEDF1!important;color:#2A2C33!important;font-size:13.5px!important;font-weight:700!important;
    white-space:nowrap!important;text-decoration:none!important;scroll-snap-align:start}
  html.ch-lux.ch-catbar-m body #ch-cat-nav .cat-nav-list > a.active{background:linear-gradient(180deg,#FF7A1A,#E85400)!important;border-color:transparent!important;color:#fff!important;
    box-shadow:0 8px 16px -10px rgba(232,84,0,.8)!important}
  html.ch-lux.ch-catbar-m body #ch-cat-nav .cn-ind,
  html.ch-lux.ch-catbar-m body #ch-cat-nav .chv-more{display:none!important}
}
@media (prefers-reduced-motion:reduce){
  html.ch-lux body #ch-main-header .cat-btn,html.ch-lux body #ch-main-header .cat-btn > svg,html.ch-lux body #ch-main-header .act-cart .cart-ic{transition:none!important}
}

/* ═══════════════════════════════════════════════════════════════════════
   The top strip's windows — Temu-style: a soft coloured top with a round icon and the one message,
   then a few lines with their own icons, one button. Desktop: a small window. Phones: a bottom sheet.
   ═══════════════════════════════════════════════════════════════════════ */
.chhw{position:fixed;inset:0;z-index:2147483000;display:flex;align-items:center;justify-content:center;padding:20px;font-family:"Cairo",system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif;color:#222}
.chhw[hidden]{display:none!important}
.chhw *,.chhw *::before,.chhw *::after{box-sizing:border-box;text-transform:none;letter-spacing:normal}
.chhw svg{fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round;flex:none}
.chhw-bg{position:absolute;inset:0;background:rgba(0,0,0,.5);opacity:0;transition:opacity .2s ease}
.chhw.on .chhw-bg{opacity:1}
.chhw-box{position:relative;width:min(420px,100%);max-height:min(88vh,700px);display:flex;flex-direction:column;background:#fff;border-radius:18px;overflow:hidden;
  box-shadow:0 28px 70px -24px rgba(0,0,0,.5);opacity:0;transform:translateY(8px) scale(.98);transition:opacity .2s ease,transform .24s ease}
.chhw.on .chhw-box{opacity:1;transform:none}
.chhw-x{position:absolute;top:10px;inset-inline-end:10px;z-index:2;width:36px;height:36px;border:0;border-radius:50%;background:rgba(255,255,255,.85);color:#555;display:grid;place-items:center;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.chhw-x:hover{background:#fff;color:#111}
.chhw-pane{overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.chhw-pane[hidden]{display:none!important}
/* the soft top */
.chhw-top{display:flex;gap:14px;align-items:center;padding:24px 56px 20px 20px;background:linear-gradient(180deg,#E7F6E7 0%,#F5FBF5 70%,#fff 100%)}
.chhw[dir="rtl"] .chhw-top{padding:24px 20px 20px 56px}
.chhw-top.o{background:linear-gradient(180deg,#FFEBDB 0%,#FFF6EF 70%,#fff 100%)}
.chhw-badge{flex:none;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#0A8800;box-shadow:0 6px 16px -8px rgba(10,136,0,.55),0 0 0 4px rgba(255,255,255,.7)}
.chhw-top.o .chhw-badge{color:#FB6A00;box-shadow:0 6px 16px -8px rgba(251,106,0,.6),0 0 0 4px rgba(255,255,255,.7)}
.chhw-top h3{margin:0 0 3px;font-size:19px;font-weight:900;color:#1A1A1A;line-height:1.3}
.chhw-top p{margin:0;font-size:13.5px;font-weight:600;color:#4A4A4A;line-height:1.55}
.chhw-top p b{color:#0A7A00;font-weight:900}
.chhw-top.o p b{color:#E25500}
.chhw-in{padding:4px 20px 20px}
.chhw-pill{display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:6px 12px;border-radius:999px;background:#F5F5F5;font-size:12.5px;font-weight:600;color:#666}
.chhw-pill b{color:#222;font-weight:800}
/* the lines */
.chhw-list{list-style:none;margin:10px 0 0;padding:0}
.chhw-list li{display:flex;gap:12px;align-items:center;padding:11px 0}
.chhw-list li + li{border-top:1px solid #F2F2F2}
.chhw-ic{flex:none;width:38px;height:38px;border-radius:12px;display:grid!important;place-items:center;background:#F2F9F2;color:#0A8800}
.chhw-list b{display:block;font-size:14px;font-weight:800;color:#222;line-height:1.35}
.chhw-list li > div > span{display:block;font-size:12.5px;font-weight:500;color:#808080;line-height:1.5;margin-top:1px}
.chhw-note{margin:8px 0 0;font-size:11.5px;color:#9A9A9A;line-height:1.6}
.chhw-btn{display:flex;align-items:center;justify-content:center;width:100%;height:48px;margin-top:16px;border-radius:999px;background:#FB7701;color:#fff!important;font-size:15.5px;font-weight:800;text-decoration:none!important;border:0;cursor:pointer;box-shadow:0 8px 18px -10px rgba(251,119,1,.8)}
.chhw-btn:hover{background:#F06A00}
.chhw-link{display:block;margin-top:10px;text-align:center;font-size:13px;font-weight:700;color:#666!important;text-decoration:underline!important;text-underline-offset:3px}
/* the coupon */
.chhw-cpn{position:relative;display:flex;align-items:stretch;margin-top:6px;border-radius:14px;overflow:hidden;background:linear-gradient(135deg,#FF8A1F,#FB5B01);color:#fff;box-shadow:0 12px 24px -16px rgba(251,91,1,.9)}
.chhw-cpn::before,.chhw-cpn::after{content:"";position:absolute;top:50%;width:18px;height:18px;margin-top:-9px;border-radius:50%;background:#fff}
.chhw-cpn::before{left:-9px}.chhw-cpn::after{right:-9px}
.chhw-cpn-l{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;width:118px;padding:16px 10px;border-inline-end:2px dashed rgba(255,255,255,.55)}
.chhw-cpn-l b{font-size:36px;font-weight:900;line-height:1}
.chhw-cpn-l span{font-size:13px;font-weight:800;margin-top:4px}
.chhw-cpn-r{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:3px;padding:14px 16px}
.chhw-cpn-r strong{font-size:15.5px;font-weight:800}
.chhw-cpn-r small{font-size:12px;font-weight:600;opacity:.92;line-height:1.5}
.chhw-code{display:flex;align-items:center;gap:8px;margin-top:12px;padding:6px 6px 6px 14px;border:1.5px dashed #FB7701;border-radius:12px;background:#FFF8F2}
.chhw[dir="rtl"] .chhw-code{padding:6px 14px 6px 6px}
.chhw-code b{flex:1;min-width:0;font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-size:19px;font-weight:800;letter-spacing:.1em!important;color:#C24A00;direction:ltr;text-align:center}
.chhw-copy{flex:none;display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 16px;border:0;border-radius:999px;background:#222;color:#fff;font:inherit;font-size:13.5px;font-weight:800;cursor:pointer}
.chhw-copy.ok{background:#0A8800}
.chhw-terms{display:flex;flex-wrap:wrap;gap:6px 14px;margin:10px 2px 0;font-size:12px;color:#808080;font-weight:600}
.chhw-terms span{display:inline-flex;align-items:center;gap:5px}
.chhw-terms svg{color:#0A8800}
/* sections with a filled green tick (Temu's protection list) */
.chhw-secs{margin:6px 0 0;display:grid;gap:2px}
.chhw-sec{display:flex;gap:12px;align-items:flex-start;padding:13px 0}
.chhw-sec + .chhw-sec{border-top:1px solid #F2F2F2}
.chhw-tick{flex:none;width:24px;height:24px;margin-top:1px;border-radius:50%;display:grid;place-items:center;background:#0A8800;color:#fff;box-shadow:0 4px 10px -4px rgba(10,136,0,.6)}
.chhw-tick svg{stroke-width:3}
.chhw-sec b{display:block;font-size:14.5px;font-weight:800;color:#1A1A1A;line-height:1.4}
.chhw-sec > div > span{display:block;margin-top:2px;font-size:12.5px;font-weight:500;color:#7A7A7A;line-height:1.55}
/* card-security badges */
.chhw-badges{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.chhw-badges img{height:32px;width:auto;padding:4px 7px;border:1px solid #EDEDED;border-radius:6px;background:#fff;object-fit:contain}
/* the trust strip at the bottom of every window */
.chhw-trust{display:flex;justify-content:center;flex-wrap:wrap;gap:4px 16px;margin:14px -20px -20px;padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));background:#FAFAFA;border-top:1px solid #F0F0F0;font-size:11.5px;font-weight:700;color:#6B6B6B}
.chhw-trust span{display:inline-flex;align-items:center;gap:5px}
.chhw-trust svg{color:#0A8800}
.chhw-big{display:block;margin-top:2px;font-size:22px;font-weight:900;color:#0A7A00;line-height:1.2}
.chhw-top.o .chhw-big{color:#E25500}
@media (max-width:640px){
  .chhw{align-items:flex-end;padding:0}
  .chhw-trust{margin:14px -16px calc(-18px - env(safe-area-inset-bottom,0px))}
  .chhw-box{width:100%;max-height:90vh;border-radius:18px 18px 0 0;transform:translateY(100%);transition:transform .28s cubic-bezier(.2,.8,.2,1),opacity .15s}
  .chhw.on .chhw-box{transform:none}
  .chhw-box::before{content:"";position:absolute;top:7px;left:50%;z-index:3;width:38px;height:4px;margin-left:-19px;border-radius:4px;background:rgba(0,0,0,.15)}
  .chhw-in{padding:4px 16px calc(18px + env(safe-area-inset-bottom,0px))}
  .chhw-top{padding:26px 54px 18px 16px}
  .chhw[dir="rtl"] .chhw-top{padding:26px 16px 18px 54px}
}
@media (prefers-reduced-motion:reduce){.chhw-bg,.chhw-box{transition:none}}

/* ── compact: the same windows, tighter (smaller paddings, icons and type) ── */
.chhw-box{width:min(380px,100%);border-radius:16px}
.chhw-x{top:8px;width:32px;height:32px}
.chhw-top{gap:11px;padding:16px 46px 12px 16px}
.chhw[dir="rtl"] .chhw-top{padding:16px 16px 12px 46px}
.chhw-badge{width:42px;height:42px;box-shadow:0 5px 12px -7px rgba(10,136,0,.55),0 0 0 3px rgba(255,255,255,.7)}
.chhw-badge svg{width:21px;height:21px}
.chhw-top h3{font-size:16.5px;margin:0 0 1px}
.chhw-top p{font-size:12.5px;line-height:1.45}
.chhw-big{font-size:18px;margin-top:0}
.chhw-in{padding:2px 16px 14px}
.chhw-pill{padding:4px 10px;font-size:11.5px}
.chhw-secs{margin:4px 0 0;gap:0}
.chhw-sec{gap:10px;padding:7px 0}
.chhw-tick{width:19px;height:19px;margin-top:1px}
.chhw-tick svg{width:11px;height:11px}
.chhw-sec b{font-size:13.5px;line-height:1.35}
.chhw-sec > div > span{font-size:12px;line-height:1.45;margin-top:0}
.chhw-badges{gap:5px;margin-top:6px}
.chhw-badges img{height:24px;padding:3px 5px;border-radius:5px}
.chhw-note{margin:6px 0 0;font-size:11px;line-height:1.5}
.chhw-btn{height:42px;margin-top:10px;font-size:14.5px}
.chhw-link{margin-top:6px;font-size:12.5px}
.chhw-trust{gap:3px 12px;margin:10px -16px -14px;padding:8px 12px calc(8px + env(safe-area-inset-bottom,0px));font-size:11px}
.chhw-cpn{margin-top:2px}
.chhw-cpn-l{width:100px;padding:12px 8px}
.chhw-cpn-l b{font-size:30px}
.chhw-cpn-r{padding:10px 14px}
.chhw-cpn-r strong{font-size:14.5px}
.chhw-code{margin-top:10px;padding:4px 4px 4px 12px}
.chhw[dir="rtl"] .chhw-code{padding:4px 12px 4px 4px}
.chhw-code b{font-size:17px}
.chhw-copy{height:34px;padding:0 14px;font-size:13px}
.chhw-terms{margin-top:8px;font-size:11.5px}
@media (max-width:640px){
  .chhw-box{width:100%;border-radius:16px 16px 0 0}
  .chhw-top{padding:20px 46px 12px 14px}
  .chhw[dir="rtl"] .chhw-top{padding:20px 14px 12px 46px}
  .chhw-in{padding:2px 14px calc(12px + env(safe-area-inset-bottom,0px))}
  .chhw-trust{margin:10px -14px calc(-12px - env(safe-area-inset-bottom,0px))}
}

/* ═══════════════════════════════════════════════════════════════════════
   The home page's phone tab strip (For you · Men's Clothing …) — a solid bar
   • its edge fade made the bar itself see-through, so products showed behind the words → a white fade instead
   • its background now reaches both edges of the screen, and covers the hair-line gap above it when it sticks
   ═══════════════════════════════════════════════════════════════════════ */
@media (max-width:980px){
  html.ch-lux body #mob-tab-strip.cht-v2{-webkit-mask-image:none!important;mask-image:none!important;background:#fff!important;border-bottom:0!important;
    box-shadow:0 0 0 100vmax #fff,0 1px 0 100vmax #ECECEF!important;clip-path:inset(-6px -100vmax -1px -100vmax);gap:2px!important}
  /* the fades: white, pinned to the strip's edges, only when there is more to scroll that way */
  html.ch-lux body #mob-tab-strip.cht-v2::before,
  html.ch-lux body #mob-tab-strip.cht-v2::after{content:"";position:sticky;z-index:3;flex:0 0 36px;align-self:stretch;pointer-events:none;opacity:0;transition:opacity .2s ease}
  html.ch-lux body #mob-tab-strip.cht-v2::before{order:-1;inset-inline-start:-14px;margin-inline-end:-38px;background:linear-gradient(to right,#fff 35%,rgba(255,255,255,0))}
  html.ch-lux body #mob-tab-strip.cht-v2::after{order:99;inset-inline-end:-14px;margin-inline-start:-38px;background:linear-gradient(to left,#fff 35%,rgba(255,255,255,0))}
  html.ch-lux[dir="rtl"] body #mob-tab-strip.cht-v2::before{background:linear-gradient(to left,#fff 35%,rgba(255,255,255,0))}
  html.ch-lux[dir="rtl"] body #mob-tab-strip.cht-v2::after{background:linear-gradient(to right,#fff 35%,rgba(255,255,255,0))}
  html.ch-lux body #mob-tab-strip.cht-v2.more-start::before,
  html.ch-lux body #mob-tab-strip.cht-v2.more-end::after{opacity:1}
}

/* card-security badges: each image already carries its own frame — show it full, no second box around it */
.chhw-badges{gap:6px;margin-top:7px;align-items:center}
.chhw-badges img{height:30px!important;width:auto;padding:0!important;border:0!important;border-radius:5px!important;background:none!important;object-fit:contain;display:block}
@media (max-width:380px){.chhw-badges{gap:4px}.chhw-badges img{height:27px!important}}

/* ───────── CH-CART-CHIP v2 — the cart, tidy: the count sits on the orange icon's top corner, with room before the text (it used to
   land on the word «Cart»), the label and the count read as one clear block, the whole chip lifts on hover ───────── */
@media (min-width:981px){
  html.ch-lux body #ch-main-header .acts > .act-cart{gap:12px!important;padding-inline:8px 16px!important;border:1px solid #F0E6DC!important;background:linear-gradient(180deg,#FFFFFF,#FFF8F2)!important;
    box-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 18px -14px rgba(232,84,0,.45)!important}
  html.ch-lux body #ch-main-header .acts > .act-cart:hover{background:linear-gradient(180deg,#FFFFFF,#FFF1E6)!important;border-color:#FFD9BF!important;box-shadow:0 1px 2px rgba(16,24,40,.05),0 12px 22px -14px rgba(232,84,0,.55)!important}
  /* the count: a small dark circle on the icon's top corner — the text starts after it, never under it */
  html.ch-lux body #ch-main-header .act-cart #cart-badge{top:3px!important;inset-inline-start:36px!important;inset-inline-end:auto!important;
    min-width:20px!important;height:20px!important;padding:0 4px!important;line-height:16px!important;font-size:10.5px!important;z-index:2;box-sizing:border-box}
  /* label + count */
  html.ch-lux body #ch-main-header .act-cart .act-text{display:flex!important;flex-direction:column;align-items:flex-start;gap:0!important;min-width:0}
  html.ch-lux body #ch-main-header .act-cart .act-text .top{font-size:11px!important;font-weight:700!important;letter-spacing:.2px;color:#9A8F86!important;text-transform:none}
  html.ch-lux body #ch-main-header .act-cart .act-text .btm{font-size:14.5px!important;font-weight:900!important;color:#E24E00!important;letter-spacing:-.1px}
  html.ch-lux body #ch-main-header .act-cart .act-text .btm:empty{display:none}
}
@media (min-width:981px) and (max-width:1365px){
  html.ch-lux body #ch-main-header .acts > .act-cart{padding-inline:6px 12px!important;gap:10px!important}
  html.ch-lux body #ch-main-header .act-cart #cart-badge{top:2px!important;inset-inline-start:30px!important}
  html.ch-lux body #ch-main-header .act-cart .act-text .btm{font-size:13.5px!important}
}