/* AVENTECH Innovation — legal.css
   Style dokumentów prawnych: /polityka-prywatnosci/, /polityka-cookies/, /regulamin/.
   Ładowany jako ostatni <link>, wyłącznie na tych trzech stronach, po components.css.

   Korzysta wyłącznie ze zmiennych z tokens.css — zero nowych kolorów, zero ikon.
   Nie zmienia żadnej istniejącej reguły w innych plikach (components.css, uslugi.css) —
   tylko dodaje nowe klasy z prefiksem legal-.
*/

/* === 1. WRAPPER TREŚCI =========================================== */
.legal-content {
  max-width: 60rem;
  margin-top: var(--space-8);
}

/* Szerokość czytania dla akapitów i list — tabele (div.legal-table-wrap)
   celowo pomijamy, zajmują pełną szerokość wrappera. */
.legal-content > p,
.legal-content > ul,
.legal-content > ol,
.legal-content section > p,
.legal-content section > ul,
.legal-content section > ol {
  max-width: 75ch;
}

.legal-meta {
  color: var(--color-text-muted);
  font-size: var(--fs-sm);
}

/* === 2. SPIS TREŚCI =============================================== */
.legal-toc {
  margin-block: var(--space-8);
  padding: var(--space-5) var(--space-6);
  background: var(--color-bg-surface);
  border-left: 3px solid var(--color-orange);
}

.legal-toc h2 {
  margin-top: 0;
  margin-bottom: var(--space-3);
  padding-top: 0;
  border-top: 0;
}

.legal-toc ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.legal-toc li {
  margin-bottom: var(--space-2);
}

.legal-toc a {
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* === 3. NAGŁÓWKI SEKCJI, TEKST, ODNOŚNIKI, KOD ==================== */
/* Kotwice (#sekcja-N i pochodne) nie chowają się pod sticky nagłówkiem (~65px). */
.legal-content [id] {
  scroll-margin-top: 5rem;
}

.legal-content section h2 {
  margin-top: var(--space-12);
  padding-top: var(--space-6);
  border-top: 1px solid var(--color-border);
}

.legal-content h3 {
  margin-top: var(--space-8);
}

.legal-content a {
  text-decoration: underline;
  text-underline-offset: 2px;
  overflow-wrap: anywhere;
}

.legal-content code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.9em;
  background: var(--color-bg-surface);
  padding: 0.15em 0.4em;
  border-radius: var(--radius-sm);
  overflow-wrap: anywhere;
}

/* === 4. CALLOUT — role="note" (polityka cookies §10.2) ============ */
/* Wizualnie jak istniejący wzorzec .team-portfolio: tło + lewy border akcentem. */
.legal-note {
  padding: var(--space-3) var(--space-4);
  background: var(--color-bg-surface);
  border-left: 3px solid var(--color-orange);
  max-width: 75ch;
}

/* === 5. TABELE ====================================================== */
/* Wizualnie wzorowane na .service-table (uslugi.css) — te same tokeny,
   własne klasy (legal-table*), uslugi.css pozostaje nietknięty i niewczytany tu. */
.legal-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin-block: var(--space-6);
  border: 1px solid var(--color-border);
}

.legal-table-wrap:focus-visible {
  outline: 2px solid var(--color-black);
  outline-offset: -2px;
}

.legal-table {
  width: 100%;
  min-width: 480px;
  border-collapse: collapse;
  font-size: var(--fs-sm);
  background: var(--color-bg);
}

.legal-table thead {
  background: var(--color-bg-surface);
  border-bottom: 2px solid var(--color-orange);
}

.legal-table th[scope="col"] {
  text-align: left;
  padding: var(--space-3) var(--space-4);
  font-family: var(--font-heading);
  font-weight: var(--fw-semibold);
  font-size: var(--fs-xs);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-text);
  vertical-align: bottom;
}

.legal-table td {
  padding: var(--space-3) var(--space-4);
  border-top: 1px solid var(--color-border);
  vertical-align: top;
  line-height: var(--lh-base);
  color: var(--color-text);
}

.legal-table .is-center {
  text-align: center;
}

/* Tabele klucz–wartość: bez min-width (zawijają się, nie przewijają przy 375px).
   th scope="row" — zwykła wielkość liter (nie uppercase jak nagłówek kolumny
   w tabeli zwykłej), wyróżnienie tłem zamiast dolnego obramowania akcentem. */
.legal-table--kv {
  min-width: 0;
}

.legal-table--kv th[scope="row"] {
  width: 30%;
  text-align: left;
  padding: var(--space-3) var(--space-4);
  font-family: var(--font-body);
  font-weight: var(--fw-semibold);
  font-size: var(--fs-sm);
  text-transform: none;
  letter-spacing: normal;
  color: var(--color-text);
  background: var(--color-bg-surface);
  border-top: 1px solid var(--color-border);
  vertical-align: top;
}

/* === 6. DRUK ========================================================= */
@media print {
  .site-header,
  .site-nav,
  .site-footer,
  .legal-toc,
  .cookie-panel,
  .cookie-fab {
    display: none !important;
  }

  .legal-table-wrap {
    overflow-x: visible;
    border-color: #000;
  }

  .legal-table {
    min-width: 0;
  }
}

/* === 7. MOBILE (≤480px) ============================================= */
@media (max-width: 480px) {
  .legal-toc {
    padding: var(--space-4);
  }
}