/* Planning (admin) — la feuille propre à l'écran, en densité bureau.
   Aucune teinte inventée : les paires pâle/foncé d'admin.css. La couleur porte
   le TRAITEMENT d'une absence, jamais le motif (repris de l'écran V1 du 15/09) :
   bleu = congé payé, vert = payé sans suite, ambre = à régulariser,
   rouge = à qualifier, gris = suspendu ou sans effet sur la paie. */

.pl-test {
  background: var(--ambre-pale); color: var(--ambre); border-radius: 8px;
  padding: 8px 12px; margin: 0 0 12px; font-size: 0.9em; line-height: 1.45;
}
.pl-vue[hidden], .outil-cote .outil-carte[hidden] { display: none !important; }
.pl-titre { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin: 0 0 8px; }
.pl-titre h2 { margin: 0; font-size: 1.1em; }
.pl-nav { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.pl-nav { flex-wrap: nowrap; }
.pl-nav input[type="date"] { font: inherit; min-width: 0; flex: 1 1 auto; padding: 4px 6px; border: 1px solid var(--bordure); border-radius: 6px; }

/* La grille de la semaine */
.pl-grille { width: 100%; border-collapse: collapse; font-size: 0.88em; table-layout: fixed; }
.pl-grille th, .pl-grille td { border-bottom: 1px solid var(--fond-clair); padding: 3px; vertical-align: top; }
.pl-grille th { font-weight: 600; color: var(--gris-fonce); text-align: center; white-space: nowrap; }
.pl-grille th.pl-qui, .pl-grille td.pl-qui { text-align: left; width: 9em; }
.pl-grille th.pl-total, .pl-grille td.pl-total { width: 4.5em; text-align: right; }
.pl-grille th button { font: inherit; background: none; border: 0; color: inherit; cursor: pointer; padding: 2px; }
.pl-grille th button:hover { color: var(--accent); text-decoration: underline; }
.pl-grille th small, .pl-case small { display: block; font-weight: 400; color: var(--gris-moyen); }
.pl-ferme { background: var(--fond-clair); }
.pl-case { border-radius: 6px; padding: 3px 4px; text-align: center; line-height: 1.25; background: var(--accent-pale); color: var(--accent); font-weight: 600; }
.pl-case + .pl-case { margin-top: 2px; }
.pl-plage { white-space: nowrap; font-size: 0.92em; }
.pl-case.pl-geste { background: var(--vert-pale); color: var(--vert); }
.pl-case.pl-rien { background: none; color: var(--gris-moyen); font-weight: 400; }
.pl-trou { color: var(--rouge); font-weight: 600; }

/* Les traitements d'absence */
.t-paye_cp { background: var(--accent-pale); color: var(--accent); }
.t-paye { background: var(--vert-pale); color: var(--vert); }
.t-a_rattraper, .t-retenu { background: var(--ambre-pale); color: var(--ambre); }
.t-inconnu { background: var(--rouge-pale); color: var(--rouge); }
.t-suspendu, .t-hors_paie { background: var(--fond-clair); color: var(--gris-fonce); }
.t-hors_paie { font-style: italic; }

/* La pastille de la personne : un rang, une teinte de la palette existante */
.pl-rang { display: inline-block; width: 0.7em; height: 0.7em; border-radius: 50%; margin-right: 6px; vertical-align: middle; }
.pl-rang-0 { background: var(--accent); }
.pl-rang-1 { background: var(--vert); }
.pl-rang-2 { background: var(--ambre); }
.pl-rang-3 { background: var(--violet); }
.pl-rang-4 { background: var(--bleu); }
.pl-rang-5 { background: var(--orange); }
.pl-rang-6 { background: var(--ardoise); }
.pl-rang-7 { background: var(--rouge); }

/* Le mois : une case par jour et par magasin */
.pl-mois { border-collapse: collapse; font-size: 0.78em; }
.pl-mois th, .pl-mois td { padding: 2px; text-align: center; }
.pl-mois td.pl-qui { text-align: left; padding-right: 8px; max-width: 8em; line-height: 1.2; }
.pl-mois th { font-weight: 600; color: var(--gris-fonce); }
.pl-jour { display: inline-block; min-width: 1.5em; min-height: 1.5em; padding: 2px 0; border: 0; border-radius: 4px;
  font: inherit; line-height: 1.5em; background: var(--fond-clair); color: var(--gris-fonce); }
button.pl-jour { cursor: pointer; }
button.pl-jour:hover { outline: 2px solid var(--accent); }
.pl-legende .pl-jour { padding: 1px 8px; }
.e-confirme { background: var(--vert-pale); color: var(--vert); font-weight: 600; }
.e-presume { background: var(--accent-pale); color: var(--accent); }
.e-question { background: var(--ambre-pale); color: var(--ambre); font-weight: 600; }
.e-contradiction, .e-trou { background: var(--rouge-pale); color: var(--rouge); font-weight: 600; }
.e-ferme { background: none; color: var(--gris-moyen); }
.e-vide { background: var(--fond-clair); color: var(--gris-moyen); }
.pl-legende { display: flex; gap: 8px; flex-wrap: wrap; margin: 8px 0; font-size: 0.85em; }

/* Le jour */
.pl-lignes { display: grid; gap: 6px; }
.pl-ligne { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; padding: 6px 0; border-bottom: 1px solid var(--fond-clair); }
.pl-ligne b { min-width: 8em; }
.pl-etiq { display: inline-block; font-size: 0.85em; font-weight: 600; padding: 1px 8px; border-radius: 4px; }
.pl-notes { margin: 8px 0 0; padding-left: 1.2em; color: var(--gris-fonce); font-size: 0.9em; }

/* Les idées */
.pl-idee { display: grid; gap: 6px; }
.pl-idee textarea { font: inherit; width: 100%; box-sizing: border-box; min-height: 4em; padding: 6px; border: 1px solid var(--bordure); border-radius: 6px; resize: vertical; }
.pl-attente { color: var(--gris-moyen); font-style: italic; }

/* Un prénom qui ouvre la fiche : un lien sans en avoir l'air. */
.pl-nom { font: inherit; font-weight: 600; background: none; border: 0; padding: 0; color: inherit; cursor: pointer; }
.pl-nom:hover { color: var(--accent); text-decoration: underline; }

/* La fiche, en fenêtre (dialog natif). */
.pl-fiche {
  width: min(1000px, 96vw); max-height: 92vh; margin: auto; padding: 0 18px 18px; border: 1px solid var(--bordure);
  border-radius: 10px; background: var(--surface); color: var(--texte); overflow-y: auto;
}
.pl-fiche::backdrop { background: rgba(44, 62, 80, 0.45); }
.pl-fiche-tete {
  position: sticky; top: 0; z-index: 1; display: flex; justify-content: space-between; align-items: center;
  gap: 10px; padding: 12px 0 8px; background: var(--surface); border-bottom: 1px solid var(--fond-clair);
}
.pl-fiche-tete h2 { margin: 0; }
.pl-fiche-bloc { margin: 12px 0; }
.pl-fiche-bloc > summary { cursor: pointer; font-weight: 600; padding: 4px 0; }
.pl-fiche-ligne, .pl-fiche-form { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin: 8px 0; }
.pl-fiche-form .outil-note { flex-basis: 100%; margin: 0; }
.pl-fiche input, .pl-fiche select { font: inherit; padding: 3px 6px; border: 1px solid var(--bordure); border-radius: 6px; }
.pl-fiche [hidden] { display: none !important; }
.pl-annulee td { color: var(--gris-moyen); text-decoration: line-through; }
.pl-annulee td.outil-actions { text-decoration: none; }
.pl-lots { margin: 4px 0; padding-left: 1.2em; }

/* L'engrenage du planning : ses listes sous les réglages. */
.pl-engrenage { margin-top: 18px; }
.pl-engrenage .outil-champ { min-width: 10em; }

/* À regarder : ce qui attend Romain. */
.pl-regarder { margin: 0; padding-left: 1.1em; display: grid; gap: 6px; font-size: 0.92em; }
.pl-regarder .lettre { margin-left: 4px; }

/* L'appel à renfort, sous les jokers du jour. */
.pl-appel { margin-top: 10px; display: grid; gap: 6px; }
.pl-appel h3 { margin: 0; font-size: 1em; }
.pl-trou .lettre { font-weight: 400; }
.pl-appel[hidden] { display: none; }