/* Čarobni december 2026 – oblikovni sistem
   Barve, logotip in okraski so iz celostne grafične podobe Čarobnega decembra (static/cgp/):
   temno zelena podlaga, zelena vejica, rdeča in rumena zvezda. Temni »oder« za glave in poudarke,
   svetla, berljiva vsebina za uradne dele. */
@import url("/static/fonts/pisave.css");

:root {
  /* barve */
  --noc: #08301c;          /* CGP: temno zelena podlaga */
  --noc-2: #0d3d26;
  --noc-3: #155234;
  --luc: #fec00f;          /* CGP: rumena zvezda */
  --luc-2: #ffe08e;        /* CGP: svetlo rumena */
  --izabela: #c8191f;      /* CGP: rdeča zvezda (za besedilo malo temnejša) */
  --izabela-2: #e0484c;
  --tlak: #ffe08e;         /* svetli poudarki na temni podlagi */
  --polje: #009444;        /* CGP: zelena vejica */
  --cgp-zelena: #009444;
  --cgp-rdeca: #d32024;
  /* odtenki, ki se med različicama videza razlikujejo (»diskretno« jih spodaj nastavi drugače) */
  --noc-rgb: 8, 48, 28;
  --luc-rgb: 254, 192, 15;
  --tlak-rgb: 255, 224, 142;
  --vrh-alfa: .97;
  --naslovnica-sij: rgba(0, 148, 68, .38);
  --odstevalnik-ozadje: rgba(13, 61, 38, .78);
  --piramida-sij: #0f4428;
  --akcent-mehko: #fdecec;
  --karta-l1: #ef4b4f;  --karta-l2: #2fc06a;  --karta-d1: #ef4b4f;  --karta-d2: #fec00f;
  --kartica-l1: var(--cgp-rdeca);
  --mraz: #eef1f6;         /* ozadje vsebine */
  --papir: #ffffff;
  --crnilo: #13202f;
  --siva: #5b6b7f;
  --crta: #d9dfe8;
  --ok: #1e7a4c;  --ok-soft: #e3f3ea;
  --warn: #8a5a00; --warn-soft: #fff3d6;
  --err: #b42318; --err-soft: #fdecea;

  /* stara imena (uporabljajo jih skripte) */
  --primary: var(--noc);
  --primary-soft: #e6ebf3;
  --akcent: var(--izabela);
  --ink: var(--crnilo);
  --muted: var(--siva);
  --line: var(--crta);
  --bg: var(--mraz);
  --surface: var(--papir);
  --focus: #2f7bd8;

  /* tipografija */
  --f-naslov: "Big Shoulders Display", "Arial Narrow", Impact, sans-serif;
  --f-besedilo: "Hanken Grotesk", "Segoe UI", system-ui, sans-serif;
  --f-koda: "IBM Plex Mono", Consolas, monospace;

  --r: 18px;
  --r-mali: 10px;
  --senca: 0 1px 2px rgba(var(--noc-rgb), .05), 0 8px 24px -12px rgba(var(--noc-rgb), .18);
  --sirina: 1180px;
}

/* ------------------------------------------------------------------ različica videza »diskretno«
   Prejšnja nočna stran (nočno modra, zlata luč, rožnati tlak, izabela); CGP le diskretno.
   Izbere se z ?videz=diskretno (strežnik doda <html data-videz="…">). */
html[data-videz="diskretno"] {
  --noc: #0c1626;  --noc-2: #14223a;  --noc-3: #22324f;
  --luc: #f4b942;  --luc-2: #ffd27a;
  --izabela: #7a2e5e;  --izabela-2: #b0588d;
  --tlak: #e7a9a1;  --polje: #4e7a55;
  --noc-rgb: 12, 22, 38;  --luc-rgb: 244, 185, 66;  --tlak-rgb: 231, 169, 161;
  --vrh-alfa: .86;
  --naslovnica-sij: rgba(122, 46, 94, .45);
  --odstevalnik-ozadje: rgba(20, 34, 58, .72);
  --piramida-sij: #1b2c4a;
  --akcent-mehko: #f5e8f0;
  --karta-l1: #e7a9a1;  --karta-l2: #f4b942;  --karta-d1: #b0588d;  --karta-d2: #b0588d;
  --kartica-l1: #e7a9a1;
}
html[data-videz="diskretno"] .naslovnica::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96'%3E%3Cg fill='none' stroke='%23e7a9a1'%3E%3Crect x='.5' y='.5' width='95' height='95' stroke-opacity='.22'/%3E%3Crect x='24.5' y='24.5' width='47' height='47' stroke-opacity='.12'/%3E%3C/g%3E%3Ccircle cx='.5' cy='.5' r='1.6' fill='%23f4b942' fill-opacity='.75'/%3E%3C/svg%3E"); }
html[data-videz="diskretno"] .glava::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96'%3E%3Cg fill='none' stroke='%23e7a9a1'%3E%3Crect x='.5' y='.5' width='95' height='95' stroke-opacity='.18'/%3E%3Crect x='24.5' y='24.5' width='47' height='47' stroke-opacity='.1'/%3E%3C/g%3E%3C/svg%3E"); }
/* naslovnica vstopne strani: v različici CGP logotip, v »diskretno« velik napis kot prej */
.samo-diskretno { display: none; }
html[data-videz="diskretno"] .samo-cgp { display: none; }
html[data-videz="diskretno"] .samo-diskretno { display: inline; }
html[data-videz="diskretno"] .oder-uvod h1.logotip-uvod { display: block; padding-top: .12em; }
html[data-videz="diskretno"] .oder-uvod h1.logotip-uvod .leto { font-size: inherit; line-height: inherit; margin: 0; }


*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 84px; }
body {
  margin: 0; background: var(--mraz); color: var(--crnilo);
  font: 400 1rem/1.6 var(--f-besedilo); font-feature-settings: "ss01", "tnum" 0;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: var(--izabela); text-underline-offset: 3px; }
a:hover { color: var(--noc); }
h1, h2, h3, h4 { margin: 0 0 .5rem; line-height: 1.1; }
h2 { font: 800 clamp(1.7rem, 3vw, 2.3rem)/1 var(--f-naslov); text-transform: uppercase; letter-spacing: .01em; }
h3 { font-size: 1.08rem; font-weight: 700; }
p { margin: 0 0 .8rem; }
::selection { background: var(--luc-2); color: var(--noc); }
:focus-visible { outline: 3px solid var(--luc); outline-offset: 2px; }
.skrito { display: none !important; }
.koda, code { font-family: var(--f-koda); }
.nadnaslov { font: 700 .76rem/1.2 var(--f-besedilo); letter-spacing: .18em; text-transform: uppercase; color: var(--izabela); margin: 0 0 .7rem; }

/* ------------------------------------------------------------------ zgornja vrstica */
.vrh {
  position: sticky; top: 0; z-index: 50;
  display: flex; align-items: center; gap: 18px;
  padding: 10px max(16px, calc((100vw - var(--sirina)) / 2));
  background: rgba(var(--noc-rgb), var(--vrh-alfa)); backdrop-filter: saturate(1.4) blur(12px);
  -webkit-backdrop-filter: saturate(1.4) blur(12px);
  border-bottom: 1px solid rgba(var(--tlak-rgb), .14);
}
.znak { display: flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; flex: none; }
.znak svg { width: 34px; height: 34px; }
/* celoten logotip: zgoraj na strani spodnji del z zvezdami visi čez rob glave, ob pomiku se pomanjša v glavo */
.znak .znak-logo { display: block; height: 104px; width: auto; margin: 0 0 -58px; filter: drop-shadow(0 4px 10px rgba(0, 0, 0, .35));
  transition: height .25s ease, margin .25s ease; }
.vrh.pomanjsan .znak .znak-logo { height: 56px; margin: -4px 0 -6px; }
.znak b { display: block; font: 800 1.15rem/1 var(--f-naslov); text-transform: uppercase; letter-spacing: .04em; }
.znak small { display: block; font-size: .98rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--tlak); margin-top: 2px; }
@media (max-width: 1120px) { .znak small { font-size: .82rem; letter-spacing: .1em; } }
.meni { display: flex; gap: 2px; margin-left: auto; overflow-x: auto; scrollbar-width: none; }
.meni::-webkit-scrollbar { display: none; }
.meni a {
  color: rgba(255, 255, 255, .78); text-decoration: none; font-weight: 600; font-size: .9rem;
  padding: 8px 12px; border-radius: 999px; white-space: nowrap;
}
.meni a:hover { color: #fff; background: rgba(255, 255, 255, .08); }
.meni a.aktivna { color: var(--luc); }
.vrh .gumb.zlat { flex: none; padding: 9px 18px; font-size: .92rem; }
@media (max-width: 860px) {
  .vrh { flex-wrap: wrap; row-gap: 6px; }
  .meni { order: 3; width: 100%; margin-left: 0; justify-content: space-between; }
  .meni a { padding: 7px 8px; font-size: .84rem; }
  .vrh .gumb.zlat { margin-left: auto; }
  .znak small { display: none; }
  .znak .znak-logo, .vrh.pomanjsan .znak .znak-logo { height: 62px; margin: -4px 0; }
}
/* šest gumbov v meniju (s Programom) gre v širino tudi na ozkem telefonu */
@media (max-width: 420px) { .meni a { padding: 7px 4px; font-size: .79rem; } }

/* ------------------------------------------------------------------ naslovnica podstrani */
.naslovnica {
  position: relative; overflow: hidden; color: #fff; background: var(--noc);
  padding: 56px max(16px, calc((100vw - var(--sirina)) / 2)) 64px;
  isolation: isolate;
}
/* na širšem zaslonu zvezde logotipa visijo čez glavo: naslovnica podstrani se začne nekoliko nižje */
@media (min-width: 861px) { .naslovnica { padding-top: 80px; } }
.naslovnica::before {                     /* raster tlaka Titovega trga */
  content: ""; position: absolute; inset: -60%; z-index: -2;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96'%3E%3Cg fill='none' stroke='%23ffe08e'%3E%3Crect x='.5' y='.5' width='95' height='95' stroke-opacity='.22'/%3E%3Crect x='24.5' y='24.5' width='47' height='47' stroke-opacity='.12'/%3E%3C/g%3E%3Ccircle cx='.5' cy='.5' r='1.6' fill='%23fec00f' fill-opacity='.75'/%3E%3C/svg%3E");
  transform: rotate(-21.7deg);
}
.naslovnica::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: radial-gradient(90% 120% at 85% 0%, var(--naslovnica-sij), transparent 60%),
              linear-gradient(180deg, rgba(var(--noc-rgb), .2), var(--noc) 96%);
}
.naslovnica .nadnaslov { color: var(--tlak); }
.naslovnica h1 {
  font: 800 clamp(2.6rem, 7vw, 5.6rem)/.9 var(--f-naslov); text-transform: uppercase; letter-spacing: -.005em;
  max-width: 18ch; margin: 0;
}
.naslovnica .uvod { max-width: 62ch; color: rgba(255, 255, 255, .78); font-size: 1.08rem; margin: 16px 0 0; }

/* ------------------------------------------------------------------ osnovni gradniki */
main { max-width: var(--sirina); margin: 0 auto; padding: 36px 16px 64px; }
.pas { max-width: var(--sirina); margin: 0 auto; padding: 72px 16px; }
.pas-temen { background: var(--noc); color: #fff; }
.pas-temen .nadnaslov { color: var(--tlak); }

.kartica {
  background: var(--papir); border: 1px solid rgba(19, 32, 47, .06); border-radius: var(--r);
  box-shadow: var(--senca); padding: 28px; margin-bottom: 18px;
}
.kartica > h2 { display: flex; align-items: center; gap: 12px; font-size: clamp(1.5rem, 2.4vw, 1.9rem); }
.kartica > h2 .st {
  flex: none; display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 50%;
  background: var(--noc); color: var(--luc); font: 700 .95rem/1 var(--f-koda); letter-spacing: 0;
}
.pod { color: var(--siva); font-size: .93rem; }
@media (max-width: 640px) { .kartica { padding: 20px; border-radius: 14px; } }

.gumb, button {
  font: 700 .95rem/1.2 var(--f-besedilo); cursor: pointer; text-decoration: none;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 11px 20px; border-radius: 999px; border: 1.5px solid transparent;
  background: var(--noc); color: #fff; transition: transform .15s, background .15s, box-shadow .15s;
}
.gumb:hover, button:hover { color: #fff; background: #1a2b45; }
.gumb:active, button:active { transform: translateY(1px); }
button:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.gumb.zlat, button.zlat { background: var(--luc); color: var(--noc); box-shadow: 0 0 0 0 rgba(var(--luc-rgb), .5); }
.gumb.zlat:hover, button.zlat:hover { background: var(--luc-2); color: var(--noc); box-shadow: 0 0 28px -4px rgba(var(--luc-rgb), .7); }
.gumb.drugi, button.drugi { background: transparent; color: var(--noc); border-color: rgba(19, 32, 47, .22); }
.gumb.drugi:hover, button.drugi:hover { background: var(--noc); color: #fff; border-color: var(--noc); }
.gumb.prosojen { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .35); }
.gumb.prosojen:hover { background: rgba(255, 255, 255, .1); color: #fff; border-color: #fff; }
button.nevarno { background: var(--err); }
button.nevarno:hover { background: #8f1c13; }
button.velik, .gumb.velik { padding: 16px 30px; font-size: 1.05rem; }
.puscica::after { content: "→"; transition: transform .15s; }
.gumb:hover .puscica::after, .puscica:hover::after { transform: translateX(3px); }

/* obrazci */
.mreza { display: grid; grid-template-columns: repeat(12, 1fr); gap: 16px 18px; }
.mreza > * { min-width: 0; }
.p12 { grid-column: span 12; } .p8 { grid-column: span 8; } .p6 { grid-column: span 6; }
.p4 { grid-column: span 4; } .p3 { grid-column: span 3; }
@media (max-width: 700px) { .p8, .p6, .p4, .p3 { grid-column: span 12; } }
label { display: block; font-weight: 700; font-size: .88rem; margin-bottom: 6px; }
label .obv { color: var(--err); }
label .znacka {
  font-weight: 700; font-size: .68rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ok);
  background: var(--ok-soft); border-radius: 999px; padding: 2px 8px; margin-left: 6px; vertical-align: 1px;
}
input[type=text], input[type=email], input[type=tel], input[type=number], input[type=password],
input[type=date], input[type=datetime-local], select, textarea {
  width: 100%; max-width: 100%; font: inherit; color: inherit;
  padding: 11px 13px; border: 1.5px solid #cdd5e0; border-radius: var(--r-mali); background: #fbfcfe;
  transition: border-color .15s, box-shadow .15s, background .15s;
}
input:hover, select:hover, textarea:hover { border-color: #aab6c6; }
input:focus, select:focus, textarea:focus {
  outline: none; border-color: var(--noc); background: #fff; box-shadow: 0 0 0 4px rgba(var(--luc-rgb), .35);
}
textarea { min-height: 92px; resize: vertical; }
select { max-width: 100%; }
input.samodejno { background: #f2faf5; border-color: #9fd3b6; }
input.napaka, textarea.napaka, select.napaka { border-color: var(--err); background: var(--err-soft); }
.namig { font-size: .82rem; color: var(--siva); margin-top: 5px; }
input[type=checkbox], input[type=radio] { accent-color: var(--noc); }
input[type=file] { font: inherit; font-size: .88rem; width: 100%; max-width: 100%; color: var(--siva); }
input[type=file]::file-selector-button {
  font: 700 .85rem var(--f-besedilo); border: 1.5px solid rgba(19, 32, 47, .22); background: #fff;
  border-radius: 999px; padding: 7px 14px; margin-right: 10px; cursor: pointer;
}

.iskanje { display: flex; gap: 10px; }
.iskanje input { flex: 1; font: 500 1.35rem/1 var(--f-koda); letter-spacing: .12em; padding: 14px 16px; }

.sporocilo { border-radius: 12px; padding: 13px 16px; font-size: .95rem; margin: 14px 0 0; border-left: 4px solid transparent; }
.sporocilo.info { background: #eaf0f8; color: #1b3553; border-color: #5d82b0; }
.sporocilo.ok { background: var(--ok-soft); color: #14532d; border-color: var(--ok); }
.sporocilo.warn { background: var(--warn-soft); color: #6b3f00; border-color: var(--luc); }
.sporocilo.err { background: var(--err-soft); color: #7a1a12; border-color: var(--err); }

.oznaka { display: inline-block; font-size: .72rem; font-weight: 700; border-radius: 999px; padding: 3px 9px; white-space: nowrap; letter-spacing: .02em; }
.oznaka.ok { background: var(--ok-soft); color: var(--ok); }
.oznaka.warn { background: var(--warn-soft); color: var(--warn); }
.oznaka.err { background: var(--err-soft); color: var(--err); }
.oznaka.siva { background: #edf0f4; color: var(--siva); }
.oznaka.piramida-z { background: var(--akcent-mehko); color: var(--izabela); white-space: normal; }

/* tabele */
.tabela-ovoj { overflow-x: auto; margin: 0 -4px; }
table { width: 100%; border-collapse: collapse; font-size: .92rem; }
th, td { text-align: left; padding: 11px 10px; border-bottom: 1px solid var(--crta); vertical-align: top; }
th { font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; color: var(--siva); font-weight: 700; }
td:first-child { white-space: nowrap; }
td.st, th.st { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; font-family: var(--f-koda); font-size: .88rem; }
tr.umaknjena td { color: var(--siva); text-decoration: line-through; }
tr.zmagovalec td { background: #fff8e6; }
tr.zmagovalec td:first-child { box-shadow: inset 4px 0 0 var(--luc); }
tr.klik { cursor: pointer; }
tr.klik:hover td { background: #f5f7fb; }

/* ------------------------------------------------------------------ vstopna stran: oder */
.oder-uvod {
  position: relative; min-height: min(92vh, 900px); overflow: hidden; color: #fff; background: var(--noc);
  display: grid; align-items: end; isolation: isolate;
  padding: 120px max(16px, calc((100vw - var(--sirina)) / 2)) 56px;
}
.oder-uvod .luci { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -2; }
.oder-uvod::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(60% 55% at 72% 38%, transparent 0, rgba(var(--noc-rgb), .55) 70%),
              linear-gradient(180deg, rgba(var(--noc-rgb), .1) 30%, var(--noc) 98%);
}
.luci .celica { fill: none; stroke: var(--tlak); stroke-opacity: .3; stroke-width: 1.2; }
.luci .notranja { fill: none; stroke: var(--tlak); stroke-opacity: .17; stroke-width: 1; }
.luci .lucka { fill: var(--luc); }
.luci .lucka.utripa { animation: utrip 3.2s ease-in-out infinite; }
.luci .vetrovnica { fill: var(--tlak); opacity: .55; }
@keyframes utrip { 0%, 100% { opacity: .95; } 50% { opacity: .18; } }
.oder-uvod h1 {
  margin: 0; padding-top: .12em; font: 900 clamp(4rem, 13vw, 11.5rem)/.84 var(--f-naslov); text-transform: uppercase; letter-spacing: -.01em;
}
.oder-uvod .nadnaslov { margin-bottom: 1.2rem; color: var(--tlak); }
.odstevalnik .nadnaslov { color: var(--tlak); }
.oder-uvod h1 .leto { display: block; color: var(--luc); text-shadow: 0 0 42px rgba(var(--luc-rgb), .45); }
.oder-uvod h1.logotip-uvod { display: flex; align-items: flex-end; gap: clamp(10px, 2vw, 22px); padding-top: 0; }
.logotip-uvod img { display: block; width: clamp(220px, 27vw, 360px); height: auto; filter: drop-shadow(0 6px 22px rgba(0, 0, 0, .35)); }
.oder-uvod h1.logotip-uvod .leto { font-size: clamp(3.2rem, 8vw, 7rem); line-height: .8; margin-bottom: .12em; }
.oder-uvod .vodilo { max-width: 46ch; font-size: clamp(1.05rem, 1.6vw, 1.25rem); color: rgba(255, 255, 255, .84); margin: 22px 0 28px; }
.oder-uvod .akcije { display: flex; flex-wrap: wrap; gap: 12px; }
.oder-mreza { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 40px; align-items: end; }
@media (max-width: 900px) { .oder-mreza { grid-template-columns: 1fr; } }
.odstevalnik {
  background: var(--odstevalnik-ozadje); border: 1px solid rgba(var(--tlak-rgb), .22); border-radius: 22px;
  padding: 20px 22px; backdrop-filter: blur(6px);
}
.odstevalnik .nadnaslov { margin-bottom: 4px; }
.odstevalnik .datum { font-weight: 700; font-size: 1.05rem; margin-bottom: 14px; }
.stevci { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.stevci div { background: rgba(var(--noc-rgb), .75); border-radius: 12px; padding: 10px 6px; text-align: center; }
.stevci b { display: block; font: 500 clamp(1.4rem, 3vw, 2.1rem)/1 var(--f-koda); color: var(--luc); font-variant-numeric: tabular-nums; }
.stevci span { font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .6); }
.odstevalnik .stanje { font-size: .88rem; color: rgba(255, 255, 255, .72); margin: 12px 0 0; }

.prihod { opacity: 0; transform: translateY(18px); animation: prihod .8s cubic-bezier(.2, .7, .2, 1) forwards; }
.prihod.z1 { animation-delay: .1s; } .prihod.z2 { animation-delay: .25s; } .prihod.z3 { animation-delay: .4s; } .prihod.z4 { animation-delay: .55s; }
@keyframes prihod { to { opacity: 1; transform: none; } }

/* koledar */
:root { --bozic-rdeca: var(--cgp-rdeca); --bozic-zelena: var(--cgp-zelena); }
.koledar { position: relative; margin-top: 26px; }
.koledar-okras { position: absolute; right: -8px; top: -206px; width: 210px; pointer-events: none; }
.koledar-okras img { display: block; width: 100%; height: auto; }
@media (max-width: 1100px) { .koledar-okras { position: static; width: 170px; margin: -8px 0 4px auto; } }
.koledar-os, .koledar-vrsta { display: grid; grid-template-columns: 190px 1fr; gap: 16px; align-items: center; }
.koledar-vrsta { padding: 12px 0; border-top: 1px solid var(--crta); }
.koledar-vrsta .ime b { display: block; font-size: 1rem; }
.koledar-vrsta .ime span { font-size: .82rem; color: var(--siva); }
.tir { position: relative; height: 34px; background: repeating-linear-gradient(90deg, #f1f4f8 0 calc(100% / 35 - 1px), #e4e9f0 calc(100% / 35 - 1px) calc(100% / 35)); border-radius: 8px; }
.tir .obdobje { position: absolute; top: 5px; bottom: 5px; border-radius: 6px; display: flex; align-items: center; padding: 0 10px;
  font: 700 .74rem/1 var(--f-koda); color: #fff; white-space: nowrap; overflow: hidden;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 2px 6px rgba(19, 32, 47, .15); }
.tir .obdobje.L1 { background: linear-gradient(90deg, #b01a1f, var(--bozic-rdeca) 40%, #e4473f); }
.tir .obdobje.L2 { background: linear-gradient(90deg, #00733a, var(--bozic-zelena) 40%, #1fae5c); }
/* praznični dogodek kot CGP zvezda z lučko: Prižig rdeča, Silvestrovanje rumena */
.tir .dan { position: absolute; top: -9px; bottom: -9px; width: 40px; margin-left: -20px;
  background: url("/static/cgp/okrasek-rdec.png") no-repeat center / contain; filter: drop-shadow(0 2px 3px rgba(19, 32, 47, .25)); }
.tir .dan.L2 { background-image: url("/static/cgp/okrasek-rumen.png"); }
/* napis termina, ki ne gre v ozek trak (npr. na telefonu), stoji ob traku */
.tir .obdobje.zunaj { overflow: visible; }
.tir .obdobje.zunaj .napis { position: absolute; right: calc(100% + 8px); color: var(--noc); }
.tir .obdobje.zunaj.desno .napis { right: auto; left: calc(100% + 8px); }
.tir .brez { position: absolute; top: 0; bottom: 0; background: repeating-linear-gradient(45deg, rgba(255, 255, 255, .5) 0 3px, transparent 3px 7px); border-radius: 4px; }
.koledar-legenda { display: flex; align-items: center; gap: 12px; margin: 14px 0 0; padding: 10px 14px; border-radius: 12px; background: #fff; border: 1px solid var(--crta); font-size: .88rem; color: var(--siva); width: fit-content; max-width: 100%; }
.koledar-legenda b { color: var(--noc); }
.koledar-legenda .vzorec { flex: none; width: 26px; height: 26px; border-radius: 6px;
  background: repeating-linear-gradient(45deg, rgba(255, 255, 255, .55) 0 3px, transparent 3px 7px), linear-gradient(135deg, var(--bozic-rdeca), var(--bozic-zelena)); }
.koledar-os .oznake { position: relative; height: 22px; font: 500 .72rem/1 var(--f-koda); color: var(--siva); }
.koledar-os .oznake span { position: absolute; transform: translateX(-50%); white-space: nowrap; }
@media (max-width: 700px) {
  .koledar-os, .koledar-vrsta { grid-template-columns: 1fr; gap: 6px; }
  .koledar-os > :first-child { display: none; }
  .koledar-os .oznake span.dodatna { display: none; }
}

/* sklopi */
.sklopi { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 16px; margin-top: 28px; }
.sklop { position: relative; background: var(--papir); border-radius: var(--r); padding: 24px; box-shadow: var(--senca); overflow: hidden; }
.sklop::before { content: ""; position: absolute; inset: 0 0 auto; height: 5px; background: var(--c, var(--noc)); }
.sklop .vrsta { font: 700 .7rem/1 var(--f-besedilo); letter-spacing: .16em; text-transform: uppercase; color: var(--siva); }
.sklop h3 { font: 800 1.7rem/1 var(--f-naslov); text-transform: uppercase; margin: 8px 0 12px; }
.podatki-lok { display: grid; grid-template-columns: max-content 1fr; gap: 6px 14px; margin: 0; font-size: .92rem; }
.podatki-lok dt { color: var(--siva); }
.podatki-lok dd { margin: 0; }
table.urnik { width: auto; font-size: inherit; margin: 0; border-collapse: collapse; }
table.urnik th, table.urnik td { padding: 0 0 3px; border: 0; font: inherit; text-transform: none; letter-spacing: 0; color: inherit; vertical-align: baseline; }
table.urnik th { padding-right: 16px; font-weight: 600; white-space: normal; }
table.urnik td { white-space: nowrap; font-variant-numeric: tabular-nums; }
/* v ozkih karticah gre urnik čez celo širino, pod oznako */
.sklop .podatki-lok dd:has(> .urnik), .karta-plosca .podatki-lok dd:has(> .urnik) { grid-column: 1 / -1; margin-top: -2px; }
.sklop table.urnik th, .karta-plosca table.urnik th { white-space: nowrap; font-weight: 500; }
@media (max-width: 620px) { .podatki-lok dd:has(> .urnik) { grid-column: 1 / -1; margin-top: -2px; } }
.lokacija-kartica { border-top: 5px solid var(--luc); }
.lokacija-kartica.L1 { border-top-color: var(--kartica-l1); }
.lokacija-kartica.D1, .lokacija-kartica.D2 { border-top-color: var(--izabela); }

/* točke */
.tocke-trak { display: flex; height: 64px; border-radius: 14px; overflow: hidden; margin: 22px 0 12px; box-shadow: var(--senca); }
.tocke-trak div { display: flex; flex-direction: column; justify-content: center; padding: 0 14px; color: var(--noc); min-width: 0; }
.tocke-trak b { font: 800 1.6rem/1 var(--f-naslov); }
.tocke-trak span { font-size: .74rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tabeli-tock { display: grid; gap: 18px; margin-top: 22px; }
.tabeli-tock > div { min-width: 0; }
.tabeli-tock .tocke-trak { margin: 8px 0 0; }
.tabela-oznaka { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin: 0; font: 800 1.15rem/1.1 var(--f-naslov); text-transform: uppercase; color: #fff; }
.tabela-oznaka b { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: var(--luc); color: var(--noc); font-size: 1rem; }
.tabela-oznaka span { font: 500 .82rem var(--f-besedilo); text-transform: none; color: rgba(255, 255, 255, .6); }
@media (max-width: 700px) { .tabeli-tock .tocke-trak span { font-size: .62rem; } .tabeli-tock .tocke-trak div { padding: 0 6px; } .tabeli-tock .tocke-trak b { font-size: 1.25rem; } }
.dejstva { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; margin-top: 26px; }
.dejstvo { border-top: 2px solid var(--noc); padding-top: 14px; }
.dejstvo h3 { font: 800 1.35rem/1.05 var(--f-naslov); text-transform: uppercase; }
.dejstvo p { color: var(--siva); font-size: .95rem; margin: 0; }

/* vrata v podstrani */
.ploscice { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; }
.vzorec-poziv { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 20px 24px; align-items: center; margin-top: 24px; border-left: 5px solid var(--luc); }
.vzorec-poziv h2 { margin: 0 0 6px; }
.vzorec-poziv .pod { margin: 0; max-width: 60ch; }
.vzorec-ikona { width: 52px; height: 52px; color: var(--izabela); }
@media (max-width: 760px) { .vzorec-poziv { grid-template-columns: 1fr; } .vzorec-ikona { display: none; } }
.ploscica {
  position: relative; display: flex; flex-direction: column; gap: 10px; min-height: 190px; padding: 22px;
  text-decoration: none; color: #fff; background: var(--noc-2); border-radius: var(--r); overflow: hidden;
  border: 1px solid rgba(var(--tlak-rgb), .14); transition: transform .2s, border-color .2s, background .2s;
}
.ploscica::after {
  content: "→"; position: absolute; right: 20px; bottom: 16px; font-size: 1.3rem; color: var(--luc);
  transition: transform .2s;
}
.ploscica:hover { color: #fff; transform: translateY(-4px); border-color: rgba(var(--luc-rgb), .6); background: var(--noc-3); }
.ploscica:hover::after { transform: translateX(4px); }
.ploscica svg { width: 38px; height: 38px; color: var(--luc); }
.ploscica h3 { font: 800 1.55rem/1 var(--f-naslov); text-transform: uppercase; margin: auto 0 0; }
.ploscica p { margin: 0; color: rgba(255, 255, 255, .66); font-size: .88rem; padding-right: 20px; }
.ploscica.glavna { background: var(--luc); color: var(--noc); border-color: var(--luc); }
.ploscica.glavna svg, .ploscica.glavna::after { color: var(--noc); }
.ploscica.glavna p { color: rgba(var(--noc-rgb), .72); }
.ploscica.glavna:hover { background: var(--luc-2); }

.utrinki-glava { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.utrinki-puscici { display: flex; gap: 8px; flex: none; }
.utrinki-puscici button { width: 46px; height: 46px; padding: 0; font-size: 1.1rem; }
.utrinki { scrollbar-width: thin; scroll-behavior: smooth; }
.utrinki { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(240px, 32%); gap: 12px; overflow-x: auto; padding-bottom: 8px; scroll-snap-type: x mandatory; }
.utrinki button { padding: 0; border-radius: 14px; overflow: hidden; background: var(--noc-2); scroll-snap-align: start; aspect-ratio: 4 / 3; }
.utrinki img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.utrinki button:hover img { transform: scale(1.04); }

.noga {
  background: var(--noc); color: rgba(255, 255, 255, .72); font-size: .9rem;
  padding: 36px max(16px, calc((100vw - var(--sirina)) / 2)); display: flex; flex-wrap: wrap; gap: 8px 32px;
  border-top: 1px solid rgba(var(--tlak-rgb), .16);
}
.noga { position: relative; }
.noga::after { content: ""; position: absolute; right: max(12px, calc((100vw - var(--sirina)) / 2 - 20px)); top: -46px; width: 170px; height: 140px;
  background: url("/static/cgp/vejica.png") no-repeat top right / contain; transform: scaleX(-1); pointer-events: none; }
.noga .noga-logotipi { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 34px; width: 100%; }
.noga .noga-logotipi img { display: block; height: 42px; width: auto; }
@media (max-width: 700px) { .noga::after { width: 110px; height: 92px; top: -30px; } .noga .noga-logotipi img { height: 34px; } }

/* ------------------------------------------------------------------ dokumenti */
.dokument-postavitev { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 32px; align-items: start; }
.kazalo { position: sticky; top: 90px; font-size: .88rem; }
.kazalo a { display: block; color: var(--siva); text-decoration: none; padding: 6px 10px; border-left: 2px solid var(--crta); }
.kazalo a:hover, .kazalo a.aktivna { color: var(--noc); border-left-color: var(--luc); background: #fff; }
@media (max-width: 900px) { .dokument-postavitev { grid-template-columns: 1fr; } .kazalo { display: none; } }
.dokument { font-size: 1.02rem; line-height: 1.7; padding: clamp(24px, 4vw, 52px); }
.dokument h2 { margin: 2.4rem 0 1rem; font-size: clamp(1.5rem, 2.4vw, 1.9rem); display: flex; gap: 12px; align-items: baseline; }
.dokument h2:first-of-type { margin-top: .5rem; }
.dokument h3 { margin-top: 1.4rem; font: 800 1.3rem/1.1 var(--f-naslov); text-transform: uppercase; }
.dokument ol.crke { list-style: lower-alpha; }
.dokument li { margin-bottom: 8px; }
.dokument p, .dokument li { text-align: justify; -webkit-hyphens: auto; hyphens: auto; }
.dokument li::marker { color: var(--izabela); font-weight: 700; }
.dokument .poudarek { background: var(--noc); color: #fff; border-radius: var(--r); padding: 20px 24px; margin: 20px 0; }
.dokument .poudarek strong { color: var(--luc); }
.dokument .lokacija-kartica { box-shadow: none; border: 1px solid var(--crta); border-top-width: 5px; }
.orodja { display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; margin-bottom: 12px; }

table.merila { font-size: .94rem; }
table.merila tr.skupina th { background: var(--noc); color: #fff; text-transform: uppercase; letter-spacing: .02em;
  font: 800 1.2rem/1.1 var(--f-naslov); padding: 14px 12px; }
table.merila tr.skupina th.st { color: var(--luc); font: 800 1.2rem/1.1 var(--f-naslov); }
table.merila tr.uvod td { color: var(--siva); font-style: italic; background: #f7f9fc; white-space: normal; }
table.merila tr.stopnja td { padding-top: 4px; padding-bottom: 4px; border-bottom: none; color: #334; }
table.merila tr.stopnja td:first-child { padding-left: 28px; }
table.merila tr.skupaj th { font: 800 1.3rem/1 var(--f-naslov); color: var(--noc); border-top: 3px solid var(--noc); padding-top: 14px; }
table.merila td:first-child { white-space: normal; }
table.merila ul.ukrepi { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 40px;
  margin: 10px 0 2px; padding: 0; list-style: none; color: #334; }
table.merila ul.ukrepi li { position: relative; padding-left: 16px; text-align: left; -webkit-hyphens: manual; hyphens: manual; }
table.merila ul.ukrepi li::before { content: ""; position: absolute; left: 2px; top: .62em; width: 6px; height: 6px;
  border-radius: 50%; background: var(--izabela); }
@media (max-width: 640px) { table.merila ul.ukrepi { grid-template-columns: 1fr; } }

/* ------------------------------------------------------------------ zemljevid */
.karta { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 0; background: var(--noc); border-radius: 22px;
  overflow: hidden; box-shadow: 0 30px 60px -30px rgba(var(--noc-rgb), .6); min-height: 640px; }
@media (max-width: 960px) { .karta { grid-template-columns: 1fr; } }
.karta-platno { position: relative; min-height: 520px; background: #0a1322; touch-action: none; cursor: grab; }
.karta-platno.vlece { cursor: grabbing; }
/* vlečenje zemljevida ne označuje besedila; med vlečenjem se ne označi niti besedilo ob zemljevidu */
.karta-platno, .karta-platno * { -webkit-user-select: none; user-select: none; -webkit-user-drag: none; }
.karta:has(.karta-platno.vlece) { -webkit-user-select: none; user-select: none; }
.karta-platno svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.karta-filtri { position: absolute; top: 14px; left: 14px; right: 70px; display: flex; flex-wrap: wrap; gap: 6px; z-index: 2; }
.karta-filtri button { background: rgba(20, 34, 58, .88); color: #fff; border: 1px solid rgba(255, 255, 255, .14); font-size: .82rem; padding: 7px 12px; backdrop-filter: blur(6px); }
.karta-filtri button::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--c, #fff); box-shadow: 0 0 10px var(--c, #fff); }
.karta-filtri button.aktivna { background: #fff; color: var(--noc); }
.karta-kontrole { position: absolute; top: 14px; right: 14px; display: grid; gap: 6px; z-index: 2; }
@media (max-width: 700px) {
  .karta-filtri { right: 0; padding-right: 28px; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #000 82%, transparent); mask-image: linear-gradient(90deg, #000 82%, transparent); }
  .karta-filtri::-webkit-scrollbar { display: none; }
  .karta-filtri button { flex: none; }
  .karta-kontrole { top: 58px; }
}
.karta-kontrole button { width: 40px; height: 40px; padding: 0; background: rgba(20, 34, 58, .88); border: 1px solid rgba(255, 255, 255, .14); font-size: 1.2rem; }
.karta-kontrole button:hover { background: var(--noc-3); }
.karta-predvajalnik { position: absolute; left: 14px; top: var(--p-vrh, 104px); z-index: 3; display: flex; align-items: center; gap: 8px; max-width: min(236px, calc(100% - 84px));
  padding: 4px 12px 4px 4px; border-radius: 999px; background: rgba(var(--noc-rgb), .5); color: #fff; border: 1px solid rgba(255, 255, 255, .16); backdrop-filter: blur(4px);
  opacity: .72; transition: opacity .2s, background .2s; }
.karta-predvajalnik:hover, .karta-predvajalnik:focus-within { opacity: 1; background: rgba(var(--noc-rgb), .88); }
.karta-predvajalnik #p-gumb { flex: none; width: 24px; height: 24px; padding: 0; border-radius: 50%; background: rgba(var(--luc-rgb), .9); color: var(--noc); border: 0; font-size: .56rem; line-height: 1; }
.karta-predvajalnik #p-gumb:hover { background: var(--luc-2); color: var(--noc); }
.karta-predvajalnik .p-besedilo { display: grid; gap: 3px; min-width: 0; }
.karta-predvajalnik .p-oznaka { display: none; }
.karta-predvajalnik .p-naslov { font-size: .72rem; font-weight: 600; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.karta-predvajalnik .p-trak { display: block; height: 2px; border-radius: 2px; background: rgba(255, 255, 255, .18); overflow: hidden; }
.karta-predvajalnik #p-napredek { display: block; height: 100%; width: 0; background: var(--luc); }
.karta-predvajalnik:not(.igra) .p-naslov { color: rgba(255, 255, 255, .62); }
.karta-predvajalnik.skrbnik .p-trak { height: 6px; cursor: pointer; }
.karta-orodja-glasbe { position: absolute; left: 14px; top: calc(var(--p-vrh, 104px) + 40px); z-index: 3; display: flex; flex-wrap: wrap; align-items: center; gap: 5px;
  max-width: calc(100% - 84px); padding: 6px 10px; border-radius: 12px; background: rgba(var(--noc-rgb), .88); color: #fff; border: 1px dashed rgba(var(--luc-rgb), .6); font-size: .72rem; }
.karta-orodja-glasbe b { font: 600 .78rem var(--f-koda); min-width: 34px; }
.karta-orodja-glasbe button { padding: 4px 9px; font-size: .7rem; background: rgba(255, 255, 255, .12); border: 0; color: #fff; }
.karta-orodja-glasbe button:hover { background: rgba(255, 255, 255, .25); }
.karta-orodja-glasbe button.glavni { background: var(--luc); color: var(--noc); }
.karta-orodja-glasbe #p-zacetek { color: var(--luc); font-family: var(--f-koda); }
.karta-legenda { position: absolute; right: 16px; bottom: 12px; z-index: 2; display: flex; align-items: flex-end; gap: 14px; pointer-events: none; color: rgba(238, 241, 246, .78); }
.karta-merilo { display: block; width: var(--dolzina, 80px); height: 5px; border: 1.5px solid currentColor; border-top: 0; transition: width .2s; position: relative; }
.karta-merilo::before { content: attr(data-m); position: absolute; left: 0; right: 0; bottom: 7px; text-align: center; font: 600 .7rem var(--f-koda); white-space: nowrap; }
.karta-legenda .karta-sever { position: static; width: 22px; height: 24px; }
.karta-sever path { fill: currentColor; }
.karta-sever text { font: 800 5.6px var(--f-besedilo); fill: currentColor; }
.karta-namig { position: absolute; left: 14px; right: 120px; bottom: 12px; line-height: 1.35; font-size: .74rem; color: rgba(255, 255, 255, .55); z-index: 2; pointer-events: none; }
.karta-oblacek { position: absolute; z-index: 3; pointer-events: none; background: #fff; color: var(--noc); font-size: .8rem; font-weight: 700;
  padding: 6px 10px; border-radius: 8px; transform: translate(-50%, calc(-100% - 12px)); white-space: nowrap; box-shadow: var(--senca); }
.zemljevid .z-trg { fill: #16223a; }
.zemljevid .z-tlak { fill: url(#tlak); }
.zemljevid .z-zelenica { fill: #10261f; }
.zemljevid .z-igrisce, .zemljevid .z-parkirisce { fill: #111c2e; }
.zemljevid .z-cesta { fill: none; stroke: #1a263a; stroke-width: 6; stroke-linecap: round; stroke-linejoin: round; }
.zemljevid .z-pot { fill: none; stroke: #202e46; stroke-width: 1.3; stroke-linecap: round; }
.zemljevid .z-stavba { fill: #1d2b43; stroke: #2e4062; stroke-width: .35; }
.zemljevid .z-drevo { fill: var(--luc); animation: utrip 4s ease-in-out infinite; }
.zemljevid .z-napis { font: 700 3px var(--f-besedilo); fill: rgba(238, 241, 246, .62); letter-spacing: .25px; text-transform: uppercase; pointer-events: none; }
.zemljevid .z-merilo { font: 600 3px var(--f-koda); fill: rgba(238, 241, 246, .7); }
.zemljevid .z-trg-napis { font: 800 4.2px var(--f-naslov); fill: rgba(var(--tlak-rgb), .55); letter-spacing: .8px; pointer-events: none; }
.zemljevid .z-obmocje { fill-opacity: .08; stroke-width: .7; stroke-dasharray: 1.6 1.2; transition: fill-opacity .3s, opacity .3s; }
.zemljevid .z-obmocje.L1 { fill: var(--karta-l1); stroke: var(--karta-l1); }
.zemljevid .z-obmocje.L2 { fill: var(--karta-l2); stroke: var(--karta-l2); }
.zemljevid .z-obmocje.poudarjeno { fill-opacity: .2; }
.zemljevid .z-hiska { cursor: pointer; transition: opacity .3s; }
.zemljevid .z-hiska rect.jedro { stroke: rgba(255, 255, 255, .9); stroke-width: .35; }
.zemljevid .z-hiska.L1 rect { fill: var(--karta-l1); }
.zemljevid .z-hiska.L2 rect { fill: var(--karta-l2); }
.zemljevid .z-hiska text { font: 800 2.6px var(--f-koda); fill: var(--noc); pointer-events: none; }
.zemljevid .z-hiska:hover rect.jedro, .zemljevid .z-hiska.izbrana rect.jedro { stroke: #fff; stroke-width: .9; }
.zemljevid .z-hiska:focus { outline: none; }
.zemljevid .z-hiska:focus-visible rect.jedro { stroke: #fff; stroke-width: 1.1; }
.zemljevid .z-oder rect { fill: #0c1626; stroke: rgba(255, 255, 255, .8); stroke-width: .4; }
.zemljevid .z-oder text { font: 800 2.8px var(--f-naslov); fill: #fff; letter-spacing: .4px; pointer-events: none; }
.zemljevid .z-oder.nastop rect { stroke: var(--luc); stroke-width: .5; }
.zemljevid .z-oder.nastop text { fill: var(--luc); }
.zemljevid .z-vetrovnica { fill: var(--tlak); opacity: .6; }
.zemljevid .utisano { opacity: .22; }
/* prodajni prostor za posebna dogodka: pokaže se ob izbiri dogodka, hiške na trgu se takrat skrijejo */
.zemljevid .z-prodajni { display: none; cursor: pointer; }
.zemljevid .z-prodajni:hover rect, .zemljevid .z-prodajni:focus-visible rect { fill-opacity: 1; stroke-width: .6; }
.zemljevid .z-prodajni:focus { outline: none; }
.zemljevid .z-prodajni text { pointer-events: none; }
.zemljevid.dogodek .z-prodajni { display: block; }
.zemljevid.dogodek:not(.hiske-na-dogodku) .z-hiska.na-trgu { display: none; }
.zemljevid .z-prodajni rect { fill: #f4e56a; fill-opacity: .88; stroke: #fff; stroke-width: .3; stroke-dasharray: 1.2 .8; }
.zemljevid .z-prodajni text { font: 600 1.7px var(--f-besedilo); fill: var(--noc); letter-spacing: .12px; text-transform: uppercase; }
.zemljevid .z-prodajni text.naslov { font: 800 2.4px var(--f-naslov); fill: var(--noc); letter-spacing: .3px; }
.zemljevid .z-prodajni text.naslov.manjsi { font-size: 1.9px; letter-spacing: .2px; }
.zemljevid .z-prodajni text.podnapis { font-size: 1.15px; letter-spacing: .1px; }
/* praznični prizori: vidni samo ob izbrani hiški ali prodajnem prostoru (razred .prizori) */
.zemljevid .z-prizor { opacity: 0; pointer-events: none; transition: opacity .7s ease; }
.zemljevid.prizori .z-prizor { opacity: 1; }
.zemljevid.dogodek .z-prizor .ob-hiski, .zemljevid.dogodek .z-prizor .na-prodajnem { display: none; }
.zemljevid.dogodek .z-prizor .ne-dogodek { display: none; }
.zemljevid .z-bozicek { opacity: .55; }
.zemljevid:not(.dogodek-D1) .z-prizor .samo-D1, .zemljevid:not(.dogodek-D2) .z-prizor .samo-D2 { display: none; }
.zemljevid .z-jelka { pointer-events: none; }
/* oder: na tlorisu ga je mogoče klikniti, v maketi ima ploščad, streho, reflektorje in skupino */
.zemljevid .z-oder { cursor: pointer; }
.zemljevid .z-oder:focus { outline: none; }
.zemljevid .z-oder:hover rect, .zemljevid .z-oder:focus-visible rect { stroke: #fff; stroke-width: .7; }
.zemljevid.prizori .z-oder text { display: none; }
.zemljevid.prizori .z-oder3d { pointer-events: auto; cursor: pointer; }
.zemljevid .o-stranica { fill: #7fd3ff; fill-opacity: .06; stroke: #9fe8ff; stroke-opacity: .6; stroke-width: .05; stroke-linejoin: round; }
.zemljevid .o-ploscad { fill: #7fd3ff; fill-opacity: .1; stroke: #e9fbff; stroke-opacity: .75; stroke-width: .06; stroke-linejoin: round; }
.zemljevid .o-stena { fill: #0b1220; fill-opacity: .55; stroke: #9fe8ff; stroke-opacity: .45; stroke-width: .05; stroke-linejoin: round; }
.zemljevid .o-napis { font: 800 .8px var(--f-naslov); fill: var(--luc); pointer-events: none; }
.zemljevid .o-steber { stroke: #bff0ff; stroke-opacity: .75; stroke-width: .08; stroke-linecap: round; }
.zemljevid .o-streha { fill: #7fd3ff; fill-opacity: .06; stroke: #e9fbff; stroke-opacity: .7; stroke-width: .07; stroke-linejoin: round; }
.zemljevid .o-celo { fill: #0b1220; fill-opacity: .7; stroke: #e9fbff; stroke-opacity: .8; stroke-width: .05; stroke-linejoin: round; }
.zemljevid .o-zarek { pointer-events: none; transform-box: fill-box; transform-origin: 50% 0%;
  animation: zamah 3.4s ease-in-out infinite alternate, barve 9s linear infinite; }
.zemljevid .o-zarek.z1 { animation-duration: 2.7s, 11s; animation-delay: -1.1s, -3s; }
.zemljevid .o-zarek.z2 { animation-duration: 4.1s, 8s; animation-delay: -2s, -5s; }
.zemljevid .o-zarek.z3 { animation-duration: 3s, 12s; animation-delay: -.5s, -7s; }
.zemljevid .o-zarek.z4 { animation-duration: 3.7s, 10s; animation-delay: -2.6s, -1s; }
@keyframes zamah { from { transform: rotate(-17deg); } to { transform: rotate(17deg); } }
@keyframes barve { to { filter: hue-rotate(360deg); } }
/* maketa: stavbe kot bloki in lesene hiške */
/* hologramski slog makete: ljudje in oprema so nakazani s svetlobnimi obrisi */
.zemljevid .h-obris { stroke: #e9fbff; stroke-opacity: .7; stroke-width: .025; stroke-linejoin: round; }
.zemljevid .h-glava { fill: #e9fbff; fill-opacity: .5; stroke: #e9fbff; stroke-opacity: .8; stroke-width: .02; }
.zemljevid .h-roka { fill: none; stroke: #e9fbff; stroke-opacity: .65; stroke-width: .05; stroke-linecap: round; stroke-linejoin: round; }
.zemljevid .h-tla { fill: #9fe8ff; fill-opacity: .07; stroke: #9fe8ff; stroke-opacity: .4; stroke-width: .02; }
.zemljevid .h-crta { fill: none; stroke: #9fe8ff; stroke-opacity: .55; stroke-width: .03; }
.zemljevid .h-ploskev { fill: #9fe8ff; fill-opacity: .1; stroke: #e9fbff; stroke-opacity: .75; stroke-width: .03; stroke-linejoin: round; }
.zemljevid .h-miza { fill: #0f1a2c; fill-opacity: .75; stroke: #e9fbff; stroke-opacity: .8; stroke-width: .03; stroke-linejoin: round; }
.zemljevid .h-prt { fill: #0f1a2c; fill-opacity: .82; stroke: #e9fbff; stroke-opacity: .6; stroke-width: .025; }
.zemljevid .h-naslon { fill: #0f1a2c; fill-opacity: .7; stroke: #e9fbff; stroke-opacity: .7; stroke-width: .03; }
.zemljevid .h-obrob { fill: none; stroke: #e9fbff; stroke-opacity: .85; stroke-width: .045; stroke-linejoin: round; stroke-linecap: round; }
.zemljevid .h-iskra { transform-box: fill-box; animation: iskra 1.6s ease-out infinite; }
@keyframes iskra { from { transform: translateY(0); opacity: 1; } to { transform: translateY(-1.4px); opacity: 0; } }
/* prodajne hiške v maketi: steklen volumen s toplo osvetljenima okencema */
.zemljevid.prizori .z-hiska3d { pointer-events: auto; cursor: pointer; }
/* v maketi so ploske oznake na tleh le diskretne sledi: hiške in oder stojijo v prostoru */
.zemljevid.prizori .z-hiska rect:not(.jedro) { display: none; }
.zemljevid.prizori .z-hiska rect.jedro { fill-opacity: .18; stroke-opacity: .45; stroke-width: .12; }
.zemljevid.prizori .z-hiska.izbrana rect.jedro { fill-opacity: .35; stroke: #ffd76a; stroke-width: .15; }
.zemljevid.prizori .z-oder rect { fill-opacity: 0; stroke-opacity: 0; }
.zemljevid.prizori .z-tlak { opacity: .4; }
.zemljevid.prizori .z-obmocje { fill-opacity: .04; }
.zemljevid.prizori .z-napis { fill: rgba(159, 232, 255, .4); }
/* šank na prodajnem prostoru: samo v maketi pri posebnih dogodkih; ploski rumeni pas takrat ostane le kot sled */
.zemljevid .z-sank { display: none; }
.zemljevid.prizori.dogodek .z-sank { display: block; pointer-events: auto; cursor: pointer; }
.zemljevid.prizori .z-prodajni rect { fill-opacity: .1; stroke-opacity: .35; }
.zemljevid.prizori .z-prodajni text { display: none; }
.zemljevid .s-pult { fill: #7fd3ff; fill-opacity: .16; stroke: #e9fbff; stroke-opacity: .75; stroke-width: .04; stroke-linejoin: round; }
.zemljevid .s-vrh { fill: #ffcf70; fill-opacity: .16; stroke: #ffe3a3; stroke-opacity: .85; stroke-width: .045; stroke-linejoin: round; }
.zemljevid .s-led { stroke: #ffd76a; stroke-width: .07; stroke-linecap: round; filter: drop-shadow(0 0 .25px #ffcf70); }
.zemljevid .s-streha { fill: #7fd3ff; fill-opacity: .12; stroke: #e9fbff; stroke-opacity: .7; stroke-width: .06; stroke-linejoin: round; }
.zemljevid .s-celo { fill: #0b1220; fill-opacity: .75; stroke: #e9fbff; stroke-opacity: .8; stroke-width: .04; stroke-linejoin: round; }
.zemljevid .s-napis { font: 800 .55px var(--f-naslov); fill: #ffd76a; pointer-events: none; }
.zemljevid .z-sank:hover .s-streha { fill-opacity: .16; }
.zemljevid.dogodek:not(.hiske-na-dogodku) .z-hiska3d.na-trgu { display: none; }
.zemljevid .h3-stena { fill: #7fd3ff; fill-opacity: .07; stroke: #bff0ff; stroke-opacity: .7; stroke-width: .05; stroke-linejoin: round; }
.zemljevid .h3-streha { fill: #7fd3ff; fill-opacity: .1; stroke: #e9fbff; stroke-opacity: .85; stroke-width: .06; stroke-linejoin: round; }
.zemljevid .h3-okno { fill: #ffcf70; fill-opacity: .3; stroke: #ffe3a3; stroke-opacity: .75; stroke-width: .035; }
.zemljevid .z-hiska3d.izbrana .h3-stena, .zemljevid .z-hiska3d.izbrana .h3-streha { stroke: #ffd76a; stroke-opacity: 1; }
.zemljevid .z-hiska3d.izbrana .h3-okno { fill-opacity: .55; }
.zemljevid .z-hiska3d:hover .h3-streha { fill-opacity: .2; }
.zemljevid .z-stena { fill: #7fd3ff; stroke: #9fe8ff; stroke-opacity: .3; stroke-width: .07; stroke-linejoin: round; }
.zemljevid .z-streha { fill: #7fd3ff; fill-opacity: .06; stroke: #c9f3ff; stroke-opacity: .55; stroke-width: .1; stroke-linejoin: round; }
.zemljevid.prizori .z-koca { pointer-events: auto; cursor: pointer; }
.zemljevid.dogodek:not(.hiske-na-dogodku) .z-koca.na-trgu { display: none; }
.zemljevid.prizori .z-hiska text { display: none; }
.zemljevid .z-koca-st { font: 800 10px var(--f-koda); }
.zemljevid .z-koca.izbrana .tabla { stroke-width: .12; fill-opacity: 1; }
.zemljevid .z-koca.izbrana .sij { opacity: 1; }
.zemljevid .z-okvir-napis { font: 800 10px var(--f-naslov); fill: #fff; letter-spacing: .5px; }
.zemljevid .z-zarnica.u0 { animation: zarnica 2.8s ease-in-out infinite; }
.zemljevid .z-zarnica.u1 { animation: zarnica 2.8s ease-in-out -.95s infinite; }
.zemljevid .z-zarnica.u2 { animation: zarnica 2.8s ease-in-out -1.9s infinite; }
.zemljevid .z-utrip { animation: zarnica 3.2s ease-in-out infinite; }
.zemljevid .z-plamen { animation: plamen .45s ease-in-out infinite alternate; transform-box: fill-box; transform-origin: 50% 100%; }
.zemljevid .z-ples { animation: ples .62s ease-in-out infinite alternate; transform-box: fill-box; transform-origin: 50% 100%; }
.zemljevid:not(.prizori) .z-prizor * { animation-play-state: paused; }
@keyframes zarnica { 0%, 100% { opacity: 1; } 50% { opacity: .5; } }
@keyframes plamen { from { transform: scale(1, 1); } to { transform: scale(.92, 1.12) skewX(3deg); } }
@keyframes ples { from { transform: translateY(0) rotate(-4deg); } to { transform: translateY(-.16px) rotate(4deg); } }
.karta-plosca { background: var(--papir); display: flex; flex-direction: column; max-height: 760px; overflow-y: auto; }
.karta-plosca .glava-plosce { padding: 26px 26px 18px; border-bottom: 1px solid var(--crta); }
.karta-plosca .glava-plosce .vrsta { font: 700 .7rem/1 var(--f-besedilo); letter-spacing: .16em; text-transform: uppercase; color: var(--siva); }
.karta-plosca h2 { margin: 8px 0 6px; font-size: 2rem; }
.karta-plosca .nazaj { display: inline-flex; padding: 6px 12px; margin: 0 0 14px -4px; font-size: .8rem; background: transparent; color: var(--noc); border: 1.5px solid rgba(19, 32, 47, .18); }
.karta-plosca .nazaj:hover { background: var(--noc); color: #fff; }
.karta-plosca .telo-plosce { padding: 18px 26px 26px; }
.galerija { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-top: 10px; }
.galerija button { padding: 0; aspect-ratio: 1; border-radius: 8px; overflow: hidden; background: var(--mraz); }
.galerija img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.galerija button:hover img { transform: scale(1.06); }
/* fotografije neobičajne oblike (panorama, pokončna) se ne obrežejo: cela slika na zamegljenem ozadju iz iste slike */
.galerija button.cela, .utrinki button.cela { position: relative; isolation: isolate; }
.galerija button.cela::before, .utrinki button.cela::before { content: ""; position: absolute; inset: -16px; z-index: -1;
  background: var(--slika) center / cover; filter: blur(14px) brightness(.6); }
.galerija button.cela img, .utrinki button.cela img { object-fit: contain; }
.galerija button.panorama { grid-column: 1 / -1; }
.galerija-prazna { border: 1.5px dashed var(--crta); border-radius: 12px; padding: 18px; text-align: center; color: var(--siva); font-size: .88rem; margin-top: 10px; }

/* svetlobna omarica */
.omarica { position: fixed; inset: 0; z-index: 100; background: rgba(6, 11, 20, .94); display: grid; grid-template-rows: 1fr auto; }
.omarica figure { margin: 0; display: grid; place-items: center; padding: 56px 64px 8px; min-height: 0; }
.omarica img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 8px; box-shadow: 0 30px 80px rgba(0, 0, 0, .5); }
.omarica figcaption { color: rgba(255, 255, 255, .8); text-align: center; padding: 12px 16px 24px; font-size: .9rem; }
.omarica .zapri, .omarica .prejsnja, .omarica .naslednja { position: absolute; background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .2); width: 48px; height: 48px; padding: 0; font-size: 1.3rem; }
.omarica .zapri { top: 14px; right: 14px; }
.omarica .prejsnja { left: 14px; top: 50%; }
.omarica .naslednja { right: 14px; top: 50%; }

/* ------------------------------------------------------------------ gastronomska piramida */
.piramida-oder { background: radial-gradient(70% 70% at 35% 45%, var(--piramida-sij) 0, var(--noc) 70%); color: #fff; border-radius: 26px; overflow: hidden;
  display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 0; box-shadow: 0 30px 60px -30px rgba(var(--noc-rgb), .6); }
@media (max-width: 960px) { .piramida-oder { grid-template-columns: 1fr; } }
.piramida-slika { padding: 28px 20px 16px; }
.piramida-slika svg { width: 100%; height: auto; display: block; overflow: visible; }
.p-nivo { cursor: pointer; transition: transform .35s cubic-bezier(.2, .7, .2, 1), opacity .3s, filter .3s; }
.p-nivo:hover { transform: translateY(-6px); }
.p-nivo:focus { outline: none; }
.p-nivo:focus-visible .p-sprednja { stroke: #fff; stroke-width: 3; }
.p-nivo.izbran { filter: drop-shadow(0 0 22px rgba(var(--luc-rgb), .35)); }
.piramida-oder.izbira .p-nivo:not(.izbran) { opacity: .74; filter: saturate(.8); }
.p-para { animation: para 3.4s ease-in-out infinite; }
@keyframes para { 0% { opacity: 0; transform: translateY(6px); } 40% { opacity: .9; } 100% { opacity: 0; transform: translateY(-10px); } }
.p-ime { font: 900 34px/1 var(--f-naslov); text-transform: uppercase; fill: #fff; letter-spacing: 1px; pointer-events: none; }
.p-podpis { font: 700 13px var(--f-besedilo); fill: rgba(255, 255, 255, .8); letter-spacing: 1.5px; text-transform: uppercase; pointer-events: none; }
.piramida-podrobno { background: rgba(255, 255, 255, .04); border-left: 1px solid rgba(255, 255, 255, .08); padding: 40px 36px; display: flex; flex-direction: column; }
@media (max-width: 960px) { .piramida-podrobno { border-left: none; border-top: 1px solid rgba(255, 255, 255, .08); padding: 28px 22px; } }
.piramida-podrobno .nadnaslov { color: var(--tlak); }
.piramida-podrobno h2 { font-size: clamp(2.2rem, 4vw, 3.2rem); margin-bottom: 10px; }
.piramida-podrobno p { color: rgba(255, 255, 255, .72); }
.jedi { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 0; padding: 0; list-style: none; }
.jedi li { background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .14); border-radius: 999px; padding: 7px 14px; font-size: .9rem; }
.jedi li.vrh-j { border-color: rgba(var(--luc-rgb), .55); }
.podskupine { display: grid; gap: 14px; margin-top: 8px; }
.podskupine h4 { font: 700 .72rem/1 var(--f-besedilo); letter-spacing: .16em; text-transform: uppercase; color: var(--tlak); margin: 0 0 8px; }
.podskupine .jedi { margin: 0; }
.podskupine .jedi li { font-size: .82rem; padding: 5px 11px; }
.obveza-trak { display: grid; grid-template-columns: auto 1fr; gap: 18px; align-items: center; margin: 22px 0; padding: 22px 26px;
  background: var(--papir); border-radius: var(--r); box-shadow: var(--senca); border-left: 6px solid var(--izabela); }
.obveza-trak b { font: 900 3.2rem/1 var(--f-naslov); color: var(--izabela); }
.obveza-trak p { margin: 0; }

.jedilnik { background: var(--papir); border-radius: var(--r); box-shadow: var(--senca); padding: clamp(24px, 4vw, 48px); position: relative; }
.jedilnik::before { content: ""; position: absolute; inset: 12px; border: 1px solid var(--crta); border-radius: 12px; pointer-events: none; }
.jedilnik-glava { text-align: center; margin-bottom: 24px; }
.jedilnik-glava h2 { font-size: clamp(2.2rem, 5vw, 3.6rem); margin: 0; }
.jedilnik-glava p { color: var(--siva); margin: 6px auto 0; max-width: 58ch; }
.jedilnik-stolpci { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px 44px; }
.jedilnik h3 { font: 800 1.25rem/1 var(--f-naslov); text-transform: uppercase; letter-spacing: .04em; color: var(--izabela); margin: 18px 0 8px;
  padding-bottom: 6px; border-bottom: 2px solid var(--noc); }
.postavka { padding: 8px 0; }
.postavka .vrstica-p { display: flex; align-items: baseline; gap: 8px; }
.postavka .vrstica-p strong { font-size: 1rem; }
.postavka .vrstica-p i { flex: 1; border-bottom: 2px dotted #c3ccd8; transform: translateY(-4px); }
.postavka .nivo-j { font: 500 .7rem/1 var(--f-koda); text-transform: uppercase; letter-spacing: .06em; padding: 3px 7px; border-radius: 4px; }
.nivo-j.vrh { background: #fdf1d8; color: #7a5200; }
.nivo-j.sredina { background: var(--akcent-mehko); color: var(--izabela); }
.nivo-j.podnozje { background: #e7f0e8; color: #2f5536; }
.postavka p { margin: 2px 0 0; font-size: .86rem; color: var(--siva); font-style: italic; }

/* ------------------------------------------------------------------ prijavni obrazec */
.obrazec-postavitev { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 28px; align-items: start; }
@media (max-width: 960px) { .obrazec-postavitev { grid-template-columns: minmax(0, 1fr); } .vodnik { position: static !important; } }
.vodnik { position: sticky; top: 86px; background: var(--noc); color: #fff; border-radius: var(--r); padding: 20px; }
.vodnik ol { list-style: none; margin: 0; padding: 0; counter-reset: k; }
.vodnik li a { display: grid; grid-template-columns: 26px 1fr auto; gap: 10px; align-items: center; padding: 7px 6px; border-radius: 8px;
  color: rgba(255, 255, 255, .78); text-decoration: none; font-size: .9rem; }
.vodnik li a:hover { background: rgba(255, 255, 255, .06); color: #fff; }
.vodnik li a::before { counter-increment: k; content: counter(k); display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%;
  border: 1.5px solid rgba(255, 255, 255, .3); font: 600 .78rem/1 var(--f-koda); }
.vodnik li.opravljeno a::before { content: "✓"; background: var(--luc); border-color: var(--luc); color: var(--noc); }
.vodnik li.neobvezno a::before { border-style: dashed; }
.vodnik-izbira { margin-top: 14px; padding: 12px; border-radius: 10px; background: rgba(255, 255, 255, .06); font-size: .85rem; }
.vodnik-izbira .vi-naslov { margin: 0 0 6px; font: 700 .66rem/1.2 var(--f-besedilo); letter-spacing: .14em; text-transform: uppercase; color: var(--tlak); }
.vodnik-izbira .vi { display: flex; align-items: center; gap: 8px; padding: 2px 0; font-weight: 600; }
.vodnik-izbira i { font-style: normal; font: 800 .62rem/1 var(--f-naslov); padding: 3px 6px; border-radius: 4px; background: var(--luc); color: var(--noc); }
.vodnik-izbira i.b { background: var(--izabela); color: #fff; }
.vodnik .vodnik-opomba { margin: 16px 0 0; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, .12); font-size: .8rem; line-height: 1.5; color: rgba(255, 255, 255, .7); }
.vodnik .vodnik-opomba a { color: var(--luc); }
.vodnik .rok-mini { margin-top: 14px; font-size: .8rem; color: rgba(255, 255, 255, .66); }
.vodnik .rok-mini b { color: #fff; font-family: var(--f-koda); font-weight: 500; }
@media (max-width: 960px) {
  .vodnik { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; padding: 16px; }
  .vodnik ol { grid-column: 1 / -1; display: flex; justify-content: space-between; }
  .vodnik li a { display: block; padding: 0; font-size: 0; }
  .vodnik li a::before { font-size: .78rem; }
  .vodnik .vodnik-opomba { margin: 0; padding: 0; border: 0; }
  .vodnik-izbira { margin: 0; }
  .vodnik .rok-mini { margin: 0; }
}

.rok { display: flex; flex-wrap: wrap; gap: 12px 28px; align-items: center; justify-content: space-between; }
.rok .kdaj { font-weight: 700; font-size: 1.05rem; }
.odstevanje { font: 500 1.2rem/1.2 var(--f-koda); color: var(--izabela); font-variant-numeric: tabular-nums; }
.zaklep { display: grid; grid-template-columns: auto 1fr; gap: 14px; align-items: start; background: var(--noc); color: rgba(255, 255, 255, .85);
  border-radius: 14px; padding: 16px 18px; margin-top: 16px; font-size: .92rem; }
.zaklep strong { color: var(--luc); }
.zaklep svg { width: 26px; height: 26px; color: var(--luc); }
.znesek { position: relative; }
.znesek input { font: 500 1.5rem/1 var(--f-koda); padding-right: 48px; }
.znesek .valuta { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); color: var(--siva); font: 700 1.1rem var(--f-koda); }
.izjava { display: flex; gap: 12px; align-items: flex-start; padding: 9px 0; }
.izjava input { width: 20px; height: 20px; margin-top: 2px; flex: none; }
.izjava label { font-weight: 400; margin: 0; font-size: .95rem; }
.izjava input.napaka { outline: 2px solid var(--err); outline-offset: 2px; }
.radio { display: flex; gap: 12px; align-items: flex-start; padding: 9px 12px; border-radius: 10px; }
.radio:hover { background: #f6f8fb; }
.radio input { margin-top: 4px; width: 18px; height: 18px; }
.radio label { font-weight: 400; margin: 0; }
.oddaja { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; justify-content: space-between; background: var(--noc); color: #fff; }
.oddaja .pod { color: rgba(255, 255, 255, .7); }
.predvideno { font: 800 1.5rem/1.1 var(--f-naslov); color: var(--luc); text-transform: uppercase; }
.izbira-lok { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 14px; }
.izbira-lok .kartica-izbira { border: 2px solid var(--crta); border-radius: 16px; padding: 16px; transition: border-color .2s, background .2s; background: #fff; }
.izbira-lok .kartica-izbira:hover { border-color: #aab6c6; }
.izbira-lok .kartica-izbira.izbrana { border-color: var(--noc); background: #f7f9fc; box-shadow: inset 0 4px 0 var(--luc); }
.izbira-lok .kartica-izbira > label { display: flex; gap: 12px; align-items: flex-start; font-size: 1rem; cursor: pointer; margin: 0; }
.izbira-lok .kartica-izbira > label input { width: 22px; height: 22px; margin-top: 2px; flex: none; }
.izbira-lok .kartica-izbira strong { font: 800 1.3rem/1.05 var(--f-naslov); text-transform: uppercase; }
.skupina-izbire { display: flex; align-items: center; gap: 10px; margin: 22px 0 6px; font: 800 1.35rem/1.1 var(--f-naslov); text-transform: uppercase; }
.skupina-izbire span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: var(--noc); color: var(--luc); font-size: 1rem; flex: none; }
.brez-izbire { display: flex; gap: 12px; align-items: flex-start; margin: 12px 0 0; padding: 14px 16px; border: 2px dashed var(--crta); border-radius: 16px; background: #fff; cursor: pointer; font-weight: 400; transition: border-color .2s, background .2s; }
.brez-izbire:hover { border-color: #aab6c6; }
.brez-izbire input { width: 22px; height: 22px; margin-top: 1px; flex: none; }
.brez-izbire strong { display: block; font-weight: 700; }
.brez-izbire .pod { display: block; margin-top: 2px; }
.brez-izbire.izbrana { border-style: solid; border-color: var(--noc); background: #f7f9fc; }
.brez-izbire:has(input.napaka) { border-color: var(--err); background: var(--err-soft); }
.izbira-lok .znesek { margin-top: 14px; }
.vrstice { display: grid; gap: 8px; }
.vrstica-cenik { display: grid; grid-template-columns: 2fr 1.8fr 84px 1.3fr 1.7fr 104px 36px; gap: 6px; align-items: start; }
.vrstica-ref { display: grid; grid-template-columns: 2fr 1.1fr 1fr 1.6fr 36px; gap: 6px; align-items: start; }
#reference .vrstica-ref { padding: 10px; border-radius: 14px; background: #f6f8fb; border: 1px solid var(--crta); }
#reference .vrstica-ref .odstrani { grid-column: 5; grid-row: 1; }
.vrstica-ref.glava-vrstic { padding: 0 11px; }
.vrstica-cenik > *, .vrstica-ref > * { min-width: 0; }
.vrstica-cenik input, .vrstica-cenik select, .vrstica-ref input, .vrstica-ref select { padding: 9px 10px; font-size: .9rem; }
.vrstica-cenik .c-otroci { display: flex; align-items: center; justify-content: center; gap: 7px; height: 40px; margin: 0; padding: 0 10px;
  border: 1.5px solid var(--crta); border-radius: 999px; font-weight: 600; font-size: .8rem; white-space: nowrap; cursor: pointer; color: var(--siva); background: #fff; }
.vrstica-cenik .c-otroci:has(input:checked) { border-color: var(--polje); background: #eef6ef; color: var(--polje); }
.vrstica-cenik .c-otroci input { width: 16px; height: 16px; accent-color: var(--polje); }
.glava-vrstic { font-size: .7rem; color: var(--siva); text-transform: uppercase; letter-spacing: .08em; font-weight: 700; margin-top: 14px; }
button.odstrani { padding: 8px 0; width: 36px; background: #fff; color: var(--err); border: 1.5px solid #ecc9c5; border-radius: 10px; }
button.odstrani:hover { background: var(--err); color: #fff; }
/* prijavnica: koraki po skupinah – A lokaciji (zlato), B posebna dogodka (izabela), skupni (sivo) */
.velja { display: inline-block; vertical-align: middle; margin-left: 6px; padding: 3px 10px; border-radius: 999px;
  font: 700 .66rem/1.3 var(--f-besedilo); letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.velja-vse { background: #eef1f6; color: var(--siva); }
.velja-a { background: #fdf0d2; color: #8a5a00; }
.velja-b { background: #f3e3ee; color: var(--izabela); }
#obrazec section.kartica[data-za="A"] { border-left: 5px solid var(--luc); }
#obrazec section.kartica[data-za="B"] { border-left: 5px solid var(--izabela); }
#s-dogodki h4, #s-cenik-dog h4 { margin: 22px 0 6px; font: 800 1.1rem/1.1 var(--f-naslov); text-transform: uppercase; }
#s-dogodki h5 { margin: 12px 0 4px; font-size: .9rem; }
.skupina-uvod { display: flex; align-items: center; gap: 12px; margin: 26px 0 -6px; padding: 12px 16px; border-radius: 14px; font-size: .92rem; }
.skupina-uvod b { display: grid; place-items: center; flex: none; width: 30px; height: 30px; border-radius: 8px; font: 800 1rem var(--f-naslov); }
.skupina-uvod.a { background: #fdf6e3; color: #6b4a00; } .skupina-uvod.a b { background: var(--luc); color: var(--noc); }
.skupina-uvod.b { background: #f8eef4; color: #5a2047; } .skupina-uvod.b b { background: var(--izabela); color: #fff; }
.skupina-izbire-okvir { margin-top: 18px; padding: 4px 18px 18px; border-radius: 16px; }
.skupina-izbire-okvir.a { background: #fffaf0; border: 1.5px solid #f3dfae; }
.skupina-izbire-okvir.b { background: #fbf6f9; border: 1.5px solid #ead2e2; }
.skupina-izbire small { font: 500 .8rem var(--f-besedilo); text-transform: none; color: var(--siva); margin-left: 4px; }
.skupina-izbire-okvir.b .skupina-izbire span { background: var(--izabela); color: #fff; }
.pot-prijave { margin-top: 18px; padding: 14px 16px; border-radius: 14px; background: var(--noc); color: #fff; }
.pot-prijave .pot-naslov { margin: 0 0 8px; font: 700 .72rem/1.2 var(--f-besedilo); letter-spacing: .14em; text-transform: uppercase; color: var(--tlak); }
.pot-prijave .pod { color: rgba(255, 255, 255, .7); }
.pot-del { display: flex; gap: 10px; align-items: flex-start; padding: 5px 0; font-size: .92rem; }
.pot-del b { display: grid; place-items: center; flex: none; width: 24px; height: 24px; border-radius: 6px; font: 800 .85rem var(--f-naslov); }
.pot-del.a b { background: var(--luc); color: var(--noc); } .pot-del.b b { background: var(--izabela); color: #fff; }
.tockovanje.b { border-left-color: var(--izabela); background: #fcf7fa; }
.vodnik li a i { font-style: normal; font: 800 .62rem/1 var(--f-naslov); padding: 2px 5px; border-radius: 4px; margin-left: 4px; background: var(--luc); color: var(--noc); }
.vodnik li.b a i, .vodnik-opomba i.b { background: var(--izabela); color: #fff; }
.vodnik-opomba i { font-style: normal; font: 800 .62rem/1 var(--f-naslov); padding: 1px 5px; border-radius: 4px; background: var(--luc); color: var(--noc); }
@media (max-width: 960px) { .vodnik li a i { display: none; } }
@media (max-width: 640px) { .kartica > h2 { flex-wrap: wrap; row-gap: 6px; } .velja { margin-left: 0; white-space: normal; } }
.kosarica { display: grid; gap: 8px; max-width: 640px; margin-top: 10px; }
.kos-vrstica { display: grid; grid-template-columns: minmax(0, 1fr) 150px; gap: 12px; align-items: center; }
.kos-vrstica label { margin: 0; font-weight: 500; }
.kos-vrstica .znesek input { font-size: 1.05rem; padding: 9px 40px 9px 12px; }
.kos-skupaj { border-top: 1px solid var(--crta); padding-top: 8px; }
.kos-skupaj strong { text-align: right; font: 600 1.1rem var(--f-koda); padding-right: 14px; }
.vrstica-mref { display: grid; grid-template-columns: 2fr 1fr 1fr 1.5fr .9fr 36px; gap: 6px; align-items: start; }
.vrstica-mref > * { min-width: 0; }
.vrstica-mref input { padding: 9px 10px; font-size: .9rem; }
#mnozicne .vrstica-mref { padding: 10px; border-radius: 14px; background: #fff; border: 1px solid var(--crta); }
#mnozicne .vrstica-mref .odstrani { grid-column: 6; grid-row: 1; }
#mnozicne .vrstica-mref .ref-dokazilo { grid-column: 1 / 6; }
.vrstica-mref.glava-vrstic { padding: 0 11px; }
@media (max-width: 800px) {
  .vrstica-mref { grid-template-columns: 1fr 1fr; }
  #mnozicne .vrstica-mref .ref-dokazilo, #mnozicne .vrstica-mref .odstrani { grid-column: 1 / -1; grid-row: auto; }
  .kos-vrstica { grid-template-columns: 1fr; gap: 4px; }
}
.ref-dokazilo { font-size: .82rem; grid-column: 1 / 5; grid-row: 2; display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: center; padding: 4px 2px 0; }
.ref-dokazilo label { font-weight: 500; display: flex; gap: 8px; align-items: center; margin: 0; }
.ref-dokazilo input[type=file] { flex: 1 1 260px; width: auto; }
.ref-dokazilo .seznam-dat { flex-basis: 100%; }
@media (min-width: 961px) { .umik { margin-left: 278px; } }
@media (max-width: 800px) {
  .vrstica-cenik, .vrstica-ref { grid-template-columns: 1fr 1fr; padding: 12px; background: var(--mraz); border-radius: 12px; }
  .glava-vrstic { display: none !important; }
  #predlog { max-width: 100% !important; width: 100%; }
  .ref-dokazilo, #reference .vrstica-ref .odstrani { grid-column: 1 / -1; grid-row: auto; }
  .vrstica-cenik .c-otroci { justify-content: flex-start; }
}
.tockovanje { margin-top: 16px; border: 1px solid var(--crta); border-left: 4px solid var(--luc); border-radius: 12px; padding: 12px 16px 8px; background: #fcfaf3; font-size: .88rem; }
.tockovanje-naslov { font: 700 .7rem/1.2 var(--f-besedilo); letter-spacing: .14em; text-transform: uppercase; color: var(--izabela); margin: 0 0 4px; }
.t-vrstica { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 4px 12px; padding: 8px 0; border-top: 1px dashed var(--crta); }
.tockovanje-naslov + .t-vrstica { border-top: 0; }
.t-kljuc { font: 600 .82rem/1.5 var(--f-koda); color: var(--izabela); }
.t-tocke { font: 700 .8rem/1.5 var(--f-koda); white-space: nowrap; color: var(--noc); }
.t-stopnje { grid-column: 2 / -1; list-style: none; margin: 2px 0 0; padding: 0; }
.t-stopnje li { display: flex; justify-content: space-between; gap: 14px; padding: 3px 0; color: var(--siva); }
.urnik-izbira { margin-top: 4px; }
.kazalnik { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 8px; margin-top: 14px; }
.kazalnik div { font-size: .85rem; padding: 9px 12px; border-radius: 10px; background: #f1f4f8; color: var(--siva); }
.kazalnik div.da { background: var(--ok-soft); color: var(--ok); font-weight: 700; }
.kazalnik div.pogoj { background: var(--warn-soft); color: var(--warn); font-weight: 700; }
.kazalnik div.pogoj.da { background: var(--ok-soft); color: var(--ok); }
.priloga { border: 1.5px dashed #c6cdd6; border-radius: 12px; padding: 12px 14px; background: #fbfcfe; }
.priloga .seznam-dat { font-size: .84rem; color: var(--siva); margin-top: 6px; }
.potrdilo { border-top: 6px solid var(--luc); }
.potrdilo dl { display: grid; grid-template-columns: max-content 1fr; gap: 8px 22px; margin: 16px 0; }
.potrdilo dt { color: var(--siva); }
.potrdilo dd { margin: 0; font-weight: 700; overflow-wrap: anywhere; }
.potrdilo .koda { font-size: 1.1rem; letter-spacing: .06em; }
.vrstica { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.vrstica.med { justify-content: space-between; }

/* ------------------------------------------------------------------ skrbnik */
.glava { background: var(--noc); color: #fff; padding: 26px 16px 70px; position: relative; overflow: hidden; }
.glava::before { content: ""; position: absolute; inset: -60%; opacity: .6;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96'%3E%3Cg fill='none' stroke='%23ffe08e'%3E%3Crect x='.5' y='.5' width='95' height='95' stroke-opacity='.18'/%3E%3Crect x='24.5' y='24.5' width='47' height='47' stroke-opacity='.1'/%3E%3C/g%3E%3C/svg%3E");
  transform: rotate(-21.7deg); }
.glava .znotraj { max-width: var(--sirina); margin: 0 auto; position: relative; }
.glava .narocnik { font-size: .76rem; letter-spacing: .18em; text-transform: uppercase; color: var(--tlak); margin-bottom: 6px; }
.glava h1 { font: 800 clamp(1.8rem, 4vw, 2.8rem)/1 var(--f-naslov); text-transform: uppercase; }
body.admin main { margin-top: -46px; position: relative; }
.stat { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; }
.stat > div { background: var(--mraz); border-radius: 12px; padding: 14px 16px; }
.stat .v { font: 800 1.6rem/1.1 var(--f-naslov); }
.stat .n { font-size: .7rem; color: var(--siva); text-transform: uppercase; letter-spacing: .1em; font-weight: 700; }
.zavihki { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
.zavihki button { background: #fff; color: var(--noc); border-color: rgba(19, 32, 47, .2); }
.zavihki button.aktivna { background: var(--noc); color: var(--luc); border-color: var(--noc); }
.ocena-vrsta { display: grid; grid-template-columns: 50px 1fr 64px 190px; gap: 10px; align-items: center; padding: 9px 0; border-bottom: 1px dashed var(--crta); font-size: .9rem; }
.ocena-vrsta .tock { font: 700 1rem var(--f-koda); text-align: right; }
.ocena-vrsta.zavrnjeno .tock { color: var(--err); text-decoration: line-through; }
@media (max-width: 640px) { .ocena-vrsta { grid-template-columns: 40px 1fr 56px; } .ocena-vrsta > :last-child { grid-column: 1 / -1; } }
.gumb-mini { padding: 5px 12px !important; font-size: .8rem !important; }
.povezava-dat { display: inline-block; margin: 2px 10px 2px 0; font-size: .86rem; }
.dnevnik { max-height: 300px; overflow: auto; font-size: .85rem; }
.dnevnik div { padding: 6px 0; border-bottom: 1px dashed var(--crta); }
.dnevnik time { color: var(--siva); margin-right: 8px; font-family: var(--f-koda); font-size: .8rem; }
.prijava { max-width: 420px; margin: 0 auto; }
.podrobnosti { background: var(--mraz); padding: 12px 14px !important; }

/* ------------------------------------------------------------------ gibanje in tisk */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .prihod { opacity: 1; transform: none; }
}

#zapisnik { display: none; }
@media print {
  body { background: #fff; font-size: 10.5pt; color: #000; }
  .vrh, .noga, .kazalo, .ne-tiskaj, .orodja, .meni { display: none !important; }
  .naslovnica { background: none; color: #000; padding: 0 0 10pt; }
  .naslovnica::before, .naslovnica::after { display: none; }
  .naslovnica h1 { font-size: 22pt; }
  .naslovnica .nadnaslov, .naslovnica .uvod { color: #333; }
  main { padding: 0; max-width: none; }
  .dokument-postavitev { display: block; }
  .kartica, .dokument { box-shadow: none; border: none; padding: 0; }
  .dokument .poudarek { background: #f2f2f2; color: #000; }
  .dokument .poudarek strong { color: #000; }
  table.merila tr.skupina th { background: #eee; color: #000; }
  body.admin > *:not(#zapisnik) { display: none !important; }
  #zapisnik { display: block; padding: 0; }
  #zapisnik table { font-size: 9.5pt; }
  #zapisnik th, #zapisnik td { border: 1px solid #999; padding: 4px 5px; }
  .podpisi { display: flex; justify-content: space-between; margin-top: 56px; gap: 40px; }
  .podpisi div { flex: 1; border-top: 1px solid #000; padding-top: 4px; text-align: center; font-size: 9pt; }
  .potrdilo { border: none; }
}

/* ------------------------------------------------------------------ urejanje besedil na strani (prijavljeni skrbnik) */
.urejanje-plosca { position: fixed; left: 16px; bottom: 16px; z-index: 80; display: flex; flex-wrap: wrap; align-items: center;
  gap: 8px 12px; max-width: min(560px, calc(100vw - 32px)); padding: 10px 14px; border-radius: 14px; font-size: .84rem;
  background: rgba(var(--noc-rgb), .95); color: #fff; box-shadow: 0 10px 30px rgba(0, 0, 0, .35); }
.urejanje-plosca .gumb { padding: 8px 14px; font-size: .86rem; }
.urejanje-stanje { flex: 1 1 220px; color: rgba(255, 255, 255, .85); line-height: 1.35; }
.urejanje-stanje:empty { display: none; }
.urejanje-stanje[data-vrsta="ok"] { color: #a6e8bd; }
.urejanje-stanje[data-vrsta="err"] { color: #ffb4ab; }
.urejanje-admin { color: var(--luc); font-weight: 600; text-decoration: none; }
.urejanje [data-b] { outline: 1px dashed rgba(var(--luc-rgb), .75); outline-offset: 3px; border-radius: 2px; cursor: text; }
.urejanje [data-b]:hover { outline-style: solid; }
.urejanje [data-b][data-bs] { outline: 1px dashed #5ec2f0; }
.urejanje [data-b]:focus { outline: 2px solid var(--luc); background: rgba(var(--luc-rgb), .08); }
.urejanje [data-b] [data-v] { background: rgba(var(--luc-rgb), .28); border-radius: 3px; padding: 0 2px; cursor: default; }
.urejanje [data-b].shranjeno { outline: 2px solid #3fbf6f; background: rgba(63, 191, 111, .12); }
.urejanje [data-b].napaka-shranjevanja { outline: 2px solid var(--err); }
.urejanje [data-b].shranjujem { opacity: .6; }
.urejanje-orodja { position: absolute; z-index: 81; display: flex; gap: 4px; padding: 4px; border-radius: 10px;
  background: #13202f; box-shadow: 0 6px 18px rgba(0, 0, 0, .3); }
.urejanje-orodja[hidden] { display: none; }
.urejanje-orodja button { min-width: 34px; padding: 5px 10px; border: 0; border-radius: 7px; cursor: pointer;
  background: rgba(255, 255, 255, .1); color: #fff; font: 600 .85rem/1.2 var(--f-besedilo); }
.urejanje-orodja button:hover:not(:disabled) { background: rgba(255, 255, 255, .22); }
.urejanje-orodja button:disabled { opacity: .4; cursor: default; }
@media print { .urejanje-plosca, .urejanje-orodja { display: none !important; } }

/* fotografije v skrbniškem delu */
.galerija-skrbnik { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px; margin-top: 18px; }
.galerija-skrbnik figure { margin: 0; display: flex; flex-direction: column; gap: 6px; font-size: .8rem; line-height: 1.3; }
.galerija-skrbnik img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px; background: #eef1f5; }
.galerija-skrbnik button { align-self: flex-start; padding: 4px 10px; font-size: .78rem; }

/* ------------------------------------------------------------------ program dogodkov */
.program-filtri { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; }
.program-filtri:empty { display: none; }
.program-filtri button { padding: 7px 14px; border-radius: 999px; border: 1px solid var(--crta); background: #fff;
  color: var(--noc); font-weight: 600; font-size: .86rem; cursor: pointer; }
.program-filtri button[aria-pressed="true"] { background: var(--noc); border-color: var(--noc); color: #fff; }
.program { display: grid; gap: 14px; }
.program-dan { background: #fff; border: 1px solid var(--crta); border-radius: 14px; padding: 16px 20px; }
.program-dan h2 { margin: 0 0 6px; font: 800 1.15rem/1.2 var(--f-naslov); text-transform: uppercase; letter-spacing: .02em; color: var(--noc); }
.program-dan ul { list-style: none; margin: 0; padding: 0; }
.program-dogodek { display: grid; grid-template-columns: 64px 1fr; gap: 12px; padding: 10px 0; border-top: 1px solid var(--crta); }
.program-dogodek:first-child { border-top: 0; }
.program-dogodek .ura { font: 700 .95rem/1.5 var(--f-koda); color: var(--noc); }
.program-dogodek b { display: block; font-size: 1rem; color: var(--noc); }
.program-dogodek .kraj { display: inline-flex; align-items: center; gap: 6px; font-size: .82rem; color: var(--siva); }
.program-dogodek .kraj::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--luc); }
.program-dogodek.L1 .kraj::before { background: var(--bozic-rdeca); }
.program-dogodek.L2 .kraj::before { background: var(--bozic-zelena); }
.program-dogodek p { margin: 4px 0 0; font-size: .9rem; color: var(--siva); }
.program-prazno { border: 1.5px dashed var(--crta); border-radius: 14px; padding: 28px; text-align: center; color: var(--siva); }

/* program v skrbniškem delu */
.program-vrstica { display: grid; grid-template-columns: 150px 80px minmax(120px, 1fr) minmax(160px, 1.4fr) minmax(160px, 1.4fr) 40px;
  gap: 8px; margin-bottom: 8px; align-items: center; }
.program-vrstica button { padding: 6px 0; }
@media (max-width: 900px) {
  .program-vrstica { grid-template-columns: 1fr 1fr; padding-bottom: 8px; border-bottom: 1px solid var(--crta); }
  .program-vrstica .pr-naslov, .program-vrstica .pr-opis { grid-column: 1 / -1; }
}