/* Onglets Matériel CIBIO et Matériel PAQA. Feuille à part : main.css ne se réécrit pas. */

:root {
  /* Les encres qui ont un équivalent dans la palette la DÉSIGNENT : --mat-critique
     recopiait l'ancien --color-danger (#d93a3a) et --mat-ok l'ancien --color-success
     (#15855c). Les deux aplats correspondants montent d'un cheveu, teinte gelée, pour
     que la palette neuve y franchisse 4,5:1 — le rose rejoint au passage celui de
     main.css, il n'y en a plus qu'un. */
  --mat-critique: var(--color-danger);  --mat-critique-fd: #fef5f5;  --mat-critique-bd: #f6c9c9;
  /* Pas d'équivalent dans la palette : assombries à teinte et saturation gelées.
     --mat-vigilance 4,58 sur son aplat (était #c2620a, 3,84) ; --mat-info 4,57
     (était #0b7fa3, 4,17). Son aplat ne pouvait pas s'éclaircir : il aurait fallu
     monter à #fcfefe, et le bleu pâle serait devenu blanc. */
  --mat-vigilance: #af5809;  --mat-vigilance-fd: #fff4e8; --mat-vigilance-bd: #fbd6ae;
  --mat-info: #0a789b;       --mat-info-fd: #eaf6fb;      --mat-info-bd: #b9e1ef;
  --mat-ok: var(--color-success);       --mat-ok-fd: #eef9f4;        --mat-ok-bd: #b8e3cf;
  --mat-violet: #6c4bd0;     --mat-violet-fd: #f2eefc;    --mat-violet-bd: #d4c8f4;
  --mat-neutre: #4d5b6a;     --mat-neutre-fd: #f1f4f7;    --mat-neutre-bd: #dfe4ea;
}

/* ── Navigation des sous-onglets ─────────────────────────────────────────── */

.mat-onglets {
  position: sticky; top: 0; z-index: 5;
  display: flex; gap: 4px; flex-wrap: wrap;
  padding: 5px; margin-bottom: 18px;
  background: var(--color-surface); border: 1px solid var(--color-border);
  border-radius: 12px; box-shadow: 0 1px 2px rgba(16, 32, 51, .05);
}
.mat-onglets button {
  background: none; border: none; border-radius: 8px;
  padding: 8px 16px; font-size: 13px; font-weight: 600; color: var(--color-text-2);
  cursor: pointer; transition: background .15s, color .15s;
}
.mat-onglets button:hover { background: var(--color-bg); color: var(--color-text); }
.mat-onglets button.active { background: var(--color-primary); color: #fff; box-shadow: 0 1px 3px rgba(15, 156, 145, .35); }

.mat-zone { display: flex; flex-direction: column; gap: 16px; }
.mat-zone > * { margin: 0; }

/* ── Indicateurs ─────────────────────────────────────────────────────────── */

.mat-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; }
.mat-kpis--petits { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
.mat-kpi {
  --k: var(--mat-neutre); --k-fd: var(--mat-neutre-fd);
  position: relative; overflow: hidden;
  display: flex; flex-direction: column; gap: 2px; text-align: left;
  padding: 14px 16px 13px 18px;
  background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 12px;
  font: inherit; color: inherit;
  box-shadow: 0 1px 2px rgba(16, 32, 51, .05);
}
.mat-kpi::before { content: ''; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--k); }
.mat-kpi-valeur { font-size: 28px; line-height: 1.1; font-weight: 700; color: var(--k); font-variant-numeric: tabular-nums; }
.mat-kpi-libelle { font-size: 13px; font-weight: 600; color: var(--color-text); }
.mat-kpi-sous { font-size: 11.5px; color: var(--color-text-3); }
.mat-kpi--cliquable { cursor: pointer; transition: transform .12s, box-shadow .12s, border-color .12s; }
.mat-kpi--cliquable:hover { transform: translateY(-1px); border-color: var(--k); box-shadow: 0 6px 18px rgba(16, 32, 51, .09); }
.mat-kpi--cliquable:focus-visible { outline: 2px solid var(--k); outline-offset: 2px; }
.mat-kpi--ok        { --k: var(--mat-ok); }
.mat-kpi--info      { --k: var(--mat-info); }
.mat-kpi--vigilance { --k: var(--mat-vigilance); }
.mat-kpi--critique  { --k: var(--mat-critique); }
.mat-kpi--violet    { --k: var(--mat-violet); }
.mat-kpi--neutre    { --k: var(--color-text); }
.mat-kpi--neutre::before { background: var(--color-primary); }

/* ── Cartes ──────────────────────────────────────────────────────────────── */

.mat-carte {
  --c: var(--color-border);
  background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 12px;
  box-shadow: 0 1px 2px rgba(16, 32, 51, .05);
  overflow: hidden; min-width: 0;
}
.mat-carte-tete {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap;
  padding: 14px 18px 12px; border-bottom: 1px solid var(--color-border);
  border-top: 3px solid var(--c);
}
.mat-carte-titre { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 15px; font-weight: 700; color: var(--color-text); }
.mat-carte-compte {
  min-width: 24px; padding: 1px 8px; border-radius: 20px; text-align: center;
  font-size: 12px; font-weight: 700; background: var(--color-bg); color: var(--color-text-2);
}
.mat-carte-sous { margin: 3px 0 0; font-size: 12.5px; color: var(--color-text-3); max-width: 70ch; }
.mat-carte-corps { padding: 14px 18px 16px; }
.mat-carte-corps > * + * { margin-top: 12px; }
.mat-carte-corps > .table-wrapper:only-child { margin: -14px -18px -16px; }
.mat-carte--table > .table-wrapper { margin: 0; }
.mat-carte--critique  { --c: var(--mat-critique); }
.mat-carte--critique .mat-carte-compte  { background: var(--mat-critique-fd); color: var(--mat-critique); }
.mat-carte--vigilance { --c: var(--mat-vigilance); }
.mat-carte--vigilance .mat-carte-compte { background: var(--mat-vigilance-fd); color: var(--mat-vigilance); }
.mat-carte--info      { --c: var(--mat-info); }
.mat-carte--info .mat-carte-compte      { background: var(--mat-info-fd); color: var(--mat-info); }
.mat-carte--ok        { --c: var(--mat-ok); }
.mat-carte--ok .mat-carte-compte        { background: var(--mat-ok-fd); color: var(--mat-ok); }
.mat-carte--violet    { --c: var(--mat-violet); }
.mat-carte--violet .mat-carte-compte    { background: var(--mat-violet-fd); color: var(--mat-violet); }

.mat-duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.mat-duo--etroit { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); }

/* Rétrocompatibilité : une ancienne section devient une carte. */
.mat-section { margin: 0; }

/* ── Listes cliquables du tableau de bord ────────────────────────────────── */

.mat-liste { display: flex; flex-direction: column; margin: -14px -18px -16px; max-height: 460px; overflow-y: auto; }
.mat-ligne {
  --l: transparent;
  display: grid; grid-template-columns: 1fr auto 14px; align-items: center; gap: 14px;
  width: 100%; padding: 11px 18px 11px 15px; text-align: left;
  background: var(--color-surface); border: none; border-left: 3px solid var(--l);
  border-bottom: 1px solid #edf0f3; font: inherit; color: inherit; cursor: pointer;
  transition: background .12s;
}
.mat-ligne:last-child { border-bottom: none; }
.mat-ligne:hover { background: var(--color-primary-fd); }
.mat-ligne:hover .mat-ligne-fleche { color: var(--color-primary); transform: translateX(2px); }
.mat-ligne:focus-visible { outline: 2px solid var(--color-primary); outline-offset: -2px; }
.mat-ligne--critique   { --l: var(--mat-critique); }
.mat-ligne--vigilance  { --l: var(--mat-vigilance); }
.mat-ligne--info       { --l: var(--mat-info); }
.mat-ligne--etalonnage { --l: var(--mat-info); }
.mat-ligne--reparation { --l: var(--mat-violet); }
.mat-ligne-corps { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.mat-ligne-titre { font-size: 13.5px; color: var(--color-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mat-ligne-titre strong { font-weight: 700; margin-right: 2px; }
.mat-ligne-sous { font-size: 12px; color: var(--color-text-2); }
.mat-ligne-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: 12px; color: var(--color-text-3); }
.mat-ligne-meta > span:not(.mat-badge) + span:not(.mat-badge)::before { content: '·'; margin-right: 10px; color: #c3ccd5; }
.mat-ligne-droite { display: flex; align-items: center; gap: 12px; }
.mat-ligne-date { display: flex; flex-direction: column; align-items: flex-end; font-size: 12.5px; font-variant-numeric: tabular-nums; color: var(--color-text); }
.mat-ligne-date small { font-size: 10.5px; text-transform: uppercase; letter-spacing: .04em; color: var(--color-text-3); }
.mat-ligne-fleche { font-size: 20px; line-height: 1; color: #b5c0cb; transition: transform .12s, color .12s; }

.mat-vide {
  padding: 28px 12px; text-align: center; font-size: 13px; color: var(--color-text-3);
  background: repeating-linear-gradient(-45deg, transparent 0 10px, rgba(16, 32, 51, .015) 10px 20px);
  border-radius: 8px;
}

/* ── Pastilles ───────────────────────────────────────────────────────────── */

.mat-jours {
  display: inline-block; min-width: 74px; padding: 3px 9px; border-radius: 20px; text-align: center;
  font-size: 12px; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums;
  background: var(--mat-neutre-fd); color: var(--mat-neutre);
}
.mat-jours--critique  { background: var(--mat-critique);  color: #fff; }
.mat-jours--vigilance { background: var(--mat-vigilance-fd); color: var(--mat-vigilance); box-shadow: inset 0 0 0 1px var(--mat-vigilance-bd); }
.mat-jours--info      { background: var(--mat-info-fd); color: var(--mat-info); box-shadow: inset 0 0 0 1px var(--mat-info-bd); }
.mat-jours--ok        { background: var(--mat-ok-fd); color: var(--mat-ok); }

.mat-pastilles { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.mat-pastille { padding: 3px 10px; border-radius: 20px; font-size: 12px; font-weight: 600; background: var(--mat-neutre-fd); color: var(--mat-neutre); }
.mat-pastille--critique  { background: var(--mat-critique-fd); color: var(--mat-critique); }
.mat-pastille--vigilance { background: var(--mat-vigilance-fd); color: var(--mat-vigilance); }
.mat-pastille--info      { background: var(--mat-info-fd); color: var(--mat-info); }
.mat-pastille--ok        { background: var(--mat-ok-fd); color: var(--mat-ok); }

.mat-badge {
  display: inline-block; padding: 2px 9px; border-radius: 20px;
  font-size: 11.5px; font-weight: 600; white-space: nowrap;
  background: var(--mat-neutre-fd, #f1f4f7); color: var(--mat-neutre, #4d5b6a);
}
.mat-statut--en-service, .mat-situation--conforme, .mat-suivi--disponible, .mat-niveau--stable,
.mat-relance--envoyee { background: var(--mat-ok-fd); color: var(--mat-ok); }
.mat-statut--expedie, .mat-statut--a-l-etalonnage, .mat-statut--retour-prevu,
.mat-situation--a-prevoir, .mat-suivi--attendu, .mat-niveau--information, .mat-relance--simulation { background: var(--mat-info-fd); color: var(--mat-info); }
.mat-statut--en-reparation { background: #f2eefc; color: #6c4bd0; }
.mat-situation--urgent, .mat-niveau--vigilance, .mat-suivi--certificat-attendu { background: var(--mat-vigilance-fd); color: var(--mat-vigilance); }
.mat-situation--en-retard, .mat-situation--date-manquante, .mat-suivi--manquant,
.mat-niveau--critique, .mat-statut--hors-service, .mat-relance--erreur { background: var(--mat-critique-fd); color: var(--mat-critique); }
.mat-statut--reforme, .mat-situation--non-concerne, .mat-suivi--remplace, .mat-relance--ignoree { background: var(--mat-neutre-fd); color: var(--color-text-3-aplat, #5c6d7e); }
.mat-entite--cibio   { background: var(--color-primary-fd); color: var(--color-primary-h); }
.mat-entite--paqa    { background: #eef2ff; color: #4338ca; }
.mat-entite--arcades { background: #fdf2f8; color: #be185d; }

/* ── Barre d'outils et filtres ───────────────────────────────────────────── */

.mat-barre-outils {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  padding: 10px 12px; background: var(--color-surface);
  border: 1px solid var(--color-border); border-radius: 12px;
  box-shadow: 0 1px 2px rgba(16, 32, 51, .05);
}
.mat-barre-outils--nue { padding: 0; border: none; box-shadow: none; background: none; }
.mat-carte-corps .mat-barre-outils { padding: 0; border: none; box-shadow: none; }
.mat-barre-outils .input-search { flex: 1 1 260px; min-width: 200px; }
.mat-barre-outils .select { max-width: 200px; }
.mat-espace { flex: 1 1 auto; }
.mat-compte-parc { font-size: 12.5px; font-weight: 600; color: var(--color-text-2); white-space: nowrap; }
.mat-filtre { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--color-text-2); }

.mat-puces { display: flex; flex-wrap: wrap; gap: 6px; }
.mat-puce {
  --p: var(--color-text-2);
  display: inline-flex; align-items: center; gap: 7px;
  padding: 5px 6px 5px 12px; border-radius: 20px; cursor: pointer;
  background: var(--color-surface); border: 1px solid var(--color-border);
  font: inherit; font-size: 12.5px; font-weight: 600; color: var(--color-text-2);
  transition: border-color .12s, background .12s;
}
.mat-puce:hover { border-color: var(--p); }
.mat-puce-n { min-width: 22px; padding: 1px 7px; border-radius: 20px; text-align: center; background: var(--color-bg); font-size: 11.5px; }
.mat-puce.active { background: var(--p); border-color: var(--p); color: #fff; }
.mat-puce.active .mat-puce-n { background: rgba(255, 255, 255, .25); color: #fff; }
.mat-puce--tout           { --p: var(--color-primary); }
.mat-puce--en-retard, .mat-puce--date-manquante { --p: var(--mat-critique); }
.mat-puce--urgent         { --p: var(--mat-vigilance); }
.mat-puce--a-prevoir      { --p: var(--mat-info); }
.mat-puce--conforme       { --p: var(--mat-ok); }
.mat-puce--non-concerne   { --p: var(--color-text-3-aplat, #5c6d7e); }  /* blanc dessus : 5,32 ; était 3,11 */

/* ── Tableaux ────────────────────────────────────────────────────────────── */

:is([id^="tab-materiel"], .mat-panel-fiche) .table-wrapper { max-height: 62vh; overflow: auto; }
:is([id^="tab-materiel"], .mat-panel-fiche) .table { width: 100%; border-collapse: separate; border-spacing: 0; }
:is([id^="tab-materiel"], .mat-panel-fiche) .table thead th {
  position: sticky; top: 0; z-index: 1;
  background: #f7f9fb; color: var(--color-text-3);
  font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
  border-bottom: 1px solid var(--color-border); white-space: nowrap;
}
:is([id^="tab-materiel"], .mat-panel-fiche) .table-compact th, :is([id^="tab-materiel"], .mat-panel-fiche) .table-compact td { padding: 9px 12px; font-size: 12.5px; }
:is([id^="tab-materiel"], .mat-panel-fiche) .table tbody td { border-bottom: 1px solid #edf0f3; vertical-align: middle; }
:is([id^="tab-materiel"], .mat-panel-fiche) .table tbody tr:last-child td { border-bottom: none; }
:is([id^="tab-materiel"], .mat-panel-fiche) .table tbody tr:nth-child(even) td { background: #fbfcfd; }
.mat-cliquable { cursor: pointer; }
:is([id^="tab-materiel"], .mat-panel-fiche) .table tbody tr.mat-cliquable:hover td { background: var(--color-primary-fd); }
:is([id^="tab-materiel"], .mat-panel-fiche) .table .table-empty { padding: 28px 12px; text-align: center; color: var(--color-text-3); }
.mat-nombre { font-variant-numeric: tabular-nums; font-weight: 600; }

/* ── Alertes, erreurs, actions ───────────────────────────────────────────── */

.mat-alerte { border-radius: 10px; padding: 11px 14px; margin: 0; font-size: 13px; border: 1px solid; }
.mat-alerte ul { margin: 6px 0 0 18px; }
.mat-alerte--critique  { background: var(--mat-critique-fd); border-color: var(--mat-critique-bd); color: #9b1c1c; }
.mat-alerte--vigilance { background: var(--mat-vigilance-fd); border-color: var(--mat-vigilance-bd); color: #8a3f04; }
.mat-alerte--info      { background: var(--mat-info-fd); border-color: var(--mat-info-bd); color: #075570; }

.mat-erreur { background: var(--mat-critique-fd); border: 1px solid var(--mat-critique-bd); color: #9b1c1c; padding: 10px 14px; border-radius: 10px; font-size: 13px; }
.mat-erreur.hidden { display: none; }

.mat-actions { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }

/* ── Fenêtres ────────────────────────────────────────────────────────────── */

.mat-panel-fiche { width: 1120px; }
.mat-panel-saisie { width: 580px; }
.mat-panel-saisie .modal-body, .mat-panel-fiche .modal-body { overflow-y: auto; padding: 18px 22px; }
.mat-panel-fiche .modal-body { background: var(--color-bg); }
.mat-panel-fiche .modal-body > * + * { margin-top: 14px; }

.mat-form { display: flex; flex-direction: column; gap: 12px; }
.mat-form--ligne { max-width: 640px; }
.mat-form .form-label { display: flex; flex-direction: column; gap: 5px; font-size: 13px; font-weight: 600; color: var(--color-text-2); }
.mat-form .form-label small { font-weight: 400; }

.mat-fiche-entete {
  display: grid; grid-template-columns: 1fr; gap: 12px;
  padding: 16px 18px; background: var(--color-surface);
  border: 1px solid var(--color-border); border-radius: 12px;
}
.mat-fiche-badges { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.mat-fiche-faits { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.mat-fait { display: flex; flex-direction: column; gap: 2px; padding: 8px 12px; background: var(--color-bg); border-radius: 8px; min-width: 0; }
.mat-fait-libelle { font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--color-text-3); }
.mat-fait-valeur { font-size: 13.5px; font-weight: 600; color: var(--color-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mat-fiche-entete .mat-actions { padding-top: 12px; border-top: 1px solid var(--color-border); }

.mat-fiche-grille {
  display: grid; grid-template-columns: 240px 1fr; gap: 20px;
  padding: 16px 18px; background: var(--color-surface);
  border: 1px solid var(--color-border); border-radius: 12px;
}
.mat-fiche-gauche { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.mat-qr { width: 168px; height: 168px; border: 1px solid var(--color-border); border-radius: 10px; background: #fff; padding: 4px; }

.mat-identite { display: grid; grid-template-columns: max-content 1fr; gap: 8px 20px; font-size: 13px; margin: 0; align-content: start; }
.mat-identite dt { color: var(--color-text-3); }
.mat-identite dd { margin: 0; white-space: pre-wrap; font-weight: 500; }

.mat-galerie { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
.mat-vignette { margin: 0; border: 1px solid var(--color-border); border-radius: 10px; padding: 8px; background: var(--color-surface); font-size: 12px; }
.mat-vignette--principale { border-color: var(--color-primary); box-shadow: 0 0 0 2px var(--color-primary-fd); }
.mat-vignette-img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 6px; background: var(--color-bg); cursor: zoom-in; display: block; margin-bottom: 6px; }

.mat-bascule { display: inline-flex; gap: 2px; padding: 3px; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 10px; align-self: flex-start; }
.mat-bascule .btn { border-radius: 7px; }

/* ── Statistiques ────────────────────────────────────────────────────────── */

.mat-graphes { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 14px; }
.mat-graphe { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 12px; padding: 14px 16px; box-shadow: 0 1px 2px rgba(16, 32, 51, .05); }
.mat-graphe h5 { font-size: 13.5px; font-weight: 700; margin: 0 0 10px; color: var(--color-text); }
.mat-barre { display: grid; grid-template-columns: 140px 1fr 36px; gap: 10px; align-items: center; font-size: 12px; margin: 6px 0; }
.mat-barre-libelle { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--color-text-2); }
.mat-barre-piste { background: var(--color-bg); border-radius: 6px; height: 10px; overflow: hidden; }
.mat-barre-valeur { display: block; height: 100%; background: var(--color-primary); border-radius: 6px; transition: width .4s ease; }
.mat-barre--en-retard, .mat-barre--manquant, .mat-barre--hors-service, .mat-barre--date-manquante { background: var(--mat-critique); }
.mat-barre--urgent, .mat-barre--indisponible-temporairement { background: #e07a16; }
.mat-barre--a-prevoir, .mat-barre--attendu { background: #0b9fc9; }
.mat-barre--conforme, .mat-barre--disponible { background: #1fa572; }
.mat-barre--en-reparation { background: #6c4bd0; }
.mat-barre--reforme, .mat-barre--non-concerne { background: #a7b3bf; }
.mat-barre-nombre { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }

/* ── Messages ────────────────────────────────────────────────────────────── */

.mat-toast { position: fixed; right: 16px; bottom: 16px; z-index: 400; display: flex; flex-direction: column; gap: 8px; max-width: 420px; }
.mat-toast-msg { padding: 11px 16px; border-radius: 10px; font-size: 13px; box-shadow: 0 8px 24px rgba(0, 0, 0, .18); background: #102033; color: #fff; }
.mat-toast-msg--erreur { background: #b91c1c; }

@media (max-width: 1100px) {
  .mat-duo, .mat-duo--etroit { grid-template-columns: 1fr; }
}

/* Sur le téléphone, après un scan du QR code : la fiche occupe l'écran et
   ses boutons se prennent au pouce. */
@media (max-width: 760px) {
  .mat-onglets { overflow-x: auto; flex-wrap: nowrap; }
  .mat-onglets button { white-space: nowrap; padding: 8px 12px; }
  .mat-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mat-kpi-valeur { font-size: 24px; }
  .mat-ligne { grid-template-columns: 1fr 14px; }
  .mat-ligne-droite { grid-column: 1; justify-content: space-between; }
  .mat-fiche-grille { grid-template-columns: 1fr; }
  .mat-fiche-entete .mat-actions .btn { padding: 10px 14px; font-size: 14px; }
  .mat-barre { grid-template-columns: 100px 1fr 30px; }
  .mat-panel-saisie, .mat-panel-fiche { width: 100vw; max-width: 100vw; max-height: 100vh; border-radius: 0; }
}

/* ── Commandes fournisseurs ──────────────────────────────────────────────── */
.mat-commande--brouillon { background: var(--mat-neutre-fd); color: var(--mat-neutre); }
.mat-commande--envoyee   { background: var(--mat-info-fd); color: var(--mat-info); }
.mat-commande--acceptee  { background: #f2eefc; color: #6c4bd0; }
.mat-commande--terminee  { background: var(--mat-ok-fd); color: var(--mat-ok); }
.mat-commande--annulee   { background: var(--mat-neutre-fd); color: var(--color-text-3-aplat, #5c6d7e); text-decoration: line-through; }
.mat-type--etalonnage                { background: var(--color-primary-fd); color: var(--color-primary-h); }
.mat-type--verification-d-etalonnage { background: #eef2ff; color: #4338ca; }
.mat-type--verification-interne      { background: var(--mat-vigilance-fd); color: var(--mat-vigilance); }
.mat-type--reparation                { background: var(--mat-critique-fd); color: var(--mat-critique); }
.mat-courriel--sans-adresse { background: var(--mat-critique-fd); color: var(--mat-critique); }
.mat-contact--principal { background: var(--mat-ok-fd); color: var(--mat-ok); }

.mat-texte-long { white-space: pre-wrap; overflow-wrap: anywhere; }
.mat-form-deux { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.mat-envoi-entete { display: flex; flex-direction: column; gap: 6px; }
.mat-envoi-entete p { margin: 0; overflow-wrap: anywhere; }

.mat-apercu-courriel { display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.mat-apercu-courriel p { margin: 0; overflow-wrap: anywhere; }
.mat-apercu-courriel pre {
  margin: 8px 0 0; padding: 14px 16px; border: 1px solid var(--color-border); border-radius: 10px;
  background: var(--color-surface); white-space: pre-wrap; overflow-wrap: anywhere;
  font-family: inherit; font-size: 13px; line-height: 1.5; max-height: 460px; overflow: auto;
}

.mat-choix {
  display: flex; flex-direction: column; gap: 2px; max-height: 220px; overflow: auto;
  padding: 6px 8px; border: 1px solid var(--color-border); border-radius: 10px;
}
.mat-choix .checkbox-ligne { font-weight: 400; padding: 3px 0; }
.mat-lignes-cmd { display: flex; flex-direction: column; gap: 10px; margin-top: 10px; }
.mat-ligne-cmd { border: 1px solid var(--color-border); border-left: 3px solid var(--mat-info); border-radius: 10px; padding: 10px 12px; }
.mat-ligne-cmd-tete { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; flex-wrap: wrap; }
.mat-destinataires { display: flex; flex-direction: column; gap: 6px; }
.mat-destinataire { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.mat-destinataire .checkbox-ligne { font-weight: 400; }
.mat-destinataire .select { max-width: 80px; }

/* Validation des étalonnages (matériel critique) */
.mat-statut--en-attente-de-validation, .mat-validation--a-valider,
.mat-suivi--a-joindre, .mat-suivi--incomplet { background: var(--mat-vigilance-fd); color: var(--mat-vigilance); }
.mat-validation--valide { background: var(--mat-ok-fd); color: var(--mat-ok); }  /* était #1f8a4c sur #e8f7ee, 3,95 */
.mat-validation--refuse, .mat-validation--non-conforme { background: var(--mat-critique-fd); color: var(--mat-critique); }
.mat-validation--sans-validation, .mat-suivi--responsable-technique { background: var(--mat-neutre-fd); color: var(--color-text-3-aplat, #5c6d7e); }
.mat-critique { background: #102033; color: #fff; letter-spacing: .02em; }
.mat-ligne--validation { --l: var(--mat-vigilance); }
.mat-toast-msg--attention { background: #b45309; }
.mat-points { min-width: 1100px; }
.mat-points td { vertical-align: middle; }
.mat-points .input, .mat-points .select { width: 100%; min-width: 64px; }
.mat-points td:first-child .input { min-width: 140px; }
.mat-decision { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; }
.mat-decision .checkbox-ligne { font-weight: 400; }
.mat-decision input:disabled + span { opacity: .45; }

@media (max-width: 760px) {
  .mat-form-deux { grid-template-columns: 1fr; }
}