/* NEMONET – pasek ułatwień dostępu. Port _a11y-toolbar.scss z motywu Europa Systems.
   Klasy stanu siedzą na <html> (patrz komentarz w a11y-toolbar.js).
   Kolor i font ustawiane przez zmienne: --na11y-accent, --na11y-font. */

html.na11y-grayscale { filter: grayscale(1); }
html.na11y-negative  { filter: invert(1); }

html.na11y-high-contrast body,
html.na11y-high-contrast body *:not(#na11y):not(#na11y *):not(#ncm):not(#ncm *) {
  background: #000 !important;
  background-color: #000 !important;
  background-image: none !important;
  color: #fff !important;
  text-shadow: none !important;
  box-shadow: none !important;
}
html.na11y-high-contrast a,
html.na11y-high-contrast a * { color: #ff0 !important; }
html.na11y-high-contrast img { filter: grayscale(1) contrast(1.2); }

html.na11y-light body,
html.na11y-light body *:not(#na11y):not(#na11y *):not(#ncm):not(#ncm *) {
  background: #fff !important;
  background-color: #fff !important;
  background-image: none !important;
  color: #000 !important;
  text-shadow: none !important;
}
html.na11y-light a,
html.na11y-light a * { color: #0000c0 !important; }

html.na11y-high-contrast button, html.na11y-high-contrast input, html.na11y-high-contrast select, html.na11y-high-contrast textarea,
html.na11y-light button, html.na11y-light input, html.na11y-light select, html.na11y-light textarea {
  border: 1px solid currentColor !important;
}

html.na11y-underline a,
html.na11y-underline a * { text-decoration: underline !important; }

html.na11y-readable body,
html.na11y-readable body *:not(svg):not(svg *):not(i):not([class^="icon"]) {
  font-family: Verdana, Tahoma, Arial, sans-serif !important;
  font-stretch: normal !important;
}

/* WCAG 1.4.12 – odstępy tekstu */
html.na11y-spacing body *:not(#na11y *) {
  line-height: 1.8 !important;
  letter-spacing: .12em !important;
  word-spacing: .16em !important;
}
html.na11y-spacing p { margin-bottom: 2em !important; }

/* WCAG 2.2.2 / 2.3.3 – zatrzymanie ruchu */
html.na11y-no-anim *, html.na11y-no-anim *::before, html.na11y-no-anim *::after {
  animation: none !important;
  transition: none !important;
  scroll-behavior: auto !important;
}

/* ── pasek ─────────────────────────────────────────────────────────── */
#na11y {
  position: fixed;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  z-index: 999997;
  font-family: var(--na11y-font, inherit);
  text-align: left;
  line-height: 1.3;
}
#na11y.na11y-pos-left { right: auto; left: 0; }

.na11y-sr {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}

#na11y-toggle {
  display: flex; align-items: center; justify-content: center;
  width: 48px; height: 48px; padding: 0; border: 0;
  border-radius: 6px 0 0 6px;
  background: var(--na11y-accent, #0d4465);
  color: #fff;
  cursor: pointer;
}
#na11y.na11y-pos-left #na11y-toggle { border-radius: 0 6px 6px 0; }
#na11y-toggle:hover { filter: brightness(1.15); }
#na11y-toggle:focus-visible { outline: 3px solid var(--na11y-accent, #0d4465); outline-offset: 3px; }

#na11y-panel {
  position: absolute;
  top: 50%;
  right: 56px;
  transform: translateY(-50%);
  width: 280px;
  max-height: calc(100vh - 32px);
  overflow-y: auto;
  box-sizing: border-box;
  padding: 18px;
  background: #fff;
  color: #13222e;
  border: 1px solid #dfe4e8;
  border-radius: 8px;
  box-shadow: 0 24px 64px -16px rgba(8, 28, 43, .4);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
#na11y-panel[hidden] { display: none; }
#na11y.na11y-pos-left #na11y-panel { right: auto; left: 56px; }

.na11y-title {
  margin: 0 0 6px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--na11y-accent, #0d4465);
}
.na11y-size { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }

.na11y-btn {
  display: flex; align-items: center; justify-content: space-between;
  width: 100%; min-height: 44px; margin: 0; padding: 0 14px;
  font: 700 14px/1.2 var(--na11y-font, inherit);
  text-align: left;
  color: #13222e;
  background: #fff;
  border: 1.5px solid #dfe4e8;
  border-radius: 6px;
  cursor: pointer;
}
.na11y-btn:hover { border-color: var(--na11y-accent, #0d4465); }
.na11y-btn:focus-visible { outline: 3px solid var(--na11y-accent, #0d4465); outline-offset: 2px; }
.na11y-btn:disabled { opacity: .45; cursor: default; }
.na11y-btn-big { justify-content: center; font-size: 18px; }
.na11y-btn-minus { font-size: 15px; }
/* Stan włączony czytelny także bez koloru (np. w skali szarości) – stąd znacznik ✓. */
.na11y-btn[aria-pressed="true"] { background: var(--na11y-accent, #0d4465); border-color: var(--na11y-accent, #0d4465); color: #fff; }
.na11y-btn[aria-pressed="true"]::after { content: "✓"; }
.na11y-btn-reset { margin-top: 6px; justify-content: center; background: #f3f6f8; }
.na11y-statement { margin-top: 4px; font-size: 13px; color: var(--na11y-accent, #0d4465); text-align: center; }

/* Telefon: środek krawędzi to pas, po którym się przewija – przycisk do dolnego rogu.
   Wysokość dolnego odstępu ustawiana zmienną, gdy motyw ma dolny pasek akcji. */
@media (max-width: 767px) {
  #na11y { top: auto; bottom: var(--na11y-bottom, 12px); right: 12px; transform: none; }
  #na11y.na11y-pos-left { right: auto; left: 12px; }
  #na11y-toggle { border-radius: 50%; box-shadow: 0 2px 10px rgba(0, 0, 0, .3); }
  #na11y-panel { top: auto; bottom: 56px; right: 0; transform: none; width: min(280px, calc(100vw - 24px)); max-height: calc(100vh - 160px); }
  #na11y.na11y-pos-left #na11y-panel { right: auto; left: 0; }
  #na11y.na11y-hide-mobile:not(.is-open) #na11y-toggle { display: none; }
}

@media print { #na11y { display: none !important; } }
