/*
 * Kurs — the app at kurs.botnest.net.
 *
 * Layered on Botnest 1.5.0 (styles.css) with semantic tokens only. No inline
 * styles anywhere in the pages: the CSP allows style-src 'self', so every
 * varying length (a bar, a heat shade) is an SVG attribute or a class here.
 *
 * Two sections, Økonomi and Formue. On a phone the section's tabs are the
 * floating glass bar and the other section waits as a tab flush with the edge
 * (as in AInotis); from 861px the tabs sit in the header beside the world switch.
 */

:root { --k-gold: #b5821a; --k-max: 1180px; }
[data-bn-theme="night"] { --k-gold: #edc672; }

html, body { background: var(--bn-bg); color: var(--bn-text); }
body { margin: 0; font-family: var(--bn-font-ui); font-size: 15px; line-height: 1.45; }
a { color: var(--bn-action); }
.k-num { font-variant-numeric: tabular-nums; }
.k-dim { color: var(--bn-text-2); }
.k-faint { color: var(--bn-text-3); font-size: 12.5px; }
.k-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ── header ─────────────────────────────────────────────────────────────── */
.k-top { position: sticky; top: 0; z-index: 30; background: var(--bn-surface); border-bottom: 1px solid var(--bn-border); }
.k-top-in { max-width: var(--k-max); margin: 0 auto; height: 60px; display: flex; align-items: center; gap: 6px; padding: 0 10px 0 16px; box-sizing: border-box; }
.k-brand { display: flex; align-items: center; gap: 7px; color: var(--bn-text); text-decoration: none; margin-right: 8px; }
.k-brand svg { width: 28px; height: 28px; flex: none; }
.k-brand b { font: 700 24px/1 var(--bn-font-reading, Georgia, serif); letter-spacing: -0.01em; }
.k-mark-stem { fill: var(--bn-text); }
.k-mark-leg { stroke: var(--bn-text); }
.k-mark-curve { stroke: var(--bn-action); }
.k-mark-dot { fill: var(--k-gold); }
.k-nav { display: none; gap: 2px; margin-left: 10px; }
.k-nav a { height: 40px; display: inline-flex; align-items: center; padding: 0 12px; border-radius: var(--bn-radius-md); color: var(--bn-text-2); text-decoration: none; font-weight: 600; }
.k-nav a[aria-current] { background: var(--bn-surface-2); color: var(--bn-text); font-weight: 800; }
.k-spacer { flex: 1; }
.k-month { display: inline-flex; align-items: center; height: 36px; border-radius: var(--bn-radius-pill); border: 1px solid var(--bn-border); background: var(--bn-surface-2); }
.k-month a { width: 32px; height: 34px; display: grid; place-items: center; color: var(--bn-text-2); text-decoration: none; }
.k-month span { font-weight: 700; font-size: 13.5px; padding: 0 2px; white-space: nowrap; }
.k-iconbtn { width: 44px; height: 44px; display: grid; place-items: center; border: 0; background: transparent; color: var(--bn-text); border-radius: var(--bn-radius-md); cursor: pointer; text-decoration: none; }
.k-iconbtn:hover { background: var(--bn-surface-2); }
.k-theme .k-sun { display: none; }
[data-bn-theme="night"] .k-theme .k-sun { display: block; }
[data-bn-theme="night"] .k-theme .k-moon { display: none; }
.k-menu { position: relative; }
.k-menu > summary { list-style: none; }
.k-menu > summary::-webkit-details-marker { display: none; }
.k-menu-panel { position: absolute; right: 0; top: 50px; min-width: 230px; padding: 6px; border-radius: var(--bn-radius-lg); background: var(--bn-surface); border: 1px solid var(--bn-border); box-shadow: 0 12px 32px rgba(15, 25, 50, 0.18); display: grid; z-index: 40; }
.k-menu-panel a, .k-menu-panel button { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 12px; border-radius: var(--bn-radius-md); color: var(--bn-text); text-decoration: none; font: inherit; background: none; border: 0; text-align: left; cursor: pointer; }
.k-menu-panel a:hover, .k-menu-panel button:hover { background: var(--bn-surface-2); }
.k-menu-panel hr { border: 0; border-top: 1px solid var(--bn-border); margin: 4px 0; }

/* ── page ───────────────────────────────────────────────────────────────── */
.k-main { max-width: var(--k-max); margin: 0 auto; padding: 18px 16px 120px; box-sizing: border-box; display: grid; gap: 14px; }
.k-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.k-eyebrow { margin: 0; font-size: 11.5px; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--bn-text-3); }
.k-h1 { margin: 2px 0 0; font: 800 28px/1.1 var(--bn-font-ui); text-wrap: balance; }
.k-h2 { margin: 6px 0 0; font: 800 17px/1.25 var(--bn-font-ui); }
.k-pill { font-size: 12.5px; font-weight: 600; padding: 4px 10px; border-radius: var(--bn-radius-pill); background: var(--bn-surface-2); color: var(--bn-text-2); white-space: nowrap; }
.k-card { background: var(--bn-surface); border: 1px solid var(--bn-border); border-radius: var(--bn-radius-md); padding: 14px 16px; display: grid; gap: 8px; align-content: start; min-width: 0; }
.k-card > h2, .k-card > h3 { margin: 0; font: 800 16px/1.25 var(--bn-font-ui); }
.k-row2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; }
.k-side { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 14px; align-items: start; }
.k-stack { display: grid; gap: 14px; align-content: start; min-width: 0; }

/* ── key figures ────────────────────────────────────────────────────────── */
.k-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.k-kpi { background: var(--bn-surface); border: 1px solid var(--bn-border); border-radius: var(--bn-radius-md); padding: 12px 14px; }
.k-kpi p { margin: 0; }
.k-kpi-l { font-size: 13px; font-weight: 600; color: var(--bn-text-2); }
.k-kpi-v { font: 800 27px/1.2 var(--bn-font-ui); font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
.k-kpi-s { font-size: 12.5px; color: var(--bn-text-3); }
.k-up { color: var(--bn-danger-text); }
.k-down { color: var(--bn-success-text); }

/* ── statement reminder ─────────────────────────────────────────────────── */
.k-stmt { display: flex; align-items: center; gap: 12px; padding: 11px 14px; border-radius: var(--bn-radius-md); background: var(--bn-surface); border: 1px solid var(--bn-border); color: var(--bn-text); text-decoration: none; }
.k-stmt > svg { color: var(--bn-action); flex: none; }
.k-stmt-t { flex: 1; min-width: 0; display: grid; gap: 1px; }
.k-stmt-go { height: 32px; display: inline-flex; align-items: center; padding: 0 12px; border-radius: var(--bn-radius-sm, 8px); background: var(--bn-action); color: var(--bn-on-action, #fff); font-weight: 800; font-size: 13px; }

/* ── Gjennomgang, folded into the overview ──────────────────────────────── */
.k-review { border-radius: var(--bn-radius-md); border: 1px solid var(--bn-warning-border); background: var(--bn-surface); overflow: hidden; }
.k-review > summary { list-style: none; display: flex; align-items: center; gap: 10px; padding: 12px 14px; cursor: pointer; background: var(--bn-warning-subtle); }
.k-review > summary::-webkit-details-marker { display: none; }
.k-review-t { flex: 1; min-width: 0; display: grid; gap: 1px; }
.k-chev { transition: transform 0.15s ease; color: var(--bn-text-2); flex: none; }
.k-review[open] .k-chev { transform: rotate(180deg); }
.k-review-body { padding: 12px; display: grid; gap: 10px; }
.k-q { border: 1px solid var(--bn-border); border-radius: var(--bn-radius-md); padding: 11px 12px; display: grid; gap: 6px; }
.k-q-top { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; }
.k-q-top b { min-width: 0; overflow-wrap: anywhere; }
.k-q form { display: flex; gap: 6px; flex-wrap: wrap; }
.k-q input[type="text"] { flex: 1 1 200px; min-width: 0; height: 40px; box-sizing: border-box; padding: 0 10px; border-radius: var(--bn-radius-sm, 8px); border: 1px solid var(--bn-border); background: var(--bn-bg); color: var(--bn-text); font: inherit; }
.k-later { color: var(--bn-text-3); font-size: 12.5px; }

/* ── calendar ───────────────────────────────────────────────────────────── */
.k-cal-wd, .k-cal { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 5px; }
.k-cal-wd span { font-size: 10.5px; font-weight: 700; color: var(--bn-text-3); text-align: center; letter-spacing: 0.04em; }
.k-day { min-height: 54px; display: flex; flex-direction: column; justify-content: space-between; padding: 5px 6px; box-sizing: border-box; border-radius: var(--bn-radius-sm, 8px); color: var(--bn-text); text-decoration: none; background: var(--bn-surface-2); }
.k-day b { font-size: 12.5px; }
.k-day .k-amt { font-size: 10.5px; color: var(--bn-text-2); font-variant-numeric: tabular-nums; }
.k-day[aria-current] { box-shadow: inset 0 0 0 2px var(--bn-action); }
.k-day.is-future { opacity: 0.45; }
.k-day.h1 { background: color-mix(in srgb, var(--bn-action) 8%, var(--bn-surface-2)); }
.k-day.h2 { background: color-mix(in srgb, var(--bn-action) 14%, var(--bn-surface-2)); }
.k-day.h3 { background: color-mix(in srgb, var(--bn-action) 20%, var(--bn-surface-2)); }
.k-day.h4 { background: color-mix(in srgb, var(--bn-action) 26%, var(--bn-surface-2)); }
.k-day.h5 { background: color-mix(in srgb, var(--bn-action) 32%, var(--bn-surface-2)); }
.k-day.h6 { background: color-mix(in srgb, var(--bn-action) 38%, var(--bn-surface-2)); }
.k-dots { display: flex; gap: 3px; height: 6px; }
.k-dot { width: 6px; height: 6px; border-radius: 50%; display: inline-block; }
.k-dot.LONN { background: var(--bn-chart-1); }
.k-dot.REFUSJON { background: var(--bn-chart-2); }
.k-dot.FAST { background: var(--bn-chart-4); }
.k-dot.OPPGJOR { background: var(--bn-chart-3); }
.k-legend { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12px; color: var(--bn-text-2); }
.k-legend span { display: inline-flex; align-items: center; gap: 5px; }
.k-blank { visibility: hidden; }

/* ── lists of rows ──────────────────────────────────────────────────────── */
.k-rows { display: grid; }
.k-rowline { display: flex; align-items: center; gap: 10px; min-height: 50px; padding: 7px 0; border-top: 1px solid var(--bn-border); }
.k-rowline:first-child { border-top: 0; }
.k-rowline-t { flex: 1; min-width: 0; display: grid; }
.k-rowline-t b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.k-rowline-a { text-align: right; display: grid; font-variant-numeric: tabular-nums; }
.k-rowline-a b { white-space: nowrap; }
.k-tag { font-size: 11.5px; font-weight: 700; padding: 2px 7px; border-radius: var(--bn-radius-pill); background: var(--bn-surface-2); color: var(--bn-text-2); white-space: nowrap; }
.k-tag--warn { background: var(--bn-warning-subtle); color: var(--bn-warning-text); border: 1px solid var(--bn-warning-border); }
.k-tag--ok { background: var(--bn-success-subtle); color: var(--bn-success-text); }

/* ── charts (SVG; lengths are attributes) ───────────────────────────────── */
.k-bars { display: grid; gap: 7px; }
.k-bar { display: grid; grid-template-columns: minmax(0, 11rem) minmax(0, 1fr) auto; gap: 10px; align-items: center; font-size: 13.5px; }
.k-bar > span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.k-bar svg { width: 100%; height: 10px; display: block; }
.k-bar-track { fill: var(--bn-surface-2); }
.k-bar-fill { fill: var(--bn-action); }
.k-bar-prev { fill: var(--bn-text-3); opacity: 0.55; }
.k-cols { width: 100%; height: 190px; display: block; }
.k-col { fill: color-mix(in srgb, var(--bn-action) 35%, var(--bn-surface-2)); }
.k-col.is-now { fill: var(--bn-action); }
.k-col-l { fill: var(--bn-text-3); font: 600 11px var(--bn-font-ui); }
.k-col-v { fill: var(--bn-text-2); font: 700 10.5px var(--bn-font-ui); }
.k-avg { stroke: var(--bn-text-3); stroke-dasharray: 4 4; stroke-width: 1.5; }
.k-stackbar { width: 100%; height: 12px; display: block; border-radius: 6px; }
.k-c1 { fill: var(--bn-chart-2); } .k-c2 { fill: var(--bn-chart-1); } .k-c3 { fill: var(--bn-chart-4); } .k-c4 { fill: var(--bn-chart-3); } .k-c5 { fill: var(--bn-text-3); }
.k-sw { width: 9px; height: 9px; border-radius: 2px; display: inline-block; }
.k-sw.k-c1 { background: var(--bn-chart-2); } .k-sw.k-c2 { background: var(--bn-chart-1); } .k-sw.k-c3 { background: var(--bn-chart-4); } .k-sw.k-c4 { background: var(--bn-chart-3); } .k-sw.k-c5 { background: var(--bn-text-3); }

/* ── tables ─────────────────────────────────────────────────────────────── */
.k-scroll { overflow-x: auto; }
.k-table { width: 100%; border-collapse: collapse; font-size: 13.5px; font-variant-numeric: tabular-nums; }
.k-table th { text-align: left; font-size: 11px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--bn-text-3); padding: 4px 6px 6px 0; }
.k-table td { padding: 7px 6px 7px 0; border-top: 1px solid var(--bn-border); }
.k-table .r { text-align: right; }
.k-table tr.is-total td { font-weight: 800; }

/* ── segmented tabs ─────────────────────────────────────────────────────── */
.k-seg { display: flex; gap: 4px; overflow-x: auto; padding: 3px; border-radius: var(--bn-radius-md); background: var(--bn-surface-2); }
.k-seg a { flex: none; min-height: 36px; display: inline-flex; align-items: center; padding: 0 13px; border-radius: var(--bn-radius-sm, 8px); color: var(--bn-text); text-decoration: none; font-weight: 600; font-size: 14px; }
.k-seg a[aria-current] { background: var(--bn-surface); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12); font-weight: 800; }

/* ── chat ───────────────────────────────────────────────────────────────── */
.k-tips { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.k-tip-k { margin: 0; font-size: 11px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; color: var(--bn-text-3); }
.k-convo { display: grid; gap: 10px; }
.k-msg { max-width: 82%; padding: 10px 14px; border-radius: 16px; line-height: 1.5; overflow-wrap: anywhere; }
.k-msg p { margin: 0 0 6px; } .k-msg p:last-child { margin: 0; }
.k-msg--me { justify-self: end; background: var(--bn-action); color: var(--bn-on-action, #fff); border-bottom-right-radius: 4px; }
.k-msg--ai { justify-self: start; background: var(--bn-surface-2); border-bottom-left-radius: 4px; }
.k-ask { display: flex; gap: 8px; }
.k-ask input { flex: 1; min-width: 0; height: 46px; box-sizing: border-box; padding: 0 16px; border-radius: var(--bn-radius-pill); border: 1px solid var(--bn-border); background: var(--bn-surface); color: var(--bn-text); font: inherit; }
.k-ask button { width: 46px; height: 46px; border-radius: 50%; border: 0; background: var(--bn-action); color: var(--bn-on-action, #fff); display: grid; place-items: center; cursor: pointer; }
.k-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.k-chip { min-height: 34px; display: inline-flex; align-items: center; padding: 0 12px; border-radius: var(--bn-radius-pill); border: 1px solid var(--bn-border); background: var(--bn-surface); color: var(--bn-text); font: 600 13px var(--bn-font-ui); cursor: pointer; text-decoration: none; }

/* ── actions ────────────────────────────────────────────────────────────── */
.k-acts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.k-act { min-height: 96px; padding: 12px 14px; border-radius: var(--bn-radius-md); border: 1px solid var(--bn-border); background: var(--bn-surface); color: var(--bn-text); display: grid; gap: 4px; align-content: start; text-decoration: none; font: inherit; text-align: left; cursor: pointer; }
.k-act svg { color: var(--bn-action); }
.k-act b { font-size: 14.5px; }
.k-main-act { border-color: color-mix(in srgb, var(--bn-action) 45%, var(--bn-border)); border-width: 1.5px; }
.k-form { display: grid; gap: 10px; }
.k-form label { display: grid; gap: 4px; font-size: 13px; font-weight: 600; color: var(--bn-text-2); }
.k-form input, .k-form select, .k-form textarea { min-height: 42px; box-sizing: border-box; padding: 8px 10px; border-radius: var(--bn-radius-sm, 8px); border: 1px solid var(--bn-border); background: var(--bn-bg); color: var(--bn-text); font: inherit; }
.k-btns { display: flex; gap: 8px; flex-wrap: wrap; }
.k-btn { min-height: 44px; display: inline-flex; align-items: center; gap: 6px; padding: 0 16px; border-radius: var(--bn-radius-md); border: 0; background: var(--bn-action); color: var(--bn-on-action, #fff); font: 800 14px var(--bn-font-ui); cursor: pointer; text-decoration: none; }
.k-btn--quiet { background: transparent; color: var(--bn-text-2); border: 1px solid var(--bn-border); }
.k-btn--sm { min-height: 34px; padding: 0 12px; font-size: 13px; }
.k-notice { padding: 10px 14px; border-radius: var(--bn-radius-md); background: var(--bn-success-subtle); color: var(--bn-success-text); font-weight: 700; }
.k-error { padding: 10px 14px; border-radius: var(--bn-radius-md); background: var(--bn-danger-subtle); color: var(--bn-danger-text); font-weight: 700; }

/* ── nav: phone ─────────────────────────────────────────────────────────── */
.k-floatbar svg, .k-edge svg { width: 21px; height: 21px; }
.k-floatbar-item > span:not(.bn-floatbar-lens) { display: flex; flex-direction: column; align-items: center; gap: 3px; }

@media (min-width: 861px) {
  .k-nav { display: flex; }
  .bn-floatbar, .bn-edgetab { display: none !important; }
  .k-main { padding-bottom: 48px; }
}
@media (max-width: 860px) {
  .k-switch, .k-add-wide { display: none !important; }
  .k-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .k-row2, .k-side { grid-template-columns: minmax(0, 1fr); }
  .k-tips, .k-acts { grid-template-columns: minmax(0, 1fr); }
  .k-acts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .k-bar { grid-template-columns: minmax(0, 8rem) minmax(0, 1fr) auto; }
  .k-kpi-v { font-size: 23px; }
  .k-day { min-height: 46px; padding: 4px 5px; }
  .k-day .k-amt { font-size: 9.5px; }
}
@media (max-width: 380px) {
  .k-brand b { font-size: 21px; }
  .k-month span { font-size: 12.5px; }
}
@media (prefers-reduced-motion: reduce) { .k-chev { transition: none; } }

/* ── small additions ────────────────────────────────────────────────────── */
a.k-bar, a.k-act, a.k-card { color: inherit; text-decoration: none; }
a.k-bar:hover span:first-child { text-decoration: underline; }
.k-mini { min-height: 36px; max-width: 12rem; box-sizing: border-box; padding: 4px 8px; border-radius: var(--bn-radius-sm, 8px); border: 1px solid var(--bn-border); background: var(--bn-bg); color: var(--bn-text); font: inherit; }
.k-rowline-t .k-mini { max-width: 100%; }
.k-form.k-card { gap: 10px; }
select { min-height: 40px; border-radius: var(--bn-radius-sm, 8px); border: 1px solid var(--bn-border); background: var(--bn-bg); color: var(--bn-text); font: inherit; padding: 0 8px; }
.k-ask input[type="search"] { flex: 1; }
details > summary { cursor: pointer; }
/* the coach's conversation, in Kurs's colours */
.kmhf-chat-log { display: grid; gap: 10px; }
.kmhf-chat-row { display: flex; }
.kmhf-chat-row--user { justify-content: flex-end; }
.kmhf-chat-bubble { max-width: 82%; padding: 10px 14px; border-radius: 16px; line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.kmhf-chat-row--user .kmhf-chat-bubble { background: var(--bn-action); color: var(--bn-on-action, #fff); border-bottom-right-radius: 4px; }
.kmhf-chat-row--assistant .kmhf-chat-bubble { background: var(--bn-surface-2); border-bottom-left-radius: 4px; }
.k-ask textarea { flex: 1; min-width: 0; min-height: 46px; box-sizing: border-box; padding: 11px 16px; border-radius: 23px; border: 1px solid var(--bn-border); background: var(--bn-surface); color: var(--bn-text); font: inherit; resize: vertical; }
.kmhf-chat-form.is-busy button { opacity: 0.55; }
.kmhf-chat-retry { margin-top: 6px; }

/* The header must hold brand, month and three buttons at 360px: nothing in it shrinks to nothing. */
.k-iconbtn, .k-menu, .k-month, .k-brand { flex: none; }
@media (max-width: 860px) {
  .k-top-in { gap: 0; padding: 0 4px 0 12px; }
  .k-brand { margin-right: 4px; }
  .k-iconbtn { width: 40px; }
  .k-month a { width: 26px; }
}

/* column charts: SVG bars, HTML labels */
.k-colchart { display: grid; gap: 4px; }
.k-colchart .k-cols { height: 150px; }
.k-colrow { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); text-align: center; font-size: 11.5px; color: var(--bn-text-3); font-variant-numeric: tabular-nums; }
.k-colrow--v { color: var(--bn-text-2); font-weight: 700; font-size: 11px; }
.k-colrow .is-now { color: var(--bn-text); font-weight: 800; }
@media (max-width: 480px) { .k-colrow { font-size: 10px; } .k-colrow--v { font-size: 9.5px; } }

/* Botnest's sprite carries bare lucide paths; the stroke is the page's to set (stroke 1.75). */
.bn-icon { fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; flex: none; }

.k-card h2, .k-card .k-head h2 { font: 800 16px/1.25 var(--bn-font-ui); margin: 0; }
.k-signin { max-width: 420px; padding-top: 12vh; }
.k-signin-brand { display: flex; align-items: center; justify-content: center; gap: 10px; }
.k-signin-brand b { font: 700 44px/1 var(--bn-font-reading, Georgia, serif); }