/* Module d'authentification — complète Tailwind (CDN) pour les quelques
   éléments répétés. Le survol se signale par la couleur, jamais par un trait. */

.page-centree {
    min-height: 100dvh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem 1rem;
    background:
        radial-gradient(1100px 520px at 50% -10%, rgba(245, 230, 0, .16), transparent 60%),
        #f8fafc;
}

.carte-centree {
    width: 100%;
    max-width: 25rem;
}

a, a:hover { text-decoration: none; }
.lien-net { color: inherit; }

/* Champs de formulaire */
.champ {
    width: 100%;
    padding: .625rem .75rem;
    border: 1px solid #cbd5e1;
    border-radius: .5rem;
    font-size: .9375rem;
    background: #fff;
    transition: border-color .12s, box-shadow .12s;
}
.champ:focus {
    outline: none;
    border-color: #0f172a;
    box-shadow: 0 0 0 3px rgba(15, 23, 42, .08);
}
.champ[aria-invalid="true"] { border-color: #dc2626; }

.etiquette {
    display: block;
    font-size: .8125rem;
    font-weight: 600;
    color: #334155;
    margin-bottom: .375rem;
}

.aide { font-size: .75rem; color: #64748b; margin-top: .375rem; }

/* Boutons */
.bouton {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    min-height: 2.75rem;
    padding: .625rem 1rem;
    border: 1px solid transparent;
    border-radius: .5rem;
    font-size: .9375rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color .12s, border-color .12s, color .12s;
}
.bouton-principal { background: #0f172a; color: #fff; width: 100%; }
.bouton-principal:hover { background: #1e293b; }
.bouton-principal:disabled { background: #94a3b8; cursor: not-allowed; }
.bouton-secondaire { background: #fff; border-color: #cbd5e1; color: #0f172a; }
.bouton-secondaire:hover { border-color: #94a3b8; background: #f8fafc; }
.bouton-danger { background: #fff; border-color: #fecaca; color: #b91c1c; }
.bouton-danger:hover { border-color: #dc2626; background: #fef2f2; }

/* Messages */
.alerte {
    display: flex;
    gap: .625rem;
    padding: .75rem .875rem;
    border-radius: .5rem;
    font-size: .875rem;
    line-height: 1.45;
    margin-bottom: 1rem;
}
.alerte i { margin-top: .15rem; }
.alerte-erreur  { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.alerte-succes  { background: #f0fdf4; color: #166534; border: 1px solid #bbf7d0; }
.alerte-info    { background: #f8fafc; color: #334155; border: 1px solid #e2e8f0; }
.alerte-attention { background: #fffbeb; color: #92400e; border: 1px solid #fde68a; }

/* Cartes de section (page compte / utilisateurs) */
.bloc {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: .75rem;
    padding: 1.25rem;
    margin-bottom: 1.25rem;
}
.bloc h2 { font-size: 1rem; font-weight: 600; margin-bottom: .25rem; }
.bloc .sous-titre { font-size: .8125rem; color: #64748b; margin-bottom: 1rem; }

table.liste { width: 100%; font-size: .875rem; border-collapse: collapse; }
table.liste th {
    text-align: left; font-size: .6875rem; text-transform: uppercase;
    letter-spacing: .04em; color: #94a3b8; font-weight: 600;
    padding: 0 .625rem .5rem; border-bottom: 1px solid #e2e8f0;
}
table.liste td { padding: .625rem; border-bottom: 1px solid #f1f5f9; vertical-align: middle; }
table.liste tr:last-child td { border-bottom: 0; }

.badge {
    display: inline-block; padding: .125rem .5rem; border-radius: 9999px;
    font-size: .6875rem; font-weight: 600;
}
.badge-admin  { background: #0f172a; color: #f5e600; }
.badge-membre { background: #f1f5f9; color: #475569; }
.badge-off    { background: #fef2f2; color: #b91c1c; }
.badge-on     { background: #f0fdf4; color: #166534; }

.code-secours {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: .8125rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: .375rem;
    padding: .375rem .5rem;
    text-align: center;
}
