/* ═══════════════════════════════════════════════════════════
   Colliflow kundeportal — felles skall
   Endres ETT sted (flowen «Colliflow | Kundeportal-skall») og
   slår gjennom på alle verktøy under /.

   Alle klasser og variabler er prefikset cf- / --cf- slik at de
   ikke kolliderer med verktøyenes egen CSS.
   ═══════════════════════════════════════════════════════════ */

:root{
  --cf-brand:#e85423;          /* merkefarge */
  --cf-brand-hover:#c8421a;
  --cf-brand-btn:#c8421a;      /* knappebakgrunn — mørkere for WCAG AA (4,9:1 mot hvit tekst) */
  --cf-brand-btn-hover:#a93715;
  --cf-brand-soft:#fdeae0;
  --cf-bg:#f4f2ef;
  --cf-card:#fff;
  --cf-line:#ececea;
  --cf-ink:#1b1b1b;
  --cf-mut:#6f6f6b;            /* 5:1 mot hvit */
  --cf-ok:#1f9d57;
  --cf-err:#d14343;
  --cf-warn:#b9750a;
  --cf-bunn-hoyde:64px;        /* plass til den faste bunnlinja */
}

/* Bunnlinja ligger fast nederst i vinduet — gi innholdet plass under seg.
   box-sizing:border-box gjør at padding-en regnes INN i min-height:100vh
   (som verktøysidene setter) — ellers blir siden alltid 64px høyere enn
   vinduet og gir et permanent skrollefelt. */
body{padding-bottom:var(--cf-bunn-hoyde);box-sizing:border-box;}

/* Global skalering: portalen oppleves litt for liten på 100 % nettleserzoom,
   så alt skaleres opp til 115 % som standard. Gjelder kun større skjermer —
   på mobil/smale vinduer beholdes 100 % for å ikke miste plass. */
@media (min-width:900px){
  html{ zoom:1; }
  /* 100vh kompenserer ikke for zoom (1.15 × 100vh > vinduet) — skaler ned
     min-height tilsvarende, ellers gir hver side et permanent skrollefelt. */
  body{ min-height:calc(100vh / 1.15) !important; }
}

/* ───────── Header ───────── */
.cf-topp{max-width:1720px;margin:0 auto;padding:22px 32px 0;display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-family:'Plus Jakarta Sans',system-ui,sans-serif;}
.cf-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;}
.cf-mark{width:38px;height:38px;border-radius:10px;background:var(--cf-brand);display:flex;align-items:center;justify-content:center;flex:none;overflow:hidden;}
.cf-brand h1{font-size:19px;font-weight:800;letter-spacing:-.4px;margin:0;white-space:nowrap;color:var(--cf-ink);}
.cf-brand h1 .sep{color:var(--cf-mut);font-weight:400;margin:0 3px;}
.cf-brand h1 .verktoy{color:var(--cf-brand);}
.cf-adm{background:var(--cf-brand-soft);color:var(--cf-brand-btn-hover);border-radius:8px;padding:3px 10px;font-size:12px;font-weight:800;margin-left:4px;}

/* Verktøyets egne knapper + «Tilbake til portalen» — skyves mot høyre */
.cf-toppvalg{margin-left:auto;display:flex;align-items:center;gap:14px;}
.cf-tilbake{color:var(--cf-brand);font-weight:700;text-decoration:none;font-size:13px;white-space:nowrap;}
.cf-tilbake:hover{text-decoration:underline;}

/* Aktiv vareeier — HELT til høyre i headeren (uten etikett-tekst) */
.cf-vareeier{display:flex;align-items:center;gap:9px;padding-left:18px;margin-left:4px;border-left:1px solid var(--cf-line);}
.cf-vareeier select{padding:8px 14px;border:1px solid var(--cf-line);border-radius:999px;font-family:inherit;font-size:13px;font-weight:700;background:#fff;color:var(--cf-ink);cursor:pointer;width:auto;}
/* Kun én vareeier → navnet vises som en hvit chip (samme form som velgeren), uten nedtrekksmeny */
.cf-vareeier .cf-go-navn{display:inline-flex;align-items:center;padding:8px 14px;border:1px solid var(--cf-line);border-radius:999px;background:#fff;font-size:13px;font-weight:700;color:var(--cf-ink);white-space:nowrap;}

/* ───────── Bunnlinje (fast nederst i vinduet) ───────── */
.cf-bunn{position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--cf-card);border-top:1px solid var(--cf-line);box-shadow:0 -2px 14px rgba(0,0,0,.05);padding:11px 32px;display:flex;align-items:center;justify-content:flex-end;gap:12px;font-family:'Plus Jakarta Sans',system-ui,sans-serif;}
.cf-bunnvalg{display:flex;align-items:center;gap:10px;}   /* slot for verktøyets egne knapper */
/* Knappene skal ikke flyte inn i bakgrunnen — hvit flate med tydelig ramme */
.cf-knapp{border:1px solid #dcd9d4;border-radius:999px;padding:8px 16px;font-size:13px;font-weight:700;font-family:inherit;cursor:pointer;background:#fff;color:var(--cf-ink);transition:background .15s,border-color .15s;}
.cf-knapp:hover{background:var(--cf-brand-soft);border-color:var(--cf-brand);color:var(--cf-brand-btn-hover);}

/* Språkvelger — helt til venstre i bunnlinja */
.cf-sprak{position:relative;margin-right:auto;}
.cf-sprak-knapp{display:inline-flex;align-items:center;gap:6px;}
.cf-sprak-knapp .pil{font-size:9px;line-height:1;color:var(--cf-mut);}
.cf-sprak-meny{position:absolute;bottom:calc(100% + 8px);left:0;min-width:170px;background:#fff;border:1px solid var(--cf-line);border-radius:12px;box-shadow:0 12px 30px rgba(0,0,0,.14);overflow:hidden;padding:4px;}
.cf-sprak-meny button{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;text-align:left;padding:9px 12px;border:0;border-radius:9px;background:#fff;font-family:inherit;font-size:13.5px;font-weight:600;color:var(--cf-ink);cursor:pointer;}
.cf-sprak-meny button:hover{background:var(--cf-brand-soft);}
.cf-sprak-meny button.aktiv{font-weight:800;color:var(--cf-brand-btn-hover);}
.cf-sprak-meny .kode{font-size:11px;font-weight:800;color:var(--cf-mut);letter-spacing:.4px;}

@media (max-width:720px){
  .cf-topp{padding:16px 18px 0;}
  .cf-vareeier{padding-left:0;margin-left:0;border-left:none;}
  .cf-bunn{padding:10px 18px;}
}