/* ============================================================
   Kontekst i zainteresirane strane — plan 080, paket I4

   Proširuje qms.css. Oba registra dijele sve razrede, jer dijele i oblik: zapis,
   datum pregleda i ono što je iz njega izašlo.

   Tri vlastite stvari:
     - OZNAKA PREGLEDA, ista obitelj kao stanje roka kod opreme;
     - OZNAKA SMJERA (prilika / prijetnja / oboje) i UTJECAJA (visok / srednji / nizak);
     - OKVIR RUPE — pitanje bez rizika i strana bez zahtjeva. To nisu prazna polja
       nego nedovršen posao, pa nose isti oblik kao okvir nalaza kod opreme.
   ============================================================ */

/* ============================================================
   1. OZNAKE
   ============================================================ */
.qms-kon-pregled,
.qms-kon-smjer,
.qms-kon-utjecaj {
    display: inline-block;
    padding: 2px 8px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

/* ---- pregled ---- */
.qms-kon-pregled.is-ok {
    background: var(--good-soft);
    border-color: var(--good);
    color: var(--good-text);
}

.qms-kon-pregled.is-soon {
    background: var(--warn-soft);
    border-color: var(--warn);
    color: var(--warn-text);
}

.qms-kon-pregled.is-late {
    background: var(--bad-soft);
    border-color: var(--bad);
    color: var(--bad-text);
}

/* Bez datuma pregleda: nije neutralno nego rupa — zapis koji se ne pregledava
   nije praćen, a t. 4.1 i 4.2 traže praćenje. Zato žuta, ne siva. */
.qms-kon-pregled.is-none {
    background: var(--warn-soft);
    border-color: var(--warn);
    color: var(--warn-text);
}

/* Zatvoreno je jedino stvarno neutralno stanje u ovom registru. */
.qms-kon-pregled.is-closed {
    background: transparent;
    border-color: var(--line);
    color: var(--ink-3);
}

/* ---- smjer ---- */
.qms-kon-smjer.is-ok {
    background: var(--good-soft);
    border-color: var(--good);
    color: var(--good-text);
}

.qms-kon-smjer.is-bad {
    background: var(--bad-soft);
    border-color: var(--bad);
    color: var(--bad-text);
}

/* „I prilika i prijetnja“ NE nosi ni zelenu ni crvenu: obje bi tvrdile jednu
   stranu onoga što zapis izričito drži na dvije. */
.qms-kon-smjer.is-both {
    background: var(--surface-3);
    border-color: var(--line-strong);
    color: var(--ink-2);
}

.qms-kon-smjer.is-none,
.qms-kon-utjecaj.is-none {
    background: transparent;
    border-color: var(--line);
    color: var(--ink-3);
}

/* ---- utjecaj ---- */
/* Visok utjecaj nije problem nego činjenica, pa nosi obris a ne crvenu ispunu:
   crvena bi rekla da je nešto u redu treba popraviti. */
.qms-kon-utjecaj.is-high {
    background: transparent;
    border-color: var(--bad);
    color: var(--bad-text);
}

.qms-kon-utjecaj.is-mid {
    background: transparent;
    border-color: var(--warn);
    color: var(--warn-text);
}

.qms-kon-utjecaj.is-low {
    background: transparent;
    border-color: var(--line-strong);
    color: var(--ink-2);
}

/* ============================================================
   2. REGISTAR
   ============================================================ */
.qms-kon-nowrap { white-space: nowrap; }

.qms-kon-red--paznja > td:first-child {
    box-shadow: inset 3px 0 0 var(--bad);
}

.qms-kon-legenda {
    padding: 0 2px;
    color: var(--ink-3);
    font-size: 12px;
    line-height: 1.6;
}

/* ============================================================
   3. GLAVA ZAPISA

   Naslov pitanja je dugačka rečenica, pa stoji u vlastitom okviru na vrhu — u
   naslovu stranice stoji broj, jer se po njemu zapis i traži.
   ============================================================ */
.qms-kon-glava {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 18px;
}

.qms-kon-glava-naslov {
    flex: 1 1 320px;
    min-width: 0;
    color: var(--ink-strong);
    font-size: 16px;
    font-weight: 600;
    line-height: 1.45;
}

.qms-kon-glava-znakovi {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* ============================================================
   4. RUPA — pitanje bez rizika, strana bez zahtjeva
   ============================================================ */
.qms-kon-rupa {
    display: flex;
    flex-direction: column;
    gap: 11px;
    padding: 15px 16px;
    border-left: 3px solid var(--bad);
}

.qms-kon-rupa-head {
    display: flex;
    align-items: center;
    gap: 9px;
    color: var(--ink-strong);
    font-size: 14px;
    font-weight: 600;
}

.qms-kon-rupa-text {
    color: var(--ink-2);
    font-size: 12.5px;
    line-height: 1.6;
}

.qms-kon-rupa-akcije {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

/* ============================================================
   5. PODATCI I TEKSTOVI
   ============================================================ */
.qms-kon-podaci {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 14px 22px;
    padding: 16px 18px;
}

.qms-kon-tekst {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 0 18px 18px;
}

.qms-kon-tekst-sadrzaj {
    color: var(--ink-2);
    font-size: 13px;
    line-height: 1.65;
    white-space: pre-wrap;
}

/* ============================================================
   6. OBRASCI PREGLEDA I ZATVARANJA
   ============================================================ */
.qms-kon-forma {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 14px 18px;
    margin-top: 12px;
}

.qms-kon-forma--wide { grid-column: 1 / -1; }

.qms-kon-forma .qms-uvoz-actions { grid-column: 1 / -1; }

.qms-kon-crta {
    margin: 18px 0 4px;
    border: 0;
    border-top: 1px solid var(--line);
}

/* ============================================================
   7. UŽI EKRAN
   ============================================================ */
@media (max-width: 720px) {
    .qms-kon-glava { gap: 10px; padding: 14px; }
    .qms-kon-glava-naslov { font-size: 15px; }
    .qms-kon-podaci { grid-template-columns: 1fr; padding: 14px; }
    .qms-kon-tekst { padding: 0 14px 14px; }
    .qms-kon-forma { grid-template-columns: 1fr; }
}

/* ============================================================
   Komunikacija (M34, plan 118) — ISO 9001 t. 7.4

   Stoji u ovoj datoteci, a ne u vlastitoj: komunikacija je drugi pogled na
   isti sadržaj kao kontekst — zainteresirana strana traži nešto (t. 4.2), a
   izjava kaže kako joj to govorimo (t. 7.4).
   ============================================================ */

/* Oznaka točke norme uz naziv polja („t. 7.4 c)").

   Nije ukras: auditor pita po točkama, pa polje koje nosi svoju adresu u normi
   skraćuje razgovor. Tiho — to je adresa, ne stanje zapisa. */
body[class*="qms-theme"] .qms-kom-tocka {
    margin-left: 0.4rem;
    padding: 0.05rem 0.3rem;
    border: 1px solid var(--line);
    border-radius: 0.25rem;
    background: var(--surface-2);
    color: var(--ink-4);
    font-size: 0.6875rem;
    font-weight: 400;
    letter-spacing: 0.02em;
    text-transform: none;
    white-space: nowrap;
}
