/* Kommandolinja — og den ene nye rada i søket.
 *
 * HVORFOR SØKERADA LIGGER HER. `.np-finn-bil` hører hjemme i
 * `demo-tillegg.css` sammen med resten av `.np-finn-*`. Den står her fordi
 * dette arket er det eneste jeg eier i denne runden, og to byggere som
 * skriver i samme delte ark samtidig ender med at den ene regelen forsvinner
 * i en fletting. Seks linjer på feil ark er en rettelse som tar ett minutt;
 * en regel som forsvant i stillhet finner ingen igjen. Flytt den til
 * `demo-tillegg.css` ved neste anledning — den har ingen avhengighet hit.
 *
 * Arket eier ingen nye farger og ingen nye mål. Feltet er `.np-felt` som alle
 * andre felt, kortet under er `--navy2` med `--border-strong`, som `.np-skjema`
 * og `.np-oppf-rad` — huset har ÉN kortform.
 *
 * Det ene som er nytt er TOLKNINGSLISTA: fem par av etikett og verdi, der et
 * TONET par betyr «dette sa du ikke, dette er panelets standardverdi». Det
 * skilles ikke på farge alene (WCAG 1.4.1): hvert tonede felt har også en
 * setning i notatlista under som sier hvilken regel som valgte, så tonen er et
 * ekko av noe som står skrevet.
 */

/* MARGIN-BOTTOM ER IKKE PYNT HER.
 * Seksjonen sto med `margin: 10px 0 0` — ti piksler opp, NULL ned. MÅLT på
 * 1440 px: forslagene («Dekkskift», «Dekkhotell») sluttet på y=298 og
 * rutenettet begynte på y=298. Null avstand; pillene rørte kalenderkanten og
 * leste som om de lå oppå den.
 *
 * Feilen var ikke i pillene — de har sin egen `gap: 8px` og oppfører seg som
 * de skal. Den var at kommandolinja ble lagt inn MELLOM styrelinja og
 * rutenettet uten å ta med seg avstanden ned som alle seksjoner her har.
 * `.np-styre` over den har `margin-bottom: 16px`; det er husets tall, og det
 * er det samme som brukes her. */
.np-kmd {
  margin: 10px 0 16px;
}

/* Feltet skal lese som ETT handlingsfelt, ikke som et søk: det er bredt, og
   det står alene på sin egen linje over svaret. */
.np-kmd-rad {
  display: block;
}
/* Ingen `font-size` her. Feltet er `<input class="np-felt np-kmd-felt-inn">`
   (del-kommando.js:618), og `.np-felt` setter 16 px med en grunn som står
   skrevet i panel.css:1010: «alt under gir fokus-zoom i Safari på iPhone».
   Dette arket lastes ETTER panel.css med samme spesifisitet, så en
   font-size her vinner — og da zoomet hele sida idet man trykte i
   kommandolinja på telefon. Søkefeltet overstyrer ikke; bare dette gjorde. */
.np-kmd-felt-inn {
  width: 100%;
}

.np-kmd-svar {
  margin-top: 10px;
}

.np-kmd-hint {
  margin: 0;
  max-width: 74ch;
  font-size: var(--np-t-sm);
  line-height: var(--np-lh-brod);
  color: var(--silver);
}

/* ── Tolkninga ──────────────────────────────────────────────────────────
   Fem par side om side der det er plass, stablet på telefon. `auto-fit` med
   et gulv, samme mønster som nøkkeltallflisene i statistikken. */
.np-kmd-tolkning {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  margin: 0;
  padding: 14px 16px;
  background: var(--navy2);
  border: 1px solid var(--border-strong);
  border-radius: var(--r-md);
  box-shadow: var(--elev-card);
}
.np-kmd-felt dt {
  margin: 0 0 3px;
  font-size: var(--np-t-mikro);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--silver);
}
.np-kmd-felt dd {
  margin: 0;
  font-size: var(--np-t-md);
  font-weight: 600;
  color: var(--white);
}
/* TONET = panelets standardverdi, ikke ditt ord. Aldri farge alene: notatlista
   under sier hvilken regel som valgte. */
.np-kmd-felt.tonet dd {
  font-weight: 400;
  color: var(--silver);
}

.np-kmd-notater {
  margin: 8px 0 0;
  padding-left: 18px;
  max-width: 78ch;
  font-size: var(--np-t-xs);
  line-height: var(--np-lh-brod);
  color: var(--silver);
}

.np-kmd-valg {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}

.np-kmd-handling {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

/* Kvitteringa er den GODE tilstanden: is-stolpe, ikke varselgult — samme form
   som den tomme oppfølgingslista, og av samme grunn. */
.np-kmd-kvitt {
  margin: 0;
  padding: 12px 14px;
  background: var(--navy2);
  border: 1px solid var(--border-strong);
  border-left: 2px solid var(--ice);
  border-radius: var(--r-md);
  font-size: var(--np-t-md);
  line-height: var(--np-lh-brod);
  color: var(--offwhite);
}

/* ── Svarene ────────────────────────────────────────────────────────────
   Ett svar er hovedsvaret; nummer to og tre står tonet ved siden av, fordi et
   spørsmål som «ansatt» kan bety tre ting og tre tilbud er ærligere enn én
   gjetning. Kortformen er husets: `--navy2` med `--border-strong`. */
.np-kmd-hjelp {
  display: grid;
  /* `min(300px, 100%)` og ikke bare 300px (rettet 21.09): et hardt gulv på
     300 gjør sporet 300 px bredt også når beholderen er smalere, og da
     stikker rutenettet ut av kortet sitt. Med `min()` er gulvet aldri
     bredere enn plassen som finnes. */
  grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
  gap: 10px;
}
.np-kmd-svarkort {
  padding: 14px 16px;
  background: var(--navy2);
  border: 1px solid var(--border-strong);
  border-radius: var(--r-md);
  box-shadow: var(--elev-card);
}
/* Hovedsvaret får is-kanten — samme grep som den tomme oppfølgingslista:
   is betyr «dette er svaret», ikke «dette er en advarsel». */
.np-kmd-svarkort:not(.sekundaer) {
  border-left: 2px solid var(--ice);
}
.np-kmd-svarkort.sekundaer {
  background: var(--fill-subtle);
}
.np-kmd-svarkort h3 {
  margin: 0 0 6px;
  font-family: var(--np-font-display);
  font-size: var(--np-t-md);
  font-weight: 700;
  color: var(--white);
}
.np-kmd-svarkort p {
  margin: 0 0 10px;
  max-width: 62ch;
  font-size: var(--np-t-sm);
  line-height: var(--np-lh-brod);
  color: var(--offwhite);
}
.np-kmd-svarkort.sekundaer p {
  color: var(--silver);
}

/* ── «Se bilen» i søket ─────────────────────────────────────────────────
   Én linje over treffene: hvilken bil søket peker på, og knappen inn til
   kortet. Ingen egen kortform og ingen ny farge — dette er en HENVISNING, og
   et kort rundt den ville konkurrert med treffradene den står over.
   `flex-wrap` fordi «BR 39946 · Ford Kuga · Anders Sætre» pluss knappen er
   for langt for en telefon på 360 px; da faller knappen ned på egen linje. */
.np-finn-bil {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 0 0 10px;
  font-size: var(--np-t-sm);
  line-height: var(--np-lh-brod);
  color: var(--silver);
}

/* ── Papir ──────────────────────────────────────────────────────────────
   En kommandolinje er en inngang, ikke en opplysning. Den skal ikke på arket.
   Samme for «Se bilen»: en knapp på papir er en blindvei. */
@media print {
  .np-kmd,
  .np-finn-bil {
    display: none !important;
  }
}

@media (max-width: 560px) {
  .np-kmd-tolkning {
    padding: 12px 13px;
  }
  .np-kmd-handling button {
    flex: 1 1 auto;
  }
}