/* --- Vijesti i obavijesti: kartice, stanja i filtri (samo UT varijable, bez tvrdih boja) --- */
/* T58 (Zadatak 5): regija nema server-side condition (izbjegnut dvostruki poziv regija_naslovna);
   kad PL/SQL vrati NULL, tijelo regije je prazno pa se cijela regija (sa zaglavljem i gumbom) sakriva ovdje.
   Napomena: .t-Region-body UVIJEK sadrži <div class="t-Region-orderBy"> (Standard predložak), pa
   ":empty" nikad ne odgovara -- zato se provjerava da NEMA drugog elementa osim orderBy omotača. */
.ep-poruke:not(:has(.t-Region-body > :not(.t-Region-orderBy))) { display:none; }
.ep-poruke .t-Region-title { display:flex; align-items:center; gap:.5rem; }
.ep-skupina { display:flex; align-items:center; gap:.5rem; margin:0 0 .5rem; font-size:1rem; font-weight:600; }
.ep-skupina .fa { color: var(--ut-palette-primary); }
.ep-skupina--opca .fa { color: var(--ut-body-text-color); opacity:.6; }
.ep-brojac { display:inline-flex; min-width:1.5rem; height:1.5rem; padding:0 .4rem; align-items:center; justify-content:center;
  border-radius:999px; font-size:.75rem; font-weight:700; background: var(--ut-palette-danger); color: var(--ut-palette-danger-contrast); }
.ep-brojac--tih { background: var(--ut-component-border-color); color: var(--ut-body-text-color); }
/* T58 (Zadatak 6): brojač u naslovu kartice "Za vas" na p3 -- prazan item (0 nevidjenih) se ne prikazuje */
.ep-brojac:empty { display:none; }
/* atribut hidden (0 novih) -- display:inline-flex gore inace nadjacava UA pravilo [hidden] */
.ep-brojac[hidden] { display:none; }
.ep-lista { list-style:none; margin:0; padding:0; display:grid; gap:.75rem; }

.ep-poruka { position:relative; display:grid; grid-template-columns:auto 1fr; gap:.25rem .875rem; padding:.875rem 1rem;
  border-radius: var(--ut-component-border-radius, .25rem); }
.ep-poruka__ikona { grid-row: span 3; width:2.5rem; height:2.5rem; border-radius:50%; display:flex; align-items:center; justify-content:center; }
.ep-poruka__meta { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; font-size:.75rem; }
.ep-poruka__datum { margin-inline-start:auto; opacity:.75; white-space:nowrap; }
.ep-poruka__naslov { font-weight:600; font-size:.9375rem; margin:0; }
.ep-poruka__tekst { margin:0; font-size:.875rem; }
.ep-poruka__akcije { grid-column:2; display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.5rem; }

/* osobna: nijansirana pozadina u primarnoj boji + rub u boji vrste */
.ep-poruka--osobna { background: color-mix(in srgb, var(--ut-palette-primary) 6%, var(--ut-component-background-color));
  border:1px solid color-mix(in srgb, var(--ut-palette-primary) 25%, transparent);
  border-inline-start:4px solid var(--ep-vrsta, var(--ut-palette-primary)); box-shadow: var(--ut-shadow-sm); }
.ep-poruka--osobna .ep-poruka__ikona { background: var(--ep-vrsta, var(--ut-palette-primary)); color: var(--ut-palette-primary-contrast); }
.ep-poruka--nadopuna { --ep-vrsta: var(--ut-palette-warning); }
.ep-poruka--nadopuna .ep-poruka__ikona { color: var(--ut-palette-warning-contrast); }
.ep-poruka--odbijen  { --ep-vrsta: var(--ut-palette-danger); }
.ep-poruka--odbijen .ep-poruka__ikona { color: var(--ut-palette-danger-contrast); }
.ep-poruka--info     { --ep-vrsta: var(--ut-palette-primary); }
.ep-nova::before { content:""; position:absolute; top:.875rem; inset-inline-end:.875rem; width:.5rem; height:.5rem; border-radius:50%;
  background: var(--ut-palette-danger); }
.ep-nova .ep-poruka__datum { margin-inline-end:1rem; }

.ep-oznaka { display:inline-flex; align-items:center; gap:.25rem; padding:.125rem .5rem; border-radius:999px; font-weight:600; }
.ep-oznaka--ja { background: var(--ut-palette-primary); color: var(--ut-palette-primary-contrast); }
.ep-oznaka--vrsta { background: color-mix(in srgb, var(--ep-vrsta) 15%, transparent); color: var(--ut-body-text-color); }
.ep-oznaka--svi { background: var(--ut-component-border-color); color: var(--ut-body-text-color); }

/* opća: bez okvira i boje, samo razdjelnik */
.ep-lista--opce { gap:0; }
.ep-poruka--opca { padding:.75rem 0; border-radius:0; border-bottom:1px solid var(--ut-component-border-color); }
.ep-lista--opce > li:last-child .ep-poruka--opca { border-bottom:0; }
.ep-poruka--opca .ep-poruka__ikona { width:2rem; height:2rem; background: var(--ut-component-border-color); color: var(--ut-body-text-color); }
.ep-poruka--opca .ep-poruka__naslov { font-weight:500; }

.ep-prazno { display:flex; align-items:center; gap:.5rem; padding:.75rem 1rem; border:1px dashed var(--ut-component-border-color);
  border-radius: var(--ut-component-border-radius, .25rem); font-size:.875rem; opacity:.85; }
.ep-prijava { display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; padding:.75rem 1rem; margin-bottom:1rem;
  background: color-mix(in srgb, var(--ut-palette-primary) 6%, var(--ut-component-background-color)); border-radius: var(--ut-component-border-radius, .25rem); font-size:.875rem; }
.ep-razmak { margin-top:1.5rem; }
.ep-sakrij-gumb { opacity:.85; }

.ep-oznaka--ikona { padding:.125rem .375rem; }

/* --- stranica Sve obavijesti --- */
.ep-mrvice { display:flex; gap:.5rem; font-size:.8125rem; margin:.5rem 0 .25rem; }
.ep-mrvice a { color: var(--ut-link-text-color, var(--ut-palette-primary)); }
.ep-naslov-str { font-size:1.5rem; font-weight:600; margin:0 0 1rem; }
.ep-alati { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:.75rem; margin-bottom:1rem; }
.ep-trazi { max-width:20rem; flex:1 1 14rem; }
.ep-filtri { display:inline-flex; border:1px solid var(--ut-component-border-color); border-radius: var(--ut-component-border-radius, .25rem); overflow:hidden; }
.ep-filtar { border:0; background: var(--ut-component-background-color); color: var(--ut-body-text-color); padding:.375rem .75rem; font-size:.8125rem; cursor:pointer; }
.ep-filtar + .ep-filtar { border-inline-start:1px solid var(--ut-component-border-color); }
.ep-filtar.is-active { background: var(--ut-palette-primary); color: var(--ut-palette-primary-contrast); }
.ep-stranicenje { font-size:.8125rem; opacity:.75; margin-top:1rem; }
.ep-oznaka--stanje-procitana { background: var(--ut-component-border-color); color: var(--ut-body-text-color); font-weight:500; }
.ep-oznaka--stanje-rijesena { background: color-mix(in srgb, var(--ut-palette-success) 18%, transparent); color: var(--ut-body-text-color); }
/* pročitana: bez nijanse; riješena: utišana, zeleni rub */
.ep-stanje--procitana { background: var(--ut-component-background-color); box-shadow:none; }
.ep-stanje--rijesena { --ep-vrsta: var(--ut-palette-success); background: var(--ut-component-background-color); box-shadow:none; opacity:.85; }
.ep-stanje--rijesena .ep-poruka__ikona { color: var(--ut-palette-success-contrast); }