/* ====================================================================
   Module stremisequantite — Remise sur quantité (ShopTablouse) — v3
   Sélecteur propre (remplace le natif) + masquage complet du natif
   + pastilles sur une ligne + panneau dépliant.
   Classes préfixées .st-rq-.
   ==================================================================== */
:root{
  --strq-dark:#062A4D; --strq-blue:#24A0DC; --strq-red:#E8443A; --strq-green:#2e9e6b;
  --strq-muted:#6b7a8a; --strq-line:#e4e9ee; --strq-tint:#eef7fc; --strq-tintline:#cfe6f5;
}

/* Masquage COMPLET du sélecteur de quantité natif (input + tous les boutons touchspin) */
.st-rq-on .product-quantity .bootstrap-touchspin,
.st-rq-on .product-quantity .input-group,
.st-rq-on .product-quantity .input-group-btn-vertical,
.st-rq-on .product-quantity .btn-touchspin,
.st-rq-on .product-quantity .bootstrap-touchspin-up,
.st-rq-on .product-quantity .bootstrap-touchspin-down{ display:none !important; }

/* Masquage optionnel du tableau de remise natif */
.st-rq-hide-native .product-discounts,
.st-rq-hide-native #quantity_discount{ display:none !important; }

/* --- Sélecteur de quantité propre (hauteur calée sur le bouton en JS) --- */
.st-rq-stepper{ display:inline-flex; align-items:center; height:50px; border:1.5px solid #cdd9e2;
  border-radius:10px; overflow:hidden; background:#fff; vertical-align:middle; }
.st-rq-stepper button{ font-family:inherit; border:0; background:#fff; color:var(--strq-dark);
  width:44px; height:100%; font-size:20px; font-weight:600; line-height:1; cursor:pointer;
  display:flex; align-items:center; justify-content:center; transition:background .12s,color .12s; }
.st-rq-stepper button:hover{ background:var(--strq-tint); color:var(--strq-blue); }
.st-rq-stepper button:disabled{ opacity:.35; cursor:not-allowed; }
.st-rq-stepper .st-rq-val{ min-width:46px; text-align:center; font-size:17px; font-weight:800; color:var(--strq-dark); }

/* --- Pastilles : une seule ligne, largeur égale --- */
.st-rq-chips{ display:flex; gap:8px; flex-wrap:nowrap; margin:14px 0 4px; }
.st-rq-chip{ flex:1; text-align:center; font-family:inherit; font-size:12px; font-weight:600;
  border:1px solid var(--strq-tintline); background:#fff; color:var(--strq-dark); padding:9px 6px;
  border-radius:999px; cursor:pointer; transition:.12s; white-space:nowrap; }
.st-rq-chip:hover{ background:var(--strq-tint); border-color:var(--strq-blue); }
.st-rq-chip.is-active{ background:var(--strq-blue); border-color:var(--strq-blue); color:#fff; }
.st-rq-chip b{ color:var(--strq-red); font-weight:700; margin-left:3px; }
.st-rq-chip.is-active b{ color:#fff; }

/* --- Panneau dépliant --- */
.st-rq-panel{ background:#fff; border:1px solid var(--strq-tintline); border-radius:14px; overflow:hidden;
  box-shadow:0 8px 26px -18px rgba(6,42,77,.3); margin-top:18px; }
.st-rq-head{ display:flex; align-items:center; gap:13px; padding:15px 16px; cursor:pointer; user-select:none; }
.st-rq-ic{ flex:0 0 42px; width:42px; height:42px; border-radius:50%; background:#eaf6fd; display:flex; align-items:center; justify-content:center; }
.st-rq-ic svg{ width:20px; height:20px; }
.st-rq-tt{ flex:1; min-width:0; }
.st-rq-t1{ font-size:14px; font-weight:700; color:var(--strq-dark); line-height:1.25; }
.st-rq-t2{ font-size:12px; color:var(--strq-blue); margin-top:2px; font-weight:600; }
.st-rq-chev{ flex-shrink:0; width:20px; height:20px; color:var(--strq-muted); transition:transform .25s; transform:rotate(-90deg); }
.st-rq-panel.is-open .st-rq-chev{ transform:rotate(0); }
.st-rq-body{ display:none; padding:4px 16px 16px; border-top:1px solid #eef4f8; }
.st-rq-panel.is-open .st-rq-body{ display:block; }

.st-rq-pmsg{ display:flex; justify-content:space-between; gap:10px; font-size:13px; margin:16px 0 8px; }
.st-rq-pmsg .st-rq-cnt{ color:var(--strq-muted); font-size:11px; font-weight:600; white-space:nowrap; }
.st-rq-track{ height:10px; background:#dbe7f1; border-radius:999px; overflow:hidden; }
.st-rq-fill{ height:100%; width:0; background:linear-gradient(90deg,var(--strq-blue),#3fb8ef); border-radius:999px; transition:width .35s ease; }

.st-rq-tiers{ width:100%; border-collapse:collapse; font-size:13px; margin-top:18px; }
.st-rq-tiers th{ background:var(--strq-dark); color:#fff; font-weight:600; padding:9px 12px; text-align:left; }
.st-rq-tiers th:last-child, .st-rq-tiers td:last-child{ text-align:right; }
.st-rq-tiers td{ padding:9px 12px; border-bottom:1px solid #eef2f5; }
.st-rq-tiers tr:last-child td{ border-bottom:0; }
.st-rq-tiers tr.is-current td{ background:var(--strq-tint); font-weight:700; }
.st-rq-red{ color:var(--strq-red); font-weight:700; }

.st-rq-divider{ height:1px; background:#eef2f5; margin:16px 0; }
.st-rq-procta{ display:flex; gap:11px; flex-wrap:wrap; align-items:center; background:#fbfdff;
  border:1px solid #e7eef4; border-radius:11px; padding:13px; }
.st-rq-procta .st-rq-txt{ font-size:12px; color:var(--strq-muted); flex:1; min-width:150px; line-height:1.45; }
.st-rq-procta .st-rq-txt b{ color:var(--strq-dark); }
.st-rq-devis{ border:0; background:var(--strq-red); color:#fff; font-family:inherit; font-weight:700;
  font-size:13px; padding:11px 16px; border-radius:10px; cursor:pointer; white-space:nowrap;
  text-decoration:none; display:inline-block; }
.st-rq-devis:hover{ background:#d23a30; color:#fff; }

/* --- Badge stock & délai (à droite du bouton « Ajouter au panier ») --- */
.st-rq-stock{ display:inline-flex; flex-direction:column; justify-content:center; gap:3px;
  vertical-align:middle; margin-left:16px; }
.st-rq-stock-l1{ display:flex; align-items:center; gap:8px; font-size:14px; font-weight:700;
  color:var(--strq-dark); line-height:1.15; }
.st-rq-stock .st-rq-dot{ width:9px; height:9px; border-radius:50%; background:var(--strq-green);
  box-shadow:0 0 0 3px rgba(46,158,107,.18); flex-shrink:0; }
.st-rq-stock-l2{ font-size:12px; color:var(--strq-muted); }
@media (max-width:767px){
  .st-rq-line{ flex-wrap:wrap !important; }
  .st-rq-stock{ display:flex !important; flex:0 0 100% !important; width:100% !important;
    clear:both; margin:12px 0 0 !important; height:auto !important; }
}