/* Page d'information des patients — sobre, lisible sur telephone, sans dependance externe. */
:root {
    --texte: #1f2328;
    --fond: #ffffff;
    --doux: #59636e;
    --bord: #c9d1d9;
    --accent: #0b5cad;
    --accent-texte: #ffffff;
    --alerte-fond: #fff4e5;
    --alerte-bord: #b35900;
    --erreur: #b42318;
    --erreur-fond: #fdecea;
}
@media (prefers-color-scheme: dark) {
    :root {
        --texte: #e6edf3;
        --fond: #0d1117;
        --doux: #9da7b3;
        --bord: #3d444d;
        --accent: #4493f8;
        --accent-texte: #0d1117;
        --alerte-fond: #2d2110;
        --alerte-bord: #d29922;
        --erreur: #ff7b72;
        --erreur-fond: #2d1414;
    }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
    margin: 0;
    background: var(--fond);
    color: var(--texte);
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    font-size: 1.0625rem;
    line-height: 1.55;
}
main { max-width: 40rem; margin: 0 auto; padding: 1rem 1rem 3rem; }
main.admin { max-width: 64rem; }
h1 { font-size: 1.5rem; line-height: 1.25; margin: 1rem 0; }
h2 { font-size: 1.2rem; margin: 1.5rem 0 .5rem; }
h3 { font-size: 1.05rem; margin: 1.5rem 0 .5rem; }
a { color: var(--accent); }

ul { padding-left: 1.3rem; }
li { margin: .35rem 0; }

form { margin: 0; }
.champ { margin: 0 0 1.1rem; }
label { display: block; font-weight: 600; margin-bottom: .3rem; }
input[type="text"], input[type="password"], textarea, select {
    width: 100%;
    font: inherit;
    font-size: 1rem; /* 16 px au moins : pas de zoom force sur iPhone */
    color: var(--texte);
    background: var(--fond);
    border: 1px solid var(--bord);
    border-radius: 6px;
    padding: .6rem .7rem;
}
textarea { resize: vertical; min-height: 9rem; }
input:focus, textarea:focus, select:focus, button:focus, a:focus {
    outline: 3px solid var(--accent);
    outline-offset: 2px;
}
[aria-invalid="true"] { border-color: var(--erreur); border-width: 2px; }
.aide { color: var(--doux); font-size: .92rem; margin: .3rem 0 0; }
.erreur-champ { color: var(--erreur); font-weight: 600; margin: .3rem 0 0; }
.erreurs {
    background: var(--erreur-fond);
    border-left: 4px solid var(--erreur);
    padding: .5rem 1rem;
    margin: 0 0 1rem;
    border-radius: 4px;
}
.erreurs ul { margin: .3rem 0; padding-left: 1.2rem; }

button {
    font: inherit;
    font-weight: 600;
    background: var(--accent);
    color: var(--accent-texte);
    border: 0;
    border-radius: 6px;
    padding: .75rem 1.2rem;
    min-height: 44px;
    cursor: pointer;
    width: 100%;
}
button.secondaire {
    width: auto;
    background: transparent;
    color: var(--accent);
    border: 1px solid var(--accent);
    padding: .35rem .8rem;
    min-height: 36px;
}
@media (min-width: 36rem) { button { width: auto; } }

.petit { font-size: .9rem; }
/* Champ piege : hors de l'ecran pour une personne, present pour un robot. */
.piege { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }

/* Administration */
.entete-admin { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .5rem; }
.defile { overflow-x: auto; }
table { border-collapse: collapse; width: 100%; font-size: .95rem; }
th, td { text-align: left; padding: .4rem .5rem; border-bottom: 1px solid var(--bord); }
td:not(:first-child), th:not(:first-child) { text-align: right; }
td:first-child { overflow-wrap: anywhere; }
/* Telephone : le tableau par cabinet doit tenir dans l'ecran sans defiler sur le cote. */
@media (max-width: 30rem) {
    table { font-size: .85rem; }
    th, td { padding: .35rem .25rem; }
    th { hyphens: auto; }
    .meta { font-size: .92rem; }
}
.filtres { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: 1rem 0; }
.filtres label { margin: 0; }
.filtres select { width: auto; max-width: 100%; }
.question { border: 1px solid var(--bord); border-left-width: 5px; border-radius: 6px; padding: .5rem .9rem; margin: 0 0 .8rem; }
.question.statut-a_traiter { border-left-color: var(--alerte-bord); }
.question.statut-repondu { border-left-color: #1a7f37; }
.question.statut-transmis_cabinet { border-left-color: var(--accent); }
.meta { color: var(--doux); font-size: .88rem; margin: .2rem 0; }
.texte-question { white-space: normal; overflow-wrap: anywhere; margin: .5rem 0; }
form.statut { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
form.statut label { margin: 0; font-weight: 400; }
form.statut select { width: auto; }
form.ligne { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: .4rem 0; }
form.ligne label { margin: 0; font-weight: 400; }
form.ligne select { width: auto; max-width: 100%; }
.question.statut-sans_suite { border-left-color: var(--bord); }
.avertissement { color: var(--alerte-bord); font-weight: 600; font-size: .9rem; margin: .2rem 0; }
.lien-inactif { font-family: ui-monospace, monospace; font-size: .9em; background: var(--alerte-fond); padding: 0 .2em; }
.flash-ok { background: #e6f4ea; border-left: 4px solid #1a7f37; padding: .5rem 1rem; border-radius: 4px; }
@media (prefers-color-scheme: dark) { .flash-ok { background: #12261a; } }
.onglets { display: flex; flex-wrap: wrap; gap: 1rem; margin: .5rem 0 1rem; }
.qui { margin: 0; color: var(--doux); }
.texte-reponse { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; border: 1px solid var(--bord); border-radius: 6px; padding: .7rem; }
.contact-clair { font-size: 1.3rem; font-weight: 600; }
.encadre { border-left: 4px solid var(--accent); padding: .3rem .8rem; }
.mentions { border-top: 1px solid var(--bord); margin-top: 1.5rem; color: var(--doux); }
.mandat { border: 1px solid var(--bord); border-left-width: 5px; border-radius: 6px; padding: .5rem .9rem; margin: 0 0 .8rem; }
.mandat.feu-vert { border-left-color: #1a7f37; }
.mandat dl { display: grid; grid-template-columns: minmax(8rem, 14rem) 1fr; gap: .2rem .8rem; margin: .5rem 0; }
.mandat dt { color: var(--doux); }
.mandat dd { margin: 0; overflow-wrap: anywhere; }
@media (max-width: 30rem) { .mandat dl { grid-template-columns: 1fr; } .mandat dd { margin-bottom: .4rem; } }
.pages { margin: 1rem 0; }
input[type="email"], input[type="date"], input[type="datetime-local"] {
    width: 100%; font: inherit; font-size: 1rem; color: var(--texte); background: var(--fond);
    border: 1px solid var(--bord); border-radius: 6px; padding: .6rem .7rem;
}