/* =====================================================================
   Projektni dnevnik – style.css
   Dopolnilo k arnes-light.css (barve --al-*), samo posebnosti aplikacije.
   ===================================================================== */

body { background: #f7f6fb; }
main { padding-top: 24px; }

.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
[hidden] { display: none !important; }

/* ---- Glava ---- */
.glava-desno { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.glava-desno form { margin: 0; }
.ime-ekipe { font-weight: 700; color: var(--al-primary); margin-right: 8px; }
.noga { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; }

/* ---- Prijava ---- */
.prijava { max-width: 460px; margin: 16px auto 40px; }
.prijava button[type="submit"] { width: 100%; margin-top: 6px; padding: 12px; font-size: 1.05rem; }
.namigi ul { margin: 6px 0 0; padding-left: 20px; }
.namigi { margin-bottom: 16px; }
.potrditev { display: flex; align-items: center; gap: 8px; font-weight: 400; margin: 6px 0 14px; cursor: pointer; }

/* ---- Postavitev aplikacije ---- */
.aplikacija { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 24px; align-items: start; }
@media (max-width: 960px) { .aplikacija { grid-template-columns: 1fr; } }

.vnos-glava { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; }
.vnos-glava h1 { font-size: 1.6rem; margin-bottom: 18px; }

.vrsta-3 { display: grid; grid-template-columns: 1.2fr .9fr 1.3fr; gap: 12px; }
@media (max-width: 640px) { .vrsta-3 { grid-template-columns: 1fr; } }

/* ---- Odštevalnik ---- */
.odstevalnik { display: flex; align-items: center; gap: 10px; background: var(--al-lavender); border-radius: 999px; padding: 6px 8px 6px 6px; }
.odstevalnik svg { width: 44px; height: 44px; transform: rotate(-90deg); }
.obroc-ozadje { fill: #fff; stroke: var(--al-lavender-line); stroke-width: 5; }
.obroc { fill: none; stroke: var(--al-primary); stroke-width: 5; stroke-linecap: round; transition: stroke-dashoffset .25s linear; }
.cas { font-weight: 700; font-size: 1.25rem; min-width: 3.2em; font-variant-numeric: tabular-nums; color: var(--al-primary); }
.odstevalnik.malo .obroc { stroke: var(--al-accent); }
.odstevalnik.malo .cas { color: var(--al-accent-text); }
.odstevalnik.konec { background: #fde8da; }
.odstevalnik.konec .cas { color: var(--al-accent-text); }

/* ---- Udeleženci ---- */
fieldset.udelezenci { border: 1px solid var(--al-border); border-radius: var(--al-radius); padding: 12px 16px 6px; margin: 0 0 16px; }
fieldset.udelezenci legend { font-weight: 700; padding: 0 6px; }
.udelezenec { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 6px 0; border-bottom: 1px dashed var(--al-border); }
.udelezenec:last-child { border-bottom: 0; }
.udelezenec .ime { display: flex; align-items: center; gap: 8px; margin: 0; font-weight: 700; flex-wrap: wrap; }
.udelezenec select { width: auto; min-width: 140px; padding: 6px 10px; }
.udelezenec.odsoten .ime { color: var(--al-muted); font-weight: 400; }
.gost-vrstica { margin: 10px 0 4px; }
.gost-vrstica select { width: auto; flex: 1 1 200px; padding: 6px 10px; }

/* ---- Vprašanja ---- */
.vprasanje { position: relative; }
.vprasanje label .st { color: var(--al-accent-text); }
.vprasanje textarea { min-height: 76px; }
.obvezno { color: var(--al-danger); }
.stevec { position: absolute; right: 8px; bottom: 6px; font-size: .75rem; color: var(--al-muted); background: rgba(255,255,255,.85); padding: 0 4px; }
.napacno { border-color: var(--al-danger) !important; box-shadow: 0 0 0 3px rgba(198, 40, 40, .12) !important; }

details.osebno { border: 1px solid var(--al-border); border-radius: var(--al-radius); padding: 8px 14px; margin-bottom: 14px; background: #fff; }
details.osebno summary { cursor: pointer; font-weight: 700; color: var(--al-primary); }
details.osebno textarea { min-height: 54px; }

.opozorilo-gdpr { font-size: .88rem; color: var(--al-muted); margin: 0 0 12px; }
.gumbi button[type="submit"] { padding: 12px 26px; font-size: 1.05rem; }

/* ---- Zgodovina ---- */
.zgodovina h2 { margin-top: 4px; }
.vnos-kartica { margin-bottom: 14px; padding: 16px 18px; }
.vnos-kartica.nov { border-color: var(--al-ok); box-shadow: 0 0 0 3px rgba(27, 122, 61, .15); }
.kartica-glava { display: flex; justify-content: space-between; gap: 8px; align-items: flex-start; }
.kartica-glava h3 { margin: 0; font-size: 1.05rem; }
.znacke { display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
.vloge { font-size: .92rem; margin: 8px 0; }
.odgovori { margin: 0 0 8px; }
.odgovori dt { font-weight: 700; font-size: .9rem; color: var(--al-primary); margin-top: 8px; }
.odgovori dd { margin: 2px 0 0; white-space: pre-line; }
.osebni-zapisi { border-top: 1px dashed var(--al-border); padding-top: 6px; font-size: .92rem; }
.osebni-zapisi p { margin: 4px 0; }
.komentar { margin: 10px 0; }
.gostovanja ul { margin: 6px 0 0; padding-left: 20px; }

/* ---- Tisk (zgodovina za portfolio) ---- */
@media print {
  body { background: #fff; }
  .aplikacija { display: block; }
  .vnos, .row, .noga { display: none !important; }
  .vnos-kartica { border: 1px solid #999; }
}

/* =====================================================================
   UČITELJSKI DEL
   ===================================================================== */
.admin-nav { margin: -8px 0 18px; border-bottom: 1px solid var(--al-border); }
.izbor-sole select { width: auto; max-width: 260px; padding: 5px 8px; }
.izbor-sole { margin: 0; }
.orodna-vrstica { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; }
.orodna-vrstica label { margin: 0; }
.orodna-vrstica select { width: auto; min-width: 220px; }
.pregled-glava { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.pregled-glava h1 { margin: 0; font-size: 1.6rem; }
.pregled-glava input[type="date"] { width: auto; }
.povzetek { margin: 12px 0 16px; }
.tabela-pregled td.st, .tabela-pregled th.st { text-align: center; }
td.akcije { white-space: nowrap; }
td.akcije form { display: inline-block; margin: 0 4px 4px 0; }
td.akcije .btn { margin: 0 4px 4px 0; }
tr.neaktivna, .card.neaktivna { opacity: .6; }

.filtri { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0 12px; align-items: end; margin-bottom: 12px; }
.filtri .field { margin-bottom: 10px; }
.filtri .potrditev, .filtri .row { grid-column: 1 / -1; margin: 0 0 6px; }
.vnosi-mreza { display: grid; grid-template-columns: repeat(auto-fill, minmax(420px, 1fr)); gap: 0 16px; }
@media (max-width: 520px) { .vnosi-mreza { grid-template-columns: 1fr; } }
.komentar-obrazec { border-top: 1px dashed var(--al-border); padding-top: 10px; margin-top: 10px; }
.komentar-obrazec label { font-size: .9rem; }
.komentar-obrazec textarea { min-height: 60px; margin-bottom: 6px; }
mark { background: #fff1c2; padding: 0 2px; border-radius: 2px; }

.dve-koloni { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 20px; }
@media (max-width: 760px) { .dve-koloni { grid-template-columns: 1fr; } }
.podnaslov-ekipe { margin-top: 8px; }
.ekipe-mreza { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px; }
.ekipa-kartica .znacke { justify-content: flex-start; min-height: 22px; margin-bottom: 6px; }
.ekipa-kartica h4 { margin: 14px 0 6px; }
.clani-seznam { list-style: none; padding: 0; margin: 0 0 8px; }
.clani-seznam li { display: flex; gap: 6px; align-items: center; margin-bottom: 6px; flex-wrap: wrap; }
.clani-seznam li form { margin: 0; }
.clani-seznam li.neaktiven input { color: var(--al-muted); text-decoration: line-through; }
form.vrstica { display: flex; gap: 6px; align-items: center; flex: 1 1 160px; }
form.vrstica input { padding: 5px 8px; }
.ekipa-gumbi { border-top: 1px solid var(--al-border); padding-top: 10px; margin-top: 10px; }
.ekipa-gumbi form { margin: 0; }
.vrsta-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
@media (max-width: 760px) { .vrsta-4 { grid-template-columns: 1fr 1fr; } }
.skupina-kartica, .card + .card { margin-top: 14px; }
details.brisanje { margin-top: 12px; border-top: 1px solid var(--al-border); padding-top: 10px; }
details.brisanje summary { cursor: pointer; color: var(--al-danger); font-weight: 700; }
code.pin { font-size: 1.15rem; font-weight: 700; padding: 2px 10px; letter-spacing: .08em; }

.portfolio-glava { margin-bottom: 16px; }
.podatki { display: grid; grid-template-columns: max-content 1fr; gap: 4px 16px; margin: 0; }
.podatki dt { font-weight: 700; color: var(--al-primary); }
.podatki dd { margin: 0; }

/* Listki s PIN-i: 2 stolpca, razrez po črtkani črti */
.listki { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0; }
.listek { border: 1px dashed #999; padding: 14px 16px; background: #fff; break-inside: avoid; }
.listek-glava { display: flex; align-items: center; gap: 8px; color: var(--al-primary); }
.listek-naslov { font-family: var(--al-font-mono); font-size: .9rem; margin: 4px 0 8px; }
.listek dl { display: grid; grid-template-columns: max-content 1fr; gap: 2px 10px; margin: 0 0 8px; font-size: .92rem; }
.listek dt { color: var(--al-muted); }
.listek dd { margin: 0; }
.listek-pin { display: flex; align-items: center; justify-content: space-between; background: var(--al-lavender); border-radius: 6px; padding: 6px 12px; }
.listek-pin code { font-size: 1.6rem; font-weight: 700; letter-spacing: .15em; background: none; }
.listek-opomba { font-size: .8rem; color: var(--al-muted); margin: 6px 0 0; }

@media print {
  .admin-nav, .orodna-vrstica, .alert, .filtri, .komentar-obrazec { display: none !important; }
  main { padding: 0; }
  .listki { grid-template-columns: 1fr 1fr; }
  .listek { border-color: #666; }
  .portfolio .vnos-kartica { border: 0; border-top: 1px solid #999; border-radius: 0; padding: 10px 0; }
  .portfolio-glava { border: 0; padding: 0; }
  mark { background: #eee; }
}

/* ---- Vnosi: preklop kartice / tabela ---- */
.vnosi-orodja { justify-content: space-between; }
.preklop-pogleda { margin: 0; }
.preklop-pogleda > a { padding: 6px 14px; border-radius: var(--al-radius-sm); text-decoration: none; font-weight: 700; }
.tabela-vnosov { font-size: .92rem; }
.tabela-vnosov th { position: sticky; top: 0; z-index: 1; font-size: .85rem; }
.tabela-vnosov th.odg { min-width: 180px; }
.tabela-vnosov td.odg { min-width: 180px; }
.tabela-vnosov .skrajsano { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; white-space: pre-line; }
.tabela-vnosov .skrajsano > div { white-space: normal; }
.tabela-vnosov .udel { white-space: nowrap; font-size: .88rem; }
.vloga-kratko { display: inline-block; min-width: 2.2em; font-weight: 700; color: var(--al-primary); }
.nowrap { white-space: nowrap; }
.center { text-align: center; }
@media print {
  .tabela-vnosov { font-size: 9pt; }
  .tabela-vnosov .skrajsano { display: block; -webkit-line-clamp: unset; overflow: visible; }
  .ne-tisk, .vnosi-orodja { display: none !important; }
  .tabela-vnosov th { position: static; }
  .table-wrap { overflow: visible; border: 0; }
}
/* Tabela vnosov sme biti širša od vsebine strani (do 1400 px) */
.table-wrap.siroka { position: relative; left: 50%; transform: translateX(-50%); width: calc(min(1400px, 100vw) - 32px); background: #fff; }
.tabela-vnosov th.odg, .tabela-vnosov td.odg { min-width: 160px; }
@media print { .table-wrap.siroka { position: static; transform: none; width: auto; } }

/* ---- Pomoč ---- */
.nav-pomoc { margin-left: auto; }
.pomoc { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 24px; align-items: start; }
.pomoc-kazalo { position: sticky; top: 16px; font-size: .92rem; padding: 16px; }
.pomoc-kazalo ol { margin: 8px 0 0; padding-left: 20px; }
.pomoc-kazalo li { margin: 4px 0; }
.pomoc-kazalo a { text-decoration: none; }
.pomoc-kazalo a:hover { text-decoration: underline; }
.pomoc-besedilo { padding: 24px 32px; max-width: 820px; }
.pomoc-besedilo h2 { margin-top: 1.6em; padding-top: 12px; border-top: 1px solid var(--al-border); scroll-margin-top: 16px; }
.pomoc-besedilo h2:first-of-type { border-top: 0; margin-top: .6em; }
.pomoc-besedilo ul, .pomoc-besedilo ol { padding-left: 22px; margin: 0 0 1em; }
.pomoc-besedilo li { margin: 4px 0; }
.pomoc-besedilo .table-wrap { margin: 0 0 1em; }
.pomoc-besedilo .alert { margin: 1em 0; }
@media (max-width: 860px) {
  .pomoc { grid-template-columns: 1fr; }
  .pomoc-kazalo { position: static; }
  .pomoc-besedilo { padding: 18px; }
}
@media print { .pomoc { display: block; } .pomoc-kazalo { display: none; } }

/* ---- Demo ---- */
.demo-trak { background: #fff1e6; border-bottom: 2px solid var(--al-accent); color: var(--al-text); font-size: .92rem; padding: 8px 0; }
.demo-trak strong { color: var(--al-accent-text); letter-spacing: .05em; margin-right: 4px; }
.demo-namig { font-size: .95rem; }

/* ---- Oznaka učitelja: pregledano / dopolni / ponovi ---- */
.znacka-stanje { display: inline-block; font-size: .78rem; font-weight: 700; padding: 2px 9px; border-radius: 999px; white-space: nowrap; }
.znacka-stanje.stanje-ok     { background: #dcf1e3; color: var(--al-ok); }
.znacka-stanje.stanje-warn   { background: #fde8da; color: var(--al-accent-text); }
.znacka-stanje.stanje-danger { background: #fbe1e1; color: var(--al-danger); }
.znacka-stanje.stanje-znova  { background: var(--al-lavender); color: var(--al-primary); }
.vnos-kartica.ima-stanje { border-left-width: 5px; }
.vnos-kartica.stanje-ok     { border-left-color: var(--al-ok); }
.vnos-kartica.stanje-warn   { border-left-color: var(--al-accent); }
.vnos-kartica.stanje-danger { border-left-color: var(--al-danger); }
.vnos-kartica.stanje-znova  { border-left-color: var(--al-primary); }
.komentar.komentar-ok     { border-color: var(--al-ok);     background: #eaf6ec; }
.komentar.komentar-warn   { border-color: var(--al-accent); background: #fff1e6; }
.komentar.komentar-danger { border-color: var(--al-danger); background: #fdecec; }
.komentar-ok > strong     { color: var(--al-ok); }
.komentar-warn > strong   { color: var(--al-accent-text); }
.komentar-danger > strong { color: var(--al-danger); }
.navodilo-popravi { margin-top: 6px; font-size: .9rem; font-weight: 700; }
.naslov-povratne.stanje-ok     { color: var(--al-ok); }
.naslov-povratne.stanje-warn   { color: var(--al-accent-text); }
.naslov-povratne.stanje-danger { color: var(--al-danger); }
/* izbira stanja kot gumbi */
.izbira-stanja { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 8px; }
.izbira-stanja input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.izbira-stanja label { margin: 0; font-weight: 700; font-size: .85rem; padding: 5px 12px; border-radius: 999px; border: 1.5px solid var(--al-border); background: #fff; cursor: pointer; color: var(--al-muted); }
.izbira-stanja input:focus-visible + label { outline: 2px solid var(--al-primary); outline-offset: 2px; }
.izbira-stanja input:checked + label.stanje-ok     { background: var(--al-ok);     border-color: var(--al-ok);     color: #fff; }
.izbira-stanja input:checked + label.stanje-warn   { background: var(--al-accent); border-color: var(--al-accent); color: #fff; }
.izbira-stanja input:checked + label.stanje-danger { background: var(--al-danger); border-color: var(--al-danger); color: #fff; }
.izbira-stanja input:checked + label.stanje-brez   { background: var(--al-surface-2); border-color: var(--al-muted); color: var(--al-text); }
.odprti-vnosi a { font-weight: 700; }
@media print { .znacka-stanje { border: 1px solid #999; } }