/* Écran d'admin de Tom : sobre, clair, lisible sur un ordinateur. */
* { box-sizing: border-box; }
body { margin: 0; font: 15px/1.45 -apple-system, "Helvetica Neue", Arial, sans-serif; color: #23272E; background: #F7F5F2; }
.haut { background: #14171C; padding: 12px 20px; } .haut a { color: #F4F1ED; text-decoration: none; }
main { max-width: 72rem; margin: 0 auto; padding: 16px 20px 60px; }
h1 { font-size: 22px; margin: 10px 0 14px; } h2 { font-size: 17px; margin: 0 0 10px; }
a { color: #8A5426; }
.ligne { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 18px; }
.boite { background: #fff; border: 1px solid #DAD5CE; border-radius: 10px; padding: 14px 16px; margin: 14px 0; }
.etroite { max-width: 24rem; margin: 10vh auto; }
.grille2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 18px; }
.grille2 .plein { grid-column: 1 / -1; }
label { display: block; font-size: 13px; color: #5D6168; }
label input, label select { display: block; width: 100%; margin-top: 3px; }
input, select, textarea, button { font: inherit; padding: 7px 9px; border: 1px solid #C9C3BA; border-radius: 7px; background: #fff; }
button, .bouton { background: #14171C; color: #fff; border: 0; cursor: pointer; padding: 8px 14px; border-radius: 7px; text-decoration: none; display: inline-block; }
button.petit { padding: 5px 10px; font-size: 13px; } button.lien { background: none; color: #8A5426; padding: 2px 4px; text-decoration: underline; }
button.rouge { background: #A0442C; }
.enligne { display: inline-flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 6px 0 0; }
.enligne input, .enligne select { width: auto; display: inline-block; margin: 0; }
.case { display: flex; gap: 8px; align-items: center; color: #23272E; font-size: 14px; } .case input { width: auto; display: inline; }
table { width: 100%; border-collapse: collapse; margin: 6px 0; background: #fff; }
th { text-align: left; font-size: 12px; color: #5D6168; border-bottom: 1px solid #14171C; padding: 5px 6px; }
td { border-bottom: 1px solid #ECE8E2; padding: 6px; vertical-align: top; }
.pastille { font-size: 11px; background: #E9C46A; color: #14171C; padding: 1px 7px; border-radius: 9px; white-space: nowrap; }
.pastille.rouge { background: #A0442C; color: #fff; }
.sourdine { color: #5D6168; }
.erreur { background: #FBE9E4; border: 1px solid #A0442C; color: #7A2E1B; border-radius: 8px; padding: 8px 12px; }
.erreur p { margin: 2px 0; }
.evenements { list-style: none; padding: 0; } .evenements li { padding: 6px 8px; border-bottom: 1px solid #ECE8E2; }
.evenements li.alerte { border-left: 4px solid #A0442C; } .evenements li.lu { opacity: .55; }
.evenements time { font-size: 12px; color: #5D6168; margin-right: 6px; }
.vignettes { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 10px; }
.vignettes label { width: 130px; } .vignettes img { display: block; width: 120px; height: 120px; object-fit: cover; border-radius: 6px; }
.vignettes input { display: inline; width: auto; }
@media (max-width: 40rem) { .grille2 { grid-template-columns: 1fr; } }