/* =====================================================================================================
   ONEVIEW — slog »Studio« (2026-10-21, Elvira izbrala predlog A): čist, miren videz po zgledu sodobnih
   pisarniških orodij. Bele (v temni temi grafitne) plavajoče kartice z mehko senco, ena barva poudarka
   (modra onedrone.si), orodja z napisom pod ikono, panel Sloji in orodna okna kot lebdeče kartice,
   seznami brez okvirjev (ločnice, gumbi vrstice ob miški), pisava Inter, številke JetBrains Mono.
   Naložena ZADNJA (za svetla*.css) — vsa pravila imajo predpono :root[data-tema], da premagajo starejša.
   Barve so SAMO v žetonih --ov-* spodaj (svetla / temna); pravila jih le uporabljajo.
   ===================================================================================================== */
:root[data-tema="svetla"] {
  --ov-povrsina: #ffffff;
  --ov-povrsina-2: #f4f5f7;
  --ov-povrsina-3: #eceef1;
  --ov-rob: #e4e7ec;
  --ov-rob-mocan: #d0d5dd;
  --ov-besedilo: #101828;
  --ov-besedilo-2: #344054;
  --ov-tiho: #667085;
  --ov-bledo: #98a2b3;
  --ov-poudarek: #0085b6;
  --ov-poudarek-mocan: #006d96;
  --ov-poudarek-ozadje: #e6f3f8;
  --ov-senca: 0 1px 2px rgba(16, 24, 40, .06), 0 8px 24px rgba(16, 24, 40, .10);
  --ov-senca-mala: 0 1px 2px rgba(16, 24, 40, .06), 0 4px 12px rgba(16, 24, 40, .08);
  --ov-tip: #101828;
  --ov-tip-besedilo: #ffffff;
  --ov-nevarno: #d92d20;
  --ov-nevarno-ozadje: #fef3f2;
}
:root[data-tema="temna"] {
  --ov-povrsina: #161b22;
  --ov-povrsina-2: #1e242d;
  --ov-povrsina-3: #262d37;
  --ov-rob: #2a313c;
  --ov-rob-mocan: #3a4350;
  --ov-besedilo: #e6edf3;
  --ov-besedilo-2: #c9d1d9;
  --ov-tiho: #8b949e;
  --ov-bledo: #6e7681;
  --ov-poudarek: #2ea6d9;
  --ov-poudarek-mocan: #4fb6e2;
  --ov-poudarek-ozadje: rgba(46, 166, 217, .16);
  --ov-senca: 0 1px 2px rgba(0, 0, 0, .3), 0 10px 28px rgba(0, 0, 0, .45);
  --ov-senca-mala: 0 1px 2px rgba(0, 0, 0, .3), 0 4px 14px rgba(0, 0, 0, .4);
  --ov-tip: #e6edf3;
  --ov-tip-besedilo: #0d1117;
  --ov-nevarno: #f85149;
  --ov-nevarno-ozadje: rgba(248, 81, 73, .14);
}
/* skupni žetoni starih slogov → slog Studio (vse, kar jih uporablja, sledi) */
:root[data-tema][data-tema] {
  --bg-panel: var(--ov-povrsina);
  --bg-input: var(--ov-povrsina-2);
  --bg-input-focus: var(--ov-povrsina-3);
  --border: var(--ov-rob);
  --border-strong: var(--ov-rob-mocan);
  --text: var(--ov-besedilo);
  --text-dim: var(--ov-tiho);
  --accent: var(--ov-poudarek);
  --accent-2: var(--ov-poudarek-mocan);
  --accent-warn: var(--ov-poudarek);
  --radius: 14px;
  --radius-sm: 8px;
  --shadow: var(--ov-senca);
  --font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --okno-bg: var(--ov-povrsina);
  --okno-rob: var(--ov-rob);
  --okno-senca: var(--ov-senca);
  --tip-bg: var(--ov-tip);
  --r-okno: 14px; --r-meni: 10px; --r-gumb: 8px; --r-polje: 8px; --r-tip: 8px;
}
:root[data-tema] #scene-vignette { display: none; }
:root[data-tema] select option { background: var(--ov-povrsina); color: var(--ov-besedilo); }
:root[data-tema="svetla"] select { color-scheme: light; }

/* ---------- 1) orodna vrstica: kartica, ikona + napis ---------- */
:root[data-tema] :is(body:not(.vdelava), body.vdelava-poln) #toolbar {
  left: 12px; top: 12px; width: 76px; padding: 8px 6px; box-sizing: border-box;
  background: var(--ov-povrsina); border: 1px solid var(--ov-rob); border-radius: 14px; box-shadow: var(--ov-senca);
  -webkit-backdrop-filter: none; backdrop-filter: none; text-shadow: none; font-family: var(--font);
}
:root[data-tema] :is(body:not(.vdelava), body.vdelava-poln) #toolbar .tb-header {
  display: flex; justify-content: center; padding-bottom: 6px; margin-bottom: 4px; border-bottom: 1px solid var(--ov-rob);
}
:root[data-tema] :is(body:not(.vdelava), body.vdelava-poln) #toolbar .measure-grid { gap: 2px; }
:root[data-tema] :is(body:not(.vdelava), body.vdelava-poln) #toolbar .measure-btn {
  width: 64px; height: 56px; gap: 4px; padding: 0; border: 0; border-radius: 10px;
}
:root[data-tema] :is(body:not(.vdelava), body.vdelava-poln) #toolbar .measure-btn .mb-lbl {
  display: block; font: 500 10.5px/1.1 var(--font); max-width: 60px; text-align: center;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
:root[data-tema] :is(body:not(.vdelava), body.vdelava-poln) #toolbar > #btn-vec { margin: 2px auto 0; }
:root[data-tema] #toolbar .measure-btn, :root[data-tema] #toolbar .measure-btn:not(.active) {
  background: transparent; color: var(--ov-besedilo-2); box-shadow: none; border-color: transparent;
}
:root[data-tema] #toolbar .measure-btn .mb-lbl { color: var(--ov-tiho); }
:root[data-tema] #toolbar .measure-btn .mb-ic { opacity: 1; }
:root[data-tema] #toolbar .measure-btn .mb-ic svg { filter: none; }
:root[data-tema] #toolbar .measure-btn:not(.active):hover { background: var(--ov-povrsina-2); }
:root[data-tema] #toolbar .measure-btn.active { background: var(--ov-poudarek-ozadje); color: var(--ov-poudarek); box-shadow: none; }
:root[data-tema] #toolbar .measure-btn.active .mb-ic, :root[data-tema] #toolbar .measure-btn.active .mb-lbl { color: var(--ov-poudarek); }
:root[data-tema] #toolbar .measure-btn.active .mb-lbl { font-weight: 600; }
:root[data-tema] :is(body:not(.vdelava), body.vdelava-poln) #toolbar .measure-btn.active::after {
  top: 10px; left: -6px; right: auto; width: 3px; height: 36px; border-radius: 0 3px 3px 0; background: var(--ov-poudarek); box-shadow: none;
}
:root[data-tema] body.vdelava:not(.vdelava-poln) #toolbar .measure-btn.active::after { display: none; }
:root[data-tema] #toolbar .icon-btn { background: transparent; border: 0; color: var(--ov-tiho); }
:root[data-tema] #toolbar .icon-btn:hover { background: var(--ov-povrsina-2); color: var(--ov-besedilo); }
:root[data-tema] #toolbar .tool-btn { font-family: var(--font); }
/* v portalu je zgoraj levo gumb nazaj (okvir portala) */
:root[data-tema] body.v-portalu:not(.vdelava) #toolbar { top: 66px; }
/* razprta »Več«: vrstica v dva stolpca (sicer bi z napisi segla čez zaslon) */
@media (min-width: 601px) {
  :root[data-tema] body:not(.vdelava) #toolbar:has(#orodja-vec:not(.hidden)) { width: 144px; }
  :root[data-tema] body:not(.vdelava) #toolbar:has(#orodja-vec:not(.hidden)) .measure-grid:not(.hidden) { display: grid; grid-template-columns: repeat(2, 64px); justify-content: center; }
  :root[data-tema] body:not(.vdelava) #toolbar:has(#orodja-vec:not(.hidden)) #orodja-vec { margin-top: 2px; padding-top: 4px; border-top: 1px solid var(--ov-rob); }
}
/* vdelava (manjša vodoravna vrstica): le barve kartice */
:root[data-tema] body.vdelava:not(.vdelava-poln) #toolbar {
  background: var(--ov-povrsina); border: 1px solid var(--ov-rob); box-shadow: var(--ov-senca-mala); text-shadow: none;
  -webkit-backdrop-filter: none; backdrop-filter: none;
}

/* ---------- 2) panel Sloji: lebdeča kartica ---------- */
@media (min-width: 601px) {
  :root[data-tema] #stranski-panel { top: 12px; right: 12px; bottom: 12px; border: 1px solid var(--ov-rob); border-radius: 14px; overflow: hidden; }
  :root[data-tema] .sp-rocaj { left: -1px; }
}
:root[data-tema] #stranski-panel {
  background: var(--ov-povrsina); box-shadow: var(--ov-senca); color: var(--ov-besedilo);
  font-family: var(--font); font-size: 12px; -webkit-backdrop-filter: none; backdrop-filter: none;
}
:root[data-tema] .sp-glava { padding: 13px 14px 11px; border-bottom: 1px solid var(--ov-rob); color: var(--ov-besedilo); }
:root[data-tema] .sp-naslov { font: 600 14px var(--font); letter-spacing: 0; text-transform: none; }
:root[data-tema] #panel-zlozi { background: transparent; border: 0; color: var(--ov-tiho); border-radius: 6px; }
:root[data-tema] #panel-zlozi:hover { background: var(--ov-povrsina-2); color: var(--ov-besedilo); }
:root[data-tema] .sp-vsebina { padding: 4px 12px 14px; }
:root[data-tema] .sp-vsebina::-webkit-scrollbar-thumb { background: var(--ov-rob-mocan); border: 2px solid var(--ov-povrsina); }
/* razdelki ločeni s tanko črto (namesto kartic) */
:root[data-tema] .sp-sekcija { margin: 0; padding: 8px 0 10px; border-bottom: 1px solid var(--ov-rob); }
:root[data-tema] .sp-sekcija:last-child, :root[data-tema] .sp-sekcija:has(+ #powered-by) { border-bottom: 0; }
:root[data-tema] #stranski-panel .base2d-title {
  font: 600 11px var(--font); color: var(--ov-tiho); letter-spacing: .02em; text-transform: none; opacity: 1; margin: 6px 2px 4px;
}
:root[data-tema] #stranski-panel .row { font: 500 12.5px var(--font); color: var(--ov-besedilo-2); padding: 5px 4px; margin: 0; border-radius: 7px; }
:root[data-tema] #stranski-panel label.row:hover { background: var(--ov-povrsina-2); }
:root[data-tema] #stranski-panel input[type=checkbox] { accent-color: var(--ov-poudarek); width: 15px; height: 15px; }
:root[data-tema] #stranski-panel input[type=range] { accent-color: var(--ov-poudarek); }
/* izbirne vrstice (podlaga, multispektralno, termalno, DEM, oblak točk): brez temne kartice */
@supports selector(:has(*)) {
  :root[data-tema] :is(#base2d-row, #multi-row, #thermo-row, #dem-row, #pnts-row) {
    background: transparent; border: 0; border-radius: 0; padding: 4px 0 6px; margin-top: 4px;
    -webkit-backdrop-filter: none; backdrop-filter: none; border-top: 1px solid var(--ov-rob);
  }
  :root[data-tema] :is(#base2d-row, #multi-row, #thermo-row, #dem-row, #pnts-row):first-child { border-top: 0; margin-top: 0; }
  :root[data-tema] :is(#base2d-row, #multi-row, #thermo-row, #dem-row, #pnts-row) .row:has(input[type="radio"]) {
    color: var(--ov-besedilo-2); font: 500 12.5px var(--font); padding: 6px 8px 6px 26px; margin: 1px 0;
  }
  :root[data-tema] :is(#base2d-row, #multi-row, #thermo-row, #dem-row, #pnts-row) .row:has(input[type="radio"])::before { left: 10px; }
  :root[data-tema] :is(#base2d-row, #multi-row, #thermo-row, #dem-row, #pnts-row) .row:has(input[type="radio"]):hover { background: var(--ov-povrsina-2); color: var(--ov-besedilo); }
  :root[data-tema] :is(#base2d-row, #multi-row, #thermo-row, #dem-row, #pnts-row) .row:has(input[type="radio"]:checked) {
    background: var(--ov-poudarek-ozadje); color: var(--ov-poudarek); border-color: transparent; box-shadow: none;
  }
  :root[data-tema] :is(#base2d-row, #multi-row, #thermo-row, #dem-row, #pnts-row) .row:has(input[type="radio"]:checked)::before {
    background: var(--ov-poudarek); border-color: var(--ov-poudarek); opacity: 1; box-shadow: none;
  }
}
:root[data-tema] :is(#thermo-row, #multi-row, #dem-row) :is(.thermo-legend, .multi-legend, .dem-legend) { color: var(--ov-tiho); }
/* Sloji › Meritve: vrstice brez okvirja, gumbi ob miški (na dotik vedno vidni) */
:root[data-tema] .mer-vrsta {
  background: transparent; border: 0; border-radius: 8px; margin: 0; padding: 6px 6px; font: 500 12.5px var(--font); color: var(--ov-besedilo);
}
:root[data-tema] .mer-vrsta:hover { background: var(--ov-povrsina-2); }
:root[data-tema] .mer-vrsta.izbrana { background: var(--ov-poudarek-ozadje); box-shadow: none; }
:root[data-tema] .mer-vred { font-family: var(--font-mono); font-size: 11.5px; color: var(--ov-tiho); }
:root[data-tema] .mer-avtor { color: var(--ov-tiho); }
:root[data-tema] .mer-gumb { color: var(--ov-bledo); }
:root[data-tema] .mer-gumb:hover { background: var(--ov-povrsina-3); color: var(--ov-besedilo); }
:root[data-tema] .mer-gumb.brisi:hover { background: var(--ov-nevarno-ozadje); color: var(--ov-nevarno); }
@media (hover: hover) {
  :root[data-tema] .mer-vrsta .mer-gumb { display: none; }
  :root[data-tema] .mer-vrsta:hover .mer-gumb, :root[data-tema] .mer-vrsta.izbrana .mer-gumb, :root[data-tema] .mer-vrsta:focus-within .mer-gumb { display: inline-flex; }
}
:root[data-tema] .mer-podrobno { color: var(--ov-tiho); }
:root[data-tema] .mer-podrobno b, :root[data-tema] .mer-skupaj b { color: var(--ov-besedilo); }
:root[data-tema] .mer-skupaj { border-top: 1px solid var(--ov-rob); color: var(--ov-tiho); }
/* DXF načrti v panelu */
:root[data-tema] #stranski-panel #nacrti-panel { background: transparent; border: 0; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
/* Prenesi (vrh panela) = glavni gumb */
:root[data-tema] #stranski-panel #btn-download {
  background: var(--ov-poudarek); color: #fff; border: 0; border-radius: 8px; font: 600 12.5px var(--font); box-shadow: none;
  text-transform: none; letter-spacing: 0;
}
:root[data-tema] #stranski-panel #btn-download:hover { background: var(--ov-poudarek-mocan); }
:root[data-tema] #stranski-panel #btn-download :is(.dl-ic, .dl-chev) { color: #fff; }
:root[data-tema] #stranski-panel #download-wrap { margin: 10px 0 6px; }
:root[data-tema] #stranski-panel #powered-by { border-top: 1px solid var(--ov-rob); background: var(--ov-povrsina); }
/* zavihek »Sloji« ob zloženem panelu in plavajoči Prenesi */
:root[data-tema] #panel-odpri, :root[data-tema] body > #download-wrap #btn-download {
  background: var(--ov-povrsina); border: 1px solid var(--ov-rob); box-shadow: var(--ov-senca-mala); color: var(--ov-besedilo-2);
  font: 600 12px var(--font); border-radius: 10px; -webkit-backdrop-filter: none; backdrop-filter: none;
}
:root[data-tema] #panel-odpri:hover, :root[data-tema] body > #download-wrap #btn-download:hover { border-color: var(--ov-rob-mocan); background: var(--ov-povrsina-2); }

/* ---------- 3) plavajoče kontrole ---------- */
:root[data-tema] :is(#compass, #pogled-bar, #tema-gumb, #jezik-gumb, #status-srs, #koord, #btn-rotate, #btn-expand) {
  background: var(--ov-povrsina); border: 1px solid var(--ov-rob); box-shadow: var(--ov-senca-mala); color: var(--ov-besedilo-2);
  -webkit-backdrop-filter: none; backdrop-filter: none;
}
:root[data-tema] :is(#tema-gumb, #jezik-gumb):hover { background: var(--ov-povrsina-2); border-color: var(--ov-rob-mocan); }
:root[data-tema] #pogled-bar { border-radius: 12px; padding: 5px; gap: 2px; }
:root[data-tema] #pogled-bar > button { background: transparent; border: 0; color: var(--ov-besedilo-2); border-radius: 8px; }
:root[data-tema] #pogled-bar > button:hover { background: var(--ov-povrsina-2); color: var(--ov-poudarek); }
:root[data-tema] #view-toggle { background: var(--ov-povrsina-2); border: 0; border-radius: 9px; padding: 2px; box-shadow: none; }
:root[data-tema] #view-toggle button { background: transparent; color: var(--ov-tiho); border: 0; border-radius: 7px; font: 600 12px var(--font); }
:root[data-tema] #view-toggle button.active { background: var(--ov-povrsina); color: var(--ov-besedilo); box-shadow: var(--ov-senca-mala); }
:root[data-tema] :is(#status-srs, #koord) { color: var(--ov-tiho); border-radius: 8px; }
:root[data-tema] #koord:hover { border-color: var(--ov-poudarek); }
:root[data-tema] .cesium-viewer-fullscreenContainer { border-radius: 8px; overflow: hidden; box-shadow: var(--ov-senca-mala); border: 1px solid var(--ov-rob); }
:root[data-tema] .cesium-viewer-fullscreenContainer .cesium-button { background: var(--ov-povrsina); border: 0; fill: var(--ov-besedilo-2); }
:root[data-tema] .cesium-viewer-fullscreenContainer .cesium-button:hover { background: var(--ov-povrsina-2); box-shadow: none; }
:root[data-tema] #compass .compass-ring { fill: var(--ov-povrsina); stroke: var(--ov-rob); }
:root[data-tema] #compass .needle-n { fill: #d92d20; }
:root[data-tema] #compass :is(.needle-s, .rose-minor) { fill: var(--ov-bledo); }
:root[data-tema] #compass .compass-dot { fill: var(--ov-povrsina); }
:root[data-tema] #compass .rose-lbl { fill: var(--ov-tiho); font-family: var(--font); }
:root[data-tema] #compass .rose-n { fill: #d92d20; }

/* ---------- 4) okna, meniji, namigi ---------- */
:root[data-tema] :is(#solar-panel, #insp-panel, #profil-panel, #ann-info, #solar-info, #obrez-panel, #vol-panel, #pov-panel, #dxf-fino, #poravnava-korak, #result, .dxf-srs-box) {
  background: var(--ov-povrsina); border-color: var(--ov-rob); box-shadow: var(--ov-senca); color: var(--ov-besedilo);
  -webkit-backdrop-filter: none; backdrop-filter: none; font-family: var(--font);
}
:root[data-tema] #poravnava-korak { border-color: var(--ov-poudarek); }
/* zasidrana orodna okna: lebdeča kartica kot Sloji */
@media (min-width: 701px) {
  :root[data-tema] body.orodje-desno :is(#vol-panel, #pov-panel, #profil-panel, #solar-panel, #insp-panel) {
    top: 12px; right: 12px; bottom: 12px; border: 1px solid var(--ov-rob); border-radius: 14px; box-shadow: var(--ov-senca);
  }
}
:root[data-tema] :is(.pp-naslov, .ann-info-title, .dxf-srs-box .base2d-title, #jpg-bg .base2d-title, #vnos-bg .base2d-title) {
  font: 600 15px var(--font); color: var(--ov-besedilo); letter-spacing: 0;
}
:root[data-tema] :is(.pp-stat, #solar-panel .sol-podnaslov) { color: var(--ov-tiho); font-family: var(--font); }
:root[data-tema] :is(#annot-menu, #primerjava-menu, #izvoz-menu, #download-menu, #cmp-view-menu, .info-pop) {
  background: var(--ov-povrsina); border: 1px solid var(--ov-rob); box-shadow: var(--ov-senca); color: var(--ov-besedilo);
  -webkit-backdrop-filter: none; backdrop-filter: none;
}
:root[data-tema] :is(#annot-menu, #izvoz-menu, #download-menu) :is(button, a) { color: var(--ov-besedilo-2); font-family: var(--font); }
:root[data-tema] :is(#annot-menu, #izvoz-menu, #download-menu) :is(button, a):hover { background: var(--ov-povrsina-2); color: var(--ov-besedilo); }
:root[data-tema] :is(#toast, #tb-tip, #cmp-tip, #multi-tip, #dem-tip, #pp-namig) {
  background: var(--ov-tip); color: var(--ov-tip-besedilo); border: 0; box-shadow: var(--ov-senca-mala); font-family: var(--font);
}
/* gumbi v oknih: sekundarni (obrobljen) in primarni (moder) */
:root[data-tema] :is(.sol-gumbi button, .sol-nav button, .dxf-srs-gumba button, .obrez-dodaj, .sol-ovire-gumbi button, .sol-elek-vrsta button, .sol-premik button,
  #ann-info-photos, #ann-info-delete, #si-porocilo, .vp-gumbi button, .vp-osnove button, #pp-kopiraj, #pp-csv, #pv-kopiraj, #pv-csv) {
  font-family: var(--font); background: var(--ov-povrsina); color: var(--ov-besedilo-2); border: 1px solid var(--ov-rob-mocan); box-shadow: 0 1px 2px rgba(16, 24, 40, .05);
}
:root[data-tema] :is(.sol-gumbi button, .sol-nav button, .dxf-srs-gumba button, .obrez-dodaj, .sol-ovire-gumbi button, .sol-elek-vrsta button, .sol-premik button,
  #ann-info-photos, #ann-info-delete, #si-porocilo, .vp-gumbi button, .vp-osnove button, #pp-kopiraj, #pp-csv, #pv-kopiraj, #pv-csv):hover { background: var(--ov-povrsina-2); border-color: var(--ov-rob-mocan); }
:root[data-tema] :is(.sol-gumbi button:not(.sec), .sol-nav button:not(.sec), #solar-panel .sol-gumbi button:not(.sec), #dxf-srs-ok, #jpg-ok, #vnos-ok, #pk-shrani, #obrez-shrani, #pv-volumen) {
  background: var(--ov-poudarek); border-color: var(--ov-poudarek); color: #fff;
}
:root[data-tema] :is(.sol-gumbi button:not(.sec), .sol-nav button:not(.sec), #solar-panel .sol-gumbi button:not(.sec), #dxf-srs-ok, #jpg-ok, #vnos-ok, #pk-shrani, #obrez-shrani, #pv-volumen):hover {
  background: var(--ov-poudarek-mocan); border-color: var(--ov-poudarek-mocan);
}
:root[data-tema] #ann-info-delete:hover { background: var(--ov-nevarno-ozadje); border-color: var(--ov-nevarno); color: var(--ov-nevarno); }
:root[data-tema] :is(.sol-obrazec select, .sol-obrazec input, .dxf-srs-box select, .dxf-srs-box input, .sol-elek-vrsta select, #vol-panel select, #vol-panel input[type=text]) {
  background: var(--ov-povrsina); color: var(--ov-besedilo); border: 1px solid var(--ov-rob-mocan); font-family: var(--font);
}
:root[data-tema] :is(#sol-zapri, #sol-zlozi, #pp-zapri, #ann-info-close, #si-zapri, #vp-zapri, #pv-zapri, #insp-zapri) { color: var(--ov-tiho); }
:root[data-tema] :is(#sol-zapri, #sol-zlozi, #pp-zapri, #ann-info-close, #si-zapri, #vp-zapri, #pv-zapri, #insp-zapri):hover { background: var(--ov-povrsina-2); color: var(--ov-besedilo); }

:root[data-tema="svetla"] #solar-panel .sol-gumbi .sol-risi.aktiven { background: #fffaeb; border-color: #f79009; color: #b54708; }
:root[data-tema="temna"] #solar-panel .sol-gumbi .sol-risi.aktiven { background: rgba(247, 144, 9, .15); border-color: #f79009; color: #fdb022; }

/* ---------- 4b) majhni / nizki zasloni: orodja se ne smejo prekrivati s kontrolami spodaj levo (Elvira 2026-10-21) ---------- */
@media (min-width: 601px) {
  /* tema, jezik in celozaslonski način v ENI vrstici nad oznako KS (prej naloženi do 150 px visoko) */
  :root[data-tema] .cesium-viewer-fullscreenContainer { bottom: 44px !important; left: 12px !important; }
  :root[data-tema] #jezik-gumb { bottom: 44px; left: 50px; height: 30px; box-sizing: border-box; }
  :root[data-tema] #tema-gumb { bottom: 44px; left: 114px; height: 30px; box-sizing: border-box; }
  /* orodna vrstica nikoli čez to vrstico (zgoraj 12 px, spodaj ~86 px); če res zmanjka prostora, se pomakne znotraj sebe */
  :root[data-tema] body:not(.vdelava) #toolbar { max-height: calc(100vh - 98px); overflow-y: auto; overflow-x: hidden; scrollbar-width: thin; }
  :root[data-tema] body.v-portalu:not(.vdelava) #toolbar { max-height: calc(100vh - 152px); }
}
/* nižji zaslon: manjši gumbi orodij */
@media (min-width: 601px) and (max-height: 860px) {
  :root[data-tema] :is(body:not(.vdelava), body.vdelava-poln) #toolbar .measure-btn { height: 48px; gap: 3px; }
  :root[data-tema] :is(body:not(.vdelava), body.vdelava-poln) #toolbar .measure-btn .mb-ic svg { width: 18px; height: 18px; }
  :root[data-tema] :is(body:not(.vdelava), body.vdelava-poln) #toolbar .measure-btn .mb-lbl { font-size: 10px; }
  :root[data-tema] :is(body:not(.vdelava), body.vdelava-poln) #toolbar .measure-btn.active::after { top: 8px; height: 32px; }
}
/* zelo nizek zaslon: samo ikone (naziv v namigu), ožja vrstica */
@media (min-width: 601px) and (max-height: 700px) {
  :root[data-tema] :is(body:not(.vdelava), body.vdelava-poln) #toolbar { width: 58px; padding: 6px 4px; }
  :root[data-tema] body:not(.vdelava) #toolbar:has(#orodja-vec:not(.hidden)) { width: 104px; }
  :root[data-tema] body:not(.vdelava) #toolbar:has(#orodja-vec:not(.hidden)) .measure-grid:not(.hidden) { grid-template-columns: repeat(2, 46px); }
  :root[data-tema] :is(body:not(.vdelava), body.vdelava-poln) #toolbar .measure-btn { width: 46px; height: 40px; }
  :root[data-tema] :is(body:not(.vdelava), body.vdelava-poln) #toolbar .measure-btn .mb-lbl { display: none; }
  :root[data-tema] :is(body:not(.vdelava), body.vdelava-poln) #toolbar .measure-btn.active::after { left: -4px; top: 8px; height: 24px; }
}

/* ---------- 5) telefon: orodja le z ikonami, paneli ob robu ---------- */
@media (max-width: 600px) {
  :root[data-tema] :is(body:not(.vdelava), body.vdelava-poln) #toolbar { width: 52px; padding: 5px 4px; border-radius: 12px; }
  :root[data-tema] :is(body:not(.vdelava), body.vdelava-poln) #toolbar .measure-btn { width: 42px; height: 40px; }
  :root[data-tema] :is(body:not(.vdelava), body.vdelava-poln) #toolbar .measure-btn .mb-lbl { display: none; }
  :root[data-tema] :is(body:not(.vdelava), body.vdelava-poln) #toolbar .measure-btn.active::after { left: -4px; top: 8px; height: 24px; }
}

/* ---------- 6) vodič ob prvem odprtju (js/vodic.js) ---------- */
#vodic { position: fixed; inset: 0; z-index: 2000; pointer-events: none; font-family: var(--font); }
#vodic .vodic-luc {
  position: fixed; border-radius: 14px; box-shadow: 0 0 0 9999px rgba(16, 24, 40, .45), 0 0 0 2px var(--ov-poudarek);
  transition: left .25s ease, top .25s ease, width .25s ease, height .25s ease;
}
#vodic .vodic-luc.brez { box-shadow: 0 0 0 9999px rgba(16, 24, 40, .45); }
#vodic .vodic-kartica {
  position: fixed; width: 320px; box-sizing: border-box; pointer-events: auto; padding: 16px 16px 14px;
  background: var(--ov-povrsina); color: var(--ov-besedilo); border: 1px solid var(--ov-rob); border-radius: 14px; box-shadow: var(--ov-senca);
  transition: left .25s ease, top .25s ease;
}
#vodic .vodic-kartica.sredina { left: 50% !important; top: 50% !important; transform: translate(-50%, -50%); width: 380px; }
#vodic .vodic-korak { font: 600 11px var(--font); color: var(--ov-poudarek); letter-spacing: .04em; margin-bottom: 4px; }
#vodic .vodic-naslov { font: 600 16px var(--font); margin-bottom: 6px; }
#vodic .vodic-besedilo { margin: 0 0 14px; font-size: 13px; line-height: 1.5; color: var(--ov-besedilo-2); }
#vodic .vodic-gumbi { display: flex; align-items: center; gap: 8px; }
#vodic .vodic-pike { display: flex; gap: 5px; margin-right: auto; }
#vodic .vodic-pike i { width: 6px; height: 6px; border-radius: 50%; background: var(--ov-rob-mocan); }
#vodic .vodic-pike i.aktivna { background: var(--ov-poudarek); width: 16px; border-radius: 3px; }
#vodic .vodic-gumbi button { font: 600 12.5px var(--font); border-radius: 8px; padding: 7px 14px; cursor: pointer; }
#vodic .vodic-presk { background: transparent; border: 0; color: var(--ov-tiho); }
#vodic .vodic-presk:hover { color: var(--ov-besedilo); background: var(--ov-povrsina-2); }
#vodic .vodic-naprej { background: var(--ov-poudarek); border: 1px solid var(--ov-poudarek); color: #fff; }
#vodic .vodic-naprej:hover { background: var(--ov-poudarek-mocan); }
@media (max-width: 600px) {
  #vodic .vodic-kartica, #vodic .vodic-kartica.sredina { left: 8px !important; right: 8px; top: auto !important; bottom: 12px; width: auto; transform: none; }
}