/* ==========================================================================
   RFQ Quote Basket — drawer + trigger
   localStorage key: talhi_quote_v1
   ========================================================================== */

.q-fab{
  position:fixed;inset-block-end:5.2rem;inset-inline-end:1.1rem;z-index:91;
  display:none;align-items:center;gap:.5rem;background:var(--sika);color:var(--charcoal);
  border:0;border-radius:100px;padding:.7rem 1.15rem;font-family:var(--f-display);
  font-weight:800;font-size:.88rem;cursor:pointer;box-shadow:var(--shadow-lg);
}
.q-fab.on{display:flex}
.q-fab .q-n{
  background:var(--charcoal);color:var(--sika);border-radius:100px;
  min-width:22px;height:22px;display:flex;align-items:center;justify-content:center;
  font-size:.75rem;padding-inline:.35rem;
}
@media (max-width:600px){.q-fab{inset-block-end:4.6rem;inset-inline-end:.85rem}}

.q-scrim{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:110;opacity:0;visibility:hidden;transition:opacity .2s}
.q-scrim.on{opacity:1;visibility:visible}

.q-drawer{
  position:fixed;inset-block:0;inset-inline-end:0;z-index:111;
  width:min(430px,100%);background:var(--paper);display:flex;flex-direction:column;
  transform:translateX(105%);transition:transform .25s ease;box-shadow:var(--shadow-lg);
}
html[dir="rtl"] .q-drawer{transform:translateX(-105%)}
/* [hidden] must beat display:flex */
.q-drawer[hidden],.q-scrim[hidden]{display:none!important}
.q-drawer.on{transform:translateX(0)}
/* must out-specify html[dir=rtl] .q-drawer above */
html[dir="rtl"] .q-drawer.on{transform:translateX(0)}

.q-head{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1.1rem 1.25rem;background:var(--charcoal);color:#fff;flex:none;
}
.q-head h2{color:#fff;font-size:1.1rem;margin:0}
.q-head p{margin:.15rem 0 0;font-size:.8rem;color:#A8AEBA}
.q-x{background:none;border:0;color:#fff;font-size:1.7rem;line-height:1;cursor:pointer;padding:.15rem .45rem}

.q-body{flex:1;overflow-y:auto;padding:1.25rem}
.q-empty{text-align:center;color:var(--ink-3);padding:3rem 1rem;font-size:.93rem}

.q-item{display:flex;gap:.75rem;align-items:flex-start;padding:.85rem 0;border-bottom:1px solid var(--line)}
.q-item:last-child{border-bottom:0}
.q-item-b{flex:1;min-width:0}
.q-item b{display:block;font-family:var(--f-display);font-size:.93rem;margin-bottom:.15rem}
.q-item span{font-size:.78rem;color:var(--ink-3)}
.q-del{background:none;border:0;color:var(--ink-3);cursor:pointer;font-size:.8rem;text-decoration:underline;padding:.25rem;flex:none;align-self:flex-start}

.q-qty{margin-top:.55rem}
.q-qty label{display:block;font-size:.75rem;font-weight:600;color:var(--ink-2);margin-bottom:.25rem}
.q-qty .req{color:#C0392B}
.q-qty input{
  width:100%;padding:.5rem .65rem;border:1px solid var(--line);border-radius:var(--r);
  font:inherit;font-size:.88rem;background:var(--paper);color:var(--ink);min-height:38px;
}
.q-qty input:focus{border-color:var(--gold)}
.q-qty input.err{border-color:#C0392B;background:#FDECEA}
.q-qty input::placeholder{color:var(--ink-3);opacity:.8}
.q-del:hover{color:#C0392B}

.q-foot{flex:none;border-top:1px solid var(--line);padding:1.25rem;background:var(--mist)}
.q-foot .field{margin-bottom:.85rem}
.q-foot .btn{margin-bottom:.5rem}
.q-or{text-align:center;font-size:.78rem;color:var(--ink-3);margin:.5rem 0}

.q-add.added{background:var(--charcoal);color:#fff;border-color:var(--charcoal)}

.q-toast{
  position:fixed;inset-block-end:1.5rem;inset-inline-start:50%;transform:translateX(-50%) translateY(150%);
  background:var(--charcoal);color:#fff;padding:.8rem 1.3rem;border-radius:var(--r);
  font-size:.9rem;z-index:130;transition:transform .25s ease;box-shadow:var(--shadow-lg);
}
.q-toast.on{transform:translateX(-50%) translateY(0)}