/* Juridische pagina's (cookie- en privacybeleid, src/views/Legal.astro): één leesbare tekstkolom met tabellen in glazen kaarten */

.legal {
  max-width: 800px;
  margin: 0 auto;
}
.legal .section-head { margin-bottom: clamp(16px, 3vw, 32px); }
.legal__updated {
  margin: var(--space-3) 0 0;
  color: var(--dj-text-muted);
  font-size: var(--fs-small);
}

.legal__section { margin-top: clamp(32px, 5vw, 48px); }
.legal__title {
  margin: 0 0 var(--space-3);
  color: var(--dj-ink);
  font-family: var(--font-display);
  font-size: clamp(1.625rem, 1.3rem + 1vw, 2.125rem);
  font-weight: 400;
  line-height: var(--lh-tight);
}
.legal__section p,
.legal__section ul {
  max-width: 68ch;
  margin: 0 0 var(--space-4);
  color: var(--dj-text);
  line-height: 1.65;
}
.legal__section a { color: var(--dj-ink); text-underline-offset: 3px; }
.legal__section a:hover { color: var(--dj-blue); }
.legal__section ul { padding-left: 1.2em; }
.legal__section li + li { margin-top: var(--space-2); }
.legal__services strong,
.legal__section p strong { color: var(--dj-ink); font-weight: 600; }

/* Tabel (cookies, verwerkingen) */
.legal__table-wrap {
  position: relative;
  margin: var(--space-5) 0;
  padding: clamp(8px, 1.5vw, 16px) clamp(16px, 3vw, 28px);
}
.legal__table {
  position: relative;
  z-index: 1;
  width: 100%;
  border-collapse: collapse;
  font-size: var(--fs-small);
  line-height: var(--lh-body);
}
.legal__table th,
.legal__table td {
  padding: 12px 8px;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid rgba(30, 30, 30, 0.07);
}
.legal__table tr:last-child th,
.legal__table tr:last-child td { border-bottom: 0; }
.legal__table thead th {
  color: var(--dj-text-muted);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.legal__table tbody th { color: var(--dj-ink); font-weight: 600; }
.legal__table code {
  color: var(--dj-ink);
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  font-size: 0.8125rem;
  white-space: nowrap;
}
.legal__table td:last-child { min-width: 9em; }

/* Smal scherm: elke rij als kaartje, kolomnaam voor de waarde */
@media (max-width: 639px) {
  .legal__table thead {
    position: absolute;
    width: 1px; height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
  }
  .legal__table tr { display: block; padding: var(--space-3) 0; border-bottom: 1px solid rgba(30, 30, 30, 0.07); }
  .legal__table tr:last-child { border-bottom: 0; }
  .legal__table th,
  .legal__table td { display: block; padding: 2px 0; border-bottom: 0; }
  .legal__table td::before {
    content: attr(data-label) ": ";
    color: var(--dj-text-muted);
    font-weight: 600;
  }
  .legal__table td:last-child { min-width: 0; }
}

/* "Cookie-instellingen" in de tekst (zelfde knop als in de cookiebanner) */
.legal__settings {
  min-height: 44px;
  margin: 0 0 var(--space-4);
  padding: 0 var(--space-5);
  border: 0;
  border-radius: var(--radius-pill);
  background: var(--dj-ink);
  color: var(--dj-white);
  font: inherit;
  font-size: var(--fs-small);
  font-weight: 600;
  cursor: pointer;
  transition: background-color var(--dur-fast) ease;
}
.legal__settings:hover { background: var(--dj-text); }
.legal__settings[hidden] { display: none; }