/* =============================================================================
   public/assets/css/legal.css
   Pages legales (CGU / CGV) — lecture longue, sobre. Uniquement des tokens
   existants (tokens.css / theme.css).
   ============================================================================= */

.legal {
    max-width: 760px;
    margin: 0 auto;
}

/* Meta (date de mise a jour) sous le titre. */
.legal-meta {
    margin: 0 0 var(--space-7, 2rem);
    font-size: .85rem;
    color: var(--muted, #9aa0ac);
    text-align: center;
}

/* Sommaire optionnel. */
.legal-toc {
    margin: 0 0 var(--space-8, 2.5rem);
    padding: var(--space-5, 1.25rem) var(--space-6, 1.5rem);
    border: 1px solid var(--line, rgba(255,255,255,.08));
    border-radius: var(--r-lg, 16px);
    background: var(--surface, #14161c);
}
.legal-toc h2 {
    margin: 0 0 var(--space-3, .75rem);
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--muted, #9aa0ac);
}
.legal-toc ol {
    margin: 0;
    padding-left: 1.2rem;
    columns: 2;
    column-gap: var(--space-6, 1.5rem);
    font-size: .9rem;
}
@media (max-width: 560px) { .legal-toc ol { columns: 1; } }
.legal-toc a {
    color: var(--text-2, #c7ccd6);
    text-decoration: none;
}
.legal-toc a:hover { color: var(--accent, #5b5ef0); }

/* Sections. */
.legal-section {
    margin: 0 0 var(--space-7, 2rem);
    scroll-margin-top: 90px;
}
.legal-section h2 {
    margin: 0 0 var(--space-3, .75rem);
    font-size: 1.15rem;
    color: var(--text, #f4f5f7);
}
.legal-section h3 {
    margin: var(--space-4, 1rem) 0 var(--space-2, .5rem);
    font-size: .98rem;
    color: var(--text, #f4f5f7);
}
.legal-section p,
.legal-section li {
    color: var(--text-2, #c7ccd6);
    line-height: 1.7;
    font-size: .95rem;
}
.legal-section p { margin: 0 0 var(--space-3, .75rem); }
.legal-section ul { margin: 0 0 var(--space-3, .75rem); padding-left: 1.3rem; }
.legal-section li { margin: 0 0 .35rem; }
.legal-section a { color: var(--accent, #5b5ef0); }
.legal-section strong { color: var(--text, #f4f5f7); }

/* Encadre "note" (ex. gratuite du service, renvoi RGPD). */
.legal-note {
    margin: var(--space-4, 1rem) 0;
    padding: var(--space-4, 1rem) var(--space-5, 1.25rem);
    border-left: 3px solid var(--accent, #5b5ef0);
    border-radius: var(--r-sm, 10px);
    background: var(--accent-ghost, rgba(91,94,240,.14));
}
.legal-note p { margin: 0; color: var(--text-2, #c7ccd6); }

/* Marqueur "a completer" : bien visible pour ne pas etre publie tel quel. */
.legal-todo {
    display: inline;
    padding: .05em .4em;
    border-radius: var(--r-xs, 6px);
    background: rgba(224, 176, 86, .16);
    border: 1px dashed rgba(224, 176, 86, .55);
    color: #e0b056;
    font-size: .9em;
    font-style: normal;
}