/* ============================================================
   Accessibility Widget v1.2 – Geekon
   WCAG 2.1 / 2.2 AA
   ============================================================ */

/* ── Skip link ─────────────────────────────────────────────── */
.aw-skip-link {
    position: absolute;
    top: -999px;
    left: 1rem;
    z-index: 1000001;
    padding: .7rem 1.2rem;
    background: #1a56db;
    color: #fff !important;
    font-weight: 700;
    font-size: 1rem;
    border-radius: 8px;
    text-decoration: none;
}
.aw-skip-link:focus { top: 1rem; outline: 3px solid #f59e0b; outline-offset: 2px; }

/* ── Wrapper – ZAWSZE fixed, ZAWSZE izolowany ──────────────────
   Wszystkie wartości są hardkodowane inline lub tutaj,
   żadna klasa na body/html nie może ich nadpisać.
────────────────────────────────────────────────────────────── */
#aw-wrapper {
    position:   fixed !important;
    z-index:    1000000 !important;
    /* KLUCZOWE: izolacja od filtrów rodzica */
    isolation:  isolate;
    /* font-size ustawiony też przez JS jako inline style = 16px */
    font-size:  16px !important;
    line-height: 1.5 !important;
    letter-spacing: 0 !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important;
    /* żaden filter strony nie dotyka wrappera */
    filter: none !important;
    /* kolory własne – nie dziedziczone */
    color: #111827 !important;
}

/* Pozycje */
#aw-wrapper.aw-pos-bottom-right { bottom: 1.5rem; right: 1.5rem; }
#aw-wrapper.aw-pos-bottom-left  { bottom: 1.5rem; left:  1.5rem; }
#aw-wrapper.aw-pos-top-right    { top:    1.5rem; right: 1.5rem; }
#aw-wrapper.aw-pos-top-left     { top:    1.5rem; left:  1.5rem; }

/* Reset wszystkich dzieci wrappera –
   gwarantuje że tryby kontrastu/grayscale/etc. na body
   nie dotykają wnętrza panelu */
#aw-wrapper * {
    box-sizing:     border-box !important;
    font-family:    -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important;
    letter-spacing: 0 !important;
    line-height:    normal !important;
    word-spacing:   normal !important;
}

/* ── Przycisk toggle ───────────────────────────────────────── */
#aw-wrapper .aw-toggle {
    display:         flex !important;
    align-items:     center !important;
    justify-content: center !important;
    width:           60px !important;
    height:          60px !important;
    border-radius:   50% !important;
    border:          3px solid rgba(255,255,255,.65) !important;
    background:      #1a56db !important;
    color:           #fff !important;
    cursor:          pointer !important;
    box-shadow:      0 4px 14px rgba(26,86,219,.5) !important;
    padding:         0 !important;
    transition:      transform .2s ease, box-shadow .2s ease !important;
}
#aw-wrapper .aw-toggle:hover {
    transform:  scale(1.08) !important;
    background: #1341b0 !important;
}
#aw-wrapper .aw-toggle:focus-visible {
    outline:    none !important;
    box-shadow: 0 0 0 3px #f59e0b, 0 4px 14px rgba(26,86,219,.5) !important;
}
#aw-wrapper .aw-toggle svg {
    width:  28px !important;
    height: 28px !important;
    fill:   #fff !important;
    display: block !important;
    pointer-events: none !important;
}

/* ── Panel ─────────────────────────────────────────────────── */
#aw-wrapper .aw-panel {
    position:       absolute !important;
    bottom:         calc(100% + .9rem) !important;
    right:          0 !important;
    width:          340px !important;
    max-height:     82vh !important;
    background:     #ffffff !important;
    border-radius:  14px !important;
    box-shadow:     0 10px 40px rgba(0,0,0,.18), 0 2px 8px rgba(0,0,0,.10) !important;
    border:         1px solid #d1d5db !important;
    display:        flex !important;
    flex-direction: column !important;
    overflow:       hidden !important;
    opacity:        0 !important;
    pointer-events: none !important;
    transform:      translateY(12px) scale(.97) !important;
    transition:     opacity .22s ease, transform .22s ease !important;
    color:          #111827 !important;
}
#aw-wrapper.aw-pos-bottom-left .aw-panel,
#aw-wrapper.aw-pos-top-left    .aw-panel { right: auto !important; left: 0 !important; }
#aw-wrapper.aw-pos-top-right   .aw-panel,
#aw-wrapper.aw-pos-top-left    .aw-panel {
    bottom: auto !important;
    top: calc(100% + .9rem) !important;
    transform: translateY(-12px) scale(.97) !important;
}
#aw-wrapper .aw-panel.aw-open {
    opacity:        1 !important;
    pointer-events: auto !important;
    transform:      translateY(0) scale(1) !important;
}

/* ── Nagłówek ──────────────────────────────────────────────── */
#aw-wrapper .aw-panel-header {
    display:         flex !important;
    align-items:     center !important;
    justify-content: space-between !important;
    padding:         1rem 1.25rem !important;
    background:      #1a56db !important;
    flex-shrink:     0 !important;
}
#aw-wrapper .aw-panel-title {
    margin:      0 !important;
    font-size:   1rem !important;
    font-weight: 700 !important;
    color:       #fff !important;
    display:     flex !important;
    align-items: center !important;
    gap:         .5rem !important;
    line-height: 1.3 !important;
}
#aw-wrapper .aw-panel-title svg {
    width:       20px !important;
    height:      20px !important;
    fill:        #fff !important;
    flex-shrink: 0 !important;
    display:     block !important;
}
#aw-wrapper .aw-close {
    display:         flex !important;
    align-items:     center !important;
    justify-content: center !important;
    width:           36px !important;
    height:          36px !important;
    min-width:       36px !important;
    border:          2px solid rgba(255,255,255,.5) !important;
    border-radius:   50% !important;
    background:      transparent !important;
    cursor:          pointer !important;
    padding:         0 !important;
}
#aw-wrapper .aw-close:hover  { background: rgba(255,255,255,.2) !important; }
#aw-wrapper .aw-close:focus-visible { outline: none !important; box-shadow: 0 0 0 3px #f59e0b !important; }
#aw-wrapper .aw-close svg {
    width:   18px !important;
    height:  18px !important;
    stroke:  #fff !important;
    fill:    none !important;
    display: block !important;
}

/* ── Treść ─────────────────────────────────────────────────── */
#aw-wrapper .aw-panel-body {
    overflow-y:      auto !important;
    flex:            1 !important;
    padding:         .5rem 0 !important;
    scrollbar-width: thin !important;
    scrollbar-color: #d1d5db transparent !important;
    background:      #ffffff !important;
}
#aw-wrapper .aw-panel-body::-webkit-scrollbar { width: 5px; }
#aw-wrapper .aw-panel-body::-webkit-scrollbar-thumb { background: #d1d5db; border-radius: 5px; }

/* ── Sekcje ────────────────────────────────────────────────── */
#aw-wrapper .aw-section {
    padding:       .9rem 1.25rem !important;
    border-bottom: 1px solid #e5e7eb !important;
    background:    #ffffff !important;
}
#aw-wrapper .aw-section:last-child { border-bottom: none !important; }

#aw-wrapper .aw-section-title {
    margin:         0 0 .8rem !important;
    font-size:      .72rem !important;
    font-weight:    800 !important;
    text-transform: uppercase !important;
    letter-spacing: .07em !important;
    color:          #6b7280 !important;
    display:        flex !important;
    align-items:    center !important;
    gap:            .4rem !important;
    line-height:    1.2 !important;
}
#aw-wrapper .aw-section-title svg {
    width:       16px !important;
    height:      16px !important;
    stroke:      #6b7280 !important;
    fill:        none !important;
    flex-shrink: 0 !important;
    display:     block !important;
}

/* ── Kontrolki ─────────────────────────────────────────────── */
#aw-wrapper .aw-controls {
    display:        flex !important;
    flex-direction: column !important;
    gap:            .5rem !important;
}
#aw-wrapper .aw-control-group {
    display:         flex !important;
    align-items:     center !important;
    justify-content: space-between !important;
    gap:             .5rem !important;
}
#aw-wrapper .aw-control-label {
    font-size:   .875rem !important;
    font-weight: 500 !important;
    color:       #111827 !important;
    flex:        1 !important;
    line-height: 1.3 !important;
}

/* ── Stepper ───────────────────────────────────────────────── */
#aw-wrapper .aw-stepper {
    display:       flex !important;
    align-items:   center !important;
    gap:           2px !important;
    background:    #f3f4f6 !important;
    border:        1.5px solid #d1d5db !important;
    border-radius: 8px !important;
    padding:       3px !important;
}
#aw-wrapper .aw-stepper-btn {
    display:         flex !important;
    align-items:     center !important;
    justify-content: center !important;
    width:           34px !important;
    height:          34px !important;
    min-width:       34px !important;
    border:          none !important;
    border-radius:   6px !important;
    background:      #fff !important;
    color:           #111827 !important;
    cursor:          pointer !important;
    padding:         0 !important;
    box-shadow:      0 1px 3px rgba(0,0,0,.1) !important;
}
#aw-wrapper .aw-stepper-btn:hover { background: #1a56db !important; }
#aw-wrapper .aw-stepper-btn:hover svg { stroke: #fff !important; }
#aw-wrapper .aw-stepper-btn:focus-visible { outline: none !important; box-shadow: 0 0 0 3px #f59e0b !important; }
#aw-wrapper .aw-stepper-btn svg {
    width:   16px !important;
    height:  16px !important;
    stroke:  #374151 !important;
    fill:    none !important;
    display: block !important;
}
#aw-wrapper .aw-stepper-value {
    min-width:   52px !important;
    text-align:  center !important;
    font-size:   .82rem !important;
    font-weight: 700 !important;
    color:       #111827 !important;
    line-height: 1 !important;
}

/* ── Radio kontrast ────────────────────────────────────────── */
#aw-wrapper .aw-toggle-group {
    display: flex !important;
    gap:     .25rem !important;
}
#aw-wrapper .aw-toggle-btn {
    flex:          1 !important;
    padding:       .35rem .4rem !important;
    font-size:     .78rem !important;
    font-weight:   600 !important;
    border:        1.5px solid #d1d5db !important;
    border-radius: 8px !important;
    background:    #f3f4f6 !important;
    color:         #111827 !important;
    cursor:        pointer !important;
    text-align:    center !important;
    line-height:   1.3 !important;
}
#aw-wrapper .aw-toggle-btn:hover { border-color: #1a56db !important; color: #1a56db !important; }
#aw-wrapper .aw-toggle-btn:focus-visible { outline: none !important; box-shadow: 0 0 0 3px #f59e0b !important; }
#aw-wrapper .aw-toggle-btn[aria-checked="true"] {
    background:   #1a56db !important;
    border-color: #1a56db !important;
    color:        #fff !important;
}

/* ── Feature buttons ───────────────────────────────────────── */
#aw-wrapper .aw-feature-btn {
    display:       flex !important;
    align-items:   center !important;
    gap:           .6rem !important;
    width:         100% !important;
    padding:       .6rem .85rem !important;
    font-size:     .875rem !important;
    font-weight:   500 !important;
    border:        1.5px solid #d1d5db !important;
    border-radius: 8px !important;
    background:    #f3f4f6 !important;
    color:         #111827 !important;
    cursor:        pointer !important;
    text-align:    left !important;
    line-height:   1.4 !important;
}
#aw-wrapper .aw-feature-btn svg {
    width:       18px !important;
    height:      18px !important;
    stroke:      #374151 !important;
    fill:        none !important;
    flex-shrink: 0 !important;
    display:     block !important;
}
#aw-wrapper .aw-feature-btn:hover {
    border-color: #1a56db !important;
    background:   #eff6ff !important;
    color:        #1a56db !important;
}
#aw-wrapper .aw-feature-btn:hover svg { stroke: #1a56db !important; }
#aw-wrapper .aw-feature-btn:focus-visible { outline: none !important; box-shadow: 0 0 0 3px #f59e0b !important; }
#aw-wrapper .aw-feature-btn[aria-pressed="true"] {
    background:   #1a56db !important;
    border-color: #1a56db !important;
    color:        #fff !important;
}
#aw-wrapper .aw-feature-btn[aria-pressed="true"] svg { stroke: #fff !important; }

/* ── Stopka ────────────────────────────────────────────────── */
#aw-wrapper .aw-panel-footer {
    display:         flex !important;
    align-items:     center !important;
    justify-content: space-between !important;
    gap:             .5rem !important;
    padding:         .85rem 1.25rem !important;
    background:      #f3f4f6 !important;
    border-top:      1px solid #e5e7eb !important;
    flex-shrink:     0 !important;
}
#aw-wrapper .aw-reset-btn {
    display:       flex !important;
    align-items:   center !important;
    gap:           .4rem !important;
    padding:       .5rem 1rem !important;
    font-size:     .82rem !important;
    font-weight:   600 !important;
    border:        1.5px solid #d1d5db !important;
    border-radius: 8px !important;
    background:    #fff !important;
    color:         #111827 !important;
    cursor:        pointer !important;
}
#aw-wrapper .aw-reset-btn svg { stroke: #374151 !important; fill: none !important; width: 15px !important; height: 15px !important; display: block !important; }
#aw-wrapper .aw-reset-btn:hover { border-color: #dc2626 !important; color: #dc2626 !important; }
#aw-wrapper .aw-reset-btn:hover svg { stroke: #dc2626 !important; }
#aw-wrapper .aw-reset-btn:focus-visible { outline: none !important; box-shadow: 0 0 0 3px rgba(220,38,38,.4) !important; }

#aw-wrapper .aw-statement-link {
    display:         flex !important;
    align-items:     center !important;
    gap:             .3rem !important;
    font-size:       .78rem !important;
    color:           #1a56db !important;
    text-decoration: underline !important;
}
#aw-wrapper .aw-statement-link:focus-visible { outline: none !important; box-shadow: 0 0 0 3px #f59e0b !important; border-radius: 3px !important; }

/* ── Maska czytania ────────────────────────────────────────── */
#aw-reading-mask {
    position:       fixed !important;
    top: 0; left: 0; right: 0; bottom: 0 !important;
    z-index:        999990 !important;
    pointer-events: none !important;
    background:
        linear-gradient(
            to bottom,
            rgba(0,0,0,.8) 0%,
            rgba(0,0,0,.8) var(--aw-mt, 44%),
            transparent    var(--aw-mt, 44%),
            transparent    var(--aw-mb, 56%),
            rgba(0,0,0,.8) var(--aw-mb, 56%),
            rgba(0,0,0,.8) 100%
        ) !important;
}

/* ============================================================
   TRYBY DOSTĘPNOŚCI – strona (zawsze wykluczają #aw-wrapper)
   ============================================================ */

/* Wysoki kontrast */
body.aw-contrast-high { background: #fff !important; color: #000 !important; }
body.aw-contrast-high *:not(#aw-wrapper):not(#aw-wrapper *):not(#aw-reading-mask):not(#aw-grayscale-overlay) {
    background-color: #fff !important;
    color:            #000 !important;
    border-color:     #000 !important;
}
body.aw-contrast-high a:not(#aw-wrapper *) {
    color:           #000 !important;
    text-decoration: underline !important;
}

/* Ciemny kontrast */
body.aw-contrast-dark { background: #000 !important; color: #fff !important; }
body.aw-contrast-dark *:not(#aw-wrapper):not(#aw-wrapper *):not(#aw-reading-mask):not(#aw-grayscale-overlay) {
    background-color: #000 !important;
    color:            #fff !important;
    border-color:     #555 !important;
}
body.aw-contrast-dark a:not(#aw-wrapper *) {
    color:           #90cdf4 !important;
    text-decoration: underline !important;
}

/* Dysleksja */
body.aw-dyslexia *:not(#aw-wrapper):not(#aw-wrapper *) {
    font-family: "OpenDyslexic", "Comic Sans MS", Arial, sans-serif !important;
}

/* Zatrzymaj animacje */
body.aw-no-anims *:not(#aw-wrapper):not(#aw-wrapper *),
body.aw-no-anims *:not(#aw-wrapper)::before,
body.aw-no-anims *:not(#aw-wrapper)::after {
    animation-duration:        .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration:       .001ms !important;
    scroll-behavior:           auto !important;
}

/* Podświetl linki – kolor ZAWSZE czarny
   Obejmuje też dzieci wewnątrz <a> (np. <div>, <span> z własnym color) */
body.aw-hl-links a:not(#aw-wrapper *),
body.aw-hl-links a:not(#aw-wrapper *):link,
body.aw-hl-links a:not(#aw-wrapper *):visited,
body.aw-hl-links a:not(#aw-wrapper *):hover,
body.aw-hl-links a:not(#aw-wrapper *):active,
body.aw-hl-links a:not(#aw-wrapper *):focus,
body.aw-hl-links * a:not(#aw-wrapper *),
body.aw-hl-links * a:not(#aw-wrapper *):link,
body.aw-hl-links * a:not(#aw-wrapper *):visited,
body.aw-hl-links * a:not(#aw-wrapper *):hover {
    background:      #ffff00 !important;
    color:           #000000 !important;
    text-decoration: underline !important;
    outline:         2px solid #000 !important;
    outline-offset:  1px !important;
    padding:         0 3px !important;
    border-radius:   2px !important;
}
/* Dzieci wewnątrz <a> – div, span, p itd. z własnym color */
body.aw-hl-links a:not(#aw-wrapper *) *,
body.aw-hl-links * a:not(#aw-wrapper *) * {
    color:      #000000 !important;
    background: transparent !important;
}

/* Ukryj obrazy */
body.aw-hide-imgs img:not(#aw-wrapper *),
body.aw-hide-imgs picture:not(#aw-wrapper *),
body.aw-hide-imgs svg:not(#aw-wrapper *) {
    visibility: hidden !important;
}

/* Duży kursor */
body.aw-big-cursor,
body.aw-big-cursor *:not(#aw-wrapper):not(#aw-wrapper *) {
    cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' stroke='%23fff' stroke-width='1' d='M5 3l14 9-7 1-4 7z'/%3E%3C/svg%3E") 0 0, auto !important;
}

/* Podświetl fokus */
body.aw-focus-hl *:not(#aw-wrapper):not(#aw-wrapper *):focus,
body.aw-focus-hl *:not(#aw-wrapper):not(#aw-wrapper *):focus-visible {
    outline:        4px solid #f59e0b !important;
    outline-offset: 3px !important;
    box-shadow:     0 0 0 7px rgba(245,158,11,.3) !important;
}

/* Nawigacja klawiaturą */
body.aw-kbd-nav *:not(#aw-wrapper):not(#aw-wrapper *):focus {
    outline:        3px solid #1a56db !important;
    outline-offset: 2px !important;
}

/* ── Responsywność ─────────────────────────────────────────── */
@media (max-width: 440px) {
    #aw-wrapper.aw-pos-bottom-right,
    #aw-wrapper.aw-pos-bottom-left { bottom: .8rem !important; }
    #aw-wrapper.aw-pos-bottom-right,
    #aw-wrapper.aw-pos-top-right   { right: .8rem !important; }
    #aw-wrapper.aw-pos-bottom-left,
    #aw-wrapper.aw-pos-top-left    { left:  .8rem !important; }
    #aw-wrapper .aw-panel {
        width:     calc(100vw - 1.6rem) !important;
        max-height: 80vh !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    #aw-wrapper .aw-panel,
    #aw-wrapper .aw-toggle { transition: none !important; }
}
