/* Charte d'interface TechProd 10 (08 §8.7). */
:root {
  --tp-fond: #F4F6F8;
  --tp-surface: #FFFFFF;
  --tp-bordure: #E1E5EA;
  --tp-texte: #1B2430;
  --tp-texte-secondaire: #3D4855;
  --tp-texte-discret: #5B6675;
  --tp-principal: #1D4F7A;
  --tp-principal-doux: #E8F0F7;
  --tp-alerte-texte: #7A5300;
  --tp-alerte-fond: #FFF4D6;
  --tp-rayon-carte: 12px;
  --tp-rayon-champ: 8px;

  --bs-body-bg: var(--tp-fond);
  --bs-body-color: var(--tp-texte);
  --bs-body-font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --bs-border-color: var(--tp-bordure);
  --bs-border-radius: var(--tp-rayon-champ);
  --bs-primary: var(--tp-principal);
  --bs-primary-rgb: 29, 79, 122;
  --bs-link-color: var(--tp-principal);
  --bs-link-color-rgb: 29, 79, 122;
}

body { background: var(--tp-fond); color: var(--tp-texte); }

.btn-primary {
  --bs-btn-bg: var(--tp-principal);
  --bs-btn-border-color: var(--tp-principal);
  --bs-btn-hover-bg: #173F62;
  --bs-btn-hover-border-color: #173F62;
  --bs-btn-active-bg: #12324E;
  --bs-btn-active-border-color: #12324E;
}

.btn, .form-control, .form-select { min-height: 44px; border-radius: var(--tp-rayon-champ); }

.carte {
  background: var(--tp-surface);
  border: 1px solid var(--tp-bordure);
  border-radius: var(--tp-rayon-carte);
}

.texte-secondaire { color: var(--tp-texte-secondaire); }
.texte-discret { color: var(--tp-texte-discret); }

.entete-techprod { background: var(--tp-surface); border-bottom: 1px solid var(--tp-bordure); }
.entete-techprod .navbar-brand { color: var(--tp-principal); font-weight: 700; }
.entete-techprod .nav-link { color: var(--tp-texte-secondaire); font-weight: 500; min-height: 44px; display: flex; align-items: center; }
.entete-techprod .nav-link.active { color: var(--tp-principal); background: var(--tp-principal-doux); border-radius: var(--tp-rayon-champ); }
.btn-utilisateur { color: var(--tp-texte-secondaire); border: 1px solid var(--tp-bordure); }

.alerte-attention { color: var(--tp-alerte-texte); background: var(--tp-alerte-fond); border-color: #F0DFA8; }

/* Bandeau permanent en recette (04, FEN_Menu › GR_BASETEST). */
.bandeau-base-test {
  background: #B00020;
  color: #FFFFFF;
  font-weight: 700;
  text-align: center;
  padding: .5rem 1rem;
  letter-spacing: .05em;
  position: sticky;
  top: 0;
  z-index: 1050;
}

.pied-techprod {
  border-top: 1px solid var(--tp-bordure);
  background: var(--tp-surface);
  color: var(--tp-texte-discret);
  font-size: .875rem;
  padding: .75rem 0;
}

.lien-referentiel { display: flex; align-items: center; min-height: 44px; font-weight: 500; text-decoration: none; }
.lien-referentiel:hover { text-decoration: underline; }

@media print {
  header, footer, .bandeau-base-test { display: none !important; }
}

/* Affectations (F-32) : cases larges pour la tablette, ligne cochée mise en évidence. */
.case-44 { width: 1.6rem; height: 1.6rem; margin: .5rem; cursor: pointer; }
.ligne-selectionnee > td { background: var(--tp-principal-doux); }
.liste-choix { max-height: 26rem; overflow-y: auto; }

/* États (08 §8.7) */
.etat-valide { color: #1F6B4F; background: #E6F3EC; }
.etat-alerte { color: #7A5300; background: #FFF4D6; }
.lien-tri { color: inherit; text-decoration: none; }
.lien-tri:hover { text-decoration: underline; }

/* Texte saisi sur plusieurs lignes (commentaires, observations). */
.texte-multiligne {
  white-space: pre-line;
}

/* --- Questionnaire (F-14) : colonne question fixe, AOC défilant horizontalement (tablette 1024 px). --- */
.grille-questionnaire {
  overflow-x: auto;
}
.grille-questionnaire table {
  min-width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}
.grille-questionnaire .col-question {
  position: sticky;
  left: 0;
  z-index: 1;
  min-width: 16rem;
  max-width: 24rem;
  background: var(--bs-body-bg, #fff);
  box-shadow: 1px 0 0 var(--bs-border-color, #dee2e6);
}
.grille-questionnaire .col-etat {
  min-width: 10rem;
}
.grille-questionnaire .col-aoc {
  min-width: 11rem;
}
.grille-questionnaire .ligne-theme th,
.grille-questionnaire .ligne-type th {
  background: #eef2f6;
  position: sticky;
  left: 0;
}
.grille-questionnaire .ligne-type th {
  background: #dfe7ef;
  text-transform: uppercase;
}
/* Couleur selon la valeur : état général (02 §2.8) et réponse par AOC (02 §2.7). Le texte reste affiché : la couleur
   n'est qu'une aide (07 §7.6). */
select[data-etat][data-valeur="1"] { background-color: #d9f2ee; } /* Vu */
select[data-etat][data-valeur="2"] { background-color: #fff3cd; } /* Hors saisonnalité */
select[data-etat][data-valeur="3"] { background-color: #cfe2ff; } /* Contrôlé */
select[data-etat][data-valeur="4"] { background-color: #e2e3e5; } /* Non contrôlé */
select[data-reponse][data-valeur="1"] { background-color: #fff3cd; } /* HS */
select[data-reponse][data-valeur="2"] { background-color: #d1e7dd; } /* C */
select[data-reponse][data-valeur="3"] { background-color: #f8d7da; font-weight: 600; } /* NC */
select[data-reponse][data-valeur="4"] { background-color: #e2e3e5; } /* NA */
/* RG-11 : NC sans manquement signalé en rouge. */
.cellule-alerte,
.choix-manquement.manquement-absent {
  background-color: #f8d7da;
}
/* 02 §2.8 : réponses verrouillées (« vu », « non contrôlé ») — la valeur reste envoyée au serveur. */
.form-select.verrouille {
  pointer-events: none;
  background-color: #e9ecef;
  color: #6c757d;
}
.vignette-photo {
  width: 100%;
  height: 12rem;
  object-fit: cover;
  border-radius: 0.25rem;
}

/* Aperçu des logos et signatures (Administration › Paramètres, lot L8). */
.apercu-image { min-height: 4rem; display: flex; align-items: center; }
.apercu-image img { max-height: 6rem; width: auto; }

/* Accessibilité (07 §7.6, lot L8 J6) : lien d'évitement et focus clavier visible. */
.lien-evitement {
  position: absolute; left: -10000px; top: 0; z-index: 2000;
  padding: .5rem 1rem; background: var(--tp-principal); color: #fff;
}
.lien-evitement:focus { left: 1rem; top: 1rem; }
main:focus { outline: none; }
a:focus-visible, button:focus-visible, select:focus-visible, input:focus-visible, textarea:focus-visible,
.nav-link:focus-visible, .page-link:focus-visible {
  outline: 3px solid var(--tp-principal); outline-offset: 2px;
}

/* Observations en texte riche (06) */
.editeur-riche { min-height: 16rem; max-height: 32rem; overflow-y: auto; }
.texte-riche p { margin: 0; }
.texte-riche ul, .texte-riche ol { margin: 0; padding-left: 1.5rem; }
