/* ============================================================================
   STOCKERIA — design system propre, orienté "poste de travail" de gestion.
   Principes : densité, lisibilité des chiffres, tableaux triables, maître-détail,
   couleur réservée au sens (statut, action), jamais décorative.
   ========================================================================= */

:root {
  /* --- Neutres (base graphite) --- */
  --n-0:  #ffffff;
  --n-25: #fbfbfc;
  --n-50: #f6f7f9;
  --n-100:#eef0f3;
  --n-150:#e4e7ec;
  --n-200:#d7dbe2;
  --n-300:#b9c0cb;
  --n-400:#8d96a5;
  --n-500:#6b7484;
  --n-600:#4d5665;
  --n-700:#39414e;
  --n-800:#252c37;
  --n-900:#171c24;
  --n-950:#0f131a;

  /* --- Accent (actions) --- */
  --a-50:  #eef4ff;
  --a-100: #dbe6ff;
  --a-300: #93b4fd;
  --a-500: #3b6df4;
  --a-600: #2657d8;
  --a-700: #1d44ad;

  /* --- Sémantique --- */
  --ok-50:#e9f7ef;  --ok-500:#12854a;  --ok-700:#0b5c33;
  --wa-50:#fff5e6;  --wa-500:#b3660a;  --wa-700:#8a4e07;
  --da-50:#fdecec;  --da-500:#c62f2f;  --da-700:#961f1f;
  --in-50:#eef2f7;  --in-500:#4a6280;

  --text:      var(--n-900);
  --text-2:    var(--n-600);
  --text-3:    var(--n-400);
  --line:      var(--n-150);
  --line-2:    var(--n-200);
  --surface:   var(--n-0);
  --canvas:    var(--n-50);

  --r-sm: 4px;
  --r:    6px;
  --r-lg: 10px;

  --sh-1: 0 1px 2px rgba(15,19,26,.06);
  --sh-2: 0 4px 14px rgba(15,19,26,.10);
  --sh-3: 0 16px 48px rgba(15,19,26,.20);

  --font: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  --sidebar-w: 214px;
  --topbar-h: 48px;
}

* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body { background: var(--canvas); color: var(--text); font-family: var(--font); font-size: 13.5px; line-height: 1.45;
  -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font-family: inherit; font-size: inherit; color: inherit; }
button { cursor: pointer; }
a { color: var(--a-600); text-decoration: none; }
h1,h2,h3 { margin: 0; font-weight: 650; letter-spacing: -.01em; }
.num { font-variant-numeric: tabular-nums; }

/* ======================================================== SHELL =========== */
#app { min-height: 100%; }
.app { display: grid; grid-template-columns: var(--sidebar-w) 1fr; min-height: 100dvh; }

.side { background: var(--n-900); color: var(--n-300); display: flex; flex-direction: column;
  position: sticky; top: 0; height: 100dvh; }
.side__brand { display: flex; align-items: center; gap: 8px; padding: 0 14px; height: var(--topbar-h);
  color: #fff; font-weight: 700; font-size: 14.5px; letter-spacing: -.01em; border-bottom: 1px solid var(--n-800); }
.side__brand .brand-mark, .login__brand .brand-mark { width: 28px; height: 28px; display: grid; place-items: center; flex: 0 0 auto; position: relative; }
.side__brand .brand-mark { width: 24px; height: 24px; }
.brand-mark img { width: 100%; height: 100%; border-radius: 6px; object-fit: cover; display: block; }
.side__brand .dot { width: 22px; height: 22px; border-radius: 5px; background: var(--a-500); display: none; place-items: center; color: #fff; flex: 0 0 auto; }
.brand-mark .brand-fallback { position: absolute; inset: 1px; }

.side__parc { margin: 10px 10px 6px; }
.side__parc button { width: 100%; display: flex; align-items: center; gap: 8px; background: var(--n-800); border: 1px solid var(--n-700);
  color: var(--n-100); border-radius: var(--r); padding: 7px 9px; text-align: left; }
.side__parc button:hover { background: var(--n-700); }
.side__parc .lbl { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; font-size: 12.5px; }
.side__parc .cap { font-size: 10px; text-transform: uppercase; letter-spacing: .08em; color: var(--n-400); display: block; }
.side__parc .menu { display: none; margin-top: 4px; background: var(--n-800); border: 1px solid var(--n-700); border-radius: var(--r); overflow: hidden; }
.side__parc.open .menu { display: block; }
.side__parc .menu button { border: 0; border-radius: 0; background: transparent; }
.side__parc .menu button.on { color: #fff; background: var(--a-700); }

.side__nav { flex: 1; overflow-y: auto; padding: 6px 8px; }
.side__nav a { display: flex; align-items: center; gap: 9px; padding: 7px 9px; border-radius: var(--r); color: var(--n-300);
  font-weight: 550; font-size: 13px; margin-bottom: 1px; }
.side__nav a svg { width: 16px; height: 16px; opacity: .85; flex: 0 0 auto; }
.side__nav a:hover { background: var(--n-800); color: #fff; }
.side__nav a.on { background: var(--a-600); color: #fff; }
.side__nav a.on svg { opacity: 1; }
.side__nav .grp { font-size: 10px; text-transform: uppercase; letter-spacing: .09em; color: var(--n-500); padding: 12px 9px 5px; font-weight: 700; }

.side__foot { border-top: 1px solid var(--n-800); padding: 8px; }
.side__user { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: var(--r); }
.side__user:hover { background: var(--n-800); }
.side__user .av { width: 26px; height: 26px; border-radius: 50%; background: var(--a-600); color: #fff; display: grid; place-items: center;
  font-size: 10.5px; font-weight: 700; flex: 0 0 auto; }
.side__user .nm { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--n-100); font-weight: 600; font-size: 12.5px; }
.side__user .out { color: var(--n-400); display: grid; place-items: center; padding: 3px; border-radius: 4px; cursor: pointer; }
.side__user .out:hover { color: #fff; background: var(--n-700); }

/* ---- zone principale ---- */
.wrap { min-width: 0; display: flex; flex-direction: column; }
.topbar { height: var(--topbar-h); background: var(--surface); border-bottom: 1px solid var(--line);
  display: flex; align-items: center; gap: 10px; padding: 0 16px; position: sticky; top: 0; z-index: 20; }
.topbar h1 { font-size: 15px; font-weight: 650; }
.topbar .sp { flex: 1; }
.topbar .crumb { color: var(--text-3); font-size: 12.5px; }
.main { padding: 14px 16px 40px; min-width: 0; }

@media (max-width: 880px) {
  .app { grid-template-columns: 1fr; }
  .side { position: sticky; height: auto; flex-direction: row; align-items: center; gap: 6px; padding-right: 8px; overflow-x: auto; }
  .side__brand { border: 0; padding-right: 6px; }
  .side__parc, .side__foot { display: none; }
  .side__nav { display: flex; padding: 6px; gap: 4px; }
  .side__nav .grp { display: none; }
  .side__nav a { white-space: nowrap; }
  .main { padding: 12px; }
}

/* ======================================================== TOOLBAR ========= */
.tools { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.tools .sp { flex: 1; }
.search { position: relative; min-width: 220px; }
.search input { padding-left: 34px; }
.search svg { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: var(--text-3); width: 14px; height: 14px; }

/* ======================================================== CONTROLS ========
   Deux pièges évités ici :
   1) On ne cible PAS `input[type=text]` : un <input> SANS attribut `type` se
      comporte comme du texte mais ne correspond pas à ce sélecteur — il
      garderait la bordure « inset 2px » du navigateur.
   2) On garde une spécificité d'élément (0,0,1) : un `input:not(…):not(…)`
      pèserait (0,9,1) et écraserait les règles de composant (.search input…).
   D'où : on style TOUS les champs, puis on remet à zéro les types non textuels.
   ======================================================================== */
input, select, textarea {
  -webkit-appearance: none; appearance: none;
  width: 100%; height: 36px; background-color: var(--surface, #fff); color: var(--text, #171c24);
  font-family: inherit; font-size: 13.5px; line-height: 1.4;
  /* bordure en propriétés séparées + repli : un `border: 1px solid var(--x)`
     invalide devient « pas de bordure du tout ». */
  border-width: 1px; border-style: solid; border-color: var(--n-200, #d7dbe2);
  border-radius: 8px; padding: 0 11px; margin: 0;
  box-shadow: 0 1px 1px rgba(15,19,26,.03) inset;
  transition: border-color .12s, box-shadow .12s, background-color .12s; }
textarea { height: auto; min-height: 76px; padding: 9px 11px; resize: vertical; line-height: 1.5; }

input:hover:not(:disabled), select:hover:not(:disabled), textarea:hover:not(:disabled) { border-color: var(--n-300, #b9c0cb); }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--a-500, #3b6df4);
  box-shadow: 0 0 0 3px rgba(59,109,244,.16); background-color: #fff; }
input:disabled, select:disabled, textarea:disabled { background-color: var(--n-50, #f6f7f9); color: var(--n-500, #6b7484);
  border-color: var(--n-150, #e4e7ec); box-shadow: none; }
input[readonly] { background-color: var(--n-25, #fbfbfc); }
input::placeholder, textarea::placeholder { color: var(--n-400, #8d96a5); opacity: 1; }

/* --- exceptions : types qui ne sont pas des champs de saisie textuelle --- */
input[type=checkbox], input[type=radio] {
  width: 16px; height: 16px; flex: 0 0 auto; -webkit-appearance: auto; appearance: auto;
  accent-color: var(--a-600); border: 0; padding: 0; background: none; box-shadow: none; cursor: pointer; }
input[type=file], input[type=range], input[type=color], input[type=image] {
  height: auto; border: 0; padding: 0; background: none; box-shadow: none; }
input[type=submit], input[type=button], input[type=reset] { width: auto; cursor: pointer; }

/* --- affinages par type --- */
input[type=number] { font-variant-numeric: tabular-nums; -moz-appearance: textfield; }
input[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type=date], input[type=datetime-local], input[type=time] { padding-right: 8px; }
input[type=date]::-webkit-calendar-picker-indicator, input[type=datetime-local]::-webkit-calendar-picker-indicator { cursor: pointer; opacity: .55; }
input[type=date]:hover::-webkit-calendar-picker-indicator, input[type=datetime-local]:hover::-webkit-calendar-picker-indicator { opacity: 1; }
input[type=search]::-webkit-search-cancel-button { -webkit-appearance: none; }

select { cursor: pointer;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%238d96a5' stroke-width='1.4' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 11px center; padding-right: 30px; }
/* champ en erreur */
input.bad, select.bad { border-color: var(--da-500); box-shadow: 0 0 0 3px rgba(198,47,47,.14); }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 34px; padding: 0 13px;
  background: var(--surface); border: 1px solid var(--n-200); border-radius: 8px; font-size: 13px; font-weight: 600;
  color: var(--n-700); white-space: nowrap; box-shadow: 0 1px 1px rgba(15,19,26,.03);
  transition: background .12s, border-color .12s, color .12s; }
.btn:hover { background: var(--n-50); border-color: var(--n-300); }
.btn:active { transform: translateY(1px); }
.btn svg { width: 15px; height: 15px; }
.btn--primary { background: var(--a-600); border-color: var(--a-600); color: #fff; box-shadow: 0 1px 2px rgba(38,87,216,.3); }
.btn--primary:hover { background: var(--a-700); border-color: var(--a-700); }
.btn--danger { background: var(--surface); border-color: #f0c2c2; color: var(--da-500); }
.btn--danger:hover { background: var(--da-50); border-color: var(--da-500); }
.btn--ok { background: var(--ok-500); border-color: var(--ok-500); color: #fff; }
.btn--ok:hover { background: var(--ok-700); }
.btn--ghost { background: transparent; border-color: transparent; box-shadow: none; color: var(--text-2); }
.btn--ghost:hover { background: var(--n-100); }
.btn--sm { height: 27px; padding: 0 9px; font-size: 12px; border-radius: 6px; }
.btn--sm svg { width: 13px; height: 13px; }
.btn--icon { width: 34px; padding: 0; }
.btn:disabled { opacity: .5; pointer-events: none; }

/* segmented (sous-onglets) */
.seg { display: inline-flex; background: var(--n-100); border-radius: var(--r); padding: 2px; gap: 2px; }
.seg button { border: 0; background: transparent; border-radius: 4px; padding: 5px 11px; font-size: 12.5px; font-weight: 600; color: var(--text-2); }
.seg button:hover { color: var(--text); }
.seg button.on { background: var(--surface); color: var(--text); box-shadow: var(--sh-1); }

/* ======================================================== TABLE =========== */
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; }
.panel__head { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border-bottom: 1px solid var(--line); background: var(--n-25); }
.panel__head h2 { font-size: 12.5px; font-weight: 650; }
.panel__head .sp { flex: 1; }

.tbl-wrap { overflow-x: auto; }
table.data { width: 100%; border-collapse: collapse; }
table.data th { position: sticky; top: 0; background: var(--n-50); z-index: 1;
  text-align: left; font-size: 10.5px; text-transform: uppercase; letter-spacing: .06em; color: var(--text-2);
  font-weight: 700; padding: 7px 10px; border-bottom: 1px solid var(--line-2); white-space: nowrap; }
table.data th.sortable { cursor: pointer; user-select: none; }
table.data th.sortable:hover { color: var(--text); }
table.data th .ar { opacity: .35; margin-left: 3px; }
table.data th.sorted .ar { opacity: 1; color: var(--a-600); }
table.data td { padding: 7px 10px; border-bottom: 1px solid var(--line); font-size: 13px; vertical-align: middle; }
table.data tbody tr:hover { background: var(--n-25); }
table.data tbody tr.sel { background: var(--a-50); }
table.data tbody tr.clickable { cursor: pointer; }
table.data td.r, table.data th.r { text-align: right; font-variant-numeric: tabular-nums; }
table.data td.mono { font-family: var(--mono); font-size: 12px; color: var(--text-2); }
table.data .t-main { font-weight: 600; }
table.data .t-sub { color: var(--text-3); font-size: 11.5px; }
table.data tbody tr:last-child td { border-bottom: 0; }
.tbl-empty { padding: 40px 16px; text-align: center; color: var(--text-3); }

/* ======================================================== TAGS =========== */
.tag { display: inline-flex; align-items: center; gap: 4px; height: 19px; padding: 0 7px; border-radius: 999px;
  font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; }
.tag--ok { background: var(--ok-50); color: var(--ok-700); }
.tag--wa { background: var(--wa-50); color: var(--wa-700); }
.tag--da { background: var(--da-50); color: var(--da-700); }
.tag--in { background: var(--in-50); color: var(--in-500); }
.tag--neutral { background: var(--n-100); color: var(--text-2); }
.tag--solid { background: var(--da-500); color: #fff; }
.dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; flex: 0 0 auto; }
.dot--ok { background: var(--ok-500); } .dot--wa { background: var(--wa-500); } .dot--da { background: var(--da-500); } .dot--n { background: var(--n-300); }
.chip { display: inline-flex; align-items: center; gap: 4px; height: 20px; padding: 0 7px; border-radius: var(--r-sm);
  background: var(--n-100); color: var(--text-2); font-size: 11.5px; font-variant-numeric: tabular-nums; }
.chip b { color: var(--text); font-weight: 650; }
.muted { color: var(--text-2); } .dim { color: var(--text-3); }

/* ======================================================== KPI ============ */
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin-bottom: 14px; }
.kpi { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 11px 13px; }
.kpi .k { font-size: 10.5px; text-transform: uppercase; letter-spacing: .06em; color: var(--text-3); font-weight: 700; }
.kpi .v { font-size: 26px; font-weight: 680; letter-spacing: -.02em; font-variant-numeric: tabular-nums; margin-top: 2px; }
.kpi .s { font-size: 11.5px; color: var(--text-3); }
.kpi.ok .v { color: var(--ok-500); } .kpi.wa .v { color: var(--wa-500); } .kpi.da .v { color: var(--da-500); } .kpi.ac .v { color: var(--a-600); }
.kpi.clickable { cursor: pointer; } .kpi.clickable:hover { border-color: var(--a-300); box-shadow: var(--sh-1); }

/* ======================================================== DRAWER ========= */
.drawer-bg { position: fixed; inset: 0; background: rgba(15,19,26,.34); z-index: 60; display: flex; justify-content: flex-end; }
.drawer { background: var(--surface); width: min(1040px, 100%); height: 100%; display: flex; flex-direction: column; box-shadow: var(--sh-3); }
.drawer__head { padding: 15px 20px; border-bottom: 1px solid var(--line); display: flex; align-items: flex-start; gap: 10px; }
.drawer__head h2 { font-size: 15.5px; font-weight: 680; }
.drawer__head .sub { color: var(--text-3); font-size: 12px; margin-top: 1px; }
.drawer__head .sp { flex: 1; }
.drawer__x { border: 0; background: transparent; color: var(--text-3); font-size: 17px; line-height: 1; padding: 4px 6px; border-radius: 4px; }
.drawer__x:hover { background: var(--n-100); color: var(--text); }
.drawer__tabs { display: flex; gap: 2px; padding: 0 12px; border-bottom: 1px solid var(--line); background: var(--n-25); }
.drawer__tabs button { border: 0; background: transparent; padding: 8px 11px; font-size: 12.5px; font-weight: 600; color: var(--text-2);
  border-bottom: 2px solid transparent; margin-bottom: -1px; }
.drawer__tabs button:hover { color: var(--text); }
.drawer__tabs button.on { color: var(--a-600); border-bottom-color: var(--a-600); }
.drawer__body { flex: 1; overflow-y: auto; padding: 18px 20px; }
.drawer__foot { border-top: 1px solid var(--line); padding: 12px 20px; display: flex; gap: 8px; justify-content: flex-end; background: var(--n-25); }
@media (max-width: 1080px) { .drawer { width: 100%; } }
.drawer__body { overflow-x: hidden; }   /* jamais de barre horizontale */

/* modale centrée (formulaires courts) */
.modal-bg { position: fixed; inset: 0; background: rgba(15,19,26,.34); z-index: 70; display: flex; align-items: center; justify-content: center; padding: 16px; }
.modal { background: var(--surface); border-radius: 12px; width: min(580px, 100%); max-height: 90vh; overflow-y: auto; box-shadow: var(--sh-3); }
.modal__head { padding: 16px 20px; border-bottom: 1px solid var(--line); display: flex; align-items: center; gap: 8px; }
.modal__head h2 { font-size: 15px; font-weight: 680; } .modal__head .sp { flex: 1; }
.modal__body { padding: 20px; }
.modal__foot { padding: 14px 20px; border-top: 1px solid var(--line); display: flex; gap: 8px; justify-content: flex-end; background: var(--n-25); }

/* ======================================================== FORMS ========== */
.fields { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 14px; }
.fields.c3 { grid-template-columns: 1fr 1fr 1fr; }
.f { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.f.full { grid-column: 1 / -1; }
.f > label { font-size: 11.5px; font-weight: 650; color: var(--n-600); letter-spacing: .01em; }
.f > label .req { color: var(--da-500); margin-left: 2px; }
.f .hint { font-size: 11.5px; color: var(--text-3); line-height: 1.35; }
.f--check { flex-direction: row; align-items: center; gap: 9px; background: var(--n-25); border: 1px solid var(--n-150);
  border-radius: 8px; padding: 0 11px; height: 36px; }
.f--check label { font-size: 13px; color: var(--text); font-weight: 550; cursor: pointer; }
.f--check input { width: 16px; height: 16px; accent-color: var(--a-600); margin: 0; cursor: pointer; }
.fset { margin-bottom: 22px; }
.fset:last-child { margin-bottom: 0; }
.fset__t { font-size: 11px; text-transform: uppercase; letter-spacing: .07em; color: var(--n-500); font-weight: 750;
  padding-bottom: 8px; margin-bottom: 14px; border-bottom: 1px solid var(--line); }
@media (max-width: 620px) { .fields, .fields.c3 { grid-template-columns: 1fr; } }

/* ligne éditable (association fournisseur/prix) */
.erow { display: grid; grid-template-columns: 1fr 110px 110px 120px auto; gap: 6px; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--line); }
.erow:last-of-type { border-bottom: 0; }
.erow__h { font-size: 10.5px; text-transform: uppercase; letter-spacing: .05em; color: var(--text-3); font-weight: 700; padding-bottom: 4px; }
@media (max-width: 720px) { .erow { grid-template-columns: 1fr 1fr; } }

/* infos clé/valeur */
.kv { display: grid; grid-template-columns: 150px 1fr; gap: 5px 12px; font-size: 13px; }
.kv dt { color: var(--text-3); font-size: 12px; }
.kv dd { margin: 0; font-weight: 550; }

/* barre de niveau */
.bar { height: 5px; border-radius: 3px; background: var(--n-150); overflow: hidden; min-width: 54px; }
.bar i { display: block; height: 100%; border-radius: 3px; background: var(--ok-500); }
.bar i.wa { background: var(--wa-500); } .bar i.da { background: var(--da-500); }

/* ======================================================== LOGIN ========== */
.login { min-height: 100dvh; display: grid; place-items: center; background: var(--canvas); padding: 20px; }
.login__box { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--sh-2);
  padding: 26px; width: min(460px, 100%); }
.login__brand { display: flex; align-items: center; gap: 8px; justify-content: center; font-weight: 700; font-size: 17px; margin-bottom: 3px; }
.login__brand .dot { width: 26px; height: 26px; border-radius: 6px; background: var(--a-500); display: none; place-items: center; color: #fff; }
.login__hint { text-align: center; color: var(--text-3); font-size: 12.5px; margin-bottom: 18px; }
.ppl { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; }
.ppl button { background: var(--surface); border: 1px solid var(--line-2); border-radius: var(--r); padding: 12px 6px;
  display: flex; flex-direction: column; align-items: center; gap: 6px; }
.ppl button:hover { border-color: var(--a-300); background: var(--a-50); }
.ppl .av { width: 38px; height: 38px; border-radius: 50%; background: var(--n-100); color: var(--n-600); display: grid; place-items: center; font-weight: 700; font-size: 13px; }
.ppl .nm { font-size: 11.5px; font-weight: 600; text-align: center; line-height: 1.25; }
.pin { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; max-width: 250px; margin: 0 auto; }
.pin button { height: 46px; background: var(--surface); border: 1px solid var(--line-2); border-radius: var(--r); font-size: 17px; font-weight: 600; }
.pin button:hover { background: var(--n-50); }
.dots { display: flex; gap: 9px; justify-content: center; margin: 6px 0 16px; }
.dots i { width: 10px; height: 10px; border-radius: 50%; background: var(--n-200); }
.dots i.on { background: var(--a-600); }

/* ======================================================== SCAN =========== */
.scan-overlay { position: fixed; inset: 0; z-index: 90; background: #000; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; }
.scan-overlay video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.scan-frame { position: relative; width: min(78vw, 420px); height: 150px; border: 2px solid var(--a-500); border-radius: 8px; box-shadow: 0 0 0 3000px rgba(0,0,0,.5); }
.scan-msg { position: relative; color: #fff; font-weight: 600; text-align: center; padding: 0 20px; }
.scan-manual { position: relative; width: min(78vw, 420px); text-align: center; background: #fff; border-radius: var(--r); padding: 9px; }
.scan-close { position: absolute; top: calc(12px + env(safe-area-inset-top)); right: 12px; background: #fff; border: 0; border-radius: var(--r); padding: 8px 12px; font-weight: 600; }

/* ======================================================== MISC =========== */
.toast { position: fixed; bottom: 18px; left: 50%; transform: translateX(-50%); background: var(--n-900); color: #fff;
  border-radius: var(--r); padding: 9px 14px; font-size: 12.5px; font-weight: 550; z-index: 100; box-shadow: var(--sh-2); max-width: 90vw; }
.toast.err { background: var(--da-500); }
.toast.hidden { display: none; }
.loader { display: flex; justify-content: center; padding: 36px; }
.spin { width: 20px; height: 20px; border: 2px solid var(--n-200); border-top-color: var(--a-600); border-radius: 50%; animation: sp .8s linear infinite; }
@keyframes sp { to { transform: rotate(360deg); } }
.sect { font-size: 10.5px; text-transform: uppercase; letter-spacing: .07em; color: var(--text-3); font-weight: 750; margin: 18px 0 8px; }
.sect:first-child { margin-top: 0; }
.empty { padding: 36px 16px; text-align: center; color: var(--text-3); }
.grid2 { display: grid; gap: 12px; }
@media (min-width: 900px) { .grid2 { grid-template-columns: 1fr 1fr; } }

/* ============================================================================
   Surcharges de composant sur les champs.
   Déclarées EN FIN DE FICHIER pour l'emporter à la fois par la spécificité et
   par l'ordre : la base `input {}` ci-dessus ne doit jamais les écraser.
   ========================================================================= */
.search input { padding-left: 34px; }                    /* place pour l'icône loupe */
.tools select, .tools input[type=search] { width: auto; min-width: 180px; }
.scan-manual { width: min(78vw, 420px); text-align: center; height: auto; padding: 10px; }
.f--check input[type=checkbox] { width: 16px; height: 16px; }
.erow input, .erow select { height: 32px; }              /* lignes éditables compactes */
table.data input, table.data select { height: 30px; font-size: 12.5px; }

/* ============================================================ SOUS-BLOCS ===
   Regroupe des champs qui vont ensemble (ex. un conditionnement) pour éviter
   qu'ils se noient dans une grille uniforme.
   ========================================================================= */
.subcard { border: 1px solid var(--line); border-radius: 9px; padding: 13px; background: var(--n-25); }
.subcard__t { font-size: 11.5px; font-weight: 700; color: var(--n-600); margin-bottom: 11px;
  display: flex; align-items: center; gap: 7px; }
.subcard__t .tag { font-weight: 700; }
.subcard .fields { gap: 10px; }
.cols2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 700px) { .cols2 { grid-template-columns: 1fr; } }
/* colis : autant de colonnes que la largeur le permet, sans débordement */
.cols3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 12px; }
.subcard .fields { grid-template-columns: 1fr 1fr; }
.subcard .fields .f.full { grid-column: 1 / -1; }
/* lignes d'états de conservation */
.state-row { display: grid; grid-template-columns: 1.4fr 90px 1.2fr 110px 34px; gap: 8px; align-items: end; margin-bottom: 8px; }
@media (max-width: 860px) { .state-row { grid-template-columns: 1fr 1fr; } }
.help { display: inline-flex; width: 15px; height: 15px; border-radius: 50%; background: var(--n-200); color: var(--n-700);
  font-size: 10px; font-weight: 800; align-items: center; justify-content: center; cursor: help; margin-left: 4px; }
.note { background: var(--a-50); border: 1px solid var(--a-100); border-radius: 8px; padding: 10px 12px; font-size: 12px; color: var(--n-700); line-height: 1.5; }
.note b { color: var(--n-900); }

/* ---- sélecteur d'image produit ---- */
.imgpick { display: flex; gap: 14px; align-items: flex-start; }
.imgpick__box { width: 104px; height: 104px; border-radius: 9px; border: 1px dashed var(--n-300); background: var(--n-25);
  display: grid; place-items: center; overflow: hidden; flex: 0 0 auto; position: relative; }
.imgpick__box img { width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain !important; padding: 4px; }
.imgpick__box .ph { color: var(--n-400); font-size: 11px; text-align: center; padding: 0 6px; line-height: 1.3; }
.imgpick__side { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 7px; }
.imgpick__side .row { display: flex; gap: 6px; flex-wrap: wrap; }

/* ---- résultats OpenFoodFacts ---- */
.off-list { display: flex; flex-direction: column; gap: 6px; max-height: 46vh; overflow-y: auto; }
.off-item { display: flex; gap: 11px; align-items: center; padding: 8px; border: 1px solid var(--line); border-radius: 8px;
  background: var(--surface); cursor: pointer; }
.off-item:hover { border-color: var(--a-300); background: var(--a-50); }
.off-item img { width: auto; height: auto; max-width: 46px; max-height: 46px; object-fit: contain !important; border-radius: 6px; background: var(--n-50); flex: 0 0 auto; }
.off-item .no { width: 46px; height: 46px; border-radius: 6px; background: var(--n-100); flex: 0 0 auto; }
.off-item .t { flex: 1; min-width: 0; }
.off-item .t b { display: block; font-size: 13px; font-weight: 650; }
.off-item .t span { font-size: 11.5px; color: var(--text-3); }
.nutri { width: 20px; height: 20px; border-radius: 4px; display: grid; place-items: center; color: #fff; font-weight: 800; font-size: 11px; text-transform: uppercase; }
.nutri.a { background: #038141; } .nutri.b { background: #85bb2f; } .nutri.c { background: #fecb02; color: #333; }
.nutri.d { background: #ee8100; } .nutri.e { background: #e63e11; }

/* ---- sélection multiple (import Qweekle) ---- */
.pick { border: 1px solid var(--line); border-radius: 9px; overflow: hidden; }
.pick__grp { display: flex; align-items: center; gap: 9px; padding: 7px 11px; background: var(--n-50);
  border-bottom: 1px solid var(--line); border-top: 1px solid var(--line); font-size: 12px; font-weight: 700; color: var(--n-700); }
.pick__grp:first-child { border-top: 0; }
.pick__grp .sp { flex: 1; }
.pick__grp .cnt { font-weight: 500; color: var(--text-3); font-size: 11.5px; }
.pick__row { display: flex; align-items: center; gap: 9px; padding: 6px 11px 6px 26px; border-bottom: 1px solid var(--n-100); font-size: 13px; }
.pick__row:hover { background: var(--n-25); }
.pick__row .sp { flex: 1; }
.pick__scroll { max-height: 44vh; overflow-y: auto; }

/* ================================================== UTILISATEURS & RÔLES === */
.user-avatar { border-radius: 50%; object-fit: cover; background: var(--n-100); flex: 0 0 auto; border: 1px solid var(--line); }
.user-avatar--fallback { display: inline-grid; place-items: center; background: var(--a-600); color: #fff; font-size: 11px; font-weight: 750; }
.user-cell { display: flex; align-items: center; gap: 10px; min-width: 190px; }
.stack-sm { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; }
.stack-sm .warn { color: var(--wa-600, #9a6700); }
.role-pick { min-width: 190px; }
.role-pick select { width: 100%; min-width: 170px; margin-bottom: 4px; }
.role-pick select + select { font-size: 11.5px; color: var(--text-3); }
.access-toggle { display: flex; align-items: center; gap: 6px; height: auto; border: 0; background: none; padding: 0; font-size: 12px; }
.role-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(245px, 1fr)); gap: 10px; }
.role-card { border: 1px solid var(--line); border-radius: 10px; background: var(--surface); padding: 13px; min-width: 0; }
.role-card.is-off { opacity: .58; }
.role-card__head { display: flex; gap: 10px; align-items: flex-start; justify-content: space-between; }
.role-card p { color: var(--text-3); font-size: 12px; line-height: 1.45; min-height: 34px; margin: 10px 0; }
.role-card__foot { display: flex; gap: 6px; flex-wrap: wrap; }
.perm-groups { display: grid; gap: 10px; margin-top: 14px; max-height: 52vh; overflow: auto; padding-right: 3px; }
.perm-group { border: 1px solid var(--line); border-radius: 9px; overflow: hidden; }
.perm-group h4 { margin: 0; padding: 8px 10px; background: var(--n-50); font-size: 11px; text-transform: uppercase; letter-spacing: .05em; }
.perm-group label { display: flex; gap: 9px; align-items: flex-start; padding: 8px 10px; border-top: 1px solid var(--n-100); cursor: pointer; }
.perm-group label:hover { background: var(--n-25); }
.perm-group label input { width: 16px; height: 16px; margin-top: 1px; }
.perm-group label span { display: flex; flex-direction: column; gap: 2px; }
.perm-group label b { font-size: 12.5px; font-weight: 650; }
.perm-group label small { color: var(--text-3); font-size: 10.5px; }
.user-import-row { padding-left: 11px; }
.user-import-row > span:not(.sp):not(.tag):not(.user-avatar) { display: flex; flex-direction: column; gap: 2px; }
.user-import-row small { color: var(--text-3); }
.side__user .user-avatar { width: 30px; height: 30px; }
.ppl .user-avatar { width: 52px; height: 52px; font-size: 14px; }
@media (max-width: 760px) {
  .role-grid { grid-template-columns: 1fr; }
  .perm-groups { max-height: 58vh; }
}
.side__user .nm { display: flex; flex-direction: column; min-width: 0; }
.side__user .nm small { font-size: 10px; font-weight: 500; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ================================================= ÉTIQUETTES & IMPRESSION === */
.label-workspace { display: grid; grid-template-columns: minmax(260px, 340px) minmax(0, 1fr); gap: 14px; align-items: start; }
.label-sidebar { position: sticky; top: 12px; }
.label-sidebar__body, .panel-pad { padding: 14px; }
.label-main { min-width: 0; }
.label-preview { padding: 14px; display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); min-height: 180px; }
.label-card { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 8px 10px; align-items: start; padding: 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--n-25); cursor: pointer; }
.label-card:hover { border-color: var(--a-300); background: var(--a-50); }
.label-card > input { width: 16px; height: 16px; margin-top: 4px; }
.label-card > img { grid-column: 2; width: 100%; max-height: 260px; object-fit: contain; background: #fff; border: 1px solid var(--n-200); border-radius: 6px; image-rendering: auto; }
.label-card > span { grid-column: 2; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.label-card > span b { font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.label-card > span small { color: var(--text-3); font-size: 11px; }
.label-actions { border-top: 1px solid var(--line); padding: 12px 14px; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.label-driver { min-height: 36px; border: 1px solid var(--line); border-radius: 7px; padding: 7px 9px; display: flex; flex-direction: column; justify-content: center; gap: 1px; background: var(--n-25); }
.label-driver b { font-size: 12.5px; }
.label-driver span { font-size: 10.5px; }
.label-printer-grid { display: grid; gap: 10px; }
.label-settings .subcard .fields { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 920px) {
  .label-workspace { grid-template-columns: 1fr; }
  .label-sidebar { position: static; }
  .label-preview { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  .label-settings .subcard .fields { grid-template-columns: 1fr; }
  .label-tools .seg { overflow-x: auto; max-width: 100%; }
  .label-tools .seg button { white-space: nowrap; }
}

/* Scanner P4.3.1 : actions manuelles et fallback photo/ZXing. */
.scan-actions { position: relative; width: min(84vw, 460px); display: grid; grid-template-columns: 1fr auto auto; gap: 8px; align-items: center; }
.scan-actions .scan-manual { width: 100%; min-width: 0; }
.scan-photo, .scan-torch { background: #fff; color: #171c24; border-color: #fff; white-space: nowrap; }
@media (max-width: 640px) {
  .scan-actions { grid-template-columns: 1fr 1fr; }
  .scan-actions .scan-manual { grid-column: 1 / -1; }
}

/* Scanner P4.3.4 : modes séparés caméra et PDA/douchette. */
.scan-modes { position: relative; z-index: 2; display: flex; gap: 6px; padding: 4px; border-radius: 9px; background: rgba(0,0,0,.42); }
.scan-modes .btn { background: rgba(255,255,255,.9); border-color: transparent; color: #252b35; }
.scan-modes .btn.active { background: var(--a-600); color: #fff; }
.scan-wedge { position: fixed !important; left: 50% !important; top: 50% !important; width: 2px !important; height: 2px !important; padding: 0 !important; border: 0 !important; transform: translate(-50%,-50%) !important; opacity: .01 !important; color: transparent !important; caret-color: transparent !important; background: transparent !important; pointer-events: none; z-index: 92 !important; ime-mode: disabled; }
.scan-global-wedge { position: fixed !important; left: 2px !important; top: 2px !important; bottom: auto !important; width: 4px !important; height: 4px !important; min-width: 0 !important; min-height: 0 !important; padding: 0 !important; margin: 0 !important; border: 0 !important; outline: 0 !important; overflow: hidden !important; opacity: .01 !important; color: transparent !important; caret-color: transparent !important; background: transparent !important; pointer-events: none !important; z-index: 2147483000 !important; font-size: 1px !important; line-height: 1 !important; white-space: nowrap !important; }
.scan-overlay.is-hardware { background: radial-gradient(circle at 50% 38%, #273140 0, #111720 60%, #070a0f 100%); }
.scan-overlay.is-hardware video,
.scan-overlay.is-hardware .scan-frame,
.scan-overlay.is-hardware .scan-torch { display: none !important; }
.scan-overlay.is-hardware .scan-msg { max-width: 520px; font-size: 16px; line-height: 1.55; }
.scan-overlay.is-hardware .scan-photo { display: inline-flex; }
.scan-overlay.is-camera video,
.scan-overlay.is-camera .scan-frame { display: block; }
@media (max-width: 640px) {
  .scan-modes { width: min(92vw, 460px); }
  .scan-modes .btn { flex: 1; }
}

/* P4.4 — présentation produit commune */
.product-ref-link{display:inline-flex;align-items:center;gap:9px;min-width:0;color:inherit;text-decoration:none;border-radius:8px;padding:2px 4px;margin:-2px -4px}
.product-ref-link:hover{background:var(--n-50);color:inherit}.product-ref-link--static:hover{background:transparent}
.product-copy{display:flex;flex-direction:column;min-width:0}.product-copy .t-main,.product-copy .t-sub{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.product-photo{width:var(--product-photo-size,34px);height:var(--product-photo-size,34px);display:grid;place-items:center;flex:0 0 auto;border:1px solid var(--line);border-radius:7px;background:#fff;overflow:hidden}
.product-photo img{width:auto;height:auto;max-width:100%;max-height:100%;display:block;object-fit:contain!important;padding:2px}
.product-photo--empty{color:var(--n-400);font-size:14px;background:var(--n-50)}
.product-hero{display:grid;grid-template-columns:minmax(100px,150px) 1fr;gap:18px;align-items:start}.product-hero__image{height:140px;border:1px solid var(--line);border-radius:12px;background:#fff;display:grid;place-items:center;overflow:hidden}.product-hero__image img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain!important;padding:8px}
@media(max-width:640px){.product-hero{grid-template-columns:88px 1fr}.product-hero__image{height:88px}}
.scan-product-card{display:flex;align-items:center;gap:12px;padding:10px 12px;margin:-2px 0 12px;border:1px solid var(--line);border-radius:12px;background:var(--n-50)}
.scan-product-card .product-ref-link{flex:1}.scan-product-card__stock{display:flex;flex-direction:column;text-align:right}.scan-product-card__stock b{font-size:18px}.scan-product-card__stock span{font-size:11px;color:var(--muted)}
.movement-types{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr));width:100%}.movement-types button{justify-content:center}
@media(max-width:640px){.movement-types{grid-template-columns:repeat(3,minmax(0,1fr))}.scan-product-card__stock{display:none}}
.settings-home{display:grid;gap:16px}.settings-identity .panel-pad{display:flex;align-items:center;gap:18px}.settings-identity__logo{width:84px;height:84px;border:1px solid var(--line);border-radius:16px;background:#fff;display:grid;place-items:center;overflow:hidden;flex:0 0 auto}.settings-identity__logo img{width:100%;height:100%;object-fit:contain;padding:7px}.settings-identity h2{margin:6px 0 2px}.settings-identity__meta{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted)}
.settings-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.settings-card{text-align:left;padding:18px;border:1px solid var(--line);border-radius:12px;background:var(--surface);cursor:pointer}.settings-card:hover{border-color:var(--ac-300);box-shadow:var(--shadow-sm)}.settings-card b,.settings-card span{display:block}.settings-card span{margin-top:6px;color:var(--muted);font-size:13px;line-height:1.4}
.printer-profile{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}.printer-profile:last-child{border-bottom:0}.printer-profile>div:first-child{flex:1;min-width:0}.printer-profile b,.printer-profile span{display:block}.printer-profile span{font-size:12px;color:var(--muted);margin-top:3px}
@media(max-width:760px){.settings-cards{grid-template-columns:1fr}.settings-identity .panel-pad{align-items:flex-start;flex-wrap:wrap}.settings-identity__logo{width:64px;height:64px}}

/* P4.5 — vrai menu mobile */
.mobile-menu-button,.mobile-menu-close,.mobile-backdrop{display:none}
@media(max-width:880px){
  .app{display:block;min-height:100dvh}.wrap{min-height:100dvh}
  .side{position:fixed;left:0;top:0;bottom:0;width:min(86vw,320px);height:100dvh;z-index:80;display:flex;flex-direction:column;align-items:stretch;gap:0;padding:0;overflow:hidden;transform:translateX(-105%);transition:transform .2s ease;box-shadow:0 18px 60px rgba(0,0,0,.28)}
  .app.mobile-menu-open .side{transform:translateX(0)}
  .side__brand{border-bottom:1px solid var(--n-800);padding:0 14px}.side__parc,.side__foot{display:block}.side__nav{display:block;overflow-y:auto;padding:8px}.side__nav .grp{display:block}.side__nav a{white-space:normal;padding:10px 11px;font-size:14px}
  .mobile-menu-button{display:inline-grid;place-items:center;width:36px;height:36px;padding:0;border:1px solid var(--line);border-radius:8px;background:var(--surface);font-size:20px}
  .mobile-menu-close{display:grid;place-items:center;margin-left:auto;width:32px;height:32px;border:0;background:transparent;color:#fff;font-size:25px;box-shadow:none;padding:0}
  .mobile-backdrop{position:fixed;inset:0;z-index:70;border:0;background:rgba(8,12,18,.56);padding:0;opacity:0;pointer-events:none;display:block;transition:opacity .2s ease}
  .app.mobile-menu-open .mobile-backdrop{opacity:1;pointer-events:auto}
  .topbar{padding:0 10px;gap:8px}.topbar h1{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar #scanBtn{padding:8px 10px}.topbar #scanBtn svg{margin:0}.topbar #scanBtn{font-size:0}.topbar #scanBtn svg{width:18px;height:18px}
  body.no-scroll{overflow:hidden}
}

/* P4.5 — catalogue des catégories */
.category-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:12px;padding:14px}
.category-card{border:1px solid var(--line);border-radius:12px;background:var(--surface);overflow:hidden}
.category-card>header{display:flex;gap:10px;align-items:flex-start;padding:13px;background:var(--n-50);border-bottom:1px solid var(--line)}
.category-card>header>div:first-child{flex:1;min-width:0}.category-card header b,.category-card header span{display:block}.category-card header span{font-size:11.5px;color:var(--text-3);margin-top:3px}
.category-children{padding:4px 12px 10px}.category-children>div{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid var(--n-100)}.category-children>div:last-child{border-bottom:0}.category-children small{color:var(--text-3)}
@media(max-width:640px){.category-grid{grid-template-columns:1fr;padding:10px}.category-card>header{flex-direction:column}.category-card>header .row{width:100%}}

/* P4.5 — éditeur image */
.image-editor-stage{height:min(58vh,520px);background:#161b22;border-radius:10px;overflow:hidden;display:grid;place-items:center}.image-editor-stage img{display:block;max-width:100%;max-height:100%}.image-editor-tools{display:flex;gap:7px;flex-wrap:wrap;align-items:center;margin-top:10px}.image-editor-tools select{width:auto}.cropper-container{direction:ltr;font-size:0;line-height:0;position:relative;touch-action:none;user-select:none}.cropper-container img{backface-visibility:hidden;display:block;height:100%;image-orientation:0deg;max-height:none!important;max-width:none!important;min-height:0!important;min-width:0!important;width:100%}.cropper-wrap-box,.cropper-canvas,.cropper-drag-box,.cropper-crop-box,.cropper-modal{bottom:0;left:0;position:absolute;right:0;top:0}.cropper-wrap-box,.cropper-canvas{overflow:hidden}.cropper-drag-box{background-color:#fff;opacity:0}.cropper-modal{background-color:#000;opacity:.5}.cropper-view-box{display:block;height:100%;outline:1px solid #39f;outline-color:rgba(51,153,255,.75);overflow:hidden;width:100%}.cropper-dashed{border:0 dashed #eee;display:block;opacity:.5;position:absolute}.cropper-dashed.dashed-h{border-bottom-width:1px;border-top-width:1px;height:33.33333%;left:0;top:33.33333%;width:100%}.cropper-dashed.dashed-v{border-left-width:1px;border-right-width:1px;height:100%;left:33.33333%;top:0;width:33.33333%}.cropper-center{display:block;height:0;left:50%;opacity:.75;position:absolute;top:50%;width:0}.cropper-center:before,.cropper-center:after{background-color:#eee;content:' ';display:block;position:absolute}.cropper-center:before{height:1px;left:-3px;top:0;width:7px}.cropper-center:after{height:7px;left:0;top:-3px;width:1px}.cropper-face,.cropper-line,.cropper-point{display:block;height:100%;opacity:.1;position:absolute;width:100%}.cropper-face{background-color:#fff;left:0;top:0}.cropper-line{background-color:#39f}.cropper-line.line-e{cursor:ew-resize;right:-3px;top:0;width:5px}.cropper-line.line-n{cursor:ns-resize;height:5px;left:0;top:-3px}.cropper-line.line-w{cursor:ew-resize;left:-3px;top:0;width:5px}.cropper-line.line-s{bottom:-3px;cursor:ns-resize;height:5px;left:0}.cropper-point{background-color:#39f;height:5px;opacity:.75;width:5px}.cropper-point.point-e{cursor:ew-resize;margin-top:-3px;right:-3px;top:50%}.cropper-point.point-n{cursor:ns-resize;left:50%;margin-left:-3px;top:-3px}.cropper-point.point-w{cursor:ew-resize;left:-3px;margin-top:-3px;top:50%}.cropper-point.point-s{bottom:-3px;cursor:s-resize;left:50%;margin-left:-3px}.cropper-point.point-ne{cursor:nesw-resize;right:-3px;top:-3px}.cropper-point.point-nw{cursor:nwse-resize;left:-3px;top:-3px}.cropper-point.point-sw{bottom:-3px;cursor:nesw-resize;left:-3px}.cropper-point.point-se{bottom:-3px;cursor:nwse-resize;height:20px;opacity:1;right:-3px;width:20px}.cropper-point.point-se:before{background-color:#39f;bottom:-50%;content:' ';display:block;height:200%;opacity:0;position:absolute;right:-50%;width:200%}.cropper-invisible{opacity:0}.cropper-bg{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAAHklEQVQokWP8//8/AymAiSTVoxpGNQwqmIYBDAwMDAAANt4CHGztXAAAAABJRU5ErkJggg==")}.cropper-hide{display:block;height:0;position:absolute;width:0}.cropper-hidden{display:none!important}.cropper-move{cursor:move}.cropper-crop{cursor:crosshair}.cropper-disabled .cropper-drag-box,.cropper-disabled .cropper-face,.cropper-disabled .cropper-line,.cropper-disabled .cropper-point{cursor:not-allowed}

/* P4.5 — stockage hiérarchique */
.place-tree{display:grid;gap:12px}.place-card{border:1px solid var(--line);border-radius:12px;background:var(--surface);overflow:hidden}.place-card__head{display:flex;gap:12px;align-items:center;padding:13px;background:var(--n-50);border-bottom:1px solid var(--line)}.place-card__head>div:first-of-type{flex:1;min-width:0}.place-card__head b,.place-card__head span{display:block}.place-card__head span{color:var(--text-3);font-size:11.5px;margin-top:2px}.place-card__children{padding:6px 12px 12px}.storage-node{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid var(--n-100)}.storage-node:last-child{border-bottom:0}.storage-node__main{display:flex;align-items:center;gap:10px}.storage-node__icon{width:34px;height:34px;border-radius:8px;background:var(--a-50);color:var(--a-700);display:grid;place-items:center;font-weight:800}.storage-node__text b,.storage-node__text span{display:block}.storage-node__text span{font-size:11.5px;color:var(--text-3)}

/* P4.5 — fiche alimentaire */
.food-score-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.food-score{display:flex;align-items:center;gap:7px;padding:7px 9px;border:1px solid var(--line);border-radius:8px;background:var(--n-25)}.food-score b{font-size:12px}.food-score .nutri{width:28px;height:28px;font-size:14px}.nutrition-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.nutrition-grid .f{min-width:0}@media(max-width:760px){.nutrition-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* P4.5 — éditeur d'image et arborescence de stockage */
.image-editor{display:grid;gap:12px}.image-editor__stage{height:min(58vh,520px);background:#161b22;border-radius:10px;overflow:hidden;display:grid;place-items:center}.image-editor__stage img{display:block;max-width:100%;max-height:100%}.image-editor__tools{display:grid;gap:9px}.field-unit{display:flex;align-items:center;gap:7px}.field-unit input{min-width:0}.field-unit span{font-size:12px;color:var(--text-3);min-width:28px}.storage-tree{display:grid;gap:14px}.storage-place{overflow:hidden}.storage-place__head{gap:8px;flex-wrap:wrap}.storage-place__identity{display:flex;align-items:center;gap:11px;min-width:190px}.storage-place__identity img,.storage-place__icon{width:42px;height:42px;object-fit:contain;border-radius:9px;background:var(--n-50);display:grid;place-items:center;font-size:21px}.storage-place__identity h2{margin:0 0 2px}.storage-place__body{padding:5px 14px 12px}.storage-node{display:flex;grid-template-columns:none;gap:10px}.storage-node--direct{padding:11px 12px;margin:8px 0;border:1px dashed var(--a-300);border-radius:9px;background:var(--a-25)}.storage-node--direct>div:first-child{min-width:0}.storage-node--direct b,.storage-node--direct span{display:block}.storage-node--direct span{font-size:12px;color:var(--text-3);margin-top:3px}.storage-node__main img{width:34px;height:34px;object-fit:contain;border-radius:8px;background:var(--n-50)}.storage-node__main b,.storage-node__main span,.storage-node__main small{display:block}.storage-node__main span,.storage-node__main small{font-size:11.5px;color:var(--text-3);margin-top:2px}.empty--compact{padding:16px 8px}.food-section textarea{resize:vertical}
@media(max-width:720px){.storage-place__head .sp{display:none}.storage-place__head{align-items:flex-start}.storage-place__identity{flex:1 1 100%}.storage-node{align-items:flex-start;flex-wrap:wrap}.storage-node .sp{display:none}.storage-node__main{flex:1 1 100%}.image-editor__stage{height:48vh}}

/* P4.6 — sélection multiple et actions catalogue */
.select-col{width:42px;text-align:center!important}.select-col input{width:17px;height:17px;margin:0;vertical-align:middle}
.bulk-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:10px 0;padding:10px 12px;border:1px solid var(--a-200);border-radius:11px;background:var(--a-25);box-shadow:var(--shadow-sm)}
.bulk-bar__count{display:flex;align-items:baseline;gap:7px;min-width:180px}.bulk-bar__count b{font-size:18px;color:var(--a-800)}.bulk-bar__count span{font-size:11px;color:var(--text-3)}
.bulk-bar__actions{display:flex;gap:7px;flex-wrap:wrap;margin-left:auto}
.bulk-order-lines{max-height:min(52vh,520px);overflow:auto;margin-top:14px}.bulk-order-lines td{vertical-align:middle}.bulk-order-lines input,.bulk-order-lines select{min-width:0}
@media(max-width:720px){.bulk-bar{align-items:stretch}.bulk-bar__actions{margin-left:0;width:100%}.bulk-bar__actions .btn{flex:1 1 calc(50% - 7px);justify-content:center}.bulk-order-lines .product-photo{display:none}.bulk-order-lines table{min-width:620px}}

/* P4.7.0 — médias produits et alimentaire */
.image-source-summary{display:flex;flex-direction:column;gap:3px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--n-25)}
.image-source-summary b{font-size:12.5px}.image-source-summary span{font-size:11.5px;color:var(--text-3)}
.food-tab-head{display:flex;align-items:flex-start;gap:16px;justify-content:space-between;margin-bottom:14px;padding:2px 2px 0}.food-tab-head h3{margin:0 0 3px}.food-tab-head p{margin:0;color:var(--text-3);font-size:12px;line-height:1.45}
.allergen-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:3px}.allergen-check{display:flex;align-items:flex-start;gap:8px;padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:var(--surface);font-size:12px;line-height:1.35;cursor:pointer}.allergen-check:has(input:checked){border-color:var(--a-300);background:var(--a-50)}.allergen-check input{margin-top:1px;flex:0 0 auto}
@media(max-width:640px){.food-tab-head{flex-direction:column}.food-tab-head .btn{width:100%;justify-content:center}.allergen-grid{grid-template-columns:1fr}.imgpick{flex-direction:column}.imgpick__box{width:100%;height:min(52vw,240px)}}

/* ================================================= P4.7 CATALOGUE ======== */
.catalog-context-note{display:flex;align-items:center;gap:10px;margin:-2px 0 10px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--n-25);color:var(--text-2)}
.catalog-context-note b{color:var(--text);font-size:12.5px}.catalog-context-note span{font-size:12px}
.filter-count{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--a-600);color:#fff;font-size:10px;font-weight:800}
.ref-filters{margin:0 0 10px;padding:12px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--sh-1)}
.ref-filters__head{display:flex;align-items:center;gap:10px;margin-bottom:10px}.ref-filters__head>div{display:flex;flex-direction:column}.ref-filters__head span{font-size:11.5px;color:var(--text-3)}.ref-filters__head .btn{margin-left:auto}
.ref-filter-grid{display:grid;grid-template-columns:repeat(5,minmax(145px,1fr));gap:9px}.ref-filter-grid .f label{font-size:11px}
.grouped-refs .ref-category-row td{padding:9px 12px;background:var(--n-100);border-top:2px solid var(--n-200);border-bottom:1px solid var(--n-200)}
.grouped-refs .ref-category-row td>div,.grouped-refs .ref-subcategory-row td>div{display:flex;align-items:center;gap:10px}.grouped-refs .ref-category-row b{font-size:13px}.grouped-refs .ref-category-row span{color:var(--text-2);font-size:11.5px}
.grouped-refs .ref-subcategory-row td{padding:6px 12px 6px 24px;background:var(--n-25);border-bottom:1px solid var(--line)}.grouped-refs .ref-subcategory-row b{font-size:11.5px;color:var(--text-2)}.grouped-refs .ref-subcategory-row span{font-size:10.5px;color:var(--text-3)}
.grouped-refs tbody tr[data-ref-row] td:first-child{padding-left:18px}
.supplier-cell{display:flex;align-items:center;gap:10px;min-width:220px}.supplier-logo{--supplier-logo-size:42px;width:var(--supplier-logo-size);height:var(--supplier-logo-size);flex:0 0 var(--supplier-logo-size);display:grid;place-items:center;border:1px solid var(--line);border-radius:10px;background:#fff;overflow:hidden}.supplier-logo img{width:100%;height:100%;object-fit:contain;padding:4px}.supplier-logo b{display:none;font-size:11px;color:var(--text-2)}.supplier-logo--empty b,.supplier-logo--broken b{display:block}.supplier-logo--empty,.supplier-logo--broken{background:var(--n-50)}
.supplier-logo-editor{display:flex;gap:14px;align-items:center;margin-bottom:16px;padding:12px;border:1px solid var(--line);border-radius:var(--r);background:var(--n-25)}.supplier-logo-editor__actions{display:flex;flex-direction:column;gap:6px;min-width:0}.supplier-logo-editor__actions .row{display:flex;gap:7px;flex-wrap:wrap}.supplier-logo-editor .supplier-logo{border-radius:14px}
@media(max-width:1100px){.ref-filter-grid{grid-template-columns:repeat(3,minmax(140px,1fr))}}
@media(max-width:700px){.refs-main-tools .search{flex-basis:100%}.ref-filter-grid{grid-template-columns:1fr 1fr}.supplier-logo-editor{align-items:flex-start}.grouped-refs{min-width:980px}}
@media(max-width:440px){.ref-filter-grid{grid-template-columns:1fr}.supplier-logo-editor{flex-direction:column}.supplier-logo-editor .supplier-logo{--supplier-logo-size:110px}}
.product-source-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.product-source-line>span:last-child{font-size:11.5px;color:var(--text-3)}

/* P4.7.5 — panneau de filtres catalogue */
body.filter-drawer-open{overflow:hidden}
.filter-drawer-backdrop{position:fixed;inset:0;background:rgba(26,22,30,.28);backdrop-filter:blur(1px);z-index:1190}
.filter-drawer{position:fixed;z-index:1200;top:0;right:0;bottom:0;width:min(445px,100vw);display:flex;flex-direction:column;background:var(--surface);border-left:1px solid var(--line);box-shadow:-14px 0 38px rgba(30,25,35,.16);transform:translateX(102%);transition:transform .18s ease}
.filter-drawer.open{transform:translateX(0)}
.filter-drawer__head{height:64px;flex:0 0 64px;display:flex;align-items:center;padding:0 18px 0 24px;border-bottom:1px solid var(--line)}
.filter-drawer__title{display:flex;align-items:center;gap:11px;font-size:17px}.filter-drawer__title svg{width:20px;height:20px}
.filter-drawer__head .btn{margin-left:auto;font-size:25px;font-weight:300}
.filter-drawer__body{flex:1;overflow:auto;padding:25px 24px 100px;display:flex;flex-direction:column;gap:17px}
.filter-drawer__foot{position:absolute;left:0;right:0;bottom:0;min-height:76px;padding:14px 24px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--surface);border-top:1px solid var(--line)}
.filter-field{display:flex;flex-direction:column;gap:7px}.filter-field>label{font-size:12px;text-transform:uppercase;letter-spacing:.02em;color:var(--text-3);font-weight:700}
.filter-field>input,.filter-field>select,.filter-readonly-search,.filter-picker>summary{min-height:41px;border:1px solid var(--line);border-radius:7px;background:var(--surface-2);padding:0 12px;color:var(--text);font-size:13.5px}
.filter-readonly-search{display:flex;align-items:center;color:var(--text-3)}
.filter-picker{position:relative}.filter-picker>summary{display:flex;align-items:center;gap:8px;cursor:pointer;list-style:none}.filter-picker>summary::-webkit-details-marker{display:none}
.filter-picker>summary:before{content:'›';font-size:18px;color:var(--text-3)}.filter-picker[open]>summary:before{transform:rotate(90deg)}
.filter-picker>summary span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.filter-picker>summary b{min-width:20px;color:var(--brand);font-size:12px;text-align:right}
.filter-picker[open]>summary{border-color:var(--brand);box-shadow:0 0 0 1px color-mix(in srgb,var(--brand) 15%,transparent)}
.filter-picker__menu{margin-top:6px;max-height:220px;overflow:auto;border:1px solid var(--line);border-radius:8px;background:var(--surface);box-shadow:var(--sh-2);padding:6px}
.filter-picker__menu label{display:flex;align-items:center;gap:9px;padding:8px;border-radius:6px;cursor:pointer;font-size:13px}.filter-picker__menu label:hover{background:var(--surface-2)}
.filter-picker__menu input{width:16px;height:16px}.filter-picker__menu span{flex:1}.filter-picker__menu small{color:var(--text-3)}
.active-filter-chips{margin-bottom:8px}.active-filter-chips:empty{display:none}.active-filter-chips__inner{display:flex;gap:7px;flex-wrap:wrap}
.filter-chip{border:1px solid color-mix(in srgb,var(--brand) 35%,var(--line));background:color-mix(in srgb,var(--brand) 7%,var(--surface));color:var(--text);border-radius:999px;padding:5px 9px;font:inherit;font-size:11.5px;cursor:pointer}.filter-chip span{color:var(--brand);font-size:15px;margin-left:4px}.filter-chip--clear{border-style:dashed;background:transparent;color:var(--text-3)}

/* P4.7.5 — contacts fournisseurs structurés */
.supplier-contact-list{display:flex;flex-direction:column;gap:10px}.supplier-contact-card{display:flex;align-items:center;gap:12px;padding:13px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface)}
.supplier-contact-card__avatar{width:42px;height:42px;flex:0 0 42px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--brand) 12%,var(--surface));color:var(--brand);font-weight:750;font-size:12px}
.supplier-contact-card__body{min-width:0;flex:1;display:flex;flex-direction:column;gap:4px}.supplier-contact-card__title{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.supplier-contact-card__body>span,.supplier-contact-card__body>small{color:var(--text-3);font-size:12px}.supplier-contact-card__actions{display:flex;gap:6px}

/* P4.7.5 — audit des références */
.audit-timeline{display:flex;flex-direction:column;gap:12px;margin-bottom:14px}.audit-card{display:flex;align-items:flex-start;gap:14px;padding:16px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface)}
.audit-card__icon{width:38px;height:38px;flex:0 0 38px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--brand) 10%,var(--surface));color:var(--brand);font-size:19px}.audit-card small{display:block;text-transform:uppercase;font-size:10.5px;font-weight:700;letter-spacing:.04em;color:var(--text-3)}.audit-card h3{margin:3px 0;font-size:15px}.audit-card p{margin:0;color:var(--text-3);font-size:12.5px}.audit-card--warning .audit-card__icon{background:color-mix(in srgb,var(--wa-500) 15%,var(--surface));color:var(--wa-500)}
@media(max-width:620px){.filter-drawer{width:100vw}.filter-drawer__body{padding-left:18px;padding-right:18px}.filter-drawer__foot{padding-left:18px;padding-right:18px}.supplier-contact-card{align-items:flex-start;flex-wrap:wrap}.supplier-contact-card__body{min-width:calc(100% - 60px)}.supplier-contact-card__actions{width:100%;justify-content:flex-end}}

/* P4.7.5 — recettes réutilisables et associations Qweekle */
.association-choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.choice-card{display:flex;position:relative;flex-direction:column;gap:6px;padding:14px;border:1px solid var(--line,#dfe3e8);border-radius:12px;background:var(--panel,#fff);cursor:pointer;min-height:112px}
.choice-card:hover,.choice-card.on{border-color:var(--primary,#7c3aed);box-shadow:0 0 0 2px color-mix(in srgb,var(--primary,#7c3aed) 14%,transparent)}
.choice-card input{position:absolute;right:12px;top:12px}
.choice-card b{padding-right:24px}
.choice-card span{font-size:.86rem;line-height:1.35;color:var(--muted,#667085)}
@media(max-width:760px){.association-choice-grid{grid-template-columns:1fr}.choice-card{min-height:auto}}

/* P4.7.5 — tarifs par conditionnement */
.tariff-equivalence{padding:11px 13px;border:1px solid color-mix(in srgb,var(--brand) 28%,var(--line));border-radius:9px;background:color-mix(in srgb,var(--brand) 6%,var(--surface));font-size:12.5px;line-height:1.45;color:var(--text-2)}
.tariff-equivalence b{color:var(--text)}
@media(max-width:620px){.tariff-equivalence{font-size:12px}}

/* P4.8.0 — Produits de vente */
.row-actions{display:flex;justify-content:flex-end;gap:6px;flex-wrap:wrap}
.sale-product-tabs{align-items:center;margin-bottom:10px}
.sale-product-tabs .seg{max-width:100%;overflow:auto;scrollbar-width:thin}
@media(max-width:760px){
  .sale-product-tabs{align-items:stretch;flex-direction:column}
  .sale-product-tabs .seg{display:flex;width:100%}
  .sale-product-tabs .seg button{white-space:nowrap;flex:0 0 auto}
  .row-actions{justify-content:flex-start}
}

/* P4.8.0 — variantes Qweekle */
.sale-parent-row td{padding:10px 13px;background:color-mix(in srgb,var(--brand) 5%,var(--n-50));border-top:2px solid color-mix(in srgb,var(--brand) 20%,var(--line));border-bottom:1px solid var(--line)}
.sale-parent-summary{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}.sale-parent-summary>div{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.sale-parent-summary b{font-size:13.5px}.sale-parent-summary>div:last-child span{font-size:11.5px;color:var(--text-2)}
.sale-variant-row td:first-child{padding-left:26px}.sale-product-name{display:flex;align-items:flex-start;gap:8px}.sale-product-name--variant{padding-left:4px}.sale-variant-branch{font-size:18px;line-height:18px;color:var(--brand);font-weight:700}.sale-product-name .tag{vertical-align:1px}
@media(max-width:760px){.sale-parent-summary{align-items:flex-start;flex-direction:column;gap:7px}.sale-variant-row td:first-child{padding-left:18px}.sale-products-table{min-width:980px}}

/* P4.8.0 — produits de vente Qweekle : variantes, filtres et actions groupées */
.sale-product-thumb,.sale-parent-thumb{width:42px;height:42px;flex:0 0 42px;object-fit:contain;object-position:center;border:1px solid var(--line);border-radius:8px;background:var(--surface-2)}
.sale-product-thumb--empty{display:grid;place-items:center;color:var(--text-3);font-size:11px}.sale-parent-thumb{width:32px;height:32px;flex-basis:32px;border-radius:6px}
.sale-product-name{align-items:center}.sale-product-name>div{min-width:0}.sale-channel-tags{display:flex;gap:4px;flex-wrap:wrap;max-width:230px}.sale-channel-tags .tag{font-size:10.5px}
.sale-parent-summary>div:first-child{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.sale-products-table tr.is-muted td{opacity:.68;background:var(--n-25)}
.check-all-label{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--text-3);cursor:pointer}.check-all-label input{width:16px;height:16px}
.sale-products-table .select-col{width:38px;text-align:center}.sale-products-table .select-col input{width:16px;height:16px}
@media(max-width:820px){.sale-products-table{min-width:1120px}.sale-product-thumb{width:36px;height:36px;flex-basis:36px}}

/* P4.8.0 — associations visuelles et usages Signage */
.copy-field{display:flex;gap:7px;align-items:center}.copy-field input{min-width:0;flex:1}.copy-field .btn{flex:0 0 auto}
.association-target-picker{margin-top:14px}.association-target-picker>.search{width:100%;max-width:none;margin-bottom:9px}.association-target-results{max-height:390px;overflow:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:2px}
.association-target-card{position:relative;display:flex;align-items:center;gap:10px;min-width:0;text-align:left;padding:9px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);cursor:pointer}.association-target-card:hover{border-color:color-mix(in srgb,var(--brand) 45%,var(--line));background:var(--surface-2)}.association-target-card.is-selected{border-color:var(--brand);box-shadow:0 0 0 2px color-mix(in srgb,var(--brand) 13%,transparent)}
.association-target-card img,.association-target-card__image{width:54px;height:54px;flex:0 0 54px;object-fit:contain;object-position:center;border:1px solid var(--line);border-radius:8px;background:var(--surface-2);display:grid;place-items:center;font-size:22px}.association-target-card__body{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}.association-target-card__body b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.association-target-card__body small{color:var(--text-3);font-size:11px;line-height:1.35}.association-target-card__check{opacity:0;color:var(--brand);font-weight:800}.association-target-card.is-selected .association-target-card__check{opacity:1}
.signage-usage-button b{color:var(--brand)}.signage-usage-list{display:flex;flex-direction:column;gap:10px}.signage-usage-card{display:flex;flex-direction:column;gap:10px;padding:13px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}.signage-usage-card__head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.signage-usage-card__head>div{display:flex;flex-direction:column;gap:3px}.signage-usage-card__head span{font-size:11.5px;color:var(--text-3)}.signage-screen-tags{display:flex;gap:5px;flex-wrap:wrap}.signage-usage-card>a{align-self:flex-start}
@media(max-width:720px){.association-target-results{grid-template-columns:1fr}.copy-field{flex-wrap:wrap}.copy-field input{flex-basis:100%}.sale-products-table{min-width:1240px}}

/* P4.8.1 — vue Affichage Signage */
.display-kpis{margin-bottom:14px}.display-screen-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(420px,1fr));gap:14px}.display-screen-card{min-width:0}.display-screen-card .panel__head{display:flex;align-items:center;justify-content:space-between;gap:12px}.display-screen-card .panel__head h2{margin:0}.display-product-list{display:flex;flex-direction:column}.display-product-row{display:grid;grid-template-columns:52px minmax(0,1fr) auto auto;align-items:center;gap:10px;padding:10px 14px;border-top:1px solid var(--border,#e5e5e5)}.display-product-row:first-child{border-top:0}.display-product-row.is-unavailable{background:rgba(215,25,32,.035)}.display-product-image{width:52px;height:52px;border:1px solid var(--border,#ddd);border-radius:8px;object-fit:contain;background:#fff}.display-product-image--empty{display:grid;place-items:center;color:#999}.display-product-main{display:flex;flex-direction:column;gap:4px;min-width:0}.display-product-main b,.display-product-main small{overflow:hidden;text-overflow:ellipsis}.display-product-main small{color:var(--muted,#777);white-space:normal;line-height:1.3}@media(max-width:700px){.display-screen-grid{grid-template-columns:1fr}.display-product-row{grid-template-columns:44px minmax(0,1fr) auto}.display-product-image{width:44px;height:44px}.display-product-row .btn{grid-column:2/4;width:100%}}

/* P4.8 — vue Affichage regroupée par produit unique */
.display-products-panel{min-width:0}.display-product-row--unique{grid-template-columns:64px minmax(0,1fr) auto auto;padding:14px}.display-product-row--unique .display-product-image{width:64px;height:64px}.display-screen-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:5px}.display-screen-tags .tag{max-width:100%;white-space:normal}.display-product-row--unique .display-product-main>small:last-child{margin-top:3px}@media(max-width:700px){.display-product-row--unique{grid-template-columns:52px minmax(0,1fr) auto}.display-product-row--unique .display-product-image{width:52px;height:52px}.display-product-row--unique .btn{grid-column:2/4;width:100%}}

/* P4.8.2 — filtres Affichage et registres HACCP */
.display-filter-bar{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 12px}.display-filter-bar select{min-width:180px;max-width:260px}.haccp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:14px;margin-bottom:14px}.haccp-grid .panel__body{padding:14px}.haccp-grid .panel__head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.haccp-grid .panel__head>div:first-child{min-width:160px;flex:1}.haccp-grid h2{margin:0}
@media(max-width:700px){.display-filter-bar select{min-width:100%;max-width:none}.haccp-grid{grid-template-columns:1fr}}
/* 4.8.3 — colis fournisseurs composés */
.pkg-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:14px}.pkg-card{min-width:0}.pkg-card.is-archived{opacity:.68}.pkg-card .panel__head{display:flex;justify-content:space-between;gap:12px}.pkg-card .panel__head h2{margin:0}.pkg-card-body{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:14px}.pkg-card-body>div{display:flex;flex-direction:column;gap:3px}.pkg-card-body small{color:var(--muted,#777)}.pkg-actions{display:flex;gap:8px;flex-wrap:wrap;padding:0 14px 14px}.pkg-line{display:grid;grid-template-columns:minmax(220px,1fr) 120px auto auto 40px;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid var(--border,#ddd)}.pkg-line label{font-size:12px;white-space:nowrap}.pkg-receive-lines{display:flex;flex-direction:column;gap:8px}.pkg-receive-line{display:grid;grid-template-columns:minmax(160px,1fr) 110px 150px 145px;gap:8px;align-items:center}.pkg-history-row{display:grid;grid-template-columns:minmax(180px,1fr) 100px 160px 150px 140px;gap:10px;padding:10px 14px;border-top:1px solid var(--border,#ddd);align-items:center}.pkg-history-row:first-child{border-top:0}@media(max-width:760px){.pkg-grid{grid-template-columns:1fr}.pkg-card-body{grid-template-columns:1fr}.pkg-line,.pkg-receive-line,.pkg-history-row{grid-template-columns:1fr}.pkg-line button{width:100%}}

/* Regroupements de références — offres fournisseurs multiples */
.pkg-offer{display:grid;grid-template-columns:minmax(180px,1.4fr) minmax(130px,1fr) 110px 90px 80px auto auto 40px;gap:8px;align-items:center;padding:10px 0;border-bottom:1px solid var(--border,#e5e5e5)}
.pkg-offer:last-child{border-bottom:0}.pkg-offer label{display:flex;align-items:center;gap:5px;font-size:.85rem;white-space:nowrap}.pkg-offer input,.pkg-offer select{min-width:0}
@media(max-width:980px){.pkg-offer{grid-template-columns:1fr 1fr}.pkg-offer .btn{width:100%}}

/* 4.8.5 — Regroupements de références dans le catalogue */
.pkg-card-title{display:flex;align-items:center;gap:12px;min-width:0}.pkg-card-image{width:54px;height:54px;border:1px solid var(--border,#ddd);border-radius:10px;object-fit:contain;background:#fff;flex:0 0 auto}.pkg-inline{display:grid;grid-template-columns:minmax(0,1fr) 110px;gap:8px}.pkg-line,.pkg-offer{display:grid;gap:8px;align-items:center;margin-bottom:8px}.pkg-line{grid-template-columns:minmax(220px,2fr) 120px auto auto 40px}.pkg-offer{grid-template-columns:minmax(160px,1.5fr) minmax(130px,1fr) 100px 100px 90px auto auto 40px}@media(max-width:900px){.pkg-line,.pkg-offer{grid-template-columns:1fr}.pkg-line .btn,.pkg-offer .btn{justify-self:end}.pkg-inline{grid-template-columns:1fr 100px}}

/* Module HACCP unifié + plan de nettoyage */
.haccp-home__hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px;border-radius:22px;background:linear-gradient(135deg,var(--panel,#fff),rgba(43,122,88,.10));border:1px solid var(--line,#ddd);margin-bottom:22px}.haccp-home__hero h2{font-size:32px;margin:4px 0 8px}.haccp-home__hero p{max-width:720px;margin:0;color:var(--muted,#667)}.haccp-home__badge{display:grid;place-items:center;width:96px;height:96px;border-radius:50%;font-weight:800;background:rgba(43,122,88,.14);color:#276b4f}.haccp-module-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.haccp-module-card{display:flex;gap:16px;padding:22px;border:1px solid var(--line,#ddd);border-radius:18px;background:var(--panel,#fff);color:inherit;text-decoration:none;transition:.18s}.haccp-module-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.08)}.haccp-module-card__icon{flex:0 0 52px;width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:rgba(43,122,88,.12);color:#276b4f}.haccp-module-card h3{margin:1px 0 7px;font-size:19px}.haccp-module-card p{margin:0 0 13px;color:var(--muted,#667)}.haccp-module-card span{font-weight:700}.cleaning-progress{margin-bottom:16px}.cleaning-progress__top{display:flex;align-items:center;justify-content:space-between}.cleaning-progress__top strong{font-size:26px}.cleaning-bar{height:10px;border-radius:99px;background:rgba(120,130,140,.18);overflow:hidden;margin-top:14px}.cleaning-bar span{display:block;height:100%;background:#2d8a62;border-radius:inherit}.cleaning-list{display:grid;gap:10px}.cleaning-item{display:flex;align-items:flex-start;gap:14px;padding:17px;border:1px solid var(--line,#ddd);border-radius:15px;background:var(--panel,#fff)}.cleaning-item.is-done{opacity:.72}.cleaning-item.is-done h3{text-decoration:line-through}.cleaning-check input{position:absolute;opacity:0}.cleaning-check span{display:block;width:27px;height:27px;border:2px solid #8b98a3;border-radius:8px;cursor:pointer}.cleaning-check input:checked+span{background:#2d8a62;border-color:#2d8a62;box-shadow:inset 0 0 0 6px #2d8a62}.cleaning-check input:checked+span:after{content:'✓';display:grid;place-items:center;color:#fff;font-weight:800}.cleaning-item__main{flex:1;min-width:0}.cleaning-item h3{margin:0 0 4px}.cleaning-item p{margin:9px 0;color:var(--muted,#667)}.cleaning-item small{display:block;margin-top:8px;color:#276b4f}@media(max-width:760px){.haccp-module-grid{grid-template-columns:1fr}.haccp-home__badge{display:none}.haccp-home__hero{padding:20px}.cleaning-item{flex-wrap:wrap}.cleaning-item .btn{margin-left:41px}}
.cleaning-item__actions{display:flex;gap:.45rem;align-items:center;flex-wrap:wrap}
@media(max-width:700px){.cleaning-item__actions{width:100%;justify-content:flex-end}}

/* HACCP catégories, huiles et registre */
.cleaning-tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin:0 0 1rem}.cleaning-group{margin:0 0 1.25rem}.cleaning-group__title{display:flex;align-items:center;justify-content:space-between;padding:.7rem .9rem;background:var(--panel,#fff);border:1px solid var(--line,#ddd);border-radius:.75rem .75rem 0 0}.cleaning-group__title h3{margin:0}.cleaning-group__title span{font-size:.85rem;color:var(--muted,#667)}.cleaning-group .cleaning-list{border-radius:0 0 .75rem .75rem}.category-row{display:grid;grid-template-columns:minmax(180px,1fr) 90px auto auto;gap:.5rem;align-items:center;margin:.5rem 0}.haccp-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem;margin-bottom:1rem}.haccp-stats>div{display:flex;flex-direction:column;padding:1rem;border:1px solid var(--line,#ddd);border-radius:.9rem;background:var(--panel,#fff)}.haccp-stats strong{font-size:1.7rem}.haccp-stats span{color:var(--muted,#667);font-size:.85rem}.haccp-stats .is-alert{border-color:#d97706}.fryer-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem;margin-bottom:1rem}.fryer-card{display:flex;justify-content:space-between;gap:1rem;padding:1rem;border:1px solid var(--line,#ddd);border-radius:1rem;background:var(--panel,#fff)}.fryer-card h3{margin:0 0 .3rem}.fryer-actions{display:flex;gap:.4rem;flex-wrap:wrap;align-content:flex-start;justify-content:flex-end}.fryer-last{display:grid;grid-template-columns:auto auto;gap:.25rem .6rem;margin-top:.8rem;align-items:center}.fryer-last em{grid-column:1/-1;width:max-content}.status-pill{display:inline-flex;padding:.22rem .55rem;border-radius:999px;font-size:.78rem;font-style:normal;background:#eef2f7}.status-conforme{background:#dcfce7;color:#166534}.status-a_surveille{background:#fef3c7;color:#92400e}.status-non_conforme{background:#fee2e2;color:#991b1b}.status-huile_changee{background:#dbeafe;color:#1e40af}.fryer-filters{display:flex;gap:.4rem;flex-wrap:wrap}@media(max-width:760px){.haccp-stats{grid-template-columns:repeat(2,1fr)}.category-row{grid-template-columns:1fr 80px}.category-row .btn{width:100%}.fryer-card{flex-direction:column}.fryer-actions{justify-content:flex-start}}

/* Éditeur de modèles d'étiquettes — v5.0.0 */
.label-template-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }
.label-template-layout { display:grid; grid-template-columns:minmax(240px,320px) minmax(0,1fr); gap:14px; align-items:start; }
.label-template-list { position:sticky; top:12px; }
.label-template-items { padding:12px; display:grid; gap:8px; }
.template-row { appearance:none; border:1px solid var(--line); background:var(--n-25); border-radius:10px; text-align:left; padding:10px; cursor:pointer; display:flex; flex-direction:column; gap:3px; color:var(--text); }
.template-row:hover,.template-row.on { border-color:var(--a-300); background:var(--a-50); }
.template-row span { font-size:11px; color:var(--text-3); }
.label-template-editor { display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,380px); gap:14px; padding:14px; align-items:start; }
.label-element-toolbar { display:flex; gap:8px; flex-wrap:wrap; margin:12px 0; }
.label-elements { display:grid; gap:8px; }
.label-element { border:1px solid var(--line); border-radius:10px; background:var(--n-25); padding:8px 10px; }
.label-element summary { cursor:pointer; display:flex; align-items:center; gap:8px; }
.label-element summary .btn { margin-left:auto; }
.btn--tiny { font-size:11px; padding:3px 7px; border-radius:999px; }
.label-editor-preview { position:sticky; top:12px; display:grid; gap:10px; }
.label-canvas-preview { min-height:170px; display:grid; place-items:center; border:1px dashed var(--line); border-radius:12px; background:var(--n-25); padding:12px; overflow:auto; }
.label-canvas-preview img { max-width:100%; background:#fff; border:1px solid var(--n-200); border-radius:6px; box-shadow:0 10px 24px rgba(15,23,42,.12); }
@media (max-width: 980px){ .label-template-layout,.label-template-editor{ grid-template-columns:1fr; } .label-template-list,.label-editor-preview{ position:static; } }

/* Éditeur de modèles d'étiquettes — v5.0.1 aperçu interactif */
.label-template-layout--v501{grid-template-columns:minmax(230px,300px) minmax(0,1fr)}
.label-template-editor--visual{grid-template-columns:minmax(360px,1fr) minmax(280px,390px)}
.label-editor-main{min-width:0;display:grid;gap:12px}.label-editor-inspector{display:grid;gap:12px;position:sticky;top:12px;align-self:start}.label-editor-stage-wrap{min-width:0}.label-canvas-preview--interactive{min-height:260px;padding:16px;align-items:center;justify-items:center}.label-template-stage{position:relative;width:min(100%,760px);background:#fff;border:1px solid var(--n-200);border-radius:8px;box-shadow:0 12px 28px rgba(15,23,42,.13);overflow:hidden;touch-action:none}.label-template-stage img{display:block;width:100%;height:100%;border:0;border-radius:0;box-shadow:none}.label-template-overlay{position:absolute;inset:0}.tpl-overlay-el{position:absolute;appearance:none;border:1.5px dashed rgba(37,99,235,.72);background:rgba(37,99,235,.10);color:#1d4ed8;border-radius:4px;min-width:8px;min-height:8px;padding:0;font-size:10px;font-weight:800;display:grid;place-items:center;cursor:move;touch-action:none}.tpl-overlay-el.on{border-style:solid;background:rgba(37,99,235,.22);box-shadow:0 0 0 2px rgba(37,99,235,.12)}.tpl-overlay-el.is-locked{border-color:rgba(100,116,139,.55);background:rgba(100,116,139,.08);color:#64748b;cursor:not-allowed}.label-elements--layers{display:grid;gap:7px;max-height:260px;overflow:auto}.template-layer{appearance:none;border:1px solid var(--line);background:var(--n-25);border-radius:10px;text-align:left;padding:9px;display:flex;justify-content:space-between;gap:8px;align-items:flex-start;cursor:pointer;color:var(--text)}.template-layer.on{background:var(--a-50);border-color:var(--a-300)}.template-layer span{display:flex;flex-direction:column;gap:2px;min-width:0}.template-layer b{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.template-layer small{font-size:10.5px;color:var(--text-3);line-height:1.25}.template-layer em{font-size:10px;font-style:normal;color:var(--text-3);background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:2px 6px}.label-element-props{display:grid;gap:10px;border:1px solid var(--line);border-radius:12px;background:var(--n-25);padding:12px}.label-layer-actions,.label-nudge-pad{display:flex;gap:6px;flex-wrap:wrap}.label-nudge-pad{padding:8px;border:1px dashed var(--line);border-radius:10px;background:var(--surface)}
@media(max-width:980px){.label-template-editor--visual{grid-template-columns:1fr}.label-editor-inspector{position:static}.label-canvas-preview--interactive{min-height:210px}}

/* 5.0.2 — Éditeur étiquettes : affectations, import/export, champs conditionnels */
.label-template-assignment-panel{margin-top:12px;border-top:1px solid var(--line);padding-top:12px;display:grid;gap:8px}.label-template-assignment-list{display:grid;gap:7px}.label-template-assignment-row{display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:7px 8px;font-size:12px}.label-template-assignment-row span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.empty--compact{font-size:12px;padding:10px}.label-inline-options{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.label-inline-options .access-toggle{margin:0}
@media(max-width:980px){.label-template-assignment-row{align-items:flex-start;flex-direction:column}.label-template-assignment-row span{white-space:normal}}

/* v503 — résolution automatique des modèles d'étiquettes */
.label-template-actions--v503 .btn[disabled]{opacity:.46;cursor:not-allowed}
.label-template-used{display:block;margin-top:3px;color:var(--text-3);font-size:11px;line-height:1.25}

/* v5.0.4 — Étiquettes : planche de contrôle et exports PNG */
.label-preview-head{gap:8px;flex-wrap:wrap}.label-preview-head .btn--sm{white-space:nowrap}.label-preview-head #labelCount{margin-left:2px}.label-preview-head .btn[disabled]{opacity:.45;cursor:not-allowed}
@media(max-width:760px){.label-preview-head{align-items:flex-start}.label-preview-head h2{width:100%}.label-preview-head .sp{display:none}.label-preview-head .btn--sm{flex:1 1 calc(50% - 6px)}}
/* v5.0.5 — éditeur d'étiquettes : poignée de redimensionnement */
.tpl-overlay-el{overflow:visible}.tpl-overlay-index{pointer-events:none;display:grid;place-items:center;width:100%;height:100%}.tpl-resize-handle{position:absolute;right:-6px;bottom:-6px;width:13px;height:13px;border:2px solid #fff;border-radius:4px;background:#2563eb;box-shadow:0 1px 4px rgba(15,23,42,.28);cursor:nwse-resize;touch-action:none}.tpl-overlay-el.on .tpl-resize-handle{display:block}.label-inline-options{display:flex;gap:8px;flex-wrap:wrap}
/* v5.0.6 — éditeur étiquettes : panneau allégé + interactions directes aperçu */
.label-editor-visual-only{border:1px dashed var(--line);border-radius:10px;background:var(--surface);padding:9px 10px;color:var(--text-2);font-size:12px;line-height:1.35;display:grid;gap:3px}.label-editor-visual-only small{color:var(--text-3);font-size:11px}.tpl-overlay-el{user-select:none;-webkit-user-select:none}.tpl-overlay-el:focus-visible{outline:3px solid rgba(37,99,235,.25);outline-offset:2px}.label-template-stage.is-dragging,.label-template-stage.is-dragging *{cursor:grabbing!important}

/* v5.0.7 — éditeur étiquettes : contrôles typo guidés et saisie fluide */
.label-type-toolbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;align-items:end;border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:10px}
.label-type-toolbar .access-toggle{margin:0;align-self:center;min-height:38px;display:flex;align-items:center}
.label-type-toolbar select,.label-type-toolbar input[type=color]{width:100%}
.label-type-toolbar input[type=color]{height:38px;padding:3px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
@media(max-width:520px){.label-type-toolbar{grid-template-columns:1fr}}

/* v5.0.8 — éditeur d’étiquettes : poignées plus faciles et texte auto-hauteur */
.tpl-resize-edge{position:absolute;display:block;background:rgba(37,99,235,.16);border-radius:999px;touch-action:none;z-index:2}.tpl-resize-edge--right{right:-5px;top:8px;bottom:8px;width:10px;cursor:ew-resize}.tpl-resize-edge--bottom{left:8px;right:8px;bottom:-5px;height:10px;cursor:ns-resize}.tpl-overlay-el[data-text-auto="1"] .tpl-resize-edge--bottom{display:none}.tpl-overlay-el.on{min-height:4px}.tpl-overlay-index{font-size:9px;line-height:1}.tpl-overlay-el.on .tpl-resize-edge:hover,.tpl-overlay-el.on .tpl-resize-handle:hover{background:#1d4ed8}

/* v5.1.0 — éditeur étiquettes : images libres, quadrillage, codes carrés */
.label-grid-toggle{margin-left:auto;margin-right:4px;min-height:30px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:4px 10px;font-size:12px}
.label-template-stage.show-grid::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;background-image:linear-gradient(to right,rgba(37,99,235,.18) 1px,transparent 1px),linear-gradient(to bottom,rgba(37,99,235,.18) 1px,transparent 1px);background-size:calc(100% / var(--label-grid-cols,89)) calc(100% / var(--label-grid-rows,36));}
.label-template-stage>img{position:relative;z-index:0}.label-template-overlay{z-index:2}.tpl-overlay-el.is-square-code{border-color:rgba(126,34,206,.78);background:rgba(126,34,206,.11);color:#6d28d9}.tpl-overlay-el.is-square-code.on{background:rgba(126,34,206,.22);box-shadow:0 0 0 2px rgba(126,34,206,.12)}
.label-image-upload-tools{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.label-image-upload-tools .btn{width:max-content}.label-element-props .fields.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:720px){.label-grid-toggle{margin-left:0}.label-element-props .fields.c3{grid-template-columns:1fr}}
/* v512 — Préparations : sélecteur type association produit de vente */
.prep-kind-grid{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:6px}
.prep-target-picker{margin-top:8px}
.prep-target-results{max-height:360px}
.prep-selected-target{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:9px 10px;border:1px solid color-mix(in srgb,var(--brand) 22%,var(--line));background:color-mix(in srgb,var(--brand) 5%,var(--surface));border-radius:10px;margin-bottom:8px}
.prep-selected-target b{font-size:13px}.prep-selected-target small{width:100%;color:var(--text-3);font-size:11.5px}.prep-selected-target--empty{border-style:dashed;background:var(--surface-2)}
@media(max-width:900px){.prep-kind-grid{grid-template-columns:1fr}.prep-target-results{grid-template-columns:1fr}}

/* Préparations — aperçu plus compact */
.prep-impact .data{margin-top:6px}.prep-impact__chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.prep-selected-target--empty{padding:8px 10px}.prep-target-picker .association-target-results{max-height:300px}

.note--danger{background:var(--da-50);border-color:#fecaca;color:var(--da-700)}.note--danger b{color:var(--da-700)}