/* Cuisine — styles communs aux écrans Aujourd'hui, Inventaire, Réception et Pertes.
   Jetons seulement. Cibles de 64 px pour les gestes (gants, mains mouillées). */

.panneau { overflow: hidden; }
.panneau > header { min-height: 56px; padding: var(--espace-2) var(--espace-3) 0 var(--espace-4); }
.defile { overflow-y: auto; min-height: 0; flex: 1; }
.note { margin: 0; color: var(--c-texte-3); font-size: var(--taille-meta); }
.code { color: var(--c-texte-3); font-size: var(--taille-meta); font-weight: 500; }
.valeur { font-weight: 700; white-space: nowrap; }
/* Valeur inconnue (produit sans prix connu) : « — » calme, l'aide en infobulle et pour le lecteur d'écran */
.valeur-inconnue { color: var(--c-texte-3); cursor: help; }
.reserve { grid-column: 1 / -1; align-self: center; }
.reserve .btn { text-decoration: none; }
.btn.btn-cuisine { min-height: var(--cible-ligne); }
a.btn { text-decoration: none; }
.pied { padding: var(--espace-3) var(--espace-4) var(--espace-4); }
.pied .btn { width: 100%; }

/* Cadre réservé à la photo du produit et de son contenant */
.photo {
  flex: none; width: 132px; height: 132px; border-radius: var(--rayon-bouton);
  border: 2px dashed var(--c-contour); background: var(--c-surface-2); color: var(--c-texte-3);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--espace-1);
  font-size: var(--taille-meta); text-align: center; padding: var(--espace-2);
}
.photo svg { width: 44px; height: 44px; }

/* Rotation : quel lot utiliser en premier (le mot et le signe, pas seulement la couleur) */
.premier-lot { margin: 0; display: flex; gap: var(--espace-3); align-items: flex-start; padding: var(--espace-3) var(--espace-4); border-radius: var(--rayon-bouton); border: 2px solid; }
.premier-lot > span:first-child { font-weight: 800; font-size: var(--taille-corps-fort); line-height: 1.3; }
.premier-lot[data-ton="vert"] { border-color: var(--c-vert); background: var(--c-vert-fond); }
.premier-lot[data-ton="vert"] > span:first-child { color: var(--c-vert); }
.premier-lot[data-ton="ambre"] { border-color: var(--c-ambre); background: var(--c-ambre-fond); }
.premier-lot[data-ton="ambre"] > span:first-child { color: var(--c-ambre); }

/* Rappel discret, au bas d'un panneau */
.rappel { margin: 0; padding: var(--espace-3) var(--espace-4); border-top: 1px solid var(--c-filet); color: var(--c-texte-3); font-size: var(--taille-meta); }
.rappel b { color: var(--c-texte-2); font-weight: 600; }

/* ---------- Feuille : panneau modal en gros boutons ---------- */
.feuille {
  width: min(820px, calc(100vw - 32px)); max-height: calc(100vh - 48px); padding: var(--espace-5);
  border: 1px solid var(--c-contour); border-radius: var(--rayon-panneau);
  background: var(--c-surface); color: var(--c-texte); font-family: var(--police);
}
.feuille::backdrop { background: color-mix(in srgb, var(--c-fond) 82%, transparent); }
.feuille-tete { display: flex; align-items: center; gap: var(--espace-4); margin-bottom: var(--espace-4); }
.feuille-tete h2 { margin: 0 auto 0 0; font-size: var(--taille-titre-2); }
.feuille-actions { display: flex; gap: var(--espace-3); margin-top: var(--espace-4); }
.feuille-actions .btn { flex: 1; min-height: var(--cible-ligne); font-size: var(--taille-corps-fort); }
.feuille p { margin: 0; }
.feuille .note { margin-top: var(--espace-3); }

/* Lecture d'une étiquette */
.scan-corps { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: var(--espace-4); }
.viseur {
  aspect-ratio: 1; border-radius: var(--rayon-bouton); background: var(--c-fond); color: var(--c-accent);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--espace-3);
}
.viseur svg { width: 150px; height: 150px; }
.viseur span { color: var(--c-texte-3); font-size: var(--taille-meta); }
.lu { display: flex; flex-direction: column; gap: var(--espace-3); align-items: flex-start; }
.lu h3 { margin: 0; font-size: var(--taille-titre-1); line-height: 1.15; }
.faits { margin: 0; display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: var(--espace-1) var(--espace-4); }
.faits dt { color: var(--c-texte-3); font-size: var(--taille-meta); padding-top: 2px; }
.faits dd { margin: 0; font-weight: 600; }

@media (max-width: 760px) {
  .feuille { padding: var(--espace-4); }
  .scan-corps { grid-template-columns: 1fr; }
  .viseur { aspect-ratio: auto; height: 160px; }
  .viseur svg { width: 90px; height: 90px; }
  .feuille-actions { flex-direction: column; }
  .photo { width: 96px; height: 96px; }
}

/* ---------- Mode branché (direct-stock.js et les direct-<écran>.js) ---------- */
/* Lecteur de code QR : l'image de la caméra dans le viseur, la saisie du code à côté */
.lecteur-video { position: relative; overflow: hidden; }
.lecteur-video video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.lecteur-video video[hidden] { display: none; }
.lecteur-video span { position: relative; padding: var(--espace-1) var(--espace-3); border-radius: var(--rayon-bouton); background: color-mix(in srgb, var(--c-fond) 70%, transparent); }
.saisie-qr { align-items: stretch; }
.saisie-qr input, .autre-qte input, .lot-f input, .lot-f select {
  min-height: var(--cible-service); padding: 0 var(--espace-4); border-radius: var(--rayon-bouton);
  border: 2px solid var(--c-contour); background: var(--c-surface-2); color: var(--c-texte); font: inherit; font-size: var(--taille-corps-fort);
}
.saisie-qr input { font-size: var(--taille-titre-3); letter-spacing: .06em; text-transform: uppercase; }
.saisie-qr .avertissement { color: var(--c-rouge); font-weight: 600; }
/* Quantité libre sous les gros boutons */
.autre-qte { display: flex; align-items: center; gap: var(--espace-3); margin-top: var(--espace-2); color: var(--c-texte-2); font-size: var(--taille-meta); font-weight: 600; }
.autre-qte input { width: 9em; text-align: right; }
/* Raisons de perte : deux groupes, la perte nette (évitable) et la perte de consommation (inévitable) */
.groupe-raisons + .groupe-raisons { margin-top: var(--espace-3); }
.type-perte { display: block; margin-bottom: var(--espace-2); color: var(--c-texte-3); font-size: var(--taille-meta); }
.type-perte b { color: var(--c-texte); }
/* Réception : lot du fournisseur, emplacement et lignes du jour */
.lot-f { display: flex; flex-direction: column; gap: var(--espace-2); font-size: var(--taille-meta); font-weight: 600; color: var(--c-texte-2); }
.boutons-ligne { display: flex; flex-wrap: wrap; gap: var(--espace-2); }
.pied-haut { padding: 0 var(--espace-4) var(--espace-2); }
.attendu[data-ton="ambre"] { color: var(--c-ambre); font-weight: 700; }
body[data-direct][data-onglet="reception"] .corps { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr) 340px; }
@media (max-width: 760px) {
  body[data-direct][data-onglet="reception"] .corps { grid-template-columns: 1fr; }
}
