/* ============================================================
   page-legale.css — layout partage des pages legales
   (mentions legales, cookies, accessibilite RGAA)
   ============================================================ */

/* Grille : contenu + sommaire lateral */
.legal-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sp-6);
}
@media (min-width: 60rem) {
  .legal-layout {
    grid-template-columns: 1fr 16rem;
    gap: var(--sp-7);
  }
}

/* Date de mise a jour */
.legal-updated {
  font-size: var(--step--1);
  color: var(--ink-soft);
  font-family: var(--font-head);
  margin-bottom: var(--sp-4);
}

/* Prose (corps de l'article) */
.prose h2 {
  font-size: var(--step-2);
  margin-top: var(--sp-5);
  scroll-margin-top: 6rem;
}
.prose h2:first-child { margin-top: 0; }
.prose h3 { font-size: var(--step-1); margin-top: var(--sp-4); }
.prose p { color: var(--ink-soft); margin-top: var(--sp-3); }
.prose ul, .prose ol { margin-top: var(--sp-3); padding-left: 1.4rem; color: var(--ink-soft); display: flex; flex-direction: column; gap: 0.4rem; }
.prose a { color: var(--ink); text-decoration: underline; }
.prose a:hover { color: var(--olive); }

/* Tableaux (page cookies notamment) */
.prose table {
  width: 100%;
  border-collapse: collapse;
  margin-top: var(--sp-4);
  font-size: var(--step--1);
}
.prose th, .prose td {
  text-align: left;
  padding: 0.7em 0.9em;
  border: 1px solid var(--line);
  vertical-align: top;
}
.prose th,
.prose thead td {
  background: var(--paper-2);
  font-family: var(--font-head);
  font-weight: 600;
  color: var(--ink);
  text-align: left;
}
.prose td { color: var(--ink-soft); }

/* Encadré (bouton Citation/blockquote de l'éditeur) — ex. « Organismes concernés » */
.prose blockquote {
  margin: var(--sp-4) 0 0;
  padding: var(--sp-3) var(--sp-4);
  background: var(--paper-2);
  border-left: 0.25rem solid var(--yellow);
  border-radius: 0 var(--radius) var(--radius) 0;
  color: var(--ink-soft);
  font-style: normal;
}
.prose blockquote p:first-child { margin-top: 0; }
.prose blockquote strong { color: var(--ink); }

/* Sommaire lateral */
.legal-toc {
  position: sticky;
  top: 6rem;
  align-self: start;
  border-left: 0.18rem solid var(--yellow);
  padding-left: var(--sp-3);
}
.legal-toc__title {
  font-family: var(--font-head);
  font-weight: 600;
  font-size: var(--step--1);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--olive);
  margin-bottom: var(--sp-2);
}
.legal-toc ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.5rem; }
.legal-toc a {
  color: var(--ink-soft);
  text-decoration: none;
  font-size: var(--step--1);
  line-height: 1.4;
  display: block;
}
.legal-toc a:hover { color: var(--ink); text-decoration: underline; }

/* Cache le sommaire s'il est vide (aucun H2) */
.legal-toc:empty { display: none; }

@media (max-width: 60rem) {
  .legal-toc { display: none; }
}

/* ---- Plan du site ---- */
.sitemap { display: grid; grid-template-columns: 1fr; gap: var(--sp-5); }
@media (min-width: 40rem) { .sitemap { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 60rem) { .sitemap { grid-template-columns: repeat(3, 1fr); } }
.sitemap-col { border-top: 0.18rem solid var(--ink); padding-top: var(--sp-3); }
.sitemap-col > a,
.sitemap-col > span.sm-top {
  font-family: var(--font-head); font-weight: 700; font-size: var(--step-1);
  color: var(--ink); text-decoration: none; display: block;
}
.sitemap-col > a:hover { color: var(--olive); }
.sitemap-col ul {
  list-style: none; padding: 0; margin: var(--sp-3) 0 0;
  display: flex; flex-direction: column; gap: 0.5rem;
}
.sitemap-col li a {
  color: var(--ink-soft); text-decoration: none; font-size: var(--step-0);
  padding-left: 1rem; position: relative; display: block;
}
.sitemap-col li a::before {
  content: ""; position: absolute; left: 0; top: 0.6em;
  width: 0.45rem; height: 0.45rem; background: var(--yellow);
}
.sitemap-col li a:hover { color: var(--ink); text-decoration: underline; }