/* ==========================================================================
   MODULE ACCÈS RAPIDE — styles scopés (.qa-root). Ne touche à rien hors de ce bloc.
   Reprend les jetons Axiom (axiom-tokens.css) s'ils sont déjà chargés dans la page,
   sinon retombe sur les mêmes valeurs que la fiche client, Achat et Réception.
   ========================================================================== */
.qa-root{
  --qa-ink: var(--axiom-ink, #16233F);
  --qa-orange: var(--axiom-orange, #E6702E);
  --qa-orange-soft: var(--axiom-orange-soft, rgba(230,112,46,.12));
  --qa-text: var(--axiom-text, #0F1525);
  --qa-text-2: var(--axiom-text-2, #434A61);
  --qa-muted: #8B93A3;
  --qa-line: #E7EAF1;
  --qa-line-2: #EDEFF4;
  --qa-bg: #F3F4F8;
  --qa-card: #FFFFFF;
  --qa-soft: #FBFBFD;
  --qa-soft-2: #F4F6FA;
  --qa-good-bg:#EAF5EE; --qa-good-text:#2F7A4C;
  --qa-info-bg:#ECEFF5; --qa-info-text:#20376B;
  --qa-warn-bg:#FBF1E6; --qa-warn-text:#9A5B14;
  --qa-bad-bg:#FBEBE8;  --qa-bad-text:#C4442A;
  --qa-sans: var(--axiom-font-sans, 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif);
  --qa-serif: var(--axiom-font-serif, 'Lora', Georgia, 'Iowan Old Style', serif);

  font-family: var(--qa-sans);
  color: var(--qa-text);
  background: var(--qa-bg);
}
.qa-root *{box-sizing:border-box}
.qa-hidden{display:none !important}
.qa-root button{font-family:inherit}
.qa-root :focus-visible{outline:2px solid var(--qa-orange);outline-offset:2px;border-radius:8px}

.qa-wrap{padding:8px 32px 30px;display:flex;flex-direction:column;gap:10px}

/* ---------- ligne d'accueil ---------- */
.qa-hello{display:flex;align-items:flex-end;gap:18px;flex-wrap:wrap}
.qa-hello h2{margin:0;font-family:var(--qa-serif);font-size:16px;font-weight:700;letter-spacing:-.01em}
.qa-hello p{margin:2px 0 0;font-size:11px;color:var(--qa-muted)}
.qa-kpis{margin-left:auto;display:flex;gap:10px;flex-wrap:wrap}
.qa-kpi{background:var(--qa-card);border:1px solid var(--qa-line);border-radius:12px;padding:10px 14px;min-width:126px;
  cursor:pointer;transition:border-color .12s}
.qa-kpi:hover{border-color:rgba(230,112,46,.45)}
.qa-kpi .l{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--qa-muted)}
.qa-kpi .v{font-family:var(--qa-serif);font-size:18px;font-weight:700;margin-top:3px;font-variant-numeric:tabular-nums}
.qa-kpi .v.amber{color:#BE7A2D} .qa-kpi .v.red{color:var(--qa-bad-text)} .qa-kpi .v.green{color:var(--qa-good-text)}

/* ---------- carte ---------- */
.qa-card{background:var(--qa-card);border:1px solid var(--qa-line);border-radius:16px;overflow:hidden;
  box-shadow:0 18px 36px -32px rgba(15,21,37,.5)}
.qa-card-h{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:12px 20px;
  border-bottom:1px solid var(--qa-line-2)}
.qa-card-h h3{margin:0;font-size:15px;font-weight:700}
.qa-card-h .qa-hint{font-size:12.5px;color:var(--qa-muted)}
.qa-seg{margin-left:auto;display:flex;background:var(--qa-soft-2);border:1px solid var(--qa-line);
  border-radius:10px;padding:3px}
.qa-seg button{border:0;background:transparent;font-size:12.5px;font-weight:600;color:var(--qa-text-2);
  padding:6px 13px;border-radius:7px;cursor:pointer}
.qa-seg button:hover{color:var(--qa-text)}
.qa-seg button.on{background:var(--qa-card);color:var(--qa-orange);box-shadow:0 1px 2px rgba(15,21,37,.12)}

.qa-sections{padding:4px 20px 16px}
.qa-sec-h{display:flex;align-items:center;gap:10px;margin:10px 0 7px}
.qa-sec-h span{font-size:10.5px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:var(--qa-muted)}
.qa-sec-h i{flex:1;height:1px;background:var(--qa-line-2)}

/* ---------- grille et tuiles ---------- */
.qa-grid{display:grid;gap:9px}
.qa-root[data-size="petit"]  .qa-grid{grid-template-columns:repeat(6,1fr)}
.qa-root[data-size="moyen"]  .qa-grid{grid-template-columns:repeat(4,1fr)}
.qa-root[data-size="grand"]  .qa-grid{grid-template-columns:repeat(3,1fr)}

.qa-tile{position:relative;display:flex;align-items:flex-start;gap:10px;background:var(--qa-card);
  border:1px solid var(--qa-line);border-radius:12px;padding:10px 12px;cursor:pointer;text-align:left;
  transition:border-color .12s, box-shadow .12s, transform .12s}
.qa-tile:hover{border-color:rgba(230,112,46,.5);box-shadow:0 14px 26px -20px rgba(15,21,37,.55);transform:translateY(-1px)}
.qa-tile .qa-ic{width:26px;height:26px;color:var(--qa-orange);
  display:flex;align-items:center;justify-content:center;flex:none;font-weight:800;font-size:11px}
.qa-tile .qa-ic svg{width:22px;height:22px}
.qa-tile .qa-mid{min-width:0;flex:1}
.qa-tile .qa-t{font-size:12.5px;font-weight:700;color:var(--qa-text);line-height:1.25}
.qa-tile .qa-m{font-size:11px;color:var(--qa-muted);margin-top:3px;line-height:1.3}
.qa-badge{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:800;border-radius:999px;
  padding:2px 7px;margin-top:5px}
.qa-badge.info{background:var(--qa-info-bg);color:var(--qa-info-text)}
.qa-badge.warn{background:var(--qa-warn-bg);color:var(--qa-warn-text)}
.qa-badge.bad{background:var(--qa-bad-bg);color:var(--qa-bad-text)}
.qa-badge.good{background:var(--qa-good-bg);color:var(--qa-good-text)}
.qa-badge.neutral{background:var(--qa-line-2);color:var(--qa-muted)}

.qa-go{position:absolute;right:12px;top:14px;color:#C9CFDB;opacity:0;transition:opacity .12s;pointer-events:none}
.qa-go svg{width:15px;height:15px;display:block}
.qa-tile:hover .qa-go{opacity:1;color:var(--qa-orange)}
.qa-kbd{position:absolute;right:12px;bottom:11px;font-size:9.5px;font-weight:800;color:#AEB5C2;
  border:1px solid var(--qa-line);border-bottom-width:2px;border-radius:4px;padding:0 4px;background:var(--qa-soft)}

/* retirer un favori */
.qa-rm{position:absolute;left:-7px;top:-7px;width:22px;height:22px;border-radius:50%;border:1px solid var(--qa-line);
  background:var(--qa-card);color:var(--qa-muted);display:flex;align-items:center;justify-content:center;
  cursor:pointer;opacity:0;transition:opacity .12s;box-shadow:0 2px 6px rgba(15,21,37,.18);padding:0;line-height:1}
.qa-rm svg{width:11px;height:11px}
.qa-tile:hover .qa-rm{opacity:1}
.qa-rm:hover{border-color:var(--qa-bad-text);color:var(--qa-bad-text);background:var(--qa-bad-bg)}

/* taille « petit » : même mise en page que « moyen » (icône à gauche, nom à droite), juste
   plus compacte — pas d'empilement icône-au-dessus-du-nom (ça donnait des cartes carrées). */
.qa-root[data-size="petit"] .qa-tile{align-items:center;gap:8px;padding:7px 9px}
.qa-root[data-size="petit"] .qa-tile .qa-ic{width:18px;height:18px}
.qa-root[data-size="petit"] .qa-tile .qa-ic svg{width:16px;height:16px}
.qa-root[data-size="petit"] .qa-tile .qa-m,
.qa-root[data-size="petit"] .qa-tile .qa-badge,
.qa-root[data-size="petit"] .qa-kbd{display:none}
.qa-root[data-size="petit"] .qa-tile .qa-t{font-size:10.5px}
.qa-root[data-size="petit"] .qa-dot{position:absolute;top:6px;right:6px;width:6px;height:6px;border-radius:50%}

/* taille « grand » : plus d'air, compteur en gros */
.qa-root[data-size="grand"] .qa-tile{padding:18px 19px;gap:14px}
.qa-root[data-size="grand"] .qa-tile .qa-ic{width:46px;height:46px;border-radius:13px}
.qa-root[data-size="grand"] .qa-tile .qa-ic svg{width:22px;height:22px}
.qa-root[data-size="grand"] .qa-tile .qa-t{font-size:15px}
.qa-root[data-size="grand"] .qa-tile .qa-m{font-size:12.5px}

/* pastille d'état en mode « petit » */
.qa-dot{display:none}
.qa-dot.info{background:var(--qa-info-text)} .qa-dot.warn{background:var(--qa-warn-text)}
.qa-dot.bad{background:var(--qa-bad-text)}   .qa-dot.good{background:var(--qa-good-text)}
.qa-root[data-size="petit"] .qa-dot{display:block}

/* glisser-déposer */
.qa-tile[draggable="true"]{user-select:none}
.qa-tile.qa-dragging{opacity:.4}
.qa-tile.qa-over{border-color:var(--qa-orange);box-shadow:inset 0 0 0 2px var(--qa-orange-soft)}

/* tuile « ajouter » */
.qa-add{border-style:dashed;border-color:#D7DCE6;background:var(--qa-soft);align-items:center;
  justify-content:center;color:var(--qa-muted);font-size:13px;font-weight:600;gap:8px;min-height:86px}
.qa-add .qa-ic{background:#EFF2F7;color:#98A0B0;width:30px;height:30px;border-radius:9px}
.qa-add:hover{border-color:var(--qa-orange);color:var(--qa-orange);box-shadow:none;transform:none}
.qa-add:hover .qa-ic{background:var(--qa-orange-soft);color:var(--qa-orange)}
.qa-add.qa-over{background:var(--qa-orange-soft);border-color:var(--qa-orange);color:var(--qa-orange)}

/* pied de carte */
.qa-foot{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12px;color:var(--qa-muted);
  padding:14px 20px;background:#FAFBFC;border-top:1px solid var(--qa-line-2)}
.qa-foot svg{width:14px;height:14px;opacity:.7}
.qa-foot .k{font-size:10.5px;border:1px solid var(--qa-line);border-bottom-width:2px;border-radius:4px;
  padding:1px 5px;color:var(--qa-text-2);background:var(--qa-card);font-weight:700}

/* ---------- sélecteur de favoris ---------- */
.qa-picker{border-top:1px solid var(--qa-line-2);background:var(--qa-soft);padding:16px 20px 20px}
.qa-picker-h{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.qa-picker-h b{font-size:13.5px}
.qa-picker-h .qa-close{margin-left:auto;border:1px solid var(--qa-line);background:var(--qa-card);
  border-radius:8px;font-size:12px;font-weight:600;color:var(--qa-text-2);padding:5px 11px;cursor:pointer}
.qa-picker-h .qa-close:hover{color:var(--qa-text)}
.qa-pick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.qa-pick{display:flex;align-items:center;gap:10px;background:var(--qa-card);border:1px solid var(--qa-line);
  border-radius:11px;padding:10px 12px;cursor:pointer;text-align:left;font-size:13px;font-weight:600;
  color:var(--qa-text)}
.qa-pick:hover{border-color:var(--qa-orange);color:var(--qa-orange)}
.qa-pick .qa-ic{width:30px;height:30px;border-radius:9px}
.qa-pick .qa-ic svg{width:16px;height:16px}
.qa-pick[disabled]{opacity:.45;cursor:default}
.qa-pick[disabled]:hover{border-color:var(--qa-line);color:var(--qa-text)}
.qa-pick-group{grid-column:1/-1;font-size:10.5px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;
  color:var(--qa-muted);margin-top:6px}

.qa-empty{padding:40px 20px;text-align:center;color:var(--qa-muted);font-size:13.5px}
.qa-empty b{display:block;color:var(--qa-text-2);font-size:14px;margin-bottom:5px}

@media (max-width:1280px){
  .qa-root[data-size="petit"] .qa-grid{grid-template-columns:repeat(4,1fr)}
  .qa-root[data-size="moyen"] .qa-grid{grid-template-columns:repeat(3,1fr)}
  .qa-root[data-size="grand"] .qa-grid{grid-template-columns:repeat(2,1fr)}
  .qa-pick-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:820px){
  .qa-wrap{padding:18px 16px 46px}
  .qa-root[data-size="petit"] .qa-grid{grid-template-columns:repeat(2,1fr)}
  .qa-root[data-size="moyen"] .qa-grid,
  .qa-root[data-size="grand"] .qa-grid{grid-template-columns:1fr}
  .qa-pick-grid{grid-template-columns:1fr}
  .qa-kpis{margin-left:0;width:100%}
}
@media (prefers-reduced-motion: reduce){
  .qa-tile{transition:none}
  .qa-tile:hover{transform:none}
}