/* ============================================================
   Rizici i prilike (plan 064, P1)

   Proširenje qms.css, ne zamjena: tokeni i komponente (kartica, polje,
   popis, traka) dolaze odande, a ovdje stoji samo ono što registar rizika
   ima, a drugi ekrani nemaju — razina s bojom i mreža matrice.

   Boje razina dolaze iz BAZE kao TOKEN ('good', 'warn', 'bad',
   'bad-strong', 'muted'), nikad kao HEX: tema se mijenja, baza ne.
   ============================================================ */

/* ---- oznaka vrste uz naslov ---- */
.qms-tag--riz { background: var(--warn-soft); color: var(--warn-text); }
.qms-tag--pri { background: var(--good-soft); color: var(--ink-strong); }

/* ---- razina i ocjena ---- */
.qms-riz-level {
    display: inline-flex; align-items: baseline; gap: 7px;
    padding: 2px 9px;
    border-radius: 999px;
    background: var(--neutral-soft);
    color: var(--ink-2);
    white-space: nowrap;
}

.qms-riz-score { font-size: 14px; font-weight: 650; font-variant-numeric: tabular-nums; }
.qms-riz-levelname { font-size: 12.5px; }

.qms-riz-level--good { background: var(--good-soft); color: var(--ink-strong); }
.qms-riz-level--info { background: var(--info-soft); color: var(--ink-strong); }
.qms-riz-level--warn { background: var(--warn-soft); color: var(--warn-text); }
.qms-riz-level--bad { background: var(--bad-soft); color: var(--bad-text); }

/* Ekstremna razina je jedina koja se ne čita usput — zato puna boja. */
.qms-riz-level--bad-strong { background: var(--bad); color: var(--accent-ink); }
.qms-riz-level--muted { background: var(--neutral-soft); color: var(--ink-3); }

/* ---- stanje u desnom stupcu ---- */
.qms-riz-stanje { padding: 4px 0 10px; }

.qms-riz-ishod { display: flex; align-items: baseline; gap: 8px; min-height: 30px; }
.qms-riz-ishod .qms-riz-score { font-size: 20px; color: var(--ink-strong); }
.qms-riz-ishod .qms-riz-levelname { color: var(--ink-2); }

/* ---- činjenice (naziv → vrijednost) ---- */
.qms-riz-facts { margin: 0; display: flex; flex-direction: column; }

.qms-riz-facts dt {
    font-size: 12.5px; font-weight: 400; color: var(--ink-3);
    padding-top: 8px;
}

.qms-riz-facts dd {
    margin: 0 0 2px;
    padding-bottom: 8px;
    color: var(--ink-strong);
    border-bottom: 1px solid var(--line-soft);
}

.qms-riz-facts dd:last-child { border-bottom: 0; }

/* ---- zaglavlje kartice i obrazac ---- */
.qms-riz-cardhead {
    display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
    margin: 0 0 13px;
    font-size: 15px; font-weight: 600; color: var(--ink-strong);
}

.qms-riz-cardhead + .qms-riz-cardhead,
.qms-riz-form + .qms-riz-cardhead,
.qms-grid-wrap + .qms-riz-cardhead { margin-top: 20px; }

.qms-riz-cardhead .qms-page-note { font-weight: 400; }

.qms-riz-form {
    display: grid; gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.qms-riz-wide { grid-column: 1 / -1; }
.qms-riz-note { font-size: 12.5px; color: var(--ink-3); }

.qms-riz-actions {
    display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
    margin-top: 16px;
}

.qms-riz-chk { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--ink-2); }
.qms-riz-clear { font-size: 12.5px; color: var(--ink-3); }

/* ---- mreža matrice ----
   Ista brojka znači različito u 3×3 i u 5×5, pa se procjena pokazuje na
   mreži, a ne samo kao broj. */
.qms-riz-matrix { margin-top: 14px; }

.qms-riz-matrix table { table-layout: fixed; }
/* Zaglavlje stupca stoji nad brojkama koje opisuje. `.qms-list thead th` je
   specifičniji od `.qms-riz-matrix th`, pa je tekst ostajao lijevo iako je
   ovdje pisalo center — zato `table thead th`. */
.qms-riz-matrix table thead th { text-align: center; font-size: 12.5px; color: var(--ink-3); }
.qms-riz-matrix table tbody th { text-align: right; font-size: 12.5px; color: var(--ink-3); white-space: nowrap; }

/* Prvo polje zaglavlja je naziv osi („Korist \ Izvedivost“), ne stupac ocjena.
   Ide desno, kao i nazivi redaka ispod njega — inače stoji odvojeno na drugom
   kraju istog stupca. */
.qms-riz-matrix table thead th:first-child { text-align: right; }

.qms-riz-cell {
    text-align: center;
    font-variant-numeric: tabular-nums;
    cursor: pointer;
    border: 1px solid transparent;
}

.qms-riz-cell.is-picked {
    border-color: var(--accent);
    box-shadow: inset 0 0 0 1px var(--accent);
    font-weight: 650;
}

@media (max-width: 900px) {
    .qms-riz-form { grid-template-columns: minmax(0, 1fr); }
}

/* ---- tretman: kontrole i mjere (plan 069, P2) ---- */
.qms-riz-dodaj { margin-top: 14px; }
.qms-riz-dodaj > summary { list-style: none; cursor: pointer; display: inline-flex; }
.qms-riz-dodaj > summary::-webkit-details-marker { display: none; }
.qms-riz-dodaj[open] > summary { margin-bottom: 12px; }

/* Ugašena kontrola ostaje čitljiva, ali se ne čita kao ono što danas drži rizik. */
.qms-riz-ugaseno { opacity: .62; }

/* Uredi/Ugasi stoje jedno uz drugo na kraju retka kontrole. */
.qms-riz-alati { display: flex; gap: 6px; align-items: flex-start; }

.qms-riz-uredi > summary { list-style: none; cursor: pointer; display: inline-flex; }
.qms-riz-uredi > summary::-webkit-details-marker { display: none; }

/* Panel za uređivanje kontrole pluta ispod retka. Prije je tekao u ćeliji, a
   ćelija je široka koliko gumb „Uredi“ — pa je „Bilješka o provjeri“ bila uža
   od vlastite oznake. Zato ovaj omotač ne smije rezati sadržaj. */
.qms-riz-kontrole { overflow: visible; }
.qms-riz-alati { position: relative; }

.qms-riz-panel {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 6;
    width: 520px;
    max-width: 78vw;
    padding: 14px 16px;
    background: var(--surface-2);
    border: 1px solid var(--line);
    border-radius: 6px;
    box-shadow: 0 10px 28px rgb(0 0 0 / .35);
}

.qms-riz-panel .qms-field { min-width: 0; }
.qms-riz-panel textarea.form-control { min-height: 78px; resize: vertical; }
.qms-riz-panel .qms-riz-actions { margin-top: 12px; }

/* ---- ciklus (plan 070, P3) ---- */
.qms-riz-pokrivenost { display: inline-flex; align-items: baseline; gap: 6px; white-space: nowrap; }

/* ---- Knjižnica tipičnih rizika (plan 064, P5) -------------------------- */

.qms-riz-knj-sel { width: 36px; text-align: center; }
.qms-riz-knj-naslov { font-weight: 550; }

/* Već uvezeno se ne nudi drugi put, ali se vidi — da bude jasno zašto ga nema
   u odabiru. */
.qms-riz-knj-ima { color: var(--ink-3); }
.qms-riz-knj-ima .qms-riz-knj-naslov { font-weight: 400; }
.qms-riz-knj-kvaka { color: var(--ink-3); }

.qms-riz-knj-podnozje { margin-top: 14px; }

.qms-riz-prazno-akcije { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; margin-top: 4px; }

/* ---- Uvoz zatečenog registra (plan 064, P5) ---------------------------- */

.qms-riz-uvoz-popis { margin: 0; padding-left: 18px; color: var(--ink-2); font-size: 13px; }
.qms-riz-uvoz-popis li + li { margin-top: 6px; }

/* Redak koji ne ulazi mora se vidjeti u izvještaju bez čitanja stupca „Ishod". */
.qms-riz-uvoz-lose { background: var(--bad-soft); }
.qms-riz-uvoz-greska { color: var(--bad-text); }

.qms-riz-uvoz-potvrda { display: inline-block; margin: 0; }

/* ------------------------------------------------------------
   Registar: pokazatelji i stupci grida
   ------------------------------------------------------------ */

/* Pet pokazatelja u mreži za četiri znači da peti pada u vlastiti red i
   izgleda kao greška u slaganju. */
.qms-riz-summary { grid-template-columns: repeat(5, minmax(0, 1fr)); }

@media (max-width: 1500px) { .qms-riz-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px)  { .qms-riz-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Tablica je table-layout: fixed, a bez zadanih širina svi stupci dobiju
   jednako — pa je „Naslov" bio stisnut jednako kao „Mjere" s jednom brojkom.
   Naslov uzima ostatak (width: auto u fiksnom rasporedu). */
.qms-list--reg th.c-code   { width: 128px; }
.qms-list--reg th.c-title  { width: auto; }
.qms-list--reg th.c-proc   { width: 160px; }
.qms-list--reg th.c-owner  { width: 130px; }
.qms-list--reg th.c-status { width: 120px; }
.qms-list--reg th.c-score  { width: 140px; }
.qms-list--reg th.c-rev    { width: 120px; }
.qms-list--reg th.c-act    { width: 92px; }

@media (max-width: 900px) {
    .qms-list--reg { table-layout: auto; }
    .qms-list--reg th, .qms-list--reg td { width: auto !important; }
}

/* Kartice u desnom stupcu: .qms-railcard nema unutarnji razmak jer ga na
   slučajevima donose komponente u njoj (.qms-railaction i slično). Ovdje
   sadržaj stoji izravno, pa mu razmak treba dati omotač. */
.qms-riz-railbody { padding: 14px 18px; }
.qms-riz-railbody > :first-child { margin-top: 0; }
.qms-riz-railbody > :last-child { margin-bottom: 0; }
.qms-riz-railbody .qms-iconbtn--text { margin-top: 10px; }
