/* =====================================================================
   Nyt design – Fire & Rescue Karup Vagtplan · v10 (13/10-2026)
   KUN UDSEENDE. Ingen regler, ingen data, ingen databasekald.
   Erstatter sidens gamle "nytDesign"-blok og lægger sig over grund-
   stilarterne, så hele siden har ét samlet udseende. app.js er uændret.
   ===================================================================== */
:root {
  --tekst: "Archivo", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --smal: var(--tekst);
  --papir: #F2F4F7; --flade: #FFFFFF; --blaek: #17202B; --daempet: #5A6573; --linje: #E3E7EC; --linje2: #D5DAE0; --weekend: #F2F4F7;
  --accent: #1F5FBF; --accent-moerk: #164A96; --accent-lys: #E8F0FC;
  --hivis: #1F5FBF;
  --ok-bg: #E6F4EA; --ok-fg: #1E5B33; --ok: #2E8B47;
  --or-bg: #FFE2B8; --or-fg: #7A4300; --or: #E08A00;
  --roed-bg: #F7D9DA; --roed-fg: #8A0F14; --roed: #C8161D;
  --fc-bg: #0E7C7B; --fc-fg: #FFFFFF; --fc-tekst: #0B6463;
  --graa-bg: #EEF1F4; --graa-fg: #33404F;
  --r-s: 8px; --r: 12px; --r-m: 16px; --r-l: 20px;
  --skygge: 0 1px 2px rgba(16,24,40,.05), 0 4px 14px rgba(16,24,40,.06);
  --skygge-l: 0 24px 64px rgba(16,24,40,.28);
}
@media (prefers-color-scheme: dark) {
  :root { --papir: #12171D; --flade: #1A2129; --blaek: #E8ECF0; --daempet: #9AA5B1; --linje: #2E3843; --linje2: #3A4552; --weekend: #202831;
    --accent: #7FB0FF; --accent-moerk: #A9C9FF; --accent-lys: #1B2A40; --hivis: #7FB0FF;
    --ok-bg: #173826; --ok-fg: #A8E0B9; --or-bg: #4A3410; --or-fg: #FFD9A3; --roed-bg: #4A1518; --roed-fg: #FFB3B6; --fc-bg: #2BB3B1; --fc-fg: #04201F; --fc-tekst: #5FD6D4; --graa-bg: #222B35; --graa-fg: #C9D1DA;
    --skygge: none; --skygge-l: 0 24px 64px rgba(0,0,0,.6); --knap-tekst: #0B1220; }
  .knap:hover:not(:disabled) { color: #0B1220; }
  .fane[aria-current="page"], .fane.aktiv { color: #DCEBFF !important; }
  .nd-tab[aria-selected="true"] { color: #E8ECF0; }
}

/* ---------- Grund ---------- */
body { font-family: var(--tekst); font-size: 15px; background: var(--papir); }
h1, h2, h3, h4 { font-family: var(--tekst); letter-spacing: -.01em; }
:focus-visible { outline: 2px solid var(--accent) !important; outline-offset: 2px; }
.navneknap:focus-visible, .navn-ring:focus-visible, .mangel-liste button:focus-visible, .dialog-luk-top:focus-visible { outline: 2px solid var(--accent) !important; }
label { font-weight: 600; font-size: 14px; }
input[type=email], input[type=password], input[type=text], input[type=tel], input[type=number], input[type=date], input[type=time], select, textarea {
  font-family: var(--tekst); border: 1px solid var(--linje2); border-radius: var(--r) !important; background: var(--flade); color: var(--blaek); min-height: 44px; padding: 9px 12px; }
textarea { min-height: 72px; }
input:focus, select:focus, textarea:focus { outline: none !important; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-lys); }
input[type="file"] { font-family: var(--tekst); }
input[type="file"]::file-selector-button { border: 1px solid var(--linje2); border-radius: var(--r-s); background: var(--flade); padding: 8px 12px; font-weight: 600; margin-right: 10px; cursor: pointer; }
.vaelg-linje select, .imp-tabel select { min-height: 36px; padding: 4px 8px; }
.hjaelp, .tomt { color: var(--daempet); }

/* ---------- Knapper ---------- */
.knap { font-family: var(--tekst); border-radius: var(--r) !important; border: 1px solid var(--accent); background: var(--accent); color: var(--knap-tekst, #fff); font-weight: 700; min-height: 44px; padding: 10px 16px; }
.knap:hover:not(:disabled) { background: var(--accent-moerk); border-color: var(--accent-moerk); }
.knap.sekundaer { background: var(--flade); color: var(--blaek); border: 1px solid var(--linje2); font-weight: 600; }
.knap.sekundaer:hover:not(:disabled) { background: var(--papir); border-color: var(--linje2); }
.knap.fare { background: var(--roed); border-color: var(--roed); color: #fff; }
.knap.fare:hover:not(:disabled) { background: #A51117; border-color: #A51117; }
.knap.lille, .lille.knap { min-height: 36px; padding: 6px 12px; font-size: 13px; }
.knap.valgt { background: var(--accent-lys); color: var(--accent-moerk); border-color: var(--accent); outline: none; }
.knap:disabled { opacity: .45; }
.pil { width: 40px; height: 40px; border-radius: var(--r) !important; border: 1px solid var(--linje2); background: var(--flade); }
.pil:hover { background: var(--papir); }
.kryds { border-radius: 999px; border: 1px solid var(--linje2); background: var(--flade); padding: 6px 12px; }
.ryd-kryds:hover { background: var(--papir); }
#visOprind[aria-pressed="false"] { opacity: .6; text-decoration: none; }

/* ---------- Login ---------- */
#login, #skiftKode, #opstart { background: var(--papir); }
.login-boks { max-width: 400px; background: var(--flade); border-radius: 22px; padding: 30px 28px; box-shadow: var(--skygge); }
.login-boks h1 { font-family: var(--tekst); font-weight: 800; font-size: 30px; letter-spacing: -.02em; display: flex; align-items: center; gap: 12px; }
.login-boks h1::before { width: 40px; height: 40px; border-radius: 12px; margin: 0; background: var(--roed) url("ikon-192.png") center/cover; flex: none; }
.login-boks .knap { min-height: 48px; }
.fejl { color: var(--roed-fg); }

/* ---------- Topbjælke ---------- */
.topbar { position: sticky; top: 0; z-index: 20; border-bottom: 1px solid var(--linje) !important; box-shadow: none; background: var(--flade); min-height: 64px; padding: 10px 24px; gap: 10px 18px; }
.topbar h1 { font-family: var(--tekst); font-weight: 800; font-size: 19px !important; display: flex; align-items: center; gap: 10px; }
.topbar h1::before { content: ""; width: 30px; height: 30px; border-radius: 9px; background: var(--roed) url("ikon-192.png") center/cover; display: inline-block; flex: none; }
.faner { gap: 2px; }
.fane { font-family: var(--tekst); font-weight: 600; font-size: 14px !important; padding: 8px 14px !important; border: 0 !important; border-radius: 999px; color: #3A4552; }
.fane:hover { background: var(--papir); }
.fane[aria-current="page"], .fane.aktiv { background: var(--accent-lys); color: var(--accent-moerk) !important; }
.bruger { color: var(--daempet); font-size: 13px; }
.rolle { font-family: var(--tekst); font-weight: 700; font-size: 12px; border-radius: 8px; padding: 4px 10px; background: var(--papir); }
.rolle.admin { background: var(--roed); color: #fff; }
.topbar .knap, .topbar a.knap { min-height: 38px; padding: 7px 12px; font-size: 13px; }
.maanedsvalg h2 { font-family: var(--tekst); font-weight: 800; font-size: 19px; }
.tag-login, .holdtag, .dig-tag { font-family: var(--tekst); border-radius: 6px; }
.tag-login.admin { background: var(--roed); }
.dig-tag { background: var(--accent); color: #fff; }

/* ---------- Forside / paneler ---------- */
.dashboard { padding: 24px 20px 48px; }
.dash-indre { max-width: 1440px; gap: 16px; }
.panel { background: var(--flade); border: 0 !important; border-radius: var(--r-l); box-shadow: var(--skygge); padding: 20px 22px; }
.panel.ok { box-shadow: var(--skygge); }
.panel.orange { box-shadow: var(--skygge), inset 4px 0 0 var(--or); }
.panel.roed { box-shadow: var(--skygge), inset 4px 0 0 var(--roed); }
.panel h2 { font-family: var(--tekst); font-size: 18px; font-weight: 800; margin: 0 0 12px; }
.panel h3 { font-family: var(--tekst); font-size: 15px; font-weight: 700; margin: 14px 0 8px; }
.adm-top { padding: 14px 18px; }
.adm-knap { font-family: var(--tekst); font-weight: 800; font-size: 18px !important; }
.adm-badge { background: var(--roed); font-size: 13px; padding: 3px 12px; }
.adm-ok { color: var(--ok-fg); }
.min-knap { color: var(--daempet); }
.idag-top { gap: 10px 22px; }
.idag-dato { font-family: var(--tekst); font-size: 22px; font-weight: 800; }
.fc-maerke { font-family: var(--tekst); font-size: 12px; font-weight: 700; border-radius: 999px; padding: 5px 12px; background: var(--papir); color: var(--blaek); }
.bemanding { align-items: center; flex-wrap: wrap; }
.bemanding .tal { font-family: var(--tekst); font-weight: 800; font-size: 52px; letter-spacing: -.03em; }
.status { border-radius: 999px; padding: 5px 12px; font-size: 13px; }
.status.ok { background: var(--ok-bg); color: var(--ok-fg); }
.status.orange { background: var(--or-bg); color: var(--or-fg); }
.status.roed { background: var(--roed-bg); color: var(--roed-fg); }
.status.ignoreret { background: transparent; color: var(--daempet); border: 0; padding-left: 0; font-weight: 600; }
.mangel-tekst { color: var(--roed-fg); font-weight: 600; font-size: 14px; }
.info-linje { border-radius: var(--r); background: var(--papir); padding: 10px 12px; }
.ingen-konflikt { border-radius: var(--r); background: var(--ok-bg); color: var(--ok-fg); padding: 10px 12px; }
.advarsel-linje { border-radius: var(--r); background: var(--or-bg); color: var(--or-fg); padding: 10px 12px; }
.konflikt { border-radius: var(--r); background: var(--roed-bg); color: var(--roed-fg); padding: 12px 14px; }
.ring-boks { border-radius: var(--r-m); border: 2px solid var(--roed); }
.ring-boks a { color: var(--roed); font-weight: 800; }
.kode-boks { border-radius: var(--r-m); border: 2px dashed var(--accent); }
.navneliste li { padding: 9px 0; border-bottom: 1px solid var(--linje); align-items: center; }
.navneliste .kode-tag { border-radius: 999px; padding: 2px 10px; font-family: var(--tekst); font-size: 12px; }
.fn { font-family: var(--tekst); font-size: 12px; font-weight: 700; color: var(--daempet); }
.fn.isl { color: var(--roed-fg); }
.navn-ring { color: var(--blaek); }
.status-tag { font-family: var(--tekst); border-radius: 999px; padding: 2px 10px; background: var(--papir); }
.status-tag.afventer { background: var(--or-bg); color: var(--or-fg); }
.status-tag.afvist { background: var(--roed-bg); color: var(--roed-fg); }
.cu-taeller { font-family: var(--tekst); font-weight: 800; }
.pop-sektion { font-family: var(--tekst); }
.ledige h2 { color: var(--blaek); }
.ledig-boks { border-top: 1px solid var(--linje); }

/* Tilkald: egen boks, neutral grå – rød kun ved mangel (Rudi 13/10) */
.tilkald-samlet .tilkald-dag { margin-bottom: 8px; }
.tilkald-samlet .navneliste li { background: var(--papir); border: 0; border-radius: var(--r); padding: 10px 14px; margin-bottom: 6px; }
.tilkald-samlet .fn, .tilkald-samlet .fn.isl { color: var(--graa-fg); }
.tilkald-samlet .mangel-tekst { background: var(--papir); color: var(--daempet); font-weight: 600; border-radius: var(--r); padding: 10px 14px; margin: 6px 0; }
.tilkald-samlet .tomt { padding: 10px 14px; }

/* Kommende mangler */
.mangel-liste li { border-bottom: 0; margin-bottom: 4px; }
.mangel-liste button { border-radius: var(--r); padding: 12px 10px; }
.mangel-liste button:hover { background: var(--papir); }
.prik { width: 10px; height: 10px; border-radius: 50%; }
.prik.roed { background: var(--roed); } .prik.orange { background: var(--or); }
.ignorer-linje { display: flex; flex-wrap: wrap; gap: 4px 14px; padding: 0 10px 8px 30px; }
.ignorer-linje label { font-size: 13px; color: var(--daempet); }
details.ignorerede summary, .ledig-boks summary, details.regler summary { cursor: pointer; font-weight: 700; }

/* Næste vagt (bruger) – kompakt */
.hero { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px 18px; align-items: center; border-radius: var(--r-l); padding: 14px 18px; background: var(--accent); color: #fff; box-shadow: none; min-width: 0; }
.hero > div { min-width: 0; }
.hero .h-lille { font-size: 13px; opacity: .9; margin: 0; }
.hero .h-stor { font-family: var(--tekst); font-weight: 800; font-size: 26px; letter-spacing: -.02em; margin: 2px 0; line-height: 1.1; }
.hero .h-dag { min-width: 0; background: rgba(255,255,255,.16); border-radius: var(--r-s); padding: 6px 3px; text-align: center; font-size: 11px; }
.hero .h-dag b { display: block; font-family: var(--tekst); font-weight: 800; font-size: 12px; letter-spacing: -.03em; line-height: 1.1; overflow-wrap: anywhere; }
.hero .h-dag b.lang { font-size: 10px; letter-spacing: -.02em; }   /* CG-DES-20261013-16: lange koder (24T/SYG, TK/FRI/SYG) ombrydes – klippes aldrig */
.hero .h-dage { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; width: min(100%, 520px); }
@media (prefers-color-scheme: dark) { .hero { color: #0B1220; } .hero .h-dag { background: rgba(0,0,0,.12); } }

/* Genveje: store felter */
.genveje { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; }
.genvej { border-radius: var(--r-m); border: 1px solid var(--linje); background: var(--flade); min-height: 68px; padding: 14px 16px; font-weight: 700; display: grid; grid-template-columns: 40px 1fr; column-gap: 12px; align-items: center; }
.genvej:hover { box-shadow: var(--skygge); border-color: var(--linje2); }
.genvej .gv-ikon { grid-row: 1 / span 2; width: 40px; height: 40px; border-radius: 12px; background: var(--accent-lys); color: var(--accent); display: grid; place-items: center; }
.genvej .gv-ikon svg { width: 22px; height: 22px; }
.genvej small { grid-column: 2; font-weight: 400; color: var(--daempet); }

/* 14-dages bemanding (nyt-design.js – kun visning) */
.nd-bem { display: grid; grid-template-columns: repeat(14, minmax(70px, 1fr)); gap: 6px; overflow-x: auto; padding-bottom: 4px; }
.nd-bem button { all: unset; box-sizing: border-box; cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 10px 4px; border-radius: 14px; border: 1.5px solid transparent; text-align: center; }
.nd-bem button:focus-visible { outline: 2px solid var(--accent); }
.nd-bem .d { font-size: 12px; font-weight: 600; } .nd-bem .t { font-size: 22px; font-weight: 800; letter-spacing: -.02em; } .nd-bem .k { font-size: 10px; font-weight: 600; }
.nd-bem .ok { background: var(--ok-bg); color: var(--ok-fg); border-color: var(--ok); }
.nd-bem .orange { background: var(--or-bg); color: var(--or-fg); border-color: var(--or); }
.nd-bem .roed { background: var(--roed-bg); color: var(--roed-fg); border-color: var(--roed); }

/* ---------- Vagtplan ---------- */
.filterlinje { background: var(--flade); border-bottom: 1px solid var(--linje); }
.filterlinje strong { font-family: var(--tekst); font-weight: 800; }
.gitter-omslag { background: var(--flade); border-radius: 18px; margin: 12px 16px; box-shadow: var(--skygge); }
table { font-family: var(--tekst); }
#gitterOmslag table { border-collapse: separate; border-spacing: 2px; }
#gitterOmslag th, #gitterOmslag td { border: 0 !important; }
thead th { font-size: 11px; font-weight: 600; color: var(--daempet); border-radius: 8px; padding: 4px 0; }
thead th .nr { font-size: 15px; font-weight: 800; }
thead th.weekend { background: var(--papir); }
thead th.helligdag .nr { color: var(--roed); }
thead th.idag { background: #FFD100 !important; color: #1A1A1A !important; box-shadow: none; }
thead th.idag .nr { color: #1A1A1A !important; } thead th.idag.helligdag .nr { color: #A30000 !important; }
.navn { font-family: var(--tekst); font-size: 14px; border-radius: 0 8px 8px 0; }
thead th.navn { background: var(--flade); }
tr.hold th { font-family: var(--tekst); font-size: 13px; font-weight: 800; background: var(--flade) !important; padding: 14px 12px 4px; }
tr.hold td { background: var(--flade) !important; }
tr.hold td.rul::after { height: 6px; border-radius: 3px; background: var(--ok); }
#gitterOmslag th.navn { box-shadow: 2px 0 0 var(--flade); }
td.celle { border-radius: 7px; font-weight: 800; height: 34px; font-size: 13px; }
td.celle.weekend:not([class*="k-"]) { background: var(--papir); }
td.celle.idag { box-shadow: inset 3px 0 0 #FFD100, inset -3px 0 0 #FFD100; }
.redigerbar td.celle:hover { outline: 2px solid var(--blaek); outline-offset: -2px; }
.k-FRI { color: var(--daempet); font-weight: 600; }
tr.mig > th.navn { background: var(--accent-lys) !important; font-weight: 800; }
tr.mig > td.celle { box-shadow: inset 0 0 0 1px rgba(31,95,191,.35); }
td.celle.kladde { outline: 2px dashed var(--blaek); outline-offset: -2px; }
td.celle.kladde.gem-fejl { outline-color: var(--roed); }
td.celle.afventer { outline: 2px dashed var(--or); outline-offset: -2px; }
td.celle.afventer::before { color: var(--or); }
td.celle.har-kommentar::after { border-color: transparent var(--accent) transparent transparent; }
/* v28 (Rudi 15/10): FIRECAT-tildelt felt skifter farve; rødt hjørne kun når der står en kommentar på tildelingen */
td.celle.tildelt { background: var(--fc-bg) !important; color: var(--fc-fg) !important; }
td.celle.tildelt::after { border-color: transparent; }
td.celle.tildelt.har-kommentar::after { border-color: transparent var(--accent) transparent transparent; }
td.celle.tildelt.fc-note::after, td.celle.tildelt.fc-note.har-kommentar::after { content: ""; position: absolute; top: 0; right: 0; border-style: solid; border-width: 0 9px 9px 0; border-color: transparent var(--roed) transparent transparent; }
.bemanding .tal.med-fc, strong.med-fc { color: var(--fc-tekst); }
.fc-boks { border-left: 4px solid var(--fc-bg); padding-left: 10px; }
.fc-boks h4 { margin: 0; }
.fc-kommentar { display: block; }
td.celle.skal-rettes { box-shadow: inset 0 0 0 3px var(--roed); }
td.celle .oprind { font-family: var(--tekst); font-size: 10px; display: block; }
td.celle.har-oprind { height: 40px; vertical-align: top; padding-top: 5px; }
body.zoom-fokus td.celle .oprind { font-size: 11px; bottom: 5px; }
.holdtag { background: var(--papir); font-size: 11px; }
th.status-kol, td.status-kol { font-family: var(--tekst); background: var(--papir) !important; color: var(--blaek) !important; }
th.status-kol .kv-maerke, td.status-kol .kv-tal { color: var(--accent-moerk); }
td.status-kol .neg { color: var(--roed-fg); text-decoration: none; }
.status-foerste { border-left: 2px solid var(--linje2) !important; }
.tom h3 { font-family: var(--tekst); font-weight: 800; }

/* Zoom (nyt-design.js – kun visning) */
.nd-zoom { display: inline-flex; gap: 2px; padding: 3px; border-radius: 12px; background: var(--papir); margin-left: 6px; }
.nd-zoom button { border: 0; background: transparent; border-radius: 9px; padding: 7px 10px; font-size: 12px; font-weight: 600; color: var(--daempet); min-height: 34px; cursor: pointer; }
.nd-zoom button[aria-pressed="true"] { background: var(--flade); color: var(--blaek); box-shadow: 0 1px 2px rgba(16,24,40,.12); }
body.zoom-overblik td.celle { height: 22px; font-size: 9px; padding: 0; }
body.zoom-overblik thead th { font-size: 9px; }
body.zoom-overblik thead th .nr { font-size: 11px; }
body.zoom-overblik .navn { font-size: 12px; }
body.zoom-overblik td.celle .oprind { display: none; }
body.zoom-fokus td.celle { height: 50px; font-size: 16px; }
body.zoom-fokus thead th { font-size: 13px; }
body.zoom-fokus thead th .nr { font-size: 18px; }
body.zoom-fokus .navn { font-size: 15px; }

/* ---------- Dialoger ---------- */
dialog { border: 0 !important; border-radius: 22px; padding: 22px; box-shadow: var(--skygge-l); background: var(--flade); }
dialog::backdrop { background: rgba(20,22,26,.5); }
dialog h3 { font-family: var(--tekst); font-weight: 800; font-size: 20px; }
dialog .under { color: var(--daempet); }
.dialog-luk-top { font-family: var(--tekst); border-radius: var(--r); border: 1px solid var(--linje2); box-shadow: none; padding: 8px 12px; }
.dialog-bund { flex-wrap: wrap; }
.kodegruppe h4 { font-family: var(--tekst); font-weight: 700; font-size: 12px; }
.kodeknap { font-family: var(--tekst); font-weight: 800; font-size: 13px; border-radius: var(--r-s); min-width: 48px; min-height: 42px; }
.kodeknap.valgt { outline: 2px solid var(--blaek); outline-offset: 2px; }
.forslag-frihed { border-radius: var(--r-m); border: 1px solid var(--linje); background: var(--papir); }
.forslag-frihed .kodeknap.anbefalet { outline: 2px solid var(--roed); outline-offset: 2px; }
.aendr-valg { border-radius: var(--r-m); border: 1px solid var(--linje); }
.sektion { font-family: var(--tekst); font-weight: 800; font-size: 16px; }
.ma-liste { border-top: 0; }
.ma-liste li { border-bottom: 1px solid var(--linje); border-radius: 0; padding: 6px 4px; }
.ma-liste .navneknap { font-weight: 700; }
.historik li { border-radius: var(--r-s); }
label.radio { padding: 10px 12px; border: 1px solid var(--linje); border-radius: var(--r); margin: 6px 0; }
label.radio:has(input:checked) { border-color: var(--accent); background: var(--accent-lys); }
label.radio.lille { padding: 4px 0; border: 0; background: transparent !important; }
.fc-plads .pladsnavn { font-family: var(--tekst); font-weight: 800; }
.fc-plads.advarsel select { border-color: var(--or); background: var(--or-bg); }
.ferie-dag { font-family: var(--tekst); border-radius: 6px; }
.besked-kort { border-radius: var(--r); }
.besked-kort.ulaest strong::before, .tam-liste .tam-linje.ulaest strong::before { color: var(--roed); }
.tam-b { border-radius: 14px; }
.tam-b.system { background: var(--or-bg); }
.jr-tabel td { border-radius: 4px; }
.jr-tabel td.jr-24t { background: var(--accent); }
.jr-tabel th.jr-mark { color: var(--roed); }
.rul-tabel td.rul-celle { font-family: var(--tekst); }

/* ---------- Tabeller ---------- */
.log-titel { font-family: var(--tekst); font-weight: 800; font-size: 24px; }
.log-tabel-omslag { border: 0; border-radius: var(--r-l); background: var(--flade); box-shadow: var(--skygge); }
.log-tabel th { font-family: var(--tekst); font-size: 12px; font-weight: 700; color: var(--daempet); background: var(--papir); }
.log-tabel .aendring { font-family: var(--tekst); font-weight: 800; }
.log-tabel tbody tr:hover, .log-tabel tbody tr:focus-visible { background: var(--papir); }
.saldo-tabel thead th, .saldo-tabel thead th:first-child { background: var(--papir); }
.saldo-tabel td.neg { color: var(--roed-fg); font-weight: 800; }
.saldo-tabel td.advar { background: var(--or-bg) !important; color: var(--or-fg); }
.imp-tabel th { font-size: 12px; color: var(--daempet); }
.gen-tabel th { font-size: 12px; color: var(--daempet); }
.regler { border-radius: var(--r); }
.ti-ok { color: var(--ok-fg); } .ti-tjek { color: var(--or-fg); } .ti-fejl { color: var(--roed-fg); }

/* ---------- Kladde-bjælke og beskeder ---------- */
#kladdeBjaelke { border-radius: 16px !important; background: #201E1D !important; color: #fff; padding: 10px 10px 10px 16px !important; box-shadow: 0 12px 32px rgba(0,0,0,.25); }
#kladdeBjaelke .knap.sekundaer { background: rgba(255,255,255,.14); color: #fff; border-color: transparent; }
#besked { border-radius: 14px; font-family: var(--tekst); background: #201E1D; color: #fff; }
#besked.fejlbesked { background: var(--roed); }

/* ---------- Bundmenu (telefon) ---------- */
.bundmenu { display: none; }
@media (max-width: 700px) {
  .faner { display: none; }
  .bundmenu { display: grid; grid-template-columns: repeat(5, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; background: var(--flade); border-top: 1px solid var(--linje); }
  :root { --menu-h: 64px; }
  html, body { height: 100%; overflow: hidden; }
  #app { height: 100%; height: 100dvh; padding-bottom: calc(var(--menu-h) + env(safe-area-inset-bottom, 0px)); box-sizing: border-box; }
  .bundmenu { height: calc(var(--menu-h) + env(safe-area-inset-bottom, 0px)); box-sizing: border-box; padding: 8px 0 calc(6px + env(safe-area-inset-bottom, 0px)) !important; align-items: start; box-shadow: 0 -2px 10px rgba(0,0,0,.06); }
  .bundmenu button { border: none; background: none; font-family: var(--tekst); font-size: 11px; font-weight: 500; color: var(--daempet); display: grid; justify-items: center; gap: 3px; padding: 0; }
  .bundmenu button.aktiv { color: var(--accent-moerk); font-weight: 700; }
  .bundmenu svg { width: 22px; height: 22px; padding: 4px 14px; border-radius: 999px; box-sizing: content-box; }
  .bundmenu button.aktiv svg { background: var(--accent-lys); }
  #kladdeBjaelke { bottom: calc(var(--menu-h) + env(safe-area-inset-bottom, 0px) + 8px) !important; }
  .dashboard, .gitter-omslag, #logVisning, #saldoVisning { overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
  .saldo-omslag { max-height: none; }
  .topbar { padding: 8px 14px; min-height: 52px; }
  .dashboard { padding: 14px 12px 28px; }
  .panel { padding: 16px; border-radius: 18px; }
  .gitter-omslag { margin: 8px; border-radius: 14px; }
  .hero { grid-template-columns: minmax(0,1fr); padding: 12px 14px; }
  .hero .h-stor { font-size: 22px; }
  .hero .h-dage { gap: 4px; }
  .hero .h-dag { min-width: 0; padding: 5px 2px; font-size: 10px; }
  .hero .h-dag b { font-size: 10px; letter-spacing: -.04em; }
  .hero .h-dag b.lang { font-size: 8.5px; }
  .hero .h-dage { width: 100%; gap: 3px; }
  .bemanding .tal { font-size: 42px; }
  .genveje { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
  .genvej { grid-template-columns: 1fr; row-gap: 6px; }
  .genvej .gv-ikon { grid-row: auto; }
  .genvej small { grid-column: 1; }
  .nd-zoom button { padding: 6px 8px; }
  dialog { border-radius: 18px; padding: 16px; }
}

/* ---------- Mørk tilstand: rettelser ---------- */
@media (prefers-color-scheme: dark) {
  tr.mig > th.navn { background: #1B2A40 !important; color: #E8ECF0; }
  #kladdeBjaelke .knap.sekundaer { background: rgba(255,255,255,.14); color: #fff; }
  .fane { color: #C9D1DA; }
}

/* ===================== v3: opbygning som prototypen (kun visning) ===================== */
/* Forsidens rækkefølge: hilsen · næste vagt · opgaver · i dag · tilkald · 14 dage · resten */
/* CG-DES-20261013-13: ingen CSS-order – rækkefølgen styres KUN af ordnDashboard (brugerens gemte valg). */
.dash-indre > .nd-hilsen { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 2px; padding: 4px 2px 0; }
.nd-hilsen span { font-size: 14px; color: var(--daempet); }
.nd-hilsen b { font-size: 28px; font-weight: 800; letter-spacing: -.02em; }
.dash-indre > .tilkald-samlet { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 4px 22px; align-items: start; }
.tilkald-samlet > h2, .tilkald-samlet > .min-knap { grid-column: 1 / -1; }


/* "Opgaver og administration" som hvidt kort – ikke blå bjælke */
.adm-knap, .adm-knap.knap { background: transparent !important; color: var(--blaek) !important; border: 0 !important; min-height: 44px; padding: 4px 0 !important; box-shadow: none !important; font-weight: 800; }
.adm-knap:hover { background: transparent !important; color: var(--accent-moerk) !important; }
.adm-top { padding: 16px 20px; }

/* Store, rolige paneler */
.min-knap { display: inline-block !important; min-width: 32px; }

/* Bemandingsrække i vagtplanen */
#gitterOmslag thead tr.nd-bemrk th { position: sticky; z-index: 2; background: var(--flade); padding: 2px 0 6px; }
#gitterOmslag thead tr.nd-bemrk th.navn { z-index: 3; font-size: 12px; font-weight: 800; color: var(--blaek); text-align: left; padding-left: 12px; }
.nd-pil { display: block; margin: 0 1px; padding: 4px 0; border-radius: 8px; font-size: 12px; font-weight: 800; text-align: center; border: 1.5px solid transparent; }
.nd-pil.ok { background: var(--ok-bg); color: var(--ok-fg); border-color: var(--ok); }
.nd-pil.orange { background: var(--or-bg); color: var(--or-fg); border-color: var(--or); }
.nd-pil.roed { background: var(--roed-bg); color: var(--roed-fg); border-color: var(--roed); }
.nd-pil.klik { cursor: pointer; }
thead th.nd-kritisk:not(.idag) { background: var(--roed-bg) !important; color: var(--roed-fg) !important; }
thead th.nd-kritisk:not(.idag) .nr { color: var(--roed-fg) !important; }
body.zoom-overblik .nd-pil { font-size: 9px; padding: 2px 0; }
body.zoom-fokus .nd-pil { font-size: 15px; padding: 7px 0; }

/* Medarbejdere, Min profil m.fl. åbner som store ark */
dialog.bred, #maDialog, #profilDialog, #beskedDialog, #tamDialog, #saldoDialog { width: min(980px, calc(100vw - 32px)) !important; }
#maDialog .ma-liste li, #profilDialog .sektion { scroll-margin-top: 60px; }
@media (max-width: 700px) {
  dialog, dialog.bred { width: 100vw !important; max-width: 100vw; max-height: 100dvh; height: 100dvh; margin: 0; border-radius: 0 !important; padding: 16px 16px calc(24px + env(safe-area-inset-bottom, 0px)); }
  .nd-hilsen b { font-size: 22px; }
}

/* ===================== v4 ===================== */
/* Ignorer: knap i stedet for flueben */
.ignorer-linje { padding: 6px 10px 10px 30px; gap: 6px 8px; }
.ignorer-linje label.radio, .ignorer-linje label.radio.lille { position: relative; display: inline-flex; align-items: center; margin: 0; padding: 8px 14px; border: 1px solid var(--linje2); border-radius: 999px; background: var(--flade); color: var(--blaek); font-size: 13px; font-weight: 600; cursor: pointer; }
.ignorer-linje label.radio input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; pointer-events: none; }
.ignorer-linje label.radio:has(input:checked) { background: var(--graa-bg); border-color: var(--graa-fg); color: var(--graa-fg); }
.ignorer-linje label.radio:has(input:checked) span::before { content: "✓ "; }
.ignorer-linje label.radio:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }
details.ignorerede .ignorer-linje { padding-left: 0; }
/* Dialogtitler: ingen fokusramme */
dialog h2:focus, dialog h3:focus, dialog h2:focus-visible, dialog h3:focus-visible { outline: none !important; box-shadow: none; }
dialog .under { font-size: 14px; }
dialog select, dialog input { max-width: 100%; }
#profilDialog .raekke > div { flex: 0 1 220px; }
label.radio:has(input:checked) { background: var(--flade); border-color: var(--linje2); }
/* 14 dage: tydeligere hjælpetekst */
.nd-bem button { position: relative; }
.nd-bem button .f { font-size: 10px; line-height: 1.2; opacity: .9; margin-top: 2px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ===================== v5: forside som prototypen (app.js tegner, css ordner) ===================== */
.hero { grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px 20px; padding: 16px 20px; }
.hero .h-kode { font-size: 44px; font-weight: 800; line-height: 1; letter-spacing: -.03em; min-width: 72px; }
.hero .h-kicker { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.hero .h-stor { font-size: 20px; }
.hero .h-dage { width: min(100%, 460px); }
@media (max-width: 700px) { .hero { grid-template-columns: auto minmax(0, 1fr); } .hero .h-dage { grid-column: 1 / -1; width: 100%; } .hero .h-kode { font-size: 36px; min-width: 56px; } }
/* Kræver handling: overskrift + kortene i 3 kolonner */
.adm-top { background: transparent !important; box-shadow: none !important; padding: 8px 2px 0 !important; }
.adm-knap { font-size: 20px !important; }
.adm-knap .adm-badge { font-size: 12px; padding: 2px 10px; }
.adm-sektion { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 16px; align-items: start; }
.adm-sektion > .panel { grid-column: auto !important; }
.adm-sektion > .panel.bred { grid-column: auto !important; }
.adm-sektion .panel h2 { font-size: 16px; }
.adm-sektion .foreslag-linje, .adm-sektion .navneliste li.foreslag-linje { background: var(--papir); border-radius: 14px; padding: 12px 14px; margin-bottom: 8px; border: 0; }
.adm-sektion .panel.orange .foreslag-linje { background: var(--or-bg); }
.adm-sektion .panel.roed .foreslag-linje { background: var(--roed-bg); }
.adm-sektion .knapper .knap { min-height: 40px; }

/* ===================== v6: faner, Mere, sider i stedet for pop-ups ===================== */
.topbar #aabnMedarbejdere, .topbar #brugerMail, .topbar #logUd { display: none !important; }
.topbar .bruger { gap: 10px; }
.topbar #aabnProfil { width: 40px; height: 40px; min-height: 40px; padding: 0 !important; border-radius: 50% !important; background: #201E1D !important; color: #fff !important; border: 0 !important; font-size: 0; }
/* CG-NY-07 (nat 14/10): initialer som rigtig DOM-tekst (span.profil-ini) – ikke CSS-indhold; centreret i cirklen */
.topbar #aabnProfil { display: inline-flex !important; align-items: center; justify-content: center; }
.topbar #aabnProfil .profil-ini { font-size: 12px; font-weight: 800; line-height: 1; letter-spacing: .02em; }
.topbar #aabnProfil[aria-current="page"] { outline: 3px solid var(--accent-lys); }
.fane-tal { display: inline-block; margin-left: 6px; min-width: 18px; padding: 1px 7px; border-radius: 999px; background: var(--roed); color: #fff; font-size: 11px; font-weight: 700; text-align: center; }
body:not(.er-admin) .fane-admin { display: none; }
/* Opgaver-fanen: kun "Kræver handling" */
body.visning-opg #dashboard > .dash-indre > :not(.adm-top):not(.adm-wrap) { display: none !important; }
.opg-tilstand { grid-column: 1 / -1; margin: 0 0 4px; padding: 12px 16px; border-radius: var(--r); background: var(--flade); font-weight: 600; box-shadow: var(--skygge); }
.opg-tilstand.ok { background: var(--ok-bg); color: var(--ok-fg); }
.opg-tilstand.fejl { background: var(--roed-bg); color: var(--roed-fg); }
body.visning-opg .adm-knap { pointer-events: none; }
body.visning-opg .adm-knap span:first-child { font-size: 26px; }
/* Mere */
#mereIndre .log-titel { margin-bottom: 14px; }
.mere-kort { grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 12px; }
.mere-kort .genvej { grid-template-columns: 44px 1fr; column-gap: 14px; min-height: 76px; border-radius: 18px; box-shadow: var(--skygge); border: 0; }
.mere-kort .gv-ikon { width: 44px; height: 44px; border-radius: 14px; font-size: 18px; font-weight: 800; }
.mere-kort .gv-t { font-size: 15px; font-weight: 700; }
.mere-kort small { grid-column: 2; }
.panel.fremhaevet { outline: 3px solid var(--accent); outline-offset: 2px; }
/* Beskeder, Min profil og Medarbejdere som hele sider */
body.side-dialog dialog.som-side { position: fixed; left: 0; right: 0; top: var(--top-h, 64px); bottom: 0; width: 100% !important; max-width: 100% !important; height: auto; max-height: none !important; margin: 0; border-radius: 0 !important; background: var(--papir); box-shadow: none; padding: 24px max(20px, calc((100vw - 1100px) / 2)) 48px; overflow: auto; z-index: 15; }
body.side-dialog dialog.som-side > * { max-width: 1100px; }
body.side-dialog dialog.som-side .dialog-luk-top { top: -24px; }
body.side-dialog dialog.som-side h3:first-of-type, body.side-dialog dialog.som-side > h2:first-of-type { font-size: 26px; }
@media (max-width: 700px) {
  body.side-dialog dialog.som-side { top: var(--top-h, 52px); bottom: calc(var(--menu-h) + env(safe-area-inset-bottom, 0px)); padding: 16px 14px 32px; }
  body.side-dialog .topbar .faner { display: none; }
}

/* ===================== v7: panel ved siden af vagtplanen ===================== */
@media (min-width: 901px) {
  dialog.som-panel { position: fixed; top: calc(var(--top-h, 64px) + 12px); right: 16px; bottom: 16px; left: auto; width: 400px !important; max-width: 400px !important; height: auto; max-height: calc(100dvh - var(--top-h, 64px) - 28px) !important; margin: 0; border-radius: 18px !important; box-shadow: var(--skygge-l); overflow: auto; overscroll-behavior: contain; z-index: 30; padding: 20px; }
  body.panel-aaben .gitter-omslag { margin-right: 432px; }
  body.panel-aaben .filterlinje { margin-right: 432px; }
  body.panel-aaben #kladdeBjaelke { left: calc(50% - 216px); }
}
dialog.som-panel .dialog-luk-top { display: none; }
dialog.som-panel h3 { font-size: 20px; padding-right: 8px; }
dialog.som-panel .kodeknap { min-width: 46px; min-height: 40px; font-size: 12px; }
dialog.som-panel .dialog-bund { position: sticky; bottom: -20px; background: var(--flade); padding: 12px 0 4px; margin-top: 12px; }
td.celle.valgt-celle { outline: 3px solid var(--blaek) !important; outline-offset: -3px; }
#dagDialog .bemanding { gap: 10px; margin: 4px 0 8px; flex-wrap: wrap; }
#dagDialog .bemanding .tal { font-size: 44px; }
#dagDialog .dag-gruppe .sektion { font-size: 13px; color: var(--daempet); margin: 14px 0 4px; }
#dagDialog .navneliste li { padding: 7px 0; }
#dagDialog .kode-tag { font-size: 12px; font-weight: 800; padding: 2px 10px; border-radius: 999px; }
#dagDialog .knapper { margin-top: 16px; }
thead th { cursor: pointer; }
thead th:hover:not(.navn):not(.status-kol) { background: var(--accent-lys); }
@media (max-width: 700px) {
  #kodeDialog, #dagDialog { position: fixed; top: auto; bottom: 0; left: 0; right: 0; width: 100vw !important; max-height: 88dvh; border-radius: 22px 22px 0 0 !important; margin: 0; padding: 12px 16px calc(20px + env(safe-area-inset-bottom, 0px)); }
  #kodeDialog::before, #dagDialog::before { content: ""; display: block; width: 40px; height: 4px; border-radius: 2px; background: var(--linje2); margin: 0 auto 12px; }
}

/* ===================== v8: opgavegrupper + faner i lange sider ===================== */
.adm-sektion { display: block; }
.opg-kolonner { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 16px; align-items: start; }
.opg-gruppe { background: var(--flade); border-radius: var(--r-l); box-shadow: var(--skygge); padding: 8px; display: flex; flex-direction: column; gap: 8px; }
.opg-hoved { display: flex; align-items: center; gap: 10px; padding: 10px 12px 8px; border-bottom: 1px solid var(--linje); font-size: 16px; }
.opg-prik { width: 10px; height: 10px; border-radius: 50%; background: var(--accent); }
.opg-gruppe[data-g="Bemanding"] .opg-prik { background: var(--roed); }
.opg-gruppe[data-g="Frister"] .opg-prik { background: var(--or); }
.opg-gruppe[data-g="Administration"] .opg-prik { background: var(--daempet); }
.opg-tal { margin-left: auto; padding: 2px 10px; border-radius: 999px; background: var(--papir); font-size: 12px; font-weight: 700; }
.opg-gruppe > .panel { box-shadow: none !important; background: var(--papir); border-radius: 14px; padding: 14px 16px; }
.opg-gruppe > .panel.orange { background: var(--or-bg); } .opg-gruppe > .panel.roed { background: var(--roed-bg); } .opg-gruppe > .panel.ok { background: var(--ok-bg); }
.opg-gruppe > .panel h2 { font-size: 15px; margin-bottom: 8px; }
.opg-gruppe .foreslag-linje { background: var(--flade); }
.nd-tabs { display: flex; flex-wrap: wrap; gap: 3px; padding: 4px; border-radius: 14px; background: var(--papir); margin: 12px 0 16px; }
.nd-tab { border: 0; background: transparent; border-radius: 10px; padding: 9px 14px; font-size: 13px; font-weight: 600; color: var(--daempet); cursor: pointer; min-height: 40px; }
.nd-tab[aria-selected="true"] { background: var(--flade); color: var(--blaek); box-shadow: 0 1px 2px rgba(16,24,40,.12); }

/* v9 */
.info-linje.ignoreret { border: 1px dashed #8593A3; }
.info-linje.ignoreret::before { content: "Ignoreret · "; font-weight: 700; color: var(--graa-fg); }
.nd-pil { all: unset; box-sizing: border-box; display: block; width: calc(100% - 2px); margin: 0 1px; padding: 4px 0; border-radius: 8px; font-size: 12px; font-weight: 800; text-align: center; border: 1.5px solid transparent; cursor: pointer; }
.nd-pil:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.nd-pil.ok { background: var(--ok-bg); color: var(--ok-fg); border-color: var(--ok); }
.nd-pil.orange { background: var(--or-bg); color: var(--or-fg); border-color: var(--or); }
.nd-pil.roed { background: var(--roed-bg); color: var(--roed-fg); border-color: var(--roed); }
.nd-pil.ukendt { background: var(--papir); color: var(--daempet); border-color: var(--linje2); }
.mere-under { display: flex; flex-direction: column; gap: 14px; align-items: flex-start; }
.mere-under > .panel { width: 100%; box-sizing: border-box; }
thead th[role="button"]:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }

/* Datoer i vagtplanens hoved følger bemandingsfarven (grøn ingen markering, gul = obs, rød = kritisk) */
thead th.nd-obs:not(.idag) { background: var(--or-bg) !important; color: var(--or-fg) !important; }
thead th.nd-obs:not(.idag) .nr { color: var(--or-fg) !important; }

/* v10 */
body.zoom-overblik td.celle, body.zoom-overblik td.celle.har-oprind { vertical-align: middle !important; padding: 0 !important; line-height: 1 !important; }
body.zoom-overblik td.celle .oprind { display: none !important; }
body.zoom-overblik #visOprind { display: none !important; }
#dashboard .panel.genveje-kort[data-mere-findes="1"] .genvej:not([data-vagt]) { display: none; }   /* CG-V9-07: generelle genveje ligger i Mere */

/* Felter berørt af et godkendt vagtbytte (Rudi 13/10-2026) */
td.celle.byttet { box-shadow: inset 0 0 0 3px var(--roed) !important; }
td.celle.byttet::before { content: "⇄"; position: absolute; left: 2px; top: 0; font-size: 9px; line-height: 1; color: var(--roed); }
td.celle { position: relative; }
body.zoom-overblik td.celle.byttet::before { display: none; }

/* v13: byttede felter – flere bytter, tryk på mobil */
td.celle.byttet { cursor: help; }

/* ===================== Ferieoverblik (CG-REQ-20261014-03) ===================== */
.fo-panel { box-shadow: var(--skygge) !important; background: var(--flade) !important; }
.opg-gruppe > .fo-panel { grid-column: 1 / -1; background: var(--papir) !important; box-shadow: none !important; }   /* Rudi 15/10: samme farve som de øvrige kort i Administration */
.opg-kolonner:has(.fo-panel) .opg-gruppe[data-g="Administration"] { grid-column: 1 / -1; }
.fo-to { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 18px 28px; margin-top: 8px; }
.fo-konto { min-width: 0; }
.fo-hoved { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 6px 0 8px; border-bottom: 2px solid var(--linje); font-size: 15px; }
.fo-frist { font-size: 13px; font-weight: 600; color: var(--daempet); white-space: nowrap; }
.fo-tabel { width: 100%; border-collapse: collapse; font-size: 14px; table-layout: fixed; }
.fo-tabel th { text-align: left; font-size: 12px; font-weight: 700; color: var(--daempet); padding: 8px 6px 6px; border-bottom: 1px solid var(--linje); }
.fo-tabel td { padding: 8px 6px; border-bottom: 1px solid var(--linje); vertical-align: top; overflow-wrap: anywhere; }
.fo-tabel th.tal, .fo-tabel td.tal { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; width: 34%; }
.fo-tabel th:last-child, .fo-tabel td:last-child { width: 36%; }
.fo-status { font-weight: 600; }
.fo-status.mangler { color: var(--or-fg); }
.fo-status.over { color: var(--roed-fg); }
.fo-status.ok { color: var(--ok-fg); }
.fo-status.ukendt { color: var(--daempet); font-style: italic; }
.fo-antal { margin: 6px 0 0; text-align: right; }
.fo-bund { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 14px; }
.fo-vaerktoej { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 4px 0 12px; }
.fo-vaerktoej .nd-tabs { margin: 0; }
.fo-vaerktoej input[type=search] { flex: 1 1 200px; min-width: 160px; }
.fo-indhold .fo-tabel td { padding: 10px 8px; }
@media (max-width: 700px) {
  .fo-tabel, .fo-tabel tbody, .fo-tabel tr { display: block; }
  .fo-tabel thead { display: none; }
  .fo-tabel tr { padding: 8px 0; border-bottom: 1px solid var(--linje); display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; }
  .fo-tabel td { display: block; border: 0; padding: 0; width: auto !important; }
  .fo-tabel td:first-child { grid-column: 1 / -1; font-weight: 700; }
  .fo-tabel td.tal { text-align: left; }
  .fo-tabel td.tal::before { content: attr(data-l) ": "; color: var(--daempet); font-size: 12px; }
  .fo-hoved { flex-direction: column; align-items: flex-start; gap: 2px; }
}

.fo-timer { display: block; font-size: 11px; color: var(--daempet); font-weight: 500; }
.fo-tael { margin: 0 0 8px; }

/* ===================== Del B (v22): Mere-gitter, Ferie/Backup-sider, mangler to-delt ===================== */
#mereIndre { max-width: 1440px; margin: 0 auto; }
.mere-gruppe { margin: 0 0 22px; }
.mere-gruppe-titel { font-size: 13px; font-weight: 700; color: var(--daempet); letter-spacing: .02em; text-transform: uppercase; margin: 0 0 8px; }
.genveje.mere-kort { grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 10px; }
.mere-under > .panel, #mereIndre > .panel { width: 100%; max-width: none; box-sizing: border-box; }
.ferie-fane { margin-top: 8px; }
.haandteret { display: flex; flex-direction: column; gap: 4px; padding: 10px 0; border-bottom: 1px solid var(--linje); }
.haandteret .h-top { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.haandteret .ignorer-linje { padding: 0; }

/* ===================== NY-V20-03 Hjem-kerne · NY-V20-04 ens kolonner ===================== */
.dash-indre > .hero { margin-bottom: -8px; }
.dash-indre > .panel:has(> .idag-top) { margin-top: 0; }
.dash-indre > .tre-kol { grid-column: span 1; align-self: start; }
.dash-indre > .genveje-kort { display: none; }   /* NY-V20-07: alle funktioner findes i Mere */
#gitterOmslag table { table-layout: fixed; }
#gitterOmslag td.celle { overflow: hidden; white-space: normal; overflow-wrap: anywhere; line-height: 1.05; padding: 2px 1px; }
#gitterOmslag td.celle.lang-kode { font-size: 10px; letter-spacing: -.02em; }
body.zoom-fokus #gitterOmslag td.celle.lang-kode { font-size: 12px; }
body.zoom-overblik #gitterOmslag td.celle.lang-kode { font-size: 7.5px; }
#gitterOmslag thead th { overflow: hidden; }

#gitterOmslag table { border-spacing: 2px; }
#gitterOmslag th, #gitterOmslag td { box-sizing: border-box; min-width: 0 !important; }
#gitterOmslag td.celle { width: auto !important; }

/* ===================== v23: datoboks Overblik|Beskeder · beskedguide ===================== */
.dag-tabs { margin: 4px 0 12px; }
.dag-beskeder .dag-besked { display: flex; flex-direction: column; gap: 3px; padding: 10px 0; }
.dag-beskeder .dag-besked p { margin: 0; white-space: pre-wrap; }
.dag-beskeder .dag-besked.ulaest strong::before { content: "● "; color: var(--roed); }
.dag-skriv { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--linje); }
.dag-skriv select { width: 100%; }
.bsk-tabs { margin: 6px 0 14px; }
.bsk-trin { display: flex; flex-direction: column; gap: 8px; padding: 14px 16px; border-radius: 14px; background: var(--papir); }
.bsk-trin h4.sektion { margin: 0 0 4px; }
.bsk-nav { display: flex; align-items: center; gap: 12px; margin-top: 12px; }
.bsk-nav .bsk-status { margin: 0 auto; }
#bsTam[data-skjul="1"] { display: none !important; }

/* v24: ulæst-prik på datooverskrift (ændrer ikke kolonnebredde) + direkte besked i guiden */
/* CG-P24-04 (nat 14/10): den globale "thead th { position: relative }" er fjernet – den ophævede index.html's sticky.
   En sticky celle er selv "positioneret", så prikken (position:absolute) placeres stadig korrekt. To fastholdte rækker:
   datorækken top 0, bemandingsrækken top = målt datorækkehøjde (nyt-design.js, ResizeObserver). Hjørnet ligger øverst. */
#gitterOmslag thead tr:first-child th { position: sticky; top: 0; z-index: 3; background: var(--flade); }
#gitterOmslag thead tr:first-child th.idag { z-index: 3; }
#gitterOmslag thead th.navn { position: sticky; left: 0; z-index: 5 !important; }
#gitterOmslag thead tr.nd-bemrk th { z-index: 3; }
#gitterOmslag thead tr.nd-bemrk th.navn { z-index: 5 !important; }
.nd-ulaest { position: absolute; top: 1px; right: 1px; min-width: 14px; height: 14px; padding: 0 3px; border-radius: 7px; background: var(--accent); color: #fff; font-size: 9px; font-weight: 800; line-height: 14px; text-align: center; pointer-events: none; }
thead th.idag .nd-ulaest { background: #fff; color: var(--accent-moerk); }
.bsk-direkte label { display: grid; gap: 4px; margin: 8px 0; }
.bsk-direkte select, .bsk-direkte input, .bsk-direkte textarea { width: 100%; box-sizing: border-box; }

/* ===================== Nat 14/10 (CG-NY-07): kode + oprindelse som samlet centreret blok ===================== */
#gitterOmslag td.celle.har-oprind { vertical-align: middle !important; padding-top: 2px !important; padding-bottom: 2px !important; height: auto; }
#gitterOmslag td.celle .celle-blok { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; max-width: 100%; line-height: 1.05; }
#gitterOmslag td.celle .celle-blok .celle-kode { display: block; max-width: 100%; overflow-wrap: anywhere; }
#gitterOmslag td.celle .celle-blok .oprind { position: static !important; display: block; bottom: auto !important; left: auto; right: auto; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
body.skjul-oprind #gitterOmslag td.celle .celle-blok .oprind, body.zoom-overblik #gitterOmslag td.celle .celle-blok .oprind { display: none !important; }

/* ===================== Nat 14/10 (CG-NY-06): ens Mere-kort på tværs af grupper ===================== */
/* auto-fill (ikke auto-fit): en gruppe med få kort får samme kortbredde som de andre grupper. Fælles minimumshøjde, der
   rummer titel + to linjers undertekst, så alle kort på et niveau er lige høje; ikon/titel/undertekst centreres lodret som
   én blok; lange labels ombrydes uden klipning. Mobil: én kolonne med samme vandrette opbygning (bedst læsbarhed). */
.genveje.mere-kort { grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); align-items: stretch; }
.mere-kort .genvej { box-sizing: border-box; height: 100%; min-height: 104px; align-content: center; overflow-wrap: anywhere; }
.mere-kort .genvej .gv-t, .mere-kort .genvej small { min-width: 0; }
@media (max-width: 600px) {
  .genveje.mere-kort { grid-template-columns: minmax(0, 1fr); }
  .mere-kort .genvej { grid-template-columns: 44px 1fr; row-gap: 0; justify-items: start; text-align: left; min-height: 104px; }
  .mere-kort .genvej .gv-ikon { grid-row: 1 / span 2; }
  .mere-kort .genvej small { grid-column: 2; }
}

/* ===================== Nat 14/10 (CG-NY-06): filter over begge mangelkolonner ===================== */
/* Før lå "Vis de næste" og opsummeringen UNDER højre kolonne, fordi den højre kolonne optog række 2-7. Nu: overskrift (1),
   filter (2) og opsummering (3) spænder begge kolonner; åbne mangler (venstre) og håndterede (højre) starter begge i række 4. */

/* v27 (Rudi 15/10-2026): ændret arbejdstid – rødt hjørne nederst til venstre (øvrige hjørner bruges af kommentar, FIRECAT, forslag og bytte) */
td.celle .at-mark { position: absolute; left: 3px; bottom: 3px; width: 0; height: 0; border-style: solid; border-width: 11px 0 0 11px; filter: drop-shadow(0 0 1px rgba(255,255,255,.9)); border-color: transparent transparent transparent var(--roed); pointer-events: none; }
td.celle.aendret-tid { cursor: help; }
body.zoom-overblik td.celle .at-mark { left: 1px; bottom: 1px; border-width: 7px 0 0 7px; }

/* v28 (Rudi 15/10-2026): TAM-ugeliste */
.tam-uge .tam-uger .nd-tab small { font-weight: 500; color: var(--daempet); }
.tam-resultat h3 { margin: 12px 0 6px; font-size: 16px; }
.tam-ma { margin: 14px 0; }
.tam-ma h4 { margin: 0 0 6px; font-size: 14px; }
.tam-tabel { width: 100%; border-collapse: collapse; font-size: 13px; }
.tam-tabel th { text-align: left; font-size: 12px; color: var(--daempet); border-bottom: 1px solid var(--linje); padding: 4px 6px; }
.tam-tabel td { padding: 4px 6px; border-bottom: 1px solid var(--linje); vertical-align: top; }
.tam-tabel td.tal { text-align: right; font-variant-numeric: tabular-nums; }
.tam-tabel td.tam-kode { font-weight: 700; }
.tam-tabel tr.tam-afvig td { background: var(--roed-bg); color: var(--roed-fg); font-weight: 700; }
.tam-tabel tr.tam-ukendt td { color: var(--or-fg); }
.tam-tabel tr.tam-fortsat td { color: var(--daempet); }
.tam-tabel tr.tam-udenfor td { color: var(--daempet); font-style: italic; }
@media (max-width: 700px) { .tam-tabel { font-size: 12px; display: block; overflow-x: auto; } }
/* v28: kommentarfeltet i FIRECAT-tildelingen står på sin egen linje under navn/fra/til */
.fc-plads .fc-kom { grid-column: 1 / -1; }
.fc-plads .fc-kom input { width: 100%; box-sizing: border-box; }
/* v29 (Q14): tællerne manglende 24F / 24T */
th.status-kol.taeller-kol, td.status-kol.taeller-kol { background: var(--papir) !important; }
td.status-kol.taeller-kol .neg, .taeller-mgl.neg, td.taeller-celle.neg { color: var(--roed); font-weight: 800; }
td.status-kol.taeller-kol .t24-hidtil { display: block; font-weight: 800; }
.taeller-linje { margin: 6px 0 10px; line-height: 1.5; }
.taeller-linje .taeller-mgl, .taeller-linje .taeller-24t { display: block; }
.tam-taeller { margin: 2px 0 6px; }
/* v29 (Rudi 15/10 kl. 17.17): "Åbne mangler" som to ens bokse – mangler til venstre, håndterede til højre */
.mangler-to-bokse { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; margin-top: 8px; }
.mangler-to-bokse > .panel { margin: 0; box-shadow: none !important; background: var(--papir) !important; border-radius: 14px; padding: 14px 16px; min-width: 0; }
.mangler-to-bokse > .panel > h2 { font-size: 15px; }
.mangler-to-bokse .mangel-liste { margin: 0; }
.mangler-to-bokse .mangel-liste button { width: 100%; }
@media (max-width: 820px) { .mangler-to-bokse { grid-template-columns: 1fr; } }
/* v29 (Rudi 15/10 kl. 17.32): VH-mærket ved indsatslederne – én farve pr. vagthold */
.holdtag[data-vh] { color: #fff; font-weight: 800; background: #33404F; }   /* VH8+ : mørk grå (review M4) */
.holdtag[data-vh="1"] { background: #C8161D; }
.holdtag[data-vh="2"] { background: #1F5FBF; }
.holdtag[data-vh="3"] { background: #2E7D32; }
.holdtag[data-vh="4"] { background: #B35C00; }
.holdtag[data-vh="5"] { background: #6B3FA0; }
.holdtag[data-vh="6"] { background: #0E7C7B; }
.holdtag[data-vh="7"] { background: #5A6573; }
/* v29 (Q21): erstatningsguide efter Tast periode */
.erstat-liste { margin: 8px 0 12px; padding-left: 22px; line-height: 1.6; }
.erstat-liste .erstat-nu { font-weight: 800; }
.erstat-liste .erstat-ok .fn { color: var(--ok-fg); }
.erstat-liste .erstat-mangel .fn { color: var(--roed); }
.erstat-kandidater { display: flex; flex-direction: column; gap: 6px; max-height: 50vh; overflow: auto; }
.erstat-kandidater .erstat-valg { justify-content: flex-start; text-align: left; gap: 6px; flex-wrap: wrap; }
/* v29 (review M7): FIRECAT-kommentar (rødt hjørne øverst til højre) + dagskommentar → blå trekant øverst til venstre */
td.celle.tildelt.fc-note.har-kommentar { background-image: linear-gradient(135deg, var(--accent) 0 7px, transparent 7px) !important; }
