/* Genereret af tools/build-assets.php; rediger kildefilerne. */
/* Samler fælles designsystem samt arbejdsoversigt, opgavedetaljer og sessionstilstande. */
/* Fælles optiTask-tokens og basis; designretning godkendt 2026-11-09. */
:root {
    color-scheme: light;
    --page: #f4f7f7;
    --surface: #ffffff;
    --ink: #182b2e;
    --muted: #53676b;
    --accent: #17645c;
    --accent-hover: #114d46;
    --accent-soft: #e4f0ec;
    --deep: #103e3a;
    --deep-edge: #0b302d;
    --on-deep: #ffffff;
    --on-deep-muted: #b6ceca;
    --on-deep-accent: #99caba;
    --border: #d9e2e3;
    --field-border: #7b8d90;
    --focus: #185abd;
    --focus-inverse: #b4eddf;
    --success: #226548;
    --warning: #895400;
    --error: #b42336;
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;
    --space-10: 40px;
    --space-12: 48px;
    --space-16: 64px;
    --radius-control: 6px;
    --radius-panel: 10px;
    --font: system-ui, "Segoe UI", sans-serif;
    font-family: var(--font);
    color: var(--ink);
    background: var(--page);
    line-height: 1.5;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
    outline: 3px solid var(--focus); outline-offset: 3px;
}
h1, h2, h3, p { margin: 0; }
h1 { font-size: clamp(30px, 3.4vw, 46px); line-height: 1.12; letter-spacing: -0.045em; font-weight: 650; }
h2 { font-size: 24px; line-height: 1.25; letter-spacing: -0.035em; font-weight: 650; }
h3 { font-size: 16px; line-height: 1.4; font-weight: 650; }
.muted, .field-help { color: var(--muted); }
.field-help { font-size: 12px; line-height: 1.6; margin-top: var(--space-3); color: var(--muted); }
.eyebrow { color: var(--accent); font-size: 10px; font-weight: 700; letter-spacing: 0.16em; margin-bottom: var(--space-4); }
.wordmark { display: inline-flex; font-size: 31px; letter-spacing: -0.065em; font-weight: 450; line-height: 1.2; }
.wordmark span { font-weight: 750; }
.graphic-surface { background-color: var(--deep); background-image: url("flow-grid.401040fff51e78b81fd1.svg"); }
a { color: var(--accent); }
button:disabled { cursor: not-allowed; }
.icon { display: inline-block; width: 20px; height: 20px; flex: 0 0 auto; vertical-align: middle; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

/* Fælles formularfelter, knapper, sektioner og serverbeskeder. */
label { display: block; font-size: 13px; font-weight: 600; margin: var(--space-6) 0 var(--space-2); }
input, select, textarea {
    display: block; width: 100%; max-width: 100%; min-width: 0; min-height: 48px;
    color: var(--ink); background: var(--surface); border: 1px solid var(--field-border);
    border-radius: var(--radius-control); padding: var(--space-3); font-size: 15px;
}
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
textarea { resize: vertical; }
select:disabled { background: var(--page); color: var(--muted); opacity: 1; }
.button {
    display: inline-flex; align-items: center; justify-content: center; gap: var(--space-4); min-height: 48px;
    padding: var(--space-3) var(--space-5); border: 1px solid transparent;
    border-radius: var(--radius-control); font-size: 13px; font-weight: 650;
    transition: background 140ms, border-color 140ms; text-decoration: none;
}
.button-primary { color: var(--on-deep); background: var(--accent); }
.button-primary:hover { background: var(--accent-hover); }
.button-secondary { color: var(--ink); background: var(--surface); border-color: var(--border); }
.button-secondary:hover { background: var(--accent-soft); border-color: var(--accent); }
.button-full { width: 100%; }
.text-button {
    display: inline-flex; align-items: center; gap: var(--space-3); min-height: 44px; padding: var(--space-2) 0;
    color: var(--accent); background: transparent; border: 0; font-size: 13px; font-weight: 600; text-align: left; text-decoration: none;
}
.text-button:hover { text-decoration: underline; text-underline-offset: 4px; }
.card-divider { height: 1px; background: var(--border); margin: var(--space-8) 0; }
.task-form { padding: var(--space-8); }
.section-heading { display: flex; align-items: flex-start; gap: var(--space-4); }
.section-heading h2 { font-size: 19px; letter-spacing: -0.025em; }
.section-heading p { font-size: 12px; color: var(--muted); margin-top: var(--space-1); }
.step-number { color: var(--accent); font-size: 12px; font-variant-numeric: tabular-nums; line-height: 26px; padding-right: var(--space-4); border-right: 1px solid var(--border); }
.field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.field-grid > div { min-width: 0; }
.form-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-6); border-top: 1px solid var(--border); padding-top: var(--space-6); margin-top: var(--space-8); }

.button:disabled { opacity: 0.55; }
.notice {
    --notice-color: var(--accent);
    color: var(--ink); background: var(--surface); border: 1px solid var(--border);
    border-left: 3px solid var(--notice-color); padding: var(--space-4);
    border-radius: var(--radius-control); margin: var(--space-4) 0; font-size: 14px;
}
.notice--error, .notice-error { --notice-color: var(--error); }
.notice--success, .notice-success { --notice-color: var(--success); }
.notice--warning { --notice-color: var(--warning); }
.notice[data-form-error]:focus { outline: 3px solid var(--focus); outline-offset: 3px; }

/* Adgangskodens synlighed er en supplerende kontrol, som først vises efter JavaScript-opstart. */
.password-field { position: relative; }
.password-field.has-toggle input { padding-inline-end: calc(var(--space-12) + var(--space-3)); }
.password-toggle {
    display: inline-flex; align-items: center; justify-content: center;
    position: absolute; inset-inline-end: 2px; top: 2px; width: 44px; height: 44px;
    padding: 0; border: 0; border-radius: var(--radius-control);
    background: transparent; color: var(--muted);
    transition: background-color 140ms, color 140ms;
}
.password-toggle > span { display: inline-flex; }
.password-toggle:hover { background: var(--accent-soft); color: var(--accent); }
.password-toggle:focus-visible { outline-offset: 1px; }
.password-field.has-toggle input::-ms-reveal { display: none; }
.password-recovery { margin-top: var(--space-2); }

/* Faste stamdata og konfliktfeedback bruger samme rytme som de redigerbare felter. */
.fixed-field { margin: var(--space-6) 0 0; }
.fixed-field dt { font-size: 13px; font-weight: 600; }
.fixed-field dd { margin: var(--space-2) 0 0; }
.unavailable-assignees { border-top: 1px solid var(--border); margin-top: var(--space-4); padding-top: var(--space-4); }
.unavailable-assignees ul { margin: 0 0 var(--space-3); padding-left: var(--space-5); }
.unavailable-assignees li { margin: var(--space-2) 0; overflow-wrap: anywhere; }
.edit-conflict { margin-bottom: var(--space-8); }
.edit-conflict p { font-size: 14px; }
.edit-conflict .text-button { margin-top: var(--space-2); }

/* Adgangsvisninger: grafisk mørk flade og lys kontoformular. */
.access-screen {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(400px, 480px); align-items: center;
    gap: var(--space-16); min-height: 100vh; padding: var(--space-16) 7%;
    background-size: cover; background-position: center; color: var(--on-deep);
}
.access-intro { display: flex; flex-direction: column; align-self: stretch; min-width: 0; }
.access-intro .wordmark { align-self: flex-start; }
.access-copy { margin: auto 0; padding: var(--space-16) 0 var(--space-12); }
.access-copy .eyebrow { color: var(--on-deep-muted); margin-bottom: var(--space-6); }
.access-copy h1 { font-size: clamp(42px, 4.4vw, 72px); line-height: 1.08; font-weight: 550; letter-spacing: -0.055em; }
.access-copy h1 span { color: var(--on-deep-accent); }
.access-copy > p:last-child { color: var(--on-deep-muted); font-size: 17px; line-height: 1.8; margin-top: var(--space-8); max-width: 46ch; }
.access-footnote { display: flex; align-items: center; gap: var(--space-4); color: var(--on-deep-muted); font-size: 9px; letter-spacing: 0.12em; }
.fine-rule { display: block; width: 40px; height: 1px; background: var(--on-deep-accent); flex: 0 0 auto; }
.access-card {
    color: var(--ink); background: var(--surface); border: 1px solid var(--surface);
    padding: var(--space-12); border-radius: var(--radius-panel); box-shadow: 0 24px 80px #082b2b38;
}
.access-card h2 { font-size: 29px; margin-bottom: var(--space-3); }
.access-card > .muted { font-size: 14px; margin-bottom: var(--space-8); }
.access-card .button-full { margin-top: var(--space-8); justify-content: space-between; padding-right: var(--space-5); padding-left: var(--space-5); }
.account-prompt { font-size: 13px; color: var(--muted); }
.registration-screen { grid-template-columns: minmax(0, 1fr) minmax(440px, 540px); }
.registration-screen .access-copy h1 { font-size: clamp(36px, 3.9vw, 62px); }
.registration-card { padding: var(--space-10); }
.registration-card .card-divider { margin: var(--space-6) 0; }
.registration-card .field-grid label { margin-top: var(--space-4); }
.access-intro a:focus-visible { outline-color: var(--focus-inverse); }
.access-links { display: grid; justify-items: start; gap: var(--space-1); margin-top: var(--space-5); }
.account-email { font-weight: 600; overflow-wrap: anywhere; }
.access-card .password-recovery + .button-full { margin-top: var(--space-4); }

/* Loginets ventekort genbruger adgangssidens farver og forløbsgeometri uden layoutspring. */
.login-card { position: relative; isolation: isolate; }
.login-card [data-login-content] > .muted { font-size: 14px; margin-bottom: var(--space-8); }
.login-transition {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--space-8);
    padding: var(--space-6);
    border-radius: inherit;
    color: var(--on-deep);
    background-size: cover;
    background-position: center;
    text-align: center;
}
.login-transition-brand { width: min(100%, 280px); }
.login-transition .wordmark { font-size: 40px; }
.login-transition-flow {
    display: block;
    width: 100%;
    height: auto;
    margin-top: var(--space-6);
    color: var(--on-deep-accent);
}
.login-transition-flow g { opacity: 0.25; }
.login-transition-status { color: var(--on-deep-muted); font-size: 14px; }
.login-transition-announcement {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}
.login-card.is-submitting [data-login-content] { visibility: hidden; }

/* Arbejdsflade, navigation, overblik og støttepaneler. */
.workspace { display: grid; grid-template-columns: 248px minmax(0, 1fr); min-height: 100vh; }
.sidebar {
    display: flex; flex-direction: column; padding: var(--space-10) var(--space-5);
    color: var(--on-deep); background-size: auto 850px; background-position: left bottom; background-repeat: no-repeat;
}
.sidebar .wordmark { padding: 0 var(--space-3); font-size: 29px; }
.sidebar-caption { margin: var(--space-16) var(--space-3) var(--space-5); font-size: 9px; letter-spacing: 0.16em; color: var(--on-deep-muted); }
.sidebar nav { display: grid; gap: var(--space-2); }
.nav-item {
    display: flex; align-items: center; gap: var(--space-3); width: 100%; min-height: 48px;
    padding: var(--space-3); border: 1px solid transparent; border-radius: var(--radius-control);
    background: transparent; color: var(--on-deep-muted); font-size: 13px; text-align: left; text-decoration: none;
}
.nav-item .icon { width: 18px; height: 18px; }
.nav-item:hover { color: var(--on-deep); background: #ffffff0a; }
.sidebar .is-active { color: var(--on-deep); background: #ffffff10; border-color: #ffffff1a; font-weight: 600; }
.sidebar a:focus-visible, .sidebar button:focus-visible { outline-color: var(--focus-inverse); }
.sidebar-bottom { margin: auto var(--space-3) 0; padding-top: var(--space-16); font-size: 12px; }
.sidebar-bottom > span:last-child { display: block; margin-top: var(--space-2); font-size: 10px; color: var(--on-deep-muted); }
.sidebar-rule { display: block; width: 32px; height: 2px; background: var(--on-deep-accent); margin-bottom: var(--space-6); }
.sidebar-bottom strong { font-weight: 500; }
.workspace-content { min-width: 0; }
.workspace-top {
    display: flex; align-items: center; justify-content: space-between; gap: var(--space-4);
    min-height: 80px; padding: var(--space-4) var(--space-10); border-bottom: 1px solid var(--border);
    background: var(--surface); color: var(--muted); font-size: 12px;
}
.context-label { display: flex; align-items: center; gap: var(--space-3); }
.context-marker { width: 8px; height: 8px; border: 1px solid var(--field-border); border-radius: 50%; }
.workspace-context { font-size: 11px; }
.page-heading {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-6);
    padding: var(--space-12) var(--space-10); position: relative; isolation: isolate;
}
.graphic-heading::before {
    content: ""; position: absolute; inset: 0 0 0 30%; z-index: -1; pointer-events: none;
    background: url("flow-grid.401040fff51e78b81fd1.svg") center 42% / 850px auto; opacity: 0.2;
}
.page-heading h1 { margin-bottom: var(--space-4); }
.page-heading .muted { font-size: 14px; }
.panel { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-panel); }
.panel-heading { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: var(--space-6) var(--space-8); border-bottom: 1px solid var(--border); }
.panel-heading h2 { font-size: 17px; letter-spacing: -0.02em; }
.panel-heading p { font-size: 12px; margin-top: var(--space-1); }
.subtle-tag { border: 1px solid var(--border); background: var(--surface); border-radius: 4px; padding: 6px var(--space-2); color: var(--muted); font-size: 10px; white-space: nowrap; }
.dashboard-layout { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: var(--space-8); padding: 0 var(--space-10); }
.empty-state { display: flex; align-items: center; flex-direction: column; text-align: center; padding: var(--space-12) var(--space-6) var(--space-16); }
.empty-illustration { width: 110px; height: 88px; stroke: var(--accent); fill: var(--surface); stroke-width: 1.2; margin-bottom: var(--space-6); }
.empty-illustration .illustration-guide { stroke: var(--border); stroke-dasharray: 2 5; fill: none; }
.empty-state h3 { font-size: 23px; font-weight: 600; letter-spacing: -0.035em; }
.empty-state p { color: var(--muted); font-size: 14px; line-height: 1.7; margin: var(--space-3) 0 var(--space-6); }
.getting-started { padding: var(--space-8) var(--space-2); }
.getting-started h2 { font-size: 25px; }
.process-list { list-style: none; padding: 0; margin: var(--space-8) 0; }
.process-list li { display: flex; gap: var(--space-4); padding: var(--space-5) 0; border-bottom: 1px solid var(--border); }
.process-list li:first-child { border-top: 1px solid var(--border); }
.process-list li > span { color: var(--accent); font-size: 11px; padding-top: 2px; font-variant-numeric: tabular-nums; }
.process-list h3 { font-size: 13px; }
.process-list p { color: var(--muted); font-size: 12px; margin-top: var(--space-1); }
.workspace-footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-4); margin: var(--space-8) var(--space-10); color: var(--muted); font-size: 10px; }
.workspace-footer > span:first-child { color: var(--ink); font-weight: 650; }
.task-layout { display: grid; grid-template-columns: minmax(0, 800px) minmax(220px, 280px); gap: var(--space-10); padding: 0 var(--space-10) var(--space-12); align-items: start; }
.plan-note { padding: var(--space-8) 0; max-width: 38ch; }
.plan-note h2 { margin-bottom: var(--space-6); font-size: 25px; }
.plan-note > p:not(.eyebrow) { color: var(--muted); font-size: 13px; line-height: 1.8; }
.plan-diagram { display: flex; align-items: center; padding: var(--space-8) var(--space-6) var(--space-4); }
.plan-diagram span { width: 9px; height: 9px; border: 1px solid var(--accent); border-radius: 50%; }
.plan-diagram span:first-child { background: var(--accent); }
.plan-diagram i { height: 1px; flex: 1; background: var(--border); }
.plan-labels { display: flex; justify-content: space-between; gap: var(--space-2); color: var(--muted); font-size: 9px; margin-bottom: var(--space-8); }
.account-panel { max-width: 640px; }
.account-panel + .account-panel { margin-top: var(--space-8); }
.account-panel fieldset { min-width: 0; border: 1px solid var(--border); border-radius: var(--radius-control); padding: var(--space-4); }
.account-panel .panel-heading .icon { color: var(--accent); }
.account-link[aria-current="page"] { color: var(--ink); text-decoration: underline; text-underline-offset: 4px; }

/* Opgavens historik følger samme indholdsbredde som detaljer og kvittering. */
.task-main-stack { display: grid; gap: var(--space-8); min-width: 0; }
.task-section-title { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-4); }
.history-body { padding: var(--space-8); }
.history-list { list-style: none; margin: 0; padding: 0; }
.history-event + .history-event { border-top: 1px solid var(--border); padding-top: var(--space-8); margin-top: var(--space-8); }
.history-event-heading { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: var(--space-4); }
.history-event-heading h3 { font-size: 15px; font-weight: 650; overflow-wrap: anywhere; }
.history-event-heading p { font-size: 13px; }
.history-reason { margin-top: var(--space-5); font-size: 14px; }
.history-changes { margin: var(--space-6) 0 0; }
.history-change { border-top: 1px solid var(--border); padding: var(--space-4) 0; }
.history-change dt { margin-bottom: var(--space-3); font-size: 13px; font-weight: 650; }
.history-change dd { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); margin: 0; }
.history-change dd > div { min-width: 0; }
.history-change dd p { font-size: 14px; overflow-wrap: anywhere; }
.history-snapshot dd { grid-template-columns: minmax(0, 1fr); }
.history-value-label { display: block; margin-bottom: var(--space-1); color: var(--muted); font-size: 12px; font-weight: 500; }
.history-pagination { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-4); border-top: 1px solid var(--border); padding-top: var(--space-4); margin-top: var(--space-6); }

/* Fælles responsiv tilpasning og reduceret bevægelse; indlæses sidst. */
@media (min-width: 1800px) {
    .access-screen { grid-template-columns: minmax(0, 1fr) 520px; padding-left: 12%; padding-right: 12%; gap: 8%; }
    .access-copy h1 { font-size: 84px; }
    .dashboard-layout { grid-template-columns: minmax(0, 1fr) 320px; gap: var(--space-12); }
    .task-layout { grid-template-columns: minmax(0, 900px) 320px; gap: var(--space-12); }
}
@media (max-width: 1180px) {
    .access-screen { padding: var(--space-12) var(--space-10); gap: var(--space-10); grid-template-columns: minmax(0, 1fr) 420px; }
    .access-card { padding: var(--space-8); }
    .access-copy h1 { font-size: 46px; }
    .workspace { grid-template-columns: 216px minmax(0, 1fr); }
    .sidebar { padding-left: var(--space-3); padding-right: var(--space-3); }
    .dashboard-layout, .task-layout { grid-template-columns: minmax(0, 1fr); }
    .getting-started { max-width: 640px; }
    .process-list { display: flex; gap: var(--space-6); }
    .process-list li { flex: 1; border-top: 1px solid var(--border); }
    .plan-note { max-width: 520px; padding-top: 0; }
}
@media (max-width: 900px) {
    input, select, textarea { font-size: 16px; }
    .access-screen { grid-template-columns: minmax(0, 1fr); gap: var(--space-8); padding: var(--space-10); }
    .access-intro { display: block; }
    .access-copy { padding: var(--space-10) 0 0; }
    .access-copy h1, .registration-screen .access-copy h1 { font-size: clamp(36px, 6.5vw, 58px); }
    .access-copy h1 br { display: none; }
    .access-copy > p:last-child { font-size: 15px; margin-top: var(--space-5); }
    .access-footnote { display: none; }
    .access-card { max-width: 560px; width: 100%; }
    .registration-screen { background-position: center top; }
    .workspace { grid-template-columns: 190px minmax(0, 1fr); }
    .sidebar .wordmark { font-size: 27px; }
    .nav-item { font-size: 12px; gap: var(--space-2); padding: var(--space-3) var(--space-2); }
    .workspace-top, .page-heading { padding-left: var(--space-6); padding-right: var(--space-6); }
    .dashboard-layout, .task-layout { padding-left: var(--space-6); padding-right: var(--space-6); }
    .process-list { display: block; }
    .process-list li { border-top: 0; }
}
@media (max-width: 650px) {
    .access-screen { padding: var(--space-8) var(--space-5); }
    .wordmark { font-size: 29px; }
    .access-copy { padding-top: var(--space-10); }
    .access-copy .eyebrow { font-size: 9px; margin-bottom: var(--space-4); }
    .access-copy h1, .registration-screen .access-copy h1 { font-size: 38px; }
    .access-copy h1 br { display: block; }
    .access-card { padding: var(--space-8) var(--space-6); }
    .access-card h2 { font-size: 25px; }
    .sidebar-caption, .sidebar-bottom { display: none; }
    .nav-item { font-size: 12px; padding: var(--space-3); }
    .workspace-top { padding: var(--space-3) var(--space-4); flex-wrap: wrap; min-height: 56px; font-size: 11px; }
    .workspace-context { display: none; }
    .page-heading { padding: var(--space-8) var(--space-4); }
    .graphic-heading::before { inset: 0 0 0 10%; opacity: 0.1; }
    .page-heading h1 { font-size: 34px; }
    .dashboard-layout, .task-layout { padding: 0 var(--space-4) var(--space-8); gap: var(--space-6); }
    .panel-heading { padding: var(--space-5); }
    .empty-state { padding: var(--space-8) var(--space-5) var(--space-10); }
    .empty-state h3 { font-size: 22px; }
    .empty-state p br { display: none; }
    .getting-started { padding: 0 var(--space-2); }
    .getting-started h2 br { display: none; }
    .workspace-footer { margin: 0 var(--space-4) var(--space-6); }
    .task-form { padding: var(--space-6) var(--space-5); }
    .field-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
    .form-actions { gap: var(--space-4); }
    .plan-note { max-width: none; padding: 0 var(--space-2); }
    .history-body { padding: var(--space-6) var(--space-5); }
    .history-change dd { grid-template-columns: 1fr; gap: var(--space-4); }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; }
}

/* Sprogvalg genbruger tokens og har tekstnavne frem for nationalflag. */
.access-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--space-4);
}
.language-control { max-width: 100%; }
.language-selector {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    border: 1px solid var(--border);
    border-radius: var(--radius-control);
    padding: var(--space-1);
    margin: 0;
}
.language-selector button {
    min-height: 44px;
    padding: var(--space-2) var(--space-3);
    border: 0;
    border-radius: var(--radius-control);
    background: transparent;
    color: var(--muted);
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}
.language-selector button[aria-pressed="true"] { color: var(--accent); background: var(--accent-soft); }
.language-selector button:hover { text-decoration: underline; text-underline-offset: 4px; }
.access-header .language-selector { border-color: var(--on-deep-muted); }
.access-header .language-selector button { color: var(--on-deep); }
.access-header .language-selector button[aria-pressed="true"] { color: var(--deep); background: var(--on-deep); }
.access-header .language-selector button:focus-visible { outline-color: var(--focus-inverse); }
.language-no-script { max-width: 40ch; font-size: 12px; margin-top: var(--space-2); }
.language-dialog-actions { display: flex; gap: var(--space-5); flex-wrap: wrap; align-items: center; }
@media (max-width: 650px) {
    .access-header { align-items: flex-start; }
    .account-controls { gap: var(--space-3); }
    .language-control { flex: 0 0 auto; }
}

/* Fælles, kompakte historikrækker og auditdetaljer i det eksisterende designsystem. */
.history-panel-heading { flex-wrap: wrap; gap: var(--space-4); }
.history-panel-heading p { margin-top: var(--space-2); }
.history-empty { padding: var(--space-6) var(--space-8); }
.completion-list, .audit-list { list-style: none; padding: 0; margin: 0; }
.completion-row { display: grid; grid-template-columns: minmax(90px, .6fr) minmax(0, 3fr) minmax(120px, .8fr); gap: var(--space-4); align-items: start; padding: var(--space-4) var(--space-6); }
.completion-row + .completion-row, .audit-row + .audit-row { border-top: 1px solid var(--border); }
.completion-row[aria-current="true"] { border-left: var(--space-1) solid var(--accent); }
.completion-reference { font-size: 13px; font-weight: 650; align-self: center; }
.completion-facts { display: grid; grid-template-columns: 1fr 1.3fr 1.5fr; gap: var(--space-4); margin: 0; font-size: 13px; }
.completion-facts > div, .audit-row > div { min-width: 0; }
.completion-facts dt, .audit-event-metadata dt { color: var(--muted); font-size: 12px; }
.completion-facts dd, .audit-event-metadata dd { margin: var(--space-1) 0 0; }
.completion-user-id, .audit-reference { display: block; font-size: 12px; margin-top: var(--space-1); }
.completion-note { margin: 0; font-size: 13px; }
.completion-note[open] { grid-column: 1 / -1; }
.completion-note summary { cursor: pointer; color: var(--accent); padding: var(--space-3) 0; width: fit-content; }
.completion-note summary:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.completion-note p { margin: var(--space-2) 0; overflow-wrap: anywhere; }
.history-page-links { padding: var(--space-4) var(--space-8); margin: 0; }
.audit-workspace { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
.audit-filters > * { min-width: 0; }
.audit-filter-panel, .audit-event-panel { padding: var(--space-8); min-width: 0; }
.audit-filter-panel h2 { font-size: 18px; }
.audit-filters { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-4); margin-top: var(--space-5); }
.audit-filters label { margin-top: 0; }
.audit-filter-actions { grid-column: 1 / -1; margin: 0; }
.audit-search { grid-column: span 2; }
.audit-row { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, .8fr); gap: var(--space-5); align-items: center; padding: var(--space-5) var(--space-8); font-size: 13px; }
.audit-event-metadata { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); margin: var(--space-6) 0; }
.audit-event-panel .history-changes { max-width: 1100px; }
@media (max-width: 1100px) {
    .completion-row { grid-template-columns: minmax(0, 1fr); }
    .audit-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .audit-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 650px) {
    .audit-filters, .audit-event-metadata, .audit-row { grid-template-columns: minmax(0, 1fr); }
    .completion-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .completion-facts > div:last-child { grid-column: 1 / -1; }
    .audit-search { grid-column: auto; }
    .completion-row, .audit-row, .history-empty, .history-page-links, .audit-filter-panel, .audit-event-panel { padding: var(--space-5); }
    .audit-event-panel .history-change dd { grid-template-columns: minmax(0, 1fr); }
}

/* Opgavens arbejdsområde viser instruktion og kvittering direkte; kun sekundær planlægning kan foldes. */
.task-detail-heading { padding-block: var(--space-6); }
.task-detail { display: grid; gap: var(--space-5); }
.task-detail > *, .task-commandbar > * { min-width: 0; }
/* Sekundære handlinger er adskilt fra opgavens ene primære kvitteringsformular. */
.task-commandbar { display: grid; gap: var(--space-4); padding: var(--space-4); background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-panel); }
.task-command-links { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); min-width: 0; }
.task-command-links > a { min-height: 44px; padding: var(--space-3) var(--space-4); border-radius: var(--radius-control); overflow-wrap: anywhere; }
.task-command-links > .text-button:hover { background: var(--accent-soft); }
.task-detail-primary, .task-detail-context { display: grid; gap: var(--space-5); min-width: 0; align-items: start; }
.task-detail-primary-with-completion { grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr); }
.task-detail-primary > *, .task-detail-context > * { min-width: 0; }
.task-detail-context .task-detail-overview { background: var(--accent-soft); }
.task-detail-context .task-detail-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.task-detail-context .task-detail-facts > div:nth-child(2) { grid-column: 1 / -1; grid-row: 2; }
.task-detail-context .task-detail-facts > div:nth-child(3) { grid-column: 2; grid-row: 1; }
.task-completion { min-width: 0; border-top: 3px solid var(--accent); }
.task-completion-heading { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-5) var(--space-6); border-bottom: 1px solid var(--border); }
.task-completion-heading h2 { font-size: 20px; letter-spacing: -0.025em; }
.task-completion-icon { display: inline-flex; align-items: center; justify-content: center; padding: var(--space-2); color: var(--accent); background: var(--accent-soft); border-radius: var(--radius-control); }
.task-planning > summary::-webkit-details-marker { display: none; }
.task-disclosure-arrow { width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); flex: 0 0 auto; margin-left: var(--space-2); }
.task-planning[open] > summary .task-disclosure-arrow { transform: rotate(225deg); }
.task-detail summary:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.task-completion-body { padding: var(--space-6); }
.task-completion-body form { min-width: 0; }
.task-completion-body label:first-of-type { margin-top: 0; }
.task-completion-body .form-actions { margin-top: var(--space-5); padding-top: var(--space-5); }
.task-detail-overview { padding: var(--space-5) var(--space-8); }
.task-detail-facts { display: grid; grid-template-columns: minmax(140px, 1fr) minmax(0, 2fr) minmax(100px, 1fr); gap: var(--space-5) var(--space-8); margin: 0; }
.task-detail-facts > div { min-width: 0; }
.task-detail-facts dt { color: var(--muted); font-size: 12px; }
.task-detail-facts dd { margin: var(--space-1) 0 0; overflow-wrap: anywhere; font-size: 15px; }
.task-detail-facts time { font-variant-numeric: tabular-nums; }
.task-detail-section { padding: var(--space-6) var(--space-8); }
.task-detail-section h2 { font-size: 18px; }
.task-detail-section h3 { margin-top: var(--space-5); }
.task-detail-section > p { margin-top: var(--space-3); max-width: 78ch; overflow-wrap: anywhere; }
.task-completed-record { border-left: var(--space-1) solid var(--success); }
.task-planning > summary { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: var(--space-5) var(--space-8); cursor: pointer; font-weight: 600; font-size: 15px; list-style: none; }
.task-planning-body { border-top: 1px solid var(--border); padding: var(--space-5) var(--space-8); }
.task-planning-facts { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
.task-planning-body .field-help { max-width: 78ch; }
.task-related-link { justify-self: start; }
@media (max-width: 1200px) {
    .task-detail-primary-with-completion { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 900px) {
    .task-commandbar { display: flex; flex-direction: column; gap: var(--space-3); }
    .task-completion { width: 100%; }
}
@media (max-width: 650px) {
    .task-detail { gap: var(--space-4); }
    .task-command-links { align-items: stretch; }
    .task-command-links > a { flex: 1 1 auto; }
    .task-detail-overview, .task-detail-section, .task-completion-heading, .task-completion-body, .task-planning-body, .task-planning > summary { padding: var(--space-5); }
    .task-detail-facts { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
    .task-detail-context .task-detail-facts { grid-template-columns: minmax(0, 1fr); }
    .task-detail-context .task-detail-facts > div:nth-child(2), .task-detail-context .task-detail-facts > div:nth-child(3) { grid-column: auto; grid-row: auto; }
}

/* Sidemenuens foldbare administration; fælles navigation bevarer naturlig dokumentrulning. */
.sidebar-menu { min-width: 0; }
.sidebar-menu-toggle { display: flex; align-items: center; gap: var(--space-4); min-height: 48px; cursor: pointer; color: var(--on-deep); }
.sidebar-menu.is-responsive > .sidebar-menu-toggle { display: none; }
.sidebar-menu-toggle:focus-visible { outline: 3px solid var(--focus-inverse); outline-offset: 3px; }
.sidebar-navigation > *, .sidebar-group, .sidebar-submenu { min-width: 0; }
.sidebar-group > summary { cursor: pointer; list-style: none; }
.sidebar-group > summary::-webkit-details-marker { display: none; }
.sidebar-group > summary > span:first-of-type { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.sidebar-group > summary:hover { color: var(--on-deep); background: #ffffff0a; }
.sidebar-group > summary:focus-visible { outline: 3px solid var(--focus-inverse); outline-offset: 3px; }
.sidebar-disclosure-arrow { width: 8px; height: 8px; flex: 0 0 auto; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); margin-right: var(--space-1); }
.sidebar-group[open] > summary .sidebar-disclosure-arrow { transform: rotate(225deg); }
.sidebar-group.has-active-page > summary { color: var(--on-deep); font-weight: 600; }
.sidebar-submenu { display: grid; gap: var(--space-1); margin: var(--space-2) var(--space-1) 0 var(--space-5); padding-left: var(--space-3); border-left: 1px solid var(--on-deep-muted); }
.sidebar-submenu .nav-item { font-size: 12px; }
.sidebar-submenu .nav-item > span { min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 900px) {
    .workspace { display: block; }
    .sidebar { display: block; position: relative; padding: var(--space-3) var(--space-4); }
    .sidebar .wordmark { padding: 0; min-height: 48px; align-items: center; font-size: 27px; max-width: calc(100% - 120px); }
    .sidebar-menu > .sidebar-menu-toggle, .sidebar-menu.is-responsive > .sidebar-menu-toggle { display: flex; align-items: center; justify-content: center; gap: var(--space-4); position: absolute; top: var(--space-3); right: var(--space-4); min-height: 48px; padding: var(--space-3) var(--space-4); border: 1px solid var(--on-deep-muted); border-radius: var(--radius-control); cursor: pointer; list-style: none; font-size: 14px; font-weight: 600; }
    .sidebar-menu-toggle::-webkit-details-marker { display: none; }
    .sidebar-menu[open] > summary .sidebar-disclosure-arrow { transform: rotate(225deg); }
    .sidebar-caption { display: none; }
    .sidebar .sidebar-navigation { display: grid; gap: var(--space-1); margin-top: var(--space-3); padding-top: var(--space-3); border-top: 1px solid var(--on-deep-muted); }
    .sidebar .sidebar-navigation .nav-item { width: 100%; font-size: 14px; padding: var(--space-3); }
    .sidebar-group { width: 100%; }
    .sidebar .sidebar-group > summary, .sidebar .sidebar-submenu .nav-item { width: 100%; }
    .sidebar-submenu { margin-top: var(--space-2); }
}

/* Brugeradministrationens kompakte liste, læsbare identitet og konsekvensvisning. */
.users-workspace { display: grid; gap: var(--space-6); }
.users-workspace > *, .user-row > *, .user-row-facts > div { min-width: 0; }
.users-search { display: flex; flex-wrap: wrap; align-items: end; gap: var(--space-4); }
.users-search > div { flex: 1 1 240px; max-width: 540px; }
.users-search label { margin-top: 0; }
.user-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) auto; gap: var(--space-6); align-items: center; padding: var(--space-5) var(--space-8); }
.user-row + .user-row { border-top: 1px solid var(--border); }
.user-identity h2, .user-identity h3 { font-size: 15px; }
.user-identity p { font-size: 13px; margin-top: var(--space-1); }
.user-row-facts { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr); gap: var(--space-4); margin: 0; }
.user-row-facts dt, .user-fixed-facts dt { color: var(--muted); font-size: 12px; }
.user-row-facts dd, .user-fixed-facts dd { margin: var(--space-1) 0 0; font-size: 13px; overflow-wrap: anywhere; }
.users-empty, .users-pagination { padding: var(--space-5) var(--space-8); }
.user-access-form { max-width: 1000px; width: 100%; }
.user-fixed-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); margin: 0; }
.user-fixed-facts > div { min-width: 0; }
.user-access-impact { margin-top: var(--space-6); }
.user-access-impact h2 { font-size: 17px; }
.user-access-impact ul { padding-left: var(--space-6); }
.user-department-access { margin-top: var(--space-8); padding-top: var(--space-6); border-top: 1px solid var(--border); }
.user-department-access > h2 { font-size: 18px; }
.user-department-feedback:empty { display: none; }
.user-department-cards { display: grid; gap: var(--space-4); margin-top: var(--space-5); }
.user-department-card { min-width: 0; padding: var(--space-5); border: 1px solid var(--border); border-radius: var(--radius-control); }
.user-department-card.is-selected { border-color: var(--accent); }
.user-department-card.is-primary { border-inline-start: var(--space-1) solid var(--accent); }
.user-department-card-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: var(--space-4); }
.user-department-toggle { margin: 0; align-items: flex-start; }
.user-department-toggle input { margin-top: var(--space-1); }
.user-department-toggle strong { display: block; font-size: 15px; line-height: 1.5; font-weight: 650; }
.user-department-code { display: block; margin-top: var(--space-1); color: var(--muted); font-size: 12px; }
.user-department-primary { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: var(--space-3); }
.user-primary-choice { margin: 0; font-size: 13px; font-weight: 500; }
.user-department-primary-badge { padding: var(--space-1) var(--space-2); color: var(--accent); background: var(--accent-soft); border-radius: var(--radius-control); font-size: 12px; font-weight: 600; }
.user-department-teams { margin-top: var(--space-4); padding-top: var(--space-4); border-top: 1px solid var(--border); }
.user-department-teams > h3 { font-size: 13px; line-height: 1.5; }
.user-department-teams > .field-help { margin-top: 0; }
.user-department-team-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--space-5); margin-top: var(--space-2); }
.user-department-team-options .checkbox-label { margin: 0; font-size: 13px; font-weight: 500; }
.user-team-removal-note { padding-inline-start: var(--space-3); border-inline-start: var(--space-1) solid var(--warning); }
.invitation-facts > div:first-child { grid-column: 1 / -1; }
.users-pagination { display: flex; flex-wrap: wrap; gap: var(--space-6); justify-content: space-between; }
@media (max-width: 1100px) {
    .user-row { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
    .user-row > .text-button { justify-self: start; }
}
@media (max-width: 650px) {
    .user-row, .users-empty, .users-pagination { padding: var(--space-5); }
    .user-row-facts, .user-fixed-facts { grid-template-columns: minmax(0, 1fr); }
    .user-department-card { padding: var(--space-4); }
    .user-department-card-heading { grid-template-columns: minmax(0, 1fr); gap: var(--space-2); }
    .user-department-primary { justify-content: flex-start; }
    .user-department-team-options { grid-template-columns: minmax(0, 1fr); }
}

/* Afdelingsregistre genbruger designsystemets flader, afstande og responsive formularer. */
.master-data-workspace { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
.master-data-workspace > .notice { margin: 0; }
.master-data-form, .master-data-filter { width: 100%; max-width: 1000px; }
.master-data-form > *, .master-data-filter > * { min-width: 0; }
/* WebKit må ikke lade den native vælger med lange options udvide dokumentets rulleareal. */
.master-data-form select, .master-data-filter select { contain: paint; }
.register-filter.master-data-filter { max-width: none; }
.register-filter.master-data-filter .field-grid {
    display: grid;
    max-width: none;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
    gap: var(--space-4);
}
[data-operation-success]:focus { outline: 3px solid var(--focus); outline-offset: 3px; }
.catalog-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-4);
    padding: var(--space-4) 0;
    border-bottom: 1px solid var(--border);
}
.catalog-row > div {
    flex: 1 1 18rem;
    min-width: 0;
    overflow-wrap: anywhere;
}
.catalog-row h2,
.catalog-row p {
    margin: 0;
}
.catalog-row h2 {
    font-size: 1rem;
}
.catalog-row:last-child {
    border-bottom: 0;
}
.supplier-profile + .supplier-profile {
    border-top: 1px solid var(--border);
    margin-top: var(--space-5);
    padding-top: var(--space-5);
}
.supplier-profile-instruction {
    max-width: 78ch;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}
[data-draft-prompt] .text-button + .text-button {
    margin-inline-start: var(--space-5);
}

/* Opgaveoprettelsens afgrænsede komponenter genbruger det fælles designsystems tokens. */
.task-create { max-width: 1600px; }
.task-create-form { max-width: 1120px; }
.task-create-core h2,
.task-create-addons > h2 { font-size: 21px; letter-spacing: -0.025em; }
.task-create-core > h3 { margin-top: var(--space-6); font-size: 17px; }
.task-create-addons { margin-top: var(--space-8); padding-top: var(--space-8); border-top: 1px solid var(--border); }
.task-create-addons > .field-help { margin-bottom: var(--space-5); }
.task-create-addon { min-width: 0; border: 1px solid var(--border); border-radius: var(--radius-control); }
.task-create-addon + .task-create-addon { margin-top: var(--space-3); }
.task-create-addon > summary {
    display: grid;
    grid-template-columns: minmax(170px, 0.9fr) minmax(0, 1.4fr) 10px;
    align-items: center;
    gap: var(--space-4);
    min-height: 64px;
    padding: var(--space-4) var(--space-5);
    cursor: pointer;
    list-style: none;
}
.task-create-addon > summary::-webkit-details-marker { display: none; }
.task-create-addon > summary:hover { background: var(--accent-soft); }
.task-create-addon > summary:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.task-create-addon-title { color: var(--ink); font-size: 14px; font-weight: 650; overflow-wrap: anywhere; }
.task-create-addon-summary { color: var(--muted); font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.task-create-addon-arrow { width: 8px; height: 8px; border-right: 2px solid var(--accent); border-bottom: 2px solid var(--accent); transform: rotate(45deg); }
.task-create-addon[open] > summary .task-create-addon-arrow { transform: rotate(225deg); }
.task-create-addon[open] > summary { border-bottom: 1px solid var(--border); }
.task-create-addon-body { min-width: 0; padding: var(--space-5); }
.task-create-addon-body > h3:first-child { margin-top: 0; }
.task-create-addon-body > label:first-child,
.task-create-addon-body > div:first-child > label:first-child { margin-top: 0; }
.task-create-addon-body > .task-create-box:last-child { margin-bottom: 0; }
.task-create-core .task-create-editor { min-height: 128px; }
.task-create-core .task-create-box { margin-top: var(--space-4); margin-bottom: var(--space-4); }
.task-create-box {
    min-width: 0;
    margin: var(--space-6) 0;
    padding: var(--space-5);
    border: 1px solid var(--border);
    border-radius: var(--radius-control);
}
.task-create-box legend, .task-create-weekdays legend { padding: 0 var(--space-2); font-size: 13px; font-weight: 600; }
.task-create-box > label:first-of-type { margin-top: var(--space-2); }
.task-create-weekdays { min-width: 0; margin: var(--space-6) 0; padding: 0; border: 0; }
.task-create-weekdays .checkbox-label { display: inline-flex; margin-inline-end: var(--space-5); }
.task-create .checkbox-label { align-items: flex-start; min-height: 28px; }
.task-create .checkbox-label span { overflow-wrap: anywhere; }
.task-create-preview { margin-top: var(--space-5); padding: var(--space-5); border-left: 3px solid var(--accent); background: var(--accent-soft); }
.task-create-preview ol { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-8); padding-left: var(--space-5); margin-top: var(--space-3); }
.task-create-preview li { font-size: 13px; }
.task-create-editor-tools { display: flex; flex-wrap: wrap; gap: 0 var(--space-5); border: 1px solid var(--border); border-bottom: 0; padding: 0 var(--space-3); border-radius: var(--radius-control) var(--radius-control) 0 0; }
.task-create-editor { min-height: 220px; padding: var(--space-4); border: 1px solid var(--field-border); border-radius: 0 0 var(--radius-control) var(--radius-control); overflow-wrap: anywhere; white-space: pre-wrap; }
.task-create-editor:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.task-create-editor h2 { margin: var(--space-4) 0 var(--space-2); }
.task-create-editor p + p { margin-top: var(--space-3); }
.task-create-editor ul, .task-create-editor ol { padding-left: var(--space-6); }
.task-create [hidden] { display: none !important; }
.task-create-parameter .text-button + .text-button { margin-left: var(--space-3); }
@media (max-width: 700px) {
    .task-create-form { padding: var(--space-5); }
    .task-create .field-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
    .task-create-box { padding: var(--space-3); }
    .task-create-editor-tools { gap: 0 var(--space-4); }
    .task-create-addon > summary { grid-template-columns: minmax(0, 1fr) 10px; gap: var(--space-2) var(--space-3); padding: var(--space-4); }
    .task-create-addon-title { grid-column: 1; }
    .task-create-addon-summary { grid-column: 1; }
    .task-create-addon-arrow { grid-column: 2; grid-row: 1 / span 2; }
    .task-create-addon-body { padding: var(--space-4); }
}

/* Direkte læsefiltre bevarer kontrolfelter og fokus; ingen dekorativ ventetilstand. */
.live-results { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-6); min-width: 0; }
[data-live-results] { min-width: 0; overflow-wrap: anywhere; }
[data-live-results][aria-busy="true"] { opacity: 0.7; pointer-events: none; }
.live-feedback { font-size: 13px; color: var(--muted); }
.live-feedback [data-live-message]:empty { display: none; }
.live-recovery { display: flex; flex-wrap: wrap; gap: var(--space-5); }
.live-feedback.is-error { color: var(--error); }
.is-live [data-live-filter] button[type="submit"] { display: none; }
.is-live .master-data-filter .form-actions { margin: 0; padding: 0; border: 0; }
.master-data-filter { padding: var(--space-5); }
.master-data-filter .field-grid { display: block; max-width: 540px; }
.master-data-filter label { margin: 0 0 var(--space-2); }
[data-live-results]:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }

/* Kontoens responsive paneler og valglister; formularer og sikkerhedstilstande bevares uafhængige. */
.account-heading > div {
    width: 100%;
    max-width: 1600px;
    margin-inline: auto;
}

.account-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    align-items: start;
    gap: var(--space-6);
    max-width: 1600px;
    margin-inline: auto;
}

.account-secondary {
    display: grid;
    gap: var(--space-6);
    min-width: 0;
}

.account-layout .account-panel {
    width: 100%;
    min-width: 0;
    max-width: none;
    margin: 0;
}

.account-layout .panel-heading {
    padding: var(--space-5) var(--space-6);
}

.account-layout .task-form {
    padding: var(--space-6);
}

.account-layout .task-form > p {
    max-width: 65ch;
    font-size: 14px;
}

.account-layout .field-help {
    line-height: 1.6;
}

.account-mail .task-form > p + p {
    margin-top: var(--space-2);
}

.account-password form > label:first-of-type {
    margin-top: 0;
}

.account-layout .form-actions {
    margin-top: var(--space-6);
    padding-top: var(--space-5);
}

.account-primary {
    padding: var(--space-4);
    margin: var(--space-5) 0 var(--space-2);
    border: 1px solid var(--border);
    border-radius: var(--radius-control);
    background: var(--accent-soft);
}

.account-primary dt {
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
}

.account-primary dd {
    margin: var(--space-1) 0 0;
    font-size: 15px;
    font-weight: 600;
}

.account-layout .account-department-choices,
.account-layout .account-weekdays {
    min-width: 0;
    padding: 0;
    margin: var(--space-5) 0 0;
    border: 0;
}

.account-department-choices legend,
.account-weekdays legend {
    padding: 0;
    margin-bottom: var(--space-3);
    font-size: 13px;
    font-weight: 600;
}

.account-department-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
    gap: var(--space-2);
}

.account-layout .account-department-option {
    min-width: 0;
    min-height: 56px;
    margin: 0;
    padding: var(--space-3);
    border: 1px solid var(--border);
    border-radius: var(--radius-control);
    background: var(--page);
}

.account-weekday-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 104px), 1fr));
    gap: var(--space-1) var(--space-2);
}

.account-weekday-grid .checkbox-label {
    margin: 0;
}

@media (max-width: 1279px) {
    .account-layout {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 650px) {
    .account-layout .panel-heading,
    .account-layout .task-form {
        padding: var(--space-5);
    }

    .account-layout .form-actions .button {
        width: 100%;
    }
}

/* Projektets perioder og planvisninger genbruger formularer, flader og tokens fra resten af optiTask. */
.projects-workspace { display: grid; gap: var(--space-6); max-width: 1600px; }
.projects-workspace > * { min-width: 0; }
.project-form { max-width: 1120px; width: 100%; }
.project-period { margin-top: var(--space-8); padding-top: var(--space-6); border-top: 1px solid var(--border); }
.project-period > h2 { font-size: 19px; }
.project-period-type { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-8); min-width: 0; margin: var(--space-3) 0; padding: 0; border: 0; }
.project-period-type .checkbox-label { margin: 0; }
.project-period-fields { min-width: 0; margin: var(--space-5) 0; padding: var(--space-4); border: 1px solid var(--border); border-radius: var(--radius-control); }
.project-period-fields legend { padding: 0 var(--space-2); font-size: 13px; font-weight: 600; }
.project-period-fields label:first-child { margin-top: 0; }
.project-week-picker { margin-top: var(--space-5); }
.project-week-toolbar { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.project-week-toolbar > strong { font-variant-numeric: tabular-nums; }
.project-week-toolbar .text-button { flex: 0 1 auto; }
.project-week-grid { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: var(--space-2); margin-top: var(--space-4); }
.project-week-grid button { display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 44px; padding: var(--space-2); border: 1px solid var(--border); border-radius: var(--radius-control); color: var(--ink); background: var(--surface); font-size: 13px; font-variant-numeric: tabular-nums; }
.project-week-grid button:hover { background: var(--accent-soft); }
.project-week-grid button[aria-pressed="true"], .project-week-grid button.is-selected { color: var(--accent); background: var(--accent-soft); border-color: var(--accent); font-weight: 650; }
.project-period-preview { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); padding: var(--space-4); margin: var(--space-5) 0; border-left: var(--space-1) solid var(--accent); background: var(--accent-soft); }
.project-period-preview > p { flex-basis: 100%; }
.project-period-preview > p:empty { display: none; }
.project-description { margin-top: var(--space-6); }
.project-description .task-create-editor { min-height: 160px; }
.project-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); margin: 0; }
.project-facts > div { min-width: 0; }
.project-facts dt { color: var(--muted); font-size: 12px; }
.project-facts dd { margin: var(--space-1) 0 0; overflow-wrap: anywhere; }
.project-section { max-width: 1120px; padding: var(--space-6) var(--space-8); }
.project-section h2 { font-size: 19px; }
.project-section > h2 + .project-facts { margin-top: var(--space-5); }
.project-section > p { margin-top: var(--space-3); overflow-wrap: anywhere; }
.project-completion h3 { margin-top: var(--space-5); font-size: 16px; }
.project-completion .notice > h3:first-child { margin-top: 0; }
.project-completion ul { padding-left: var(--space-5); }
.project-navigation.form-actions { margin: 0; padding: 0; border: 0; }
.project-description-content { margin-top: var(--space-4); max-width: 80ch; overflow-wrap: anywhere; }
.project-task-list { list-style: none; padding: 0; margin: var(--space-4) 0 0; }
.project-task-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(120px, auto) 110px; gap: var(--space-4); align-items: center; padding: var(--space-4) 0; }
.project-task-row + .project-task-row { border-top: 1px solid var(--border); }
.project-task-row > * { min-width: 0; overflow-wrap: anywhere; }
.project-task-row time { font-variant-numeric: tabular-nums; }
.project-plan-table-wrap { position: relative; overflow-x: auto; margin-top: var(--space-5); }
.project-plan-table { width: 100%; min-width: 620px; border-collapse: collapse; font-size: 13px; }
.project-plan-table th, .project-plan-table td { padding: var(--space-3); border-bottom: 1px solid var(--border); text-align: left; vertical-align: top; }
.project-plan-table th:first-child, .project-plan-table td:first-child { min-width: 220px; max-width: 42ch; overflow-wrap: anywhere; }
.project-plan-table td:not(:first-child) { min-width: 140px; }
.project-plan-table input { min-width: 140px; font-size: 13px; }
.project-plan-table caption { text-align: left; font-size: 15px; font-weight: 600; margin-bottom: var(--space-3); }
@media (max-width: 700px) {
    .project-form { padding: var(--space-5); }
    .project-form .field-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
    .project-week-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .project-week-toolbar { flex-wrap: wrap; }
    .project-week-toolbar > strong { order: -1; flex-basis: 100%; text-align: center; }
    .project-facts { grid-template-columns: minmax(0, 1fr); }
    .project-section { padding: var(--space-5); }
    .project-task-row { grid-template-columns: minmax(0, 1fr); gap: var(--space-2); }
}

/* Opgaveoversigtens filtre og navigation genbruger fælles tokens og rækkehierarki. */
.tasks-filter.master-data-filter { max-width: none; margin-bottom: var(--space-6); }
.tasks-filter.master-data-filter .field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-5) var(--space-6);
    max-width: none;
}
.tasks-filter .field-grid > div { min-width: 0; }
.tasks-filter label { margin-bottom: var(--space-2); }
.tasks-results .tasks-views { margin: 0; padding: 0; border: 0; gap: var(--space-4); }
.tasks-views a[aria-current] { color: var(--ink); font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }
.tasks-pagination { padding: var(--space-5) var(--space-8); margin: 0; }
.tasks-context { margin: 0; padding: var(--space-5) var(--space-8); }
.tasks-context > div { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); }
.tasks-context dt { color: var(--muted); }
.tasks-context dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.tasks-extra-filters { margin-block: var(--space-5); }
.tasks-extra-filters > summary { cursor: pointer; min-height: 44px; padding-block: var(--space-3); font-weight: 600; }
.tasks-extra-filters[open] > summary { margin-bottom: var(--space-4); }
@media (min-width: 1600px) {
    .tasks-filter.master-data-filter .field-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 650px) {
    .tasks-filter.master-data-filter .field-grid { grid-template-columns: minmax(0, 1fr); }
    .tasks-pagination, .tasks-context { padding-inline: var(--space-5); }
}

/* Fælles planfiltre, kalender/agenda, årspaneler og projekttidslinje inden for designsystemet. */
.planning-filter { max-width: none; margin-bottom: var(--space-6); padding: var(--space-6); }
.planning-filter .planning-fields {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: var(--space-4) var(--space-5);
}
.planning-filter .field-help { margin-top: var(--space-2); }
.planning-filter .form-actions { margin-top: var(--space-5); padding-top: var(--space-4); }
.planning-filter label { margin: 0 0 var(--space-2); }
.planning-filter .form-actions { border-top: 0; margin-top: var(--space-2); padding-top: 0; }
[data-live-view="planning"] > .page-heading { padding-block: var(--space-6); }
[data-live-view="planning"] > .page-heading h1 { margin-bottom: 0; }
.planning-workspace .live-results { gap: var(--space-4); }
.planning-workspace .planning-navigation { margin-bottom: 0; }
.planning-workspace .planning-scope-note { margin: 0; max-width: none; font-size: 12px; }
.planning-fields > div { min-width: 0; }
.planning-fields select, .planning-fields input { max-width: 100%; min-width: 0; }
/* Native select må ikke male lange valgmuligheder uden for filteret ved zoom i WebKit. */
.planning-fields select { contain: paint; }
.planning-navigation { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--space-5); padding: var(--space-4) var(--space-6); margin-bottom: var(--space-4); }
.planning-view-links { display: flex; flex-wrap: wrap; gap: var(--space-1); padding: var(--space-1); border-radius: var(--radius-control); background: var(--page); }
.planning-view-links .text-button { padding-inline: var(--space-4); text-decoration: none; }
.planning-view-links a[aria-current] { font-weight: 700; color: var(--on-deep); background: var(--deep); border-radius: var(--radius-control); }
.planning-period-navigation { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-4); }
.planning-period-navigation h2 { font-size: 22px; margin: 0; font-variant-numeric: tabular-nums; }
.planning-scope-note { margin: var(--space-5) 0; color: var(--muted); font-size: 13px; max-width: 85ch; }
.planning-weekdays { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); padding: var(--space-4) 0; border: 1px solid var(--border); border-bottom: 0; border-radius: var(--radius-panel) var(--radius-panel) 0 0; background: var(--surface); color: var(--muted); font-size: 12px; font-weight: 600; text-align: center; }
.planning-month-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 1px; align-items: stretch; border: 1px solid var(--border); border-radius: 0 0 var(--radius-panel) var(--radius-panel); background: var(--border); overflow: hidden; }
.planning-day { display: flex; flex-direction: column; padding: var(--space-3); min-width: 0; min-height: 186px; height: 100%; border: 0; border-radius: 0; }
.planning-day h3 { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); font-size: 12px; margin: 0 0 var(--space-2); }
.planning-day-number { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; height: 32px; font-size: 19px; font-weight: 650; font-variant-numeric: tabular-nums; letter-spacing: -0.04em; }
/* Fuld dato bevares til skærmlæsere og vises direkte i mobilens agenda. */
.planning-day-date { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.planning-day-adjacent { background: var(--page); }
.planning-day-adjacent .planning-day-number { color: var(--muted); }
.planning-day[aria-current="date"] { box-shadow: inset 0 0 0 2px var(--accent); }
.planning-day[aria-current="date"] .planning-day-number { border-radius: 50%; background: var(--deep); color: var(--on-deep); }
.planning-count { font-size: 11px; color: var(--muted); margin: 0 0 var(--space-3); font-variant-numeric: tabular-nums; }
.planning-event { min-width: 0; overflow-wrap: anywhere; padding: var(--space-4) 0; border-top: 1px solid var(--border); }
.planning-event-title { display: block; font-weight: 650; text-decoration: none; line-height: 1.45; }
.planning-event-title:hover { text-decoration: underline; text-underline-offset: 3px; }
.planning-event-type, .planning-event-meta, .planning-event-date { font-size: 11px; line-height: 1.5; margin: var(--space-1) 0; }
.planning-event-type { color: var(--muted); }
.planning-event-task_start .planning-event-type { color: var(--warning); }
.planning-event-project .planning-event-type { color: var(--accent); }
.planning-day .planning-event { margin-top: var(--space-2); padding: var(--space-3); border: 0; border-left: 3px solid var(--accent); border-radius: var(--radius-control); background: var(--accent-soft); }
.planning-day .planning-event-task_start { border-left-color: var(--warning); background: var(--page); }
.planning-day .planning-event-project { border-left-color: var(--field-border); background: var(--page); }
.planning-day .planning-event-meta, .planning-day .planning-event-date { color: var(--muted); }
.planning-day .planning-event-title { font-size: 13px; }
.planning-day > .text-button { justify-content: flex-start; padding-inline: var(--space-1); font-size: 11px; min-height: 44px; max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
.planning-day > .text-button:last-child { margin-top: auto; }
.planning-year-overview { display: grid; grid-template-columns: minmax(260px, 0.9fr) minmax(0, 1.4fr); align-items: center; gap: var(--space-8); padding: var(--space-8); margin-bottom: var(--space-6); }
.planning-year-wheel { min-width: 0; }
.planning-year-wheel svg { display: block; width: 100%; max-width: 430px; margin: auto; }
.planning-wheel-guide { fill: none; stroke: var(--border); stroke-dasharray: 2 6; }
.planning-wheel-segment { fill: var(--accent); }
.planning-wheel-empty { fill: var(--accent-soft); stroke: var(--border); stroke-width: 1; }
.planning-wheel-month, .planning-wheel-year, .planning-wheel-caption { text-anchor: middle; dominant-baseline: middle; fill: var(--muted); font-family: var(--font); }
.planning-wheel-month { font-size: 12px; font-weight: 650; }
.planning-wheel-year { fill: var(--ink); font-size: 38px; font-weight: 650; letter-spacing: -2px; }
.planning-wheel-caption { font-size: 12px; }
.planning-year-index { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); }
.planning-month-summary { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: var(--space-2); align-items: start; padding: var(--space-3); border-radius: var(--radius-control); color: var(--ink); text-decoration: none; }
.planning-month-summary:hover { background: var(--page); }
.planning-month-summary strong { font-size: 13px; overflow-wrap: anywhere; }
.planning-month-index { color: var(--muted); font-size: 11px; font-weight: 650; font-variant-numeric: tabular-nums; padding-top: 3px; }
.planning-month-total { display: block; color: var(--muted); font-size: 11px; margin-top: var(--space-1); overflow-wrap: anywhere; }
.planning-month-bar { display: block; grid-column: 2; width: 100%; height: 4px; fill: var(--accent-soft); }
.planning-month-bar-value { fill: var(--accent); }
.planning-year-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-6); }
.planning-year-month { display: flex; flex-direction: column; padding: var(--space-6); min-width: 0; }
.planning-year-month header { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-3); padding-bottom: var(--space-4); border-bottom: 1px solid var(--border); margin-bottom: var(--space-4); }
.planning-year-month header .status { margin-left: auto; }
.planning-year-month h3 { margin: 0; font-size: 19px; }
.planning-year-month .planning-event:first-of-type { border-top: 0; }
.planning-year-month > .text-button { margin-top: auto; align-self: flex-start; }
.planning-year-month > .muted { padding-bottom: var(--space-6); font-size: 13px; }
.planning-list > .planning-event { padding: var(--space-5) var(--space-8); }
.planning-pagination { padding: var(--space-5) var(--space-8); margin: 0; }
.project-workspace-gantt { margin-bottom: var(--space-6); }
.planning-gantt-help { margin: 0; padding: 0 var(--space-8) var(--space-5); color: var(--muted); }
.planning-gantt-scroll, .planning-table-scroll { overflow-x: auto; max-width: 100%; }
.planning-gantt-content { min-width: 880px; padding: 0 var(--space-8) var(--space-6); }
.planning-gantt-axis, .planning-gantt-row { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: var(--space-6); }
.planning-gantt-axis { padding: var(--space-3) 0; font-size: 12px; color: var(--muted); }
.planning-gantt-axis > div { display: flex; justify-content: space-between; gap: var(--space-5); }
.planning-gantt-row { border-top: 1px solid var(--border); padding: var(--space-4) 0; align-items: center; }
.planning-gantt-label { display: grid; gap: var(--space-1); min-width: 0; overflow-wrap: anywhere; font-size: 12px; }
.planning-gantt-label a { font-size: 14px; font-weight: 600; }
.planning-gantt-track { display: block; min-width: 0; background: var(--page); border-radius: var(--radius-control); }
.planning-gantt-track svg { display: block; width: 100%; height: 52px; fill: var(--accent); }
.planning-gantt-status-in_progress svg { fill: var(--success); }
.planning-gantt-status-at_risk svg { fill: var(--warning); }
.planning-gantt-status-completed svg { fill: var(--muted); }
.project-workspace-table { width: 100%; min-width: 880px; border-collapse: collapse; font-size: 13px; }
.project-workspace-table th, .project-workspace-table td { text-align: left; padding: var(--space-5); border-bottom: 1px solid var(--border); vertical-align: top; }
.project-workspace-table th:first-child { max-width: 320px; overflow-wrap: anywhere; }
.project-workspace-table small { display: block; font-weight: 400; margin-top: var(--space-2); }
@media (min-width: 1800px) {
    .planning-year-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 1250px) {
    .planning-filter .planning-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .planning-year-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .planning-year-overview { grid-template-columns: minmax(220px, 0.8fr) minmax(0, 1fr); gap: var(--space-4); padding: var(--space-5); }
    .planning-year-index { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1050px) {
    .planning-weekdays { display: none; }
    .planning-month-grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); border: 0; border-radius: 0; background: transparent; overflow: visible; }
    .planning-day { padding: var(--space-5); min-height: 0; border: 1px solid var(--border); border-radius: var(--radius-panel); }
    .planning-day h3 { font-size: 15px; }
    .planning-day h3 time { display: flex; align-items: center; gap: var(--space-3); }
    .planning-day-date { position: static; width: auto; height: auto; clip-path: none; white-space: normal; }
    .planning-day .planning-event-title { font-size: 14px; }
}
@media (max-width: 650px) {
    .planning-filter .planning-fields, .planning-year-grid { grid-template-columns: minmax(0, 1fr); }
    .planning-navigation, .planning-year-month { padding: var(--space-5); }
    .planning-year-overview { grid-template-columns: minmax(0, 1fr); }
    .planning-year-wheel svg { max-width: 340px; }
    .planning-year-index { gap: var(--space-2); }
    .planning-month-summary { padding: var(--space-2); }
    .planning-filter { padding: var(--space-5); }
    .planning-period-navigation h2 { width: 100%; order: -1; }
    .planning-list > .planning-event, .planning-pagination { padding-inline: var(--space-5); }
    .planning-gantt-help { padding-inline: var(--space-5); }
}

/* Ansvar: Holder originale private udstyrsfotos inden for eksisterende grid og læsebredde. */
.equipment-photo {
    display: block;
    max-width: 100%;
    max-height: 360px;
    width: auto;
    height: auto;
    object-fit: contain;
}

.equipment-photo-grid figure {
    margin: 0;
    min-width: 0;
}

.equipment-form details {
    margin-top: var(--space-6);
    padding-block: var(--space-4);
    border-top: 1px solid var(--border);
}

.equipment-form summary {
    min-height: 44px;
    padding-block: var(--space-3);
    font-weight: 600;
    cursor: pointer;
}

.equipment-parts-list .project-task-row {
    grid-template-columns: minmax(0, 1fr) minmax(120px, auto);
}

.equipment-history-list .project-task-row {
    display: block;
}

.equipment-filter .field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-4);
    max-width: none;
}

.equipment-filter .field-grid label {
    margin: var(--space-4) 0 var(--space-2);
}

.equipment-qr {
    display: block;
    max-width: 100%;
    height: auto;
    margin-block: var(--space-5);
}

.equipment-label h2,
.equipment-label p {
    overflow-wrap: anywhere;
}

@media print {
    body:has(.equipment-label) .sidebar,
    body:has(.equipment-label) .workspace-top,
    body:has(.equipment-label) .test-banner,
    body:has(.equipment-label) .skip-link,
    body:has(.equipment-label) .page-heading,
    .equipment-label-actions {
        display: none;
    }

    .equipment-label {
        border: 1px solid #000;
        box-shadow: none;
        break-inside: avoid;
        color: #000;
        background: #fff;
    }
}

@media (max-width: 700px) {
    .equipment-filter .field-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .equipment-parts-list .project-task-row {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Fejloversigtens tre kort genbruger eksisterende metrikkomponent og semantiske tokens. */
.fault-overview .fault-overview-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.fault-overview [data-live-results] > .project-section {
    max-width: none;
    margin-top: var(--space-6);
}

.fault-overview .project-task-row {
    overflow-wrap: anywhere;
}

@media (max-width: 700px) {
    .fault-overview .fault-overview-cards {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Ansvar: serviceordrens originale oplysninger udfoldes i fuld række, ikke i opgavelistens smalle handlingskolonne. */
.mail-job-workspace {
    display: grid;
    gap: var(--space-6);
}
.mail-job-workspace > * {
    min-width: 0;
}
.mail-job-snapshot-title {
    margin-top: var(--space-6);
}
.service-order-list .project-task-row {
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    align-items: start;
}
.service-order-list .project-task-row > :last-child {
    grid-column: 1 / -1;
}
.service-order-list details > summary {
    min-height: 44px;
    padding-block: var(--space-3);
    cursor: pointer;
}
@media (max-width: 850px) {
    .service-order-list .project-task-row {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Kommentarer og arkivbehandling genbruger detaljesidens paneler med læsbare registreringer og adskilte formularer. */
.task-interactions .task-form {
    max-width: 78ch;
    padding: 0;
    margin-top: var(--space-6);
}

.task-interactions .task-form + .task-form {
    padding-top: var(--space-6);
    border-top: 1px solid var(--border);
}

.task-interactions .form-actions:empty {
    display: none;
}

.interaction-records {
    padding: 0;
    margin: var(--space-4) 0 0;
    list-style: none;
}

.interaction-record {
    padding: var(--space-4) 0;
    overflow-wrap: anywhere;
}

.interaction-record + .interaction-record {
    border-top: 1px solid var(--border);
}

.interaction-record > p + p {
    margin-top: var(--space-2);
}

.interaction-record > p {
    max-width: 78ch;
}

.task-interactions .notice > p {
    overflow-wrap: anywhere;
}

/* KPI-kort, læsbare definitioner og datatabeller genbruger projektets design- og fokustokens. */
.metrics-filter { max-width: none; margin-bottom: var(--space-6); padding: var(--space-5) var(--space-6); }
.metrics-filter .metrics-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); gap: var(--space-4); align-items: start; }
.metrics-fields label { margin-top: 0; }
.metrics-filter .form-actions { margin-top: var(--space-4); padding-top: var(--space-4); }
[data-live-view="metrics"] > .page-heading { padding-block: var(--space-6); }
[data-live-view="metrics"] > .page-heading h1 { margin-bottom: 0; }
.metrics-workspace .live-results { gap: var(--space-4); }
.metrics-workspace { container-type: inline-size; }
.metrics-workspace .metrics-card-grid { margin-block: 0; }
.metrics-workspace .metrics-period { margin-block: var(--space-2); }
.metrics-workspace .metrics-section { margin-top: 0; }
.metrics-filter .form-actions { border-top: 0; margin-top: var(--space-2); padding-top: 0; }
.metrics-fields > div { min-width: 0; }
.metrics-fields select, .metrics-fields input { min-width: 0; max-width: 100%; }
.metrics-fields select { contain: paint; }
.metrics-fields label { overflow-wrap: anywhere; }
.metrics-sections { display: flex; flex-wrap: wrap; gap: var(--space-2); padding: var(--space-2); }
.metrics-sections a { padding: var(--space-3) var(--space-4); border-radius: var(--radius-control); }
.metrics-sections a:hover { background: var(--page); }
.metrics-sections a[aria-current] { background: var(--accent-soft); }
.metrics-sections a[aria-current], .metrics-workspace [data-live-pages] a[aria-current] { text-decoration: underline; text-underline-offset: 4px; font-weight: 700; color: var(--ink); }
.metrics-period { display: flex; align-items: baseline; flex-wrap: wrap; justify-content: space-between; gap: var(--space-4); margin: var(--space-8) 0 var(--space-5); }
.metrics-period h2, .metrics-period p { margin: 0; }
.metrics-period p { color: var(--muted); font-size: 13px; font-variant-numeric: tabular-nums; }
.metrics-card-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-5); margin: var(--space-6) 0; }
.metrics-card { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-6); min-width: 0; overflow-wrap: anywhere; border-top: 3px solid var(--accent); }
.metrics-card h2, .metrics-card h3, .metrics-card h4 { font-size: 14px; font-weight: 600; margin: 0; }
.metrics-card .metrics-value { font-size: clamp(30px, 2.8vw, 44px); letter-spacing: -0.045em; font-variant-numeric: tabular-nums; font-weight: 650; margin: var(--space-3) 0; line-height: 1.15; }
.metrics-card > p { font-size: 13px; }
.metrics-card > .text-button:last-child { margin-top: auto; padding-top: var(--space-4); }
.metrics-card-reading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); min-width: 0; }
.metrics-card-reading .metrics-value { min-width: 0; }
.metrics-ring { width: 64px; height: 64px; flex: 0 0 64px; fill: none; stroke-width: 7; }
.metrics-ring-track { stroke: var(--border); }
.metrics-ring-value { stroke: var(--accent); }
.metrics-workspace .metrics-overview-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.metrics-workspace .metrics-card-featured { grid-column: span 2; background: var(--accent-soft); }
.metrics-workspace .metrics-card-featured h3 { font-size: 18px; }
.metrics-workspace .metrics-card-featured .metrics-value { font-size: clamp(36px, 4vw, 56px); }
.metrics-workspace .metrics-card-featured .metrics-ring { width: 88px; height: 88px; flex-basis: 88px; }
.metrics-definition, .metrics-scope-help { max-width: 100ch; font-size: 13px; margin: var(--space-5) 0; }
.metrics-section, .metrics-inline-summary { padding: var(--space-8); margin-top: var(--space-6); }
.metrics-section > h2, .metrics-section > h3 { font-size: 18px; margin: 0 0 var(--space-5); }
.metrics-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-6); }
.metrics-facts dt { font-size: 13px; color: var(--muted); }
.metrics-facts dd { font-size: 30px; letter-spacing: -0.035em; font-weight: 600; font-variant-numeric: tabular-nums; margin: var(--space-2) 0; }
.metrics-facts > div { border-inline-start: 2px solid var(--border); padding-inline-start: var(--space-4); }
.metrics-table-scroll { max-width: 100%; overflow-x: auto; }
.metrics-table { width: 100%; min-width: 600px; border-collapse: collapse; font-size: 13px; }
.metrics-table th, .metrics-table td { text-align: left; vertical-align: top; padding: var(--space-4); border-bottom: 1px solid var(--border); }
.metrics-table thead { background: var(--page); color: var(--muted); font-size: 12px; }
.metrics-table tbody tr:hover { background: var(--page); }
.metrics-table td { font-variant-numeric: tabular-nums; }
.metrics-table th:first-child { min-width: 160px; max-width: 300px; overflow-wrap: anywhere; }
.metrics-table th span, .metrics-table th small { display: block; margin-top: var(--space-2); font-weight: 400; }
.metrics-ranked-list { list-style: none; margin: 0; padding: 0; }
.metrics-ranked-list li { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: var(--space-3) var(--space-5); border-bottom: 1px solid var(--border); padding: var(--space-4) 0; }
.metrics-ranked-list li > :first-child { min-width: 0; overflow-wrap: anywhere; }
.metrics-trend-figure { max-width: 950px; margin: 0; }
.metrics-trend { display: block; width: 100%; height: auto; }
.metrics-chart-axis { stroke: var(--border); stroke-width: 1; }
.metrics-point-normal { fill: var(--accent); }
.metrics-point-oos { fill: var(--error); }
.metrics-trend-figure figcaption { font-size: 13px; color: var(--muted); }
/* Søjler viser alene tabellens faktiske rettidige/sene kvitteringer på én fælles skala. */
.metrics-chart-legend { display: flex; flex-wrap: wrap; gap: var(--space-5); margin-top: var(--space-6); font-size: 12px; color: var(--muted); }
.metrics-chart-legend span { display: inline-flex; gap: var(--space-2); align-items: center; }
.metrics-chart-legend span::before { content: ''; width: 10px; height: 10px; border-radius: 2px; background: var(--accent); }
.metrics-chart-legend .metrics-legend-late::before { background: var(--warning); }
.metrics-monthly-chart { display: flex; gap: var(--space-3); align-items: end; margin: var(--space-6) 0 var(--space-8); padding: var(--space-5); background: var(--page); border-radius: var(--radius-control); }
.metrics-chart-column { flex: 1 1 0; min-width: 0; text-align: center; }
.metrics-chart-column svg { display: block; width: 100%; height: 150px; }
.metrics-chart-total { font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; }
.metrics-chart-month { display: block; margin-top: var(--space-3); font-size: 11px; color: var(--muted); overflow-wrap: anywhere; }
.metrics-bar-on-time { fill: var(--accent); }
.metrics-bar-late { fill: var(--warning); }
/* Kun opgaverettidighed får denne tekstlige markering; åbne kritiske opgaver har deres eget signal. */
.task-timeliness-indicator {
    border-inline-start: var(--space-1) solid var(--border);
    padding-inline-start: var(--space-3);
    overflow-wrap: anywhere;
}
.task-timeliness-indicator[data-timeliness-state='attention'] { border-color: var(--warning); }
.task-timeliness-indicator[data-timeliness-state='good'] { border-color: var(--success); }
.task-timeliness-label { margin: 0 0 var(--space-2); }
.task-timeliness-indicator .field-help { margin: 0; }
/* Reagerer på faktisk arbejdsbredde, også når browserzoom bevarer desktop-medieforespørgsler. */
@container (max-width: 750px) {
    .metrics-workspace .metrics-overview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .metrics-workspace .metrics-card-featured { grid-column: auto; }
}
@container (max-width: 450px) {
    .metrics-workspace .metrics-overview-grid { grid-template-columns: minmax(0, 1fr); }
    .metrics-workspace .metrics-filter .metrics-fields { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 1250px) {
    .metrics-filter .metrics-fields, .metrics-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .metrics-workspace .metrics-overview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .metrics-workspace .metrics-card-featured { grid-column: auto; }
    .metrics-workspace .metrics-card-featured .metrics-ring { width: 64px; height: 64px; flex-basis: 64px; }
    .metrics-workspace .metrics-card-featured .metrics-value { font-size: 36px; }
}
@media (max-width: 650px) {
    .metrics-filter .metrics-fields, .metrics-card-grid, .metrics-facts { grid-template-columns: minmax(0, 1fr); }
    .metrics-workspace .metrics-overview-grid { grid-template-columns: minmax(0, 1fr); }
    .metrics-section, .metrics-card, .metrics-inline-summary { padding: var(--space-5); }
    .metrics-filter { padding: var(--space-4); }
    .metrics-monthly-chart { gap: var(--space-1); padding: var(--space-3) var(--space-2); }
    .metrics-chart-month { writing-mode: vertical-rl; margin-inline: auto; }
}

/* Virksomhedsstatistikkens egne kort, registrerede dagsforløb og præcise rangsøjler. */
.statistics-workspace > .live-results > .metrics-card-grid { margin-bottom: var(--space-8); }
.statistics-workspace [data-statistics-usage] { margin-top: var(--space-8); }
.statistics-workspace [data-statistics-usage] > h2 { font-size: 26px; }
.statistics-workspace [data-statistics-usage] > h3 { margin-top: var(--space-8); }
.statistics-workspace [data-statistics-usage] > .metrics-card-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.statistics-workspace [data-statistics-usage] > .metrics-card-grid > .metrics-card:first-child { background: var(--accent-soft); }
.statistics-workspace .metrics-card { border-top-width: 2px; }
.statistics-workspace .metrics-card .metrics-value { margin-block: var(--space-2); }
.statistics-workspace .metrics-section { min-width: 0; }
.statistics-workspace .metrics-section > h2, .statistics-workspace .metrics-section > h3 { font-size: 20px; }
.statistics-chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); margin-block: var(--space-6); }
.statistics-chart-card { min-width: 0; padding: var(--space-5); background: var(--page); border: 1px solid var(--border); border-radius: var(--radius-panel); }
.statistics-chart-legend { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-5); font-size: 12px; font-weight: 600; }
.statistics-chart-legend > span { display: inline-flex; align-items: center; gap: var(--space-2); }
.statistics-chart-legend > span::before { content: ''; width: 10px; height: 10px; flex: 0 0 auto; border-radius: 2px; background: var(--accent); }
.statistics-chart-legend .statistics-legend-secondary::before { background: var(--warning); border-radius: 50%; }
.statistics-chart-range { font-size: 11px; color: var(--muted); margin-top: var(--space-2); font-variant-numeric: tabular-nums; }
.statistics-chart-scroll { overflow-x: auto; margin-top: var(--space-4); }
.statistics-chart-scroll:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.statistics-daily-chart { display: block; width: 100%; min-width: 500px; height: auto; }
.statistics-chart-guide { stroke: var(--border); stroke-width: 1; stroke-dasharray: 3 5; }
.statistics-chart-axis { fill: var(--muted); font-family: var(--font); font-size: 13px; font-variant-numeric: tabular-nums; }
.statistics-chart-primary { fill: var(--accent); }
.statistics-chart-secondary, .statistics-chart-point { fill: var(--warning); }
.statistics-chart-line { stroke: var(--warning); stroke-width: 2; stroke-dasharray: 4 3; }
.statistics-chart-point { stroke: var(--surface); stroke-width: 1; }
.statistics-rank-bar { display: block; width: 100%; min-width: 72px; height: 5px; margin-top: var(--space-2); fill: var(--accent-soft); }
.statistics-rank-value { fill: var(--accent); }
.statistics-workspace .statistics-rank-count { min-width: 150px; }
.statistics-actions li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: baseline; gap: var(--space-2) var(--space-5); }
.statistics-actions .statistics-action-name { font-weight: 600; }
.statistics-actions time { color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.statistics-actions .statistics-rank-bar { grid-column: 1 / -1; margin-top: 0; }
@media (max-width: 1450px) {
    .statistics-chart-grid { grid-template-columns: minmax(0, 1fr); }
    .statistics-workspace [data-statistics-usage] > .metrics-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .statistics-workspace [data-statistics-usage] > .metrics-card-grid > .metrics-card:first-child { grid-column: span 2; }
}
@media (max-width: 650px) {
    .statistics-workspace [data-statistics-usage] > .metrics-card-grid { grid-template-columns: minmax(0, 1fr); }
    .statistics-workspace [data-statistics-usage] > .metrics-card-grid > .metrics-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--space-4); padding: var(--space-4) var(--space-5); }
    .statistics-workspace [data-statistics-usage] > .metrics-card-grid > .metrics-card:first-child { grid-column: auto; }
    .statistics-workspace [data-statistics-usage] > .metrics-card-grid .metrics-value { margin: 0; font-size: 28px; }
    .statistics-workspace [data-statistics-usage] > .metrics-card-grid h4 { font-size: 12px; }
    .statistics-chart-card { padding: var(--space-4); }
    .statistics-actions li { grid-template-columns: minmax(0, 1fr) auto; }
    .statistics-actions time { grid-column: 1 / -1; }
}

/* Hjælp genbruger native details, panelsystem og fokus, med korte handlingsforløb på alle skærme. */
.help-search { max-width: none; margin-bottom: var(--space-6); }
.help-results { display: grid; gap: var(--space-5); }
.help-topic { padding: var(--space-5) var(--space-6); min-width: 0; }
.help-topic summary { cursor: pointer; min-height: 44px; font-weight: 600; overflow-wrap: anywhere; }
.help-topic ol { margin: var(--space-4) 0 var(--space-5); padding-left: var(--space-6); max-width: 95ch; }
.help-topic li { padding-left: var(--space-2); margin-bottom: var(--space-3); overflow-wrap: anywhere; }
.help-topic mark { color: var(--ink); background: var(--accent-soft); }
@media (max-width: 650px) {
    .help-topic { padding: var(--space-5); }
}

/* Ansvar: Ordnede personlige valg genbruger formularernes tokens og kan betjenes uden træk eller JavaScript. */
.workspace-preferences-body {
    display: grid;
    gap: var(--space-6);
    align-content: start;
}

.workspace-choice-group {
    margin-block: var(--space-6);
    border: 1px solid var(--border);
    border-radius: var(--radius-control);
    padding: var(--space-4);
}

.workspace-choice-group > summary {
    cursor: pointer;
    min-height: 44px;
    font-weight: 600;
    align-content: center;
}

.workspace-choice-group fieldset {
    border: 0;
    padding: 0;
    min-width: 0;
}

.workspace-choice-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-4);
}

.workspace-choice-row {
    display: flex;
    justify-content: space-between;
    gap: var(--space-3);
    align-items: center;
    border-bottom: 1px solid var(--border);
    padding-bottom: var(--space-3);
    min-width: 0;
}

.workspace-choice-row > .checkbox-label {
    min-width: 0;
}

.workspace-choice-order {
    flex: 0 0 6rem;
    font-size: 12px;
    margin: 0;
}

.workspace-choice-order input {
    margin-top: var(--space-2);
}

@media (max-width: 900px) {
    .workspace-choice-grid { grid-template-columns: minmax(0, 1fr); }
}

.dashboard-section { margin-top: var(--space-6); }
.dashboard-task-row.task-row { grid-template-columns: minmax(0, 1fr); gap: var(--space-3); }
.dashboard-task-facts { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-6); margin: 0; }
.dashboard-task-facts > div { min-width: 0; max-width: 100%; }
.dashboard-task-facts dt { color: var(--muted); font-size: 12px; }
.dashboard-task-facts dd { margin: var(--space-1) 0 0; font-size: 13px; overflow-wrap: anywhere; }

/* Arbejdsoversigtens tal, værktøjsrække og indholdssektioner deler KPI-boardets visuelle hierarki. */
.board-filter-details > summary {
    cursor: pointer;
    min-height: 44px;
    font-size: 13px;
    overflow-wrap: anywhere;
    padding-block: var(--space-3);
}

.board-filter-details > summary:focus-visible {
    outline: 3px solid var(--focus);
    outline-offset: 3px;
}

.board-filter-summary {
    display: block;
    font-size: 12px;
    font-weight: 400;
    color: var(--muted);
    margin-top: var(--space-2);
}

.board-filter-details[open] .board-filter-summary {
    display: none;
}

.board-filter-details[open] > summary {
    margin-bottom: var(--space-4);
    border-bottom: 1px solid var(--border);
}

.dashboard-board .metrics > .metric {
    position: relative;
    overflow: hidden;
    padding: var(--space-6) var(--space-8);
    background: var(--surface);
    border-top: 1px solid var(--border);
    border-inline-start: 4px solid var(--metric-color);
}

.dashboard-board .metrics dt {
    color: var(--muted);
    font-weight: 600;
}

.dashboard-board .metrics dd {
    font-size: clamp(32px, 3vw, 48px);
    letter-spacing: -0.045em;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    margin-top: var(--space-4);
}

.dashboard-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3) var(--space-6);
    padding-bottom: var(--space-3);
    border-bottom: 1px solid var(--border);
}

.dashboard-board .dashboard-section {
    overflow: hidden;
}

.dashboard-board .dashboard-section > .panel-heading {
    padding: var(--space-5) var(--space-6);
    background: var(--surface);
    border-bottom: 1px solid var(--border);
}

.dashboard-board .dashboard-section > .panel-heading h2 {
    font-size: 19px;
    letter-spacing: -0.025em;
}

.dashboard-board .dashboard-section > .metrics-card-grid {
    margin: 0;
    padding: var(--space-5);
    background: var(--page);
}

.dashboard-board .dashboard-task-row {
    border-inline-start: 3px solid transparent;
}

.dashboard-board .dashboard-task-row:hover {
    background: var(--page);
    border-inline-start-color: var(--accent);
}

@media (max-width: 650px) {
    .dashboard-board .metrics > .metric {
        padding: var(--space-5);
    }

    .dashboard-board .dashboard-section > .panel-heading {
        padding: var(--space-4) var(--space-5);
    }
}

@media (max-width: 480px) {
    .dashboard-board .metrics dd {
        margin: 0;
    }
}

/* Enhedsflader og administration genbruger fælles semantiske tokens og touchmål. */
.device-body {
    min-height: 100vh;
}
.device-header {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--space-4);
    padding: var(--space-5) var(--space-8);
    color: var(--on-deep);
    background: var(--deep);
    overflow-wrap: anywhere;
}
.device-wordmark {
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.04em;
}
.device-workspace {
    padding: clamp(16px, 3vw, 48px);
    display: grid;
    gap: var(--space-6);
    margin: auto;
}
.production-tablet {
    max-width: 1200px;
}
.device-page-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-6);
}
.device-page-heading h1 {
    margin-bottom: var(--space-3);
    overflow-wrap: anywhere;
}
.device-workspace .panel {
    min-width: 0;
}
.device-workspace .button,
.device-workspace select,
.device-workspace .text-button {
    min-height: 48px;
}
.production-equipment-grid,
.production-reason-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
    gap: var(--space-3);
}
.production-equipment-grid .button {
    flex-direction: column;
    justify-content: center;
    overflow-wrap: anywhere;
}
.production-equipment-grid .button[aria-current="page"] {
    border-color: var(--accent);
    box-shadow: inset 0 0 0 2px var(--accent);
    background: var(--accent-soft);
}
.production-reason-grid .button,
.production-main-action {
    width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    min-height: 64px;
}
.production-state {
    font-size: 22px;
    font-weight: 650;
}
.production-current [data-production-required-reason]:focus {
    outline: 3px solid var(--focus);
    outline-offset: var(--space-1);
}
.production-tablet .text-button:disabled {
    opacity: 0.55;
}
.production-equipment-picker summary {
    min-height: 48px;
    cursor: pointer;
    font-size: 19px;
    font-weight: 650;
    overflow-wrap: anywhere;
}
.production-equipment-picker[open] summary {
    margin-bottom: var(--space-5);
}
.production-times,
.production-history-values {
    margin: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
    gap: var(--space-5);
}
.production-times dd {
    font-size: clamp(26px, 4vw, 42px);
    font-variant-numeric: tabular-nums;
    margin: 0;
}
.production-times dt,
.production-history-values dt {
    color: var(--muted);
}
.production-history-values dd {
    margin: 0;
}
.production-secondary-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: var(--space-5);
}
.production-secondary-actions form {
    flex: 1 1 240px;
}
.production-secondary-actions .button {
    width: 100%;
}
.production-admin-form {
    width: 100%;
    max-width: 880px;
}
.production-admin-nav {
    display: flex;
    gap: var(--space-6);
    flex-wrap: wrap;
}
.production-admin-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--space-5);
    overflow-wrap: anywhere;
}
.production-admin-row h2 {
    font-size: 21px;
    margin-bottom: var(--space-2);
}
.production-device-list .production-admin-nav,
.production-device-list .production-admin-row {
    padding: var(--space-5);
}
.production-check {
    display: flex;
    gap: var(--space-3);
    align-items: start;
    padding: var(--space-3) 0;
    font-weight: 400;
}
.production-check input[type="checkbox"] {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    margin: 2px 0 0;
}
/* Tablettens nye områdevalg er kompakt uden at ændre skærm- og årsagsformularer. */
[data-production-scopes] {
    min-width: 0;
    margin: var(--space-6) 0 0;
    padding: 0;
    border: 0;
}
[data-production-scopes] .display-scope-group {
    min-width: 0;
    margin: var(--space-4) 0 0;
    padding: var(--space-3) var(--space-4);
    border: 1px solid var(--border);
    border-radius: var(--radius-control);
}
[data-production-scopes] legend {
    max-width: 100%;
    padding: 0 var(--space-2);
    font-weight: 650;
    overflow-wrap: anywhere;
}
[data-production-scopes] .production-check {
    min-height: 44px;
    margin: 0;
    padding: var(--space-2) 0;
    align-items: center;
}
[data-production-scopes] input[type="checkbox"] {
    min-height: 20px;
    margin: 0;
}
.production-secret-link {
    overflow-wrap: anywhere;
    font-family: ui-monospace, monospace;
}
.production-history-entry {
    padding: var(--space-5) 0;
    border-bottom: 1px solid var(--border);
}
.production-history-entry h3 {
    margin-bottom: var(--space-3);
}
@media (max-width: 600px) {
    .device-header {
        padding: var(--space-4);
    }
    .production-secondary-actions {
        display: grid;
    }
}

/* Læseskærmens tema og skala påvirker kun dens eget dokument, aldrig personlige sider. */
.display-body {
    font-size: calc(16px * var(--display-scale, 1));
}
.display-theme-dark {
    color-scheme: dark;
    --page: #142628;
    --surface: #203639;
    --ink: #edf4f2;
    --muted: #bdcecb;
    --border: #4c6667;
    --accent: #a0dfcc;
    --accent-soft: #284c46;
    --accent-hover: #c7f2e4;
    --focus: #a8caff;
    --field-border: #809b9c;
    --error: #ffb3bf;
    --warning: #f1ce8c;
    --success: #a0dfba;
    --warning-surface: #47391f;
    --error-surface: #48282e;
    background: var(--page);
    color: var(--ink);
}
.display-scale-85 {
    --display-scale: 0.85;
}
.display-scale-100 {
    --display-scale: 1;
}
.display-scale-110 {
    --display-scale: 1.1;
}
.display-scale-115 {
    --display-scale: 1.15;
}
.display-scale-120 {
    --display-scale: 1.2;
}
.display-scale-130 {
    --display-scale: 1.3;
}
.display-scale-140 {
    --display-scale: 1.4;
}
.display-scale-150 {
    --display-scale: 1.5;
}
.display-scale-165 {
    --display-scale: 1.65;
}
.display-scale-180 {
    --display-scale: 1.8;
}
.display-scale-200 {
    --display-scale: 2;
}
.display-workspace h1 {
    font-size: 2.4em;
}
.display-workspace h2 {
    font-size: 1.25em;
}
.display-workspace .button {
    font-size: 1em;
}
.display-workspace .button[aria-current='page'] {
    border-color: var(--accent);
    box-shadow: inset 0 0 0 2px var(--accent);
    background: var(--accent-soft);
}
.display-workspace .muted,
.display-workspace .field-help {
    font-size: 0.8em;
}
.display-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
    gap: var(--space-6);
}
.display-card {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    padding: var(--space-6);
    min-width: 0;
    overflow-wrap: anywhere;
}
.display-card-value {
    font-size: 3em;
    line-height: 1.15;
    font-weight: 650;
    font-variant-numeric: tabular-nums;
}
.display-card-value:last-child {
    margin-top: auto;
}
.display-task-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.display-task-list li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-5);
    padding: var(--space-5) 0;
    border-bottom: 1px solid var(--border);
    overflow-wrap: anywhere;
}
.display-task-list li > div {
    flex: 1 1 300px;
}
.display-task-list time {
    font-variant-numeric: tabular-nums;
}
.display-updated {
    color: var(--muted);
}
.display-scope-group {
    border-bottom: 1px solid var(--border);
    padding: var(--space-2) 0;
}
.display-scope-group > label:not(:first-child) {
    padding-inline-start: var(--space-8);
}

/* Supportens egen shell og samtale genbruger udelukkende fælles tokens og kontroller. */
.support-document { min-width: 0; }
.support-entry { display: grid; gap: var(--space-6); }
.support-shell { min-height: 100vh; }
.support-header {
    position: relative;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-5) var(--space-8);
    padding: var(--space-5) clamp(16px, 2.8vw, 40px);
    color: var(--on-deep);
    background-color: var(--deep);
}
.support-brand, .support-header-actions { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-5); }
.support-brand .wordmark { font-size: 26px; }
.support-brand > span { border-inline-start: 1px solid var(--on-deep-muted); padding-inline-start: var(--space-5); }
.support-identity { margin-inline-start: auto; min-width: 0; overflow-wrap: anywhere; }
.support-identity > span { display: block; color: var(--on-deep-muted); font-size: 13px; }
.support-header .text-button { color: var(--on-deep); }
.support-header a:focus-visible, .support-header button:focus-visible { outline-color: var(--focus-inverse); }
.support-languages { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-2); }
.support-languages a { padding: var(--space-3); min-height: 44px; display: inline-flex; align-items: center; border: 1px solid transparent; border-radius: var(--radius-control); color: var(--on-deep); }
.support-languages a[aria-current] { border-color: var(--on-deep-muted); font-weight: 650; }
.support-language-help { flex-basis: 100%; color: var(--on-deep-muted); font-size: 12px; }
.support-navigation { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); padding: var(--space-3) clamp(16px, 2.8vw, 40px); background: var(--surface); border-bottom: 1px solid var(--border); }
.support-navigation a { display: inline-flex; align-items: center; min-height: 44px; gap: var(--space-3); padding: var(--space-2) var(--space-3); color: var(--ink); border-radius: var(--radius-control); text-decoration: none; }
.support-navigation a[aria-current] { background: var(--accent-soft); color: var(--accent); font-weight: 650; }
.support-main { display: grid; gap: var(--space-6); min-width: 0; padding: clamp(16px, 2.8vw, 40px); }
.support-main > * { min-width: 0; }
.support-page-heading, .support-main > .page-header, .support-main > .page-heading { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: var(--space-5); padding: 0; }
.support-page-heading > div { min-width: 0; max-width: 90ch; }
.support-page-heading h1 { overflow-wrap: anywhere; }
.support-main .panel, .support-panel { padding: var(--space-6); min-width: 0; }
.support-main h2 { font-size: 23px; }
.support-main .notice { margin: 0; }
.support-section-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--space-4); margin-bottom: var(--space-5); }
.support-stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr)); gap: var(--space-5); }
.support-stat h2 { font-size: 14px; font-weight: 600; }
.support-stat > p { font-size: clamp(30px, 3vw, 44px); font-weight: 650; font-variant-numeric: tabular-nums; margin: var(--space-3) 0; }
.support-stat a { display: inline-flex; min-height: 44px; align-items: center; }
.support-table-scroll { overflow-x: auto; max-width: 100%; }
.support-table-scroll:focus-visible { outline: 3px solid var(--focus); outline-offset: var(--space-1); }
.support-table { width: 100%; min-width: 680px; border-collapse: collapse; text-align: start; }
.support-table th, .support-table td { text-align: start; padding: var(--space-4); vertical-align: top; border-bottom: 1px solid var(--border); font-size: 14px; }
.support-table th:first-child { min-width: 240px; max-width: 560px; }
.support-account-mail-table th:first-child { min-width: 0; max-width: none; }
.support-case-link { display: block; min-height: 44px; overflow-wrap: anywhere; }
.support-case-link > span { display: block; font-weight: 400; color: var(--ink); margin-top: var(--space-1); }
.support-secondary { display: block; font-size: 12px; color: var(--muted); margin-top: var(--space-1); }
.support-empty { padding: var(--space-6) 0; }
.support-empty h3 { margin-bottom: var(--space-3); }
.support-filter { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr)); gap: var(--space-4); align-items: end; }
.support-filter label { margin-top: 0; }
.support-filter-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-5); grid-column: 1 / -1; }
.support-case-form { width: 100%; max-width: 1120px; }
.support-ticket-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(270px, 340px); gap: var(--space-6); align-items: start; }
.support-thread, .support-ticket-aside { display: grid; gap: var(--space-6); min-width: 0; }
.support-badges { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-4); }
.support-status[data-status='waiting_support'], .support-status[data-status='new'], .support-priority[data-priority='high'] { color: var(--warning); background: var(--warning-surface); }
.support-status[data-status='resolved'], .support-status[data-status='closed'] { color: var(--success); background: var(--accent-soft); }
.support-priority[data-priority='critical'] { color: var(--error); background: var(--error-surface); }
.support-messages { display: grid; gap: var(--space-5); list-style: none; margin: var(--space-5) 0 0; padding: 0; }
.support-message { padding: var(--space-5); border: 1px solid var(--border); border-radius: var(--radius-control); background: var(--surface); }
.support-message header { display: flex; justify-content: space-between; flex-wrap: wrap; gap: var(--space-3); margin-bottom: var(--space-4); }
.support-message time { color: var(--muted); font-size: 13px; }
.support-message-body { overflow-wrap: anywhere; max-width: 88ch; }
.support-message-internal { border-inline-start: var(--space-1) solid var(--warning); background: var(--warning-surface); }
.support-internal-label { display: flex; align-items: center; gap: var(--space-2); font-size: 13px; font-weight: 650; margin-top: var(--space-2); }
.support-note-composer { border-inline-start: var(--space-1) solid var(--warning); }
.support-attachments { list-style: none; margin: var(--space-4) 0 0; padding: 0; }
.support-attachments a { display: inline-flex; align-items: center; gap: var(--space-3); min-height: 44px; overflow-wrap: anywhere; }
.support-facts { display: grid; gap: var(--space-4); margin: var(--space-5) 0 0; }
.support-facts dt { color: var(--muted); font-size: 13px; }
.support-facts dd { margin: var(--space-1) 0 0; overflow-wrap: anywhere; }
.support-activity { list-style: none; margin: var(--space-5) 0 0; padding: 0; }
.support-activity li { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-5); flex-wrap: wrap; padding: var(--space-4) 0; border-bottom: 1px solid var(--border); overflow-wrap: anywhere; }
.support-activity time, .support-activity p { color: var(--muted); font-size: 13px; }
.support-auth-screen { min-height: 100vh; display: grid; align-content: center; gap: var(--space-6); padding: var(--space-6) var(--space-4); background-color: var(--deep); }
.support-auth-header { width: min(100%, 520px); margin: auto; padding: 0; background: transparent; }
.support-auth-card { width: min(100%, 520px); max-width: 520px; margin: 0 auto; }
.support-auth-card h1, .support-auth-card h2 { font-size: 27px; line-height: 1.25; overflow-wrap: anywhere; }
.support-auth-card .button-full { margin-top: var(--space-6); }
@media (max-width: 1050px) {
    .support-ticket-layout { grid-template-columns: minmax(0, 1fr); }
    .support-filter { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 650px) {
    .support-header { align-items: flex-start; }
    .support-identity { margin-inline-start: 0; flex-basis: 100%; }
    .support-main .panel { padding: var(--space-5); }
    .support-filter { grid-template-columns: minmax(0, 1fr); }
    .support-main input, .support-main select, .support-main textarea { font-size: 16px; }
    .support-message { padding: var(--space-4); }
}

:root {
    --warning-surface: #fff0bd;
    --error-surface: #fce5e8;
    --metric-open-surface: #edf5f0;
    --metric-overdue-surface: #fff8e6;
    --metric-critical-surface: #fcf0f2;
}
a { color: var(--accent); }
.wordmark { color: inherit; text-decoration: none; }
.test-banner { padding: var(--space-2) var(--space-4); background: var(--warning-surface); color: var(--ink); text-align: center; font-size: 12px; }
.skip-link { position: absolute; left: var(--space-4); top: -100px; z-index: 10; padding: var(--space-3); background: var(--surface); }
.skip-link:focus { top: var(--space-4); }
.account-controls { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-6); min-width: 0; }
.account-controls > *, .workspace-top > *, .page-heading > *, .panel-heading > *, .dashboard-layout > *, .task-layout > * { min-width: 0; max-width: 100%; }
.panel-heading { flex-wrap: wrap; }
.workspace-body { padding: 0 var(--space-10) var(--space-12); }
.company-switch { display: flex; gap: var(--space-4); align-items: center; flex-wrap: wrap; margin-bottom: var(--space-6); }
.company-switch label { margin: 0; }
.company-switch select { width: auto; max-width: 100%; }
.metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-6); margin: 0 0 var(--space-8); }
.metrics > .metric { border: 1px solid var(--border); border-top: 3px solid var(--metric-color); border-radius: var(--radius-panel); padding: var(--space-5) var(--space-6); background: var(--metric-surface); }
.metric-open { --metric-color: var(--success); --metric-surface: var(--metric-open-surface); }
.metric-overdue { --metric-color: var(--warning); --metric-surface: var(--metric-overdue-surface); }
.metric-critical { --metric-color: var(--error); --metric-surface: var(--metric-critical-surface); }
.metrics dt { color: var(--ink); font-size: 13px; min-height: 1.5em; }
.metrics dd { margin: var(--space-2) 0 0; font-size: 36px; font-weight: 600; }
.metric-overdue dd, .metric-critical dd { color: var(--metric-color); }
.task-list { list-style: none; padding: 0; margin: 0; }
/* Faste datofelter og fælles tekstkolonner holder normale pc-rækker på én linje. */
.task-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 100px 210px; align-items: center; gap: var(--space-6); padding: var(--space-5) var(--space-8); }
.task-row + .task-row { border-top: 1px solid var(--border); }
.task-row > * { min-width: 0; overflow-wrap: anywhere; }
.task-row-title { font-weight: 600; text-underline-offset: 4px; }
.task-row-meta, .task-row-date { font-size: 13px; }
.task-row-date { font-variant-numeric: tabular-nums; }
.task-row > .status { justify-self: end; max-width: 100%; }
.status { display: inline-flex; padding: var(--space-1) var(--space-3); border-radius: var(--radius-control); font-weight: 600; font-size: 12px; color: var(--muted); background: var(--page); }
.status-due { color: var(--accent); background: var(--accent-soft); }
.status-overdue { color: var(--warning); background: var(--warning-surface); }
.status-critical { color: var(--error); background: var(--error-surface); }
.status-completed { color: var(--success); background: var(--accent-soft); }
.notice-error { --notice-color: var(--error); }
.notice-success { --notice-color: var(--success); }
.checkbox-label { display: flex; align-items: center; gap: var(--space-3); min-height: 44px; margin: var(--space-2) 0; }
.checkbox-label input { width: 20px; height: 20px; min-height: 20px; flex: 0 0 auto; accent-color: var(--accent); }
.checkbox-label span { min-width: 0; overflow-wrap: anywhere; }
.assignee-list { min-width: 0; border: 1px solid var(--border); border-radius: var(--radius-control); padding: var(--space-4); margin: var(--space-6) 0 0; }
.assignee-list legend { font-size: 13px; font-weight: 600; padding: 0 var(--space-2); }
.assignee-list .field-help { margin-top: 0; }
.preserve-lines { white-space: pre-wrap; }
.task-description { margin-top: var(--space-5); }
.task-facts { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-6); margin: var(--space-8) 0; }
.task-facts dt { color: var(--muted); font-size: 12px; }
.task-facts dd { margin: var(--space-1) 0 0; }
.task-form > .button { margin-top: var(--space-6); }
.task-form > .text-button { display: flex; margin-top: var(--space-6); }
.plan-note > p + p { margin-top: var(--space-4); }
.error-content { padding: var(--space-6); }
h1, h2, p, a, dd, .account-controls, .workspace-top strong { overflow-wrap: anywhere; }
dialog { border: 1px solid var(--border); border-radius: var(--radius-panel); padding: var(--space-8); max-width: min(92vw, 540px); color: var(--ink); }
dialog::backdrop { background: #103e3a99; }
dialog p, dialog form { margin: var(--space-5) 0; }
dialog > a, dialog > button { display: block; }
@media (max-width: 1180px) {
    .task-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-3) var(--space-6); }
    .task-row-date { grid-column: 1; }
}
@media (max-width: 900px) {
    .workspace-body { padding-left: var(--space-6); padding-right: var(--space-6); }
}
@media (max-width: 650px) {
    .workspace-body { padding-left: var(--space-4); padding-right: var(--space-4); }
    .metrics { gap: var(--space-3); }
    .metrics dt { font-size: 12px; }
    .metrics dd { font-size: 28px; }
    .metrics > .metric { padding: var(--space-4) var(--space-3); }
    .metrics dt { min-height: 3em; }
    .task-row { padding: var(--space-5); }
    .task-facts { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
    .metrics { grid-template-columns: minmax(0, 1fr); }
    .metrics > .metric { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
    .metrics dt { min-height: 0; }
    .metrics dd { margin: 0; }
    .task-row { grid-template-columns: minmax(0, 1fr); }
    .task-row > .status { justify-self: start; }
}

/* Personligt mørkt tema: samme komponenter, afstande og semantiske statusser som det lyse tema. */
:root[data-theme="dark"] {
    color-scheme: dark;
    --page: #102021;
    --surface: #182b2e;
    --ink: #e4efed;
    --muted: #aac1bf;
    --accent: #85d3bf;
    --accent-hover: #a0e1cf;
    --accent-soft: #203f3b;
    --border: #34504e;
    --field-border: #6d8e89;
    --focus: #8db8ff;
    --success: #9bdbb7;
    --warning: #f4c56b;
    --error: #ff9fab;
    --warning-surface: #47391f;
    --error-surface: #48282e;
    --metric-open-surface: #203f3b;
    --metric-overdue-surface: #47391f;
    --metric-critical-surface: #48282e;
}

:root[data-theme="dark"] .button-primary { color: var(--page); }
