/* ==========================================================================
   CAPPS — pages légales (lot CGU, D7) : CGU et politique de confidentialité.
   Gabarit pages/_gabarit_legal.php. S'appuie sur les jetons clair/sombre de site_v2.css
   (--bg, --surface, --text, --muted, --line, --brand…) : le thème sombre suit sans règle propre.
   Bandeau, sommaire collant (colonne de gauche, repliable sur téléphone), colonne de lecture,
   fin de document, barre de progression, impression.
   ========================================================================== */

.v2-page--legal {
    --legal-measure: 72ch;
    --legal-aside-w: 272px;
    --legal-gap: 64px;
    --legal-prose: color-mix(in srgb, var(--text) 84%, var(--muted));
    --legal-sticky-top: calc(var(--header-h) + 28px);
}

.v2-page .legal-wrap { max-width: 1180px; margin: 0 auto; padding: 0 32px; }

/* ---- Barre de progression de lecture ---- */
.legal-progress { position: fixed; inset: 0 0 auto 0; height: 3px; z-index: 40; pointer-events: none; }
.legal-progress__bar {
    display: block; height: 100%; width: 100%; transform-origin: 0 50%; transform: scaleX(0);
    background: linear-gradient(90deg, var(--brand), var(--brand-2));
}
[dir="rtl"] .legal-progress__bar { transform-origin: 100% 50%; }

/* ---- Bandeau ---- */
.v2-page .legal-hero {
    position: relative; padding: 52px 0 40px; background: var(--hero-grad);
    border-bottom: 1px solid var(--line);
}
.v2-page .legal-crumbs { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--muted); margin-bottom: 18px; }
.v2-page .legal-crumbs a { color: var(--muted); }
.v2-page .legal-crumbs a:hover { color: var(--brand); }
.v2-page .legal-crumbs__sep { opacity: .5; }
.v2-page main .legal-hero__title { font-size: 46px; line-height: 1.08; letter-spacing: -1.1px; margin: 0 0 14px; max-width: 18ch; text-wrap: balance; }
.v2-page main .legal-hero__lead { font-size: 18.5px; line-height: 1.6; max-width: 62ch; margin: 0; color: var(--muted); text-wrap: pretty; }

.v2-page .legal-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; margin-top: 24px; font-size: 14px; color: var(--muted); }
.v2-page .legal-meta__item { display: inline-flex; align-items: center; gap: 8px; }
.v2-page .legal-meta__item .i { width: 16px; height: 16px; color: var(--brand); }
.v2-page .legal-meta__item time { color: var(--text); font-weight: 600; }
.v2-page .legal-meta__btn {
    display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 0 14px; border-radius: 999px;
    border: 1px solid var(--line); background: var(--surface); color: var(--text); font-size: 13.5px; font-weight: 600; cursor: pointer;
    transition: border-color .15s, color .15s;
}
.v2-page .legal-meta__btn:hover { border-color: var(--brand); color: var(--brand); }
.v2-page .legal-meta__btn .i { width: 16px; height: 16px; }
.v2-page .legal-meta__btn[hidden] { display: none !important; }

/* Note de langue : visible seulement quand le site est affiché en anglais ou en arabe */
.v2-page .legal-lang-note { display: none; }
html:is([lang="en"], [lang="ar"]) .v2-page .legal-lang-note {
    display: block; margin: 18px 0 0; padding: 10px 14px; max-width: 62ch; border-radius: 12px;
    background: var(--brand-soft); color: var(--text); font-size: 14px;
}

/* Navigation entre documents légaux (onglets) */
.v2-page .legal-docs {
    display: inline-flex; flex-wrap: wrap; gap: 4px; margin-top: 28px; padding: 4px;
    border: 1px solid var(--line); border-radius: 14px;
    background: var(--surface); background: color-mix(in srgb, var(--surface) 80%, transparent);
}
.v2-page .legal-docs__item {
    display: inline-flex; align-items: center; min-height: 38px; padding: 0 14px; border-radius: 10px;
    font-size: 14px; font-weight: 600; color: var(--muted); transition: background-color .15s, color .15s;
}
.v2-page .legal-docs__item:hover { color: var(--text); background: var(--surface-2); }
.v2-page .legal-docs__item[aria-current="page"] { background: var(--brand-soft); color: var(--brand); }

/* ---- Mise en page : sommaire + colonne de lecture ---- */
.v2-page .legal-layout {
    display: grid; grid-template-columns: var(--legal-aside-w) minmax(0, 1fr); gap: var(--legal-gap);
    align-items: start; padding-top: 48px; padding-bottom: 88px;
}
.v2-page .legal-layout--seul { grid-template-columns: minmax(0, 1fr); }
.v2-page .legal-main { min-width: 0; max-width: var(--legal-measure); }
.v2-page .legal-layout--seul .legal-main { margin: 0 auto; }

/* Sommaire collant */
.v2-page .legal-aside {
    position: sticky; top: var(--legal-sticky-top);
    max-height: calc(100vh - var(--legal-sticky-top) - 24px); display: flex; flex-direction: column; gap: 14px;
    overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; padding-bottom: 4px;
}
.v2-page .legal-toc { display: block; }
.v2-page .legal-toc__head {
    display: flex; align-items: center; gap: 10px; list-style: none; cursor: default;
    font-size: 12.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted);
    padding: 0 0 12px 14px;
}
.v2-page .legal-toc__head::-webkit-details-marker { display: none; }
.v2-page .legal-toc__count {
    min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; display: inline-grid; place-items: center;
    background: var(--surface-2); color: var(--muted); font-size: 11.5px; letter-spacing: 0;
}
.v2-page .legal-toc__chev { display: none; margin-inline-start: auto; transition: transform .2s; }
.v2-page .legal-toc__nav { display: block; }
.v2-page .legal-toc__list { display: grid; gap: 2px; border-inline-start: 1px solid var(--line); }
.v2-page .legal-toc__list a {
    position: relative; display: block; padding: 7px 12px 7px 14px; margin-inline-start: -1px;
    border-inline-start: 2px solid transparent; border-radius: 0 8px 8px 0;
    font-size: 14px; line-height: 1.4; color: var(--muted); transition: color .15s, background-color .15s, border-color .15s;
}
/* Site en arabe : la liste reste en français (dir="ltr"), alignée et bordée à droite comme la mise en page */
[dir="rtl"] .v2-page .legal-toc__list { border-inline-start: 0; border-right: 1px solid var(--line); }
[dir="rtl"] .v2-page .legal-toc__list a { text-align: right; margin: 0 -1px 0 0; padding: 7px 14px 7px 12px; border-left: 0; border-right: 2px solid transparent; border-radius: 8px 0 0 8px; }
[dir="rtl"] .v2-page .legal-toc__list a[aria-current="true"] { border-right-color: var(--brand); }
.v2-page .legal-toc__list a:hover { color: var(--text); background: var(--surface-2); }
.v2-page .legal-toc__list a[aria-current="true"] { color: var(--brand); border-inline-start-color: var(--brand); background: var(--brand-soft); font-weight: 600; }

.v2-page .legal-aside__tools { display: flex; flex-wrap: wrap; gap: 6px; padding-inline-start: 14px; }
.v2-page .legal-tool {
    display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 0 10px; border-radius: 8px;
    border: 1px solid transparent; background: none; color: var(--muted); font-size: 13px; font-weight: 600; cursor: pointer;
}
.v2-page .legal-tool:hover { color: var(--text); border-color: var(--line); background: var(--surface); }
.v2-page .legal-tool .i { width: 15px; height: 15px; }
.v2-page .legal-tool[hidden] { display: none !important; }

/* ---- Colonne de lecture (texte fourni par pages/legal/*) ---- */
.v2-page .legal-prose { font-size: 17px; line-height: 1.75; color: var(--legal-prose); overflow-wrap: break-word; hyphens: auto; }
.v2-page .legal-prose > :first-child { margin-top: 0 !important; }
.v2-page main .legal-prose p { margin: 0 0 1.05em; color: var(--legal-prose); font-size: inherit; text-wrap: pretty; }
.v2-page main .legal-prose h2 {
    position: relative; font-size: 25px; line-height: 1.25; letter-spacing: -.4px; font-weight: 700;
    margin: 2.4em 0 .7em; padding-top: 1.6em; border-top: 1px solid var(--line); color: var(--text);
    scroll-margin-top: 8px; text-wrap: balance;   /* s'ajoute au scroll-padding-top du site (hauteur de l'en-tête) */
}
.v2-page main .legal-prose > h2:first-child,
.v2-page main .legal-prose > section:first-child > h2:first-child { border-top: 0; padding-top: 0; margin-top: 0; }
.v2-page main .legal-prose h2:focus { outline: none; }
.v2-page main .legal-prose h3 { font-size: 19px; line-height: 1.35; margin: 1.8em 0 .5em; color: var(--text); scroll-margin-top: 8px; }
.v2-page main .legal-prose h4 { font-size: 17px; margin: 1.5em 0 .4em; color: var(--text); }
.v2-page .legal-prose strong, .v2-page .legal-prose b { color: var(--text); font-weight: 650; }
.v2-page .legal-prose a:not(.legal-anchor) {
    color: var(--brand); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px;
    text-decoration-color: color-mix(in srgb, var(--brand) 40%, transparent); transition: text-decoration-color .15s;
}
.v2-page .legal-prose a:not(.legal-anchor):hover { text-decoration-color: var(--brand); }
.v2-page .legal-prose :is(ul, ol) { margin: 0 0 1.2em; padding-inline-start: 1.4em; display: grid; gap: .45em; }
.v2-page .legal-prose ul { list-style: none; padding-inline-start: 1.3em; }
.v2-page .legal-prose ul > li { position: relative; }
.v2-page .legal-prose ul > li::before {
    content: ""; position: absolute; inset-inline-start: -1.05em; top: .72em;
    width: 6px; height: 6px; border-radius: 50%; background: var(--brand); opacity: .75;
}
.v2-page .legal-prose ol { list-style: decimal; }
.v2-page .legal-prose ol > li::marker { color: var(--brand); font-weight: 600; }
.v2-page .legal-prose li > :is(ul, ol) { margin: .45em 0 0; }
.v2-page .legal-prose li p { margin: 0; }
.v2-page .legal-prose hr { border: 0; border-top: 1px solid var(--line); margin: 2em 0; }
.v2-page .legal-prose address { font-style: normal; margin: 0 0 1.05em; }
.v2-page .legal-prose dl { display: grid; grid-template-columns: max-content 1fr; gap: .4em 1.2em; margin: 0 0 1.2em; }
.v2-page .legal-prose dt { font-weight: 650; color: var(--text); }
.v2-page .legal-prose dd { margin: 0; }

/* Encadrés (blockquote, aside, .note / .legal-note / .encadre) */
.v2-page .legal-prose :is(blockquote, aside, .note, .legal-note, .encadre, .callout) {
    margin: 1.4em 0; padding: 16px 20px; border-radius: 14px;
    background: var(--brand-soft); border: 1px solid color-mix(in srgb, var(--brand) 18%, transparent);
    border-inline-start: 3px solid var(--brand); color: var(--text);
}
.v2-page main .legal-prose :is(blockquote, aside, .note, .legal-note, .encadre, .callout) p { color: var(--text); }
.v2-page .legal-prose :is(blockquote, aside, .note, .legal-note, .encadre, .callout) > :last-child { margin-bottom: 0; }

/* Tableaux */
.v2-page .legal-prose table {
    width: 100%; margin: 1.4em 0; border-collapse: separate; border-spacing: 0; font-size: 15px; line-height: 1.55;
    border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: var(--surface);
}
.v2-page .legal-prose :is(th, td) { padding: 11px 14px; text-align: start; vertical-align: top; border-bottom: 1px solid var(--line); }
.v2-page .legal-prose tr:last-child > :is(td, th) { border-bottom: 0; }
.v2-page .legal-prose th { background: var(--surface-2); color: var(--text); font-weight: 650; font-size: 13.5px; }
.v2-page .legal-prose .legal-table-wrap { margin: 1.4em 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.v2-page .legal-prose .legal-table-wrap > table { margin: 0; }
.v2-page .legal-prose section { margin: 0; }
.v2-page .legal-prose caption { caption-side: top; text-align: start; padding: 0 0 8px; font-size: 14px; color: var(--muted); }

/* Ancre de partage d'un titre */
.v2-page .legal-anchor {
    margin-inline-start: .35em; padding: 0 .2em; color: var(--muted); font-weight: 500; text-decoration: none;
    opacity: 0; transition: opacity .15s, color .15s; border-radius: 6px;
}
.v2-page .legal-prose h2:hover .legal-anchor, .v2-page .legal-anchor:focus-visible { opacity: 1; }
.v2-page .legal-anchor:hover { color: var(--brand); }

/* Document indisponible */
.v2-page .legal-empty { padding: 24px; border: 1px dashed var(--line); border-radius: 16px; background: var(--surface); }

/* ---- Fin de document ---- */
.v2-page .legal-end { display: grid; gap: 16px; margin-top: 56px; padding-top: 32px; border-top: 1px solid var(--line); }
.v2-page .legal-end__ask {
    padding: 24px 26px; border-radius: 18px; border: 1px solid var(--line); background: var(--surface); box-shadow: var(--shadow);
}
.v2-page main .legal-end__title { color: var(--text); font-weight: 700; font-size: 17px; margin: 0 0 6px; }
.v2-page main .legal-end__ask p:not(.legal-end__title) { margin: 0; font-size: 15px; }
.v2-page .legal-end__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.v2-page .legal-end__see { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.v2-page .legal-end__see .legal-end__title { grid-column: 1 / -1; margin: 8px 0 0; font-size: 13px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); }
.v2-page .legal-card {
    position: relative; display: grid; gap: 4px; padding: 18px 44px 18px 18px; border-radius: 14px;
    border: 1px solid var(--line); background: var(--surface); transition: border-color .15s, transform .15s;
}
[dir="rtl"] .v2-page .legal-card { padding: 18px 18px 18px 44px; }
.v2-page .legal-card:hover { border-color: var(--brand); transform: translateY(-1px); }
.v2-page .legal-card__name { color: var(--text); font-weight: 650; font-size: 15px; }
.v2-page .legal-card__desc { color: var(--muted); font-size: 13.5px; line-height: 1.45; }
.v2-page .legal-card__arrow { position: absolute; inset-inline-end: 16px; top: 50%; margin-top: -9px; color: var(--muted); transition: color .15s, transform .15s; }
.v2-page .legal-card:hover .legal-card__arrow { color: var(--brand); transform: translateX(2px); }

/* ---- Tablette : sommaire au-dessus du texte, repliable ---- */
@media (max-width: 1024px) {
    .v2-page .legal-wrap { padding: 0 28px; }
    .v2-page .legal-layout { grid-template-columns: minmax(0, 1fr); gap: 28px; padding-top: 28px; }
    .v2-page .legal-main { margin: 0 auto; width: 100%; }
    .v2-page .legal-aside { position: static; max-height: none; overflow: visible; max-width: var(--legal-measure); width: 100%; margin: 0 auto; }
    .v2-page .legal-toc { border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
    .v2-page .legal-toc__head { cursor: pointer; padding: 14px 16px; font-size: 13px; }
    .v2-page .legal-toc__chev { display: block; }
    .v2-page .legal-toc[open] .legal-toc__chev { transform: rotate(180deg); }
    .v2-page .legal-toc__nav { padding: 0 10px 12px; max-height: 55vh; overflow-y: auto; overscroll-behavior: contain; }
    .v2-page .legal-toc__list { border: 0; }
    .v2-page .legal-toc__list a { border-inline-start: 0; border-radius: 8px; }
    .v2-page .legal-aside__tools { display: none; }
    .v2-page main .legal-hero__title { font-size: 40px; }
}
@media (min-width: 1025px) {
    .v2-page .legal-toc__head { pointer-events: none; }
}

/* ---- Téléphone ---- */
@media (max-width: 640px) {
    .v2-page .legal-wrap { padding: 0 18px; }
    .v2-page .legal-hero { padding: 28px 0 26px; }
    .v2-page .legal-crumbs { margin-bottom: 12px; }
    .v2-page main .legal-hero__title { font-size: 31px; letter-spacing: -.6px; }
    .v2-page main .legal-hero__lead { font-size: 16.5px; }
    .v2-page .legal-meta { gap: 8px 16px; margin-top: 18px; font-size: 13.5px; }
    .v2-page .legal-docs { display: flex; margin-top: 20px; }
    .v2-page .legal-docs__item { flex: 1 1 auto; justify-content: center; text-align: center; padding: 6px 12px; line-height: 1.3; }
    .v2-page .legal-layout { padding-top: 20px; padding-bottom: 48px; gap: 20px; }
    .v2-page .legal-prose { font-size: 16.5px; line-height: 1.7; hyphens: auto; }
    .v2-page main .legal-prose h2 { font-size: 21px; margin-top: 2em; padding-top: 1.3em; }
    .v2-page main .legal-prose h3 { font-size: 17.5px; }
    .v2-page .legal-prose table { display: block; overflow-x: auto; font-size: 14px; }
    .v2-page .legal-prose dl { grid-template-columns: 1fr; }
    .v2-page .legal-end { margin-top: 40px; }
    .v2-page .legal-end__ask { padding: 20px 18px; }
    .v2-page .legal-end__see { grid-template-columns: 1fr; }
    .v2-page .legal-end__actions > .btn { flex: 1 1 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .v2-page .legal-card, .v2-page .legal-card__arrow, .v2-page .legal-toc__chev { transition: none; }
    .v2-page .legal-card:hover { transform: none; }
}

/* ---- Impression : le document seul, noir sur blanc ---- */
@media print {
    @page { margin: 18mm 16mm 20mm; }
    html:root, html:root[data-theme="dark"], html:root:not([data-theme="light"]) {
        --bg: #fff; --surface: #fff; --surface-2: #f3f3f3; --text: #000; --muted: #333; --line: #bbb;
        --brand: #000; --brand-2: #000; --brand-soft: #f3f3f3; --shadow: none; --hero-grad: none; color-scheme: light;
    }
    html { scroll-padding-top: 0; }
    body.v2 { background: #fff; color: #000; font-size: 11pt; }
    .skip, .site-header, .site-footer, .mbar, .fab, .cc, .modal, .v2-modal-backdrop,
    .legal-progress, .legal-crumbs, .legal-docs, .legal-meta__btn, .legal-aside, .legal-end, .legal-anchor, .legal-lang-note { display: none !important; }
    .v2-page .legal-wrap { max-width: none; padding: 0; }
    .v2-page .legal-hero { background: none; padding: 0 0 10pt; margin-bottom: 14pt; border-bottom: 1pt solid #000; }
    .v2-page main .legal-hero__title { font-size: 22pt; max-width: none; margin-bottom: 6pt; }
    .v2-page main .legal-hero__lead { font-size: 11pt; color: #333; max-width: none; }
    .v2-page .legal-meta { margin-top: 8pt; font-size: 9.5pt; color: #333; }
    .v2-page .legal-meta__item .i { display: none; }
    .v2-page .legal-layout { display: block; padding: 0; }
    .v2-page .legal-main { max-width: none; }
    .v2-page .legal-prose { font-size: 10.5pt; line-height: 1.5; color: #000; hyphens: auto; }
    .v2-page main .legal-prose p { color: #000; orphans: 3; widows: 3; }
    .v2-page main .legal-prose h2 { font-size: 14pt; margin: 16pt 0 6pt; padding-top: 0; border-top: 0; break-after: avoid; page-break-after: avoid; }
    .v2-page main .legal-prose h3 { font-size: 12pt; break-after: avoid; page-break-after: avoid; }
    .v2-page .legal-prose :is(table, tr, blockquote, aside, .note, .legal-note, .encadre, .callout) { break-inside: avoid; page-break-inside: avoid; }
    .v2-page .legal-prose table { display: table; border-radius: 0; font-size: 9.5pt; }
    .v2-page .legal-prose :is(blockquote, aside, .note, .legal-note, .encadre, .callout) { background: none; border: 1pt solid #999; border-inline-start: 3pt solid #000; }
    .v2-page .legal-prose a:not(.legal-anchor) { color: #000; text-decoration: underline; }
    .v2-page .legal-prose a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 8.5pt; color: #444; word-break: break-all; }
    .v2-page .legal-prose ul { list-style: disc; padding-inline-start: 1.3em; }
    .v2-page .legal-prose ul > li::before { content: none; }
    .v2-page .legal-meta__item--lecture { display: none; }
}