/* Strony dokumentow (`/terms/`, `/privacy/`).
 *
 * To jedyne miejsce w serwisie, gdzie czyta sie dluzszy tekst, wiec uklad jest inny
 * niz w aplikacji: jedna kolumna o szerokosci wygodnej do czytania i wiecej powietrza
 * miedzy wierszami. Barwy, promienie i kroje przychodza z `style.css` - tutaj nie ma
 * ani jednej wartosci dobranej na oko (zasada z DESIGN.md).
 */

.doc {
  max-width: 40rem;
  margin: 0 auto;
  padding: max(20px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-left))
           max(32px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-right));
}

/* Pasek powrotu. Aplikacja nie ma dokad wrocic z dokumentu inaczej niz na jej poczatek —
   dokument otwiera sie tez z ekranu logowania, gdzie belki jeszcze nie ma. */
.doc-gora {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 28px;
  font-size: 14px;
  color: var(--muted);
}

.doc-gora img { height: 20px; width: auto; display: block; }

.doc h1 {
  font: 500 26px/1.25 var(--sans);
  margin: 0 0 4px;
  letter-spacing: -.01em;
}

.doc .doc-data {
  color: var(--muted);
  font-size: 15px;
  margin-bottom: 28px;
}

.doc section { margin-bottom: 24px; }

/* Naglowek sekcji wyzej kontrastem niz tekst pod nim i z wlasnym odstepem — czytajacy
   szuka w dokumencie punktu, a nie zdania. */
.doc h2 {
  font: 500 18px/1.3 var(--sans);
  margin: 0 0 8px;
}

.doc p { margin: 0 0 12px; line-height: 1.65; }
.doc p:last-child { margin-bottom: 0; }

.doc ul { margin: 0 0 12px; padding-left: 20px; }
.doc li { margin-bottom: 8px; line-height: 1.6; }

.doc code {
  background: var(--bg-2);
  border-radius: var(--r-s);
  padding: 2px 6px;
  font-size: 14px;
}

.doc a { color: var(--accent); }

.doc-stopka {
  margin-top: 36px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  font-size: 14px;
  color: var(--muted);
}

.doc-blad { color: var(--rec); }