/*
 * Pages « Informations légales » (informations-legales.php), « Protection des données » (confidentialite.php), depuis
 * le 2026-10-25, et connexion de l'espace clients (compte/espace-clients.php), depuis le 2026-10-27 : texte dans un cadre
 * blanc. Depuis le 2026-10-27, ce cadre blanc est dans le cadre au fond dégradé de css/cadre_page.css (titre dans la
 * bande grise), de la largeur du bloc de contact.php (1120 px), au lieu d'être posé sur le fond dégradé de toute la page.
 */

.page-legale {
    box-sizing: border-box;
    max-width: 1120px;
    margin: 24px auto 20px;
    padding: 32px 40px;
    background: #ffffff;
    color: #1f2a44;
    border-radius: 8px;
    font-size: 16px;
    line-height: 1.55;
    text-align: left;
}

.page-legale h2 {
    margin: 32px 0 8px;
    padding-bottom: 4px;
    color: #003888;
    font-size: 21px;
    font-weight: 600;
    line-height: 1.3;
    text-align: left;
    border-bottom: 2px solid #cccccc;
}

.page-legale h3 {
    margin: 20px 0 6px;
    color: #003888;
    font-size: 17px;
    line-height: 1.3;
    text-align: left;
}

.page-legale p,
.page-legale li {
    text-align: left;
}

.page-legale p {
    margin: 0 0 10px;
}

.page-legale ul {
    margin: 0 0 12px;
    padding-left: 22px;
}

.page-legale a {
    color: #003888;
    text-decoration: underline;
}

.page-legale .version {
    margin-bottom: 20px;
    color: #6b7280;
    font-size: 14px;
}

/* Bandeau d'un projet pas encore publié */
.page-legale .projet {
    margin: 0 0 24px;
    padding: 12px 16px;
    background: #fff4e5;
    border-left: 4px solid #ff6600;
    font-size: 15px;
}

/* Point que la direction doit compléter ou vérifier avant la publication */
.page-legale .a-completer {
    padding: 0 4px;
    background: #fff1b8;
    font-weight: 600;
}

.page-legale .bref {
    margin: 0 0 12px;
    padding: 14px 18px 4px;
    background: #f2f5fa;
    border-radius: 6px;
}

/* Liste des documents (conditions générales, déclaration) : une ligne par document */
.page-legale .documents {
    margin: 0 0 12px;
    padding: 0;
    list-style: none;
}

.page-legale .documents li {
    margin: 0;
    padding: 10px 0;
    border-bottom: 1px solid #e5e7eb;
}

.page-legale .documents li:last-child {
    border-bottom: 0;
}

.page-legale .documents a {
    font-weight: 600;
}

.page-legale .documents .detail {
    display: block;
    color: #6b7280;
    font-size: 14px;
}

.page-legale .bouton-cookies {
    margin: 4px 0 12px;
    padding: 8px 16px;
    background: #003888;
    color: #ffffff;
    border: 0;
    border-radius: 6px;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}

.page-legale .bouton-cookies[hidden] {
    display: none;
}

/* Premier titre du cadre blanc collé en haut (le titre de la page est dans la bande grise de css/cadre_page.css) */
.page-legale > :first-child {
    margin-top: 0;
}

/*
 * Connexion de l'espace clients (compte/espace-clients.php), et depuis le 2026-10-27 newsletter.php, compte/vf.php et
 * compte/reactivation.php : cadre blanc plus étroit, centré (672 px depuis le 2026-10-27, 560 px + 20 %)
 */
.page-legale.page-connexion {
    max-width: 672px;
}

/* Message du serveur (compte/reactivation.php : e-mail envoyé, erreur), écrit en titres h1 à h3 dans le PHP */
.page-connexion .message h1,
.page-connexion .message h2,
.page-connexion .message h3 {
    margin: 0 0 10px;
    padding: 0;
    color: #1f2a44;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.55;
    text-align: left;
    border: 0;
}

/* Première ligne du message en évidence ; la suite (spams, lien) en texte normal */
.page-connexion .message > :first-child {
    color: #003888;
    font-size: 17px;
    font-weight: 600;
}

.page-connexion form {
    margin: 0 0 8px;
}

.page-connexion .champ-libelle {
    display: block;
    margin: 14px 0 4px;
    color: #003888;
    font-weight: 600;
}

.page-connexion input[type=email],
.page-connexion input[type=password],
.page-connexion input[type=text] {
    box-sizing: border-box;
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #cccccc;
    border-radius: 6px;
    background: #ffffff;
    color: #1f2a44;
    font: inherit;
}

.page-connexion input:focus {
    border-color: #003888;
    outline: 2px solid rgba(0, 56, 136, 0.25);
}

/* Bouton « Afficher le mot de passe » : discret, sous le champ */
.page-connexion .bouton-afficher {
    margin: 6px 0 0;
    padding: 0;
    background: none;
    border: 0;
    color: #003888;
    font: inherit;
    font-size: 14px;
    text-decoration: underline;
    cursor: pointer;
}

.page-connexion fieldset {
    margin: 18px 0 0;
    padding: 0;
    border: 0;
}

.page-connexion legend {
    padding: 0;
    color: #003888;
    font-weight: 600;
}

.page-connexion .choix {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 6px 24px 0 0;
    cursor: pointer;
}

.page-connexion .choix input {
    margin: 0;
}

.page-connexion .bouton-connexion {
    box-sizing: border-box;
    width: 100%;
    margin: 22px 0 0;
    padding: 10px 16px;
    background: #003888;
    color: #ffffff;
    border: 0;
    border-radius: 6px;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}

@media (max-width: 600px) {
    .page-legale {
        margin: 14px 0 10px;
        padding: 20px 16px;
        font-size: 15px;
    }

    .page-legale h2 {
        font-size: 19px;
    }
}