/* Omoda — Prawne. Hero: białe tło, sam tekst (kicker/breadcrumb + tytuł),
   zgodnie z nowym frame'em w Figmie "Prawne — Hero". Reszta pliku: czytelna
   typografia treści prawnej (§ nagłówki, akapity, listy) w kontenerze 1280px,
   korzystająca z tokenów omoda-core.css. */

.omoda-legal-hero {
    background: var(--omoda-color-bg);
    width: 100%;
}

.omoda-legal-hero__inner {
    padding-block: var(--omoda-space-2xl) var(--omoda-space-xl);
}

.omoda-legal-hero__breadcrumb {
    display: block;
    font-size: 13px;
    color: #696969;
    margin-bottom: var(--omoda-space-sm);
}

.omoda-legal-hero__breadcrumb a {
    color: inherit;
    text-decoration: none;
}

.omoda-legal-hero__breadcrumb a:hover {
    text-decoration: underline;
}

.omoda-legal-hero__title {
    font-family: var(--omoda-font-base);
    font-size: var(--omoda-font-size-h1);
    font-weight: 700;
    line-height: var(--omoda-line-height-heading);
    color: var(--omoda-color-text);
    margin: 0;
}

/* Lista podstron na rodzicu "Prawne" */
.omoda-legal-index {
    padding-bottom: var(--omoda-space-2xl);
}

.omoda-legal-index__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--omoda-space-sm);
}

.omoda-legal-index__item a {
    font-size: 16px;
    font-weight: 600;
    color: var(--omoda-color-text);
    text-decoration: none;
    border-bottom: 1px solid var(--omoda-color-border);
    display: inline-block;
    padding-bottom: 2px;
}

.omoda-legal-index__item a:hover {
    color: var(--omoda-color-text-muted);
}

/*
 * Treść merytoryczna wstawiana jako zwykły post_content, opakowana przez
 * Omoda_Legal_Pages w <div class="omoda-legal-content">. WAŻNE: NIE wolno
 * tu celować w .page-content — to nie jest "wrapper stron bez Elementora",
 * to OGÓLNY wrapper motywu Hello Elementor wokół CAŁEJ zawartości KAŻDEJ
 * strony (także budowanych w Elementorze — sprawdzone bezpośrednio:
 * `.page-content > .elementor` na stronie głównej). Pierwsza wersja tej
 * reguły celowała w .page-content i przez to nadpisywała kolor/wygląd
 * WSZYSTKICH akapitów na CAŁEJ witrynie (np. wyciemniła podtytuł formularza
 * na czarnym tle) — stąd własna, dedykowana klasa zamiast wspólnej z motywem.
 */
.omoda-legal-content {
    max-width: var(--omoda-container-width);
    margin-inline: auto;
    padding-inline: var(--omoda-container-padding);
    padding-bottom: var(--omoda-space-2xl);
}

.omoda-legal-content h2 {
    font-family: var(--omoda-font-base);
    font-size: var(--omoda-font-size-h3);
    font-weight: 700;
    line-height: var(--omoda-line-height-heading);
    color: var(--omoda-color-text);
    margin: var(--omoda-space-lg) 0 var(--omoda-space-sm);
}

.omoda-legal-content p,
.omoda-legal-content li {
    font-size: 15px;
    line-height: var(--omoda-line-height-body);
    color: var(--omoda-color-text-muted);
}

.omoda-legal-content p {
    margin: 0 0 var(--omoda-space-sm);
}

.omoda-legal-content ul,
.omoda-legal-content ol {
    margin: 0 0 var(--omoda-space-sm);
    padding-left: 1.25em;
}

.omoda-legal-content ol ol {
    margin-top: var(--omoda-space-xs);
}

.omoda-legal-content strong {
    color: var(--omoda-color-text);
}

/*
 * Lista dokumentów do pobrania (Standardy ochrony małoletnich) — bez punktorów,
 * cienka linia oddzielająca wiersze, ikonka PDF przed każdym linkiem. Selektor
 * ".omoda-legal-content .omoda-legal-docs" (0,2,0), nie samo ".omoda-legal-docs"
 * (0,1,0) — musi bić ".omoda-legal-content ul" (0,1,1) wyżej, niezależnie od
 * kolejności reguł w pliku.
 */
.omoda-legal-content .omoda-legal-docs {
    list-style: none;
    margin: 0 0 var(--omoda-space-lg);
    padding-left: 0;
}

.omoda-legal-docs__item {
    border-bottom: 1px solid var(--omoda-color-border);
}

.omoda-legal-docs__item:first-child {
    border-top: 1px solid var(--omoda-color-border);
}

.omoda-legal-docs__link {
    display: flex;
    align-items: center;
    gap: var(--omoda-space-sm);
    padding-block: 14px;
    color: var(--omoda-color-text-muted);
    text-decoration: none;
    transition: color var(--omoda-transition-fast);
}

.omoda-legal-docs__link:hover {
    color: var(--omoda-color-text);
}

.omoda-legal-docs__icon {
    display: inline-flex;
    flex-shrink: 0;
    color: var(--omoda-color-text);
}

.omoda-legal-docs__label {
    font-size: 15px;
    line-height: var(--omoda-line-height-body);
}