/* fiches.css — formulaires produits et tableaux.
   Chargée après toutes les autres feuilles. Les règles visent des classes
   propres (ob-*) ou les tableaux des onglets : rien d'autre ne change. */

/* Titres des fenêtres : la couleur du thème clair (--op-gray) les rendait
   presque invisibles. Le fond des fenêtres est sombre dans TOUS les thèmes
   (imposé en !important) : couleur claire fixe, pas une variable de thème. */
.modal-header h2 { color: #f5f7f7; }

/* ── Formulaire matériel ─────────────────────────────────────────────── */
.ob-grille { display: grid; gap: 0.9rem 1.25rem; margin-bottom: 0.25rem; }
.ob-grille-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ob-grille-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ob-grille-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 900px) {
  .ob-grille-3, .ob-grille-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .ob-grille-2, .ob-grille-3, .ob-grille-4 { grid-template-columns: 1fr; }
}

/* Prix et TTC/HT sur une seule ligne (le sélecteur passait dessous, rogné). */
.ob-prix { display: flex; gap: 0.5rem; align-items: stretch; }
.ob-prix input { flex: 1 1 auto; min-width: 0; }
.ob-prix select { flex: 0 0 5.5rem; width: 5.5rem; }

/* Désignation et son bouton */
.ob-designation { margin-top: 0.9rem; }
.ob-ligne { display: flex; gap: 0.5rem; align-items: stretch; flex-wrap: wrap; }
.ob-ligne input { flex: 1 1 18rem; min-width: 0; }
.ob-ligne .btn { flex: 0 0 auto; white-space: nowrap; }

.ob-aide { font-size: 0.8rem; color: var(--text-secondary, #a7a9a9); margin-top: 0.35rem; overflow-wrap: break-word; }
.ob-aide:empty { display: none; }
.ob-encart {
  margin: 0.6rem 0 0.2rem; padding: 0.6rem 0.8rem; border-radius: 8px; font-size: 0.85rem;
  border: 1px solid rgba(50, 184, 198, 0.35); background: rgba(50, 184, 198, 0.08);
  display: flex; gap: 0.75rem; align-items: center; justify-content: space-between; flex-wrap: wrap;
}
.ob-encart[hidden] { display: none; }
.ob-encart-alerte { display: block; border-color: rgba(230, 129, 97, 0.5); background: rgba(230, 129, 97, 0.09); }
.ob-encart ul { margin: 0.35rem 0 0 1.1rem; padding: 0; }
.ob-discret { color: var(--text-secondary, #a7a9a9); }
.ob-mini { padding: 0.35rem 0.8rem !important; min-height: 0 !important; font-size: 0.8rem !important; }
.ob-case { justify-content: flex-end; }

/* ── Tableaux des onglets : retour à la ligne au lieu de rogner ─────────
   Le texte restait sur une seule ligne : une référence longue élargissait le
   tableau au-delà de l'écran, et les colonnes Détails et Actions passaient
   hors de vue. Les cellules passent désormais à la ligne ; prix, boutons et
   badges restent d'un seul tenant. */
/* Seuls les onglets produits et tâches : Stats et Codes-barres gardent leurs
   propres règles. */
:is(#taches, #materiel, #cartouches, #placard, #pc_sortie, #pc_stock, #commandes) table td {
  white-space: normal; overflow-wrap: break-word;
}
:is(#taches, #materiel, #cartouches, #placard, #pc_sortie, #pc_stock, #commandes) table td.actions { white-space: nowrap; }
@media (max-width: 1400px) {
  :is(#taches, #materiel, #cartouches, #placard, #pc_sortie, #pc_stock, #commandes) table th { white-space: normal; }
  :is(#taches, #materiel, #cartouches, #placard, #pc_sortie, #pc_stock, #commandes) table :is(th, td) {
    padding-left: 0.5rem; padding-right: 0.5rem;
  }
}
/* Écran moyen : les boutons d'action se rangent sur deux lignes plutôt que
   de pousser le tableau hors de l'écran. */
@media (max-width: 1200px) {
  :is(#taches, #materiel, #cartouches, #placard, #pc_sortie, #pc_stock, #commandes) table td.actions {
    white-space: normal; min-width: 6.5rem;
  }
}
