/* =====================

   Zmienne globalne i kontrast
   
   ===================== */
body {
    --color-primary: #991421;
    --color-secondary: #4a4f51;
    --color-accent: #da5f06;
    --color-bg: #f1f1f1;
    --color-white: #fff;
    --color-black: #000;
    --color-placeholder: #fafafa;
    --color-pagination: #e27a05;
    --color-border: #e1e3e4;
    --color-border-light: #f0f0f0;
    --color-yellow: yellow;
    --color-article-bg: #fafafa;
}

body.highContrastBody {
    --color-primary: #aaaaaa;           /* jaskrawa czerwień */
    --color-secondary: #ffffff;         /* biały tekst na czarnym tle */
    --color-accent: #ff9900;            /* mocny pomarańcz */
    --color-bg: #111111;                /* tło całkowicie czarne */
    --color-white: #000000;             /* biały */
    --color-black: #FFFFFF;             /* czarny */
    --color-placeholder: #666;       /* jasna szarość – czytelna na czerni */
    --color-pagination: #ffff00;        /* żółty – jaskrawy */
    --color-border: #ffffff;            /* biały, żeby odcinał się na czarnym */
    --color-border-light: #999999;      /* mniej jaskrawa granica */
    --color-yellow: #ffff00;            /* żółty */
    --color-article-bg: #111111;
}

body.highContrastBody a {
    color: var(--color-yellow)!important;
}

/* =====================

   Reset i typografia
   
   ===================== */
html { scroll-behavior: smooth; overflow-x: hidden; font-size: 14px; }
body {
    background-color: var(--color-white);
    margin: 0 auto;
    color: var(--color-secondary);
    font-family: 'Century Gothic', sans-serif;
    font-style: normal;
    font-weight: 300;
    overflow-x: unset!important;
}

html:has(.primaryMenuWrapper.show),
body:has(.primaryMenuWrapper.show) {
    overflow-y: hidden;
}

strong { font-weight: 600; }

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: var(--color-placeholder);
    opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: var(--color-placeholder);
}

::-ms-input-placeholder { /* Microsoft Edge */
    color: var(--color-placeholder);
}

img { max-width: 100%; height: auto; }

.container { max-width: 1450px; margin: 0 auto; padding: 0 15px; }

/* =====================

   Pasek górny (topBar)
   
   ===================== */

.topBar { position: sticky; top: 0; left: 0; z-index: 99999; width: 100%; background-color: var(--color-primary); text-align: center; padding: 10px 0; }
.topBar .container { display: flex; gap: 20px; justify-content: space-between; }

@media only screen and (min-width: 951px) {
    .primaryMenuWrapper {
        display: flex;
        align-items: center;
        justify-content: start;
    }

    .primaryMenuWrapper ul.nav {
        display: flex;
        flex-direction: row;
        gap: 15px;
        justify-content: start;
        align-items: center;
        list-style-type: none;
    }

    .primaryMenuWrapper ul.nav > li,
    .primaryMenuWrapper ul.nav > li a {
        display: inline-block;
        white-space: wrap;
        text-align: left;
        font-size: 100%;
    }

    .primaryMenuWrapper a {
        color: var(--color-white);
        text-decoration: none;
        padding: 5px 10px;
        border-radius: 10px;
        transition: .3s all;
        font-weight: 500;
    }

    .primaryMenuWrapper a:hover {
        color: var(--color-primary);
        background: var(--color-white);
        font-weight: 500;
    }

    .primaryMenuWrapper .menuToggle {
        display: none;
    }
}

@media only screen and (max-width: 950px) {
    .primaryMenuWrapper {
        display: flex;
        align-items: center;
        justify-content: start;
        padding-right: 15px;
    }
    .primaryMenuWrapper .menuToggle {
        display: flex; flex-direction: column; justify-content: space-around; height: 30px; width: 30px;
        cursor: pointer;
    }
    .primaryMenuWrapper .menuToggle .bar { height: 2px; width: 100%; background-color: var(--color-white); transition: all .2s ease-in-out; }
    .primaryMenuWrapper.show .menuToggle { justify-content: space-between; height: 25px; width: 25px; }
    .primaryMenuWrapper.show .menuToggle .bar:nth-of-type(1) { transform: rotate(45deg); transform-origin: top left; width: 35px; }
    .primaryMenuWrapper.show .menuToggle .bar:nth-of-type(2) { transform-origin: center; width: 0; }
    .primaryMenuWrapper.show .menuToggle .bar:nth-of-type(3) { transform: rotate(-45deg); transform-origin: bottom left; width: 35px; }

    .primaryMenuWrapper ul.nav {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 20px;
        list-style-type: none;
        padding: 0;
        margin: 0;
        text-align: center;

        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background-color: var(--color-primary);
        z-index: 1000;
        overflow-y: auto;
        
        transition: .2s all;
    }
    
    .primaryMenuWrapper:not(.show) ul.nav { 
        opacity: 0; 
        pointer-events: none;
    }
    
    .primaryMenuWrapper.show ul.nav {
        opacity: 1;
        pointer-events: auto;
    }

    .primaryMenuWrapper.show ul.nav > li {
        width: 100%;
    }

    .primaryMenuWrapper.show ul.nav > li a {
        display: block;
        width: 100%;
        padding: 15px 0;
        color: var(--color-white);
        text-decoration: none;
        font-size: 18px;
        font-weight: bold;
        background-color: var(--color-primary);
        transition: background-color 0.3s;
    }

    .primaryMenuWrapper.show ul.nav > li a:hover {
        background-color: var(--color-accent);
    }

    .primaryMenuWrapper.show .menuToggle {
        position: fixed;
        top: 15px;
        right: 15px;
        z-index: 1001;
    }
    
}

.searchMenuWrapper { display: flex; flex-direction: column; justify-content: center; align-items: center; max-width: 250px; width: 100%; }
.searchMenuWrapper .topSearchWrapper { width: 100%; }
.searchMenuWrapper .topSearchWrapper label { color: var(--color-white); }
.searchMenuWrapper .topSearchWrapper input { border: none; background: transparent; text-align: center; border: 1px solid var(--color-white); color: var(--color-white); padding-bottom: 3px; width: 100%; }

.searchMenuWrapper .accBar { display: flex; align-items: center; justify-content: center; gap: 15px; margin-top: 10px; }
.searchMenuWrapper .accBar > div { color: var(--color-white); }
.fontMinus, .fontDef, .fontPlus, .highContrast { cursor: pointer; }

.topUserMenuWrapper { display: flex; align-items: center; justify-content: end; }
.topUserMenuWrapper ul.nav { display: flex; flex-direction: row; gap: 15px; justify-content: end; align-items: center; list-style-type: none; }
.topUserMenuWrapper ul.nav > li,
.topUserMenuWrapper ul.nav > li a { display: inline-block; white-space: wrap; text-align: right; font-size: 100%; }
.topUserMenuWrapper a { color: var(--color-white); text-decoration: none; padding: 5px 10px; border-radius: 10px; transition: .3s all; font-weight: 500; }
.topUserMenuWrapper a:hover { color: var(--color-primary); background: var(--color-white); font-weight: 500; }

/* =====================

   Sekcja z logotypami
   
   ===================== */

.logoBar { margin-top: 50px; margin-bottom: 30px; }
.logoBar .container { display: flex; justify-content: space-around; align-items: center; flex-wrap: wrap; gap: 25px; }
.logoBar .container > div { max-width: 300px; width: 100%; height: auto; display: flex; justify-content: center; align-items: center; }
.logoBar .container > div img { width: 100%; max-width: 300px; height: auto; }
.logoBar h1 { text-align: center; font-size: 160%; margin-top: 25px; }

/************** poprzednie_edycje */

.poprzednie-edycje-container { margin-top: 50px; margin-bottom: 30px; display: flex; justify-content: space-around; align-items: center; flex-wrap: wrap; gap: 25px; }
.poprzednie-edycje-container > div { max-width: 300px; width: 100%; height: auto; display: flex; justify-content: center; align-items: center; }
.poprzednie-edycje-container > div img { width: 100%; height: auto; }

/* =====================

   Główne menu pod logotypami
   
   ===================== */

.mainMenuBar {
    padding-top: 10px;
    text-transform: uppercase;
    text-align: center;
    width: 100%;
}

.mainMenuBar ul.nav {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    width: 100%;
}

.mainMenuBar li {
    display: inline-block;
}

/* Chevron dla elementów z podmenu */
.mainMenuBar li.parent > a {
    position: relative;
    padding-right: 24px;
}

.mainMenuBar li.parent > a::after {
    content: '';
    display: inline-block;
    border: solid var(--color-secondary);
    border-width: 0 1px 1px 0;
    padding: 4px;
    margin-left: 8px;
    position: absolute;
    right: 8px;
    top: 45%;
    transform: translateY(-50%) rotate(45deg);
    transition: transform .3s;
}

.mainMenuBar li.parent:hover > a::after,
.mainMenuBar li.parent:focus-within > a::after {
    transform: translateY(-50%) rotate(-135deg);
}

.mainMenuBar li a {
    display: inline-block;
    color: var(--color-secondary);
    padding: 10px 15px;
    transition: all .3s;
    text-decoration: none;
}

.mainMenuBar li.active > a,
.mainMenuBar li.current > a {
    font-weight: bold;
    background: var(--color-primary);
    border-radius: 10px 10px 0 0;
    color: var(--color-white);
}

.mainMenuBar ul.nav-child > li.active > a,
.mainMenuBar ul.nav-child > li.current > a {
    border-radius: 0;
}

.mainMenuBar li.parent.active > a::after,
.mainMenuBar li.parent.current > a::after {
    border: solid var(--color-white);
    border-width: 0 1px 1px 0;
}

.mainMenuBar li > a:hover,
.mainMenuBar li > a:hover {
    color: var(--color-primary);
}

.mainMenuBar li.active > a:hover,
.mainMenuBar li.current > a:hover { color: var(--color-white); }

.nav-child {
    display: none;
    position: absolute;
    background-color: var(--color-bg);
    min-width: 260px;
    z-index: 1;
    padding: 0;
    left: 6%;
    list-style-type: none;
    margin-left: 0;
}

.parent:hover .nav-child,
.parent a:focus-visible ~ .nav-child,
.parent:focus-within .nav-child {
    display: block;
}

.nav-child li {
    width: 100%;
    border: none;
}

.nav-child li a {
    width: 100%;
    padding-bottom: 8px;
    display: block;
    text-align: left;
}

/* =====================

   Pasek hero/slider
   
   ===================== */

.sliderWrapper { margin-bottom: 50px; }

.thinBanner {
    padding: 10px 0;
    background-color: var(--color-primary);
    color: var(--color-white);
    text-align: center;
}

.thinBanner h2 { margin: 0; font-size: 1.75rem; }

/* =====================

   Nawigacja okruszkowa (breadcrumb)
   
   ===================== */

.breadcrumbWrapper a {
    color: var(--color-secondary);
}

.breadcrumb {
    margin: 0;
    padding: 0;
    background-color: var(--color-white);
}

/* =====================

   Główna zawartość (mainContent, contentWrapper)
   
   ===================== */

.importantArticlesWrapper { margin-bottom: 50px; }
.importantArticlesWrapper .container .importantArticlesCarousel { padding: 0 45px; position: relative; }

.importantArticlesCarousel .owl-stage { display: flex; }
.importantArticlesCarousel .owl-item { display: flex; align-items: stretch; padding: 5px; }

.art-item { background: var(--color-white); padding: 25px; border-radius: 5px; border: 1px solid var(--color-primary); 
    display: flex; flex-direction: column; justify-content: space-between; align-items: start; width: 100%; height: 100%;
}

.art-item a { background: var(--color-bg); color: var(--color-black); text-decoration: none; padding: 10px 15px; border-radius: 5px; transition: all .2s; }

.art-item a:hover { background: var(--color-primary); color: var(--color-white); }

.owl-carousel .owl-nav button.owl-prev { position: absolute; left: 0; top: 35%; font-size: 52px; }
.owl-carousel .owl-nav button.owl-next { position: absolute; right: 0; top: 35%; font-size: 52px; }


.mainContent {
    margin: 50px 0;
}

.page-header h1 {
    font-weight: 900;
    text-transform: uppercase;
    text-decoration: underline;
    color: var(--color-primary);
    margin-bottom: 40px;
}

.page-header h2 a {
    color: var(--color-primary);
}

.items-row h2 a {
    font-size: 18px;
    font-weight: 600;
}

.items-leading {
    column-count: 2;
    column-gap: 25px;
    margin: 25px 0;
}

.items-leading > div {
    break-inside: avoid;
    margin-bottom: 25px;
    background: var(--color-article-bg);
    padding: 25px;
}

.items-leading > div p {
    white-space: wrap;
    word-break: break-word;
    overflow-wrap: break-word;
    color: var(--color-secondary);
}

.page-header {
    margin-bottom: 15px;
}

@media only screen and (max-width: 1000px) {
    .items-leading {
        column-count: 1;
    }
}

/* =====================

   Newsletter
   
===================== */

.newsletterWrapper {
    width: 100%;
    background-image: url('../images/newsletter_bg.jpg');
    background-color: var(--color-primary);
    background-position: center;
    background-size: cover;
    padding: 50px 0;
}

body.highContrastBody .newsletterWrapper {
    filter: brightness(2.5) contrast(2) saturate(0);
}

.newsletterWrapper .container { display: flex; justify-content: space-between; gap: 25px; max-width: 1000px; }

.newsletterLeft { display: flex; justify-content: start; align-items: center; width: 100%; }
.newsletterLeft h3 { color: var(--color-white); font-size: 240%; text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2); margin: 0; }

.newsletterRight { max-width: 500px; display: flex; flex-direction: column; justify-content: center; align-items: end; }

@media only screen and (max-width: 750px) {
    .newsletterWrapper .container { flex-direction: column; align-items: center; }
    .newsletterLeft { justify-content: center; }
    .newsletterLeft h3 { text-align: center; font-size: 180%; }
    .newsletterRight { margin-top: 25px; }
}

.acymailing_module { min-width: 250px; width: 100%; }

.fieldacyemail span { width: 100%; }

.acymailing_form > p { display: flex; justify-content: end; }

p.fieldacyemail input {
    border: none;
    background: transparent;
    text-align: center;
    border: 1px solid var(--color-white);
    color: var(--color-white);
    padding-bottom: 3px;
    width: 100%!important;
}

p.fieldacyemail label {
    color: var(--color-white);
}

.acysubbuttons > input {
    border-radius: 5px;
    border: 1px solid var(--color-white);
    padding: 12px;
    background-color: var(--color-primary);
    color: var(--color-white);
    margin-top: 4px;
    font-size: 120%;
}

.acysubbuttons > input:hover {
    background: var(--color-white);
    color: var(--color-primary);
}

/* =====================

   Stopka (footer)
   
   ===================== */

.footer { background-color: var(--color-bg); width: 100%; padding: 50px 0; }
.footer .footerWrapper { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 25px; }

.footerQuarter h3 { margin: 0 0 35px 0; position: relative; display: inline-block; }
.footerQuarter h3::after {
    content: '';
    position: absolute;
    width: 50%;
    height: 1px;
    background-color: var(--color-primary);
    bottom: -10px;
    left: 0;
}

.footer-menu-container {
    display: flex;
    flex-direction: column;
    align-items: start;
}

.footer-menu-container a {
    text-decoration: none;
    color: var(--color-secondary);
    padding: 5px 0;
    transition: .1s all;
    font-size: 120%;
    display: block;
    width: 100%;
}

.footer-menu-container a:hover {
    color: var(--color-primary);
}

@media only screen and (max-width: 880px) {
    .footer .footerWrapper { grid-template-columns: 1fr 1fr; }
}

@media only screen and (max-width: 500px) {
    .footer .footerWrapper { grid-template-columns: 1fr; }
}

/**************************/

.projectFooter { margin: 50px 0; }
.projectFooter .footerWrapper { display: flex; justify-content: space-around; align-items: center; }
.projectFooter .footerWrapper > div { display: flex; flex-direction: column; justify-content: center; align-items: center; }

/**************************/

.ueFooter { margin: 75px 0 50px 0; }
.footer-project-text-container { margin: 40px 0; }
.footer-project-text-container h4 { font-size: 150%; }
.ueFooter .footerWrapper { display: flex; gap: 20px; }
.ueFooter .footerWrapper > div { width: 100%; display: flex; justify-content: center; align-items: center; }
.ueFooter .footerWrapper > div img { max-width: 100%; height: auto; }

@media only screen and (max-width: 600px) {
    .ueFooter .footerWrapper { flex-direction: column; }
    }

/* =====================

   Pozostałe elementy i narzędzia
   
   ===================== */


.latestnews a {
    font-size: 16px;
    line-height: 1.75em;
    color: var(--color-accent);
}

.latestnews a:hover {
    text-decoration: underline;
}

.latestnews {
    list-style: none;
}

.moduletable h3 {
    padding-bottom: 40px;
    padding-left: 40px;
}

/* .sr-only */
.element-invisible {
    display: block;
}

.search .form-inline {
    text-align: center;
}

.pagination {
    text-align: center;
    display: block;
}

.pagination ul {
    list-style: none;
    padding: 0;
    display: flex;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}

.pagination li {
    display: inline-block;
    text-transform: capitalize;
}

.pagination li a {
    padding: 10px 15px;
    border-radius: 5px;
    background-color: var(--color-bg);
    transition: background-color .1s, color .1s;
    color: var(--color-primary);
    text-decoration: none;
    display: inline-block;
}
.pagination li a:hover {
    background-color: var(--color-primary);
    color: var(--color-white);
}

.pagination li span {
    padding: 10px 15px;
    border-radius: 5px;
    background-color: var(--color-primary);
    color: var(--color-white);
    cursor: default;
    display: inline-block;
}


.pagination .counter {
    display: none;
}

.pagination li.pagination-start {
    border: none;
}

.pagination li.pagination-prev, .pagination li.pagination-next {
    display: none;
}

.parent {
    position: relative;
    display: inline-block;
}

.icons {
    text-align: right;
}

.items-leading .icons {
    display: none;
}

span.caret {
    display: none;
}

.items-row .span6 {
    display: inline-block;
    width: 47%;
    vertical-align: top;
}

.items-row .span6:nth-child(2) {
    margin-left: 3%;
}

[class*="leading-"] img {
    width: 100%;
}

body.highContrastBody [class*="leading-"] img  {
    filter: saturate(0);
}

.item-page .page-header {
    display: block;
}

#sw {
    position: fixed;
    padding: 1px 1px 1px 0;
    margin: 0;
    top: 25%;
    left: 0;
    z-index: 9999;
    width: 32px;
    border-radius: 2px;
    border: 2px solid var(--color-white);
    border-left: none;
    background-color: var(--color-white);
}

#sw img {
    display: block;
    width: 100%;
    margin-top: 1px;
    margin-bottom: 1px;
}

.umSizer {
    vertical-align: middle;
}

div.login, div.registration {
    text-align: right;
}

div.login legend, div.registration legend {
    text-align: center;
}

.controls, .control-label {
    display: inline-block;
    width: 49%;
}

.control-label {
    text-align: right;
    padding-right: 20px;
}

.controls {
    text-align: left;
}

.controls .btn {
    text-align: right;
}

.article-index li {
    display: block;
    width: 100%;
}

.contentWrapper a {
    color: var(--color-secondary);
}

.contentWrapper a:hover {
    color: var(--color-secondary);
}

.contentWrapper a:active {
    color: var(--color-secondary);
}

.article-index li {
    display: block;
}

.article-index {
    display: block;
}

div[itemprop=articleBody] {
    display: block;
}

.pager {
    list-style: none;
    padding-top: 20px;
    margin-top: 20px;
    border-top: 1px solid var(--color-border-light);
}

.pager li {
    display: inline-block;
    width: 49%;
}

.pager li:last-child {
    text-align: right;
    padding-right: 6%;
}

#search-searchword {
    width: 300px;
    height: 30px;
    font-size: 14px;
    color: var(--color-secondary);
    text-align: center;
}

.radio input, .checkbox input {
    margin-right: 8px;
}

.radio, .checkbox {
    padding-right: 16px;
}

.phrases, .only {
    display: block;
    width: 100%;
}

.form-limit {
    padding-top: 24px;
    border-top: 1px solid var(--color-border-light);
    margin-top: 24px;
}

.searchintro, .form-limit {
    padding-bottom: 24px;
    border-bottom: 1px solid var(--color-border-light);
    margin-bottom: 24px;
}

#searchForm .counter {
    display: none;
}

.ordering-box {
    padding-top: 24px;
}

@media only screen and (min-width: 960px) {

    .latestnews a {
        font-size: 16px;
        line-height: 1.75em;
        color: var(--color-accent);
    }

    .latestnews a:hover {
        text-decoration: underline;
    }

    .latestnews {
        list-style: none;
    }

    .moduletable h3 {
        padding-bottom: 40px;
        padding-left: 40px;
    }

    .search .form-inline {
        text-align: center;
    }

    .icons {
        text-align: right;
    }

    span.caret {
        display: none;
    }

    .items-row .span6 {
        display: inline-block;
        width: 47%;
        vertical-align: top;
    }

    .items-row .span6:nth-child(2) {
        margin-left: 3%;
    }

    [class*="leading-"] img {
        width: 100%;
    }
    
}

.phrases .controls {
    display: block;
    width: 100%;
}


/* =====================

   Kontrast i dostępność
   
   ===================== */

.belkaImageWrapper a,
.projectFooter a {
    all: unset;
    cursor: pointer;
}

body.highContrastBody .belkaImageWrapper {
    display: none;
}

body.highContrastBody .n2-section-smartslider  {
    filter: saturate(0);
}

div#n2-ss-2 .nextend-arrow img {
    background: var(--color-primary);
    color: var(--color-white);
}

/* =====================

   Widoczny fokus i kontrast

   ===================== */

a:focus,
button:focus,
input:focus,
textarea:focus,
select:focus,
[tabindex]:focus,
[role="button"]:focus,
:focus {
    outline: 2px solid var(--color-accent)!important;
    outline-offset: 2px!important;
}
