/* loads.css — fanen »Loads« i produktionens arbejdsrum (19/10-2026). Samme formsprog som Levering-grid'et (projects.css .lvl-*):
   tom celle = svag rød (mangler), ✓ = grøn, – = ikke relevant. Første to kolonner (type + kort-nr) står fast ved vandret rul. */
.ld-head { flex-wrap: wrap; row-gap: 8px; }
.ld-last { font-family: "Geist Mono", ui-monospace, monospace; font-size: 11px; color: var(--cream-faint); }
.ld-tools { margin-left: auto; display: inline-flex; gap: 6px; flex-wrap: wrap; }
.ld-tbtn {
    font-family: "Geist Mono", ui-monospace, monospace; font-size: 11px; font-weight: 600;
    color: var(--cream-mute); background: var(--ink-4); border: 1px solid var(--rule-2);
    border-radius: 7px; padding: 5px 11px; cursor: pointer; transition: all 0.12s; white-space: nowrap;
}
.ld-tbtn:hover { color: var(--cream); border-color: var(--cream-mute); }
.ld-tbtn.on { color: var(--cream); border-color: var(--accent); background: rgba(217,72,44,0.18); }

/* Dag-strip */
.ld-days { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0 10px; }
.ld-day {
    position: relative; display: inline-flex; align-items: baseline; gap: 6px;
    font-size: 12px; color: var(--cream-dim); background: var(--ink-3); border: 1px solid var(--rule-2);
    border-radius: 8px; padding: 6px 10px 8px; cursor: pointer; transition: border-color 0.12s, background 0.12s; overflow: hidden;
}
.ld-day:hover { border-color: var(--cream-mute); color: var(--cream); }
.ld-day.sel { border-color: var(--accent); color: var(--cream); background: var(--ink-4); }
.ld-day.done .ld-day-l { color: #7fbf8b; }
.ld-day-l { font-weight: 700; }
.ld-day-d { font-family: "Geist Mono", ui-monospace, monospace; font-size: 10.5px; color: var(--cream-faint); }
.ld-day-open { font-family: "Geist Mono", ui-monospace, monospace; font-size: 10px; font-weight: 700; color: #ffb4a3; background: rgba(217,72,44,0.22); border-radius: 4px; padding: 0 5px; }
.ld-day-ok { font-size: 11px; color: #7fbf8b; font-weight: 700; }
.ld-day-warn { font-size: 11px; color: #f5c842; }
.ld-bar { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: rgba(217,72,44,0.25); }
.ld-bar b { display: block; height: 100%; background: #7fbf8b; }
.ld-day-new { border-style: dashed; color: var(--cream-mute); padding-bottom: 6px; }
.ld-daybar { font-size: 12.5px; color: var(--cream-mute); margin: 0 0 10px; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.ld-daybar strong { color: var(--cream); }
.ld-daynote { font-style: italic; }

/* Tabellen */
.ld-table-wrap { overflow-x: auto; max-width: 100%; border: 1px solid var(--rule-2); border-radius: 10px; }
.ld-table { border-collapse: separate; border-spacing: 0; font-size: 12px; min-width: 100%; }
.ld-table th {
    background: var(--ink-3); border-bottom: 1px solid var(--rule-2); color: var(--cream-mute);
    font-size: 10.5px; font-weight: 600; line-height: 1.2; padding: 8px 4px 6px; vertical-align: bottom;
}
.ld-h-type, .ld-type { position: sticky; left: 0; z-index: 2; width: 86px; min-width: 86px; max-width: 86px; }
.ld-h-label, .ld-label { position: sticky; left: 86px; z-index: 2; width: 178px; min-width: 178px; max-width: 178px; border-right: 1px solid var(--rule-2); }
.ld-table th.ld-h-type, .ld-table th.ld-h-label { text-align: left; padding-left: 10px; z-index: 3; }
.ld-col { min-width: 62px; max-width: 92px; text-align: center; white-space: normal; overflow-wrap: break-word; -webkit-hyphens: auto; hyphens: auto; }
.ld-col-note { min-width: 150px; }
.ld-col-rel { color: var(--cream); }
.ld-col-n { display: block; margin-top: 3px; font-family: "Geist Mono", ui-monospace, monospace; font-size: 9.5px; color: var(--cream-faint); }
.ld-col-n.all { color: #7fbf8b; }

.ld-team td {
    background: var(--ink-4); border-top: 1px solid var(--rule-2); border-bottom: 1px solid var(--rule-2);
    padding: 6px 10px; font-size: 12px; color: var(--cream-dim);
}
/* Holdets navn/status bliver stående i venstre side, når tabellen rulles vandret (td'en spænder hele bredden) */
.ld-sticky { position: sticky; left: 10px; display: inline-flex; align-items: center; flex-wrap: wrap; row-gap: 4px; max-width: calc(100vw - 80px); }
.ld-team-name { font-weight: 700; color: var(--cream); margin-right: 8px; }
.ld-team-sub { color: var(--cream-mute); margin-right: 8px; }
.ld-team-crew { color: var(--cream-faint); margin-right: 10px; }
.ld-team-n { font-family: "Geist Mono", ui-monospace, monospace; font-size: 10.5px; color: var(--cream-faint); margin-left: 8px; }
.ld-team.is-out td { background: var(--ink-3); color: var(--cream-faint); }
.ld-team.is-out .ld-team-name { color: var(--cream-mute); }
.ld-status {
    font-family: "Geist Mono", ui-monospace, monospace; font-size: 10px; font-weight: 700; letter-spacing: .03em;
    border-radius: 999px; padding: 2px 9px; border: 1px solid var(--rule-2); background: transparent; color: var(--cream-mute); cursor: pointer;
}
.ld-status:disabled { cursor: default; }
.ld-st-aktiv { color: #7fbf8b; border-color: rgba(127,191,139,0.45); }
.ld-st-fanget { color: #ffb4a3; border-color: rgba(217,72,44,0.55); background: rgba(217,72,44,0.14); }
.ld-st-ikke_aktiv { color: var(--cream-faint); border-style: dashed; }

.ld-card td { border-bottom: 1px solid var(--rule-2); background: var(--ink-2); }
.ld-card:hover td { background: var(--ink-3); }
.ld-type { padding: 0 8px 0 10px; color: var(--cream-mute); font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ld-label { padding: 0 6px 0 8px; white-space: nowrap; }
.ld-lbl {
    font-family: "Geist Mono", ui-monospace, monospace; font-size: 12px; font-weight: 600; color: var(--cream);
    background: none; border: none; padding: 4px 2px; cursor: pointer; max-width: 120px; overflow: hidden; text-overflow: ellipsis; vertical-align: middle;
}
.ld-lbl:hover { color: var(--accent-hot, #ff8a6a); text-decoration: underline; }
.ld-prob { background: none; border: none; color: var(--cream-faint); opacity: .35; cursor: pointer; font-size: 12px; padding: 2px 3px; vertical-align: middle; }
.ld-prob:hover { opacity: 1; }
.ld-prob.on { color: #f5c842; opacity: 1; }
.ld-card.is-problem .ld-label { box-shadow: inset 3px 0 0 #f5c842; }
.ld-reuse { display: inline-block; margin-left: 4px; font-size: 10px; font-weight: 700; color: #f5c842; background: rgba(245,200,66,0.14); border: 1px solid rgba(245,200,66,0.4); border-radius: 4px; padding: 0 5px; vertical-align: middle; max-width: 150px; overflow: hidden; text-overflow: ellipsis; }

.ld-cell {
    position: relative; height: 30px; min-width: 62px; text-align: center; vertical-align: middle;
    border-left: 1px solid var(--rule-2); font-size: 13px; font-weight: 700; color: #7fbf8b;
    background: rgba(217,72,44,0.12) !important;
}
.ld-cell.done { background: rgba(127,191,139,0.18) !important; }
.ld-cell.na { background: var(--ink-3) !important; color: var(--cream-faint); font-weight: 400; }
.ld-cell.clickable { cursor: pointer; transition: background 0.1s; user-select: none; }
.ld-card:hover .ld-cell.clickable:not(.done):not(.na) { background: rgba(217,72,44,0.22) !important; }
.ld-card:hover .ld-cell.done { background: rgba(127,191,139,0.28) !important; }
.ld-cell:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.ld-cell.has-why::after { content: ''; position: absolute; top: 3px; right: 3px; width: 5px; height: 5px; border-radius: 50%; background: #f5c842; }
.ld-cell.pv-done { background: rgba(127,191,139,0.45) !important; }
.ld-cell.pv-clear { background: rgba(217,72,44,0.40) !important; }
.ld-table.dragging, .ld-table.dragging * { cursor: ns-resize !important; }
.ld-who { display: block; font-family: "Geist Mono", ui-monospace, monospace; font-size: 8.5px; font-weight: 600; color: var(--cream-mute); line-height: 1; margin-top: 1px; }

.ld-note { border-left: 1px solid var(--rule-2); padding: 2px 4px; vertical-align: middle; }
.ld-note-in {
    display: block; width: 160px; min-height: 24px; height: 24px; resize: none; overflow: hidden;
    font: inherit; font-size: 11.5px; line-height: 1.35; color: var(--cream-dim);
    background: transparent; border: 1px solid transparent; border-radius: 5px; padding: 3px 5px; white-space: nowrap; text-overflow: ellipsis;
}
.ld-note-in:hover { border-color: var(--rule-2); }
.ld-note-in.open, .ld-note-in:focus { height: 84px; overflow: auto; white-space: pre-wrap; background: var(--ink-4); border-color: var(--cream-mute); color: var(--cream); outline: none; position: relative; z-index: 4; }
.ld-note-ro { display: block; max-width: 180px; font-size: 11.5px; color: var(--cream-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.ld-add td { background: var(--ink-2); border-bottom: 1px solid var(--rule-2); padding: 3px 6px; }
.ld-add-type { width: 100%; font-size: 11px; color: var(--cream-mute); background: var(--ink-3); border: 1px solid var(--rule-2); border-radius: 5px; padding: 3px 2px; }
.ld-add-label {
    width: 178px; max-width: 100%; font-family: "Geist Mono", ui-monospace, monospace; font-size: 12px; color: var(--cream);
    background: transparent; border: 1px dashed var(--rule-2); border-radius: 5px; padding: 4px 7px;
}
.ld-add-label:focus { outline: none; border-style: solid; border-color: var(--accent); background: var(--ink-3); }
.ld-dayrow td { background: var(--ink-5); padding: 6px 10px; }
.ld-dayjump { font-weight: 700; color: var(--cream); background: none; border: none; cursor: pointer; padding: 0; font-size: 12.5px; }
.ld-dayjump:hover { text-decoration: underline; }
.ld-empty-row { padding: 14px 12px; color: var(--cream-faint); font-size: 12.5px; }

/* Dialoger (start, dag, kort/kvittering, hold, trin) */
.ld-form { display: flex; flex-direction: column; gap: 10px; text-align: left; }
.ld-form label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--cream-mute); }
.ld-form input[type=text], .ld-form input[type=date], .ld-form select, .ld-form textarea {
    font: inherit; font-size: 13px; color: var(--cream); background: var(--ink-4); border: 1px solid var(--rule-2); border-radius: 7px; padding: 6px 9px;
}
.ld-form-intro { font-size: 12.5px; color: var(--cream-mute); margin: 0 0 4px; line-height: 1.45; }
.ld-hint { font-size: 11.5px; color: var(--cream-faint); }
.ld-list .ld-row { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 5px 0; border-bottom: 1px solid var(--rule-2); }
.ld-list .ld-row input[type=text] { flex: 1 1 120px; min-width: 0; }
.ld-list .ld-row select { flex: 0 0 auto; }
.ld-mv, .ld-rm { font-size: 12px; color: var(--cream-mute); background: var(--ink-4); border: 1px solid var(--rule-2); border-radius: 6px; padding: 3px 8px; cursor: pointer; }
.ld-mv:hover, .ld-rm:hover:not(:disabled) { color: var(--cream); border-color: var(--cream-mute); }
.ld-rm:disabled { opacity: .35; cursor: not-allowed; }
.ld-s-rel { flex-direction: row !important; align-items: center; gap: 4px !important; font-size: 11.5px; white-space: nowrap; }
.ld-s-n { font-family: "Geist Mono", ui-monospace, monospace; font-size: 10.5px; color: var(--cream-faint); min-width: 22px; text-align: right; }
.ld-kv-edit { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px; }
.ld-kv-prob { grid-column: 1 / -1; flex-direction: row !important; align-items: center; gap: 8px !important; color: var(--cream-dim) !important; }
.ld-kv-ro { font-family: "Geist Mono", ui-monospace, monospace; font-size: 13px; color: var(--cream); }
.ld-kv-steps { display: flex; flex-wrap: wrap; gap: 5px; }
.ld-kv-step { font-size: 11px; color: var(--cream-mute); background: rgba(217,72,44,0.12); border-radius: 5px; padding: 2px 7px; }
.ld-kv-step.done { color: #9fd8aa; background: rgba(127,191,139,0.16); }
.ld-kv-step.na { color: var(--cream-faint); background: var(--ink-4); }
.ld-kv-h { font-size: 12px; font-weight: 700; color: var(--cream); margin-top: 4px; }
.ld-log { list-style: none; margin: 0; padding: 0; max-height: 260px; overflow-y: auto; border: 1px solid var(--rule-2); border-radius: 8px; }
.ld-log li { font-size: 12px; color: var(--cream-dim); padding: 5px 9px; border-bottom: 1px solid var(--rule-2); line-height: 1.4; }
.ld-log li:last-child { border-bottom: none; }
.ld-log-when { font-family: "Geist Mono", ui-monospace, monospace; font-size: 10.5px; color: var(--cream-faint); }
.ld-log-who { font-weight: 700; color: var(--cream); }
.pf-dialog-btn.ld-danger { color: #ff8e8e; border-color: rgba(255,107,107,0.45); }
.pf-dialog-btn.ld-danger:hover { background: rgba(255,107,107,0.16); }

@media (max-width: 760px) {
    .ld-h-type, .ld-type { width: 56px; min-width: 56px; max-width: 56px; }
    .ld-h-label, .ld-label { left: 56px; width: 128px; min-width: 128px; max-width: 128px; }
    .ld-lbl { max-width: 84px; }
    .ld-cell { min-width: 56px; }
    .ld-col { min-width: 56px; font-size: 10px; }
    .ld-add-label { width: 120px; }
    .ld-tools { margin-left: 0; }
    .ld-kv-edit { grid-template-columns: 1fr; }
}