/* EDB Sytem V2.58546 — stilark. Bygger på Kepler-designsystemets tokens
   (assets/ds/tokens). Alt som er piller, kort og tabeller er definert ÉN gang
   her, så de ser like ut i alle moduler (eierens regel 8 og 9). */
@import url("ds/tokens/colors.css");
@import url("ds/tokens/typography.css");
@import url("ds/tokens/spacing.css");
@import url("ds/tokens/radius.css");
@import url("ds/tokens/elevation.css");
@import url("ds/tokens/motion.css");
@import url("ds/tokens/base.css");

:root{
  --edb-meny-bredde:232px;
  --edb-innhold-maks:1100px;
}
html{background:var(--surface-sunken)}
body.edb{background:var(--surface-sunken);color:var(--text-body);font-size:var(--fs-sm);line-height:var(--lh-normal)}

/* ── TEST-stripe ─────────────────────────────────────────────── */
.test-stripe{position:sticky;top:0;z-index:1000;background:var(--amber-500);color:var(--ink-900);font:700 12px/1 var(--font-display);letter-spacing:.08em;text-align:center;padding:6px 8px;pointer-events:none;text-transform:uppercase}

/* ── Ramme: meny + innhold ────────────────────────────────────── */
.edb-ramme{display:grid;grid-template-columns:var(--edb-meny-bredde) minmax(0,1fr);min-height:100vh;overflow-x:clip}
.edb-meny{background:var(--surface-darker);color:var(--text-inverse);display:flex;flex-direction:column;padding:var(--sp-5) var(--sp-4);position:sticky;top:0;height:100vh;box-sizing:border-box}
.edb-logo{display:flex;flex-direction:column;gap:2px;text-decoration:none;color:inherit;padding:var(--sp-2) var(--sp-3) var(--sp-5)}
.edb-logo:hover{text-decoration:none;color:inherit}
.edb-logo__ord{font-family:var(--font-display);font-weight:900;font-size:22px;letter-spacing:.06em;background:var(--grad-red);-webkit-background-clip:text;background-clip:text;color:transparent}
.edb-logo__system{font-family:var(--font-mono);font-size:11px;color:var(--text-inverse-muted);letter-spacing:.04em}
.edb-nav{display:flex;flex-direction:column;gap:2px}
.edb-nav__punkt{display:block;padding:9px var(--sp-3);border-radius:var(--radius-md);color:var(--chrome-200);font-family:var(--font-display);font-weight:600;font-size:14px;text-decoration:none;transition:background var(--dur-fast) var(--ease-standard)}
.edb-nav__punkt:hover{background:var(--ink-700);color:#fff;text-decoration:none}
.edb-nav__punkt.er-aktiv{background:var(--red-500);color:#fff}
.edb-meny__bunn{margin-top:auto;border-top:1px solid var(--ink-600);padding-top:var(--sp-3);display:flex;flex-direction:column;gap:4px}
.edb-meny__bruker{padding:4px var(--sp-3);font-size:13px;color:var(--text-inverse-muted)}
.edb-innhold{min-width:0;padding:var(--sp-7) var(--sp-8);max-width:var(--edb-innhold-maks);width:100%;box-sizing:border-box}
.edb--bred .edb-innhold{max-width:none}
.edb-tittel{font-size:var(--fs-2xl);margin:0 0 var(--sp-5);letter-spacing:var(--ls-heading)}
.edb-ingress{max-width:62ch;margin:0 0 var(--sp-6);font-size:var(--fs-md)}
.edb-tom{color:var(--text-muted)}
.edb-dempet{color:var(--text-muted)}
.edb-liten{font-size:var(--fs-2xs)}
.edb-mono{font-family:var(--font-mono);font-size:13px}
.edb-tall{text-align:right;font-variant-numeric:tabular-nums}
.edb-pris{font-family:var(--font-display);font-weight:700}
.edb-merke{display:inline-block;font:700 10px/1 var(--font-display);letter-spacing:.08em;text-transform:uppercase;color:var(--red-700);background:var(--red-050);border-radius:var(--radius-pill);padding:4px 8px;vertical-align:middle}

/* ── Piller: én definisjon, samme høyde og form overalt ───────── */
.edb-piller{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 var(--sp-5)}
.edb-pille{display:inline-flex;align-items:center;height:var(--control-h-sm);padding:0 var(--sp-4);border-radius:var(--radius-pill);border:1px solid var(--border-default);background:var(--surface-card);color:var(--text-heading);font:600 13px/1 var(--font-display);text-decoration:none;white-space:nowrap;transition:background var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard)}
.edb-pille:hover{background:var(--surface-inset);text-decoration:none;color:var(--text-heading)}
.edb-pille.er-valgt{background:var(--ink-900);border-color:var(--ink-900);color:#fff}

/* ── Kort: samme form overalt ─────────────────────────────────── */
.edb-kort-rad{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--sp-4);margin:0 0 var(--sp-6)}
.edb-kort-rad--to{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.edb-kort,.edb-boks{background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-card);padding:var(--sp-5);box-shadow:var(--shadow-xs)}
.edb-kort{display:flex;flex-direction:column;gap:6px;text-decoration:none;color:inherit;min-height:120px;transition:box-shadow var(--dur-fast) var(--ease-standard),transform var(--dur-fast) var(--ease-standard)}
.edb-kort:hover{box-shadow:var(--shadow-md);transform:translateY(-1px);text-decoration:none;color:inherit}
.edb-kort__merke{font:700 var(--fs-3xs)/1 var(--font-display);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--red-600)}
.edb-kort__tall{font-family:var(--font-display);font-weight:900;font-size:var(--fs-3xl);line-height:1;color:var(--text-heading);font-variant-numeric:tabular-nums}
.edb-kort__tekst{font-size:var(--fs-xs);color:var(--text-muted)}
.edb-boks{margin:0 0 var(--sp-4)}
.edb-boks h2{font-size:var(--fs-md);margin:0 0 var(--sp-3)}
.edb-dl{display:grid;grid-template-columns:max-content 1fr;gap:6px var(--sp-4);margin:0}
.edb-dl dt{color:var(--text-muted);font-size:var(--fs-xs)}
.edb-dl dd{margin:0}

/* ── Tabeller ────────────────────────────────────────────────── */
.edb-tabell{overflow-x:auto;background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-card);margin:0 0 var(--sp-3)}
.edb-tabell table{border-collapse:collapse;width:100%;font-size:var(--fs-xs)}
.edb-tabell th,.edb-tabell td{text-align:left;vertical-align:top;padding:10px var(--sp-4);border-bottom:1px solid var(--border-subtle)}
.edb-tabell th{font:700 var(--fs-3xs)/1.2 var(--font-display);letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);background:var(--surface-sunken);position:sticky;top:0}
.edb-tabell tbody tr:last-child td{border-bottom:0}
.edb-tabell tbody tr:hover td{background:var(--ink-050)}
.edb-tabell td a{color:var(--text-heading);font-weight:600}

/* ── Søk ─────────────────────────────────────────────────────── */
.edb-sok{display:flex;gap:var(--sp-2);margin:0 0 var(--sp-4);max-width:640px}
.edb-sok input[type=search]{flex:1 1 auto;height:var(--control-h-md);border:1px solid var(--border-default);border-radius:var(--radius-control);padding:0 var(--sp-3);font:inherit;font-size:var(--fs-sm);background:var(--surface-card);color:var(--text-heading);min-width:0}
.edb-sok button{height:var(--control-h-md);padding:0 var(--sp-5);border:0;border-radius:var(--radius-control);background:var(--red-500);color:#fff;font:700 13px/1 var(--font-display);letter-spacing:var(--ls-button);cursor:pointer}
.edb-sok button:hover{background:var(--brand-hover)}

/* ── DOS-innloggingen (planen 2b) ─────────────────────────────── */
body.edb--dos{background:#000;margin:0}
.dos{min-height:100vh;display:grid;place-items:center;background:#000;color:#33ff33;font-family:"IBM Plex Mono","Consolas",ui-monospace,monospace;font-size:clamp(14px,2.2vw,18px);padding:24px;box-sizing:border-box}
.dos-skjerm{width:min(560px,100%);text-shadow:0 0 6px rgba(51,255,51,.45)}
.dos-hode{margin:0 0 1.2em;white-space:pre-wrap;color:#33ff33;font:inherit}
.dos-skjema{display:flex;flex-direction:column;gap:.5em}
.dos-linje{display:flex;gap:.6em;align-items:baseline}
.dos-linje span{white-space:nowrap}
.dos-linje input{flex:1 1 auto;min-width:0;background:transparent;border:0;border-bottom:1px solid #1a8a1a;color:#33ff33;font:inherit;padding:2px 4px;outline:none;caret-color:#33ff33}
.dos-linje input:focus{border-bottom-color:#33ff33;outline:none}
.dos-feil{color:#ff5555;text-shadow:0 0 6px rgba(255,85,85,.5);margin-top:.4em}
.dos-knapp{margin-top:1em;background:transparent;border:0;color:#33ff33;font:inherit;text-align:left;cursor:pointer;padding:0}
.dos-knapp:hover{color:#fff}
.dos-markor{animation:dos-blink 1s steps(1) infinite}
.dos-prompt{margin-top:2em;color:#1a8a1a}
@keyframes dos-blink{50%{opacity:0}}
@media (prefers-reduced-motion:reduce){.dos-markor{animation:none}.edb-kort{transition:none}}

/* ── Telefon ─────────────────────────────────────────────────── */
@media (max-width:760px){
  .edb-ramme{grid-template-columns:1fr}
  .edb-meny{position:static;height:auto;flex-direction:row;flex-wrap:wrap;align-items:center;gap:var(--sp-2);padding:var(--sp-3)}
  .edb-logo{padding:var(--sp-2) var(--sp-3);flex:1 0 100%}
  .edb-nav{flex-direction:row;flex-wrap:wrap;gap:4px}
  .edb-nav__punkt{padding:8px 12px;font-size:13px}
  .edb-meny__bunn{margin:0;border:0;padding:0;flex-direction:row;align-items:center;margin-left:auto}
  .edb-innhold{padding:var(--sp-5) var(--sp-4)}
  .edb-tittel{font-size:var(--fs-xl)}
}
