/* Samler fælles designsystem samt arbejdsoversigt, opgavedetaljer og sessionstilstande. */
@import url("tokens-base.css");
@import url("forms.css");
@import url("access.css");
@import url("workspace.css");
@import url("responsive.css");
:root {
    --warning-surface: #fff0bd;
    --error-surface: #fce5e8;
}
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); }
.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 > div { border-top: 1px solid var(--border); padding: var(--space-5) 0; }
.metrics dt { color: var(--muted); font-size: 13px; min-height: 3em; }
.metrics dd { margin: var(--space-2) 0 0; font-size: 36px; font-weight: 600; }
.task-list { list-style: none; padding: 0; margin: 0; }
.task-row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-6); padding: var(--space-6) var(--space-8); }
.task-row + .task-row { border-top: 1px solid var(--border); }
.task-row-main { min-width: 0; }
.task-row-main a { font-weight: 600; text-underline-offset: 4px; }
.task-row-main p { font-size: 13px; margin-top: var(--space-2); }
.task-row-status { display: flex; align-items: flex-end; flex-direction: column; gap: var(--space-2); flex-shrink: 0; font-size: 13px; }
.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: 900px) {
    .workspace-body { padding-left: var(--space-6); padding-right: var(--space-6); }
    .task-row { flex-wrap: wrap; }
    .task-row-status { flex-direction: row; flex-wrap: wrap; align-items: center; }
}
@media (max-width: 650px) {
    .workspace-body { padding-left: var(--space-4); padding-right: var(--space-4); }
    .sidebar nav { flex-wrap: wrap; }
    .sidebar nav .nav-item { width: auto; }
    .metrics { gap: var(--space-3); }
    .metrics dt { font-size: 12px; }
    .metrics dd { font-size: 28px; }
    .task-row { padding: var(--space-5); }
    .task-facts { grid-template-columns: 1fr; }
}
