/* ============ Casely24 · full prototype · v1 design system ============ */
:root{
  --brand:#0E4A8C;
  --brand-600:#0C3F77;
  --brand-700:#0A3462;
  --brand-100:#DCE8F6;
  --brand-50:#EFF4FB;
  --ink:#0F1522;
  --text:#1C2433;
  --text-2:#5A6474;
  --text-3:#7C8494; /* audit: løftet fra #939CAB for WCAG-kontrast på hvid */
  --bg:#F4F5F7;
  --card:#FFFFFF;
  --border:#E6E9EF;
  --border-2:#EEF0F4;

  --green:#15803D;   --green-dot:#22A55E;  --green-bg:#E9F6EF;  --green-br:#CBE9D8;
  --amber:#A16003;   --amber-dot:#EFA00B;  --amber-bg:#FCF3E1;  --amber-br:#F3E1BB;
  --red:#BE2D20;     --red-dot:#E2483A;    --red-bg:#FCEDEA;    --red-br:#F5D2CC;

  --shadow-sm: 0 1px 2px rgba(15,21,34,.05);
  --shadow-md: 0 1px 2px rgba(15,21,34,.05), 0 10px 30px -14px rgba(15,21,34,.16);
  --shadow-lg: 0 2px 4px rgba(15,21,34,.06), 0 24px 60px -24px rgba(15,21,34,.24);

  --r-lg:16px; --r-md:12px; --r-sm:9px;
  --font-ui:"Inter",-apple-system,system-ui,sans-serif;
  --font-display:"Schibsted Grotesk",var(--font-ui);
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{
  font-family:var(--font-ui);
  font-size:14px; line-height:1.5;
  color:var(--text);
  background:var(--bg);
  overflow-x:hidden;
}
button{font:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,textarea,select{font:inherit;color:inherit}
::selection{background:var(--brand-100)}
:focus-visible{outline:2px solid rgba(14,74,140,.45);outline-offset:2px;border-radius:6px}

/* ============ Shell ============ */
.shell{display:flex;min-height:100vh}
.side{
  width:242px; flex-shrink:0;
  background:#FBFBFC;
  border-right:1px solid var(--border);
  display:flex;flex-direction:column;
  position:sticky;top:0;height:100vh;
  padding:18px 12px 14px;
}
.side-logo{display:flex;align-items:center;gap:11px;padding:2px 8px 16px}
.side-logo>img{width:38px;height:38px;object-fit:contain;flex:0 0 38px}
.logo-mark{
  width:38px;height:38px;border-radius:11px;flex-shrink:0;
  background:linear-gradient(145deg,#12579F, #0A3765);
  color:#fff;display:grid;place-items:center;
  font-family:var(--font-display);font-weight:800;font-size:15px;letter-spacing:-.02em;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22), 0 2px 6px -2px rgba(10,55,101,.5);
}
.logo-txt b{display:block;font-family:var(--font-display);font-weight:700;font-size:15px;letter-spacing:-.01em;color:var(--ink)}
.logo-txt span{font-size:11.5px;color:var(--text-3);font-weight:500;letter-spacing:.01em}
.side-nav{flex:1;min-height:0;overflow-y:auto;margin:0 -4px;padding:0 4px}
.nav-group{margin-top:14px}
.nav-label{font-size:10.5px;font-weight:650;letter-spacing:.09em;text-transform:uppercase;color:var(--text-3);padding:0 10px 6px}
.nav-item{
  display:flex;align-items:center;gap:10px;width:100%;
  padding:8px 10px;border-radius:10px;
  font-size:13.5px;font-weight:500;color:var(--text-2);
  transition:background .15s ease,color .15s ease;
  position:relative;text-align:left;
}
.nav-item svg{width:18px;height:18px;flex-shrink:0;opacity:.75;transition:opacity .15s}
.nav-item:hover{background:#F1F2F5;color:var(--ink)}
.nav-item:hover svg{opacity:1}
.nav-item.active{background:var(--brand-50);color:var(--brand);font-weight:600}
.nav-item.active svg{opacity:1}
.nav-item.active::before{
  content:"";position:absolute;left:-12px;top:7px;bottom:7px;width:3px;
  background:var(--brand);border-radius:0 3px 3px 0;
}
.nav-badge{
  margin-left:auto;min-width:20px;height:20px;padding:0 6px;border-radius:999px;
  background:var(--amber-dot);color:#fff;font-size:11px;font-weight:700;
  display:grid;place-items:center;
  transition:transform .3s cubic-bezier(.34,1.56,.64,1);
}
.nav-badge.zero{background:var(--border);color:var(--text-3)}
.nav-cnt{margin-left:auto;font-size:11.5px;color:var(--text-3)}
.side-foot{margin-top:auto;padding-top:12px}
.side-user{
  display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:12px;
  transition:background .15s;cursor:pointer;
}
.side-user:hover{background:#F1F2F5}
.side-user .avatar{width:32px;height:32px;font-size:12px}
.side-user b{display:block;font-size:13px;font-weight:600;color:var(--ink);line-height:1.25}
.side-user span{font-size:11.5px;color:var(--text-3)}
.powered{
  display:flex;align-items:center;gap:7px;
  padding:12px 10px 2px;margin-top:6px;border-top:1px solid var(--border-2);
  font-size:11px;color:var(--text-3);font-weight:500;letter-spacing:.01em;
}
.powered i{width:8px;height:8px;border-radius:3px;background:#104925;display:inline-block}

/* --- Topbar --- */
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{
  height:60px;flex-shrink:0;
  display:flex;align-items:center;gap:12px;
  padding:0 26px;
  background:rgba(244,245,247,.86);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border-2);
  position:sticky;top:0;z-index:40;
}
.search{
  display:flex;align-items:center;gap:9px;
  width:340px;height:38px;padding:0 13px;
  background:var(--card);border:1px solid var(--border);border-radius:11px;
  color:var(--text-3);
  transition:box-shadow .18s,border-color .18s,background .15s;
  cursor:pointer;text-align:left;
}
.search:hover{border-color:#CBD6E4;background:#FDFDFE}
.search .ph{flex:1;font-size:13.5px;color:var(--text-3)}
.search kbd{
  font-family:var(--font-ui);font-size:10.5px;color:var(--text-3);
  border:1px solid var(--border);border-bottom-width:2px;border-radius:5px;padding:1px 5px;background:#FAFAFB;
}
.topbar .grow{flex:1}
.icon-btn{
  width:38px;height:38px;border-radius:11px;display:grid;place-items:center;
  color:var(--text-2);border:1px solid transparent;position:relative;
  transition:background .15s,border-color .15s,color .15s;
}
.icon-btn:hover{background:var(--card);border-color:var(--border);color:var(--ink)}
#langBtn{
  width:56px;padding:0 6px;cursor:pointer;
  background:transparent;font:700 11px/1 var(--font-ui);letter-spacing:.02em;
}
#langBtn:hover{background:var(--card)}
.icon-btn .dot{
  position:absolute;top:9px;right:10px;width:7px;height:7px;border-radius:50%;
  background:var(--red-dot);border:1.5px solid var(--bg);
}
.avatar{
  width:34px;height:34px;border-radius:50%;
  background:linear-gradient(145deg,#3D6FB0,#0E4A8C);
  color:#fff;font-size:12px;font-weight:650;
  display:grid;place-items:center;letter-spacing:.02em;flex-shrink:0;
}
.avatar.mk{background:linear-gradient(145deg,#2B8A5C,#104925)}
.avatar.jf{background:linear-gradient(145deg,#8A6ED1,#5B3FA8)}
.avatar.mh{background:linear-gradient(145deg,#C2703E,#8F4A1E)}
.avatar.ld{background:linear-gradient(145deg,#4A7B9D,#2C5670)}
.avatar.sys{background:#EDF0F4;color:var(--text-3)}

/* ============ Buttons & chips ============ */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  height:38px;padding:0 16px;border-radius:11px;
  font-size:13.5px;font-weight:600;letter-spacing:.005em;
  transition:transform .16s ease,box-shadow .16s ease,background .16s ease,border-color .16s,color .16s,opacity .2s;
  white-space:nowrap;
}
.btn:active{transform:translateY(0) scale(.98)}
.btn svg{width:15px;height:15px;flex-shrink:0}
.btn.sm svg{width:13px;height:13px}
.btn-primary{
  background:var(--brand);color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14), 0 1px 2px rgba(10,52,98,.3), 0 6px 16px -8px rgba(10,52,98,.5);
}
.btn-primary:hover{background:var(--brand-600);transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 2px 4px rgba(10,52,98,.28),0 10px 22px -8px rgba(10,52,98,.55)}
.btn-ghost{background:var(--card);border:1px solid var(--border);color:var(--text);box-shadow:var(--shadow-sm)}
.btn-ghost:hover{border-color:#D5DAE2;background:#FCFCFD;transform:translateY(-1px);box-shadow:var(--shadow-md)}
.btn-danger{background:var(--card);border:1px solid var(--border);color:var(--red);box-shadow:var(--shadow-sm)}
.btn-danger:hover{border-color:var(--red-br);background:var(--red-bg);transform:translateY(-1px)}
.btn-success{background:var(--green);color:#fff;pointer-events:none}
.btn[disabled]{opacity:.55;pointer-events:none}
.btn.sm{height:32px;padding:0 13px;font-size:12.5px;border-radius:9px}
.btn .spin{
  width:15px;height:15px;border-radius:50%;
  border:2px solid rgba(255,255,255,.35);border-top-color:#fff;
  animation:spin .7s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}

.chip{
  display:inline-flex;align-items:center;gap:6px;
  height:24px;padding:0 10px;border-radius:999px;
  font-size:11.5px;font-weight:650;letter-spacing:.01em;white-space:nowrap;
}
.chip i{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.chip.green{background:var(--green-bg);color:var(--green);border:1px solid var(--green-br)}
.chip.green i{background:var(--green-dot)}
.chip.amber{background:var(--amber-bg);color:var(--amber);border:1px solid var(--amber-br)}
.chip.amber i{background:var(--amber-dot)}
.chip.red{background:var(--red-bg);color:var(--red);border:1px solid var(--red-br)}
.chip.red i{background:var(--red-dot)}
.chip.blue{background:var(--brand-50);color:var(--brand);border:1px solid var(--brand-100)}
.chip.blue i{background:var(--brand)}
.chip.gray{background:#F2F3F6;color:var(--text-2);border:1px solid var(--border)}
.chip.gray i{background:var(--text-3)}

/* ============ Content ============ */
.content{padding:26px 26px 60px;max-width:1420px;width:100%;margin:0 auto}
.view{animation:viewIn .4s cubic-bezier(.22,.9,.3,1) both}
@keyframes viewIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes cardIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.rise{animation:cardIn .5s cubic-bezier(.22,.9,.3,1) both;animation-delay:calc(var(--i,0)*26ms)}

.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:20px;flex-wrap:wrap}
.page-head h1{
  font-family:var(--font-display);font-size:26px;font-weight:750;letter-spacing:-.025em;color:var(--ink);
  line-height:1.15;
}
.page-head .sub{margin-top:5px;font-size:13.5px;color:var(--text-2)}
.sub .g{color:var(--green);font-weight:600}
.sub .a{color:var(--amber);font-weight:600}
.sub .r{color:var(--red);font-weight:600}
.page-head .actions{display:flex;gap:9px;align-items:center}
.live{
  display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--text-3);font-weight:500;
}
.live i{
  width:8px;height:8px;border-radius:50%;background:var(--green-dot);position:relative;
}
.live i::after{
  content:"";position:absolute;inset:-3px;border-radius:50%;
  border:2px solid rgba(34,165,94,.4);animation:pulse 2.2s ease-out infinite;
}
@keyframes pulse{0%{transform:scale(.6);opacity:1}70%{transform:scale(1.4);opacity:0}100%{opacity:0}}

/* KPI */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:22px}
.kpi{
  background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);
  padding:16px 18px 15px;box-shadow:var(--shadow-sm);
  transition:transform .2s ease,box-shadow .2s ease;position:relative;overflow:hidden;
}
.kpi:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.kpi .lbl{font-size:12px;font-weight:600;color:var(--text-2);display:flex;align-items:center;gap:7px}
.kpi .lbl i{width:8px;height:8px;border-radius:50%}
.kpi .val{
  font-family:var(--font-display);font-size:32px;font-weight:800;letter-spacing:-.03em;color:var(--ink);
  margin-top:6px;line-height:1;font-variant-numeric:tabular-nums;
}
.kpi .val small{font-size:15px;font-weight:600;color:var(--text-3);letter-spacing:0}
.kpi .foot{margin-top:8px;font-size:12px;color:var(--text-3)}
.kpi.k-green .lbl i{background:var(--green-dot)} .kpi.k-green .val{color:var(--green)}
.kpi.k-amber .lbl i{background:var(--amber-dot)} .kpi.k-amber .val{color:#B26205}
.kpi.k-red{border-color:var(--red-br);background:linear-gradient(180deg,#FFF, #FFF9F8)}
.kpi.k-red .lbl i{background:var(--red-dot)} .kpi.k-red .val{color:var(--red)}
.kpi.k-red::after{
  content:"";position:absolute;inset:0;border-radius:var(--r-lg);pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(226,72,58,.16);
}

/* Overview grid */
.ov-grid{display:grid;grid-template-columns:1fr 342px;gap:16px;align-items:start}
@media (max-width:1180px){.ov-grid{grid-template-columns:1fr}.kpis{grid-template-columns:repeat(2,1fr)}.search{width:220px}}
.panel{
  background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);
  box-shadow:var(--shadow-sm);
}
.panel-h{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 18px 0;flex-wrap:wrap}
.panel-h h2{font-family:var(--font-display);font-size:16px;font-weight:700;letter-spacing:-.015em;color:var(--ink)}
.panel-h .hint{font-size:12.5px;color:var(--text-3);margin-top:2px}
.panel-h .r{display:flex;gap:8px;align-items:center}

.pills{display:flex;gap:6px;flex-wrap:wrap;padding:14px 18px 4px}
.pills.bare{padding:0}
.pill{
  height:30px;padding:0 13px;border-radius:999px;
  border:1px solid var(--border);background:var(--card);
  font-size:12.5px;font-weight:600;color:var(--text-2);
  transition:all .16s ease;
}
.pill:hover{border-color:#CBD3DE;color:var(--ink)}
.pill.on{background:var(--ink);border-color:var(--ink);color:#fff}
.pill .n{opacity:.55;font-weight:600;margin-left:4px;font-variant-numeric:tabular-nums}

.stores{display:grid;grid-template-columns:repeat(auto-fill,minmax(172px,1fr));gap:10px;padding:14px 18px 18px}
.store{
  position:relative;text-align:left;
  border:1px solid var(--border);border-radius:13px;
  background:linear-gradient(180deg,#FDFDFE,#F8FAF9);
  padding:12px 13px 11px;min-height:96px;
  display:flex;flex-direction:column;
  border-left-width:3px;border-left-color:var(--green-dot);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
  cursor:pointer;
}
.store:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:#D8DDE5;border-left-color:var(--green-dot)}
.store .top{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.store .nm{font-size:12.5px;font-weight:700;color:var(--ink);line-height:1.25;letter-spacing:-.005em}
.store .st{font-size:11.5px;color:var(--text-2);margin-top:5px;line-height:1.35}
.store .mt{margin-top:auto;padding-top:7px;font-size:10.5px;color:var(--text-3);display:flex;align-items:center;gap:5px}
.store .mt svg{width:11px;height:11px;opacity:0;transform:translateX(-3px);transition:all .18s ease}
.store:hover .mt svg{opacity:.8;transform:none}
.sdot{width:8px;height:8px;border-radius:50%;background:var(--green-dot);flex-shrink:0;margin-top:3px;position:relative}
.store.amber{background:linear-gradient(180deg,#FFFDF8,#FEF8EA);border-left-color:var(--amber-dot)}
.store.amber:hover{border-left-color:var(--amber-dot)}
.store.amber .sdot{background:var(--amber-dot)}
.store.amber .st{color:#8A5A10;font-weight:600}
.store.red{background:linear-gradient(180deg,#FFFBFA,#FDF0EE);border-left-color:var(--red-dot)}
.store.red:hover{border-left-color:var(--red-dot)}
.store.red .sdot{background:var(--red-dot)}
.store.red .sdot::after{
  content:"";position:absolute;inset:-4px;border-radius:50%;
  border:2px solid rgba(226,72,58,.4);animation:pulse 1.8s ease-out infinite;
}
.store.red .st{color:var(--red);font-weight:650}
.legend{
  display:flex;align-items:center;gap:18px;padding:0 18px 16px;
  font-size:12px;color:var(--text-2);flex-wrap:wrap;
}
.legend b{font-weight:600}
.legend .lg{display:inline-flex;align-items:center;gap:6px}
.legend .lg i{width:8px;height:8px;border-radius:50%}
.legend .right{margin-left:auto;color:var(--text-3)}

/* Right rail */
.rail{display:flex;flex-direction:column;gap:14px}
.act-list{padding:6px 8px 8px}
.act{
  display:grid;grid-template-columns:10px 1fr auto;gap:11px;align-items:start;
  padding:11px 10px;border-radius:11px;cursor:pointer;text-align:left;width:100%;
  transition:background .15s;
}
.act:hover{background:#F6F7F9}
.act + .act{border-top:1px solid var(--border-2)}
.act .adot{width:8px;height:8px;border-radius:50%;margin-top:5px}
.act .adot.red{background:var(--red-dot)}
.act .adot.amber{background:var(--amber-dot)}
.act b{font-size:12.5px;font-weight:700;color:var(--ink);display:block}
.act .is{display:block;font-size:12px;color:var(--text-2);margin-top:1px;line-height:1.35}
.act .ms{display:block;font-size:10.5px;color:var(--text-3);margin-top:3px}
.tag{
  font-size:9.5px;font-weight:750;letter-spacing:.05em;text-transform:uppercase;
  padding:3px 7px;border-radius:6px;white-space:nowrap;
}
.tag.akut{background:var(--red-dot);color:#fff}
.tag.hoj{background:#FBE4DA;color:#B82800}
.tag.med{background:#FEF3C7;color:#B45309}
.tag.lav{background:#F2F3F6;color:var(--text-2)}

.appr-card{
  border:1px solid var(--amber-br);
  background:linear-gradient(180deg,#FFFDF6,#FDF6E6);
  border-radius:var(--r-lg);padding:16px;box-shadow:var(--shadow-sm);
  cursor:pointer;transition:transform .18s,box-shadow .18s;text-align:left;width:100%;
}
.appr-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.appr-card .ttl{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--amber)}
.appr-card .ttl svg{width:15px;height:15px}
.appr-card .amt{font-family:var(--font-display);font-size:24px;font-weight:800;letter-spacing:-.02em;color:var(--ink);margin-top:8px;font-variant-numeric:tabular-nums}
.appr-card .what{font-size:12.5px;color:var(--text-2);margin-top:2px}
.appr-card .cta{
  margin-top:12px;display:inline-flex;align-items:center;gap:6px;
  font-size:12.5px;font-weight:650;color:var(--brand);
}
.appr-card .cta svg{width:14px;height:14px;transition:transform .18s}
.appr-card:hover .cta svg{transform:translateX(2px)}
.appr-empty{
  border:1px dashed var(--border);border-radius:var(--r-lg);padding:16px;
  font-size:12.5px;color:var(--text-3);background:#FBFBFC;display:flex;align-items:center;gap:9px;
}
.appr-empty svg{width:16px;height:16px;color:var(--green-dot)}

.contact-mini{padding:14px 16px 16px;display:flex;gap:11px;align-items:center}
.contact-mini b{display:block;font-size:13px;font-weight:650;color:var(--ink)}
.contact-mini span{font-size:11.5px;color:var(--text-3)}
.contact-mini .cbtns{margin-left:auto;display:flex;gap:6px}
.cbtn{
  width:30px;height:30px;border-radius:9px;border:1px solid var(--border);background:#fff;
  display:grid;place-items:center;color:var(--brand);transition:all .15s;
}
.cbtn:hover{background:var(--brand-50);border-color:var(--brand-100);transform:translateY(-1px)}
.cbtn svg{width:14px;height:14px}
.cbtn.wide{width:auto;padding:0 12px;height:32px;display:inline-flex;gap:6px;font-size:12px;font-weight:600}

/* ============ Case view ============ */
.back{
  display:inline-flex;align-items:center;gap:7px;
  font-size:13px;font-weight:600;color:var(--text-2);
  padding:6px 10px;margin:-6px 0 14px -10px;border-radius:9px;
  transition:all .15s;
}
.back:hover{color:var(--ink);background:#EDEFF2}
.back svg{width:15px;height:15px;transition:transform .18s}
.back:hover svg{transform:translateX(-2px)}

.case-head{margin-bottom:18px}
.case-meta-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.case-id{
  font-family:var(--font-display);font-size:12.5px;font-weight:700;letter-spacing:.02em;
  color:var(--text-3);background:#EEF0F4;padding:3px 9px;border-radius:7px;
}
.case-head h1{
  font-family:var(--font-display);font-size:24px;font-weight:750;letter-spacing:-.022em;color:var(--ink);
  margin-top:10px;line-height:1.2;
}
.case-sub{margin-top:6px;font-size:13px;color:var(--text-2);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.case-sub svg{width:14px;height:14px;color:var(--text-3)}
.case-sub .sep{color:#CBD1DA}

/* stepper */
.stepper{
  display:flex;align-items:flex-start;
  background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);
  padding:16px 18px 14px;margin-bottom:16px;box-shadow:var(--shadow-sm);
  overflow-x:auto;
}
.step{flex:1;min-width:86px;position:relative;text-align:center}
.step::before{
  content:"";position:absolute;top:11px;left:calc(-50% + 14px);right:calc(50% + 14px);
  height:2px;background:var(--border);border-radius:2px;
}
.step:first-child::before{display:none}
.step.done::before{background:var(--green-dot)}
.step.cur::before{background:linear-gradient(90deg,var(--green-dot),var(--amber-dot))}
.step .ic{
  width:22px;height:22px;border-radius:50%;margin:0 auto;
  display:grid;place-items:center;position:relative;z-index:1;
  background:#EDF0F4;color:var(--text-3);
  border:2px solid #EDF0F4;
  transition:all .3s ease;
}
.step .ic svg{width:11px;height:11px}
.step.done .ic{background:var(--green-dot);border-color:var(--green-dot);color:#fff}
.step.cur .ic{
  background:#fff;border-color:var(--amber-dot);color:var(--amber-dot);
  box-shadow:0 0 0 4px rgba(239,160,11,.14);
}
.step.cur.approved-cur .ic{border-color:var(--brand);color:var(--brand);box-shadow:0 0 0 4px rgba(14,74,140,.12)}
.step b{display:block;font-size:11px;font-weight:650;color:var(--ink);margin-top:7px;letter-spacing:.005em}
.step span{display:block;font-size:10px;color:var(--text-3);margin-top:1px}
.step.todo b{color:var(--text-3);font-weight:550}
.step>i{
  width:22px;height:22px;margin:0 auto;display:grid;place-items:center;
  border-radius:50%;background:#EDF0F4;color:var(--text-3);
  font-size:10px;font-style:normal;font-weight:750;position:relative;z-index:1;
}
.step.done>i{background:var(--green-dot);color:#fff}
.step>span>small{display:block;margin-top:2px;font-size:9.5px;line-height:1.35;color:var(--text-3)}

.case-grid{display:grid;grid-template-columns:1fr 324px;gap:16px;align-items:start}
@media (max-width:1180px){.case-grid{grid-template-columns:1fr}}

/* thread */
.thread{display:flex;flex-direction:column;gap:12px}
.ev{display:flex;gap:12px}
.ev .avatar{width:32px;height:32px;font-size:11.5px;margin-top:2px}
.ev-body{flex:1;min-width:0}
.ev-head{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.ev-head b{font-size:13px;font-weight:650;color:var(--ink)}
.ev-head .role{font-size:11px;color:var(--text-3);font-weight:500}
.ev-head time{font-size:11px;color:var(--text-3);margin-left:auto;white-space:nowrap}
.bubble{
  margin-top:6px;background:var(--card);border:1px solid var(--border);
  border-radius:4px 14px 14px 14px;padding:11px 14px;
  font-size:13.5px;color:var(--text);box-shadow:var(--shadow-sm);
  line-height:1.55;
}
.ev.me .bubble{background:var(--brand-50);border-color:var(--brand-100);border-radius:14px 4px 14px 14px}
.photos{display:flex;gap:8px;margin-top:8px}
.photo{
  width:104px;height:74px;border-radius:10px;border:1px solid var(--border);
  background:
    radial-gradient(140% 90% at 20% 10%, #C7D5E4 0%, transparent 55%),
    radial-gradient(120% 100% at 85% 90%, #97A9BC 0%, transparent 50%),
    linear-gradient(160deg,#B4C2D2,#7F92A6);
  position:relative;overflow:hidden;cursor:pointer;
  transition:transform .16s,box-shadow .16s;
}
.photo:hover{transform:translateY(-2px) scale(1.02);box-shadow:var(--shadow-md)}
.photo svg{position:absolute;right:7px;bottom:6px;width:14px;height:14px;color:rgba(255,255,255,.85)}
.photo span{
  position:absolute;left:7px;bottom:5px;font-size:9px;font-weight:600;color:rgba(255,255,255,.9);
  letter-spacing:.02em;text-shadow:0 1px 2px rgba(0,0,0,.3);
}
.sysline{
  display:flex;align-items:center;gap:10px;padding:2px 0 2px 44px;
  font-size:12.5px;color:var(--text-2);
}
.sysline .sic{
  width:22px;height:22px;border-radius:8px;background:#EDF0F4;color:var(--text-2);
  display:grid;place-items:center;flex-shrink:0;margin-left:-32px;
}
.sysline .sic svg{width:12px;height:12px}
.sysline b{font-weight:650;color:var(--ink)}
.sysline time{margin-left:auto;font-size:11px;color:var(--text-3);white-space:nowrap}
.sysline.good .sic{background:var(--green-bg);color:var(--green)}

/* offer card */
.offer{
  border:1px solid var(--brand-100);
  border-radius:var(--r-lg);
  background:linear-gradient(180deg,#FFFFFF, #F7FAFE);
  box-shadow:var(--shadow-md);
  overflow:hidden;
  margin-left:44px;
  position:relative;
}
.offer::before{
  content:"";position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--brand),#3D6FB0);
}
.offer.approved::before{background:linear-gradient(90deg,#1FA35C,#15803D)}
.offer-h{display:flex;align-items:center;gap:10px;padding:15px 18px 0;flex-wrap:wrap}
.offer-h .oic{
  width:34px;height:34px;border-radius:10px;background:var(--brand-50);color:var(--brand);
  display:grid;place-items:center;flex-shrink:0;
}
.offer-h .oic svg{width:17px;height:17px}
.offer-h b{font-family:var(--font-display);font-size:15px;font-weight:700;letter-spacing:-.01em;color:var(--ink);display:block}
.offer-h .v{font-size:11.5px;color:var(--text-3)}
.offer-h .chip{margin-left:auto}
.rev-note{
  margin:12px 18px 0;padding:9px 12px;border-radius:10px;
  background:var(--brand-50);border:1px solid var(--brand-100);
  font-size:12.5px;color:var(--brand-700);display:flex;gap:8px;align-items:flex-start;
}
.rev-note svg{width:14px;height:14px;flex-shrink:0;margin-top:2px}
.olines{padding:14px 18px 0}
.oline{
  display:flex;justify-content:space-between;gap:14px;
  padding:8.5px 0;border-bottom:1px dashed var(--border);
  font-size:13px;
}
.oline .d{color:var(--text-2)}
.oline .p{font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.oline.total{border-bottom:none;padding-top:12px}
.oline.total .d{font-weight:700;color:var(--ink);font-size:13.5px}
.oline.total .p{font-family:var(--font-display);font-weight:800;font-size:19px;letter-spacing:-.02em}
.oline.total .p small{font-size:11px;color:var(--text-3);font-weight:500;letter-spacing:0}
.othreshold{
  margin:10px 18px 0;display:flex;align-items:center;gap:8px;
  font-size:12px;color:var(--amber);font-weight:600;
  background:var(--amber-bg);border:1px solid var(--amber-br);
  padding:8px 12px;border-radius:10px;
}
.othreshold svg{width:14px;height:14px;flex-shrink:0}
.ometa{display:flex;gap:16px;padding:10px 18px 0;font-size:11.5px;color:var(--text-3);flex-wrap:wrap}
.ometa b{color:var(--text-2);font-weight:600}
.ometa svg{width:13px;height:13px;vertical-align:-2px;margin-right:3px;flex-shrink:0}
.oact{display:flex;gap:9px;padding:15px 18px 17px;flex-wrap:wrap;align-items:center}
.oact .right{margin-left:auto;font-size:11.5px;color:var(--text-3);display:flex;align-items:center;gap:6px}
.oact .right svg{width:13px;height:13px}

.approved-note{
  margin:14px 18px 0;padding:12px 14px;border-radius:12px;
  background:var(--green-bg);border:1px solid var(--green-br);
  display:flex;gap:10px;align-items:center;
  animation:cardIn .45s cubic-bezier(.22,.9,.3,1) both;
}
.approved-note .ok{
  width:26px;height:26px;border-radius:50%;background:var(--green-dot);color:#fff;
  display:grid;place-items:center;flex-shrink:0;
}
.approved-note .ok svg{width:13px;height:13px}
.approved-note b{font-size:13px;color:var(--green);display:block}
.approved-note span{font-size:12px;color:#3D7A57}

.revision-box{margin:12px 18px 0;animation:cardIn .3s ease both}
.revision-box textarea{
  width:100%;min-height:74px;resize:vertical;
  border:1px solid var(--border);border-radius:11px;padding:10px 13px;
  font-size:13px;background:#fff;outline:none;
  transition:border-color .15s,box-shadow .15s;
}
.revision-box textarea:focus{border-color:#B9CDE6;box-shadow:0 0 0 3px rgba(14,74,140,.08)}
.revision-box .rb-act{display:flex;gap:8px;margin-top:9px}

/* composer */
.composer{
  margin-top:4px;margin-left:44px;
  display:flex;gap:9px;align-items:center;
  background:var(--card);border:1px solid var(--border);border-radius:13px;
  padding:7px 8px 7px 14px;box-shadow:var(--shadow-sm);
  transition:border-color .15s,box-shadow .15s;
}
.composer:focus-within{border-color:#B9CDE6;box-shadow:0 0 0 3px rgba(14,74,140,.08)}
.composer input{flex:1;border:none;outline:none;background:none;font-size:13.5px}
.composer input::placeholder{color:var(--text-3)}
.composer .attach{color:var(--text-3);width:32px;height:32px;border-radius:9px;display:grid;place-items:center;transition:all .15s}
.composer .attach:hover{background:#F1F2F5;color:var(--text)}
.composer .send{
  width:34px;height:34px;border-radius:10px;background:var(--brand);color:#fff;
  display:grid;place-items:center;transition:all .15s;
  box-shadow:0 2px 6px -2px rgba(10,52,98,.5);
}
.composer .send:hover{background:var(--brand-600);transform:translateY(-1px)}
.composer .send svg{width:15px;height:15px}

/* rail cards (case) */
.rc{background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-sm)}
.rc-h{padding:13px 16px 0;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3)}
.rc-b{padding:11px 16px 14px}
.kv{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:6.5px 0;font-size:12.5px}
.kv + .kv{border-top:1px solid var(--border-2)}
.kv .k{color:var(--text-3)}
.kv .v{font-weight:600;color:var(--ink);text-align:right}
.kv .v.link{color:var(--brand);cursor:pointer}
.kv .v.link:hover{text-decoration:underline}

.agent-card{display:flex;gap:11px;align-items:center}
.agent-card .avatar{width:40px;height:40px;font-size:13px}
.agent-card b{display:block;font-size:13.5px;font-weight:650;color:var(--ink)}
.agent-card .r1{font-size:11.5px;color:var(--text-2)}
.agent-card .r2{font-size:10.5px;color:var(--text-3);margin-top:1px}
.agent-actions{display:flex;gap:7px;margin-top:11px}
.agent-actions .cbtn{flex:1;height:32px;display:flex;gap:6px;align-items:center;justify-content:center;font-size:11.5px;font-weight:600;color:var(--brand)}

.hist{position:relative;padding-left:16px}
.hist::before{content:"";position:absolute;left:4px;top:8px;bottom:8px;width:2px;background:var(--border-2);border-radius:2px}
.hi{position:relative;padding:6px 0 6px 6px}
.hi::before{
  content:"";position:absolute;left:-16px;top:12px;width:10px;height:10px;border-radius:50%;
  background:#fff;border:2.5px solid #C4CBD6;
}
.hi.cur::before{border-color:var(--amber-dot)}
.hi.ok::before{border-color:var(--green-dot);background:var(--green-dot)}
.hi b{font-size:12.5px;font-weight:650;color:var(--ink);display:flex;justify-content:space-between;gap:8px}
.hi b .pr{font-variant-numeric:tabular-nums}
.hi span{font-size:11px;color:var(--text-3);display:block;margin-top:1px}
.hi .st-note{font-size:11px;font-weight:600;margin-top:2px}
.hi .st-note.amber{color:var(--amber)}
.hi .st-note.green{color:var(--green)}
.hi .st-note.gray{color:var(--text-3)}

.doc{display:flex;align-items:center;gap:10px;padding:7px 0;font-size:12.5px}
.doc + .doc{border-top:1px solid var(--border-2)}
.doc .dic{
  width:30px;height:30px;border-radius:9px;background:#F2F3F6;color:var(--text-2);
  display:grid;place-items:center;flex-shrink:0;
}
.doc .dic svg{width:14px;height:14px}
.doc .dic.pdf{background:var(--red-bg);color:var(--red)}
.doc .dic.img{background:var(--brand-50);color:var(--brand)}
.doc b{font-weight:600;color:var(--ink);display:block;line-height:1.3}
.doc span{font-size:10.5px;color:var(--text-3)}
.doc .sz{margin-left:auto;font-size:10.5px;color:var(--text-3);white-space:nowrap}

/* ============ Tables / list pages ============ */
.tbl{background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);overflow:hidden}
.tbl-toolbar{display:flex;align-items:center;gap:8px;padding:14px 18px 10px;flex-wrap:wrap}
.tbl-toolbar .grow{flex:1}
.t-search{
  display:flex;align-items:center;gap:8px;height:34px;padding:0 12px;width:250px;
  background:#FAFAFB;border:1px solid var(--border);border-radius:10px;color:var(--text-3);
  transition:border-color .15s,box-shadow .15s;
}
.t-search:focus-within{border-color:#B9CDE6;box-shadow:0 0 0 3px rgba(14,74,140,.08);background:#fff}
.t-search input{border:none;outline:none;background:none;flex:1;font-size:13px;color:var(--text)}
.t-search svg{width:14px;height:14px}
.trow{
  display:grid;align-items:center;gap:12px;
  padding:0 18px;min-height:46px;width:100%;text-align:left;
  font-size:13px;transition:background .13s;
}
.trow + .trow, .trow-h + .trow{border-top:1px solid var(--border-2)}
button.trow:hover{background:#F8F9FB;cursor:pointer}
.trow-h{
  display:grid;align-items:center;gap:12px;padding:10px 18px;
  font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--text-3);
  background:#FAFAFB;border-top:1px solid var(--border-2);
}
.g-sager{grid-template-columns:86px 1.5fr 1fr 110px 130px 90px 110px}
.g-fakt{grid-template-columns:96px 1fr 1.1fr 110px 110px 110px}
.g-brugere{grid-template-columns:2fr 1.4fr 1.2fr 1fr 90px}
.g-afd{grid-template-columns:1.6fr 100px 130px 1fr 1fr 40px}
.trow .tid{font-family:var(--font-display);font-size:12px;font-weight:700;color:var(--text-3)}
.trow .tt b{display:block;font-size:13px;font-weight:650;color:var(--ink);line-height:1.3}
.trow .tt span{font-size:11.5px;color:var(--text-3)}
.trow .mut{color:var(--text-2);font-size:12.5px}
.trow .mut2{color:var(--text-3);font-size:12px}
.trow .amt{font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;text-align:right}
.trow .aend{display:flex;justify-content:flex-end}
.trow .who{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--text-2)}
.trow .who .avatar{width:24px;height:24px;font-size:9px}
.trow .arr{color:var(--text-3);display:grid;place-items:center}
.trow .arr svg{width:14px;height:14px}
.empty{
  padding:36px 20px;text-align:center;color:var(--text-3);font-size:13px;
}
.rolechip{
  display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:7px;
  font-size:11px;font-weight:650;background:#F2F3F6;color:var(--text-2);border:1px solid var(--border);
}
.rolechip.admin{background:var(--brand-50);color:var(--brand);border-color:var(--brand-100)}
.rolechip.mod{background:#F3EEFB;color:#6D3FB8;border-color:#E4D7F6}
.rolechip.afd{background:var(--green-bg);color:var(--green);border-color:var(--green-br)}

/* ============ Insights bars ============ */
.bars{padding:8px 18px 16px}
.bar-row{display:grid;grid-template-columns:150px 1fr 84px;gap:12px;align-items:center;padding:6px 0;font-size:12.5px}
.bar-row .bl{color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bar-row .bv{font-weight:650;color:var(--ink);text-align:right;font-variant-numeric:tabular-nums}
.bar-track{height:9px;border-radius:6px;background:#EFF1F4;overflow:hidden}
.bar-fill{height:100%;border-radius:6px;background:linear-gradient(90deg,#2E6FB2,var(--brand));transition:width .6s cubic-bezier(.22,.9,.3,1)}
.bar-fill.green{background:linear-gradient(90deg,#35B571,#1F8B4E)}
.bar-fill.amber{background:linear-gradient(90deg,#F3B13C,#DB8E08)}
.split2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:1180px){.split2{grid-template-columns:1fr}}

/* ============ Settings ============ */
.set-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}
@media (max-width:1180px){.set-grid{grid-template-columns:1fr}}
.set-b{padding:6px 18px 16px}
.set-row{display:flex;align-items:center;gap:14px;padding:12px 0}
.set-row + .set-row{border-top:1px solid var(--border-2)}
.set-row .si{flex:1}
.set-row .si b{display:block;font-size:13px;font-weight:650;color:var(--ink)}
.set-row .si span{font-size:12px;color:var(--text-3);line-height:1.45;display:block;margin-top:1px}
.f-input{
  height:36px;padding:0 12px;border:1px solid var(--border);border-radius:10px;
  background:#fff;outline:none;font-size:13.5px;
  transition:border-color .15s,box-shadow .15s;
}
.f-input:focus{border-color:#B9CDE6;box-shadow:0 0 0 3px rgba(14,74,140,.08)}
.f-input.amt{width:130px;text-align:right;font-weight:650;font-variant-numeric:tabular-nums}
select.f-input{width:100%;appearance:auto;cursor:pointer}
textarea.f-input{height:auto;min-height:84px;padding:10px 12px;resize:vertical;width:100%}
.f-label{display:block;font-size:12px;font-weight:650;color:var(--text-2);margin:0 0 5px}
.f-group{margin-bottom:13px}
.tgl{
  width:40px;height:24px;border-radius:999px;background:#DFE3E9;position:relative;flex-shrink:0;
  transition:background .18s;border:none;cursor:pointer;
}
.tgl::after{
  content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;
  background:#fff;box-shadow:0 1px 3px rgba(15,21,34,.25);
  transition:transform .18s cubic-bezier(.34,1.3,.5,1);
}
.tgl.on{background:var(--green-dot)}
.tgl.on::after{transform:translateX(16px)}
.radio-row{display:flex;gap:8px;flex-wrap:wrap}
.radio-pill{
  border:1px solid var(--border);border-radius:11px;padding:10px 13px;background:#fff;
  text-align:left;flex:1;min-width:180px;transition:all .15s;cursor:pointer;
}
.radio-pill:hover{border-color:#CBD3DE}
.radio-pill.on{border-color:var(--brand);background:var(--brand-50);box-shadow:0 0 0 1px var(--brand)}
.radio-pill b{display:block;font-size:13px;font-weight:650;color:var(--ink)}
.radio-pill span{font-size:11.5px;color:var(--text-2);display:block;margin-top:2px;line-height:1.4}

/* ============ Command palette (from v3, v1-skinned) ============ */
.ov-cmd{
  position:fixed;inset:0;z-index:300;
  background:rgba(20,26,38,.3);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
  display:grid;place-items:start center;padding-top:13vh;
  animation:fadeIn .14s ease both;
}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.cmd{
  width:min(600px,92vw);
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(24px) saturate(1.7);
  -webkit-backdrop-filter:blur(24px) saturate(1.7);
  border-radius:16px;
  box-shadow:var(--shadow-lg);
  border:1px solid rgba(15,21,34,.06);
  overflow:hidden;
  animation:cmdPop .2s cubic-bezier(.34,1.3,.5,1) both;
}
@keyframes cmdPop{from{opacity:0;transform:scale(.97) translateY(-7px)}to{opacity:1;transform:none}}
.cmd-in{display:flex;align-items:center;gap:11px;padding:15px 17px;border-bottom:1px solid var(--border-2)}
.cmd-in svg{width:17px;height:17px;color:var(--text-3);flex-shrink:0}
.cmd-in input{flex:1;background:none;border:none;outline:none;font-size:15.5px;color:var(--ink)}
.cmd-in input::placeholder{color:var(--text-3)}
.cmd-list{max-height:350px;overflow-y:auto;padding:7px}
.cgroup{font-size:10px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--text-3);padding:9px 11px 4px}
.citem{
  width:100%;display:flex;align-items:center;gap:11px;
  padding:8px 11px;border-radius:10px;text-align:left;
  font-size:13.5px;transition:background .1s;
}
.citem .ci{
  width:28px;height:28px;border-radius:8px;display:grid;place-items:center;flex-shrink:0;
  background:#F2F3F6;border:1px solid var(--border);color:var(--text-2);
}
.citem .ci svg{width:13.5px;height:13.5px}
.citem .ci.g{background:var(--green-bg);color:var(--green);border-color:var(--green-br)}
.citem .ci.a{background:var(--amber-bg);color:var(--amber);border-color:var(--amber-br)}
.citem .ci.r{background:var(--red-bg);color:var(--red);border-color:var(--red-br)}
.citem .ci.b{background:var(--brand-50);color:var(--brand);border-color:var(--brand-100)}
.citem b{font-weight:550;color:var(--ink)}
.citem .sub{font-size:11.5px;color:var(--text-3);margin-left:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.citem .k{margin-left:auto}
.citem.sel{background:var(--brand-50)}
.cmd-foot{
  display:flex;gap:15px;padding:10px 15px;border-top:1px solid var(--border-2);
  font-size:11px;color:var(--text-3);
}
.cmd-foot span{display:flex;align-items:center;gap:5px}
.cmd-empty{padding:28px;text-align:center;color:var(--text-3);font-size:13px}

/* ============ Modal ============ */
.m-ov{
  position:fixed;inset:0;z-index:280;
  background:rgba(20,26,38,.34);
  backdrop-filter:blur(4px);
  display:grid;place-items:center;padding:20px;
  animation:fadeIn .15s ease both;
}
.modal{
  width:min(560px,94vw);max-height:88vh;overflow-y:auto;
  background:var(--card);border-radius:18px;box-shadow:var(--shadow-lg);
  animation:cmdPop .22s cubic-bezier(.34,1.3,.5,1) both;
}
.m-h{display:flex;align-items:center;gap:10px;padding:18px 20px 0}
.m-h h3{font-family:var(--font-display);font-size:18px;font-weight:750;letter-spacing:-.02em;color:var(--ink);flex:1}
.m-x{
  width:32px;height:32px;border-radius:9px;display:grid;place-items:center;color:var(--text-3);
  transition:all .15s;
}
.m-x:hover{background:#F1F2F5;color:var(--ink)}
.m-x svg{width:16px;height:16px}
.m-b{padding:14px 20px 6px}
.m-f{display:flex;gap:9px;justify-content:flex-end;padding:12px 20px 18px}
.f-2col{display:grid;grid-template-columns:1fr 1fr;gap:12px}

/* toast */
.toasts{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:400;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}
.toast{
  display:flex;align-items:center;gap:10px;
  background:var(--ink);color:#fff;
  padding:11px 18px 11px 14px;border-radius:13px;
  font-size:13px;font-weight:550;
  box-shadow:var(--shadow-lg);
  animation:toastIn .35s cubic-bezier(.22,.9,.3,1) both;
}
.toast.out{animation:toastOut .3s ease both}
.toast .tic{
  width:22px;height:22px;border-radius:50%;background:var(--green-dot);
  display:grid;place-items:center;flex-shrink:0;
}
.toast .tic.info{background:#3D6FB0}
.toast .tic svg{width:12px;height:12px}
@keyframes toastIn{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}
@keyframes toastOut{to{opacity:0;transform:translateY(10px) scale(.97)}}

/* proto pill */
.proto{
  position:fixed;right:18px;bottom:16px;z-index:150;
  font-size:10.5px;font-weight:650;letter-spacing:.04em;color:var(--text-3);
  background:rgba(255,255,255,.85);backdrop-filter:blur(8px);
  border:1px solid var(--border);border-radius:999px;padding:5px 11px;
}

/* check draw */
.checkdraw{stroke-dasharray:24;stroke-dashoffset:24;animation:draw .45s .1s ease forwards}
@keyframes draw{to{stroke-dashoffset:0}}

/* ============ Persona switcher (demo only) ============ */
.switcher{position:fixed;right:18px;bottom:52px;z-index:260;display:flex;justify-content:flex-end}
.sw-btn{
  display:flex;align-items:center;gap:8px;
  height:34px;padding:0 14px 0 9px;border-radius:999px;
  background:var(--ink);color:#fff;font-size:12px;font-weight:650;
  box-shadow:var(--shadow-lg);
  transition:transform .16s ease;
}
.switcher:hover .sw-btn{transform:translateY(-1px)}
.sw-btn .swd{width:19px;height:19px;border-radius:50%;background:linear-gradient(145deg,#3D6FB0,#0E4A8C);display:grid;place-items:center;font-size:8px;font-weight:800;flex-shrink:0}
.sw-menu{
  position:absolute;right:0;bottom:42px;width:262px;
  background:var(--card);border:1px solid var(--border);border-radius:16px;
  box-shadow:var(--shadow-lg);padding:8px;
  opacity:0;pointer-events:none;transform:translateY(8px) scale(.98);
  transition:opacity .16s ease,transform .18s cubic-bezier(.22,.9,.3,1);
}
/* invisible bridge across the gap to the button, so hover isn't lost mid-move.
   Inherits pointer-events:none while the menu is closed (click-through). */
.sw-menu::before{content:"";position:absolute;left:-8px;right:-8px;bottom:-16px;height:18px}
.switcher:hover .sw-menu,.switcher:focus-within .sw-menu{opacity:1;pointer-events:auto;transform:none}
.sw-t{display:block;font-size:10px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--text-3);padding:6px 10px 5px}
.sw-menu a{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;text-decoration:none;color:var(--text);transition:background .13s}
.sw-menu a:hover{background:#F4F5F8}
.sw-menu a.on{background:var(--brand-50)}
.sw-menu a .swa{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;color:#fff;font-size:10px;font-weight:750;flex-shrink:0}
.sw-menu a b{display:block;font-size:12.5px;font-weight:650;color:var(--ink);line-height:1.2}
.sw-menu a span{font-size:10.5px;color:var(--text-3)}

/* ============ Auth pages (login + QR) ============ */
.auth-wrap{
  min-height:100vh;display:grid;place-items:center;padding:30px 18px 74px;position:relative;
  background:
    radial-gradient(52% 44% at 10% 0%, rgba(14,74,140,.08), transparent 60%),
    radial-gradient(44% 40% at 100% 100%, rgba(34,165,94,.05), transparent 60%),
    var(--bg);
}
.auth-card{
  width:min(432px,96vw);background:var(--card);
  border:1px solid var(--border);border-radius:22px;box-shadow:var(--shadow-lg);
  padding:32px 32px 26px;animation:cmdPop .3s cubic-bezier(.22,.9,.3,1) both;
}
.auth-card.wide{width:min(600px,96vw);padding:28px 30px 24px}
.auth-logo{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.auth-logo .logo-mark{width:44px;height:44px;border-radius:13px;font-size:17px}
.auth-h1{font-family:var(--font-display);font-size:21px;font-weight:750;letter-spacing:-.02em;color:var(--ink)}
.auth-sub{font-size:13px;color:var(--text-2);margin-top:4px;line-height:1.55}
.auth-sub svg{width:15px;height:15px;color:var(--text-3);flex-shrink:0;margin-top:2px}
.auth-field{margin-top:15px}
.auth-field label{display:block;font-size:12px;font-weight:650;color:var(--text-2);margin-bottom:6px}
.auth-field .f-input{width:100%;height:42px;border-radius:11px;font-size:14px}
.auth-btn{width:100%;height:42px;margin-top:14px;font-size:14px}
.auth-alt{width:100%;margin-top:10px;text-align:center;font-size:12.5px;font-weight:600;color:var(--brand);padding:8px;border-radius:9px}
.auth-alt:hover{background:var(--brand-50)}
.auth-sent{margin-top:16px;background:var(--green-bg);border:1px solid var(--green-br);border-radius:14px;padding:15px;display:flex;gap:12px;align-items:flex-start;animation:cardIn .35s ease both}
.auth-sent .aic{width:34px;height:34px;border-radius:10px;background:var(--green-dot);color:#fff;display:grid;place-items:center;flex-shrink:0}
.auth-sent .aic svg{width:16px;height:16px}
.auth-sent b{font-size:13.5px;color:var(--green);display:block}
.auth-sent span{font-size:12px;color:#3D7A57;line-height:1.5;display:block;margin-top:2px}
.auth-note{margin-top:18px;padding-top:14px;border-top:1px solid var(--border-2);font-size:12px;color:var(--text-3);text-align:center;line-height:1.7}
.auth-note a{color:var(--brand);font-weight:600;text-decoration:none;cursor:pointer}
.auth-note a:hover{text-decoration:underline}
.auth-brandline{position:fixed;bottom:16px;left:0;right:0;text-align:center;font-size:11px;color:var(--text-3);font-weight:500;pointer-events:none}
.auth-brandline b{color:var(--text-2)}
.auth-brandline.brand-lockup{display:flex;align-items:center;justify-content:center;gap:9px;flex-wrap:wrap}
.auth-brandline.brand-lockup img{width:92px;height:auto;display:block}
.auth-brandline.brand-lockup .reverse{display:none}
html.dark .auth-brandline.brand-lockup .primary{display:none}
html.dark .auth-brandline.brand-lockup .reverse{display:block}
.casely24-logo{display:block;width:112px;height:auto;max-width:100%}
.casely24-symbol{display:block;width:30px;height:32px;object-fit:contain}
html.dark .casely24-logo.primary{display:none}
html:not(.dark) .casely24-logo.reverse{display:none}
.qr-public-terminal .switcher,.qr-public-terminal .proto{display:none!important}
.demo-strip{margin-top:20px;border-top:1px dashed var(--border);padding-top:15px}
.demo-strip .dt{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3);margin-bottom:4px;text-align:center}
.demo-strip a{
  display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:11px;
  border:1px solid var(--border);margin-top:7px;text-decoration:none;color:var(--text);
  transition:all .15s;background:#FDFDFE;
}
.demo-strip a:hover{border-color:#C8D2DF;transform:translateY(-1px);box-shadow:var(--shadow-sm)}
.demo-strip a .swa{width:30px;height:30px;border-radius:9px;color:#fff;display:grid;place-items:center;font-size:10.5px;font-weight:750;flex-shrink:0}
.demo-strip a b{display:block;font-size:12.5px;font-weight:650;color:var(--ink);line-height:1.25}
.demo-strip a span{font-size:11px;color:var(--text-3)}
.demo-strip a svg{margin-left:auto;width:14px;height:14px;color:var(--text-3);flex-shrink:0}

/* ============ Rapportér-flow (employee + QR) ============ */
.cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:4px 0 2px}
@media (max-width:760px){.cat-grid{grid-template-columns:repeat(2,1fr)}}
.cat-tile{
  border:1px solid var(--border);border-radius:14px;background:#FDFDFE;
  padding:15px 10px 12px;text-align:center;cursor:pointer;
  transition:all .16s ease;display:flex;flex-direction:column;align-items:center;gap:8px;
}
.cat-tile svg{width:20px;height:20px;color:var(--text-2);transition:color .15s}
.cat-tile b{font-size:12.5px;font-weight:650;color:var(--ink)}
.cat-tile:hover{border-color:#C8D2DF;transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.cat-tile.on{border-color:var(--brand);background:var(--brand-50);box-shadow:0 0 0 1px var(--brand)}
.cat-tile.on svg{color:var(--brand)}
.urg-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media (max-width:760px){.urg-row{grid-template-columns:1fr}}
.urg{border:1px solid var(--border);border-radius:13px;background:#fff;padding:12px 13px;text-align:left;cursor:pointer;transition:all .15s}
.urg b{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:650;color:var(--ink)}
.urg b i{width:9px;height:9px;border-radius:50%;background:var(--green-dot);flex-shrink:0}
.urg span{display:block;font-size:11px;color:var(--text-3);margin-top:3px;line-height:1.4}
.urg.soon b i{background:var(--amber-dot)}
.urg.acute b i{background:var(--red-dot)}
.urg:hover{border-color:#C8D2DF}
.urg.on{border-color:var(--green-dot);background:var(--green-bg);box-shadow:0 0 0 1px var(--green-dot)}
.urg.soon.on{border-color:var(--amber-dot);background:var(--amber-bg);box-shadow:0 0 0 1px var(--amber-dot)}
.urg.acute.on{border-color:var(--red-dot);background:var(--red-bg);box-shadow:0 0 0 1px var(--red-dot)}
.done-hero{text-align:center;padding:34px 22px 30px}
.done-check{
  width:64px;height:64px;border-radius:50%;background:var(--green-dot);color:#fff;
  display:grid;place-items:center;margin:0 auto 18px;
  box-shadow:0 0 0 10px var(--green-bg);
  animation:popIn .45s cubic-bezier(.34,1.4,.5,1) both;
}
.done-check svg{width:30px;height:30px}
@keyframes popIn{from{transform:scale(.4);opacity:0}to{transform:none;opacity:1}}
.done-hero h2{font-family:var(--font-display);font-size:22px;font-weight:750;letter-spacing:-.02em;color:var(--ink)}
.done-hero .did{margin-top:7px;font-size:13px;color:var(--text-2)}
.done-next{margin:22px auto 0;max-width:430px;text-align:left;border:1px solid var(--border);border-radius:14px;background:#FBFCFD;padding:6px 16px}
.done-next .dn{display:flex;gap:11px;align-items:flex-start;padding:10px 0;font-size:12.5px;color:var(--text-2);line-height:1.5}
.done-next .dn + .dn{border-top:1px solid var(--border-2)}
.done-next .dn .n{width:22px;height:22px;border-radius:50%;background:var(--brand-50);color:var(--brand);font-size:11px;font-weight:750;display:grid;place-items:center;flex-shrink:0}
.done-next .dn b{color:var(--ink);font-weight:650}
.done-act{display:flex;gap:9px;justify-content:center;margin-top:22px;flex-wrap:wrap}
.report-hero{
  border-radius:var(--r-lg);padding:22px 24px;color:#fff;position:relative;overflow:hidden;
  background:linear-gradient(135deg,#12579F,#0A3765);
  box-shadow:0 14px 34px -16px rgba(10,55,101,.55);
}
.report-hero::after{content:"";position:absolute;right:-60px;top:-70px;width:230px;height:230px;border-radius:50%;background:rgba(255,255,255,.07)}
.report-hero h2{font-family:var(--font-display);font-size:20px;font-weight:750;letter-spacing:-.02em}
.report-hero p{font-size:13px;color:rgba(255,255,255,.82);margin-top:5px;max-width:440px;line-height:1.55}
.report-hero .btn{margin-top:16px;background:#fff;color:var(--brand);box-shadow:0 2px 8px rgba(0,0,0,.18)}
.report-hero .btn:hover{background:#F2F6FB;transform:translateY(-1px)}
.faq details{border:1px solid var(--border);border-radius:12px;background:#fff;margin-bottom:8px;overflow:hidden}
.faq summary{list-style:none;cursor:pointer;padding:12px 15px;font-size:13px;font-weight:650;color:var(--ink);display:flex;align-items:center;gap:9px}
.faq summary::-webkit-details-marker{display:none}
.faq summary svg{width:14px;height:14px;color:var(--text-3);margin-left:auto;flex-shrink:0;transition:transform .2s}
.faq details[open] summary svg{transform:rotate(180deg)}
.faq .fa{padding:0 15px 13px;font-size:12.5px;color:var(--text-2);line-height:1.6}

/* ============ Provider console ============ */
.clients-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.client-card{
  background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);
  box-shadow:var(--shadow-sm);padding:16px 17px 14px;text-align:left;width:100%;cursor:pointer;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s;
  display:flex;flex-direction:column;gap:12px;
}
.client-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:#D5DBE4}
.cc-top{display:flex;align-items:center;gap:11px}
.cmark{
  width:40px;height:40px;border-radius:12px;color:#fff;flex-shrink:0;
  display:grid;place-items:center;font-family:var(--font-display);font-weight:800;font-size:14px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2);
}
.cc-top b{display:block;font-size:14.5px;font-weight:700;color:var(--ink);font-family:var(--font-display);letter-spacing:-.01em}
.cc-top .dom{font-size:11.5px;color:var(--text-3)}
.cc-top .chip{margin-left:auto}
.cstats{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;border-top:1px solid var(--border-2);padding-top:11px}
.cstat b{display:block;font-family:var(--font-display);font-size:16px;font-weight:750;color:var(--ink);font-variant-numeric:tabular-nums}
.cstat span{font-size:10px;color:var(--text-3);font-weight:600;letter-spacing:.02em}
.cstat.warn b{color:#B26205}
.cc-note{font-size:11.5px;color:var(--text-2);background:#F7F8FA;border:1px solid var(--border-2);border-radius:9px;padding:7px 10px;display:flex;align-items:center;gap:7px;line-height:1.4}
.cc-note svg{width:13px;height:13px;color:var(--amber-dot);flex-shrink:0}
.g-pan{grid-template-columns:1.7fr 130px 1.3fr 90px 90px 110px 40px}
.mini-portal{
  border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--bg);
  display:flex;height:236px;box-shadow:inset 0 1px 3px rgba(15,21,34,.05);
  --pv:#0E4A8C;
}
.mini-side{width:96px;background:#FBFBFC;border-right:1px solid var(--border-2);padding:9px 7px;display:flex;flex-direction:column;gap:3px;flex-shrink:0}
.mini-logo{display:flex;align-items:center;gap:5px;margin-bottom:7px}
.mini-mark{width:16px;height:16px;border-radius:5px;background:var(--pv);color:#fff;font-size:7px;font-weight:800;display:grid;place-items:center;flex-shrink:0}
.mini-name{font-size:7.5px;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:62px}
.mini-nav{height:9px;border-radius:4px;background:#EDEFF3;margin:2px 1px}
.mini-nav.on{background:color-mix(in srgb,var(--pv) 16%, white)}
.mini-main{flex:1;padding:9px 10px;display:flex;flex-direction:column;gap:7px;min-width:0}
.mini-top{display:flex;gap:5px;align-items:center}
.mini-search{flex:1;height:11px;border-radius:5px;background:#fff;border:1px solid var(--border-2)}
.mini-btn{width:36px;height:11px;border-radius:5px;background:var(--pv)}
.mini-hello{height:10px;width:46%;border-radius:4px;background:#E3E6EB;margin-top:2px}
.mini-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}
.mini-tile{height:34px;border-radius:6px;background:#fff;border:1px solid var(--border-2);border-left:2.5px solid var(--green-dot)}
.mini-tile.a{border-left-color:var(--amber-dot)}
.mini-tile.r{border-left-color:var(--red-dot)}
.mini-card{flex:1;border-radius:8px;background:#fff;border:1px solid var(--border-2);position:relative;overflow:hidden;min-height:36px}
.mini-card::before{content:"";position:absolute;top:0;left:0;right:0;height:2.5px;background:var(--pv)}
.swatches{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.swatch{
  width:32px;height:32px;border-radius:11px;cursor:pointer;position:relative;border:none;
  transition:transform .14s ease;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25), 0 1px 3px rgba(15,21,34,.18);
}
.swatch:hover{transform:translateY(-2px) scale(1.05)}
.swatch.on::after{content:"";position:absolute;inset:-5px;border-radius:14px;border:2px solid var(--ink)}
.conn-hero{
  border:1px solid var(--green-br);border-radius:var(--r-lg);
  background:linear-gradient(180deg,#FCFFFD,#F0FAF4);box-shadow:var(--shadow-sm);
  padding:18px;display:flex;gap:14px;align-items:center;flex-wrap:wrap;
}
.conn-hero .cic{
  width:46px;height:46px;border-radius:14px;background:var(--green-dot);color:#fff;
  display:grid;place-items:center;flex-shrink:0;box-shadow:0 6px 16px -6px rgba(34,165,94,.6);
}
.conn-hero .cic svg{width:22px;height:22px}
.conn-hero b{display:block;font-family:var(--font-display);font-size:16px;font-weight:750;color:var(--ink);letter-spacing:-.01em}
.conn-hero .cs{font-size:12.5px;color:var(--text-2);margin-top:2px}
.conn-hero .r{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
.feed{padding:4px 18px 12px}
.feedline{display:flex;gap:11px;align-items:flex-start;padding:10px 0;font-size:12.5px;color:var(--text-2);width:100%;text-align:left;line-height:1.45}
.feedline + .feedline{border-top:1px solid var(--border-2)}
.feedline .fic{width:24px;height:24px;border-radius:8px;background:#EFF1F5;color:var(--text-2);display:grid;place-items:center;flex-shrink:0;margin-top:1px}
.feedline .fic svg{width:12px;height:12px}
.feedline .fic.g{background:var(--green-bg);color:var(--green)}
.feedline .fic.b{background:var(--brand-50);color:var(--brand)}
.feedline .fic.a{background:var(--amber-bg);color:var(--amber)}
.feedline b{color:var(--ink);font-weight:650}
.feedline time{margin-left:auto;font-size:11px;color:var(--text-3);white-space:nowrap;padding-top:2px;flex-shrink:0}
.check-item{display:flex;gap:10px;align-items:center;padding:8px 0;font-size:12.5px;color:var(--text-2)}
.check-item + .check-item{border-top:1px solid var(--border-2)}
.check-item .ck{width:20px;height:20px;border-radius:50%;flex-shrink:0;display:grid;place-items:center}
.check-item.done .ck{background:var(--green-dot);color:#fff}
.check-item.done span{color:var(--text-3);text-decoration:line-through}
.check-item:not(.done) .ck{border:2px solid #C9D0DA;color:transparent}
.check-item .ck svg{width:10px;height:10px}
.kv .v code{font-family:ui-monospace,SFMono-Regular,monospace;font-size:11px;background:#F2F3F6;border:1px solid var(--border);padding:2px 7px;border-radius:6px;color:var(--text-2)}
.domrow{display:flex;align-items:center;gap:0;max-width:360px}
.domrow .f-input{flex:1;border-radius:10px 0 0 10px;border-right:none}
.domrow .suffix{
  height:36px;display:flex;align-items:center;padding:0 12px;
  background:#F7F8FA;border:1px solid var(--border);border-radius:0 10px 10px 0;
  font-size:12.5px;color:var(--text-3);font-weight:600;white-space:nowrap;
}

/* ============ Logo upload (brand) ============ */
.logo-drop{display:flex;align-items:center;gap:11px;flex-wrap:wrap}
.logo-drop .ld-txt{flex:1;min-width:130px}
.logo-drop .ld-txt b{display:block;font-size:12.5px;font-weight:650;color:var(--ink)}
.logo-drop .ld-txt span{font-size:11px;color:var(--text-3);line-height:1.4;display:block;margin-top:1px}
.cmark img{width:74%;height:74%;object-fit:contain;display:block}
.cmark.haslogo{background:#fff!important;border:1px solid var(--border)}
.mini-mark img{width:82%;height:82%;object-fit:contain;display:block}
.mini-mark.haslogo{background:#fff;border:1px solid var(--border-2)}
.logo-mark img{width:74%;height:74%;object-fit:contain;display:block}
.logo-mark.haslogo{background:#fff!important;border:1px solid var(--border);box-shadow:none}

/* ============ Standalone helpdesk ============ */
.g-tix{grid-template-columns:84px 1.2fr 1.7fr 160px 90px 120px 110px}
.g-esager{grid-template-columns:86px 1.6fr 1fr 170px 96px}
.sla-ok{color:var(--green);font-weight:650;font-size:12px}
.sla-warn{color:var(--amber);font-weight:650;font-size:12px}
.sla-breach{color:var(--red);font-weight:700;font-size:12px}
.sr-only{
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;
  overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}
.sla-summary{display:flex;flex-wrap:wrap;gap:5px 10px;margin-top:5px;line-height:1.35}
.sla-mini{font-size:10.5px;color:var(--text-3);font-weight:550}
.sla-mini b{font-weight:700;color:inherit}
.sla-mini.met{color:var(--green)}
.sla-mini.countdown{color:var(--brand)}
.sla-mini.paused{color:var(--amber)}
.sla-mini.breach{color:var(--red);font-weight:700}
.sla-card .rc-b{display:flex;flex-direction:column;gap:10px}
.sla-detail{display:grid;grid-template-columns:9px 1fr;gap:9px;align-items:start}
.sla-detail .sla-dot{width:8px;height:8px;border-radius:50%;background:var(--brand);margin-top:4px}
.sla-detail.met .sla-dot{background:var(--green-dot)}
.sla-detail.paused .sla-dot{background:var(--amber-dot)}
.sla-detail.breach .sla-dot{background:var(--red-dot)}
.sla-detail > span:last-child{min-width:0}
.sla-detail b{display:block;font-size:11.5px;color:var(--ink)}
.sla-detail > span:last-child > span{display:block;font-size:11px;color:var(--text-2);line-height:1.45;margin-top:2px}
.sla-detail.breach b,.sla-detail.breach > span:last-child > span{color:var(--red)}
.sla-detail.paused b{color:var(--amber)}
.sla-note{font-size:10.5px;color:var(--text-3);line-height:1.5;padding-top:8px;border-top:1px solid var(--border-2)}
.employee-home-case{grid-template-columns:86px minmax(0,1fr) 160px 96px}
.employee-case-list-row{grid-template-columns:86px minmax(0,1.6fr) minmax(110px,1fr) 170px 96px}
.itabs{display:flex;gap:6px;margin:0 0 8px 44px}
.itab{height:26px;padding:0 11px;border-radius:8px;font-size:11.5px;font-weight:650;border:1px solid var(--border);background:#fff;color:var(--text-2);transition:all .13s}
.itab.on{background:var(--ink);border-color:var(--ink);color:#fff}
.itab.on.notetab{background:var(--amber-dot);border-color:var(--amber-dot)}
.bubble.internal{background:var(--amber-bg);border-color:var(--amber-br)}
.int-label{font-size:9.5px;font-weight:750;letter-spacing:.06em;text-transform:uppercase;color:var(--amber);display:block;margin-bottom:3px}
.of-line{display:flex;gap:8px;margin-bottom:8px}
.of-line .f-input{flex:1;min-width:0}
.of-line .f-input.amt2{width:110px;flex:none;text-align:right;font-variant-numeric:tabular-nums}
.komp{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:6px;font-size:10.5px;font-weight:650;background:var(--brand-50);color:var(--brand);border:1px solid var(--brand-100);margin:1px 3px 1px 0}

/* ============ v1-full additions (CSAT, notif-matrix, compliance, dupe, AI) ============ */
.stars{display:flex;gap:2px}
.star{font-size:22px;line-height:1;color:#C9D0DA;cursor:pointer;transition:transform .12s,color .12s;background:none;border:none;padding:2px}
.star:hover{transform:scale(1.18)}
.star.on{color:var(--amber-dot)}
.csat-box{border:1px solid var(--border);border-radius:14px;background:var(--card);padding:12px 16px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-left:44px}
.csat-box b{font-size:13px;color:var(--ink)}
.csat-box .done{font-size:12.5px;color:var(--green);font-weight:650}
.nchip{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:999px;border:1px solid var(--border);background:var(--card);font-size:11px;font-weight:650;color:var(--text-3);cursor:pointer;transition:all .13s}
.nchip.on{background:var(--green-bg);border-color:var(--green-br);color:var(--green)}
.nchips{display:flex;gap:6px;flex-shrink:0}
.g-comp{grid-template-columns:1.4fr 1fr 1fr 1fr}
.g-audit{grid-template-columns:120px 1fr 1.8fr 110px 110px}
.g-plan{grid-template-columns:1.7fr 110px 1fr 120px 110px}
.dupe-warn{margin:10px 0 4px;display:flex;gap:10px;align-items:center;font-size:12.5px;color:var(--amber);font-weight:600;background:var(--amber-bg);border:1px solid var(--amber-br);padding:10px 13px;border-radius:11px;flex-wrap:wrap;line-height:1.45}
.dupe-warn svg{width:15px;height:15px;flex-shrink:0}
.dupe-warn .da{margin-left:auto;display:flex;gap:8px;flex-shrink:0}
.aibtn{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 11px;border-radius:8px;font-size:11.5px;font-weight:650;border:1px solid var(--brand-100);background:var(--brand-50);color:var(--brand);cursor:pointer;transition:all .13s}
.aibtn:hover{transform:translateY(-1px);box-shadow:var(--shadow-sm)}
.budgetline{margin:10px 18px 0;font-size:11.5px;color:var(--text-2)}
.budgetline b{color:var(--ink)}
.budgetline .bar-track{margin-top:5px;height:6px}
/* CapEx/OpEx kontering */
.capexline{margin:12px 18px 0;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;background:var(--bg);border:1px solid var(--border);border-radius:12px;padding:10px 12px}
.cx-l{display:flex;align-items:center;gap:9px;min-width:0}
.cx-l>div{display:flex;flex-direction:column;min-width:0}
.cx-l b{font-size:12.5px;color:var(--ink);font-weight:650}
.cx-l>div>span{font-size:11px;color:var(--text-3);line-height:1.4}
.cx-ic{color:var(--brand);flex-shrink:0;display:flex}
.cx-ic svg{width:16px;height:16px;display:block}
.cx-seg{display:inline-flex;background:var(--card);border:1px solid var(--border);border-radius:9px;padding:3px;gap:3px;flex-shrink:0}
.cx-opt{border:none;background:none;font:inherit;font-size:12px;font-weight:600;color:var(--text-2);padding:6px 12px;border-radius:7px;cursor:pointer;white-space:nowrap}
.cx-opt.on{background:var(--brand);color:#fff}
.cx-opt.cap.on{background:var(--amber);color:#fff}
html.dark .cx-opt.on{color:#0F1319}
.cx-inline{margin:10px 18px 0;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.cx-check{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:var(--ink);cursor:pointer}
.cx-check input{width:16px;height:16px;accent-color:var(--amber);cursor:pointer}
.cx-hint{font-size:11px;color:var(--text-3)}
/* buyer console: tabs, tender bids, segmented control, category chips, invite list */
.tabs{display:flex;gap:7px;margin-bottom:14px;flex-wrap:wrap}
.tab{border:1px solid var(--border);background:var(--card);color:var(--text-2);font:inherit;font-size:12.5px;font-weight:600;padding:7px 14px;border-radius:9px;cursor:pointer}
.tab.on{background:var(--ink);color:var(--card);border-color:var(--ink)}
html.dark .tab.on{color:#0F1319}
.m-act{display:flex;gap:9px;margin-top:16px;flex-wrap:wrap}
.bidgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;padding:14px 16px 18px}
.bidcard{border:1px solid var(--border);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:8px;background:var(--card)}
.bidcard.best{border-color:var(--green-br);background:var(--green-bg)}
.bidcard.pending{opacity:.92;border-style:dashed}
.bc-top{display:flex;align-items:center;gap:10px}
.bc-id{min-width:0;flex:1}
.bc-id b{display:block;font-size:13px;color:var(--ink);font-weight:650;line-height:1.2}
.bc-id span{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--text-3)}
.bc-flag{font-size:10px;font-weight:700;color:var(--green);background:var(--card);border:1px solid var(--green-br);padding:3px 7px;border-radius:20px;white-space:nowrap}
.bc-price{font-family:"Schibsted Grotesk",Inter,sans-serif;font-size:26px;font-weight:700;color:var(--ink);letter-spacing:-.01em;line-height:1}
.bc-price small{font-size:13px;font-weight:600;color:var(--text-3)}
.bc-note{font-size:12px;color:var(--text-2);line-height:1.5}
.bc-at{font-size:11px;color:var(--text-3)}
.bc-award{width:100%;justify-content:center;margin-top:2px}
.bc-wait{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--text-3);padding:6px 0}
.bc-wait svg{width:15px;height:15px;flex-shrink:0}
.rate{display:inline-flex;align-items:center;gap:3px;font-size:11.5px;font-weight:650;color:var(--amber)}
.rate svg{width:12px;height:12px}
.seg2{display:inline-flex;gap:4px;background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:4px}
.seg2b{border:none;background:none;font:inherit;font-size:12.5px;font-weight:600;color:var(--text-2);padding:7px 14px;border-radius:7px;cursor:pointer}
.seg2b.on{background:var(--card);color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.06)}
.chipwrap{display:flex;flex-wrap:wrap;gap:7px}
.pchip{border:1px solid var(--border);background:var(--card);color:var(--text-2);font:inherit;font-size:12px;font-weight:600;padding:6px 12px;border-radius:20px;cursor:pointer}
.pchip.on{background:var(--brand);color:#fff;border-color:var(--brand)}
html.dark .pchip.on{color:#0F1319}
.invlist{display:flex;flex-direction:column;gap:2px;max-height:280px;overflow:auto;margin-bottom:4px}
.invrow{display:flex;align-items:center;gap:10px;padding:9px 8px;border-radius:10px;cursor:pointer}
.invrow:hover{background:var(--bg)}
.invrow input{width:16px;height:16px;accent-color:var(--brand);flex-shrink:0}
.budget-copy-row .tt{display:flex;min-width:0;flex-direction:column;gap:2px}
.budget-copy-row .tt b{font-size:13px;line-height:1.25;color:var(--ink)}
.budget-copy-row .tt span{font-size:11.5px;line-height:1.4;color:var(--text-3)}
.budget-start-actions{gap:12px}
.approval-actions{display:flex;align-items:center;justify-content:flex-end;gap:6px;white-space:nowrap}
/* add-on hero (client "Leverandører" · own-subcontractors upsell) */
.addon-hero{display:flex;align-items:center;gap:14px;padding:14px 16px;border:1px solid var(--green-br);background:var(--green-bg);border-radius:14px;margin-bottom:14px}
.ah-ic{width:38px;height:38px;border-radius:11px;background:var(--card);display:flex;align-items:center;justify-content:center;color:var(--green);flex-shrink:0}
.ah-ic svg{width:20px;height:20px}
.ah-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ah-txt b{font-size:13px;color:var(--ink);font-weight:650}
.ah-txt>span{font-size:12px;color:var(--text-2);line-height:1.5}
/* accounting connect cards (standalone · Regnskabsintegration) */
.acct-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;padding:14px 18px 18px}
.acct-card{border:1px solid var(--border);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:10px;background:var(--card)}
.acct-top{display:flex;align-items:center;gap:11px}
.acct-logo{width:40px;height:40px;border-radius:11px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:15px;flex-shrink:0;letter-spacing:-.02em}
.acct-id b{display:block;font-size:13.5px;color:var(--ink);font-weight:650;line-height:1.15}
.acct-id span{font-size:11px;color:var(--text-3)}
.acct-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:2px}
.acct-status{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:var(--text-3)}
.acct-status.on{color:var(--green)}
.acct-status i{width:7px;height:7px;border-radius:50%;background:currentColor;display:inline-block}
/* filter bar (compact · sits under the toolbar/tabs of a list card) */
.filterbar{display:flex;align-items:center;gap:7px;padding:10px 14px;flex-wrap:wrap;border-top:1px solid var(--border-2)}
.tbl>.filterbar:first-child,.filterbar.flush{border-top:none}
.filterbar .ficon{display:inline-flex;color:var(--text-3);flex-shrink:0;margin-right:1px}
.filterbar .ficon svg{width:14px;height:14px;display:block}
.filterbar .fbl{font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--text-3);margin-right:1px}
.fsel{position:relative;display:inline-flex}
.fsel select{
  appearance:none;-webkit-appearance:none;-moz-appearance:none;
  height:31px;background:var(--card);border:1px solid var(--border);border-radius:8px;
  font:inherit;font-size:12px;font-weight:600;color:var(--text-2);
  padding:0 27px 0 11px;cursor:pointer;max-width:180px;
  box-shadow:var(--shadow-sm);transition:border-color .14s,color .14s,background .14s;
}
.fsel select:hover{border-color:#CBD6E4;color:var(--ink)}
.fsel select:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(14,74,140,.1)}
.fsel.act select{border-color:var(--brand);color:var(--brand);background:var(--brand-50);font-weight:650}
.fsel::after{content:"";position:absolute;right:11px;top:50%;transform:translateY(-70%) rotate(45deg);width:5px;height:5px;border-right:1.7px solid var(--text-3);border-bottom:1.7px solid var(--text-3);pointer-events:none;transition:border-color .14s}
.fsel.act::after{border-color:var(--brand)}
html.dark .fsel select:hover{border-color:#3A4556}
html.dark .fsel.act select{background:rgba(91,150,224,.14)}
html.dark .fsel select:focus{box-shadow:0 0 0 3px rgba(91,150,224,.12)}
/* toggle-style filter chip (e.g. tags, quick booleans) */
.fchip{display:inline-flex;align-items:center;gap:6px;height:31px;padding:0 11px;border-radius:8px;border:1px solid var(--border);background:var(--card);box-shadow:var(--shadow-sm);font-size:12px;font-weight:600;color:var(--text-2);cursor:pointer;transition:border-color .14s,color .14s,background .14s;white-space:nowrap}
.fchip:hover{border-color:#CBD6E4;color:var(--ink)}
.fchip .fdot{width:8px;height:8px;border-radius:3px;flex-shrink:0}
.fchip.act{border-color:var(--brand);color:var(--brand);background:var(--brand-50)}
html.dark .fchip:hover{border-color:#3A4556}
html.dark .fchip.act{background:rgba(91,150,224,.14)}
.fclear{border:none;background:none;font:inherit;font-size:12px;font-weight:650;color:var(--brand);cursor:pointer;padding:6px 9px;border-radius:7px}
.fclear:hover{background:var(--brand-50)}
html.dark .fclear:hover{background:rgba(91,150,224,.14)}
.fcount{margin-left:auto;font-size:11.5px;font-weight:600;color:var(--text-3);font-variant-numeric:tabular-nums;padding-left:6px;white-space:nowrap}

/* ============ Dark theme (html.dark) ============ */
html.dark{
  --brand:#5B96E0; --brand-600:#6BA3E8; --brand-700:#7FB1EE;
  --brand-100:#1D3352; --brand-50:#152840;
  --ink:#F1F5FA; --text:#D8DFE9; --text-2:#9AA6B7; --text-3:#8A96A8; /* audit: kontrastløft i mørkt tema */
  --bg:#0F1319; --card:#171C24; --border:#252D39; --border-2:#1E2530;
  --green:#5BD48E; --green-bg:#0F2818; --green-br:#1E4A2E;
  --amber:#E8B04B; --amber-bg:#2A2110; --amber-br:#4A3A17;
  --red:#F07566; --red-bg:#2C1614; --red-br:#543029;
  --shadow-sm:0 1px 2px rgba(0,0,0,.4);
  --shadow-md:0 1px 2px rgba(0,0,0,.4), 0 10px 30px -14px rgba(0,0,0,.6);
  --shadow-lg:0 2px 4px rgba(0,0,0,.5), 0 24px 60px -24px rgba(0,0,0,.8);
}
html.dark body{background:var(--bg)}
html.dark .side{background:#12161E}
html.dark .nav-item:hover,html.dark .side-user:hover{background:#1B212C}
html.dark .topbar{background:rgba(15,19,25,.86)}
html.dark .search:hover{background:#1B212C;border-color:#334052}
html.dark .search kbd{background:#12161E;border-color:var(--border)}
html.dark .pill.on{color:#0F1319}
html.dark .itab.on{color:#0F1319}
html.dark .itab.on.notetab{color:#fff}
html.dark .sw-btn{color:#0F1319}
html.dark .store{background:#171C24}
html.dark .store.amber{background:#221D11}
html.dark .store.red{background:#251512}
html.dark .trow-h{background:#131820}
html.dark button.trow:hover{background:#1B212C}
html.dark .t-search{background:#12161E}
html.dark .t-search:focus-within{background:#171C24;border-color:#33507A;box-shadow:0 0 0 3px rgba(91,150,224,.12)}
html.dark .f-input{background:#12161E;border-color:var(--border);color:var(--text)}
html.dark .f-input:focus{border-color:#33507A;box-shadow:0 0 0 3px rgba(91,150,224,.12)}
html.dark .composer{background:#171C24}
html.dark .composer:focus-within{border-color:#33507A;box-shadow:0 0 0 3px rgba(91,150,224,.12)}
html.dark .composer input{color:var(--text)}
html.dark .revision-box textarea{background:#12161E;color:var(--text);border-color:var(--border)}
html.dark .tgl{background:#2A3240}
html.dark .radio-pill,html.dark .cat-tile,html.dark .urg,html.dark .faq details{background:#171C24}
html.dark .cat-tile:hover,html.dark .radio-pill:hover,html.dark .urg:hover{border-color:#3A455699}
html.dark .appr-card{background:linear-gradient(180deg,#241D0E,#1E180B)}
html.dark .appr-empty{background:#141922}
html.dark .offer{background:linear-gradient(180deg,#171C24,#151E2C)}
html.dark .cmd{background:rgba(23,28,36,.97);border-color:rgba(255,255,255,.06)}
html.dark .cmd-in input{color:var(--ink)}
html.dark .citem .ci{background:#202734;border-color:var(--border)}
html.dark .citem.sel{background:var(--brand-50)}
html.dark .toast{background:#EAF0F7;color:#0F1319}
html.dark .proto{background:rgba(23,28,36,.85);border-color:var(--border)}
html.dark .doc .dic,html.dark .rolechip,html.dark .case-id,html.dark .step .ic,html.dark .sysline .sic{background:#202734;border-color:var(--border)}
html.dark .step .ic{border-color:#202734}
html.dark .step.done .ic{background:var(--green-dot);border-color:var(--green-dot)}
html.dark .step.cur .ic{background:#171C24}
html.dark .tag.med{background:#3A2E12;color:#E8B04B}
html.dark .tag.hoj{background:#3A211A;color:#F08A66}
html.dark .tag.lav{background:#202734;color:var(--text-2)}
html.dark .bar-track{background:#222938}
html.dark .hi::before{background:#171C24}
html.dark .hi.ok::before{background:var(--green-dot)}
html.dark .cbtn{background:#171C24}
html.dark .cbtn:hover{background:var(--brand-50)}
html.dark .conn-hero{background:linear-gradient(180deg,#12251A,#0F2016)}
html.dark .cc-note{background:#1A202B}
html.dark .kpi.k-red{background:linear-gradient(180deg,#171C24,#241517)}
html.dark .demo-strip a{background:#171C24}
html.dark .demo-strip a:hover{border-color:#3A4556}
html.dark .done-next{background:#141922}
html.dark .domrow .suffix{background:#1A202B}
html.dark .feedline .fic{background:#202734}
html.dark .btn-ghost{background:#1B212C;border-color:var(--border);color:var(--text)}
html.dark .btn-ghost:hover{background:#222938;border-color:#3A4556}
html.dark .btn-danger{background:#1B212C;border-color:var(--border)}
html.dark .btn-danger:hover{background:var(--red-bg);border-color:var(--red-br)}
html.dark .btn-primary{background:#2D6CB8}
html.dark .btn-primary:hover{background:#3B7CC9}
html.dark .icon-btn:hover{background:#1B212C;border-color:var(--border)}
html.dark .back:hover{background:#1B212C}
html.dark .pill{background:#171C24}
html.dark .csat-box,html.dark .nchip{background:#171C24}
html.dark .nchip.on{background:var(--green-bg)}
html.dark .star{color:#3A4556}
html.dark .star.on{color:var(--amber-dot)}
html.dark ::selection{background:#2A4A73}
html.dark .auth-wrap{background:radial-gradient(52% 44% at 10% 0%, rgba(91,150,224,.10), transparent 60%),radial-gradient(44% 40% at 100% 100%, rgba(34,165,94,.06), transparent 60%),var(--bg)}
/* the mini portal preview stays LIGHT on purpose: it previews the customer's portal */

/* ============ Responsive pass ============ */
.icon-btn.menu{display:none}
.scrim{position:fixed;inset:0;background:rgba(15,21,34,.42);z-index:195;opacity:0;pointer-events:none;transition:opacity .2s}
.scrim.show{opacity:1;pointer-events:auto}

@media (max-width:920px){
  .side{
    position:fixed;left:0;top:0;bottom:0;height:100dvh;z-index:220;
    width:min(280px,84vw);
    transform:translateX(-105%);
    transition:transform .28s cubic-bezier(.22,.9,.3,1);
    box-shadow:none;
  }
  .side.open{transform:none;box-shadow:var(--shadow-lg)}
  .icon-btn.menu{display:grid}
  .topbar{padding:0 12px;gap:8px}
  .content{padding:18px 14px 96px}
  .search{width:auto;flex:1;min-width:0}
  .search kbd{display:none}
  .search .ph{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}

@media (max-width:820px){
  /* tables: keep the essentials, drop secondary columns */
  .g-sager{grid-template-columns:76px 1.5fr 140px}
  .g-sager > :nth-child(3),.g-sager > :nth-child(4),.g-sager > :nth-child(6),.g-sager > :nth-child(7){display:none}
  .g-fakt{grid-template-columns:88px 1fr 92px 104px}
  .g-fakt > :nth-child(2),.g-fakt > :nth-child(4){display:none}
  .g-brugere{grid-template-columns:2fr 1fr 40px}
  .g-brugere > :nth-child(3),.g-brugere > :nth-child(4){display:none}
  .g-afd{grid-template-columns:1.6fr 118px 40px}
  .g-afd > :nth-child(3),.g-afd > :nth-child(4),.g-afd > :nth-child(5){display:none}
  .g-pan{grid-template-columns:1.7fr 118px 90px 40px}
  .g-pan > :nth-child(3),.g-pan > :nth-child(4),.g-pan > :nth-child(5){display:none}
  .g-tix{grid-template-columns:80px 1.6fr 150px}
  .g-tix > :nth-child(2),.g-tix > :nth-child(5),.g-tix > :nth-child(6),.g-tix > :nth-child(7){display:none}
  .g-esager{grid-template-columns:80px 1.5fr 150px}
  .g-esager > :nth-child(3),.g-esager > :nth-child(5){display:none}
  .g-comp{grid-template-columns:1.4fr 1fr}
  .g-comp > :nth-child(3),.g-comp > :nth-child(4){display:none}
  .g-audit{grid-template-columns:110px 1.6fr}
  .g-audit > :nth-child(2),.g-audit > :nth-child(4),.g-audit > :nth-child(5){display:none}
  .g-plan{grid-template-columns:1.6fr 120px}
  .g-plan > :nth-child(2),.g-plan > :nth-child(3),.g-plan > :nth-child(5){display:none}
}

@media (max-width:640px){
  .kpis{grid-template-columns:repeat(2,1fr)!important;gap:10px;margin-bottom:16px}
  .kpi{padding:13px 14px 12px}
  .kpi .val{font-size:25px}
  .page-head{flex-direction:column;align-items:flex-start;gap:10px;margin-bottom:16px}
  .page-head h1{font-size:22px}
  .case-head h1{font-size:19px}
  .topbar .btn-primary .bl{display:none}
  .topbar .btn-primary{padding:0 12px}
  .f-2col{grid-template-columns:1fr}
  .stores{grid-template-columns:repeat(auto-fill,minmax(142px,1fr));gap:8px;padding:12px 12px 14px}
  .clients-grid{grid-template-columns:1fr}
  .split2{gap:12px}
  .set-grid{gap:12px}
  .auth-card{padding:24px 20px 20px}
  .auth-card.wide{padding:22px 16px 18px}
  .cat-grid{grid-template-columns:repeat(2,1fr)}
  .report-hero{padding:18px 18px 20px}
  .stepper{padding:13px 10px 11px}
  .step{min-width:76px}
  .thread .ev .avatar{width:28px;height:28px;font-size:10px}
  .sysline{padding-left:38px}
  .sysline .sic{margin-left:-28px}
  .offer,.composer{margin-left:0}
  .itabs{margin-left:0}
  .rev-note{margin-left:0!important}
  .ov-cmd{padding-top:7vh}
  .m-ov{padding:10px}
  .modal{border-radius:16px}
  .oact .right{width:100%;margin-left:0}
  .conn-hero .r{margin-left:0;width:100%}
  .done-act{flex-direction:column;align-items:stretch}
  .proto{display:none}
  .switcher{display:none!important}
  .employee-home-case,.employee-case-list-row,.branch-case-row{
    grid-template-columns:70px minmax(0,1fr)!important;
    gap:8px 10px;align-items:start;padding:12px;
  }
  .employee-home-case > .tid,.employee-case-list-row > .tid,.branch-case-row > .tid{grid-column:1;grid-row:1}
  .employee-home-case > .tt,.employee-case-list-row > .tt,.branch-case-row > .tt{grid-column:2;grid-row:1}
  .employee-home-case > .case-row-priority{grid-column:1;grid-row:2}
  .employee-home-case > .case-row-status{grid-column:2;grid-row:2}
  .employee-case-list-row > .mut2{grid-column:2;grid-row:2}
  .employee-case-list-row > .case-row-priority{grid-column:1;grid-row:3}
  .employee-case-list-row > .case-row-status{grid-column:2;grid-row:3}
  .branch-case-row > :nth-child(3){grid-column:2;grid-row:2}
  .branch-case-row > :nth-child(4){grid-column:1;grid-row:2}
  .overview-tender-row{
    grid-template-columns:minmax(0,1fr) auto!important;
    padding:10px 12px;align-items:start;
  }
  .overview-tender-row>:nth-child(3),.overview-tender-row>:nth-child(4){display:none}
  .approval-row{
    grid-template-columns:minmax(0,1fr) auto!important;
    padding:10px 12px;align-items:start;
  }
  .approval-row>.tt{grid-column:1/3;grid-row:1}
  .approval-row>.mut{grid-column:1;grid-row:2}
  .approval-row>.mut2{grid-column:2;grid-row:2;text-align:right}
  .approval-row>.approval-actions{grid-column:1/3;grid-row:3;justify-content:flex-start;width:auto}
  .branch-service-row{
    grid-template-columns:minmax(0,1fr) auto!important;
    padding:10px 12px;align-items:start;
  }
  .branch-service-row>.tt{grid-column:1/3;grid-row:1}
  .branch-service-row>.mut{grid-column:1;grid-row:2}
  .branch-service-row>.mut2{grid-column:2;grid-row:2;text-align:right}
  .branch-service-row>.chip{grid-column:1/3;grid-row:3;justify-self:start}
  .sla-summary{gap:3px 8px}
  .sla-mini{width:100%}
}

/* ============ Tags (labels on tickets/tasks) ============ */
.tagrow{display:flex;flex-wrap:wrap;gap:5px;align-items:center}
.ttag{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 9px;border-radius:7px;font-size:11px;font-weight:650;line-height:1;white-space:nowrap;
  background:color-mix(in srgb,var(--tc,#5A6474) 13%,transparent);
  color:var(--tc,#5A6474);
  border:1px solid color-mix(in srgb,var(--tc,#5A6474) 26%,transparent)}
.ttag .tdot{width:7px;height:7px;border-radius:2px;background:var(--tc,#5A6474);flex-shrink:0}
.ttag.rm{padding-right:4px}
.ttag .tx{display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border-radius:4px;cursor:pointer;opacity:.65}
.ttag .tx:hover{opacity:1;background:color-mix(in srgb,var(--tc,#5A6474) 22%,transparent)}
.ttag .tx svg{width:9px;height:9px}
.tag-add{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 9px;border-radius:7px;border:1px dashed var(--border);background:none;color:var(--text-3);font:inherit;font-size:11px;font-weight:600;cursor:pointer;transition:border-color .13s,color .13s}
.tag-add:hover{border-color:var(--brand);color:var(--brand)}
.tag-add svg{width:10px;height:10px}
/* tag option (used in the tag picker + tag manager) */
.tagopt{display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 12px;border-radius:9px;font:inherit;font-size:12px;font-weight:600;cursor:pointer;transition:all .13s;
  background:var(--card);color:var(--tc,#5A6474);border:1px solid color-mix(in srgb,var(--tc,#5A6474) 30%,transparent)}
.tagopt .tdot{width:9px;height:9px;border-radius:3px;background:var(--tc,#5A6474);flex-shrink:0}
.tagopt .tk{width:15px;display:inline-flex}.tagopt .tk svg{width:13px;height:13px}
.tagopt.on{background:color-mix(in srgb,var(--tc,#5A6474) 14%,transparent)}
.tagopt:hover{filter:brightness(.99);border-color:var(--tc,#5A6474)}
.tagmgr-row{display:grid;grid-template-columns:1fr 120px 40px;gap:10px;align-items:center;padding:9px 2px;font-size:12.5px}
.tagmgr-row + .tagmgr-row{border-top:1px solid var(--border-2)}
.swatchpick{display:flex;gap:7px;flex-wrap:wrap}
.swatchpick .sw{width:24px;height:24px;border-radius:7px;cursor:pointer;border:2px solid transparent;position:relative}
.swatchpick .sw.on{border-color:var(--ink);box-shadow:0 0 0 2px var(--card) inset}

/* ============ Activity log (audit timeline) ============ */
.actlog{padding:8px 4px 4px}
.act-item{display:grid;grid-template-columns:24px 1fr;gap:11px;position:relative;padding:0 0 15px}
.act-item::before{content:"";position:absolute;left:11px;top:25px;bottom:-1px;width:1.5px;background:var(--border-2)}
.act-item:last-child{padding-bottom:2px}
.act-item:last-child::before{display:none}
.act-ic{width:24px;height:24px;border-radius:8px;background:#EFF1F5;color:var(--text-2);display:grid;place-items:center;z-index:1}
.act-ic svg{width:12px;height:12px}
.act-ic.g{background:var(--green-bg);color:var(--green)}
.act-ic.b{background:var(--brand-50);color:var(--brand)}
.act-ic.a{background:var(--amber-bg);color:var(--amber)}
.act-ic.r{background:var(--red-bg);color:var(--red)}
.act-b{font-size:12.5px;color:var(--text-2);line-height:1.5;padding-top:3px;min-width:0}
.act-b b{color:var(--ink);font-weight:650}
.act-t{display:block;font-size:11px;color:var(--text-3);margin-top:1px}
html.dark .act-ic{background:#202734}

/* ============ Stats (breakdowns) ============ */
.statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.donutwrap{display:flex;align-items:center;gap:18px;padding:14px 18px 18px;flex-wrap:wrap}
.donut{position:relative;width:118px;height:118px;border-radius:50%;display:grid;place-items:center;flex-shrink:0}
.donut::before{content:"";position:absolute;inset:15px;border-radius:50%;background:var(--card)}
.donut .dnum{position:relative;font-family:var(--font-display);font-weight:750;font-size:21px;color:var(--ink);line-height:1;text-align:center}
.donut .dsub{position:relative;font-size:10px;color:var(--text-3);margin-top:3px;text-align:center}
.legend{display:flex;flex-direction:column;gap:10px;flex:1;min-width:130px}
.leg{display:flex;align-items:center;gap:9px;font-size:12.5px}
.leg .lg-dot{width:11px;height:11px;border-radius:3px;flex-shrink:0}
.leg .lg-l{color:var(--text-2)}
.leg .lg-n{margin-left:auto;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.leg .lg-s{font-size:11px;color:var(--text-3);margin-left:6px;font-weight:500}
.stat-tile{border:1px solid var(--border);border-radius:13px;background:var(--card);padding:13px 15px}
.stat-tile .st-l{font-size:11.5px;color:var(--text-2);font-weight:600}
.stat-tile .st-v{font-family:var(--font-display);font-weight:750;font-size:22px;color:var(--ink);margin-top:5px;font-variant-numeric:tabular-nums}
.stat-tile .st-f{font-size:11px;color:var(--text-3);margin-top:3px}
.bar-fill.cx{background:linear-gradient(90deg,#F3B13C,#DB8E08)}
.bar-fill.pur{background:linear-gradient(90deg,#9A7BE0,#6D3FB8)}
.bar-row .bl.strong{color:var(--ink);font-weight:600}

/* ============ Per-subcontractor isolation (buyer task) ============ */
.subswitch{display:flex;gap:6px;flex-wrap:wrap;padding:0 0 12px}
.subtab{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 7px;border-radius:10px;border:1px solid var(--border);background:var(--card);cursor:pointer;font:inherit;font-size:12.5px;font-weight:600;color:var(--text-2);transition:all .14s}
.subtab .st-av{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;color:#fff;font-size:9px;font-weight:700;flex-shrink:0}
.subtab .st-m{display:flex;flex-direction:column;line-height:1.25;text-align:left}
.subtab .st-bid{font-size:10.5px;color:var(--text-3);font-weight:600}
.subtab.on{border-color:var(--brand);background:var(--brand-50);color:var(--ink)}
.subtab.on .st-bid{color:var(--brand)}
.subtab:hover{border-color:#CBD6E4}
.subtab .st-badge{width:7px;height:7px;border-radius:50%;background:var(--amber-dot);flex-shrink:0}
.privhead{display:flex;align-items:center;gap:9px;font-size:11.5px;color:var(--text-3);background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:9px 12px;margin-bottom:12px;line-height:1.45}
.privhead svg{width:15px;height:15px;flex-shrink:0;color:var(--text-3)}
.privhead b{color:var(--text-2);font-weight:650}

/* ============ Helpdesk parity (collision · followers · bulk · merge) ============ */
.viewing{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:650;color:var(--amber);background:var(--amber-bg);border:1px solid var(--amber-br);border-radius:999px;padding:3px 10px 3px 3px}
.viewing .vw-av{width:18px;height:18px;border-radius:50%;background:var(--amber-dot);color:#fff;display:grid;place-items:center;font-size:8px;font-weight:700}
.viewing svg{width:12px;height:12px}
.follstack{display:flex;align-items:center;padding-left:6px}
.follstack .avatar{margin-left:-7px;border:2px solid var(--card);width:27px;height:27px;font-size:9.5px}
.follstack .fmore{margin-left:-7px;width:27px;height:27px;border-radius:50%;border:2px solid var(--card);background:#EDF0F4;color:var(--text-2);display:grid;place-items:center;font-size:10px;font-weight:700}
html.dark .follstack .fmore{background:#202734}
.bulkbar{display:flex;align-items:center;gap:11px;padding:9px 14px;background:var(--ink);color:#fff;border-radius:11px;margin-bottom:10px;animation:rise .3s both}
.bulkbar .bk-n{font-weight:700}
.bulkbar .bk-act{display:flex;gap:7px;margin-left:auto;flex-wrap:wrap}
.bulkbar .bkbtn{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-radius:8px;font:inherit;font-size:12px;font-weight:600;cursor:pointer;background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.18)}
.bulkbar .bkbtn:hover{background:rgba(255,255,255,.2)}
.bulkbar .bkbtn svg{width:12px;height:12px}
html.dark .bulkbar{background:#202734;border:1px solid var(--border)}
.rowcheck{width:16px;height:16px;accent-color:var(--brand);cursor:pointer;flex-shrink:0}
.linkline{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-2);padding:7px 11px;border:1px solid var(--border);border-radius:9px;background:var(--bg);margin-bottom:8px}
.linkline svg{width:13px;height:13px;color:var(--text-3);flex-shrink:0}
.linkline b{color:var(--ink);font-weight:650}
.linkline .ll-x{margin-left:auto;color:var(--text-3);cursor:pointer;display:inline-flex}
.linkline .ll-x svg{width:12px;height:12px}
/* clickable div-rows (bulk select) */
.trow.pick{cursor:pointer}
.trow.pick:hover{background:#F8F9FB}
html.dark .trow.pick:hover{background:#1B212C}
.trow.pick.on{background:var(--brand-50)}
html.dark .trow.pick.on{background:rgba(91,150,224,.10)}
.tidcell{display:flex;align-items:center;gap:9px}
.tidcell .rowcheck{margin:0}
.savedrow{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:0 0 2px}
.pill.saved i{width:7px;height:7px;border-radius:2px;margin-right:5px;display:inline-block}
.pill.ghostpill{background:none;border-style:dashed;color:var(--text-3);display:inline-flex;align-items:center;gap:5px}
.pill.ghostpill:hover{color:var(--brand);border-color:var(--brand)}
.pill svg{width:13px;height:13px;flex-shrink:0;vertical-align:-2px}
/* status control on the ticket (this is where status is changed) */
.statuspick{position:relative;display:inline-flex;align-items:center;gap:6px;height:27px;padding-left:11px;border-radius:999px;border:1px solid var(--border);background:var(--card);color:var(--text-2)}
.statuspick i.d{width:7px;height:7px;border-radius:50%;background:currentColor;flex-shrink:0}
.statuspick select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background:none;border:none;font:inherit;font-size:12px;font-weight:650;color:inherit;padding:0 25px 0 5px;height:27px;cursor:pointer}
.statuspick select:focus{outline:none}
.statuspick::after{content:"";position:absolute;right:11px;top:50%;transform:translateY(-62%) rotate(45deg);width:5px;height:5px;border-right:1.7px solid currentColor;border-bottom:1.7px solid currentColor;pointer-events:none;opacity:.65}
.statuspick:hover{filter:brightness(.985)}
.statuspick.s-progress,.statuspick.s-planned{color:var(--brand);background:var(--brand-50);border-color:var(--brand-100)}
.statuspick.s-open,.statuspick.s-approval{color:var(--amber);background:var(--amber-bg);border-color:var(--amber-br)}
.statuspick.s-waiting,.statuspick.s-onhold{color:var(--text-2);background:#F2F3F6;border-color:var(--border)}
.statuspick.s-solved{color:var(--green);background:var(--green-bg);border-color:var(--green-br)}
html.dark .statuspick.s-waiting,html.dark .statuspick.s-onhold{background:#202734}

/* ============================================================
   AUDIT ROUND 2026-07-23 · shared foundation
   ============================================================ */

/* Skip link (a11y) */
.skiplink{position:fixed;top:-48px;left:14px;z-index:200;background:var(--ink);color:var(--card);font-size:12.5px;font-weight:700;padding:9px 15px;border-radius:0 0 10px 10px;transition:top .15s ease;text-decoration:none}
.skiplink:focus-visible{top:0;outline:2px solid var(--brand);outline-offset:2px}

/* Reduced motion: sluk indløbs- og pulsanimationer */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
}

/* Touch targets på grove pegeredskaber */
@media (pointer: coarse){
  .btn.sm,.cbtn,.fsel select,.tab,.seg2 button,.attach,.send{min-height:44px}
  .nav-item{min-height:44px}
}

/* Inline feltvalidering */
.f-err{display:flex;align-items:center;gap:6px;font-size:11.5px;font-weight:650;color:var(--red);margin-top:5px;line-height:1.35}
.f-err svg{width:12px;height:12px;flex-shrink:0}
.f-input.err{border-color:var(--red) !important;box-shadow:0 0 0 3px rgba(199,74,58,.12)}
html.dark .f-input.err{box-shadow:0 0 0 3px rgba(240,117,102,.14)}

/* Truthful labelling: simuleret vs. roadmap */
.simtag{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:750;letter-spacing:.05em;text-transform:uppercase;color:var(--amber);background:var(--amber-bg);border:1px solid var(--amber-br);border-radius:6px;padding:2px 7px;vertical-align:2px}
.roadtag{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:750;letter-spacing:.05em;text-transform:uppercase;color:var(--text-3);background:none;border:1px dashed var(--border);border-radius:6px;padding:2px 7px;vertical-align:2px}
.roadcard{opacity:.72}
.roadcard:hover{opacity:1}

/* Vedhæftnings-chips (foto i indmeldingsflows) */
.attach-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.attach-chip{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:650;color:var(--text);background:var(--brand-50);border:1px solid var(--brand-100);border-radius:9px;padding:6px 8px 6px 10px;max-width:240px}
.attach-chip svg{width:13px;height:13px;color:var(--brand);flex-shrink:0}
.attach-chip b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:650}
.attach-chip .rm{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border:none;background:none;color:var(--text-3);cursor:pointer;border-radius:5px;font-size:13px;line-height:1}
.attach-chip .rm:hover{background:rgba(0,0,0,.07);color:var(--red)}

/* Not-found side */
.nf-wrap{max-width:520px;margin:60px auto 0;text-align:center}
.nf-code{font-family:var(--font-display);font-size:46px;font-weight:800;color:var(--text-3);letter-spacing:.02em}
.nf-wrap h1{margin:6px 0 8px}
.nf-wrap p{font-size:13.5px;color:var(--text-2);line-height:1.6;margin:0 0 18px}

/* Økonomi-ordforråd · legend + stacked budget-bar */
.fin-legend{display:flex;gap:14px;flex-wrap:wrap;font-size:11.5px;color:var(--text-2);align-items:center}
.fin-legend i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.bgt-bar{position:relative;height:14px;border-radius:7px;background:var(--border-2);overflow:hidden;display:flex}
.bgt-bar .seg{height:100%}
.bgt-bar .seg.actual{background:var(--brand)}
.bgt-bar .seg.commit{background:var(--brand);opacity:.45}
.bgt-bar .seg.forecast{background:repeating-linear-gradient(-45deg,var(--amber-dot) 0 4px,transparent 4px 8px);opacity:.75}
.bgt-bar.over{box-shadow:0 0 0 1.5px var(--red)}
.bgt-row{display:grid;grid-template-columns:minmax(120px,1.2fr) 2fr 110px;gap:12px;align-items:center;padding:9px 18px;border-top:1px solid var(--border-2);font-size:12.5px}
.bgt-row:first-child{border-top:none}
.bgt-row .bl{font-weight:650;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bgt-row .bl span{display:block;font-weight:500;font-size:11px;color:var(--text-3)}
.bgt-row .bv{text-align:right;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.bgt-row .bv small{display:block;font-weight:550;font-size:10.5px;color:var(--text-3)}
.bgt-row.over .bv{color:var(--red)}

/* Budget-KPI'er med præcise begreber */
.finkpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.finkpi .fk{background:var(--card);border:1px solid var(--border);border-radius:13px;padding:12px 14px}
.finkpi .fk .l{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-3);display:flex;align-items:center;gap:6px}
.finkpi .fk .l i{width:8px;height:8px;border-radius:3px;display:inline-block;flex-shrink:0}
.finkpi .fk .v{font-family:var(--font-display);font-size:19px;font-weight:750;color:var(--ink);margin-top:5px;font-variant-numeric:tabular-nums}
.finkpi .fk .v small{font-size:11.5px;font-weight:600;color:var(--text-3)}
.finkpi .fk .f{font-size:11px;color:var(--text-3);margin-top:3px;line-height:1.4}
.finkpi .fk.neg .v{color:var(--red)}

/* Definition-tooltips på metrikker */
.defhint{position:relative;display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border-radius:50%;border:1px solid var(--border);color:var(--text-3);font-size:9.5px;font-weight:800;cursor:help;vertical-align:1px;margin-left:5px}
.defhint:hover::after,.defhint:focus-visible::after{content:attr(data-def);position:absolute;bottom:calc(100% + 7px);left:50%;transform:translateX(-50%);width:230px;background:var(--ink);color:var(--card);font-size:11px;font-weight:550;line-height:1.5;padding:9px 11px;border-radius:9px;z-index:60;box-shadow:var(--shadow-lg);text-transform:none;letter-spacing:0;white-space:normal;text-align:left}
html.dark .defhint:hover::after,html.dark .defhint:focus-visible::after{background:#E8EDF4;color:#1A212B}

/* Kilde & friskhed-linje under rapporter */
.srcline{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--text-3);padding:10px 18px;border-top:1px dashed var(--border)}
.srcline svg{width:12px;height:12px;flex-shrink:0}

/* Fakturadetalje-modal */
.inv-lines{border:1px solid var(--border);border-radius:11px;overflow:hidden;margin:10px 0 4px}
.inv-line{display:grid;grid-template-columns:1fr 90px 110px;gap:10px;padding:9px 13px;font-size:12.5px;border-top:1px solid var(--border-2);align-items:center}
.inv-line:first-child{border-top:none}
.inv-line .t{font-weight:600;color:var(--text)}
.inv-line .t span{display:block;font-weight:500;font-size:11px;color:var(--text-3)}
.inv-line .a{text-align:right;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.inv-line.sum{background:var(--bg);font-weight:750}

/* Historik/audit-blok i modaler */
.audit-line{display:flex;gap:9px;font-size:12px;color:var(--text-2);padding:7px 0;border-top:1px dashed var(--border-2);line-height:1.5}
.audit-line:first-child{border-top:none}
.audit-line .when{flex-shrink:0;font-weight:650;color:var(--text-3);width:88px}

/* Kategori-manager (buyer) */
.catrow{display:grid;grid-template-columns:minmax(140px,1.4fr) 1fr 120px 120px;gap:12px;align-items:center;padding:10px 18px;border-top:1px solid var(--border-2);font-size:12.5px}
.catrow:first-child{border-top:none}
.catrow.archived{opacity:.55}
.catrow .cn{display:flex;align-items:center;gap:9px;font-weight:650;color:var(--text)}
.catrow .cn svg{width:15px;height:15px;color:var(--text-3);flex-shrink:0}
.catrow .cn .cid{font-size:10px;font-weight:600;color:var(--text-3);background:var(--bg);border:1px solid var(--border-2);padding:1px 6px;border-radius:5px}
.catrow .acts{display:flex;gap:6px;justify-content:flex-end}

/* Kontrast: amber-tekst på hvid gjort mørkere hvor den står alene */
.mut-amber{color:#8A5202;font-weight:650}
html.dark .mut-amber{color:var(--amber)}

/* Genbrugelig tom/ikke-fundet tilstand i lister */
.empty-nf{padding:26px 18px;text-align:center;font-size:12.5px;color:var(--text-3);line-height:1.6}

/* Kontering låst efter godkendelse (audit) */
.cx-seg.locked{opacity:.75;position:relative}
.cx-seg.locked .cx-opt{cursor:not-allowed}
.cx-seg.locked .cx-opt.on{cursor:pointer} /* den aktive kan klikkes for ompostering-med-begrundelse */
.cx-seg.locked .cx-opt:not(.on){cursor:pointer} /* klik åbner ompostering-dialogen */

/* Audit P0-05b: tabeller med inline-kolonner må ALDRIG klippes væk på smalle skærme ·
   de scroller i deres egen container, så alt indhold kan nås */
@media (max-width:820px){
  .tbl{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .tbl .trow[style*="grid-template-columns"],
  .tbl .trow-h[style*="grid-template-columns"]{min-width:620px}
  .tbl .catrow{min-width:620px}
  .budget-branch-table{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .budget-branch-table .trow[style*="grid-template-columns"],
  .budget-branch-table .trow-h[style*="grid-template-columns"]{min-width:620px}
  .finkpi{grid-template-columns:repeat(2,1fr)}
  .bgt-row{grid-template-columns:minmax(90px,1fr) 1.4fr 92px;padding:9px 12px}
}
@media (max-width:480px){
  .finkpi{grid-template-columns:1fr 1fr}
  .stepper{
    display:grid;grid-template-columns:1fr;gap:8px;overflow:visible;
    padding:12px 14px!important;
  }
  .step{
    min-width:0;display:grid;grid-template-columns:24px minmax(0,1fr);
    gap:9px;text-align:left;align-items:start;
  }
  .step::before{
    top:-9px;bottom:auto;left:11px;right:auto;width:2px;height:9px;
  }
  .step>i{margin:0;width:22px;height:22px;grid-column:1;grid-row:1}
  .step>span{grid-column:2;grid-row:1;margin:0;font-size:inherit}
  .step>span>b{margin:1px 0 0;font-size:11px;line-height:1.25}
  .step>span>small{margin-top:2px;font-size:9.5px;line-height:1.35}
}

/* --------------------------------------------------------------------------
   .callout · 25 jul 2026
   Klassen blev brugt 18 steder i kundeportalen og havde ingen regel overhovedet:
   gennemsigtig baggrund, ingen ramme, ingen luft, og <b> løb direkte ind i
   <span>. Fundet under budgetarbejdet, men det ramte alle eksisterende skærme.
   Formsproget følger .op-callout i operatørkonsollen; farverne kommer fra
   design-tokens, så mørk tilstand følger med af sig selv.
   -------------------------------------------------------------------------- */
.callout{
  display:block;
  padding:11px 12px;
  margin-top:10px;
  border:1px solid var(--border-2);
  border-radius:9px 9px 4px 9px;
  background:var(--bg);
  color:var(--text-2);
  font-size:12px;
  line-height:1.55;
}
/* Kun overskriften er blok. Et <b> inde i brødteksten skal blive inline,
   ellers brækker "70.000 DKK" over to linjer. */
.callout > b:first-child{
  display:block;
  margin-bottom:3px;
  color:var(--text);
  font-weight:600;
}
.callout > span{ display:block }
.callout > span b{ color:var(--text); font-weight:600 }
.callout + .callout{ margin-top:8px }

.callout.warn{
  border-color:var(--amber-br);
  background:var(--amber-bg);
  color:var(--amber);
}
.callout.warn > b:first-child{ color:var(--amber) }

.callout.danger{
  border-color:var(--red-br);
  background:var(--red-bg);
  color:var(--red);
}
.callout.danger > b:first-child{ color:var(--red) }

/* ---------------------------------------------------------------------------
   Fælles organisationslag (casely-org.js) · 25 jul 2026
   Grupperækkerne lånte .bgt-row, som er bygget til budgetsidens tre kolonner
   med white-space:nowrap. I en smallere modal klippede den undertekster midt i
   et ord ("ejer budgetlinj"). Egen række, der må ombryde.
   --------------------------------------------------------------------------- */
.org-row{display:flex;gap:12px;align-items:flex-start;justify-content:space-between;
  padding:10px 0;border-top:1px solid var(--border-2);font-size:12.5px}
.org-row:first-of-type{border-top:none}
.org-row .ol{font-weight:650;color:var(--text);min-width:0}
.org-row .ol span{display:block;font-weight:500;font-size:11px;color:var(--text-3);
  line-height:1.5;white-space:normal}
.org-row .oa{display:flex;gap:6px;flex-shrink:0}
.org-empty{padding:18px 0;text-align:center;color:var(--text-3);font-size:13px}
@media (max-width:560px){
  .org-row{flex-direction:column;gap:8px}
  .org-row .oa{width:100%}
  .org-row .oa .btn{flex:1}
}

/* ---------------------------------------------------------------------------
   Budget · redigering dér hvor tallet står (casely-budget.js) · 26 jul 2026
   Ejeren bad tre gange om en LETTERE måde at rette en budgetlinje. Den lette
   måde er ikke en dialog · det er et tal, man kan klikke på.
   --------------------------------------------------------------------------- */
.amt-edit{background:none;border:none;padding:0 2px;margin:0;font:inherit;color:var(--brand);
  cursor:pointer;border-bottom:1px dashed var(--brand);border-radius:0}
.amt-edit:hover{background:var(--brand-bg,rgba(14,74,140,.07))}
.amt-edit:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
/* Beløbskolonnen er 110px, og et åbent felt med modpost er bredere. Rækken
   giver plads MENS den redigeres i stedet for at lade feltet flyde ud over
   panelets kant. */
.bgt-row:has(.amt-inline){grid-template-columns:minmax(100px,1fr) 1.5fr 200px}
.amt-inline{display:flex;flex-direction:column;gap:4px;align-items:stretch;width:100%}
.amt-inline .amt-input{width:100%;text-align:right;font-variant-numeric:tabular-nums;
  font-size:13px;padding:5px 8px;border:1px solid var(--brand);border-radius:7px;
  background:var(--card);color:var(--text)}
.amt-inline .amt-counter{width:100%;font-size:10.5px;padding:3px 5px;
  border:1px solid var(--border-2);border-radius:6px;background:var(--card);color:var(--text-3)}
.lnk-row{background:none;border:none;padding:0;margin:0;font:inherit;color:var(--text);
  cursor:pointer;text-align:left;border-bottom:1px dashed var(--border-2)}
.lnk-row:hover{color:var(--brand);border-bottom-color:var(--brand)}

/* Undertekster i budgetrækker må ombryde. .bl står med nowrap for at holde
   navnet på én linje, men underteksten arvede den og blev klippet midt i et
   ord ("fordelt pr. restaura"). */
.bgt-row .bl span{white-space:normal;line-height:1.45}