/* POT: GLOBALNO/vmesnik/slogi/postavitve.css | VERZIJA: v002 2026-10-22
 * NAMEN: več postavitev prikaza + prijaznost (Damir: »več postavitev«, »stran ljudem prijazna«).
 * Izbira: Pomoč (Alt+H / gumb ?) → »Prikaz strani«; shrani se v brskalnik (vodic.js → atributi na <html>).
 *   data-postavitev = kompaktna | berilna | velika     --vodic-pisava = 0.9 … 1.4
 *   data-kontrast (visok kontrast)                      data-mirno (brez animacij)
 * SPREMEMBA 2026-10-22 (Damir: »izboljšaj videz in odzivnost«): dodan
 *   - scroll-padding-top, da skok na sidro (#orodja, #kozmicni-senzorji …) ne
 *     skoči pod lepljivo glavo,
 *   - scroll-margin-top za sidra v vsebini,
 *   - en izvor resnice za fokus (:focus-visible) in preskok na vsebino,
 *   - skok na sidro pri gumbih, ki imajo svoj #cilj. */

html{font-size:calc(100% * var(--vodic-pisava, 1))}

/* 2026-10-22: skok na sidro mora upoštevati lepljivo glavo in pod-navigacijo.
   --rob-glava je ~glava + pod-navigacija; mobilno je manjši (mobilno.css). */
html{scroll-padding-top:var(--rob-glava,96px);scroll-behavior:smooth}
:target{scroll-margin-top:var(--rob-glava,96px)}
section[id],div[id]{scroll-margin-top:var(--rob-glava,96px)}

/* Preskok na vsebino: viden ob fokusu, vedno dosegljiv s tipkovnico. */
.preskok{position:fixed;left:1rem;top:-5rem;z-index:1000;padding:.7rem 1.1rem;border-radius:12px;
  background:var(--zlata);color:#17120a;font-weight:700;box-shadow:var(--senca);transition:top .18s ease}
.preskok:focus{top:1rem}

/* ---------- KOMPAKTNA: več vsebine na zaslonu ---------- */
html[data-postavitev="kompaktna"] .odsek,html[data-postavitev="kompaktna"] .hero{padding-top:1.2rem;padding-bottom:1.2rem}
html[data-postavitev="kompaktna"] .mreza{gap:.6rem}
html[data-postavitev="kompaktna"] .kartica{padding:.85rem}
html[data-postavitev="kompaktna"] .kartica p{margin:.3rem 0}
html[data-postavitev="kompaktna"] h1{font-size:clamp(1.6rem,4vw,2.4rem)}
html[data-postavitev="kompaktna"] .hero-orbita{transform:scale(.7)}
html[data-postavitev="kompaktna"] .kartica{min-height:0}

/* ---------- BERILNA: en stolpec, mirno, za branje ---------- */
html[data-postavitev="berilna"] main.glavna{max-width:780px;margin-inline:auto}
html[data-postavitev="berilna"] main.glavna .mreza,html[data-postavitev="berilna"] main.glavna [class*="kartice-"]{grid-template-columns:minmax(0,1fr)!important}
html[data-postavitev="berilna"] main.glavna p,html[data-postavitev="berilna"] main.glavna li{line-height:1.8;font-size:1.06em}
html[data-postavitev="berilna"] .hero-orbita,html[data-postavitev="berilna"] .tunel-globina{display:none}
html[data-postavitev="berilna"] .modul-branje{grid-template-columns:minmax(0,1fr)}
html[data-postavitev="berilna"] .modul-kazalo{position:static;max-height:none}
html[data-postavitev="berilna"] .pod-navigacija{display:none}

/* ---------- VELIKA: večji gumbi in črke (otroci, starejši, dotik) ---------- */
html[data-postavitev="velika"]{font-size:calc(118% * var(--vodic-pisava, 1))}
html[data-postavitev="velika"] .gumb,html[data-postavitev="velika"] button,html[data-postavitev="velika"] select,html[data-postavitev="velika"] input{min-height:3rem;font-size:1.05rem}
html[data-postavitev="velika"] .gumb{padding:.8rem 1.4rem}
html[data-postavitev="velika"] main a:not(.gumb):not(.kartica){text-decoration:underline;text-underline-offset:.2em}
html[data-postavitev="velika"] .kartica{padding:1.4rem}
html[data-postavitev="velika"] .vodic-gumb{width:3.4rem;height:3.4rem;font-size:1.5rem}
html[data-postavitev="velika"] .tema-cip,html[data-postavitev="velika"] .filter,html[data-postavitev="velika"] .cips span{min-height:2.6rem}

/* ---------- VISOK KONTRAST ---------- */
html[data-kontrast]{--besedilo:#000;--muted:#222;--rob:rgba(0,0,0,.6);--povrsina:#fff;--povrsina2:#fff;--ozadje:#fff;--ozadje2:#f2f2f2;--zlata:#6b3c00}
html[data-kontrast] body{background:#fff!important;color:#000}
html[data-kontrast] a{color:#0033aa}
html[data-kontrast] .gumb.primarni{background:#000!important;color:#fff!important}
html[data-kontrast] :focus-visible{outline:3px solid #0033aa!important;outline-offset:2px}
@media (prefers-color-scheme:dark){html[data-kontrast]{--besedilo:#fff;--muted:#eee;--rob:rgba(255,255,255,.7);--povrsina:#000;--povrsina2:#000;--ozadje:#000;--ozadje2:#111;--zlata:#ffd24d}
 html[data-kontrast] body{background:#000!important;color:#fff}html[data-kontrast] a{color:#8cc8ff}html[data-kontrast] .gumb.primarni{background:#fff!important;color:#000!important}}

/* ---------- BREZ ANIMACIJ ---------- */
html[data-mirno] *,html[data-mirno] *::before,html[data-mirno] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}

/* ---------- PRIJAZNOST: splošno ---------- */
:focus-visible{outline:2px solid var(--fokus,var(--zlata));outline-offset:3px;border-radius:8px}
.vodic-prikaz label{display:grid;gap:.25rem;margin:.4rem 0}
.vodic-prikaz .vodic-kljukica{display:flex;gap:.5rem;align-items:center}
.vodic-prikaz select,.vodic-prikaz input[type=range]{width:100%}

/* Tunel: druga postavitev »Hitri pregled« (vsi koraki na eni strani) */
.tunel.tunel-pregled{align-items:start;display:block;padding-top:5rem}
.tunel.tunel-pregled .tunel-korak{display:block!important;margin:0 auto 2.5rem;padding:1.4rem;border:1px solid rgba(255,255,255,.15);border-radius:20px;background:rgba(10,8,30,.55);animation:none}
.tunel.tunel-pregled .tunel-korak h1{font-size:clamp(1.4rem,3.5vw,2rem)}
.tunel.tunel-pregled [data-tunel-naprej],.tunel.tunel-pregled [data-tunel-nazaj],.tunel.tunel-pregled .tunel-namig{display:none}
.tunel-postavitev{background:transparent;color:#b9b0d8;border:1px solid rgba(255,255,255,.25);border-radius:999px;padding:.35rem .8rem;cursor:pointer;font-size:.85rem}