/* ZD Šentjur – Orodje za dostopnost (panel + učinki). Uporablja se v prototipu in v child temi. */

/* ---------- plavajoči gumb in panel ---------- */
.zda-fab { position: fixed; left: 16px; bottom: 16px; z-index: 99999; width: 52px; height: 52px; border-radius: 50%; border: 0; background: #0B3D6E; color: #fff; cursor: pointer; box-shadow: 0 4px 16px rgba(0,0,0,.25); display: inline-flex; align-items: center; justify-content: center; }
.zda-fab svg { width: 30px; height: 30px; }
.zda-fab:hover { background: #082C50; }
.zda-fab:focus-visible { outline: 3px solid #FFB300; outline-offset: 2px; }
@media (max-width: 640px) { .zda-fab { bottom: 84px; left: 12px; width: 46px; height: 46px; } }

.zda-panel { position: fixed; left: 16px; bottom: 80px; z-index: 100000; width: 360px; max-width: calc(100vw - 32px); max-height: calc(100vh - 100px); overflow-y: auto; background: #fff; color: #1B2431; border-radius: 16px; box-shadow: 0 12px 40px rgba(0,0,0,.3); padding: 14px; font: 14px/1.4 "Inter", "Segoe UI", system-ui, Arial, sans-serif; box-sizing: border-box; }
.zda-panel *, .zda-panel *::before { box-sizing: border-box; }
.zda-panel[hidden] { display: none; }
@media (max-width: 640px) { .zda-panel { bottom: 140px; left: 12px; } }
.zda-head { display: flex; align-items: center; gap: 6px; margin-bottom: 10px; }
.zda-head h2 { margin: 0; font-size: 15px; font-weight: 700; color: #0B3D6E; flex: 1; }
.zda-icon { width: 36px; height: 36px; border-radius: 50%; border: 0; background: #E6F0FA; color: #0B3D6E; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.zda-icon svg { width: 18px; height: 18px; }
.zda-icon:hover { background: #d3e4f6; }
.zda-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-bottom: 8px; }
.zda-btn { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; min-height: 76px; padding: 8px 4px; border: 2px solid #D9E2EC; border-radius: 12px; background: #F4F7FB; color: #1B2431; font: inherit; font-size: 12px; font-weight: 600; text-align: center; cursor: pointer; line-height: 1.15; }
.zda-btn svg { width: 24px; height: 24px; color: #0B3D6E; }
.zda-btn:hover { border-color: #1F6FB8; }
.zda-btn--active { background: #0B3D6E; border-color: #0B3D6E; color: #fff; }
.zda-btn--active svg { color: #fff; }
.zda-panel button:focus-visible { outline: 3px solid #FFB300; outline-offset: 2px; }
.zda-ranges { display: grid; gap: 6px; }
.zda-range { display: grid; grid-template-columns: 1fr auto 36px 36px; align-items: center; gap: 6px; background: #F4F7FB; border: 2px solid #D9E2EC; border-radius: 12px; padding: 6px 6px 6px 10px; }
.zda-range__label { font-weight: 600; font-size: 13px; }
.zda-range output { font-variant-numeric: tabular-nums; font-size: 12px; color: #55657A; min-width: 52px; text-align: right; }
.zda-step { width: 36px; height: 36px; border-radius: 50%; border: 0; background: #0B3D6E; color: #fff; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.zda-step svg { width: 16px; height: 16px; }
.zda-step:hover { background: #082C50; }
.zda-live { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); margin: 0; }

/* Prekrivna plast s filtri (pretvori barve, enobarvno, nasičenost) – panel in gumb ostaneta nad njo. */
.zda-overlay { position: fixed; inset: 0; z-index: 99998; pointer-events: none; }
.zda-overlay[hidden] { display: none; }

/* ---------- temen / svetel kontrast ---------- */
html.zda-dark, html.zda-dark body, html.zda-dark body *:not(.zda-panel):not(.zda-panel *):not(.zda-fab):not(.zda-fab *):not(img):not(svg):not(svg *):not(video) { background-color: #000 !important; background-image: none !important; color: #fff !important; border-color: #777 !important; box-shadow: none !important; }
html.zda-dark a:not(.zda-panel a) { color: #ffe95c !important; text-decoration: underline !important; }
html.zda-dark button:not(.zda-panel button):not(.zda-fab), html.zda-dark input, html.zda-dark select, html.zda-dark textarea { color: #fff !important; background: #111 !important; border: 1px solid #aaa !important; }
html.zda-dark svg:not(.zda-panel svg):not(.zda-fab svg) { color: #ffe95c !important; fill: currentColor; }

html.zda-light, html.zda-light body, html.zda-light body *:not(.zda-panel):not(.zda-panel *):not(.zda-fab):not(.zda-fab *):not(img):not(svg):not(svg *):not(video) { background-color: #fff !important; background-image: none !important; color: #000 !important; border-color: #444 !important; box-shadow: none !important; }
html.zda-light a:not(.zda-panel a) { color: #0000cc !important; text-decoration: underline !important; }
html.zda-light svg:not(.zda-panel svg):not(.zda-fab svg) { color: #000 !important; fill: currentColor; }
html.zda-light button:not(.zda-panel button):not(.zda-fab) { border: 2px solid #000 !important; }

/* ---------- označene povezave / glave ---------- */
html.zda-links a:not(.zda-panel a) { outline: 3px solid #ff9800 !important; outline-offset: 1px; background: #fff3c4 !important; color: #000 !important; text-decoration: underline !important; }
html.zda-titles h1, html.zda-titles h2, html.zda-titles h3, html.zda-titles h4, html.zda-titles h5, html.zda-titles h6 { outline: 3px dashed #D7282F !important; outline-offset: 2px; background: #ffe3e3 !important; color: #000 !important; }
html.zda-titles .zda-panel h2 { outline: 0 !important; background: none !important; color: #0B3D6E !important; }

/* ---------- bralni način ---------- */
html.zda-readmode img:not(.zda-panel img), html.zda-readmode video, html.zda-readmode iframe, html.zda-readmode picture { display: none !important; }
html.zda-readmode body *:not(.zda-panel):not(.zda-panel *):not(.zda-fab) { background-image: none !important; box-shadow: none !important; text-shadow: none !important; animation: none !important; transition: none !important; }
html.zda-readmode body { font-size: 1.1em !important; line-height: 1.8 !important; }
html.zda-readmode .hero, html.zda-readmode .zd-hero-media { min-height: 0 !important; }
html.zda-readmode .hero-media { display: none !important; }

/* ---------- bralnik zaslona: kazalec ---------- */
html.zda-reader body { cursor: help; }
html.zda-reader p:hover, html.zda-reader li:hover, html.zda-reader h1:hover, html.zda-reader h2:hover, html.zda-reader h3:hover, html.zda-reader a:hover, html.zda-reader td:hover { outline: 2px solid #1F6FB8; outline-offset: 2px; }

/* ---------- višina vrstice / razmik črk ---------- */
html[data-zda-lh] body *:not(.zda-panel):not(.zda-panel *) { line-height: var(--zda-lh) !important; }
html[data-zda-ls] body *:not(.zda-panel):not(.zda-panel *) { letter-spacing: var(--zda-ls) !important; }

@media (prefers-reduced-motion: reduce) { .zda-fab, .zda-btn, .zda-icon { transition: none; } }
@media print { .zda-fab, .zda-panel, .zda-overlay { display: none !important; } }
