/* ModulHub Status-markør — delt tilstands-markør (Vidars 2026-08-03-vedtak).
 *
 * ÉN komponent for alle «her er noe du bør vite»-markører på plattformen.
 * Erstatter de lokale kopiene: admins `.firm-admin-badge` + lassprioritets
 * `.load-note-icon` bar samme trekant-SVG med TO ULIKE betydninger (mangel
 * vs melding) — E01 R1.2 snudd på hodet.
 *
 * ANSVARSDELINGEN (Vidars regel, den som gjør at settet holder seg lite):
 *   FARGEN sier ALVORLIGHETSGRAD  — likt over hele plattformen
 *   IKONET sier DOMENE, ikke INNHOLD
 *
 * Vidars begrunnelse for at ikonet aldri skal si hva det gjelder:
 * «Man skal kjenne igjen symbolene ... Symbolene skal ikke måtte si HVA det
 * gjelder for da blir det nok bare rot og vanskelig forståelse fremfor en
 * enkel nytteverdi.» Seks ikoner for seks innholdstyper krever at brukeren
 * lærer et vokabular før teksten kan leses. Tre domener gjør det ikke.
 *
 * TO FORMER:
 *   naken (default) — ren markør, «liten beskjeden» (Vidars ord)
 *   --knapp         — når markøren også er inngang til en handling
 *
 * Se shared/js/status-markor.js for markup + ikon-katalog.
 * Spec: DS-UI-NY-MANGEL-MARKERING-DISKRET-SYMBOL
 */

.mh-status-markor {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  line-height: 1;
  /* Arver tekstfargen som default — nivå-klassen overstyrer. Uten dette
     ville en markør uten nivå blitt usynlig framfor bare umarkert. */
  color: currentColor;
}

.mh-status-markor svg {
  width: 15px;
  height: 15px;
}

/* I tittel-kontekst er raden inline-tekst, ikke flex — juster mot grunnlinja
   så ikonet ikke løfter tekstlinja (arvet fra lassprioritets `.load-note-icon`,
   der problemet ble løst første gang). */
.list-row-title .mh-status-markor {
  vertical-align: text-bottom;
}

/* --- Alvorlighetsgrad (trafikklys) --------------------------------------
   Tokens fra theme.css. Bakgrunnene er lyse varianter av samme farge og er
   bevisst svake: markøren skal leses, ikke rope. */

.mh-status-markor--info {
  color: var(--primary);
}

.mh-status-markor--ok {
  color: var(--success);
}

.mh-status-markor--advarsel {
  color: #a06600; /* mørkere enn --warning for lesbar kontrast på lys bakgrunn */
}

.mh-status-markor--kritisk {
  color: var(--danger);
}

/* --- Knapp-form ---------------------------------------------------------
   Kun når markøren er inngang til en handling. Er den ren informasjon, skal
   den IKKE se trykkbar ut — en badge som ikke gjør noe er en løgn om
   affordans. */

.mh-status-markor--knapp {
  width: 20px;
  height: 20px;
  border-radius: 5px;
  border: 1px solid transparent;
  cursor: pointer;
  vertical-align: middle;
  margin-left: 6px;
}

.mh-status-markor--knapp.mh-status-markor--kritisk {
  background: #fdecea;
  border-color: #f5c6c2;
}

.mh-status-markor--knapp.mh-status-markor--kritisk:hover {
  background: #f9d7d2;
}

.mh-status-markor--knapp.mh-status-markor--advarsel {
  background: #fff8e1;
  border-color: #ffe082;
}

.mh-status-markor--knapp.mh-status-markor--advarsel:hover {
  background: #ffecb3;
}

.mh-status-markor--knapp.mh-status-markor--info {
  background: #e8f0fe;
  border-color: #c6dafc;
}

.mh-status-markor--knapp.mh-status-markor--info:hover {
  background: #d7e6fd;
}

.mh-status-markor--knapp:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 1px;
}

/* ── B-delen: vippebryter-markering av tomme felt ─────────────────────────
   (DS-UI-NY-MANGEL-MARKERING-DISKRET-SYMBOL, Vidars vedtak.)
   Feltet FORBLIR hvitt (E01 R1.15: hvit = skrivbar) — markeringen er en
   midlertidig linse i warning-rollen, ikke en tilstandsfarge paa feltet. */
.mh-mangel-tomt {
  box-shadow: 0 0 0 2px var(--warning);
}

/* Slot-elementet flater legger markoren i (toppen, ved tittelen). Tomt og
   usynlig naar ingenting mangler — ingen tom knapp som inviterer til klikk. */
.mh-mangel-slot {
  display: inline-flex;
  align-items: center;
}

/* Trykket-tilstand paa vippebryteren: innfelt ring viser at linsen er PAA. */
.mh-status-markor--knapp[aria-pressed="true"] {
  box-shadow: inset 0 0 0 2px var(--warning);
}