/* ===== cart, checkout, account, misc CSS ===== */
.errtxt{color:var(--red);font-size:12px;font-weight:600;margin-top:5px;display:block}

/* ---------- cart ---------- */
.cart-layout{display:grid;grid-template-columns:1fr 360px;gap:34px;align-items:start;padding-bottom:0}
.cart-table{border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.cart-thead{display:grid;grid-template-columns:1fr 130px 150px 110px;gap:16px;padding:14px 22px;background:var(--bg-2);font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.cart-row{display:grid;grid-template-columns:1fr 130px 150px 110px;gap:16px;padding:20px 22px;border-top:1px solid var(--line-2);align-items:center}
.cart-prod{display:flex;gap:16px;align-items:center}
.cart-prod img{width:88px;height:88px;border-radius:var(--r-md);object-fit:cover;cursor:pointer;flex-shrink:0}
.cart-tot{font-weight:900;font-size:17px;text-align:right}
.cart-summary{position:sticky;top:120px;background:var(--bg-2);border-radius:var(--r-lg);padding:24px}
.coupon{display:flex;gap:8px}
.coupon .inp{flex:1}
.sum-lines{margin:18px 0 0;display:grid;gap:10px}
.sum-line{display:flex;justify-content:space-between;font-size:14.5px;color:var(--ink-2)}
.sum-total{display:flex;justify-content:space-between;align-items:center;padding:16px 0;margin-top:14px;border-top:2px solid var(--ink);font-size:17px}
.sum-total b{font-size:24px;font-weight:900}
.sum-trust{display:flex;align-items:center;gap:8px;justify-content:center;font-size:12.5px;color:var(--muted);margin-top:14px}
.cart-pay{display:flex;gap:7px;justify-content:center;margin-top:14px;flex-wrap:wrap}
.cart-paychip{background:#fff;border:1px solid var(--line);border-radius:6px;padding:5px 9px;font-size:10px;font-weight:800;color:var(--ink-2);letter-spacing:.02em}
@media(max-width:560px){
  .cart-thead{display:none}
  .cart-row{grid-template-columns:1fr;gap:10px;position:relative}
  .cart-price,.cart-tot{text-align:left}
  .cart-price::before,.cart-row [data-l]::before{content:attr(data-l) ': ';font-weight:600;color:var(--muted);font-size:13px}
  .cart-tot{font-size:18px}
}
@media(max-width:900px){.cart-layout{grid-template-columns:1fr}.cart-summary{position:static}}

/* ---------- checkout ---------- */
.co-top{display:flex;align-items:center;justify-content:space-between;padding:22px 0;border-bottom:1px solid var(--line)}
.co-secure{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--muted)}
.co-title{font-family:var(--display);font-weight:600;font-size:40px;letter-spacing:0;margin:16px 0 26px}
.co-section.co-open{border-color:var(--line);box-shadow:var(--sh-1)}
.co-section.co-open .co-num{background:var(--red);color:#fff}
.co-section.co-open .co-sechead{cursor:default}
.co-place{margin-top:18px;font-size:16px}
.co-steps{display:flex;gap:8px;padding:24px 0 4px;flex-wrap:wrap}
.co-step{display:flex;align-items:center;gap:9px;font-weight:600;font-size:14px;color:var(--muted-2);flex:1;min-width:120px}
.co-step span{width:28px;height:28px;border-radius:50%;background:var(--bg-3);display:grid;place-items:center;font-size:13px;font-weight:700;flex-shrink:0}
.co-step.on{color:var(--ink)}.co-step.on span{background:var(--red);color:#fff}
.co-step.ok{color:var(--ink)}.co-step.ok span{background:var(--green);color:#fff}
.co-layout{display:grid;grid-template-columns:1fr 380px;gap:40px;align-items:start;margin-top:24px;min-width:0}
.co-main{display:grid;gap:14px;min-width:0}
.co-main .field,.co-grid2,.co-grid2 .field{min-width:0}
.co-radio>span{min-width:0}
.co-section{border:1.5px solid var(--line);border-radius:var(--r-lg);overflow:hidden;transition:.2s}
.co-section.active{border-color:var(--ink);box-shadow:var(--sh-2)}
.co-section.done{background:var(--bg-2)}
.co-sechead{display:flex;align-items:center;gap:14px;padding:18px 22px;cursor:pointer}
.co-section.done .co-sechead{cursor:pointer}
.co-num{width:30px;height:30px;border-radius:50%;background:var(--bg-3);display:grid;place-items:center;font-weight:800;font-size:14px;flex-shrink:0}
.co-section.active .co-num{background:var(--red);color:#fff}
.co-section.done .co-num{background:var(--green);color:#fff}
.co-sechead h3{font-size:17px;font-weight:800;flex:1}
.co-edit{font-size:13px;font-weight:600;color:var(--red)}
.co-secbody{padding:0 22px 24px}
.co-secsummary{padding:0 22px 18px 66px;font-size:14px;color:var(--ink-2);margin-top:-6px}
.co-grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.co-radio{display:flex;align-items:center;gap:14px;padding:16px 18px;border:1.5px solid var(--line);border-radius:var(--r-md);cursor:pointer;transition:.14s}
.co-radio.on{border-color:var(--red);background:var(--red-tint)}
.co-radio input{position:absolute;opacity:0}
.co-radio-dot{width:20px;height:20px;border-radius:50%;border:2px solid var(--line);flex-shrink:0;position:relative;transition:.14s}
.co-radio.on .co-radio-dot{border-color:var(--red)}
.co-radio.on .co-radio-dot::after{content:'';position:absolute;inset:3px;border-radius:50%;background:var(--red)}
.co-card{margin-top:16px;padding:18px;background:var(--bg-2);border-radius:var(--r-md)}
.co-summary{position:sticky;top:24px;border:1px solid var(--line);border-radius:var(--r-lg);padding:22px;background:#fff}
.co-items{display:grid;gap:14px;max-height:300px;overflow-y:auto;padding:8px 9px 14px;border-bottom:1px solid var(--line-2)}
.co-item{display:flex;gap:12px;align-items:center}
.co-item-img{position:relative;flex-shrink:0}
.co-item-img img{width:54px;height:54px;border-radius:var(--r-sm);object-fit:cover}
.co-item-qty{position:absolute;top:-7px;right:-7px;background:var(--ink);color:#fff;font-size:11px;font-weight:700;min-width:20px;height:20px;border-radius:10px;display:grid;place-items:center;padding:0 5px}
@media(max-width:900px){
  .co-layout{grid-template-columns:1fr}
  .co-summary{position:static;order:-1}
}

/* order confirmation */
.oc-card{max-width:680px;margin:0 auto;text-align:center;padding:20px}
.oc-check{width:84px;height:84px;border-radius:50%;background:var(--green);display:grid;place-items:center;margin:0 auto 24px;animation:fadeUp .4s var(--ease)}
.oc-meta{display:flex;justify-content:center;gap:0;margin:30px 0;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.oc-meta>div{flex:1;padding:18px;border-right:1px solid var(--line)}
.oc-meta>div:last-child{border:none}
.oc-meta span{display:block;font-size:12px;color:var(--muted);margin-bottom:5px}
.oc-meta b{font-size:17px;font-weight:800}
.oc-track{display:flex;justify-content:space-between;max-width:520px;margin:0 auto 30px;position:relative}
.oc-track::before{content:'';position:absolute;top:15px;left:10%;right:10%;height:2px;background:var(--line)}
.oc-tstep{display:flex;flex-direction:column;align-items:center;gap:8px;position:relative;z-index:2}
.oc-tstep span{width:32px;height:32px;border-radius:50%;background:#fff;border:2px solid var(--line);display:grid;place-items:center;font-weight:700;font-size:13px;color:var(--muted)}
.oc-tstep b{font-size:12px;color:var(--muted);font-weight:600}
.oc-tstep.on span{background:var(--green);border-color:var(--green);color:#fff}
.oc-tstep.on b{color:var(--ink)}
@media(max-width:560px){.oc-meta{flex-direction:column}.oc-meta>div{border-right:none;border-bottom:1px solid var(--line)}.oc-track b{font-size:10px}}

/* ---------- account / auth ---------- */
.auth-wrap{max-width:460px;margin:40px auto;padding:0 16px}
.auth-card{border:1px solid var(--line);border-radius:var(--r-xl);padding:36px}
.auth-tabs{display:flex;background:var(--bg-2);border-radius:var(--r-full);padding:5px;margin-bottom:26px}
.auth-tabs button{flex:1;padding:11px;border-radius:var(--r-full);font-weight:700;font-size:14px;color:var(--muted);transition:.16s}
.auth-tabs button.on{background:#fff;color:var(--ink);box-shadow:var(--sh-1)}
.acc-layout{display:grid;grid-template-columns:240px 1fr;gap:34px;align-items:start}
.acc-nav{border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;position:sticky;top:120px}
.acc-navitem{display:flex;align-items:center;gap:12px;padding:14px 18px;font-weight:600;font-size:14.5px;border-bottom:1px solid var(--line-2);cursor:pointer;color:var(--ink-2)}
.acc-navitem:last-child{border:none}
.acc-navitem.on{background:var(--red-tint);color:var(--red)}
.acc-navitem:hover:not(.on){background:var(--bg-2)}
.acc-stat{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:24px}
.acc-statcard{border:1px solid var(--line);border-radius:var(--r-lg);padding:20px}
.acc-statcard b{font-size:28px;font-weight:900;display:block}
.acc-statcard span{font-size:13px;color:var(--muted)}
.order-card{border:1px solid var(--line);border-radius:var(--r-lg);padding:20px;margin-bottom:14px}
.order-head{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;padding-bottom:14px;border-bottom:1px solid var(--line-2);margin-bottom:14px}
.order-imgs{display:flex;gap:8px}
.order-imgs img{width:54px;height:54px;border-radius:var(--r-sm);object-fit:cover}
.st-badge{font-size:12px;font-weight:700;padding:5px 11px;border-radius:var(--r-full)}
@media(max-width:780px){.acc-layout{grid-template-columns:1fr}.acc-nav{position:static;display:flex;overflow-x:auto}.acc-navitem{border-bottom:none;border-right:1px solid var(--line-2);white-space:nowrap}.acc-stat{grid-template-columns:1fr}}

/* compare */
.cmp-table{width:100%;border-collapse:collapse;font-size:14px}
.cmp-table th,.cmp-table td{border:1px solid var(--line);padding:16px;text-align:left;vertical-align:top}
.cmp-table thead td{border:none}
.cmp-th{background:var(--bg-2);font-weight:700;width:160px}
.cmp-prodimg{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:var(--r-md);margin-bottom:10px}

/* contact / about */
.contact-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:40px;align-items:start}
.contact-info{display:grid;gap:18px}
.ci-item{display:flex;gap:14px;align-items:flex-start}
.ci-item .ti-ic{width:46px;height:46px}
.map-box{border-radius:var(--r-lg);overflow:hidden;height:220px;background:var(--bg-3);position:relative;margin-top:8px}
@media(max-width:780px){.contact-grid{grid-template-columns:1fr}}
.about-hero{border-radius:var(--r-xl);overflow:hidden;position:relative;height:340px;display:flex;align-items:flex-end;padding:44px}
.about-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.about-hero::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent,rgba(17,17,17,.78))}
.about-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center;margin:40px 0}
.about-stats b{font-size:42px;font-weight:900;color:var(--red);display:block}
@media(max-width:680px){.about-stats{grid-template-columns:1fr 1fr}}