/* ============================================================
   Karlix QMS — modul Dokumenti (plan 051, paket P1)

   Samo ono što postojeće datoteke nemaju: redak s kvačicom u obrascu,
   razmak iznad gumba obrasca, te popis verzija i datoteka na detalju.

   Ne dira qms.css ni njegove tokene (pravilo iz CLAUDE.md) — koristi ih.
   ============================================================ */

/* Kvačica s natpisom u istom retku — obrazac inače razbaca natpis ispod. */
.qms-doc-check {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 12px;
    font-size: 13px;
    color: var(--ink-2);
}

.qms-doc-form-actions { margin-top: 16px; }

/* ---- Verzije ----
   Vremenska crta odozgo prema dolje: najnovija verzija prva, jer se o njoj
   odlučuje. Starije se čitaju rjeđe i tada se traže namjerno. */
.qms-doc-version {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 14px 0;
    border-top: 1px solid var(--line);
}

.qms-doc-version:first-child { border-top: 0; padding-top: 0; }

.qms-doc-version-head {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.qms-doc-version-label { font-weight: 600; color: var(--ink-strong); }

.qms-doc-version-meta {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    font-size: 12.5px;
    color: var(--ink-3);
}

/* Verzija koja vrijedi — jedina koja se smije upotrebljavati. */
.qms-doc-version.is-effective .qms-doc-version-label { color: var(--accent-text); }

/* Ono što je bilo na snazi, a više nije. Oznaka mora biti vidljiva prije
   nego što netko otvori datoteku, ne poslije. */
.qms-doc-obsolete {
    font-size: 12px;
    font-weight: 600;
    color: var(--bad-text, #c2410c);
}

/* ---- Datoteke ---- */
.qms-doc-files { display: flex; flex-direction: column; gap: 6px; }

.qms-doc-file {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    font-size: 13px;
}

.qms-doc-file-role {
    min-width: 92px;
    font-size: 12px;
    color: var(--ink-3);
}

.qms-doc-file-size { font-size: 12px; color: var(--ink-4); }

.qms-doc-upload {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 10px;
}

.qms-doc-upload .qms-field { min-width: 180px; }

/* ---- Upoznavanje (P3) ----
   Onaj tko nije potvrdio mora se vidjeti prije onih koji jesu; boja je ista
   kao kod zastarjelog, jer je i ovo stanje koje traži nečiju radnju. */
.qms-doc-pending {
    font-size: 12px;
    font-weight: 600;
    color: var(--warn-text, #b45309);
}

/* Redak zadatka na ekranu Moja zaduzenja. */
.qms-task {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding: 12px 0;
    border-top: 1px solid var(--line);
    font-size: 13px;
}

.qms-task:first-child { border-top: 0; padding-top: 0; }
.qms-task-code { font-weight: 600; min-width: 132px; color: var(--ink-strong); }
.qms-task-spacer { flex: 1 1 auto; }

/* ---- Veze (P4) ----
   Redak veze čita se slijeva nadesno kao rečenica: vrsta veze, pa zapis.
   Zato vrsta ima fiksnu širinu — oko nje se popis poravnava sam. */
.qms-links { display: flex; flex-direction: column; gap: 2px; }

.qms-link {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 8px 0;
    border-top: 1px solid var(--line);
    font-size: 13px;
}

.qms-link:first-child { border-top: 0; }
.qms-link-icon { color: var(--ink-3); font-size: 14px; }
.qms-link-rel { min-width: 112px; font-size: 12px; color: var(--ink-3); }
.qms-link-main { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; min-width: 0; }
.qms-link-title { color: var(--ink-2); }
.qms-link-kind { font-size: 12px; color: var(--ink-4); }
.qms-link-note { font-size: 12px; color: var(--ink-4); font-style: italic; }

/* Zapis kojeg više nema. Veza se ne skriva: da nestane, dosje bi tvrdio da je
   nikad nije ni bilo. */
.qms-link-gone { color: var(--ink-4); text-decoration: line-through; }

/* Isti popis stoji i u uskoj bočnoj traci slučaja i audita. Ondje se obrazac
   slaže odozgo prema dolje — u jedan redak ne stane, a stisnuta polja se ne
   mogu pročitati. */
.qms-railcard .qms-doc-upload {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
}

.qms-railcard .qms-doc-upload .qms-field { min-width: 0; }
.qms-railcard .qms-link { gap: 8px; }
.qms-railcard .qms-link-rel { min-width: 0; }
.qms-railcard .qms-link-kind { display: none; }

/* Obrazac kopiranja stoji u padajućem panelu, pa ide odozgo prema dolje —
   u jedan redak ne stane, a stisnuta polja se ne mogu pročitati. */
.qms-doc-copy {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 4px 2px 2px;
    min-width: 280px;
}

.qms-doc-copy .qms-page-note { margin: 0; }

/* ---- Povučen iz registra (15.09.2026.) ----
   Ista boja koju sustav već koristi za stanje koje traži nečiju pažnju
   (--warn-*), samo na cijeloj kartici: ono što se čita nije više u registru,
   i to se mora vidjeti prije sadržaja, a ne ispod njega. */
.qms-card--warn {
    border-color: var(--warn-text);
    background: var(--warn-soft);
}

.qms-card--warn h2 {
    color: var(--warn-text);
}

/* Oznaka povučenog u retku registra — ista riječ i ista boja kao na detalju. */
.qms-doc-retired {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--warn-text);
    white-space: nowrap;
}

/* ============================================================
   Gridovi modula (057, 15.09.2026.)

   Isti pristup kao na nesukladnostima (`qms-list--un`): širine stupaca
   pripadaju popisu, ne ćeliji. Bez toga se šifra lomi u dva reda, a
   stupac s gumbima raste s najduljim natpisom.
   ============================================================ */

.qms-list--doc { table-layout: fixed; }

.qms-list--doc th.c-code   { width: 160px; }
.qms-list--doc th.c-title  { width: auto; }
.qms-list--doc th.c-ver    { width: 80px; }
.qms-list--doc th.c-step   { width: 70px; }
.qms-list--doc th.c-date   { width: 130px; }
.qms-list--doc th.c-num    { width: 110px; text-align: right; }
.qms-list--doc th.c-act    { width: 250px; }

.qms-list--doc td.c-num { text-align: right; font-variant-numeric: tabular-nums; }

/* Gumbi u retku: jedan red, desno, bez razmaka koji se lomi. */
.qms-list--doc td.c-act {
    text-align: right;
    white-space: nowrap;
}
.qms-list--doc td.c-act .btn + .btn,
.qms-list--doc td.c-act form { margin-left: 6px; }
.qms-list--doc td.c-act form { display: inline-block; }

@media (max-width: 900px) {
    .qms-list--doc { table-layout: auto; }
    .qms-list--doc th, .qms-list--doc td { width: auto !important; }
    .qms-list--doc td.c-num, .qms-list--doc td.c-act { text-align: left; }
}

/* ------------------------------------------------------------
   Vrste dokumenata — popis koji se uređuje u retku
   ------------------------------------------------------------ */

.qms-list--dt { table-layout: fixed; }

.qms-list--dt th.c-code { width: 70px; }
.qms-list--dt th.c-name { width: auto; }
.qms-list--dt th.c-use  { width: 100px; text-align: right; }
.qms-list--dt th.c-rev  { width: 120px; }
.qms-list--dt th.c-ret  { width: 120px; }
.qms-list--dt th.c-tpl  { width: 150px; }
.qms-list--dt th.c-act  { width: 104px; text-align: right; }

.qms-list--dt td.c-use { text-align: right; font-variant-numeric: tabular-nums; }
.qms-list--dt td.c-act { text-align: right; }

/* Brojčano polje i njegova mjera stoje u JEDNOM retku, pa je i redak tablice
   visok jedan red. Dok je mjera stajala ispod polja, svaka je vrsta zauzimala
   dvije visine i stupci s rokovima prestali su se dati usporediti pogledom. */
.qms-dt-rok { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.qms-dt-rok .form-control { width: 66px; text-align: right; }

.qms-dt-tpl { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }


/* Neaktivna vrsta se i dalje čita, ali ne traži pogled. */
.qms-list--dt tr.is-off td.c-code,
.qms-list--dt tr.is-off td.c-name { opacity: .72; }

@media (max-width: 900px) {
    .qms-list--dt { table-layout: auto; }
    .qms-list--dt th, .qms-list--dt td { width: auto !important; }
    .qms-list--dt td.c-use, .qms-list--dt td.c-act { text-align: left; }
}

/* ------------------------------------------------------------
   Registar i „Svi dokumenti"
   ------------------------------------------------------------ */

.qms-list--reg { table-layout: fixed; }

.qms-list--reg th.c-code  { width: 118px; }
.qms-list--reg th.c-title { width: auto; }
.qms-list--reg th.c-type  { width: 108px; }
.qms-list--reg th.c-ver   { width: 74px; }
.qms-list--reg th.c-eff   { width: 104px; }
.qms-list--reg th.c-rev   { width: 116px; }
.qms-list--reg th.c-owner { width: 118px; }

/* Šifra je oznaka, ne rečenica: prelomljena u dva reda prestaje biti
   prepoznatljiva na prvi pogled. */
.qms-list--reg td.c-code a { white-space: nowrap; }

@media (max-width: 900px) {
    .qms-list--reg { table-layout: auto; }
    .qms-list--reg th, .qms-list--reg td { width: auto !important; }
}

/* ------------------------------------------------------------
   Otvoreni dokument (057 P5)
   ------------------------------------------------------------ */

/* Izbornik „ostale radnje" nosi i dva kratka obrasca (kopija, povlačenje),
   pa je širi od običnog popisa stavki i ne lomi polja u dva reda. */
.qms-doc-menu { min-width: 320px; }

.qms-doc-menuform { padding: 8px 14px 12px; }
.qms-doc-menuform .qms-cols-head { margin-bottom: 8px; }
.qms-doc-menuform .qms-page-note { margin: 8px 0; }

/* Desni stupac: činjenice o dokumentu jedna ispod druge. */
.qms-doc-facts { display: flex; flex-direction: column; }
.qms-doc-fact {
    display: flex; align-items: baseline; gap: 10px;
    padding: 9px 18px;
    border-bottom: 1px solid var(--line-soft);
    font-size: 13px;
}
.qms-doc-fact:last-child { border-bottom: 0; }
.qms-doc-fact-label { flex: 0 0 132px; color: var(--ink-3); font-size: 12.5px; }
.qms-doc-fact-value { min-width: 0; color: var(--ink-strong); }

@media (max-width: 1100px) {
    .qms-doc-fact-label { flex-basis: 120px; }
}

/* Naslov odjeljka unutar kartice s padingom: ista veličina kao qms-card-title
   drugdje, bez zadanog razmaka koji <h2> nosi sa sobom. */
.qms-card--pad > h2.qms-card-title { display: block; margin: 0 0 13px; }

/* Obrasci unutar odjeljka ne smiju se dodirivati s naslovom ni međusobno. */
.qms-card--pad > .qms-doc-upload + .qms-doc-upload,
.qms-card--pad > form + form { margin-top: 12px; }

/* ------------------------------------------------------------
   Prijenos vlasništva — dva birača osobe

   Oba polja moraju primiti dvostruko ime i prezime („Marija Ana
   Horvat-Kovačević") a da se ne reže. U flex retku su se inače stiskala na
   najmanju širinu koju im sadržaj dopusti.
   ------------------------------------------------------------ */

.qms-doc-transfer .qms-field { flex: 1 1 320px; min-width: 300px; max-width: 420px; }
.qms-doc-transfer .select2-container { min-width: 0; }

/* ------------------------------------------------------------
   Vlasništvo — tko drži koliko

   Imena su kratka, pa raširen stupac ostavlja praznu prugu između imena i
   brojke i oči ih prestaju povezivati. Ime i broj stoje jedno uz drugo,
   ostatak retka uzima napomena.
   ------------------------------------------------------------ */

.qms-list--own { table-layout: fixed; }

.qms-list--own th.c-owner { width: 230px; }
.qms-list--own th.c-num   { width: 110px; text-align: right; }
.qms-list--own th.c-note  { width: auto; }

.qms-list--own td.c-num { text-align: right; font-variant-numeric: tabular-nums; }

@media (max-width: 900px) {
    .qms-list--own { table-layout: auto; }
    .qms-list--own th, .qms-list--own td { width: auto !important; }
    .qms-list--own td.c-num { text-align: left; }
}

/* ------------------------------------------------------------
   Uvoz dokumentacije — birač ZIP arhive

   Naziv stvarne arhive („zatecena-dokumentacija-pik-2026-09.zip") ne stane u
   zadanu širinu polja, pa se vidi tek trećina imena i ne zna se je li odabrana
   prava datoteka.
   ------------------------------------------------------------ */

.qms-doc-zip .qms-field { flex: 1 1 460px; min-width: 380px; max-width: 620px; }

/* Na telefonu 380px NE STANE: zaslon je 375px, pa polje izbaci cijelu
   stranicu u vodoravno pomicanje. Ime arhive se tada i dalje vidi, samo u dva
   reda — a to je bolje od stranice koja se vuce u stranu (plan 238). */
@media (max-width: 480px) {
    .qms-doc-zip .qms-field { min-width: 0; }
}