/* =====================================================================
   КанцлерПРО — стили страницы cart.html
   Подключается после css/main.css
   ===================================================================== */
.crumbs{display:flex;gap:8px;align-items:center;font-size:.84rem;color:var(--muted);padding:20px 0 0;flex-wrap:wrap}
.crumbs a:hover{color:var(--brand)}
.crumbs span{color:#B5B7BE}
.shp section{padding:0}
.shp section.box{padding:22px}
.shp{padding-bottom:72px}
.sh-head{display:flex;justify-content:space-between;align-items:end;gap:16px;flex-wrap:wrap;padding:18px 0 22px}
.sh-head h1{font-size:clamp(1.7rem,3.2vw,2.4rem);font-weight:800;line-height:1.15}
.sh-head h1 small{font-family:var(--f-b);font-size:1rem;font-weight:500;color:var(--muted);margin-left:10px}
.lnk{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-size:.9rem;font-weight:500;padding:0 6px;height:40px}
.lnk:hover{color:var(--brand)}
.sh-grid{display:grid;grid-template-columns:minmax(0,1fr) 370px;gap:24px;align-items:start}
.box{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px}
.sumbox{position:sticky;top:80px}
.sumbox h2{font-size:1.15rem;font-weight:800;margin-bottom:14px}
.srow{display:flex;justify-content:space-between;gap:12px;padding:7px 0;font-size:.93rem}
.srow span{color:var(--muted)}
.srow.save b{color:var(--ok)}
.srow.total{border-top:1px solid var(--line);margin-top:8px;padding-top:14px;font-size:1.05rem}
.srow.total span{color:var(--ink);font-weight:700}
.srow.total b{font-family:var(--f-h);font-size:1.45rem;font-weight:800}
.dlv{background:var(--bg);border-radius:12px;padding:12px 14px;margin:12px 0 16px;font-size:.85rem}
.dlv .bar{height:6px;border-radius:3px;background:#E1E2E6;margin-top:8px;overflow:hidden}
.dlv .bar i{display:block;height:100%;background:var(--brand);border-radius:3px;transition:width .3s}
.dlv .bar i.full{background:var(--ok)}
.dlv b{font-weight:700}
.sumbox .btn{width:100%;height:52px}
.sumbox .note{font-size:.8rem;color:var(--muted);margin-top:12px;text-align:center;line-height:1.5}
.lockv{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-size:.86rem}
.auth-note{display:flex;align-items:center;gap:12px;background:var(--brand-l);border-radius:14px;padding:12px 16px;margin-bottom:18px;font-size:.92rem}
.auth-note b{color:var(--brand)}
.auth-note .btn{height:38px;margin-left:auto;flex:none}
body.auth .auth-note{display:none}
.kp-empty{width:100%;background:#fff;border:1px solid var(--line);border-radius:20px;padding:56px 24px;text-align:center}
.kp-empty .ei{width:76px;height:76px;border-radius:22px;background:var(--brand-l);color:var(--brand);display:grid;place-items:center;margin:0 auto 18px}
.kp-empty h2{font-size:1.35rem;font-weight:800;margin-bottom:8px}
.kp-empty p{color:var(--muted);max-width:460px;margin:0 auto 22px}
.kp-empty .acts{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.kp-empty .acts .btn{height:48px;padding:0 22px}
.kp-empty .demo{display:block;margin:16px auto 0;color:var(--muted);font-size:.86rem;text-decoration:underline;text-underline-offset:3px}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);background:var(--ink);color:#fff;padding:12px 18px;border-radius:10px;font-size:.88rem;box-shadow:var(--sh-m);opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;z-index:90;max-width:calc(100% - 32px)}
.toast.on{opacity:1;transform:translate(-50%,0)}
.stk{font-size:.78rem;font-weight:600;display:inline-flex;align-items:center;gap:6px}
.stk::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.stk.in{color:var(--ok)}.stk.low{color:#C27C0E}.stk.ord{color:var(--muted)}
@media (max-width:1060px){.sh-grid{grid-template-columns:1fr}.sumbox{position:static}}
@media (max-width:720px){.box,.shp section.box{padding:16px}.auth-note{flex-wrap:wrap}.auth-note .btn{width:100%;margin:0}}

.clist{padding:6px 22px}
.ci{display:grid;grid-template-columns:96px minmax(0,1fr) 150px 120px 40px;gap:16px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}
.ci:last-child{border-bottom:0}
.ci .im{width:96px;height:72px;border-radius:10px;background:linear-gradient(180deg,#FAFAFB 0%,#EEEFF2 100%);display:grid;place-items:center;overflow:hidden}
.ci .im .pimg{width:92%;height:auto}
.ci h3{font-size:.95rem;font-weight:600;line-height:1.35;margin:2px 0 6px}
.ci h3 a:hover{color:var(--brand)}
.ci .meta{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;font-size:.8rem;color:var(--muted)}
.ci .tierh{display:inline-block;margin-top:6px;font-size:.78rem;color:var(--ok);font-weight:600}
.ci .tierh.up{color:#9A6A00}
.ci .tierh button{color:inherit;text-decoration:underline;text-underline-offset:2px;font-weight:700}
.qty{display:flex;align-items:center;border:1px solid var(--line);border-radius:10px;height:42px;overflow:hidden;background:#fff}
.qty button{width:38px;height:100%;font-size:1.1rem;color:var(--ink);flex:none}
.qty button:hover{background:var(--bg)}
.qty button:disabled{color:#C3C5CB;background:none;cursor:not-allowed}
.qty input{width:100%;min-width:0;border:0;text-align:center;font-weight:600;font-size:.95rem;outline:none;-moz-appearance:textfield;background:none}
.qty input::-webkit-inner-spin-button{-webkit-appearance:none}
.ci .qh{font-size:.74rem;color:var(--muted);text-align:center;margin-top:4px}
.ci .sum{text-align:right}
.ci .sum b{display:block;font-family:var(--f-h);font-size:1.05rem;font-weight:800}
.ci .sum small{font-size:.78rem;color:var(--muted)}
.ci .acts{display:flex;flex-direction:column;gap:6px}
.ci .acts button{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:var(--muted);border:1px solid transparent}
.ci .acts button:hover{color:var(--brand);border-color:var(--line)}
.ci .acts button.on{color:var(--brand)}
.ci .acts button.on svg path{fill:currentColor}
.ctool{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 22px;border-bottom:1px solid var(--line)}
.ctool b{font-size:.95rem}
.ctool .r{display:flex;gap:4px;flex-wrap:wrap}
.cart-main{padding:0}
@media (max-width:720px){
  .clist{padding:0 16px}.ctool{padding:12px 16px}
  .ci{grid-template-columns:72px minmax(0,1fr) auto 36px;grid-template-areas:"im info info acts" "q q sum sum";gap:10px 12px}
  .ci .im{width:72px;height:56px;grid-area:im}.ci .info{grid-area:info}.ci .qbox{grid-area:q;max-width:170px;width:100%}.ci .sum{grid-area:sum;align-self:center}.ci .acts{grid-area:acts;align-self:start}
  }