/* ============================================================
   MODULE 3 — Cart (full-page workflow + header badge)
   ============================================================ */
/* header cart icon + animated counter badge */
#sh-cart{cursor:pointer;position:relative}
.sh-cart-bump{animation:sh-cart-bump .45s ease}
@keyframes sh-cart-bump{0%,100%{transform:none}30%{transform:scale(1.25) rotate(-8deg)}60%{transform:scale(1.1) rotate(6deg)}}
.sh-badge-pop{animation:sh-badge-pop .45s ease}
@keyframes sh-badge-pop{0%{transform:scale(.4);opacity:.3}55%{transform:scale(1.4)}100%{transform:scale(1);opacity:1}}

/* full cart page */
.sh-cartpage{max-width:1100px;margin:0 auto;padding:6px 0 44px}
.sh-cartpage__head h1{font-size:24px;color:var(--sh-navy);margin:0 0 18px}
.sh-cartpage__head h1 small{font-size:14px;color:var(--sh-muted);font-weight:600}
.sh-cartpage__grid{display:grid;grid-template-columns:1fr 320px;gap:24px;align-items:start}
@media(max-width:820px){.sh-cartpage__grid{grid-template-columns:1fr}}
.sh-cartpage__items{background:#fff;border:1px solid var(--sh-line);border-radius:14px;padding:6px 16px}
.sh-cartpage__summary{background:#fff;border:1px solid var(--sh-line);border-radius:14px;padding:18px;position:sticky;top:14px}
.sh-cartpage__summary h3{margin:0 0 14px;font-size:16px;color:var(--sh-navy)}
.sh-cartpage__checkout{width:100%;margin:12px 0 8px;padding:13px;font-size:15px}
.sh-cartpage__checkout:disabled{opacity:.55;cursor:not-allowed}
.sh-cartpage__cross{margin-top:30px}
.sh-cartpage__empty{text-align:center;padding:70px 16px;color:var(--sh-muted)}
.sh-cartpage__empty .big{font-size:54px;margin-bottom:8px}
.sh-cartpage__empty h2{color:var(--sh-ink);margin:0 0 6px}

/* legacy drawer styles below remain harmless (drawer disabled) */
.sh-cart__overlay{position:fixed;inset:0;z-index:900;background:rgba(10,16,35,.45);
  opacity:0;visibility:hidden;transition:.2s}
.sh-cart__overlay.open{opacity:1;visibility:visible}

.sh-cart{position:fixed;top:0;right:0;height:100%;width:420px;max-width:92vw;z-index:901;
  background:#fff;box-shadow:-12px 0 40px rgba(10,16,35,.25);transform:translateX(100%);
  transition:transform .26s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column}
.sh-cart.open{transform:none}

.sh-cart__head{display:flex;align-items:center;gap:10px;padding:16px 18px;border-bottom:1px solid var(--sh-line)}
.sh-cart__head h2{margin:0;font-size:18px;color:var(--sh-navy)}
.sh-cart__head .n{background:var(--sh-navy);color:#fff;font-size:12px;font-weight:700;border-radius:20px;padding:2px 9px}
.sh-cart__x{margin-left:auto;border:0;background:transparent;font-size:24px;cursor:pointer;color:var(--sh-muted)}
.sh-cart__x:hover{color:var(--sh-ink)}

.sh-cart__selall{display:flex;align-items:center;gap:9px;padding:10px 18px;font-size:13px;color:#444;border-bottom:1px solid var(--sh-line)}
.sh-cart__selall input{accent-color:var(--sh-navy);width:16px;height:16px}

.sh-cart__body{flex:1;overflow-y:auto;padding:6px 0}
.sh-cart__empty{text-align:center;color:var(--sh-muted);padding:60px 24px}
.sh-cart__empty .big{font-size:46px;margin-bottom:10px}

/* row */
.sh-row{display:flex;gap:11px;padding:14px 18px;border-bottom:1px solid var(--sh-line);position:relative;
  background:#fff;touch-action:pan-y}
.sh-row__check{accent-color:var(--sh-navy);width:18px;height:18px;margin-top:26px;flex:0 0 auto;cursor:pointer}
.sh-row__thumb{width:74px;height:74px;border-radius:10px;object-fit:cover;background:var(--sh-bg-soft);flex:0 0 auto}
.sh-row__main{flex:1;min-width:0}
.sh-row__name{font-size:14px;font-weight:600;line-height:1.3;margin:0 0 3px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sh-row__name .sh-mall{margin-right:5px}
.sh-row__var{font-size:12px;color:var(--sh-muted);margin-bottom:8px}
.sh-row__bottom{display:flex;align-items:center;justify-content:space-between;gap:8px}
.sh-row__price{font-weight:800;color:var(--sh-navy);font-size:15px}

/* qty stepper */
.sh-qty{display:inline-flex;align-items:center;border:1px solid var(--sh-line);border-radius:9px;overflow:hidden}
.sh-qty button{border:0;background:var(--sh-bg-soft);width:30px;height:30px;font-size:16px;cursor:pointer;color:var(--sh-navy)}
.sh-qty button:hover{background:#e9ecf5}
.sh-qty button:disabled{opacity:.4;cursor:not-allowed}
.sh-qty span{min-width:34px;text-align:center;font-weight:700;font-size:14px}

.sh-row__del{position:absolute;top:10px;right:14px;border:0;background:transparent;color:var(--sh-muted);
  cursor:pointer;font-size:16px;line-height:1;padding:4px}
.sh-row__del:hover{color:var(--sh-red)}
/* swipe-to-remove reveal (mobile) */
.sh-row.swiping{transition:transform .05s}
.sh-row.removing{transform:translateX(-110%)!important;opacity:0;transition:.25s}

.sh-cart__related{padding:14px 18px 24px;border-top:8px solid var(--sh-bg-soft)}
.sh-cart__related .sh-related__title{font-size:15px}
.sh-cart__related .sh-grid{grid-template-columns:repeat(2,1fr);gap:10px}
.sh-cart__related .sh-card__name{min-height:0;-webkit-line-clamp:2}

/* footer */
.sh-cart__foot{border-top:1px solid var(--sh-line);padding:14px 18px;background:#fff}
.sh-cart__line{display:flex;justify-content:space-between;font-size:13px;color:var(--sh-muted);margin-bottom:5px}
.sh-cart__total{display:flex;justify-content:space-between;align-items:baseline;margin:6px 0 12px}
.sh-cart__total b{font-size:13px;color:#444;font-weight:600}
.sh-cart__total .amt{font-size:22px;font-weight:800;color:var(--sh-navy)}
.sh-cart__total .amt small{font-size:12px;color:var(--sh-muted);font-weight:600;margin-left:5px}
.sh-cart__checkout{width:100%}
.sh-cart__checkout:disabled{opacity:.5;cursor:not-allowed}

@media(max-width:480px){ .sh-cart{width:100%} }