/* GPAO Pizza Factory */
:root {
  --red: #C8102E;
  --red-dark: #9E0C24;
  --ink: #1E293B;
  --ink-soft: #64748B;
  --line: #E2E8F0;
  --bg: #F4F7FB;
  --surface: #FFFFFF;
  --sidebar: #1A345E;
  --sidebar-ink: #EAF1FA;
  --green: #1D5E1A;
  --green-bg: #E3EFE2;
  --orange: #B45309;
  --orange-bg: #FDF0DD;
  --yellow: #8A6A00;
  --yellow-bg: #FBF3CF;
  --blue: #1D5FA8;
  --blue-bg: #E3EEFA;
  --grey: #64748B;
  --grey-bg: #EEF2F6;
  --danger-bg: #FBE4E6;
  /* Palette : bleu marine (menu), bleu ciel (actions), gris clair (fond), vert foncé (validation) ; rouge = sorties et erreurs */
  --navy: #1A345E;
  --primary: #38ADFA;
  --primary-dark: #1C8FDB;
  --primary-text: #0B7BC4;
  --primary-bg: #E6F4FE;
  --green-dark: #164A14;
  --green-text: #1D5E1A;
  --radius: 8px;
  --shadow: 0 1px 2px rgba(31, 26, 23, .06), 0 2px 8px rgba(31, 26, 23, .05);
  --font: 'Roboto', 'Segoe UI', system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font: 13px/1.45 var(--font); color: var(--ink); background: var(--bg); }
a { color: var(--primary-text); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2 { margin: 0; line-height: 1.25; }
h2 { font-size: 14px; margin-bottom: 8px; }
small { font-size: 11px; }
code { background: var(--grey-bg); padding: 1px 4px; border-radius: 4px; }

/* ---------------------------------------------------------------- Layout */
.app { min-height: 100vh; }
.navbar { background: var(--sidebar); color: var(--sidebar-ink); position: sticky; top: 0; z-index: 30; box-shadow: 0 2px 10px rgba(0, 0, 0, .15); }
.navbar-inner { max-width: 1400px; margin: 0 auto; padding: 0 20px; display: flex; align-items: center; gap: 18px; min-height: 46px; }
.brand { display: flex; align-items: center; gap: 10px; color: inherit; flex-shrink: 0; }
.brand:hover { text-decoration: none; }
.brand span { display: flex; flex-direction: column; line-height: 1.2; }
.brand strong { font-size: 18px; font-weight: 800; letter-spacing: .03em; }
.brand small { opacity: .65; }

.nav { display: flex; align-items: center; gap: 4px; flex: 1; }
.nav-link {
  display: inline-flex; align-items: center; gap: 4px; padding: 6px 10px; border-radius: 6px;
  color: var(--sidebar-ink); background: none; border: 0; font: 500 13px var(--font); cursor: pointer; opacity: .85;
}
.nav-link:hover, .menu.open > .nav-link { background: rgba(255, 255, 255, .08); text-decoration: none; opacity: 1; }
.nav-link.active { background: var(--primary); opacity: 1; }
.caret { font-size: 10px; opacity: .7; }

.menu { position: relative; }
.menu-user { margin-left: auto; }
/* Site de rattachement, affiché à gauche du nom de l'utilisateur */
.nav-site { margin-left: auto; padding: 3px 10px; border-radius: 12px; background: rgba(255, 255, 255, .1); color: var(--sidebar-ink); font-size: 12px; font-weight: 500; white-space: nowrap; }
.nav-site + .menu-user { margin-left: 6px; }
.nav-site-mobile { display: none; }
.menu-panel {
  display: none; position: absolute; top: calc(100% + 4px); left: 0; min-width: 200px; padding: 4px;
  background: var(--surface); border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 12px 30px rgba(31, 26, 23, .18);
}
.menu-user .menu-panel { left: auto; right: 0; }
.menu.open .menu-panel { display: block; }
.menu-panel a, .menu-item-btn {
  display: block; width: 100%; text-align: left; padding: 6px 10px; border-radius: 6px;
  color: var(--ink); background: none; border: 0; font: 13px var(--font); cursor: pointer;
}
.menu-panel a:hover, .menu-item-btn:hover { background: var(--grey-bg); text-decoration: none; }
.menu-panel a.active { background: var(--primary-bg); color: var(--navy); font-weight: 600; }
.menu-panel form { margin: 0; }
.menu-note { margin: 4px 12px 6px; font-size: 12px; color: var(--ink-soft); }
.nav-toggle { display: none; margin-left: auto; background: none; color: var(--sidebar-ink); border: 1px solid rgba(255, 255, 255, .25); border-radius: 7px; font-size: 18px; padding: 4px 10px; cursor: pointer; }

/* Seconde barre : tous les liens, groupés par rubrique */
.subnav { background: var(--surface); border-bottom: 1px solid var(--line); color: var(--ink); }
.subnav-inner { max-width: 1400px; margin: 0 auto; padding: 4px 20px; display: flex; flex-wrap: wrap; align-items: center; gap: 2px; }
.nav-group { display: contents; }
.subnav a { padding: 5px 8px; border-radius: 6px; color: var(--ink); font-weight: 500; white-space: nowrap; }
.subnav a:hover { background: var(--grey-bg); text-decoration: none; }
.subnav a.active { background: var(--primary-bg); color: var(--navy); font-weight: 700; box-shadow: inset 0 -2px 0 var(--primary); }

.main { min-width: 0; }
.content { padding: 14px 20px 32px; display: flex; flex-direction: column; gap: 12px; max-width: 1400px; margin: 0 auto; width: 100%; }
.page-title { font-size: 18px; font-weight: 700; }
/* Invisible à l'écran, lu par les lecteurs d'écran */
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ---------------------------------------------------------------- Composants */
.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 12px 14px; box-shadow: var(--shadow); }
.card-narrow { max-width: 720px; }
.card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.card-head h2 { margin: 0; }
.grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); gap: 12px; }
.empty-state { text-align: center; padding: 40px 20px; }

.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; }
.kpi { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 10px 14px; display: flex; flex-direction: column; color: var(--ink); box-shadow: var(--shadow); }
a.kpi:hover { text-decoration: none; border-color: var(--primary); }
.kpi-value { font-size: 22px; font-weight: 800; font-variant-numeric: tabular-nums; }
.kpi-label { color: var(--ink-soft); font-size: 12px; }
.kpi-warn { border-left: 4px solid var(--orange); }
.kpi-danger { border-left: 4px solid var(--red); }

.toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.toolbar-actions { margin-left: auto; display: flex; flex-wrap: wrap; gap: 8px; }
.site-picker { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.site-picker label { color: var(--ink-soft); font-weight: 500; }
.site-picker select { min-width: 180px; }

.filters { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; }
.filters label { display: flex; flex-direction: column; gap: 4px; font-weight: 500; color: var(--ink-soft); font-size: 12px; }

/* ---------------------------------------------------------------- Pizzas */
.pizza-calc { display: grid; grid-template-columns: minmax(280px, 380px) 1fr; gap: 12px; align-items: start; }
.inline-field { display: flex; align-items: center; gap: 6px; font-weight: 500; color: var(--ink-soft); }
.inline-field select { width: auto; }
.save-box { border-top: 1px solid var(--line); margin-top: 10px; padding-top: 10px; }
.save-box.stale { opacity: .6; }
.form-label { font-weight: 600; font-size: 12px; margin: 0 0 2px; }
.small-note { font-size: 12px; margin: 0 0 6px; }
.ingredients-table select { min-width: 200px; }
.ingredients-table td { padding-top: 3px; padding-bottom: 3px; }

/* ---------------------------------------------------------------- Approvisionnement */
.supply-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(420px, 1fr)); gap: 12px; align-items: start; }
.supply-card h2 a { color: inherit; }
.supply-meta { margin: 0 0 8px; font-size: 12px; color: var(--ink-soft); }

/* ---------------------------------------------------------------- Cases à cocher (suppression) */
th.check, td.check { width: 28px; padding-right: 0; text-align: center; }
td.check input, th.check input { width: 15px; height: 15px; margin: 0; cursor: pointer; accent-color: var(--primary-dark); vertical-align: middle; }
td.check input:disabled, th.check input:disabled { cursor: not-allowed; opacity: .35; }
tr.row-selected td { background: #FDF1F2; }

/* ---------------------------------------------------------------- Import Excel */
.import-inline { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.import-inline label { display: flex; align-items: center; gap: 8px; font-weight: 600; font-size: 12px; }
.import-inline input[type=file] { font-size: 12px; }
.toolbar > p { margin: 0; }

/* ---------------------------------------------------------------- Sous-onglets */
.tabs { display: flex; gap: 2px; border-bottom: 1px solid var(--line); }
.tab { padding: 7px 14px; color: var(--ink-soft); font-weight: 600; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.tab:hover { color: var(--ink); text-decoration: none; }
.tab.active { color: var(--navy); border-bottom-color: var(--primary); }

/* ---------------------------------------------------------------- Boutons */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 6px 12px; border-radius: 6px; border: 1px solid var(--line); background: var(--surface);
  color: var(--ink); font: 600 13px var(--font); cursor: pointer; white-space: nowrap;
}
.btn:hover { text-decoration: none; border-color: var(--ink-soft); }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.btn.is-busy { opacity: .6; cursor: wait; }
.btn-primary { background: var(--primary); border-color: var(--primary); color: #fff; font-weight: 600; }
.btn-primary:hover { background: var(--primary-dark); border-color: var(--primary-dark); }
.btn-ghost { background: transparent; }
.btn-danger-ghost { background: transparent; color: var(--red); border-color: #F0C3C9; }
.btn-danger-ghost:hover { background: var(--danger-bg); border-color: var(--red); }
.btn-sm { padding: 3px 9px; font-size: 12px; }
.btn-block { width: 100%; }
.inline-form { display: inline; margin: 0; }

/* ---------------------------------------------------------------- Formulaires */
.form { display: flex; flex-direction: column; gap: 10px; }
.form label { display: flex; flex-direction: column; gap: 3px; font-weight: 600; font-size: 12px; }
.form label small { font-weight: 400; color: var(--ink-soft); }
.form-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; margin-bottom: 10px; }
.form .form-row { margin-bottom: 0; }
.form-actions { display: flex; gap: 8px; margin-top: 10px; }
input[type=text], input[type=email], input[type=password], input[type=number], input[type=date], select, textarea {
  font: 13px var(--font); color: var(--ink); background: #fff; border: 1px solid #D5CCC3; border-radius: 6px; padding: 5px 8px; width: 100%;
}
.filters input, .filters select, .site-picker select { width: auto; }
input:focus, select:focus, textarea:focus { outline: 2px solid rgba(56, 173, 250, .3); border-color: var(--primary); }
.form label.checkbox, .radio-group label { flex-direction: row; align-items: center; gap: 8px; font-weight: 400; }
.radio-group { border: 0; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 8px 20px; }
.radio-group legend { font-weight: 500; margin-bottom: 6px; padding: 0; }
.input-qty { width: 96px !important; text-align: right; padding: 3px 6px !important; }
.table-compact th, .table-compact td { padding: 2px 8px; }
.table-compact .group-row th { padding: 3px 8px; }
.table-compact .input-qty { padding: 2px 6px !important; }
.table-compact .unit { display: inline-block; min-width: 42px; text-align: left; color: var(--ink-soft); }
.row-filled { background: var(--green-bg) !important; }
.create-recipes { margin-bottom: 6px; }
/* Accès d'un utilisateur */
/* Fiche utilisateur : informations à gauche, accès à droite */
.user-grid { display: grid; grid-template-columns: minmax(260px, 360px) minmax(0, 1fr); gap: 16px; align-items: start; }
.user-info { display: flex; flex-direction: column; gap: 8px; }
.user-info label:not(.checkbox) { display: flex; flex-direction: column; gap: 2px; font-weight: 600; }
.user-info input:not([type=checkbox]), .user-info select { width: 100%; }
.user-info label.checkbox { display: flex; flex-direction: row; align-items: center; gap: 6px; font-weight: 600; }
.user-info label.checkbox input { width: auto; margin: 0; }
@media (max-width: 900px) { .user-grid { grid-template-columns: 1fr; } }
.access-box { border: 1px solid var(--line); border-radius: var(--radius); padding: 8px 10px; margin: 0; }
.access-box legend { font-weight: 700; font-size: 12px; padding: 0 4px; }
.access-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 8px 16px; }
.access-group { display: flex; flex-direction: column; gap: 2px; }
.access-group strong { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-soft); }
.access-group .checkbox { font-size: 12px; font-weight: 400; }
/* Fiche du soir */
.row-filter { width: 260px !important; }
.sold-list { margin-top: 6px; }
.sold-list summary { cursor: pointer; color: var(--ink-soft); font-weight: 600; font-size: 12px; }
.sold-list ul { columns: 2; margin-top: 6px; font-size: 12px; }
.count-table td [data-gap], .count-table th { white-space: nowrap; }
.row-over { background: var(--danger-bg) !important; }
/* Nouvelle demande : 4 champs (site, fournisseur, date, remarque) sur une ligne quand il y a la place */
@media (min-width: 1101px) { .move-ui .mv-fields.request-fields { grid-template-columns: minmax(160px, 1fr) minmax(160px, 1fr) minmax(150px, 170px) minmax(200px, 2fr); } }
/* Tableaux type tableur (table[data-sheet]) : tri au clic sur l'en-tête, filtres sous l'en-tête, comme dans Excel */
.sheet thead tr:first-child th { height: 32px; padding-top: 0; padding-bottom: 0; box-sizing: border-box; }
.sheet th.sortable { cursor: pointer; user-select: none; }
.sheet th.sortable:hover { background: #EEF2F6; color: #1E293B; }
.sheet th.sortable:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; }
.sheet th.sortable::after { content: '↕'; margin-left: 5px; color: #CBD5E1; font-size: 11px; }
.sheet th[aria-sort="ascending"]::after { content: '▲'; color: var(--primary-dark); font-size: 9px; }
.sheet th[aria-sort="descending"]::after { content: '▼'; color: var(--primary-dark); font-size: 9px; }
.sheet .sheet-filters th { top: 32px; padding: 4px 6px; background: #FFFFFF; text-transform: none; letter-spacing: 0; }
.sheet .sheet-filters input, .sheet .sheet-filters select { width: 100%; min-width: 90px; height: 28px; padding: 0 8px; font-size: 12px; font-weight: 400;
  border: 1px solid #E2E8F0; border-radius: 6px; background: #FFFFFF; color: #1E293B; }
.sheet .sheet-filters input:focus, .sheet .sheet-filters select:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 2px rgba(56, 173, 250, .2); }
.sheet tbody tr[hidden] { display: none; }
.sheet-count { margin: 0; padding: 6px 12px; font-size: 12px; color: #64748B; border-top: 1px solid #E2E8F0; background: #F8FAFC; }
@media (pointer: coarse) { .sheet .sheet-filters input, .sheet .sheet-filters select { height: 36px; font-size: 16px; } .sheet .sheet-filters th { top: 32px; } }
/* Tableau de bord : consommation (même présentation que le stock actuel) */
.use-title { text-align: center; margin: 0 0 8px; }
.use-note { text-align: center; margin-top: 8px; }
/* Tableau de bord : évolution de la consommation (hausse en orange, baisse en vert) */
.trend-up { color: #B45309; font-weight: 600; }
.trend-down { color: var(--green-text); font-weight: 600; }
/* Demandes : pastille du menu, en-tête du formulaire */
.nav-count { display: inline-block; min-width: 18px; padding: 0 5px; border-radius: 9px; background: var(--red); color: #fff; font-size: 11px; font-weight: 700; line-height: 18px; text-align: center; }
.move-head.request-head { grid-template-columns: minmax(160px, 1fr) minmax(160px, 1fr) 150px minmax(220px, 2fr); }
@media (max-width: 760px) { .move-head.request-head { grid-template-columns: 1fr 1fr; } }
/* Paramètres › Suppression des données */
.danger-zone { border-color: #F0C3C9; }
.reset-field { display: flex; flex-direction: column; gap: 4px; font-weight: 600; font-size: 12px; max-width: 320px; margin: 10px 0; }
.reset-choices { border: 0; padding: 0; margin: 10px 0; display: flex; flex-direction: column; gap: 8px; }
.reset-choices legend { font-weight: 600; font-size: 12px; margin-bottom: 4px; }
.reset-choices label { display: flex; gap: 8px; align-items: flex-start; }
/* Stock */
.stock-search { display: block; max-width: 320px; margin: 0 auto 8px; }
.stock-legend { text-align: center; }
/* Tableau du stock resserré et centré (plus large seulement s'il y a beaucoup de sites) */
.stock-table { width: auto; min-width: min(560px, 100%); margin: 0 auto; }
.stock-table td:first-child, .stock-table th:first-child { padding-right: 32px; }
.stock-table td.num, .stock-table th.num { padding-left: 24px; }
.filters .stock-hide { flex-direction: row; align-items: center; gap: 6px; align-self: center; }
.stock-low { color: #B45309; font-weight: 700; }
.stock-legend { margin: 0 0 8px; font-size: 12px; }
.line-warn { margin: 4px 0 0; color: var(--red-dark); font-size: 12px; font-weight: 600; }
.line-warn[hidden], [data-move-over][hidden] { display: none; }
/* En-tête de saisie : Site · Date · Descriptif (plus large) · Destination, répartis sur toute la largeur */
.move-head { display: grid; grid-template-columns: minmax(160px, 1fr) 150px minmax(220px, 2fr); align-items: end; gap: 10px 16px; margin-bottom: 8px; }
.move-out .move-head { grid-template-columns: minmax(160px, 1fr) 150px minmax(220px, 2fr) minmax(160px, 1fr); }
.move-head label { display: flex; flex-direction: column; gap: 3px; font-weight: 600; font-size: 12px; min-width: 0; }
.move-head input, .move-head select { width: 100%; }
@media (max-width: 760px) {
  .move-head, .move-out .move-head { grid-template-columns: 1fr 1fr; }
  .move-head .move-description { grid-column: 1 / -1; }
}
/* Entrée = vert, Sortie = rouge : bandeau, bordure, bouton, lignes saisies, onglets, historique */
.btn-success { background: var(--green); border-color: var(--green); color: #fff; }
.btn-success:hover { background: var(--green-dark); border-color: var(--green-dark); }
.move-card { border-top: 4px solid var(--line); }
.move-in { border-top-color: var(--green); }
.move-out { border-top-color: var(--red); }
.move-banner { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin: -8px -10px 8px; padding: 6px 10px; border-radius: var(--radius) var(--radius) 0 0; }
.move-in .move-banner { background: var(--green-bg); color: #1E5A22; }
.move-out .move-banner { background: var(--danger-bg); color: var(--red-dark); }
.move-banner > strong { text-transform: uppercase; letter-spacing: .04em; font-size: 12px; }
.move-sign { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; color: #fff; font-weight: 800; font-size: 15px; line-height: 1; }
.move-in .move-sign { background: var(--green); }
.move-out .move-sign { background: var(--red); }
.move-out .row-filled { background: #FDEDEF !important; }
.move-out .row-filled td:first-child { box-shadow: inset 3px 0 0 var(--red); }
.move-in .row-filled td:first-child { box-shadow: inset 3px 0 0 var(--green); }
.tab-in.active { color: var(--green-text); border-bottom-color: var(--green); }
.tab-out.active { color: var(--red); border-bottom-color: var(--red); }
tr.mv-in td:first-child { box-shadow: inset 3px 0 0 var(--green); }
tr.mv-out td:first-child { box-shadow: inset 3px 0 0 var(--red); }
tr.mv-fix td:first-child { box-shadow: inset 3px 0 0 var(--yellow); }
/* Mouvements : deux colonnes — liste à gauche, recherche à droite */
.move-grid { display: grid; grid-template-columns: 340px minmax(0, 1fr); gap: 12px; align-items: start; }
.move-col-title { font-size: 13px; margin: 0 0 6px; display: flex; align-items: center; gap: 6px; }
.move-empty { margin: 6px 0; padding: 14px; text-align: center; border: 1px dashed var(--line); border-radius: var(--radius); }
.move-list .input-qty { width: 80px !important; }
.move-search-col { position: sticky; top: 90px; display: flex; flex-direction: column; gap: 6px; padding: 8px; background: var(--bg); border: 1px solid var(--line); border-radius: var(--radius); }
.move-search-col input[type=search] { width: 100%; }
.move-results { list-style: none; margin: 0; padding: 0; max-height: 320px; overflow-y: auto; background: var(--surface); border: 1px solid var(--line); border-radius: 6px; }
.move-results li { display: flex; justify-content: space-between; gap: 8px; padding: 4px 8px; cursor: pointer; border-bottom: 1px solid var(--line); }
.move-results li:last-child { border-bottom: 0; }
.move-results li small { color: var(--ink-soft); white-space: nowrap; }
.move-results li:hover, .move-results li.active { background: var(--grey-bg); }
.move-in .move-results li.active { box-shadow: inset 3px 0 0 var(--green); }
.move-out .move-results li.active { box-shadow: inset 3px 0 0 var(--red); }
.move-results li.added span { font-weight: 600; }
.move-pick { padding: 8px; background: var(--surface); border: 1px solid var(--line); border-radius: 6px; display: flex; flex-direction: column; gap: 6px; }
.move-pick[hidden], .move-empty[hidden] { display: none; }
.move-pick-row { display: flex; align-items: center; gap: 6px; }
.move-pick-row .input-qty { width: 110px !important; }
.input-error { border-color: var(--red) !important; outline: 2px solid rgba(200, 16, 46, .25); }
.move-site { display: flex; flex-direction: column; gap: 3px; font-weight: 600; font-size: 12px; }
.move-site strong { font-size: 13px; padding: 3px 0; }
.move-list .input-note { width: 100%; min-width: 120px; padding: 2px 6px; font-size: 12px; }
.saved-batch { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
#move-table td:first-child { width: 50%; }
kbd { font: 600 11px var(--font); padding: 0 4px; border: 1px solid var(--line); border-bottom-width: 2px; border-radius: 4px; background: var(--surface); }

/* ---------------------------------------------------------------- Tableaux */
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 5px 8px; text-align: left; border-bottom: 1px solid var(--line); vertical-align: middle; }
thead th { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-soft); font-weight: 600; background: #FBF9F7; white-space: nowrap; }
tbody tr:hover { background: #FCFAF8; }
.num { text-align: right; font-variant-numeric: tabular-nums; }
.nowrap { white-space: nowrap; }
.group-row th { background: var(--grey-bg); font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-soft); padding: 4px 8px; }
.row-warn { background: #FFF8F1; }
.row-muted td { opacity: .55; }
.matrix th a { color: inherit; }
.pick { font-size: 12px; color: var(--ink-soft); white-space: nowrap; }

/* ---------------------------------------------------------------- Badges & alertes */
.badge { display: inline-block; padding: 1px 7px; border-radius: 999px; font-size: 11px; font-weight: 600; white-space: nowrap; }
.badge-green { background: var(--green-bg); color: var(--green-text); }
.badge-orange { background: var(--orange-bg); color: var(--orange); }
.badge-yellow { background: var(--yellow-bg); color: var(--yellow); }
.badge-blue { background: var(--blue-bg); color: var(--blue); }
.badge-red { background: var(--danger-bg); color: var(--red-dark); }
.badge-grey { background: var(--grey-bg); color: var(--grey); }

.alert { padding: 7px 12px; border-radius: 6px; border: 1px solid; }
.alert-success { background: var(--green-bg); border-color: #BFDDC1; color: #1E5A22; }
.alert-error { background: var(--danger-bg); border-color: #F0C3C9; color: var(--red-dark); }
.alert-info { background: var(--blue-bg); border-color: #C3D8F0; color: var(--blue); }

.muted { color: var(--ink-soft); }
.text-danger { color: var(--red); font-weight: 600; }
.text-success { color: var(--green-text); }
.note { background: var(--yellow-bg); padding: 10px 12px; border-radius: 8px; margin: 12px 0 0; }
.plain-list { margin: 0; padding-left: 18px; }
.plain-list li { margin: 4px 0; }

.details { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 8px 18px; margin: 0; }
.details dt { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-soft); }
.details dd { margin: 2px 0 0; font-weight: 500; }

/* ---------------------------------------------------------------- Connexion */
.guest { display: flex; align-items: center; justify-content: center; min-height: 100vh; padding: 16px; background: var(--sidebar); }
.guest-card { background: var(--surface); border-radius: 14px; padding: 28px; width: 100%; max-width: 400px; display: flex; flex-direction: column; gap: 16px; box-shadow: 0 20px 50px rgba(0, 0, 0, .3); }
.brand-center { justify-content: center; padding: 0 0 6px; }
.guest-title { font-size: 18px; margin: 0; }

/* ---------------------------------------------------------------- Documents imprimables */
.print { background: #fff; padding: 24px; }
.print-actions { display: flex; gap: 10px; margin-bottom: 20px; }
.doc { max-width: 800px; margin: 0 auto; display: flex; flex-direction: column; gap: 20px; }
.doc-head { display: flex; justify-content: space-between; align-items: flex-start; }
.doc-head h1 { font-size: 24px; }
.doc-head p { margin: 4px 0 0; }
.doc-brand { font-size: 20px; font-weight: 700; color: var(--red); }
.doc-table th { background: var(--grey-bg); }
.signatures { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 30px; }
.sign-line { display: block; border-bottom: 1px solid var(--ink); height: 50px; }
.doc-head .doc-number { margin: 0; font-size: 16px; align-self: center; }
.doc-info { width: 100%; border-collapse: collapse; font-size: 12px; }
.doc-info th, .doc-info td { padding: 2px 8px 2px 0; text-align: left; vertical-align: top; border: 0; background: none; }
.doc-info th { width: 1%; white-space: nowrap; font-weight: 400; color: var(--ink-soft); text-transform: none; letter-spacing: 0; font-size: 12px; }
.doc-info td { font-weight: 500; padding-right: 18px; }
.doc-table { width: 100%; border-collapse: collapse; }
.doc-table th, .doc-table td { border: 1px solid #ddd; }
.print-hint { max-width: 800px; margin: 0 auto 14px; }

@media print {
  .no-print { display: none !important; }
  .print { padding: 0; }
  body { font-size: 12px; }
  /* Marge de page nulle : le navigateur n'ajoute plus ses lignes (date, titre, adresse, n° de page). */
  @page { size: A4; margin: 0; }
  body.print { padding: 14mm; }
  .doc-table th { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .doc-table tr { break-inside: avoid; }
}

/* ---------------------------------------------------------------- Mode compact
   Resserre tout l'affichage (texte, marges, lignes de tableau, boutons, champs).
   Pour revenir à l'affichage précédent : supprimer ce bloc. */
body { font-size: 12.5px; line-height: 1.35; }
h2 { font-size: 13px; margin-bottom: 6px; }
.navbar-inner { min-height: 38px; gap: 14px; }
.brand { gap: 8px; }
.brand img { width: 22px; height: 22px; }
.brand strong { font-size: 15px; }
.brand small { font-size: 10px; }
.subnav-inner { padding: 2px 16px; }
.subnav a { padding: 3px 7px; }
.content { padding: 8px 16px 24px; gap: 8px; }
.card { padding: 8px 10px; }
.card-head { margin-bottom: 6px; }
.grid-2, .pizza-calc, .supply-grid { gap: 8px; }
.kpis { gap: 8px; }
.kpi { padding: 6px 10px; }
.kpi-value { font-size: 18px; }
.kpi-label { font-size: 11px; }
.toolbar { gap: 6px 10px; }
.toolbar-actions { gap: 6px; }
.filters { gap: 8px; }
.filters label { gap: 2px; font-size: 11px; }
.tab { padding: 5px 11px; }
.btn { padding: 4px 10px; font-size: 12.5px; }
.btn-sm { padding: 2px 8px; font-size: 11.5px; }
.form { gap: 7px; }
.form label { gap: 2px; }
.form-row { gap: 7px; margin-bottom: 7px; }
.form-actions { margin-top: 7px; }
input[type=text], input[type=email], input[type=password], input[type=number], input[type=date], input[type=search], select, textarea {
  font-size: 12.5px; padding: 3px 6px;
}
.input-qty { width: 84px !important; padding: 2px 5px !important; }
th, td { padding: 3px 7px; }
thead th { font-size: 10.5px; }
.group-row th { padding: 2px 7px; font-size: 10.5px; }
th.check, td.check { width: 24px; }
td.check input, th.check input { width: 14px; height: 14px; }
.badge { padding: 0 6px; font-size: 10.5px; }
.alert { padding: 5px 10px; }
.note { padding: 6px 9px; margin-top: 8px; }
.details { gap: 6px 14px; }
.plain-list li { margin: 2px 0; }
.supply-meta { margin-bottom: 6px; font-size: 11.5px; }
.empty-state { padding: 24px 16px; }

/* ---------------------------------------------------------------- Tablettes : menu toujours visible (barre défilante), sans bouton ☰ */
@media (min-width: 601px) and (max-width: 900px) {
  .navbar-inner { padding: 0 14px; gap: 10px; }
  .brand small { display: none; }
  .subnav-inner { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding: 4px 10px; gap: 4px; }
  .subnav-inner::-webkit-scrollbar { display: none; }
  .subnav a { flex-shrink: 0; }
  .content { padding: 10px 12px 24px; }
  .grid-2, .pizza-calc, .supply-grid { grid-template-columns: 1fr; }
  .toolbar-actions { margin-left: 0; }
}

/* ---------------------------------------------------------------- Téléphones : menu replié derrière ☰ */
@media (max-width: 600px) {
  .content { padding: 8px 10px 24px; }
  .card { padding: 8px; }
  .navbar-inner { flex-wrap: wrap; padding: 0 16px; gap: 0; }
  .nav-toggle { display: inline-block; }
  .nav { display: none; flex-basis: 100%; flex-direction: column; align-items: stretch; padding: 6px 0 12px; }
  .nav-open .nav { display: flex; }
  .subnav { display: none; }
  .nav-open .subnav { display: block; }
  .subnav-inner { flex-direction: column; align-items: stretch; padding: 6px 16px 10px; gap: 2px; }
  .nav-link { width: 100%; justify-content: space-between; }
  .menu-user { margin-left: 0; border-top: 1px solid rgba(255, 255, 255, .12); margin-top: 6px; padding-top: 6px; }
  .menu-panel { position: static; box-shadow: none; border: 0; background: rgba(255, 255, 255, .05); margin: 2px 0 6px; }
  .menu-panel a, .menu-item-btn { color: var(--sidebar-ink); }
  .menu-panel a:hover, .menu-item-btn:hover { background: rgba(255, 255, 255, .08); }
  .menu-panel a.active { background: var(--primary); color: #fff; }
  .menu-note { color: var(--sidebar-ink); opacity: .6; }
  .page-title { font-size: 19px; }
  .grid-2, .pizza-calc, .supply-grid, .move-grid { grid-template-columns: 1fr; }
  .move-search-col { position: static; order: -1; }
  .toolbar-actions { margin-left: 0; }
  /* Site visible dans la barre même menu replié */
  .nav-site-desktop { display: none; }
  .nav-site-mobile { display: inline-block; max-width: 45vw; overflow: hidden; text-overflow: ellipsis; }
  .nav-toggle { margin-left: 8px; }
}
@media (max-width: 900px) {
  .move-grid { grid-template-columns: 1fr; }
  .move-search-col { position: static; order: -1; }
}

/* ---------------------------------------------------------------- Écrans moyens (tablettes, petits portables) */
@media (max-width: 1100px) {
  .move-head, .move-out .move-head, .move-head.request-head { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
  .move-head .move-description { grid-column: auto; }
  .move-grid { grid-template-columns: 280px minmax(0, 1fr); }
}

/* ---------------------------------------------------------------- Tablettes */
@media (max-width: 900px) {
  .move-grid { grid-template-columns: 1fr; }
  /* Sous-onglets : défilement horizontal plutôt qu'un retour à la ligne */
  .tabs { overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .tab { white-space: nowrap; flex-shrink: 0; }
  .card-head { flex-wrap: wrap; }
  .grid-2 { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------- Téléphones */
@media (max-width: 600px) {
  body { font-size: 13px; }
  .content { padding: 6px 6px 20px; gap: 6px; }
  .card { padding: 8px 6px; border-radius: 6px; }
  .navbar-inner { padding: 0 10px; }
  /* Champs à 16 px : évite le zoom automatique de l'iPhone à la saisie */
  input[type=text], input[type=email], input[type=password], input[type=number], input[type=date], input[type=search], select, textarea { font-size: 16px; padding: 6px 8px; }
  .btn { padding: 7px 12px; font-size: 13.5px; }
  .btn-sm { padding: 5px 10px; font-size: 12.5px; }
  /* Filtres et barres d'outils : un champ par ligne (deux pour les petits), boutons pleine largeur */
  .filters { gap: 6px; }
  .filters label { flex: 1 1 calc(50% - 6px); min-width: 0; }
  .filters input, .filters select { width: 100%; }
  .filters .stock-hide { flex-basis: 100%; }
  .filters > .btn, .toolbar-actions { flex: 1 1 100%; }
  .toolbar-actions .btn, .toolbar-actions form, .toolbar-actions form .btn { flex: 1 1 auto; text-align: center; }
  .stock-search { max-width: none; }
  /* Saisie Entrée / Sortie / Demande */
  .move-head, .move-out .move-head, .move-head.request-head { grid-template-columns: 1fr; }
  .move-pick-row { flex-wrap: wrap; }
  .move-list .input-qty { width: 70px !important; }
  .move-list .input-note { min-width: 90px; }
  .form-actions { flex-wrap: wrap; }
  .form-actions .btn { flex: 1 1 auto; }
  .saved-batch .btn { width: 100%; text-align: center; }
  /* Tableaux : plus serrés, défilement horizontal si besoin */
  th, td { padding: 4px 5px; }
  .stock-table { min-width: 0; width: 100%; }
  .stock-table td:first-child, .stock-table th:first-child { padding-right: 8px; }
  .stock-table td.num, .stock-table th.num { padding-left: 8px; }
  .kpis { grid-template-columns: 1fr 1fr; }
  .details { grid-template-columns: 1fr 1fr; }
  /* Documents (PDF) consultés sur téléphone */
  .print { padding: 10px; }
  .print-actions { flex-wrap: wrap; }
  .print-actions .btn { flex: 1 1 auto; text-align: center; }
  .doc { gap: 12px; }
  .doc-head h1 { font-size: 20px; }
  .doc-info, .doc-info tbody, .doc-info tr { display: block; }
  .doc-info tr { display: grid; grid-template-columns: auto 1fr; gap: 0 8px; }
  .doc-info th:empty, .doc-info td:empty { display: none; }
  .signatures { grid-template-columns: 1fr; gap: 12px; margin-top: 16px; }
}

/* Impression : toujours la mise en page A4 complète, même depuis un téléphone */
@media print {
  .doc-info { display: table; }
  .doc-info tbody { display: table-row-group; }
  .doc-info tr { display: table-row; }
  .doc-info th:empty, .doc-info td:empty { display: table-cell; }
  .signatures { grid-template-columns: repeat(3, 1fr); }
  .print { padding: 0; }
}

/* ================================================================ Saisie Entrée / Sortie (style ERP moderne)
   Deux cartes blanches sur fond gris très clair : à gauche la liste des ingrédients, à droite le mouvement.
   Uniquement l'apparence : la page Mouvements › Entrée / Sortie (formulaire .move-ui). */
.move-ui {
  --mv-accent: #1D5E1A; --mv-accent-dark: #164A14; --mv-accent-bg: #E3EFE2; --mv-ring: rgba(29, 94, 26, .2); --mv-head: #F1F7F0;
  --mv-ink: #1E293B; --mv-soft: #64748B; --mv-faint: #94A3B8; --mv-line: #E2E8F0; --mv-line-soft: #F1F5F9; --mv-bg: #F4F7FB;
  background: var(--mv-bg); border: 1px solid var(--mv-line); border-radius: 12px; padding: 14px; color: var(--mv-ink);
}
.move-ui.move-out { --mv-accent: #C8102E; --mv-accent-dark: #A00D25; --mv-accent-bg: #FDEEF0; --mv-ring: rgba(200, 16, 46, .16); --mv-head: #FBF2F3; }
.move-ui.move-card { border-top: 1px solid var(--mv-line); }
.move-ui > .alert { margin: 0 0 12px; border-radius: 8px; }
.mv-layout { display: grid; grid-template-columns: minmax(260px, 28%) minmax(0, 1fr); gap: 16px; align-items: start; }
.mv-layout > * { min-width: 0; }   /* le tableau défile dans sa carte au lieu d'élargir la page */
.mv-panel { background: #FFFFFF; border: 1px solid var(--mv-line); border-radius: 12px; box-shadow: 0 1px 2px rgba(15, 23, 42, .04); padding: 16px; }
.mv-title { margin: 0; font-size: 15px; font-weight: 700; color: var(--mv-ink); display: flex; align-items: center; gap: 10px; }

/* Champs : même hauteur, bordures fines, focus discret */
.move-ui input[type=text], .move-ui input[type=search], .move-ui input[type=date], .move-ui select {
  height: 40px; padding: 0 12px; border: 1px solid var(--mv-line); border-radius: 8px; background: #FFFFFF;
  color: var(--mv-ink); font-size: 13.5px; transition: border-color .15s, box-shadow .15s;
}
.move-ui input:focus, .move-ui select:focus { outline: none; border-color: var(--mv-accent); box-shadow: 0 0 0 3px var(--mv-ring); }
.move-ui .input-error { border-color: #C8102E !important; box-shadow: 0 0 0 3px rgba(200, 16, 46, .15) !important; outline: none; }

/* Colonne gauche : recherche + liste */
.move-ui .mv-side { position: sticky; top: 90px; display: flex; flex-direction: column; gap: 12px; max-height: calc(100vh - 110px); padding: 16px; background: #FFFFFF; border: 1px solid var(--mv-line); border-radius: 12px; }
.mv-search { width: 100%; }
.move-ui .mv-list { flex: 1; min-height: 220px; max-height: none; margin: 0 -8px; padding: 0 8px; overflow-y: auto; border: 0; border-radius: 0; background: none; scrollbar-width: thin; scrollbar-color: #CBD5E1 transparent; }
.mv-list::-webkit-scrollbar { width: 6px; }
.mv-list::-webkit-scrollbar-thumb { background: #CBD5E1; border-radius: 3px; }
.move-ui .mv-list li { align-items: center; padding: 10px 12px; border-bottom: 1px solid var(--mv-line-soft); border-radius: 8px; font-size: 13.5px; color: var(--mv-ink); transition: background .12s; }
.move-ui .mv-list li small { color: var(--mv-ink); font-size: 13px; font-weight: 500; font-variant-numeric: tabular-nums; }
.move-ui .mv-list li:hover { background: var(--mv-bg); }
.move-ui .mv-list li.active { background: var(--mv-bg); box-shadow: inset 3px 0 0 var(--mv-line); }
.move-ui .mv-list li.selected { background: var(--mv-accent-bg); box-shadow: inset 3px 0 0 var(--mv-accent); font-weight: 600; }
.move-ui .mv-list li.added small { color: var(--mv-accent); font-weight: 600; }
.move-ui .mv-list li.is-zero span, .move-ui .mv-list li.is-zero small { color: var(--mv-faint); }
.move-ui .mv-pick { padding: 12px; background: var(--mv-accent-bg); border: 1px solid var(--mv-ring); border-radius: 10px; gap: 8px; }
.mv-pick-name strong { font-size: 14px; }
.mv-pick-name span { color: var(--mv-soft); font-size: 12px; }
.move-ui .move-pick-row .input-qty { flex: 1; width: auto !important; height: 38px; padding: 0 10px !important; text-align: right; font-weight: 600; }
.move-ui .move-pick-row .btn { height: 38px; padding: 0 14px; border-radius: 8px; }

/* Colonne droite : informations du mouvement */
.mv-main { display: flex; flex-direction: column; gap: 14px; }
.move-ui .mv-fields { display: grid; grid-template-columns: minmax(170px, 1fr) minmax(150px, 170px) minmax(220px, 2fr); gap: 12px 16px; margin: 0; padding-bottom: 16px; border-bottom: 1px solid var(--mv-line); }
.move-ui.move-out .mv-fields { grid-template-columns: minmax(170px, 1fr) minmax(150px, 170px) minmax(200px, 2fr) minmax(170px, 1fr); }
.move-ui .mv-field { display: flex; flex-direction: column; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--mv-ink); min-width: 0; }
.move-ui .mv-field input, .move-ui .mv-field select { width: 100%; }
.move-ui .mv-static { height: 40px; display: flex; align-items: center; padding: 0 12px; border: 1px solid var(--mv-line); border-radius: 8px; background: var(--mv-bg); font-size: 13.5px; font-weight: 500; }
.mv-table-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.mv-count { display: inline-flex; align-items: center; justify-content: center; min-width: 26px; height: 26px; padding: 0 8px; border-radius: 13px; background: var(--mv-accent); color: #FFFFFF; font-size: 12.5px; font-weight: 700; }

/* Tableau des ingrédients */
.move-ui .mv-table-wrap { border: 1px solid var(--mv-line); border-radius: 10px; }
.move-ui .mv-table { width: 100%; border-collapse: collapse; }
.move-ui .mv-table thead th { background: var(--mv-head); color: #475569; font-size: 11px; font-weight: 700; letter-spacing: .05em; padding: 11px 14px; border-bottom: 1px solid var(--mv-line); }
.move-ui .mv-table td { padding: 10px 14px; border-bottom: 1px solid var(--mv-line-soft); font-size: 13.5px; color: var(--mv-ink); }
.move-ui .mv-table tbody tr:last-child td { border-bottom: 0; }
.move-ui .mv-table tbody tr:hover { background: #FBFDFC; }
.move-ui .mv-table td:first-child { font-weight: 600; }
.move-ui .mv-table td[data-after] { font-weight: 700; }
.move-ui .mv-table .unit { color: var(--mv-soft); font-size: 12px; margin-left: 4px; }
.move-ui .mv-table .input-qty { width: 92px !important; height: 34px; padding: 0 10px !important; border-color: #CBD5E1; text-align: right; font-weight: 600; }
.move-ui .mv-table .input-note { height: 34px; min-width: 150px; font-size: 13px; }
.move-ui .mv-table [data-remove] { color: var(--mv-faint); border-radius: 6px; padding: 4px 8px; }
.move-ui .mv-table [data-remove]:hover { color: #C8102E; background: #FEF2F2; }
.move-ui .mv-table tr.row-over { background: #FEF2F2 !important; }

/* État vide */
.mv-empty { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 40px 20px; text-align: center; color: var(--mv-soft); font-size: 13px; }
.mv-empty strong { color: var(--mv-ink); font-size: 15px; }
.mv-empty[hidden] { display: none; }

/* Zone d'action */
.move-ui > .mv-layout .alert { border-radius: 8px; margin: 0; }
.mv-actions { display: flex; justify-content: flex-end; padding-top: 14px; border-top: 1px solid var(--mv-line); }
.move-ui .mv-submit { height: 42px; padding: 0 24px; border-radius: 8px; font-size: 14px; font-weight: 600; background: var(--mv-accent); border-color: var(--mv-accent); color: #FFFFFF; transition: background .15s, box-shadow .15s; }
.move-ui .mv-submit:hover:not(:disabled) { background: var(--mv-accent-dark); border-color: var(--mv-accent-dark); }
.move-ui .mv-submit:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--mv-ring); }
.move-ui .mv-submit:disabled, .move-ui.move-in .btn-success.mv-submit:disabled { background: #CBD5E1; border-color: #CBD5E1; color: #FFFFFF; cursor: not-allowed; opacity: 1; }
.move-ui.move-in .btn-success { background: var(--mv-accent); border-color: var(--mv-accent); }
.move-ui.move-in .btn-success:hover { background: var(--mv-accent-dark); border-color: var(--mv-accent-dark); }

/* Adaptation aux écrans */
@media (max-width: 1100px) {
  .mv-layout { grid-template-columns: 260px minmax(0, 1fr); }
  .move-ui .mv-fields, .move-ui.move-out .mv-fields { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
}
@media (max-width: 900px) {
  .mv-layout { grid-template-columns: 1fr; }
  .move-ui .mv-side { position: static; max-height: none; }
  .move-ui .mv-list { max-height: 300px; min-height: 0; }
}
@media (max-width: 600px) {
  .move-ui { padding: 8px; border-radius: 10px; }
  .mv-panel, .move-ui .mv-side { padding: 12px; }
  .move-ui .mv-fields, .move-ui.move-out .mv-fields { grid-template-columns: 1fr; }
  /* 16 px : évite le zoom automatique de l'iPhone à la saisie */
  .move-ui input[type=text], .move-ui input[type=search], .move-ui input[type=date], .move-ui select { font-size: 16px; }
  .move-ui .mv-table td, .move-ui .mv-table thead th { padding: 8px 8px; }
  .move-ui .mv-table .input-qty { width: 74px !important; }
  .move-ui .mv-table .input-note { min-width: 110px; }
  .move-ui .mv-submit { width: 100%; }
}
/* Saisie Entrée / Sortie : version compacte (resserre le bloc ci-dessus ; supprimer ce bloc pour revenir à l'aéré) */
.move-ui { padding: 8px; border-radius: 10px; }
.move-ui > .alert { margin-bottom: 8px; }
.mv-layout { gap: 10px; }
.mv-panel, .move-ui .mv-side { padding: 10px; border-radius: 10px; }
.move-ui .mv-side { gap: 8px; top: 80px; max-height: calc(100vh - 95px); }
.mv-main { gap: 8px; }
.mv-title { font-size: 13.5px; gap: 8px; }
.move-ui input[type=text], .move-ui input[type=search], .move-ui input[type=date], .move-ui select { height: 32px; padding: 0 10px; font-size: 12.5px; border-radius: 7px; }
.move-ui .mv-static { height: 32px; padding: 0 10px; font-size: 12.5px; border-radius: 7px; }
.move-ui .mv-field { gap: 3px; font-size: 11.5px; }
.move-ui .mv-fields { gap: 8px 12px; padding-bottom: 10px; }
.move-ui .mv-list { min-height: 160px; }
.move-ui .mv-list li { padding: 6px 10px; font-size: 12.5px; border-radius: 6px; }
.move-ui .mv-list li small { font-size: 12px; }
.move-ui .mv-pick { padding: 8px; gap: 6px; }
.mv-pick-name strong { font-size: 13px; }
.move-ui .move-pick-row .input-qty, .move-ui .move-pick-row .btn { height: 32px; }
.mv-count { min-width: 22px; height: 22px; font-size: 11.5px; }
.move-ui .mv-table thead th { padding: 7px 10px; font-size: 10.5px; }
.move-ui .mv-table td { padding: 5px 10px; font-size: 12.5px; }
.move-ui .mv-table .input-qty, .move-ui .mv-table .input-note { height: 28px; }
.move-ui .mv-table .input-qty { width: 80px !important; }
.move-ui .mv-table [data-remove] { padding: 2px 6px; }
.mv-empty { padding: 20px 14px; gap: 4px; font-size: 12px; }
.mv-empty strong { font-size: 13.5px; }
.mv-actions { padding-top: 8px; }
.move-ui .mv-submit { height: 34px; padding: 0 18px; font-size: 13px; }
@media (max-width: 600px) {
  .move-ui input[type=text], .move-ui input[type=search], .move-ui input[type=date], .move-ui select { height: 36px; font-size: 16px; }
  .move-ui .mv-submit { height: 40px; }
}
/* ================================================================ Historique de mouvement (tableau ERP compact)
   Uniquement l'apparence de Mouvements › Historique de mouvement (.hx-*). */
.hx-card { --hx-ink: #1E293B; --hx-soft: #64748B; --hx-faint: #94A3B8; --hx-line: #E2E8F0; --hx-line-soft: #F1F5F9; --hx-bg: #F4F7FB;
  background: #FFFFFF; border: 1px solid var(--hx-line); border-radius: 10px; box-shadow: 0 1px 2px rgba(15, 23, 42, .04); overflow: hidden; color: var(--hx-ink); }
.hx-note { margin: 0; padding: 8px 14px; font-size: 12px; color: #92400E; background: #FFFBEB; border-bottom: 1px solid var(--hx-line); }
/* Défilement dans la carte (en-tête figé), jamais de débordement de la page */
.hx-wrap { overflow: auto; max-height: calc(100vh - 230px); -webkit-overflow-scrolling: touch; scrollbar-width: thin; scrollbar-color: #CBD5E1 transparent; }
.hx-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 12.5px; font-variant-numeric: tabular-nums; }
.hx-table thead th { position: sticky; top: 0; z-index: 1; background: var(--hx-bg); color: #475569; font-size: 10.5px; font-weight: 700;
  letter-spacing: .05em; text-transform: uppercase; text-align: left; padding: 8px 12px; border-bottom: 1px solid var(--hx-line); white-space: nowrap; }
.hx-table thead th.num { text-align: right; }
.hx-table td { height: 36px; padding: 0 12px; border-bottom: 1px solid var(--hx-line-soft); vertical-align: middle; white-space: nowrap; color: var(--hx-ink); }
.hx-table tbody tr:last-child td { border-bottom: 0; }
.hx-table tbody tr { transition: background .1s; }
.hx-table tbody tr:hover { background: #F8FAFC; }
.hx-table tr td:first-child { box-shadow: none; }
.hx-date { color: var(--hx-soft); }
.hx-name { font-weight: 500; }
/* Badges des types */
.hx-badge { display: inline-block; padding: 2px 8px; border-radius: 10px; font-size: 11px; font-weight: 600; line-height: 1.4; }
.hx-in { background: var(--green-bg); color: var(--green-text); }
.hx-transfer { background: var(--primary-bg); color: var(--navy); }
.hx-out { background: #FEF3E2; color: #9A5B13; }
.hx-fix { background: #FEF9C3; color: #854D0E; }
/* Site : transfert source → destination */
.hx-site { min-width: 180px; }
.hx-arrow { color: var(--hx-faint); margin: 0 2px; }
/* Quantités */
.hx-qty { text-align: right; font-weight: 600; }
.hx-pos { color: var(--green-text); }
.hx-neg { color: #C8102E; }
.hx-unit { font-weight: 400; color: var(--hx-soft); font-size: 11.5px; }
/* Remarque : la plus large, tronquée (texte complet au survol) */
.hx-note-cell { width: 34%; color: var(--hx-soft); }
.hx-note-text { display: block; max-width: min(340px, 24vw); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hx-dash { color: #CBD5E1; }
/* Document */
.hx-doc a { display: inline-block; padding: 1px 6px; border-radius: 6px; color: var(--primary-text); font-weight: 600; font-size: 12px; letter-spacing: .01em; }
.hx-doc a:hover { background: var(--primary-bg); text-decoration: none; }
.hx-empty { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 32px 16px; text-align: center; color: var(--hx-soft); font-size: 12.5px; }
.hx-empty strong { color: var(--hx-ink); font-size: 14px; }
@media (max-width: 900px) {
  .hx-wrap { max-height: none; }
  .hx-note-text { max-width: 220px; }
}
@media (max-width: 600px) {
  .hx-card { border-radius: 8px; }
  .hx-table td, .hx-table thead th { padding-left: 8px; padding-right: 8px; }
  .hx-site { min-width: 140px; }
}
/* ================================================================ Tablettes et écrans tactiles
   Écran tactile (pointer: coarse) : zones à toucher d'au moins 40 px, texte des champs à 16 px (pas de zoom automatique),
   remarques lisibles sans survol. Ne change rien à la souris sur ordinateur. */
@media (pointer: coarse) {
  .btn { min-height: 40px; }
  .btn-sm { min-height: 36px; }
  input[type=text], input[type=email], input[type=password], input[type=number], input[type=date], input[type=search], select, textarea { min-height: 40px; font-size: 16px; }
  input[type=checkbox], input[type=radio] { width: 20px; height: 20px; }
  td.check input, th.check input { width: 20px; height: 20px; }
  .tab { padding: 10px 14px; }
  .subnav a { padding: 9px 12px; }
  .nav-link, .menu-panel a, .menu-item-btn { padding: 10px 12px; }
  label.checkbox { min-height: 32px; display: flex; align-items: center; gap: 8px; }
  /* Saisie Entrée / Sortie / Demande */
  .move-ui input[type=text], .move-ui input[type=search], .move-ui input[type=date], .move-ui select, .move-ui .mv-static { height: 42px; font-size: 16px; }
  .move-ui .mv-list li { padding: 12px 12px; }
  .move-ui .move-pick-row .input-qty, .move-ui .move-pick-row .btn { height: 42px; }
  .move-ui .mv-table td { padding: 8px 10px; }
  .move-ui .mv-table .input-qty, .move-ui .mv-table .input-note { height: 40px; }
  .move-ui .mv-table [data-remove] { min-width: 40px; min-height: 40px; }
  .move-ui .mv-submit { height: 44px; padding: 0 24px; font-size: 15px; }
  /* Historique : lignes plus hautes, remarque sur deux lignes au lieu d'une infobulle */
  .hx-table td { height: 44px; }
  .hx-note-text { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  .hx-doc a { padding: 6px 8px; }
  /* Listes à défiler au doigt */
  .move-ui .mv-list, .hx-wrap, .table-wrap { -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
}
/* Pas d'effet de survol « collé » après un toucher */
@media (hover: none) {
  .move-ui .mv-list li:hover, .hx-table tbody tr:hover, .move-ui .mv-table tbody tr:hover { background: inherit; }
  .move-ui .mv-list li.selected:hover { background: var(--mv-accent-bg); }
}

/* Tablette en mode paysage (≈ 1024 px) : deux colonnes conservées, liste un peu plus étroite */
@media (min-width: 901px) and (max-width: 1100px) {
  .mv-layout { grid-template-columns: 250px minmax(0, 1fr); gap: 10px; }
  .move-ui .mv-side { top: 70px; max-height: calc(100vh - 85px); }
}
/* Tablette en mode portrait (≈ 768 px) : liste des ingrédients au-dessus, en deux colonnes, puis le mouvement */
@media (min-width: 601px) and (max-width: 900px) {
  .move-ui .mv-fields, .move-ui.move-out .mv-fields { grid-template-columns: 1fr 1fr; }
  .move-ui .mv-fields .move-description { grid-column: 1 / -1; }
  .move-ui .mv-list { max-height: 260px; display: grid; grid-template-columns: 1fr 1fr; column-gap: 10px; align-content: start; }
  .move-ui .mv-actions { position: sticky; bottom: 0; background: #FFFFFF; margin: 0 -10px -10px; padding: 10px; border-radius: 0 0 10px 10px; box-shadow: 0 -4px 10px rgba(15, 23, 42, .05); }
  .move-ui .mv-submit { width: 100%; }
}
/* ================================================================ Saisie sur tablette en portrait et téléphone (≤ 900 px) : simple, de haut en bas
   1. Site, date, descriptif  2. Recherche (la liste n'apparaît qu'en tapant)  3. Ingrédients ajoutés en fiches  4. Bouton fixe en bas */
@media (max-width: 900px) {
  .move-ui .mv-layout { display: flex; flex-direction: column; align-items: stretch; gap: 10px; }
  .move-ui .mv-main { display: contents; }
  .move-ui .mv-fields { order: 1; background: #FFFFFF; border: 1px solid var(--mv-line); border-radius: 10px; padding: 12px; margin: 0; }
  .move-ui .mv-side { order: 2; position: static; max-height: none; }
  .move-ui .mv-table-head { order: 3; padding: 4px 2px 0; }
  .move-ui .mv-table-wrap { order: 4; background: #FFFFFF; overflow: visible; }
  .move-ui .mv-layout > .mv-main > .alert { order: 5; }
  .move-ui .mv-actions { order: 6; position: sticky; bottom: 0; z-index: 5; margin: 0; padding: 10px 0; border-top: 0; background: var(--mv-bg); box-shadow: none; }
  .move-ui .mv-submit { width: 100%; height: 48px; font-size: 16px; }
  .move-ui .mv-side .mv-title { display: none; }
  /* Liste des ingrédients : seulement pendant la recherche (ou quand un ingrédient est choisi), en une colonne */
  .move-ui .mv-search:placeholder-shown ~ .mv-list { display: none; }
  .move-ui .mv-list { display: block; max-height: 260px; min-height: 0; grid-template-columns: none; }
  .move-ui .mv-list li.is-zero span { color: var(--mv-ink); }
  /* Ingrédients ajoutés : une fiche par ingrédient (nom en gros, puis stock / quantité / reste, puis remarque) */
  .move-ui .mv-table, .move-ui .mv-table tbody { display: block; width: 100%; }
  .move-ui .mv-table thead { display: none; }
  .move-ui .mv-table tbody tr { display: grid; grid-template-columns: 1fr auto 1fr; grid-template-areas: 'name name del' 'stock qty after' 'note note note';
    align-items: center; gap: 8px 12px; padding: 12px; border-bottom: 1px solid var(--mv-line); box-shadow: inset 4px 0 0 var(--mv-accent); }
  .move-ui .mv-table tbody tr:last-child { border-bottom: 0; }
  .move-ui .mv-table tbody tr.row-over { box-shadow: inset 4px 0 0 #C8102E; }
  .move-ui .mv-table td { padding: 0; border: 0; height: auto; white-space: normal; box-shadow: none !important; }
  .move-ui .mv-table td:nth-child(1) { grid-area: name; font-size: 16px; font-weight: 700; }
  .move-ui .mv-table td:nth-child(2) { grid-area: stock; text-align: left; font-size: 13px; }
  .move-ui .mv-table td:nth-child(2)::before { content: 'En stock'; display: block; font-size: 11px; color: var(--mv-soft); }
  .move-ui .mv-table td:nth-child(3) { grid-area: qty; text-align: center; white-space: nowrap; }
  .move-ui .mv-table td:nth-child(4) { grid-area: after; text-align: right; font-size: 13px; }
  .move-ui .mv-table td:nth-child(4)::before { content: 'Reste en stock'; display: block; font-size: 11px; font-weight: 400; color: var(--mv-soft); }
  .move-ui .mv-table td:nth-child(5) { grid-area: note; }
  .move-ui .mv-table td:nth-child(6) { grid-area: del; text-align: right; }
  .move-ui .mv-table .input-qty { width: 110px !important; height: 44px; font-size: 18px; }
  .move-ui .mv-table .input-note { width: 100%; min-width: 0; height: 40px; }
  .move-ui .mv-table [data-remove] { min-width: 40px; min-height: 40px; font-size: 16px; }
  .move-ui .mv-empty { padding: 18px 12px; }
}
/* ================================================================ Exporter en PDF (impression d'une page de liste)
   Bouton « Exporter en PDF » = fenêtre d'impression : la page sans menus, filtres ni boutons, en A4 paysage. */
@media print {
  body.app { page: gpao-liste; background: #FFFFFF; }
  @page gpao-liste { size: A4 landscape; margin: 10mm; }
  body.app .navbar, body.app .subnav, body.app form.filters, body.app .toolbar, body.app .tabs .tab:not(.active), body.app .stock-search,
  body.app .btn, body.app .alert, body.app .sheet-filters, body.app .sheet-count, body.app .use-filters { display: none !important; }
  body.app .tabs { border: 0; margin: 0 0 4px; }
  body.app .tabs .tab.active { padding: 0; border: 0; font-size: 14px; font-weight: 700; color: #1E293B; }
  body.app .content { padding: 0; max-width: none; gap: 6px; }
  body.app .card, body.app .hx-card { box-shadow: none; border: 0; padding: 0; background: none; }
  body.app .table-wrap, body.app .hx-wrap { overflow: visible; max-height: none; }
  body.app table { width: 100% !important; min-width: 0 !important; font-size: 10.5px; }
  body.app th, body.app td { padding: 3px 6px; }
  body.app thead { display: table-header-group; }
  body.app tr { break-inside: avoid; }
  body.app .hx-table thead th { position: static; }
  body.app .hx-note-text { max-width: none; white-space: normal; }
}

/* ================================================================ Tablette (≤ 900 px) : filtres compacts sur une ou deux lignes */
@media (max-width: 900px) {
  .filters { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); align-items: end; gap: 6px 8px; padding: 8px 10px; }
  .filters label { gap: 2px; font-size: 11px; min-width: 0; }
  .filters input, .filters select { width: 100%; height: 36px; min-height: 36px; padding: 0 8px; font-size: 14px; }
  .filters .btn { height: 36px; min-height: 36px; padding: 0 10px; font-size: 13px; }
  .filters .stock-hide { flex-direction: row; align-items: center; align-self: center; font-size: 12px; }

}
/* ================================================================ Filtres compacts sur tablette (étroite ou tactile) : une ligne si possible */
@media (max-width: 1100px), (pointer: coarse) {
  .filters { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 6px 8px; padding: 8px 10px; }
  .filters label { flex: 1 1 120px; min-width: 0; gap: 1px; font-size: 10.5px; }
  .filters input, .filters select { width: 100%; height: 34px; min-height: 34px; padding: 0 6px; font-size: 13.5px; }
  .filters .btn { flex: 0 0 auto; height: 34px; min-height: 34px; padding: 0 12px; font-size: 13px; }
  .filters .stock-hide { flex: 0 1 auto; flex-direction: row; align-items: center; align-self: center; font-size: 12px; }
}

/* Stock actuel : colonne Ingrédient figée (décalée par le script pendant le défilement, voir data-freeze-first) */
table[data-freeze-first] thead th:first-child, table[data-freeze-first] tbody td:first-child { position: relative; z-index: 1; background: var(--surface); }
table[data-freeze-first] thead th:first-child { z-index: 2; background: #FBFCFE; }
table[data-freeze-first] .group-label { display: inline-block; position: relative; z-index: 1; }
.is-scrolled table[data-freeze-first] thead th:first-child, .is-scrolled table[data-freeze-first] tbody td:first-child { box-shadow: 4px 0 6px -4px rgba(15, 23, 42, .25); }
/* ================================================================ Fin de service : un ingrédient à la fois, grands champs (tablette) */
.fs-card { max-width: 640px; margin: 0 auto; width: 100%; display: flex; flex-direction: column; gap: 14px; }
.fs-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.fs-site { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--ink-soft); }
.fs-site strong { color: var(--ink); }
.fs-site select { width: auto; }
.fs-progress { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--ink-soft); }
.fs-progress progress { -webkit-appearance: none; appearance: none; width: 160px; height: 8px; border: 0; border-radius: 4px; background: var(--grey-bg); overflow: hidden; }
.fs-progress progress::-webkit-progress-bar { background: var(--grey-bg); border-radius: 4px; }
.fs-progress progress::-webkit-progress-value { background: var(--green); border-radius: 4px; }
.fs-progress progress::-moz-progress-bar { background: var(--green); border-radius: 4px; }
.fs-step { display: flex; flex-direction: column; gap: 10px; padding: 18px; border: 1px solid var(--line); border-radius: 12px; background: #FFFFFF; }
.fs-step[hidden], .fs-summary[hidden] { display: none; }
.fs-pos { margin: 0; font-size: 12px; color: var(--ink-soft); }
.fs-name { margin: 0; font-size: 24px; font-weight: 700; color: var(--navy); }
.fs-theo { margin: 0; font-size: 14px; color: var(--ink-soft); }
.fs-field { display: flex; flex-direction: column; gap: 6px; font-weight: 600; font-size: 13px; }
.fs-input-row { display: flex; align-items: center; gap: 10px; }
.fs-input { width: 180px !important; height: 52px !important; font-size: 24px !important; font-weight: 700; text-align: right; padding: 0 12px !important; border-radius: 10px !important; }
.fs-unit { font-size: 18px; color: var(--ink-soft); }
.fs-actions { display: flex; gap: 10px; justify-content: space-between; margin-top: 4px; }
.fs-actions .btn { height: 46px; padding: 0 22px; font-size: 15px; border-radius: 10px; }
.fs-next { flex: 1; }
.fs-summary { display: flex; flex-direction: column; gap: 10px; }
.fs-summary h2 { margin: 0; }
.fs-row { cursor: pointer; }
.fs-row:hover { background: var(--primary-bg); }
@media (max-width: 600px) { .fs-name { font-size: 20px; } .fs-input { width: 140px !important; } .fs-progress progress { width: 110px; } }
.fs-skip { margin: 0; padding: 8px 12px; border-radius: 8px; background: var(--grey-bg); font-size: 13px; color: var(--ink-soft); }
.fs-skip a { font-weight: 600; margin-left: 4px; }

/* Ingrédients › Par site : grille de cases, une colonne par site */
.site-matrix .check-col { text-align: center; width: 1%; white-space: nowrap; }
.site-matrix thead .check-col label { display: flex; flex-direction: column; align-items: center; gap: 4px; cursor: pointer; font-size: 10.5px; text-transform: none; letter-spacing: 0; }
.site-matrix thead .check-col span { max-width: 110px; white-space: normal; text-align: center; line-height: 1.2; }
.site-matrix input[type=checkbox] { width: 18px; height: 18px; accent-color: var(--primary-dark); cursor: pointer; }
.site-matrix tbody tr:hover td { background: var(--primary-bg); }
/* Nouvelle demande : stock du site à qui on demande */
.supplier-stock { margin: 2px 0 0; font-size: 12px; font-weight: 400; color: var(--ink-soft); }
.supplier-stock:empty { display: none; }
.supplier-stock.is-short { color: #B45309; font-weight: 600; }

/* Demandes : couleur de fond selon le statut, avec une barre à gauche */
.rq-row td:first-child { box-shadow: inset 4px 0 0 transparent; }
.rq-en_attente td { background: #FFF7E6; }
.rq-en_attente td:first-child { box-shadow: inset 4px 0 0 #F59E0B; }
.rq-envoyee td { background: var(--primary-bg); }
.rq-envoyee td:first-child { box-shadow: inset 4px 0 0 var(--primary); }
.rq-recue td { background: var(--green-bg); }
.rq-recue td:first-child { box-shadow: inset 4px 0 0 var(--green); }
.rq-annulee td { background: #F1F5F9; color: var(--ink-soft); }
.rq-annulee td:first-child { box-shadow: inset 4px 0 0 #94A3B8; }
.rq-refusee td { background: #FDF1F2; }
.rq-refusee td:first-child { box-shadow: inset 4px 0 0 #C8102E; }
.rq-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 0 0 8px; font-size: 12px; color: var(--ink-soft); }
.rq-legend span::before { content: ''; display: inline-block; width: 10px; height: 10px; margin-right: 5px; border-radius: 3px; vertical-align: -1px; }
.rq-legend .l-wait::before { background: #F59E0B; }
.rq-legend .l-sent::before { background: var(--primary); }
.rq-legend .l-done::before { background: var(--green); }
.rq-legend .l-off::before { background: #94A3B8; }
.rq-legend .l-ref::before { background: #C8102E; }

/* ================================================================ Documents PDF : lisibles, en-têtes bien marquées */
.doc { gap: 14px; color: #1E293B; }
.doc-head { align-items: center; padding: 0 0 10px; border-bottom: 2px solid var(--navy); }
.doc-head h1 { font-size: 26px; font-weight: 700; color: var(--navy); margin: 0; }
.doc-head .doc-number { font-size: 15px; padding: 6px 12px; border: 1px solid var(--navy); border-radius: 6px; color: var(--navy); }
.doc-info { border: 1px solid #CBD5E1; border-radius: 6px; border-collapse: separate; border-spacing: 0; background: #F8FAFC; }
.doc-info th, .doc-info td { padding: 6px 10px; font-size: 12.5px; border-bottom: 1px solid #E2E8F0; }
.doc-info tr:last-child th, .doc-info tr:last-child td { border-bottom: 0; }
.doc-info th { color: #475569; font-weight: 600; }
.doc-info td { color: #1E293B; font-weight: 600; }
.doc-table { font-size: 12.5px; }
.doc-table thead th { background: var(--navy); color: #FFFFFF; font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 8px 10px; border: 1px solid var(--navy); }
.doc-table td { padding: 7px 10px; border: 1px solid #CBD5E1; vertical-align: middle; }
.doc-table tbody tr:nth-child(even) td { background: #F4F7FB; }
.doc-table td strong { font-weight: 700; }
.signatures > div { display: flex; flex-direction: column; gap: 4px; font-size: 12px; font-weight: 600; color: #475569; }
@media print {
  .doc-head, .doc-info, .doc-info th, .doc-info td, .doc-table thead th, .doc-table tbody tr:nth-child(even) td { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .doc-table thead { display: table-header-group; }
}
/* Paramètres › Numérotation */
.numbering-table td { vertical-align: middle; }
.numbering-pattern { min-width: 13rem; font-family: ui-monospace, Consolas, monospace; }
.numbering-example { font-weight: 700; color: var(--navy); background: var(--primary-bg, #E6F4FE); padding: .15rem .45rem; border-radius: 4px; }
.numbering-tokens { font-size: .85rem; color: #555; line-height: 1.9; margin: .75rem 0; }
.numbering-tokens code { background: #EEF2F7; padding: .05rem .3rem; border-radius: 3px; }
.numbering-defaults { margin-top: .5rem; text-align: right; }