/* =====================================================================
   p-legal.css · privacy.html, terms.html, cookies.html · prefix .p-legal-
   Only what the kit (inner.css) does not bring: the narrower contents rail on small desktops,
   column widths of the legal tables, the external-link icon, the «Manage cookies» button row
   and the «other documents» row.
   ===================================================================== */

/* external link to a third-party page: inline, so the icon follows the last word when the text wraps (a flex link
   left the icon stranded at the far end of a two-line label on phones); vertical padding keeps a >= 44px hit area */
.p-legal-ext a{padding-block:12px}
.p-legal-ext .i{display:inline-block;vertical-align:-2px;margin-left:6px}

/* «Manage cookies» (re-opens the consent banner): outline, never a second solid button */
.p-legal-act{margin-top:var(--s3)}

/* links to the other two legal documents, below the text */
.p-legal-more{max-width:var(--measure);margin-top:var(--s8);padding-top:var(--s4);border-top:1px solid var(--line)}
.p-legal-more .jump{margin-top:var(--s2)}

/* between 1001 and 1180px the kit rail (28vw, 280-340px) leaves the text column only ~580px, too narrow for the
   five-column cookie table: a 240px rail gives it ~650px. The contents list simply wraps onto a second line. */
@media (min-width:1001px) and (max-width:1180px){
  .p-legal-lay .lay-grid{grid-template-columns:minmax(0,1fr) 240px;column-gap:var(--s5)}
}

/* legal tables (comparison cards that stack into labelled blocks under 721px; the kit rules for phones stay untouched).
   The kit pads the outer cells 32px and every other cell 16px; here 24px outside and 12px between columns */
@media (min-width:721px){
  .p-legal-t2 th,.p-legal-t2 td,.p-legal-t3 th,.p-legal-t3 td,.p-legal-t5 th,.p-legal-t5 td{padding-inline:12px}
  .p-legal-t2 thead th:first-child,.p-legal-t2 tbody th,
  .p-legal-t3 thead th:first-child,.p-legal-t3 tbody th,
  .p-legal-t5 thead th:first-child,.p-legal-t5 tbody th{padding-left:var(--s3)}
  .p-legal-t2 thead th:last-child,.p-legal-t2 tbody td:last-child,
  .p-legal-t3 thead th:last-child,.p-legal-t3 tbody td:last-child,
  .p-legal-t5 thead th:last-child,.p-legal-t5 tbody td:last-child{padding-right:var(--s3)}
  /* fixed layout reads its column widths from the first row, i.e. the header row */
  .p-legal-t2 thead th:first-child{width:34%}
  .p-legal-t3 thead th:first-child{width:27%}
  .p-legal-t3 thead th:nth-child(2){width:27%}
  .p-legal-t5 thead th:first-child{width:24%}
  .p-legal-t5 thead th:nth-child(2){width:18%}
  .p-legal-t5 thead th:nth-child(4){width:17%}
  .p-legal-t5 thead th:nth-child(5){width:16%}
  .p-legal-t5 tbody th{font-size:.875rem;overflow-wrap:normal}  /* cookie names (e.g. _ga_X063DLM731) never break mid-word */
}

/* phones: the kit stacks every cell on its own line; five labelled lines per cookie make a very long list,
   so each cookie becomes a compact card: name, then provider | category, then purpose | duration */
@media (max-width:720px){
  .p-legal-t5 tbody tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:var(--s3)}
  .p-legal-t5 tbody th{grid-column:1 / -1}
  .p-legal-t5 tbody td:nth-of-type(1){grid-area:2 / 1}  /* Provider */
  .p-legal-t5 tbody td:nth-of-type(3){grid-area:2 / 2}  /* Category */
  .p-legal-t5 tbody td:nth-of-type(2){grid-area:3 / 1}  /* Purpose */
  .p-legal-t5 tbody td:nth-of-type(4){grid-area:3 / 2}  /* Duration */
}
@media (max-width:720px){
  .p-legal-t5 tbody td,.p-legal-t5 tbody td:first-of-type{padding-top:8px!important}  /* compact card: a.css gives stacked cells 14px */
}