/* ==================================================
   BIP MDK – WŁASNE STYLE
   ================================================== */

:root {
    --bip-red: #b5121b;
    --bip-dark-red: #8f0e15;
    --bip-text: #202124;
    --bip-gray: #6b7280;
    --bip-light: #f5f6f7;
    --bip-border: #d9dde2;
    --bip-white: #ffffff;
}


/* ==================================================
   NAGŁÓWEK BIP
   ================================================== */

.container-header {
    position: relative;
    overflow: hidden;
    background: var(--bip-white);
    background-image: none;
    min-height: 0;
    padding: 0;
    border-bottom: 5px solid var(--bip-red);
    box-shadow: none;
}


/* ORZEŁ W TLE */

.container-header::before {
    content: "";
    position: absolute;
    top: 0;

    right: max(90px, calc((100vw - 1650px) / 2 + 90px));

    width: 340px;
    height: 100%;

    background-image: url("/bip/images/BIP/orzel-bip.png");
    background-repeat: no-repeat;

    /* Orzeł ustawiony niżej i wyśrodkowany pionowo */
    background-position: right center;
    background-size: contain;

    /* Minimalnie wyraźniejszy */
    opacity: 0.48;

    pointer-events: none;
    z-index: 0;
}


/* LOGO + TEKST */

.container-header .navbar-brand {
    position: relative;
    z-index: 1;

    display: flex;
    align-items: center;

    gap: 0;

    padding: 22px 0;
    margin: 0;
}


/* LOGO BIP */

.container-header .navbar-brand img {
    display: block;

    width: auto;
    height: 108px;
    max-width: 135px;

    object-fit: contain;
    flex: 0 0 auto;
}

.container-header .navbar-brand::after {
    content: none;
}


/* ==================================================
   TEKST W NAGŁÓWKU
   ================================================== */

.container-header .site-description {
    color: var(--bip-text);

    margin: 0 0 0 28px;
    padding: 3px 0 3px 28px;

    border-left: 2px solid var(--bip-red);

    font-size: 0;
    font-weight: 400;
    line-height: 1.4;
}


/* DUŻY NAPIS BIP */

.container-header .site-description::before {
    content: "Biuletyn Informacji Publicznej";

    display: block;

    color: var(--bip-text);

    font-size: 2.35rem;
    font-weight: 700;
    line-height: 1.15;

    margin-bottom: 10px;
}


/* NAZWA PLACÓWKI – DWA WIERSZE */

.container-header .site-description::after {
    content: "Młodzieżowy Dom Kultury im. dr. H. Jordana\A w Siemianowicach Śląskich";

    display: block;

    white-space: pre-line;

    color: var(--bip-text);

    font-size: 1.15rem;
    font-weight: 400;
    line-height: 1.45;
}


.container-header .site-title {
    display: none;
}

.container-header a {
    color: var(--bip-text);
    text-decoration: none;
}


/* ==================================================
   STRONA I TREŚĆ
   ================================================== */

body {
    color: var(--bip-text);
    background: var(--bip-white);
}

main {
    background: var(--bip-white);
}


/* OKRUSZKI */

.breadcrumb {
    background: var(--bip-light);
    border-radius: 0;

    padding: 12px 16px;
    margin-bottom: 24px;
}


/* NAGŁÓWKI */

h1,
h2,
h3 {
    color: var(--bip-text);
}


/* LINKI */

a {
    color: var(--bip-dark-red);
}

a:hover,
a:focus {
    color: var(--bip-red);
}


/* ==================================================
   LEWA KOLUMNA
   ================================================== */

.container-sidebar-left {
    align-self: start;
}

.container-sidebar-left .sidebar-left.card {
    border: 1px solid var(--bip-border);
    border-radius: 3px;

    overflow: hidden;

    background: #ffffff;

    box-shadow: none;
}


/* ==================================================
   NAGŁÓWKI MODUŁÓW
   ================================================== */

.container-sidebar-left .sidebar-left.card > h3.card-header {
    margin: 0 !important;
    padding: 14px 18px !important;

    background-color: var(--bip-red) !important;
    background-image: none !important;

    color: #ffffff !important;

    border: 0 !important;
    border-bottom: 1px solid var(--bip-dark-red) !important;

    font-size: 1.35rem;
    font-weight: 700;
    line-height: 1.2;
}

.container-sidebar-left .sidebar-left.card > .card-body {
    padding: 0;
}


/* ==================================================
   MENU BIP
   ================================================== */

#mod-menu110 {
    display: block !important;

    width: 100%;

    margin: 0 !important;
    padding: 0 !important;

    list-style: none !important;
}


/* GŁÓWNE WIERSZE */

#mod-menu110 > li {
    display: block;

    width: 100%;

    margin: 0 !important;
    padding: 0 !important;

    border-bottom: 1px solid #d7d7d7 !important;
}

#mod-menu110 > li:last-child {
    border-bottom: 0 !important;
}


/* STRONA GŁÓWNA */

#mod-menu110 > li > a {
    display: flex !important;

    align-items: center !important;
    justify-content: space-between !important;

    width: 100% !important;
    min-height: 44px !important;

    padding: 11px 14px !important;
    margin: 0 !important;

    background: #f2f2f2 !important;
    background-image: none !important;

    color: #222222 !important;

    border: 0 !important;
    border-radius: 0 !important;

    font-family: inherit;
    font-size: 0.98rem;
    font-weight: 400;
    line-height: 1.25;

    text-align: left;
    text-decoration: none !important;
}


/* ROZWIJANE POZYCJE */

#mod-menu110 > li > button.mod-menu__toggle-sub {
    display: flex !important;

    align-items: center !important;
    justify-content: space-between !important;

    width: 100% !important;
    min-height: 44px !important;

    padding: 11px 14px !important;
    margin: 0 !important;

    background: #f2f2f2 !important;
    background-image: none !important;

    color: #222222 !important;

    border: 0 !important;
    border-radius: 0 !important;

    font: inherit !important;
    text-align: left !important;
}


/* TEKST W MENU */

#mod-menu110 .mod-menu__heading {
    color: inherit !important;
    font-weight: 400 !important;
}


/* STRZAŁKI */

#mod-menu110 > li >
button.mod-menu__toggle-sub
.icon-chevron-down {
    margin-left: auto !important;
    color: #333333 !important;
}


/* HOVER */

#mod-menu110 > li > a:hover,
#mod-menu110 > li > a:focus,
#mod-menu110 > li >
button.mod-menu__toggle-sub:hover,
#mod-menu110 > li >
button.mod-menu__toggle-sub:focus {

    background: #e4e4e4 !important;

    color: var(--bip-dark-red) !important;
}


/* AKTYWNA POZYCJA */

#mod-menu110 > li.current > a,
#mod-menu110 > li.active > a,
#mod-menu110 > li.current >
button.mod-menu__toggle-sub,
#mod-menu110 > li.active >
button.mod-menu__toggle-sub {

    background: var(--bip-red) !important;
    color: #ffffff !important;
}


/* BIAŁA STRZAŁKA AKTYWNEJ POZYCJI */

#mod-menu110 > li.current >
button.mod-menu__toggle-sub
.icon-chevron-down,

#mod-menu110 > li.active >
button.mod-menu__toggle-sub
.icon-chevron-down {

    color: #ffffff !important;
}


/* STRONA GŁÓWNA NIE JEST CZERWONA */

#mod-menu110 > li.default.current > a,
#mod-menu110 > li.default.active > a {

    background: #f2f2f2 !important;
    color: #222222 !important;
}


/* ==================================================
   PODMENU
   ================================================== */

#mod-menu110 ul.mod-menu__sub {
    width: 100%;

    margin: 0 !important;
    padding: 0 !important;

    list-style: none !important;

    background: #ffffff !important;
}

#mod-menu110 ul.mod-menu__sub > li {
    margin: 0 !important;
    padding: 0 !important;

    border-top: 1px solid #ededed !important;
}

#mod-menu110 ul.mod-menu__sub > li > a {
    display: block !important;

    padding: 10px 14px 10px 28px !important;

    background: #ffffff !important;
    color: #333333 !important;

    font-size: 0.92rem;
    line-height: 1.3;

    text-decoration: none !important;
}

#mod-menu110 ul.mod-menu__sub > li > a:hover,
#mod-menu110 ul.mod-menu__sub > li > a:focus {

    background: #f7f7f7 !important;
    color: var(--bip-red) !important;
}

#mod-menu110 ul.mod-menu__sub > li.current > a,
#mod-menu110 ul.mod-menu__sub > li.active > a {

    color: var(--bip-red) !important;

    font-weight: 700 !important;

    border-left: 4px solid var(--bip-red) !important;

    padding-left: 24px !important;
}


/* ==================================================
   WYSZUKIWARKA
   ================================================== */

.container-sidebar-left .mod-finder,
.container-sidebar-left .mod-finder__search {
    width: 100%;
}

.container-sidebar-left .mod-finder {
    padding: 16px;
}


/* POLE SZUKANIA */

.container-sidebar-left .mod-finder input[type="text"],
.container-sidebar-left .mod-finder input[type="search"] {

    border: 1px solid var(--bip-red) !important;

    border-radius: 4px 0 0 4px !important;
}


/* PRZYCISK SZUKAJ */

.container-sidebar-left .mod-finder button,
.container-sidebar-left .mod-finder .btn {

    background: var(--bip-red) !important;
    background-image: none !important;

    border-color: var(--bip-red) !important;

    color: #ffffff !important;
}

.container-sidebar-left .mod-finder button:hover,
.container-sidebar-left .mod-finder button:focus,
.container-sidebar-left .mod-finder .btn:hover,
.container-sidebar-left .mod-finder .btn:focus {

    background: var(--bip-dark-red) !important;

    border-color: var(--bip-dark-red) !important;

    color: #ffffff !important;
}


/* ==================================================
   GÓRNY PASEK DOSTĘPNOŚCI
   ================================================== */

.container-topbar {
    background: #f1f1f1 !important;

    min-height: 38px;

    padding: 0 !important;
}

.container-topbar .mod-custom {
    width: 100%;
}

.bip-accessibility-tools {
    display: flex;

    align-items: center;
    justify-content: flex-end;

    gap: 10px;

    max-width: 1650px;

    margin: 0 auto;

    padding: 7px 24px;

    font-size: 0.9rem;
    line-height: 1;
}

.bip-accessibility-label {
    color: #222222;

    margin-right: 2px;
}


/* PRZYCISKI BEZ KWADRATÓW */

.bip-accessibility-btn {
    appearance: none;
    -webkit-appearance: none;

    background: transparent !important;
    background-image: none !important;

    border: 0 !important;
    border-radius: 0 !important;

    box-shadow: none !important;

    padding: 3px 4px !important;
    margin: 0 !important;

    color: #111111 !important;

    font-family: inherit;
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1;

    cursor: pointer;
}


/* KÓŁKA KONTRASTU */

.bip-contrast-light,
.bip-contrast-dark {
    font-size: 1.05rem;
}


/* ROZMIARY SYMBOLI A */

.bip-font-smaller {
    font-size: 0.8rem;
}

.bip-font-reset {
    font-size: 0.95rem;
}

.bip-font-larger {
    font-size: 1.1rem;
}


/* SEPARATOR */

.bip-accessibility-separator {
    color: #777777;

    margin: 0 2px;
}


/* HOVER */

.bip-accessibility-btn:hover {
    color: var(--bip-red) !important;
}


/* FOKUS */

.bip-accessibility-btn:focus-visible {
    outline: 2px solid var(--bip-red) !important;
    outline-offset: 2px;
}


/* ==================================================
   ZMIANA WIELKOŚCI TEKSTU
   ================================================== */

/* A− */
body.bip-font-small {
    font-size: 95%;
}

/* A+ – pierwsze kliknięcie */
body.bip-font-large {
    font-size: 107%;
}

/* A+ – drugie kliknięcie */
body.bip-font-xlarge {
    font-size: 115%;
}


/* ==================================================
   WYSOKI KONTRAST
   ================================================== */

body.bip-high-contrast {
    background: #000000 !important;
    color: #ffffff !important;
}


/* GŁÓWNE OBSZARY */

body.bip-high-contrast .container-topbar,
body.bip-high-contrast .container-header,
body.bip-high-contrast .site-grid,
body.bip-high-contrast .container-component,
body.bip-high-contrast .container-sidebar-left,
body.bip-high-contrast main,
body.bip-high-contrast .card,
body.bip-high-contrast .card-body,
body.bip-high-contrast .breadcrumb {

    background: #000000 !important;
    color: #ffffff !important;
}


/* ==================================================
   NAGŁÓWEK W WYSOKIM KONTRAŚCIE
   ================================================== */

body.bip-high-contrast
.container-header .site-description {

    color: #ffffff !important;

    border-left-color: #ffff00 !important;
}

body.bip-high-contrast
.container-header .site-description::before {

    color: #ffffff !important;
}

body.bip-high-contrast
.container-header .site-description::after {

    color: #ffffff !important;
}


/* CZERWONA LINIA ZAMIENIA SIĘ NA ŻÓŁTĄ */

body.bip-high-contrast .container-header {
    border-bottom-color: #ffff00 !important;
}


/* ORZEŁ W KONTRAŚCIE */

body.bip-high-contrast .container-header::before {
    opacity: 0.65;
}


/* ==================================================
   TEKST W KONTRAŚCIE
   ================================================== */

body.bip-high-contrast h1,
body.bip-high-contrast h2,
body.bip-high-contrast h3,
body.bip-high-contrast h4,
body.bip-high-contrast h5,
body.bip-high-contrast h6,
body.bip-high-contrast p,
body.bip-high-contrast li,
body.bip-high-contrast label,
body.bip-high-contrast strong {

    color: #ffffff !important;
}


/* LINKI – ŻÓŁTE */

body.bip-high-contrast a {
    color: #ffff00 !important;
    text-decoration: underline;
}

body.bip-high-contrast a:hover,
body.bip-high-contrast a:focus {
    color: #00ffff !important;
}


/* ==================================================
   PASEK DOSTĘPNOŚCI W KONTRAŚCIE
   ================================================== */

body.bip-high-contrast .bip-accessibility-label,
body.bip-high-contrast .bip-accessibility-separator {

    color: #ffffff !important;
}

body.bip-high-contrast .bip-accessibility-btn {

    color: #ffff00 !important;
}

body.bip-high-contrast .bip-accessibility-btn:hover,
body.bip-high-contrast .bip-accessibility-btn:focus {

    color: #00ffff !important;
}


/* ==================================================
   MENU W WYSOKIM KONTRAŚCIE
   ================================================== */

body.bip-high-contrast
.container-sidebar-left
.sidebar-left.card {

    border-color: #ffffff !important;
    background: #000000 !important;
}


/* NAGŁÓWEK MENU I WYSZUKIWARKI */

body.bip-high-contrast
.container-sidebar-left
.sidebar-left.card > h3.card-header {

    background: #000000 !important;

    color: #ffff00 !important;

    border: 1px solid #ffffff !important;
}


/* GŁÓWNE POZYCJE MENU */

body.bip-high-contrast
#mod-menu110 > li > a,

body.bip-high-contrast
#mod-menu110 > li >
button.mod-menu__toggle-sub {

    background: #000000 !important;

    color: #ffffff !important;

    border-bottom: 1px solid #ffffff !important;
}


/* STRONA GŁÓWNA */

body.bip-high-contrast
#mod-menu110 > li.default.current > a,

body.bip-high-contrast
#mod-menu110 > li.default.active > a {

    background: #000000 !important;

    color: #ffff00 !important;
}


/* STRZAŁKI */

body.bip-high-contrast
#mod-menu110 .icon-chevron-down {

    color: #ffffff !important;
}


/* HOVER MENU */

body.bip-high-contrast
#mod-menu110 > li > a:hover,

body.bip-high-contrast
#mod-menu110 > li > a:focus,

body.bip-high-contrast
#mod-menu110 > li >
button.mod-menu__toggle-sub:hover,

body.bip-high-contrast
#mod-menu110 > li >
button.mod-menu__toggle-sub:focus {

    background: #222222 !important;

    color: #ffff00 !important;
}


/* PODMENU */

body.bip-high-contrast
#mod-menu110 ul.mod-menu__sub {

    background: #000000 !important;
}

body.bip-high-contrast
#mod-menu110 ul.mod-menu__sub > li > a {

    background: #000000 !important;

    color: #ffff00 !important;

    border-bottom: 1px solid #ffffff !important;
}


/* ==================================================
   WYSZUKIWARKA W KONTRAŚCIE
   ================================================== */

body.bip-high-contrast
.container-sidebar-left .mod-finder {

    background: #000000 !important;

    color: #ffffff !important;
}

body.bip-high-contrast
.container-sidebar-left .mod-finder input {

    background: #000000 !important;

    color: #ffffff !important;

    border: 2px solid #ffffff !important;
}

body.bip-high-contrast
.container-sidebar-left .mod-finder button,

body.bip-high-contrast
.container-sidebar-left .mod-finder .btn {

    background: #ffff00 !important;

    color: #000000 !important;

    border-color: #ffff00 !important;
}


/* ==================================================
   FOKUS KLAWIATURY
   ================================================== */

.container-sidebar-left .mod-finder input:focus,
.container-sidebar-left .mod-finder select:focus,
#mod-menu110 a:focus,
#mod-menu110 button:focus {

    outline: 3px solid rgba(181, 18, 27, 0.28) !important;

    outline-offset: 2px;
}

body.bip-high-contrast a:focus,
body.bip-high-contrast button:focus,
body.bip-high-contrast input:focus {

    outline: 3px solid #00ffff !important;

    outline-offset: 3px;
}


/* ==================================================
   MOBILE
   ================================================== */

@media (max-width: 768px) {

    .container-header::before {
        right: 16px;

        width: 190px;

        opacity: 0.17;
    }

    .container-header .navbar-brand {
        padding: 16px;

        align-items: center;
    }

    .container-header .navbar-brand img {
        height: 64px;

        max-width: 80px;
    }

    .container-header .site-description {
        margin-left: 16px;

        padding-left: 16px;
    }

    .container-header .site-description::before {
        font-size: 1.45rem;

        line-height: 1.2;

        margin-bottom: 6px;
    }

    .container-header .site-description::after {
        font-size: 0.88rem;

        line-height: 1.4;
    }

    .container-sidebar-left {
        width: 100%;
    }

    .bip-accessibility-tools {
        justify-content: center;

        flex-wrap: wrap;

        gap: 8px;

        padding: 7px 12px;
    }

    body.bip-high-contrast .container-header::before {
        opacity: 0.35;
    }
}

/* ==================================================
   DELIKATNA FLAGA POLSKI ZA ORŁEM
   ================================================== */

.container-header::after {
    content: "";
    position: absolute;

    /* prawa strona nagłówka */
    right: 15px;
    bottom: 0;

    /* flaga nieco szersza od orła */
    width: 500px;
    height: 175px;

    background-image: url("/bip/images/BIP/flaga-bip.png");
    background-repeat: no-repeat;
    background-position: right center;
    background-size: contain;

    /* delikatność flagi */
    opacity: 0.38;

    pointer-events: none;

    /* flaga ZA orłem */
    z-index: 0;
}


/* ORZEŁ ZOSTAJE NAD FLAGĄ */

.container-header::before {
    z-index: 1;
}


/* LOGO I NAPISY ZOSTAJĄ NA WIERZCHU */

.container-header .navbar-brand {
    z-index: 2;
}


/* W WYSOKIM KONTRAŚCIE USUWAMY DEKORACJĘ */

body.bip-high-contrast .container-header::after {
    display: none;
}


/* NA TELEFONIE FLAGI NIE POKAZUJEMY */

@media (max-width: 768px) {

    .container-header::after {
        display: none;
    }
}

/* ==================================================
   KOREKTA FLAGI ZA ORŁEM
   ================================================== */

.container-header::after {
    /* przesunięcie flagi trochę w lewo */
    right: 45px !important;

    /* obniżenie flagi */
    bottom: -38px !important;

    /* zachowujemy delikatny rozmiar */
    width: 500px !important;
    height: 175px !important;

    background-image: url("/bip/images/BIP/flaga-bip.png") !important;
    background-repeat: no-repeat !important;
    background-position: right center !important;
    background-size: contain !important;

    /* trochę bardziej wyraźna */
    opacity: 0.52 !important;

    /* flaga pozostaje ZA orłem */
    z-index: 0 !important;

    pointer-events: none;
}

/* ORZEŁ – NIE PRZESUWAMY GO */
.container-header::before {
    z-index: 1 !important;
}

/* napisy i logo pozostają na wierzchu */
.container-header .navbar-brand {
    z-index: 2 !important;
}

/* w trybie kontrastowym dekoracja znika */
body.bip-high-contrast .container-header::after {
    display: none !important;
}

/* na telefonie bez flagi */
@media (max-width: 768px) {
    .container-header::after {
        display: none !important;
    }
}

/* ==================================================
   STRONA GŁÓWNA BIP – DANE PODMIOTU
   układ zgodny z pierwotną wizualizacją
   ================================================== */

.bip-home {
    max-width: 1050px;
}

.bip-home h1 {
    margin-top: 0;
    margin-bottom: 6px;

    font-size: 2rem;
    font-weight: 700;
    line-height: 1.2;
}

.bip-home-subtitle {
    margin: 0 0 26px 0;

    font-size: 1.2rem;
    line-height: 1.45;
}

.bip-home-intro {
    max-width: 900px;

    margin-bottom: 30px;

    font-size: 1.05rem;
    line-height: 1.65;
}


/* poziomy separator jak w wizualizacji */

.bip-home-divider {
    border: 0;
    border-top: 1px solid #d9dde2;

    margin: 34px 0 30px 0;
}


/* DANE PODMIOTU */

.bip-home h2 {
    margin: 0 0 20px 0;

    font-size: 1.7rem;
    font-weight: 700;
}


/* dwie kolumny */

.bip-entity-data {
    display: grid;
    grid-template-columns: 1fr 1fr;

    gap: 0;

    max-width: 850px;
}


/* wspólne ustawienia kolumn */

.bip-entity-column {
    min-width: 0;

    font-size: 1rem;
    line-height: 1.55;
}

.bip-entity-column p {
    margin-top: 0;
    margin-bottom: 14px;
}


/* LEWA KOLUMNA */

.bip-entity-address {
    padding-right: 42px;
}


/* PRAWA KOLUMNA
   pionowa linia pomiędzy kolumnami */

.bip-entity-contact {
    padding-left: 42px;

    border-left: 1px solid #d2d6da;
}


/* odstęp przed NIP i REGON */

.bip-entity-numbers {
    margin-top: 20px !important;
}


/* linki */

.bip-entity-data a {
    color: var(--bip-dark-red);
    text-decoration: underline;
}

.bip-entity-data a:hover,
.bip-entity-data a:focus {
    color: var(--bip-red);
}


/* ==================================================
   WYSOKI KONTRAST
   ================================================== */

body.bip-high-contrast .bip-home-divider {
    border-top-color: #ffffff;
}

body.bip-high-contrast .bip-entity-contact {
    border-left-color: #ffffff;
}

body.bip-high-contrast .bip-entity-data a {
    color: #ffff00 !important;
}


/* ==================================================
   TELEFON / TABLET
   ================================================== */

@media (max-width: 768px) {

    .bip-home h1 {
        font-size: 1.65rem;
    }

    .bip-home-subtitle {
        font-size: 1.05rem;
    }

    .bip-entity-data {
        grid-template-columns: 1fr;
    }

    .bip-entity-address {
        padding-right: 0;
        padding-bottom: 20px;
    }

    .bip-entity-contact {
        padding-left: 0;
        padding-top: 20px;

        border-left: 0;
        border-top: 1px solid #d2d6da;
    }

    body.bip-high-contrast .bip-entity-contact {
        border-top-color: #ffffff;
    }
}

/* ==================================================
   STRONA GŁÓWNA – JUSTOWANIE TEKSTU
   ================================================== */

.bip-home-intro {
    text-align: justify;
    text-justify: inter-word;
}

/* Na telefonie pozostawiamy wyrównanie do lewej,
   ponieważ jest czytelniejsze na wąskim ekranie */

@media (max-width: 768px) {
    .bip-home-intro {
        text-align: left;
    }
}

/* ==================================================
   STOPKA BIP
   ================================================== */

/* tło całej stopki */
.container-footer {
    background: #b5121b !important;
    background-image: none !important;

    color: #ffffff !important;

    margin-top: 45px;
    padding: 0 !important;

    border-top: 5px solid #8f0e15;
}


/* moduł stopki */
.container-footer .mod-custom {
    width: 100%;
}


/* główna zawartość */
.bip-footer-content {
    width: 100%;
    max-width: 1650px;

    margin: 0 auto;
    padding: 36px 32px 20px;

    color: #ffffff;
}


/* ==================================================
   TRZY KOLUMNY
   ================================================== */

.bip-footer-columns {
    display: grid;

    grid-template-columns:
        minmax(280px, 1.2fr)
        minmax(240px, 1fr)
        minmax(240px, 1fr);

    gap: 55px;

    align-items: start;
}


/* każda kolumna */
.bip-footer-column {
    min-width: 0;
}


/* nagłówki */
.bip-footer-column h2 {
    color: #ffffff !important;

    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.25;

    margin: 0 0 16px 0;
}


/* tekst */
.bip-footer-column p {
    color: #ffffff !important;

    margin: 0 0 14px 0;

    line-height: 1.6;
}


/* ==================================================
   LINKI
   ================================================== */

.bip-footer-content a {
    color: #ffffff !important;

    text-decoration: underline;
    text-underline-offset: 3px;
}

.bip-footer-content a:hover,
.bip-footer-content a:focus {
    color: #ffffff !important;

    text-decoration-thickness: 2px;
}


/* lista linków */
.bip-footer-links {
    list-style: none;

    margin: 0;
    padding: 0;
}

.bip-footer-links li {
    margin: 0 0 9px 0;

    padding: 0;

    color: #ffffff !important;
}


/* ==================================================
   DOLNY PASEK STOPKI
   ================================================== */

.bip-footer-bottom {
    margin-top: 30px;
    padding-top: 18px;

    border-top: 1px solid rgba(255, 255, 255, 0.45);
}

.bip-footer-bottom p {
    margin: 0;

    color: #ffffff !important;

    font-size: 0.9rem;
}


/* ==================================================
   FOKUS KLAWIATURY
   ================================================== */

.bip-footer-content a:focus-visible {
    outline: 3px solid #ffffff;
    outline-offset: 3px;
}


/* ==================================================
   WYSOKI KONTRAST
   ================================================== */

body.bip-high-contrast .container-footer {
    background: #000000 !important;

    border-top-color: #ffff00 !important;
}

body.bip-high-contrast .bip-footer-content,
body.bip-high-contrast .bip-footer-column h2,
body.bip-high-contrast .bip-footer-column p,
body.bip-high-contrast .bip-footer-bottom p {
    color: #ffffff !important;
}

body.bip-high-contrast .bip-footer-content a {
    color: #ffff00 !important;
}

body.bip-high-contrast .bip-footer-bottom {
    border-top-color: #ffffff;
}


/* ==================================================
   TABLET
   ================================================== */

@media (max-width: 1000px) {

    .bip-footer-columns {
        grid-template-columns: 1fr 1fr;

        gap: 32px 40px;
    }
}


/* ==================================================
   TELEFON
   ================================================== */

@media (max-width: 768px) {

    .container-footer {
        margin-top: 30px;
    }

    .bip-footer-content {
        padding: 28px 20px 18px;
    }

    .bip-footer-columns {
        grid-template-columns: 1fr;

        gap: 28px;
    }

    .bip-footer-bottom {
        margin-top: 25px;
    }
}

/* ==================================================
   STOPKA BIP – KOMPAKTOWE PROPORCJE
   ================================================== */

.bip-footer-content {
    max-width: 1500px !important;
    margin: 0 auto !important;

    /* dużo niższa stopka */
    padding: 24px 40px 14px !important;
}


/* kolumny bliżej siebie */
.bip-footer-columns {
    display: grid !important;

    grid-template-columns:
        minmax(300px, 1.15fr)
        minmax(300px, 1fr)
        minmax(260px, 0.9fr) !important;

    column-gap: 45px !important;
    row-gap: 20px !important;

    align-items: start !important;
}


/* mniejsze nagłówki i odstępy */
.bip-footer-column h2 {
    margin: 0 0 10px 0 !important;

    font-size: 1.15rem !important;
    line-height: 1.25 !important;
}


/* ciaśniejszy tekst */
.bip-footer-column p {
    margin: 0 0 9px 0 !important;
    line-height: 1.45 !important;
}


/* ciaśniejsze linki */
.bip-footer-links li {
    margin-bottom: 6px !important;
}


/* dolna część stopki */
.bip-footer-bottom {
    margin-top: 18px !important;
    padding-top: 12px !important;
}

.bip-footer-bottom p {
    margin: 0 !important;
    font-size: 0.85rem !important;
}


/* ==================================================
   TABLET
   ================================================== */

@media (max-width: 1000px) {

    .bip-footer-content {
        padding: 22px 25px 14px !important;
    }

    .bip-footer-columns {
        grid-template-columns: 1fr 1fr !important;
        gap: 25px 35px !important;
    }
}


/* ==================================================
   TELEFON
   ================================================== */

@media (max-width: 768px) {

    .bip-footer-content {
        padding: 22px 20px 14px !important;
    }

    .bip-footer-columns {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    .bip-footer-bottom {
        margin-top: 16px !important;
        padding-top: 10px !important;
    }
}

/* ==================================================
   STOPKA BIP – ZMNIEJSZENIE WYSOKOŚCI
   ================================================== */

/* usuwa duży odstęp u góry i na dole stopki */
.bip-footer-content {
    padding-top: 12px !important;
    padding-bottom: 10px !important;
}

/* nagłówki bliżej górnej krawędzi */
.bip-footer-column h2 {
    margin-top: 0 !important;
    margin-bottom: 8px !important;
}

/* ciaśniejsze odstępy w treści */
.bip-footer-column p {
    margin-top: 0 !important;
    margin-bottom: 7px !important;
    line-height: 1.4 !important;
}

.bip-footer-links li {
    margin-bottom: 5px !important;
}

/* copyright bliżej górnej części stopki */
.bip-footer-bottom {
    margin-top: 12px !important;
    padding-top: 9px !important;
}

/* ==================================================
   USUNIĘCIE DOMYŚLNEJ LUKI CASSIOPEI W STOPCE
   ================================================== */

.container-footer .grid-child {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* nasza właściwa stopka */
.bip-footer-content {
    padding-top: 14px !important;
    padding-bottom: 10px !important;
}

/* STOPKA – mniejszy napis na samym dole */

.bip-footer-bottom p {
    font-size: 0.75rem !important;
    line-height: 1.3 !important;
}

/* STOPKA – mniejsza czcionka */

.bip-footer-column {
    font-size: 0.88rem !important;
}

.bip-footer-column h2 {
    font-size: 1rem !important;
}

.bip-footer-column p,
.bip-footer-column li,
.bip-footer-column a {
    font-size: 0.88rem !important;
}

/* =========================================================
   BIP – KONTROLE
   ========================================================= */

.bip-kontrole {
    width: 100%;
    max-width: 1200px;
}

.bip-kontrole > h2 {
    margin-top: 38px;
    margin-bottom: 18px;
}

.bip-kontrole > h2:first-of-type {
    margin-top: 24px;
}

/* Tabele kontroli */
.bip-kontrole table {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    margin: 0 0 42px 0;
    font-size: 0.96rem;
    line-height: 1.45;
}

/* Stałe szerokości kolumn – takie same w każdym roku */
.bip-kontrole th:nth-child(1),
.bip-kontrole td:nth-child(1) {
    width: 29%;
}

.bip-kontrole th:nth-child(2),
.bip-kontrole td:nth-child(2) {
    width: 40%;
}

.bip-kontrole th:nth-child(3),
.bip-kontrole td:nth-child(3) {
    width: 17%;
}

.bip-kontrole th:nth-child(4),
.bip-kontrole td:nth-child(4) {
    width: 14%;
}

/* Nagłówki tabel */
.bip-kontrole th {
    padding: 11px 14px;
    text-align: left;
    vertical-align: top;
    font-weight: 700;
    background: #f1f2f3;
    border-top: 2px solid #b5121b;
    border-bottom: 1px solid #cfd3d7;
}

/* Komórki */
.bip-kontrole td {
    padding: 12px 14px;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid #dfe2e5;
    overflow-wrap: break-word;
    word-break: normal;
}

/* Delikatne wyróżnienie kolejnych wierszy */
.bip-kontrole tbody tr:nth-child(even) {
    background: #fafafa;
}

/* Numery protokołów – nie rozciągamy ich niepotrzebnie */
.bip-kontrole td:nth-child(3) {
    font-variant-numeric: tabular-nums;
}

/* Notatki pod tabelą */
.bip-kontrole table + p {
    margin-top: -26px;
    margin-bottom: 38px;
}

/* Wysoki kontrast */
body.bip-high-contrast .bip-kontrole th {
    background: #000000 !important;
    color: #ffffff !important;
    border-top-color: #ffff00 !important;
    border-bottom-color: #ffffff !important;
}

body.bip-high-contrast .bip-kontrole td {
    background: #000000 !important;
    color: #ffffff !important;
    border-bottom-color: #ffffff !important;
}

body.bip-high-contrast .bip-kontrole tbody tr:nth-child(even) {
    background: #000000 !important;
}

/* Telefon i mniejsze ekrany */
@media (max-width: 900px) {

    .bip-kontrole table {
        table-layout: auto;
        display: block;
        overflow-x: auto;
        width: 100%;
        min-width: 850px;
        -webkit-overflow-scrolling: touch;
    }

    .bip-kontrole th,
    .bip-kontrole td {
        padding: 10px 12px;
    }

    .bip-kontrole > h2 {
        margin-top: 32px;
    }
}

/* =========================================================
   BIP – KONTROLE – OSTATECZNE SZEROKOŚCI KOLUMN
   ========================================================= */

.bip-kontrole .bip-controls-table {
    width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse;
}

/* 1. Organ kontrolujący */
.bip-kontrole .bip-controls-table th:nth-child(1),
.bip-kontrole .bip-controls-table td:nth-child(1) {
    width: 29% !important;
}

/* 2. Zakres kontroli */
.bip-kontrole .bip-controls-table th:nth-child(2),
.bip-kontrole .bip-controls-table td:nth-child(2) {
    width: 34% !important;
}

/* 3. Nr protokołu / sprawy */
.bip-kontrole .bip-controls-table th:nth-child(3),
.bip-kontrole .bip-controls-table td:nth-child(3) {
    width: 17% !important;
}

/* 4. Wnioski / zalecenia */
.bip-kontrole .bip-controls-table th:nth-child(4),
.bip-kontrole .bip-controls-table td:nth-child(4) {
    width: 20% !important;
}

/* =========================================================
   BIP – REJESTRY I EWIDENCJE
   ========================================================= */

.bip-rejestry {
    width: 100%;
    max-width: 1100px;
}

.bip-rejestry h1 {
    margin-top: 0;
    margin-bottom: 18px;
}

.bip-rejestry h2 {
    margin-top: 32px;
    margin-bottom: 14px;
}

.bip-rejestry p {
    margin-top: 0;
    margin-bottom: 20px;
    line-height: 1.65;
}

.bip-rejestry-intro {
    max-width: 1000px;
    text-align: justify;
    text-justify: inter-word;
}

.bip-rejestry ul {
    margin-top: 6px;
    margin-bottom: 28px;
    padding-left: 32px;
}

.bip-rejestry li {
    margin-bottom: 6px;
    padding-left: 3px;
    line-height: 1.45;
}

/* Wysoki kontrast */
body.bip-high-contrast .bip-rejestry {
    color: #ffffff !important;
}

/* Telefon */
@media (max-width: 768px) {

    .bip-rejestry {
        max-width: 100%;
    }

    .bip-rejestry h2 {
        margin-top: 28px;
    }

    .bip-rejestry p,
    .bip-rejestry-intro {
        text-align: left;
    }

    .bip-rejestry ul {
        padding-left: 26px;
    }
}

/* =========================================================
   BIP – REJESTRY I EWIDENCJE – UKŁAD KOŃCOWY
   ========================================================= */

.bip-rejestry {
    width: 100% !important;
    max-width: 1050px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Nagłówek główny */
.bip-rejestry h1 {
    margin-top: 0 !important;
    margin-bottom: 16px !important;
}

/* Nagłówki poszczególnych części */
.bip-rejestry h2 {
    margin-top: 30px !important;
    margin-bottom: 14px !important;
}

/* Pierwszy nagłówek po wprowadzeniu */
.bip-rejestry p + h2 {
    margin-top: 30px !important;
}

/* Akapity */
.bip-rejestry p {
    max-width: 1000px !important;
    margin-top: 0 !important;
    margin-bottom: 18px !important;
    line-height: 1.55 !important;
    text-align: left !important;
}

/* Tekst wprowadzający */
.bip-rejestry .bip-rejestry-intro {
    max-width: 1000px !important;
    margin-bottom: 24px !important;
    text-align: left !important;
}

/* Listy */
.bip-rejestry ul {
    max-width: 1000px !important;
    margin-top: 6px !important;
    margin-bottom: 26px !important;
    padding-left: 34px !important;
}

/* Poszczególne pozycje list */
.bip-rejestry li {
    margin: 0 0 7px 0 !important;
    padding-left: 3px !important;
    line-height: 1.45 !important;
}

/* Długie teksty mają łamać się tylko między wyrazami */
.bip-rejestry p,
.bip-rejestry li {
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
}

/* Wysoki kontrast */
body.bip-high-contrast .bip-rejestry,
body.bip-high-contrast .bip-rejestry p,
body.bip-high-contrast .bip-rejestry li,
body.bip-high-contrast .bip-rejestry h1,
body.bip-high-contrast .bip-rejestry h2 {
    background: #000000 !important;
    color: #ffffff !important;
}

/* Telefony i mniejsze ekrany */
@media (max-width: 768px) {

    .bip-rejestry {
        width: 100% !important;
        max-width: 100% !important;
    }

    .bip-rejestry h2 {
        margin-top: 26px !important;
        margin-bottom: 12px !important;
    }

    .bip-rejestry p {
        max-width: 100% !important;
        line-height: 1.5 !important;
    }

    .bip-rejestry ul {
        max-width: 100% !important;
        padding-left: 27px !important;
        margin-bottom: 22px !important;
    }

    .bip-rejestry li {
        margin-bottom: 6px !important;
    }
}

/* =========================================================
   BIP – DOKUMENTACJA FINANSOWA – WERSJA KOMPAKTOWA
   ========================================================= */

/* Tekst wprowadzający */
.bip-finanse > p {
    font-size: 1rem !important;
    line-height: 1.5 !important;
    margin-bottom: 18px !important;
}

/* Nagłówki poszczególnych roczników */
.bip-finanse h2 {
    font-size: 1.35rem !important;
    line-height: 1.3 !important;
    margin-top: 22px !important;
    margin-bottom: 7px !important;
}

/* Listy dokumentów */
.bip-finanse ul {
    margin-top: 4px !important;
    margin-bottom: 20px !important;
    padding-left: 27px !important;
}

/* Poszczególne dokumenty */
.bip-finanse li {
    margin-bottom: 3px !important;
    line-height: 1.3 !important;
}

/* Linki do PDF */
.bip-finanse li a {
    font-size: 0.90rem !important;
    line-height: 1.3 !important;
}

/* Telefon */
@media (max-width: 768px) {

    .bip-finanse h2 {
        font-size: 1.2rem !important;
        margin-top: 20px !important;
    }

    .bip-finanse li a {
        font-size: 0.90rem !important;
    }

    .bip-finanse ul {
        padding-left: 25px !important;
        margin-bottom: 18px !important;
    }
}

/* =========================================================
   BIP – DEKLARACJA DOSTĘPNOŚCI
   ========================================================= */

.bip-deklaracja {
    max-width: 1100px;
    width: 100%;
    margin: 0;
    padding: 0;
    font-size: 1rem;
    line-height: 1.6;
    text-align: left;
}

/* Zwykły tekst */
.bip-deklaracja p,
.bip-deklaracja li {
    font-size: 1rem;
    line-height: 1.6;
    text-align: left !important;
    word-spacing: normal !important;
    letter-spacing: normal !important;
}

/* Akapity */
.bip-deklaracja p {
    margin-top: 0;
    margin-bottom: 16px;
}

/* Główne nagłówki sekcji */
.bip-deklaracja h2 {
    font-size: 1.55rem;
    line-height: 1.3;
    margin-top: 30px;
    margin-bottom: 14px;
    text-align: left;
}

/* Nagłówki Dostępność architektoniczna itd. */
.bip-deklaracja h3 {
    font-size: 1.25rem;
    line-height: 1.35;
    margin-top: 22px;
    margin-bottom: 12px;
    text-align: left;
}

/* Listy */
.bip-deklaracja ul {
    margin-top: 8px;
    margin-bottom: 18px;
    padding-left: 28px;
}

.bip-deklaracja li {
    margin-bottom: 5px;
}

/* Linki */
.bip-deklaracja a {
    overflow-wrap: anywhere;
}

/* Telefon */
@media (max-width: 768px) {

    .bip-deklaracja {
        max-width: 100%;
        font-size: 1rem;
    }

    .bip-deklaracja p,
    .bip-deklaracja li {
        font-size: 1rem;
        line-height: 1.55;
    }

    .bip-deklaracja h2 {
        font-size: 1.35rem;
        margin-top: 26px;
    }

    .bip-deklaracja h3 {
        font-size: 1.15rem;
        margin-top: 20px;
    }
}

/* =========================================================
   BIP – DEKLARACJA DOSTĘPNOŚCI – JUSTOWANIE TEKSTU
   ========================================================= */

/* Justowanie zwykłych akapitów */
.bip-deklaracja p {
    text-align: justify !important;
    text-justify: inter-word !important;
    word-spacing: normal !important;
    letter-spacing: normal !important;
    hyphens: auto;
}

/* Elementy list pozostają wyrównane do lewej */
.bip-deklaracja li {
    text-align: left !important;
    word-spacing: normal !important;
    letter-spacing: normal !important;
}

/* Nagłówków nie justujemy */
.bip-deklaracja h1,
.bip-deklaracja h2,
.bip-deklaracja h3 {
    text-align: left !important;
    word-spacing: normal !important;
    letter-spacing: normal !important;
}

/* Na telefonie tekst wyrównujemy do lewej,
   żeby nie powstawały duże odstępy między słowami */
@media (max-width: 768px) {

    .bip-deklaracja p {
        text-align: left !important;
        hyphens: none;
    }
}

/* =========================================================
   BIP – MENU LEWE – WERSJA BARDZIEJ KOMPAKTOWA
   ========================================================= */

/* Pozycje główne menu */
.container-sidebar-left .mod-menu > li > a,
.container-sidebar-left .mod-menu > li > span,
.container-sidebar-left .mod-menu > li > button {
    min-height: 0 !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    padding-left: 18px !important;
    padding-right: 18px !important;

    font-size: 1rem !important;
    line-height: 1.25 !important;
}

/* Pozycje podrzędne po rozwinięciu */
.container-sidebar-left .mod-menu .mod-menu__sub > li > a,
.container-sidebar-left .mod-menu .mod-menu__sub > li > span {
    padding-top: 9px !important;
    padding-bottom: 9px !important;
    padding-left: 28px !important;
    padding-right: 15px !important;

    font-size: 0.94rem !important;
    line-height: 1.25 !important;
}

/* Strzałki rozwijania – zachowujemy czytelne */
.container-sidebar-left .mod-menu button,
.container-sidebar-left .mod-menu .mm-toggler {
    line-height: 1 !important;
}

/* Telefon – pozostawiamy trochę większe pola do dotykania */
@media (max-width: 768px) {

    .container-sidebar-left .mod-menu > li > a,
    .container-sidebar-left .mod-menu > li > span,
    .container-sidebar-left .mod-menu > li > button {
        padding-top: 12px !important;
        padding-bottom: 12px !important;
        font-size: 1rem !important;
    }

}

/* =========================================================
   BIP – TYPOGRAFIA I CZYTELNOŚĆ TREŚCI
   ========================================================= */

/* ---------------------------------------------------------
   1. PODSTAWOWA CZCIONKA CAŁEGO BIP
   --------------------------------------------------------- */

body {
    font-size: 16px;
    line-height: 1.55;
    letter-spacing: normal;
    word-spacing: normal;
}


/* ---------------------------------------------------------
   2. TREŚĆ GŁÓWNA – SZEROKOŚĆ I CZYTELNOŚĆ
   --------------------------------------------------------- */

.container-component {
    font-size: 1rem;
    line-height: 1.6;
}


/* ---------------------------------------------------------
   3. AKAPITY W ARTYKUŁACH
   --------------------------------------------------------- */

.container-component .com-content-article__body p,
.container-component .item-page p {
    font-size: 1rem;
    line-height: 1.65;
    margin-top: 0;
    margin-bottom: 16px;

    text-align: justify;
    text-justify: inter-word;

    letter-spacing: normal;
    word-spacing: normal;

    hyphens: auto;
}


/* ---------------------------------------------------------
   4. LISTY W ARTYKUŁACH
   --------------------------------------------------------- */

.container-component .com-content-article__body ul,
.container-component .com-content-article__body ol,
.container-component .item-page ul,
.container-component .item-page ol {
    margin-top: 8px;
    margin-bottom: 18px;
    padding-left: 30px;
}

.container-component .com-content-article__body li,
.container-component .item-page li {
    font-size: 1rem;
    line-height: 1.55;
    margin-bottom: 6px;

    text-align: left;
    letter-spacing: normal;
    word-spacing: normal;
}


/* ---------------------------------------------------------
   5. NAGŁÓWKI ARTYKUŁÓW
   --------------------------------------------------------- */

.container-component h1 {
    line-height: 1.2;
    margin-top: 0;
    margin-bottom: 20px;
    letter-spacing: normal;
    word-spacing: normal;
    text-align: left;
}

.container-component h2 {
    line-height: 1.25;
    margin-top: 30px;
    margin-bottom: 14px;
    letter-spacing: normal;
    word-spacing: normal;
    text-align: left;
}

.container-component h3 {
    line-height: 1.3;
    margin-top: 24px;
    margin-bottom: 12px;
    letter-spacing: normal;
    word-spacing: normal;
    text-align: left;
}


/* ---------------------------------------------------------
   6. LINKI W TREŚCI
   --------------------------------------------------------- */

.container-component .com-content-article__body a,
.container-component .item-page a {
    overflow-wrap: anywhere;
}


/* ---------------------------------------------------------
   7. TABELE
   --------------------------------------------------------- */

.container-component table {
    line-height: 1.45;
}

.container-component th,
.container-component td {
    vertical-align: top;
}


/* ---------------------------------------------------------
   8. MENU, WYSZUKIWARKA, STOPKA I OKRUSZKI
   Nie stosujemy tam justowania
   --------------------------------------------------------- */

.container-sidebar-left,
.container-sidebar-left p,
.container-sidebar-left li,
.container-sidebar-left a,
.breadcrumb,
.breadcrumb-item,
.bip-footer-content,
.bip-footer-content p,
.bip-footer-content li,
.bip-footer-content a {
    text-align: left !important;
    hyphens: none !important;
    word-spacing: normal !important;
    letter-spacing: normal !important;
}


/* ---------------------------------------------------------
   9. TELEFONY I MAŁE EKRANY
   Na małych ekranach nie justujemy – zapobiega to
   dużym przerwom między wyrazami.
   --------------------------------------------------------- */

@media (max-width: 768px) {

    .container-component .com-content-article__body p,
    .container-component .item-page p {
        text-align: left;
        line-height: 1.6;
        hyphens: none;
    }

    .container-component .com-content-article__body li,
    .container-component .item-page li {
        line-height: 1.5;
    }

    .container-component h1 {
        line-height: 1.2;
        margin-bottom: 18px;
    }

    .container-component h2 {
        line-height: 1.25;
        margin-top: 26px;
        margin-bottom: 12px;
    }

    .container-component h3 {
        line-height: 1.3;
        margin-top: 22px;
    }
}


/* =========================================================
   BIP � POPRAWKA �CIE�EK OR�A I FLAGI PO PRZENIESIENIU
   NA DOMEN� PRODUKCYJN�
   ========================================================= */

/* Flaga Polski */
.container-header::after {
    background-image: url("/images/BIP/flaga-bip.png") !important;
}

/* Orze� */
.container-header::before {
    background-image: url("/images/BIP/orzel-bip.png") !important;
}