/* cart.css — Promoitems RFQ quote-cart (desni drawer). Ovisi o promoitems.css (:root, .drawer, .btn). */
.pi-dl{display:grid;grid-template-columns:60px 1fr 22px;gap:11px;padding:13px 0;border-bottom:1px solid var(--linija);align-items:start}
.pi-dl:first-child{padding-top:2px}
.pi-dl-img{width:60px;height:60px;border:1px solid var(--linija);border-radius:9px;background:var(--papir);overflow:hidden;display:grid;place-items:center}
.pi-dl-img img{width:100%;height:100%;object-fit:contain;padding:4px}
.pi-dl-info{min-width:0}
.pi-dl-t{font-size:13px;font-weight:700;color:var(--tinta);line-height:1.25;display:block}
.pi-dl-t:hover{color:var(--navy)}
.pi-dl-attrs{display:flex;flex-wrap:wrap;gap:4px 8px;margin:5px 0 8px;font-size:11px;color:var(--celik)}
.pi-dl-attrs span{white-space:nowrap}
.pi-dl-proof{font-size:10.5px;color:var(--zelena);font-weight:600;margin-bottom:7px}
.pi-dl-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.pi-dl-step{display:inline-flex;align-items:center;border:1.5px solid var(--linija);border-radius:999px;overflow:hidden}
.pi-dl-step button{width:24px;height:26px;font-size:14px;font-weight:800;color:var(--navy);background:#fff}
.pi-dl-step button:hover{background:var(--papir)}
.pi-dl-step input{width:42px;height:26px;border:0;text-align:center;font-weight:700;font-size:12.5px;color:var(--tinta);outline:none}
.pi-dl-unit{font-size:12.5px;font-weight:800;color:var(--navy)}
.pi-dl-rm{width:22px;height:22px;border-radius:50%;background:var(--papir);color:var(--celik);font-size:15px;line-height:1;display:grid;place-items:center}
.pi-dl-rm:hover{background:#fff0e8;color:var(--crvena-d)}
.pi-dl-empty{font-size:13.5px;color:var(--celik);line-height:1.55;padding:10px 0}

/* drawer foot (sažetak + CTA) */
#drawer .drawer-foot{display:block}
.pi-dl-sum{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:13px;color:var(--celik);margin-bottom:4px}
.pi-dl-sum b{font-size:17px;font-weight:900;color:var(--navy)}
.pi-dl-ind{font-size:10.5px;color:var(--celik);margin-bottom:12px;line-height:1.45}

/* ============== CART + CHECKOUT PAGE ============== */
.qpage{background:var(--papir);padding:24px 0 60px;min-height:60vh}
.qcrumb{font-size:12.5px;color:var(--celik);margin-bottom:14px}
.qcrumb a{color:var(--navy);font-weight:600}
.qhead h1{font-size:clamp(24px,3vw,34px);font-weight:900;letter-spacing:-.02em}
.qhead .qsub{font-size:13px;color:var(--celik);font-family:var(--mono);margin-bottom:18px}
.qsteps{display:flex;gap:8px;align-items:center;margin-bottom:22px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;flex-wrap:wrap}
.qsteps b{display:flex;align-items:center;gap:7px;color:var(--tinta)}
.qsteps .n{width:20px;height:20px;border-radius:50%;background:var(--navy-d);color:#fff;display:grid;place-items:center;font-size:11px}
.qsteps .done .n{background:var(--zelena)}
.qsteps .todo{color:var(--celik)}.qsteps .todo .n{background:#c7cde3}
.qsteps .arrow{opacity:.5}
.qwrap{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:26px;align-items:start}
.qitems{background:#fff;border:1px solid var(--linija);border-radius:var(--rub);overflow:hidden}
.qitem{display:grid;grid-template-columns:96px 1fr auto;gap:16px;padding:18px;border-bottom:1px solid var(--linija);align-items:start}
.qitem:last-child{border-bottom:0}
.qimg{width:96px;height:96px;border-radius:11px;border:1px solid var(--linija);background:var(--papir);overflow:hidden;display:grid;place-items:center}
.qimg img{width:100%;height:100%;object-fit:contain;padding:6px}
.qinfo b{font-size:15px;font-weight:800;display:block;line-height:1.25}
.qinfo .qsku{font-family:var(--mono);font-size:11px;color:var(--celik);margin:3px 0 9px}
.qattrs{display:flex;flex-wrap:wrap;gap:7px 14px;font-size:12.5px;color:#41496f}
.qattrs .deco{color:var(--navy-d);font-weight:600}
.qitem .proof{margin-top:9px;font-size:11.5px;color:var(--zelena);font-family:var(--mono)}
.qright{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:9px;min-width:150px}
.qstep{display:inline-flex;align-items:center;border:1.5px solid var(--linija);border-radius:999px;overflow:hidden}
.qstep button{width:30px;height:32px;font-size:16px;font-weight:800;color:var(--navy);background:#fff}
.qstep button:hover{background:var(--papir)}
.qstep input{width:56px;height:32px;border:0;text-align:center;font-weight:700;font-size:13.5px;color:var(--tinta);outline:none}
.qunit{font-family:var(--mono);font-size:11px;color:var(--celik)}
.qline{font-size:16px;font-weight:900;color:var(--navy)}
.qrm{font-size:12px;color:var(--celik)}
.qrm:hover{color:var(--crvena-d)}
.qmore{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;flex-wrap:wrap;gap:10px}
.qmore a{font-size:13px;font-weight:700;color:var(--navy)}
.qsum{background:#fff;border:1px solid var(--linija);border-radius:var(--rub);padding:20px;position:sticky;top:14px}
.qsum h3{font-size:15px;font-weight:800;margin-bottom:14px}
.qsum .row{display:flex;justify-content:space-between;font-size:13.5px;padding:7px 0;color:#41496f}
.qsum .row.big{border-top:1px solid var(--linija);margin-top:8px;padding-top:14px;font-size:16px;font-weight:900;color:var(--tinta)}
.qsum .row.big b{color:var(--navy)}
.qsum .ind{font-family:var(--mono);font-size:10.5px;color:var(--celik);background:var(--papir);border-radius:9px;padding:9px 11px;margin:12px 0;line-height:1.5}
.qsum .btn{width:100%;margin-top:6px}
.qsum .assure{display:grid;gap:8px;margin-top:14px}
.qsum .assure span{font-family:var(--mono);font-size:11px;color:var(--celik);display:flex;align-items:center;gap:7px}
.qco{background:#fff;border:1px solid var(--linija);border-radius:var(--rub);padding:22px;margin-top:22px;display:none}
.qco.on{display:block}
.qco h3{font-size:17px;font-weight:900;margin-bottom:4px}
.qco .qcosub{font-size:13px;color:var(--celik);margin-bottom:18px}
.qtype{display:inline-flex;background:var(--papir);border-radius:999px;padding:4px;margin-bottom:18px}
.qtype button{padding:9px 18px;border-radius:999px;font-size:13.5px;font-weight:700;color:var(--celik)}
.qtype button.on{background:var(--navy-d);color:#fff}
.qgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.qfield{display:flex;flex-direction:column;gap:6px}
.qfield.full{grid-column:1/-1}
.qfield label{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--celik)}
.qfield label .req{color:var(--crvena)}
.qfield input,.qfield textarea,.qfield select{border:1.5px solid var(--linija);border-radius:11px;padding:11px 13px;font-size:14px;font-family:inherit;outline:none;color:var(--tinta);background:#fff}
.qfield input:focus,.qfield textarea:focus,.qfield select:focus{border-color:var(--navy)}
.qfield textarea{min-height:80px;resize:vertical}
.qart-btn{border:1.5px dashed var(--linija);border-radius:11px;padding:11px 16px;font-size:13.5px;font-weight:700;color:var(--navy);background:var(--papir)}
.qart-btn:hover{border-color:var(--navy)}
.qart-hint{font-size:11.5px;color:var(--celik);margin-top:6px;display:block}
.qgdpr{display:flex;align-items:flex-start;gap:10px;margin-top:18px;font-size:13px;color:#41496f;cursor:pointer}
.qgdpr input{width:18px;height:18px;margin-top:1px;accent-color:var(--navy)}
.qgdpr a{color:var(--navy);text-decoration:underline}
.qco-cta{display:flex;align-items:center;gap:14px;margin-top:20px;flex-wrap:wrap}
.qco-cta .btn-red{flex:1;min-width:240px;padding:16px;font-size:15.5px}
.qco-note{font-size:11.5px;color:var(--celik)}
.qerr{color:var(--crvena-d);font-size:12.5px;font-weight:600;margin-top:10px}
.qok{display:none;background:#fff;border:1px solid var(--linija);border-radius:var(--rub);padding:44px;text-align:center;max-width:620px;margin:0 auto}
.qok.on{display:block}
.qok .ic{width:64px;height:64px;border-radius:50%;background:#e5f7ef;color:var(--zelena);display:grid;place-items:center;margin:0 auto 18px;font-size:30px}
.qok h2{font-size:24px;font-weight:900;margin-bottom:10px}
.qok p{color:var(--celik);font-size:14.5px;max-width:440px;margin:0 auto 8px}
.qok .ref{font-family:var(--mono);font-size:12px;color:var(--navy);background:var(--papir);border-radius:9px;padding:8px 14px;display:inline-block;margin-top:14px}
.qempty{background:#fff;border:1px solid var(--linija);border-radius:var(--rub);padding:60px 24px;text-align:center;color:var(--celik)}
.qempty a{color:var(--navy);font-weight:700}
@media(max-width:920px){ .qwrap{grid-template-columns:1fr} .qsum{position:static} .qgrid{grid-template-columns:1fr} }

/* ============== QUICK-ADD (liste) ============== */
.qa-btn{display:inline-flex;align-items:center;gap:6px;width:100%;justify-content:center;margin-top:8px;padding:9px 12px;border-radius:999px;background:var(--navy-d);color:#fff;font-size:12.5px;font-weight:700;cursor:pointer;transition:.15s}
.qa-btn:hover{background:var(--navy)}
.qa-btn span{font-size:15px;line-height:1}
.qa-ov{position:fixed;inset:0;background:rgba(16,26,75,.55);z-index:9998;display:none;align-items:center;justify-content:center;padding:20px}
.qa-ov.on{display:flex}
.qa-modal{background:#fff;border-radius:16px;max-width:460px;width:100%;max-height:92vh;overflow:auto;position:relative;box-shadow:var(--sjena-jaka);padding:22px}
.qa-x{position:absolute;top:12px;right:14px;width:30px;height:30px;border-radius:50%;background:var(--papir);color:var(--celik);font-size:19px;line-height:1;cursor:pointer}
.qa-x:hover{background:#fff0e8;color:var(--crvena-d)}
.qa-load{padding:40px 10px;text-align:center;color:var(--celik)}
.qa-load a{color:var(--navy);font-weight:600}
.qa-head{display:flex;gap:14px;align-items:flex-start;margin-bottom:16px;padding-right:26px}
.qa-img{width:88px;height:88px;flex:none;border:1px solid var(--linija);border-radius:11px;background:var(--papir);display:grid;place-items:center;overflow:hidden}
.qa-img img{max-width:100%;max-height:100%;object-fit:contain;padding:5px}
.qa-ti b{font-size:16px;font-weight:800;color:var(--tinta);line-height:1.25;display:block}
.qa-brand{font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--navy);display:block;margin-top:3px}
.qa-price{font-size:15px;font-weight:800;color:var(--tinta);margin-top:6px}
.qa-price small{font-size:11px;font-weight:600;color:var(--celik)}
.qa-price span{font-size:11px;font-weight:600;color:var(--celik)}
.qa-req{font-size:13px;color:var(--navy);font-weight:700}
.qa-opt{margin-bottom:14px}
.qa-lbl{font-size:13px;font-weight:700;color:var(--tinta);margin-bottom:8px}
.qa-lbl b{color:var(--navy)}
.qa-lbl span{font-weight:500;color:var(--celik);font-size:11.5px}
.qa-sw{display:flex;gap:8px;flex-wrap:wrap}
.qa-swb{width:32px;height:32px;border-radius:9px;border:2px solid var(--linija);cursor:pointer;transition:.15s}
.qa-swb.on{border-color:var(--navy);box-shadow:0 0 0 2px rgba(33,104,192,.2)}
.qa-szgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:8px}
.qa-szrow{display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid var(--linija);border-radius:10px;padding:5px 6px 5px 11px}
.qa-szrow>span:first-child{font-weight:800;font-size:13px;color:var(--tinta)}
.qa-qty{display:inline-flex;align-items:center;border:1.5px solid var(--linija);border-radius:999px;overflow:hidden}
.qa-qty button{width:24px;height:30px;font-size:14px;font-weight:800;color:var(--navy);background:#fff;cursor:pointer}
.qa-qty button:hover{background:var(--papir)}
.qa-qty input{width:46px;height:30px;border:0;text-align:center;font-weight:700;font-size:12.5px;color:var(--tinta);outline:none}
.qa-min{font-size:11.5px;color:var(--celik);font-family:var(--mono);margin-left:9px}
.qa-total{margin-top:10px;font-size:13px;font-weight:700;color:var(--tinta)}
.qa-total b{color:var(--navy);font-size:15px}
.qa-total span{font-size:11px;font-weight:600;font-family:var(--mono);margin-left:8px;padding:2px 8px;border-radius:999px}
.qa-total span.ok{background:#e5f7ef;color:var(--zelena)}
.qa-total span.under{background:var(--papir);color:var(--celik)}
.qa-deco{font-size:12px;color:var(--navy-d);font-weight:600;background:var(--papir);border-radius:9px;padding:9px 12px;margin-bottom:14px}
.qa-deco span{color:var(--celik);font-weight:500}
.qa-cta{display:flex;align-items:center;gap:12px}
.qa-cta .btn-red{flex:1}
.qa-open{font-size:12.5px;font-weight:600;color:var(--navy);white-space:nowrap}
.qa-open:hover{text-decoration:underline}
@media(max-width:520px){ .qa-head{flex-wrap:wrap} }

/* detalj: qty stepper uz Add to quote */
.pd-qtyrow{display:flex;align-items:center;gap:12px;margin:2px 0 12px;flex-wrap:wrap}
.pd-qtyrow .lbl{font-size:13px;font-weight:700;color:var(--tinta)}
.pd-qty{display:inline-flex;align-items:center;border:1.5px solid var(--linija);border-radius:999px;overflow:hidden}
.pd-qty button{width:34px;height:38px;font-size:17px;font-weight:800;color:var(--navy);background:#fff}
.pd-qty button:hover{background:var(--papir)}
.pd-qty input{width:64px;height:38px;border:0;text-align:center;font-weight:700;font-size:15px;color:var(--tinta);outline:none}
.pd-qty-min{font-size:11.5px;color:var(--celik);font-family:var(--mono)}