/* ┌─────────────────────────────────────────────────────────────────────────────┐
   │  dagens-notater.css — dagens notater i MCP-kolonnen                         │
   │                                                                             │
   │  Takeover-tilstanden lever mellem kolonnens to blivende elementer           │
   │  (CPR-feltet og Spørg journalen) og scroller usynligt som transkript-       │
   │  scenen. Design: docs/design/dagens-notater-kolonne-mockup.html.            │
   └─────────────────────────────────────────────────────────────────────────────┘ */

/* ─── Indgangen: "I dag · N"-chippen ──────────────────────────────────────── */

.dag-chip {
    display: flex;
    align-items: center;
    gap: 7px;
    width: 100%;
    border: 1px solid rgba(169, 204, 236, 0.45);
    background: rgba(214, 232, 243, 0.3);
    border-radius: 11px;
    padding: 8px 12px;
    font-size: 0.8rem;
    font-weight: 600;
    color: #3d5871;
    cursor: pointer;
    text-align: left;
}

.dag-chip:hover {
    background: rgba(214, 232, 243, 0.55);
}

.dag-chip-pil {
    margin-left: auto;
    color: #8fa0b1;
    font-weight: 400;
}

/* ─── Takeover-tilstanden ─────────────────────────────────────────────────── */

.dag-takeover {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.dag-hoved {
    display: flex;
    align-items: baseline;
    gap: 8px;
    flex: none;
    margin: 2px 2px 8px;
}

.dag-titel {
    font-size: 0.92rem;
    font-weight: 600;
    color: #2e4257;
}

.dag-antal {
    font-size: 0.72rem;
    color: #8fa0b1;
}

.dag-luk {
    margin-left: auto;
    border: none;
    background: none;
    color: #90a2b4;
    font-size: 0.95rem;
    cursor: pointer;
    padding: 2px 6px;
    border-radius: 6px;
    line-height: 1;
}

.dag-luk:hover {
    background: rgba(214, 232, 243, 0.5);
    color: #33465c;
}

.dag-liste {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    scrollbar-width: none;
    margin: 0 -4px;
    padding: 0 4px;
}

.dag-liste::-webkit-scrollbar {
    display: none;
}

/* ─── Rækker ──────────────────────────────────────────────────────────────── */

.dag-notat {
    display: flex;
    align-items: baseline;
    gap: 8px;
    width: 100%;
    border: none;
    background: none;
    padding: 8px 10px;
    border-radius: 11px;
    font-size: 0.8rem;
    color: #46586b;
    cursor: pointer;
    text-align: left;
}

.dag-notat:hover {
    background: rgba(214, 232, 243, 0.35);
}

.dag-tid {
    flex: none;
    font-size: 0.7rem;
    color: #8fa0b1;
    font-variant-numeric: tabular-nums;
    width: 34px;
}

.dag-type {
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dag-ok {
    margin-left: auto;
    flex: none;
    font-size: 0.68rem;
    color: #6da58c;
}

.dag-kladde {
    margin-left: auto;
    flex: none;
    font-size: 0.66rem;
    color: #a5842f;
    background: rgba(240, 224, 180, 0.4);
    border-radius: 999px;
    padding: 1px 7px;
}

.dag-skil {
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: #b0bdc9;
    margin: 8px 12px 2px;
}

.dag-tom {
    font-size: 0.78rem;
    color: #98a7b6;
    padding: 14px 10px;
}

/* ─── Udfoldet notat ──────────────────────────────────────────────────────── */

.dag-notat-aaben {
    background: rgba(214, 232, 243, 0.4);
    border: 1px solid rgba(169, 204, 236, 0.5);
    border-radius: 13px;
    padding: 4px 6px 10px;
    margin: 3px 0 6px;
}

.dag-notat-top {
    display: flex;
    align-items: baseline;
    gap: 8px;
    width: 100%;
    border: none;
    background: none;
    padding: 6px 6px 0;
    font-size: 0.8rem;
    color: #46586b;
    cursor: pointer;
    text-align: left;
}

.dag-notat-top .dag-type {
    color: #2e4257;
}

.dag-uddrag {
    font-size: 0.72rem;
    color: #5d7186;
    line-height: 1.5;
    margin: 7px 8px 9px;
    max-height: 4.6em;
    overflow: hidden;
}

/* Uddraget er notatets egen HTML — dæmp overskrifter/afsnit til listestørrelse. */
.dag-uddrag :is(h1, h2, h3, h4, p, div) {
    font-size: inherit;
    margin: 0 0 2px;
}

.dag-handling {
    display: flex;
    gap: 7px;
    padding: 0 8px;
}

.dag-btn {
    border: 1px solid rgba(169, 204, 236, 0.6);
    background: #fff;
    border-radius: 8px;
    padding: 4px 10px;
    font-size: 0.72rem;
    font-weight: 600;
    color: #3d5871;
    cursor: pointer;
}

.dag-btn-primaer {
    background: linear-gradient(180deg, #a9ccec, #7fadd8);
    border: none;
    color: #1d3244;
}

.dag-btn:disabled {
    opacity: 0.45;
    cursor: default;
}

/* ─── Foden ───────────────────────────────────────────────────────────────── */

.dag-fod {
    flex: none;
    font-size: 0.66rem;
    color: #a5b3c1;
    text-align: center;
    margin-top: 8px;
    line-height: 1.45;
}