/*
 * Dokumenty parafialne (docs/22): standardy ochrony małoletnich, RODO, regulaminy.
 *
 * Blok zerowania reguł globalnych jest ten sam co w aktualnosci.css i to jest świadome
 * powtórzenie: main.css ustawia style na gołych znacznikach (`article { display: flex }`,
 * `section { padding: 1em }`, `a { display: block; color: white }`, `h2 { text-align: center }`),
 * więc każdy nowy widok musi je odkręcić u siebie. Wspólny arkusz „treści" powstanie przy
 * przepisaniu main.css (docs/10) — do tego czasu dwa moduły, dwa samodzielne pliki,
 * bo sklejanie ich teraz oznaczałoby trzeci arkusz ładowany wszędzie.
 *
 * Dokument prawny czyta się inaczej niż aktualność: liczy się długi tekst, więc kolumna
 * jest węższa (68ch), a odstępy między paragrafami większe.
 */

.dok {
    --dok-granat: #1A68BA;
    --dok-granat-ciemny: #134B87;
    --dok-oliwka: #A4BA07;
    --dok-tekst: #23282d;
    --dok-szary: #5b6670;
    --dok-linia: #dfe3e8;
    --dok-tlo: #f6f8fa;

    font-family: 'Open Sans', sans-serif;
    display: block;
    padding: 1.5em 1em 2.5em;
    color: var(--dok-tekst);
    font-size: 17px;
    line-height: 1.65;
}

/* ── zerowanie reguł globalnych z main.css ─────────────────────── */

.dok article { display: block; }
.dok section { padding: 0; }
.dok a { display: inline; color: inherit; }
/*
 * main.css niesie resztkę stylów rozwijanego menu nałożoną na GOŁE znaczniki listy:
 *     ol      { height: 50px; display: inline-block; line-height: 200% }
 *     ol > li { float: left; width: 150px; height: 50px; border-right: 1px dashed }
 *     ol a    { display: block }
 * Każda lista w treści (także `<ol>` z sanityzowanego HTML-a) dostaje przez to 150 px
 * szerokości i 50 px wysokości, a pływające elementy wpuszczają stopkę na treść.
 * Do czasu przepisania main.css (docs/10) każdy widok musi to zdjąć u siebie.
 */
.dok ol,
.dok ul {
    display: block;
    height: auto;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: inherit;
    line-height: inherit;
}

.dok li {
    float: none;
    width: auto;
    height: auto;
    border: 0;
    line-height: inherit;
}

/* Reguł `ol > li:hover` i `ol > li:first-child` z main.css nie trzeba zdejmować:
   mają (0,1,2), a komponenty niżej (0,2,0) — dwie klasy biją jedną klasę z pseudoklasą.
   Próba ich zerowania kończy się odwrotnie: `.dok ol > li:first-child` to (0,2,2)
   i zdejmuje tło oraz obramowanie WŁASNYM komponentom. */

.dok h1, .dok h2, .dok h3 { margin: 0; line-height: 1.25; text-align: left; }
.dok p { margin: 0; }

.dok__inner { max-width: 980px; margin: 0 auto; }

/* ── nagłówek działu ───────────────────────────────────────────── */

.dok .dok__head {
    background: #fff;
    border-left: 6px solid var(--dok-oliwka);
    padding: 1.2em 1.4em;
    margin-bottom: 1.1em;
}

.dok .dok__head h1 { font-size: 1.75em; font-weight: 700; color: var(--dok-granat); }
.dok .dok__lead { margin-top: .5em; color: var(--dok-szary); max-width: 68ch; }

.dok .dok__intro {
    background: #fff;
    border: 1px solid var(--dok-linia);
    padding: 1.3em 1.5em;
    margin-bottom: 1.1em;
    max-width: none;
}

.dok .dok__intro h2 { font-size: 1.2em; color: var(--dok-granat); margin: 1.2em 0 .35em; }
.dok .dok__intro h2:first-child { margin-top: 0; }
.dok .dok__intro p { margin-bottom: .8em; max-width: 68ch; }
.dok .dok__intro p:last-child { margin-bottom: 0; }
.dok .dok__intro a { color: var(--dok-granat); text-decoration: underline; }
.dok .dok__intro ul { margin: 0 0 .8em 1.3em; }
.dok .dok__intro li { margin-bottom: .25em; }

/* ── lista dokumentów w dziale ─────────────────────────────────── */

.dok .dok__list { list-style: none; display: grid; gap: .8em; }

.dok .dok-item {
    background: #fff;
    border: 1px solid var(--dok-linia);
    border-left: 4px solid var(--dok-granat);
    padding: 1.1em 1.3em 1.2em;
}

.dok .dok-item__head {
    display: flex;
    align-items: baseline;
    gap: .8em;
    flex-wrap: wrap;
}

.dok .dok-item__title { font-size: 1.2em; font-weight: 700; }
.dok .dok-item__title a { color: var(--dok-tekst); }
.dok .dok-item__title a:hover { color: var(--dok-granat); text-decoration: underline; }

.dok .dok-item__odbiorca {
    flex: none;
    padding: .12em .7em;
    background: var(--dok-tlo);
    border: 1px solid var(--dok-linia);
    border-radius: 999px;
    font-size: .8em;
    color: var(--dok-szary);
}

.dok .dok-item__meta {
    margin-top: .25em;
    font-size: .85em;
    color: var(--dok-szary);
}

.dok .dok-item__lead { margin-top: .5em; color: #3d454d; max-width: 68ch; }

.dok .dok-item__akcje {
    margin-top: .9em;
    display: flex;
    flex-wrap: wrap;
    gap: .5em;
}

.dok .dok-btn {
    display: inline-flex;
    align-items: center;
    gap: .6em;
    min-height: 44px;
    padding: .4em 1.1em;
    border: 1px solid var(--dok-granat);
    background: var(--dok-granat);
    color: #fff;
    font-weight: 600;
    font-size: .95em;
}

.dok .dok-btn:hover { background: var(--dok-granat-ciemny); border-color: var(--dok-granat-ciemny); }

.dok .dok-btn--plik {
    background: #fff;
    color: var(--dok-tekst);
    border-color: var(--dok-linia);
}

.dok .dok-btn--plik:hover { background: var(--dok-tlo); border-color: var(--dok-granat); }

.dok .dok-btn__typ {
    flex: none;
    padding: .15em .5em;
    background: var(--dok-granat);
    color: #fff;
    font-size: .76em;
    font-weight: 700;
    letter-spacing: .05em;
}

.dok .dok-btn__rozmiar { color: var(--dok-szary); font-size: .85em; font-weight: 400; }

/* ── pojedynczy dokument ───────────────────────────────────────── */

.dok .dok-entry {
    display: block;
    background: #fff;
    border: 1px solid var(--dok-linia);
    padding: 2em 2.4em 2.4em;
}

.dok .dok-entry__dzial { font-size: .85em; text-transform: uppercase; letter-spacing: .05em; font-weight: 700; }
.dok .dok-entry__dzial a { color: var(--dok-granat); }
.dok .dok-entry__dzial a:hover { text-decoration: underline; }

.dok .dok-entry__title {
    margin: .35em 0 .4em;
    font-size: 1.95em;
    font-weight: 700;
    color: var(--dok-granat);
    max-width: 28ch;
}

.dok .dok-entry__meta { color: var(--dok-szary); font-size: .9em; }
.dok .dok-entry__lead { margin-top: 1em; font-size: 1.1em; color: #3d454d; max-width: 62ch; }

.dok .dok-entry__body { margin-top: 1.8em; max-width: 68ch; }
.dok .dok-entry__body h2 {
    font-size: 1.3em;
    color: var(--dok-granat);
    margin: 2em 0 .5em;
    padding-bottom: .25em;
    border-bottom: 1px solid var(--dok-linia);
}
.dok .dok-entry__body h3 { font-size: 1.1em; margin: 1.5em 0 .35em; }
.dok .dok-entry__body p { margin-bottom: 1em; }
.dok .dok-entry__body ul,
.dok .dok-entry__body ol { margin: 0 0 1em 1.4em; }
.dok .dok-entry__body li { margin-bottom: .4em; }
.dok .dok-entry__body a { color: var(--dok-granat); text-decoration: underline; }
.dok .dok-entry__body blockquote {
    margin: 1.2em 0;
    padding: .3em 0 .3em 1.1em;
    border-left: 4px solid var(--dok-oliwka);
    color: var(--dok-szary);
}
.dok .dok-entry__body table { border-collapse: collapse; width: 100%; margin-bottom: 1em; }
.dok .dok-entry__body th,
.dok .dok-entry__body td { border: 1px solid var(--dok-linia); padding: .45em .7em; text-align: left; vertical-align: top; }

/* ── pliki ─────────────────────────────────────────────────────── */

.dok .dok-files { margin-top: 1.6em; }
.dok .dok-files > h2 { font-size: 1.2em; font-weight: 700; color: var(--dok-granat); margin-bottom: .6em; }
.dok .dok-files ul { list-style: none; }
.dok .dok-files li + li { margin-top: .45em; }

.dok .dok-files a {
    display: flex;
    align-items: center;
    gap: .9em;
    min-height: 44px;
    padding: .55em .9em;
    border: 1px solid var(--dok-linia);
    background: var(--dok-tlo);
}

.dok .dok-files a:hover { border-color: var(--dok-granat); background: #eef3fa; }

.dok .dok-files__typ {
    flex: none;
    min-width: 3.8em;
    text-align: center;
    padding: .2em .45em;
    background: var(--dok-granat);
    color: #fff;
    font-size: .78em;
    font-weight: 700;
    letter-spacing: .05em;
}

.dok .dok-files__nazwa { flex: 1; font-weight: 600; }
.dok .dok-files__rozmiar { flex: none; color: var(--dok-szary); font-size: .88em; }

/* ── spis działów, nawigacja, komunikaty ───────────────────────── */

.dok .dok__dzialy { list-style: none; display: grid; gap: .7em; }

.dok .dok__dzialy a {
    display: grid;
    gap: .2em;
    padding: 1.1em 1.3em;
    background: #fff;
    border: 1px solid var(--dok-linia);
    border-left: 4px solid var(--dok-granat);
}

.dok .dok__dzialy a:hover { border-color: var(--dok-granat); }
.dok .dok__dzial-nazwa { font-size: 1.15em; font-weight: 700; color: var(--dok-granat); }
.dok .dok__dzial-opis { color: var(--dok-szary); }
.dok .dok__dzial-ile { font-size: .85em; color: var(--dok-szary); }

.dok .dok__inne {
    margin-top: 1.5em;
    background: #fff;
    border: 1px solid var(--dok-linia);
    padding: 1.1em 1.3em;
}

.dok .dok__inne h2 { font-size: 1.05em; font-weight: 700; color: var(--dok-szary); margin-bottom: .4em; }
.dok .dok__inne ul { list-style: none; display: flex; flex-wrap: wrap; gap: .5em 1.4em; }
.dok .dok__inne a { color: var(--dok-granat); font-weight: 600; }
.dok .dok__inne a:hover { text-decoration: underline; }

.dok .dok__empty {
    background: #fff;
    border: 1px solid var(--dok-linia);
    padding: 1.2em 1.3em;
}

.dok .dok__empty a { color: var(--dok-granat); text-decoration: underline; }

.dok .dok__back { margin-top: 1em; }

.dok .dok__back a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0 1.2em;
    background: #fff;
    border: 1px solid var(--dok-linia);
    color: var(--dok-granat);
    font-weight: 600;
}

.dok .dok__back a:hover { border-color: var(--dok-granat); }

@media (max-width: 720px) {
    .dok { padding: 1em .7em 2em; font-size: 16px; }
    .dok .dok-entry { padding: 1.3em 1.1em 1.8em; }
    .dok .dok-entry__title { font-size: 1.5em; max-width: none; }
    .dok .dok-files a, .dok .dok-btn { flex-wrap: wrap; }
}