/* ==========================================================================
   LESBAR (22. oktober 2026). Bare i Nordiva-appen, ikke i Lodd: Lodd deles
   med videoportalen og kreatørportalen, og dette gjelder appens egen
   innholdsflate. Lastes rett etter lodd.css.
   ========================================================================== */

/* LESBARHET I INNHOLDET (22. oktober 2026). Theodor: tekst og tall skal være
   enkle å lese, og plassen skal brukes i stedet for å stå tom. Menyen og
   topplinja står på skalaen i lodd-tokens.css. Inne i innholdsflaten løftes
   hvert trinn ett hakk, og i brede vinduer ett hakk til, sammen med
   diagrammene. Margetikettene (.etikett) står på 11 px: de er målt til åtte tegn i en marg på 60 px. */
.innhold {
  --t-1: 12px;  --t-1-h: 17px;
  --t-2: 13px;  --t-2-h: 19px;
  --t-3: 14px;  --t-3-h: 21px;
  --t-4: 16px;  --t-4-h: 24px;
  --t-5: 18px;  --t-5-h: 26px;
  --t-6: 21px;  --t-6-h: 28px;
  --t-7: 28px;  --t-7-h: 34px;
  --t-8: 36px;  --t-8-h: 42px;
  --ring: 140px;
  --rute: 16px;
}
@media (min-width: 1500px) {
  .innhold {
    --t-3: 15px;  --t-3-h: 22px;
    --t-4: 17px;  --t-4-h: 25px;
    --t-5: 19px;  --t-5-h: 27px;
    --t-6: 23px;  --t-6-h: 30px;
    --t-7: 32px;  --t-7-h: 38px;
    --t-8: 40px;  --t-8-h: 46px;
    --ring: 168px;
    --rute: 20px;
  }
}

/* Margetikettene er målt til åtte tegn på 11 px (sjekk-lodd.mjs, punkt 9). */
.innhold .etikett { --t-1: 11px; --t-1-h: 16px; }

/* ÉN SKRIFT OVERALT (22. oktober 2026, helhetsrunden). Knapper og felt
   arver ikke skriften av seg selv: rutene i Instagram-fanen og fargevalget i
   Innstillinger sto i Arial. Nå arver alle skjemaelementer skriften rundt seg. */
:where(button, input, select, textarea) { font-family: inherit; letter-spacing: inherit; }

/* ÉTT KORT OVERALT (22. oktober 2026, helhetsrunden). Lodds kort har den
   lette skyggen i lyst tema og en kant i mørkt (.kort i lodd.css). Kortene i
   Tall og Organisk hadde en grå kant og ingen skygge, så de så annerledes ut
   enn resten av appen i lyst tema. Nå er de som .kort. */
html #skjerm-okonomi .tal-flis,
html #skjerm-okonomi .tal-felt,
html #skjerm-okonomi .tal-ut,
html #skjerm-okonomi .tal-hull,
html #skjerm-organisk .org-liste,
html #skjerm-organisk .ok-sammenlign,
html #skjerm-organisk .ok-profil,
html #skjerm-organisk .ok-blokk,
html #skjerm-organisk .ok-kortet,
html #skjerm-organisk .org-k {
  border-color: var(--kort-strek);
  box-shadow: var(--over-lett);
}

/* ANROPET SOM FACETIME (23. oktober 2026). Theodor: et eget samtalefelt når
   Joar ringer, der han kan velge å ta det eller ikke. Formen til
   .anropsbanner står i lodd.css og deles med de andre appene; her blir den
   et kort midt på skjermen i Nordiva-appen, med bildet og navnet stort og to
   runde knapper. Det dempede rommet rundt er en outline, ikke en skygge. */
html .anropsbanner {
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  transform: translate(-50%, -50%);
  max-width: none;
  width: min(360px, calc(100vw - 32px));
  flex-direction: column;
  align-items: center;
  gap: var(--s-3);
  padding: var(--s-7) var(--s-6) var(--s-6);
  border: 1px solid var(--line-2);
  border-radius: var(--r-4);
  background: var(--flate);
  outline: 200vmax solid var(--teppe);
  text-align: center;
}
html .anropsbanner .anrop-avatar { width: 88px; height: 88px; border-radius: var(--r-4); font-size: var(--t-7); line-height: 88px; margin-bottom: var(--s-3); animation: anrop-puls 1.6s ease-in-out infinite; }
html .anropsbanner .anrop-tekst { font-size: var(--t-6); line-height: var(--t-6-h); font-weight: 600; }
html .anropsbanner .anrop-under { margin: 0; color: var(--ink-3); font-size: var(--t-4); line-height: var(--t-4-h); }
html .anropsbanner .anrop-knapper { margin: var(--s-5) 0 0; gap: var(--s-8); }
html .anropsbanner .anrop-rund { display: flex; flex-direction: column; align-items: center; gap: var(--s-2); padding: 0; border: 0; background: none; color: var(--ink-2); font: inherit; font-size: var(--t-3); cursor: pointer; }
html .anropsbanner .anrop-rund svg { width: 60px; height: 60px; padding: 16px; border-radius: var(--r-4); color: var(--flate); box-sizing: border-box; transition: transform var(--tid-1) ease-out; }
html .anropsbanner .anrop-rund.avvis svg { background: var(--rod); }
html .anropsbanner .anrop-rund.svar svg { background: var(--gronn); }
html .anropsbanner .anrop-rund:active svg { transform: scale(.94); }
html .anropsbanner .anrop-rund:focus-visible { outline: none; }
html .anropsbanner .anrop-rund:focus-visible svg { outline: 2px solid var(--brand-tekst); outline-offset: 3px; }
@keyframes anrop-puls { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.06); } }
@media (prefers-reduced-motion: reduce) { html .anropsbanner .anrop-avatar { animation: none; } }

/* Hvem som er i kanalen, med prikken (chat.js, toppHtml). */
.samtale-navn .samtale-tilstede { display: inline-flex; flex-wrap: wrap; gap: var(--s-3); margin-left: var(--s-3); font-size: var(--t-2); line-height: var(--t-2-h); font-weight: 400; color: var(--ink-3); vertical-align: middle; }
.samtale-navn .samtale-tilstede > span { display: inline-flex; align-items: center; gap: var(--s-1); }
.samtale-navn .samtale-tilstede .prikk { position: static; display: inline-block; width: 8px; height: 8px; margin-right: var(--s-1); border: 0; }

/* Huddle-vinduet kan flyttes (huddle.js, kanDras): toppen er håndtaket. */
@media (min-width: 900px) {
  .huddle-flyt .huddle-topp { cursor: grab; user-select: none; -webkit-user-select: none; touch-action: none; }
  .huddle-flyt.drar .huddle-topp { cursor: grabbing; }
}
