/* gradiliste-ekran — uređenje ekrana GRADILIŠTA (21.10.2026). Učitava se posljednji.
   Samo CSS, bez izmjene gradiliste.html. Isti jezik kao profil.css: meke površine,
   zaobljenja 14–18px, koralni akcent SAMO za glavnu akciju, stanja bojom (amber/zeleno/crveno). */

/* ---------- zaglavlje projekta: čitljiv nadnaslov i razmaci ---------- */
#glavno>.oz{display:block;margin:0 0 4px;letter-spacing:.14em}
#glavno>a.ne-stampa,#glavno>a[href="#"]{display:inline-block;margin-bottom:10px;color:var(--muted);text-decoration:none;font-size:13.5px}
#glavno>a.ne-stampa:hover,#glavno>a[href="#"]:hover{color:var(--accent)}
main>h1+.tiho{margin-top:-6px;font-size:15px}

/* ---------- brojke: prva (napredak) nosi tanki akcenat ---------- */
.brojke:not(p) .brojka:first-child{border-color:color-mix(in srgb,var(--accent) 45%,var(--line))!important;background:var(--accent-s,var(--soft))}
.brojka b{letter-spacing:-.03em}
.traka{background:var(--line)}.traka i{background:var(--accent);transition:width .4s ease}

/* ---------- spisak projekata: kartica sa jasnim naslovom, meta ispod ---------- */
.projekti a{align-items:flex-start;transition:background .15s,box-shadow .15s,border-color .15s}
.projekti a:hover{border-color:color-mix(in srgb,var(--accent) 40%,var(--line));box-shadow:0 6px 22px #0000001a}
.projekti a>b{display:block;margin-bottom:4px;line-height:1.2}
.projekti a .tiho{display:block;font-size:13px}
.projekti a:after{align-self:center;opacity:.65;transition:transform .15s,opacity .15s}
.projekti a:hover:after{opacity:1;transform:translate(2px,-2px)}

/* ---------- prijave izvedenih radova: lijeva ivica po stanju, mirniji chip ---------- */
.prijava{position:relative;overflow:hidden;transition:box-shadow .15s}
.prijava:hover{box-shadow:0 6px 22px #00000018}
.prijava:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--line)}
.prijava:has(.ceka):before{background:var(--amber)}
.prijava:has(.potvrdjeno):before{background:var(--green)}
.prijava:has(.vraceno):before{background:var(--accent)}
.prijava .stanje{letter-spacing:.06em;border:1px solid transparent}
.prijava .stanje.ceka{background:var(--amberbg);color:var(--amber);border-color:color-mix(in srgb,var(--amber) 35%,transparent)}
.prijava .stanje.potvrdjeno{background:var(--greenbg);color:var(--green);border-color:color-mix(in srgb,var(--green) 35%,transparent)}
.prijava .stanje.vraceno{background:var(--redbg);color:var(--red);border-color:color-mix(in srgb,var(--accent) 35%,transparent)}
.prijava img{transition:transform .2s}
.prijava a:hover img{transform:scale(1.03)}
/* razlog vraćanja: mala forma nadzora ne smije djelovati kao glavna radnja */
.prijava .red .dugme.sporedno{border-color:var(--line)}

/* ---------- galerija: blaga interakcija ---------- */
.galerija a{display:block;overflow:hidden;border-radius:12px}
.galerija img{transition:transform .25s;display:block}
.galerija a:hover img{transform:scale(1.04)}

/* ---------- situacije (lista na pregledu) i tabela situacije ---------- */
.tabela tbody tr:has(td[colspan]) td{background:color-mix(in srgb,var(--accent) 7%,var(--panel))}
.tabela tbody tr:has(td[colspan]) td b{letter-spacing:-.01em}

/* ---------- predmjer sa inline formom izvođača: zbij praznu zonu reda ---------- */
@media(min-width:900px){
  .tabela td:has(.f-prijava){width:260px;vertical-align:top}
  .f-prijava{background:var(--sub);box-shadow:inset 0 0 0 1px var(--line)}
}

/* ---------- članovi: suptilne linije umjesto golog teksta ---------- */
.z+h2,h2{scroll-margin-top:80px}

/* ---------- mobilni: prijava chip i ivica ostaju čitljivi ---------- */
@media(max-width:820px){
  .prijava:before{width:3px}
  .projekti a:after{margin-top:0}
}