/* ============================================================
   Evidencija zaposlenika (plan 080, paket I0)

   Proširuje qms.css, ne dira njegove tokene.

   Jedno pravilo drži cijeli ekran: ono što je PRAZNO nije greška. Zaposlenik
   bez računa je normalan (radnik na liniji se ne prijavljuje), zaposlenik bez
   šifre je normalan (ručni unos), a zaposlenik bez radnog mjesta je rupa — i
   samo to treće nosi boju upozorenja. Kad bi svako prazno polje bilo crveno,
   prvi ekran nakon uvoza od tisuću ljudi bio bi crven cijeli i nitko ne bi
   gledao koja je rupa stvarna.
   ============================================================ */

/* ------------------------------------------------------------
   1. PRIGUŠENI TEKST — čitljiv u obje teme
   ------------------------------------------------------------ */
.qms-theme, .qms-theme-dark { --emp-muted: #868f96; }
.qms-theme-light { --emp-muted: #6b757c; }

/* ------------------------------------------------------------
   2. POZIV NA PREGLED IMENJAKA
   Nije greška nego napomena, pa nosi obavijesnu boju, ne boju kvara.
   ------------------------------------------------------------ */
.qms-emp-dvojnici-poziv {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 0.85rem;
    border: 1px solid var(--info-soft);
    border-radius: var(--r-md, 8px);
    background: var(--info-soft);
    font-size: 0.92rem;
}

.qms-emp-dvojnici-poziv i { color: var(--info); }

.qms-emp-dvojnici-poziv a {
    margin-left: auto;
    font-weight: 600;
}

/* ------------------------------------------------------------
   3. FILTERI
   ------------------------------------------------------------ */
.qms-emp-filter-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    align-items: end;
    gap: 0.75rem 1rem;
}

.qms-emp-chk {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    cursor: pointer;
    font-size: 0.93rem;
    padding-bottom: 0.4rem;
}

.qms-emp-clear {
    color: var(--emp-muted);
    font-size: 0.9rem;
}

/* ------------------------------------------------------------
   4. TABLICA
   ------------------------------------------------------------ */
.qms-emp-table td { vertical-align: top; }

.qms-emp-ime {
    font-weight: 600;
    text-decoration: none;
}

/* Kvačica „ima račun" je informacija, ne postignuće — prigušena je namjerno. */
.qms-emp-racun {
    margin-left: 0.35rem;
    color: var(--emp-muted);
    font-size: 0.85rem;
}

.qms-emp-prazno { color: var(--emp-muted); }

/* Naziv radnog mjesta koji još nije u šifrarniku. Razlika se vidi jer samo
   šifrarnik nosi traženu osposobljenost — bez njega osoba ne ulazi u matricu. */
.qms-emp-izvor {
    display: block;
    color: var(--emp-muted);
    font-size: 0.82rem;
    margin-top: 0.1rem;
}

.qms-emp-row--otisao td { opacity: 0.62; }

/* ------------------------------------------------------------
   5. STANJE
   ------------------------------------------------------------ */
.qms-emp-stanje {
    display: inline-block;
    padding: 0.16rem 0.55rem;
    border-radius: 999px;
    font-size: 0.83rem;
    font-weight: 600;
    white-space: nowrap;
    border: 1px solid transparent;
}

.qms-emp-stanje.is-ok {
    background: var(--good-soft);
    color: var(--good-text);
    border-color: color-mix(in oklch, var(--good) 30%, transparent);
}

.qms-emp-stanje.is-off {
    background: var(--neutral-soft);
    color: var(--emp-muted);
    border-color: var(--line-strong);
}

/* Anonimiziran zapis nije ni dobar ni loš ishod — on je dokaz da je obrada
   provedena. Zato obavijesna boja, ne siva i ne crvena. */
.qms-emp-stanje.is-anon {
    background: var(--info-soft);
    color: var(--info);
    border-color: color-mix(in oklch, var(--info) 30%, transparent);
}

/* ------------------------------------------------------------
   6. OBRAZAC
   ------------------------------------------------------------ */
.qms-emp-form { display: flex; flex-direction: column; gap: 1rem; }

/* Mreža obrasca i `--wide` su u qms-layout.css pod općim imenom (plan 113).
   Ostaje samo ono što je ovom modulu doista vlastito. */

.qms-emp-field--email { grid-column: 1 / -1; }

.qms-emp-req { color: var(--bad-text, var(--bad)); }

.qms-emp-nema-sifrarnika {
    padding: 0.45rem 0.6rem;
    border: 1px dashed var(--line-strong);
    border-radius: var(--r-sm, 6px);
    color: var(--emp-muted);
    font-size: 0.88rem;
}

.qms-emp-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    padding-top: 0.25rem;
}

/* ------------------------------------------------------------
   7. DETALJ
   ------------------------------------------------------------ */
.qms-emp-detail {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.qms-emp-h2 {
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 0.75rem;
}

.qms-emp-dl {
    display: grid;
    grid-template-columns: minmax(150px, max-content) 1fr;
    gap: 0.45rem 1rem;
    margin: 0;
}

.qms-emp-dl dt {
    color: var(--emp-muted);
    font-size: 0.9rem;
    font-weight: 400;
}

.qms-emp-dl dd { margin: 0; }

.qms-emp-ko {
    display: block;
    color: var(--emp-muted);
    font-size: 0.85rem;
}

.qms-emp-izvor-tekst {
    color: var(--emp-muted);
    white-space: pre-wrap;
}

.qms-emp-objasnjenje {
    color: var(--emp-muted);
    font-size: 0.9rem;
    margin: 0 0 0.75rem;
}

.qms-emp-sparen {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.qms-emp-sparen i { color: var(--good-text); }

.qms-emp-akcija { margin-top: 0.75rem; }

.qms-emp-akcija--red {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 0.6rem;
    margin-top: 0.75rem;
}

.qms-emp-akcija--red .form-select { max-width: 340px; }

/* ------------------------------------------------------------
   8. RADNJE
   Svaka radnja nosi svoje objašnjenje, jer su tri od četiri nepovratne ili
   mijenjaju značenje zapisa. „Jedan put do jedne promjene."
   ------------------------------------------------------------ */
.qms-emp-radnje { display: flex; flex-direction: column; }

.qms-emp-radnja {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 0.75rem 1.5rem;
    padding: 0.85rem 0;
    border-top: 1px solid var(--line-soft);
}

.qms-emp-radnja:first-of-type { border-top: 0; padding-top: 0; }
.qms-emp-radnja:last-child { padding-bottom: 0; }

.qms-emp-radnja-tekst {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    max-width: 46rem;
}

.qms-emp-radnja-tekst span {
    color: var(--emp-muted);
    font-size: 0.88rem;
}

/* Zaključana radnja kaže zašto je zaključana, uz mjesto gdje bi gumb stajao. */
.qms-emp-zakljucano {
    color: var(--emp-muted);
    font-size: 0.88rem;
    font-style: italic;
    max-width: 22rem;
}

/* ------------------------------------------------------------
   9. IMENJACI
   ------------------------------------------------------------ */
.qms-emp-dvojnici-sazetak {
    color: var(--emp-muted);
    font-size: 0.92rem;
}

.qms-emp-dvojnik { margin-bottom: 0; }

.qms-emp-dvojnik-head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.5rem 0.85rem;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--line);
}

.qms-emp-dvojnik-ime { font-weight: 600; }

.qms-emp-dvojnik-broj {
    color: var(--emp-muted);
    font-size: 0.88rem;
}

.qms-emp-dvojnik-upozorenje {
    margin-left: auto;
    padding: 0.12rem 0.5rem;
    border-radius: 999px;
    background: var(--warn-soft);
    color: var(--warn-text, var(--warn));
    font-size: 0.82rem;
    font-weight: 600;
}

.qms-emp-dvojnik-veza { text-align: right; white-space: nowrap; }

/* ------------------------------------------------------------
   10. PLOČICE
   ------------------------------------------------------------ */
.qms-emp-summary .qms-summary-value.is-warn { color: var(--warn-text, var(--warn)); }

/* Tri pločice, ne četiri kao drugdje. Zajednička mreža ih na širokom ekranu
   slaže dvije pa jednu, što izgleda kao da je četvrta ispala. */
@media (min-width: 1100px) {
    .qms-emp-summary { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 680px) {
    .qms-emp-dl { grid-template-columns: 1fr; gap: 0.15rem; }
    .qms-emp-dl dd { margin-bottom: 0.5rem; }
}

/* Pločice obuka (plan 098, nalaz N-17) — pet, ne četiri kao zadano. Isti
   prijelomi kao kod dobavljača, koji ih također imaju pet: na 1500 px tri u
   redu, na 900 px dvije. Peta („Bez liste prisutnosti“) inače pada sama u drugi
   red i izgleda kao da je ispala. */
.qms-trn-summary { grid-template-columns: repeat(5, minmax(0, 1fr)); }

@media (max-width: 1500px) { .qms-trn-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px)  { .qms-trn-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } }