/* ================================================================
   Sułoszowa WCAG 2.1 AA — Accessibility Styles
   Motyw: CityCRM | Wersja: 1.0.0
   ================================================================ */

/* ─── Klasa pomocnicza: tylko dla czytników ekranu ─────────────── */
.sul-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ─── FIX #5 — Skip link ───────────────────────────────────────── */
/* position:fixed żeby zawsze był nad sticky headerem motywu       */
.sul-skip-link {
    position: fixed;
    top: -60px;
    left: 8px;
    background: #000;
    color: #fff;
    padding: 10px 18px;
    z-index: 99999;
    text-decoration: none;
    font-size: 16px;
    font-weight: bold;
    border-radius: 0 0 4px 4px;
    transition: top 0.15s ease;
}
.sul-skip-link:focus {
    top: 0;
    outline: 3px solid #fff;
    outline-offset: 2px;
}

/* ─── FIX #1 — Przycisk pauzy karuzeli ────────────────────────── */
.sul-carousel-pause {
    display: block;
    margin: 4px auto 0;
    padding: 5px 14px;
    background: #236E43;
    color: #fff;
    border: 2px solid #236E43;
    cursor: pointer;
    font-size: 13px;
    border-radius: 3px;
    line-height: 1.4;
}
.sul-carousel-pause:hover {
    background: #1a5232;
    border-color: #1a5232;
}
.sul-carousel-pause:focus {
    outline: 3px solid #236E43;
    outline-offset: 3px;
}

/* ─── FIX #4 — Podmenu: klawiatura i hover ────────────────────── */
.menu-item-has-children:hover .sub-menu,
.menu-item-has-children .sub-menu.open {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}
/* Gdy klawiatura wymusi zamknięcie (Escape), ukryj bezwarunkowo —
   data-kb-closed="true" bije nawet :hover motywu dzięki !important */
.sub-menu[data-kb-closed="true"] {
    display: none !important;
    visibility: hidden !important;
}

/* ─── FIX #8 — Wskaźnik aktywnego slajdu (dot karuzeli) ───────── */
.owl-dot[aria-current="true"] span {
    outline: 3px solid #236E43;
    outline-offset: 2px;
}

/* ─── FIX #15A — Tekst hero: nakładka dla kontrastu ───────────── */
/* Biały tekst na zdjęciu = 1.17:1 (fail) — potrzeba 3.0:1         */
a.standard-logo .heading-h2,
a.retina-logo .heading-h2 {
    background: rgba(0, 0, 0, 0.52);
    padding: 6px 14px;
    display: inline-block;
    border-radius: 2px;
}

/* ─── FIX #15B — CSS var fallback (JS robi właściwy fix) ──────── */
:root { --color-green: #236E43; }

/* ─── FIX #15C — szary na białym: fbox + entry-meta ─────────────── */
/* .fbox-light p: rgb(153,153,153) na white = 2.85:1 → #595959 = 7:1 */
/* .entry-meta li: text node "Wiadomości" dziedziczy z <li> (nie <i>) */
/* JS naprawia tylko <i> (leaf); <li> ma childElementCount>0 → pominięty */
.fbox-light p,
.fbox-light .fbox-content p,
.entry-meta li,
.entry-meta,
time.entry-date,
.post-meta {
    color: #595959 !important;
}

/* ─── FIX copyright — rgba(255,255,255,0.4) na #282828 ≈ 3.86:1 ─ */
/* Blend: efektywny kolor ~rgb(121,121,121) na rgb(32,32,32)        */
/* Fix: rgba(255,255,255,0.85) na rgb(40,40,40) = ~11:1 (pass)     */
#copyrights,
#copyrights p,
#copyrights a,
.copyright-links,
.copyright-links a {
    color: rgba(255, 255, 255, 0.85) !important;
}

/* ─── FIX #16 — Reflow przy 320px viewport ────────────────────── */
#logo,
#logo a.standard-logo,
#logo a.retina-logo {
    max-width: 100%;
    overflow: hidden;
}
.heading-h2 {
    max-width: 100%;
    word-break: break-word;
    overflow-wrap: break-word;
}
.slider-wrap,
.owl-stage-outer {
    overflow: hidden;
    max-width: 100%;
}
@media screen and (max-width: 360px) {
    #logo { max-width: 100% !important; }
    .heading-h2 { max-width: 100% !important; }
    .slider-wrap { overflow: hidden !important; }
}
