/*
 * workforce.css — Workforce tab: org chart, missions, dispatch, specialist grid,
 *                trust/diff viewer, audit log, and drawer content sections.
 */

/* ── Org Chart ── */
#org-container {
    min-height: 220px; background: var(--bg-elevated); border: 1px solid var(--border);
    border-radius: var(--radius); padding: 20px; overflow: auto; margin-bottom: 20px;
    display: flex; align-items: center; justify-content: center;
}
.org-box {
    padding: 7px 13px; background: var(--bg-panel); border: 1px solid var(--border);
    border-radius: var(--radius); font-family: var(--font-mono); font-size: 0.78rem;
    color: var(--text-main); white-space: nowrap; cursor: pointer; transition: border-color 0.15s;
}
.org-box:hover { border-color: rgba(255,255,255,0.2); }
.org-box.root-box { border-color: rgba(0,255,136,0.4); color: var(--accent); }
.org-box.team-box { border-color: rgba(0,212,255,0.3); color: var(--secondary); }
.org-vline { width: 1px; height: 14px; background: var(--border); margin: 0 auto; }
.org-row { display: flex; gap: 16px; flex-wrap: wrap; justify-content: center; align-items: flex-start; }
.org-branch { display: flex; flex-direction: column; align-items: center; }
/* Team tint: subtree root gets a faint background based on team color slot */
.org-branch[data-team] > div > .org-box { border-color: rgba(0,212,255,0.25); }
.op-status-dot {
    display: inline-block; width: 5px; height: 5px; border-radius: 50%;
    margin-right: 5px; background: var(--text-dim); vertical-align: middle;
}
.op-status-dot.active { background: var(--accent); }
.op-status-dot.dead   { background: var(--warning); }

/* ── Missions / Dispatch ── */
.workforce-bottom { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
#mission-list, #dispatch-panel { max-height: 280px; overflow-y: auto; }
.mission-row {
    display: flex; align-items: center; gap: 9px;
    padding: 9px 13px; border-bottom: 1px solid var(--border);
    cursor: pointer; transition: background 0.1s; font-size: 0.78rem;
}
.mission-row:last-child { border-bottom: none; }
.mission-row:hover { background: var(--bg-panel); }
.mission-body   { flex: 1; min-width: 0; }
.mission-title  { color: var(--text-main); }
.mission-meta   { font-family: var(--font-mono); font-size: 0.78rem; color: var(--text-dim); margin-top: 2px; }
.mission-budget { font-family: var(--font-mono); font-size: 0.78rem; color: var(--text-muted); flex-shrink: 0; }

/* ── Specialist Grid (Agents/Marketplace tab) ── */
.specialist-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 10px; margin-bottom: 14px;
}

/* ── Trust / Diff Viewer ── */
.trust-layout { display: grid; grid-template-columns: 1fr 300px; gap: 12px; }
#diff-viewer { overflow: hidden; }
.diff-file-hd {
    display: flex; align-items: center; justify-content: space-between;
    padding: 9px 13px; border-bottom: 1px solid var(--border); background: var(--bg-panel);
}
.diff-fname   { font-family: var(--font-mono); font-size: 0.78rem; color: var(--text-main); }
.diff-actions { display: flex; gap: 6px; }
.diff-body    { overflow: auto; max-height: 300px; }
.diff-line {
    display: flex; font-family: var(--font-mono); font-size: 0.78rem;
    line-height: 1.7; white-space: pre;
}
.diff-ln   { color: var(--text-dim); min-width: 34px; padding: 0 8px; border-right: 1px solid var(--border); user-select: none; flex-shrink: 0; background: var(--bg-elevated); }
.diff-code { padding: 0 10px; flex: 1; }
.diff-line.add { background: rgba(0,255,136,0.07); }
.diff-line.add .diff-code { color: var(--accent); }
.diff-line.rem { background: rgba(255,95,87,0.07); }
.diff-line.rem .diff-code { color: var(--warning); }
.diff-line.ctx .diff-code { color: var(--text-dim); }

/* ── Shield / Audit Log ── */
#shield-panel { padding: 14px 16px; margin-bottom: 12px; }
#audit-log    { max-height: 200px; overflow-y: auto; }
.audit-row {
    display: flex; align-items: center; gap: 8px;
    padding: 6px 13px; border-bottom: 1px solid var(--border); font-size: 0.78rem;
}
.audit-row:last-child { border-bottom: none; }
.audit-ts   { font-family: var(--font-mono); font-size: 0.78rem; color: var(--text-dim); flex-shrink: 0; }
.audit-type { font-family: var(--font-mono); font-size: 0.78rem; flex-shrink: 0; }
.audit-tgt  { color: var(--text-dim); flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ── Drawer Detail Sections ── */
.dsec { margin-bottom: var(--space-6); }
.dsec-title {
    font-family: var(--font-mono); font-size: var(--text-sm); font-weight: var(--weight-semibold);
    letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-dim); margin-bottom: 7px;
}
.drow { display: flex; justify-content: space-between; align-items: baseline; padding: var(--space-1) 0; border-bottom: 1px solid var(--border); font-size: var(--text-sm); }
.drow:last-child { border-bottom: none; }
.drow-k { color: var(--text-muted); flex-shrink: 0; padding-right: var(--space-3); }
.drow-v { font-family: var(--font-mono); color: var(--text-primary); text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 65%; }
.dcontent {
    font-size: var(--text-sm); color: var(--text-muted); line-height: 1.6;
    padding: 9px 11px; border-radius: var(--radius);
    background: var(--bg-panel); border: 1px solid var(--border);
}
.dtags { display: flex; flex-wrap: wrap; gap: 4px; }

.dispatch-strip {
    margin-top: 10px;
    padding: 10px;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--bg-panel);
}
.ds-stages { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin-bottom: 7px; }
.ds-stage {
    font: 0.68rem var(--font-mono);
    padding: 2px 6px;
    border: 1px solid var(--border);
    border-radius: 999px;
    color: var(--text-dim);
}
.ds-stage.ds-done { color: var(--accent); border-color: rgba(0,255,136,0.28); }
.ds-stage.ds-active { color: var(--secondary); border-color: rgba(0,212,255,0.35); }
.ds-sep { color: var(--text-dim); font-size: 0.68rem; }
.ds-stdout, .ds-summary {
    font-size: 0.74rem;
    color: var(--text-muted);
    line-height: 1.45;
    margin-top: 5px;
}
.ds-meta { display: flex; flex-wrap: wrap; gap: 8px; color: var(--text-dim); font: 0.68rem var(--font-mono); }
.ds-error { margin-top: 6px; color: var(--warning); font-size: 0.74rem; }
.ds-stop-btn { margin-top: 8px; }

/* ── Unified workforce kanban ── */
.workforce-kanban { padding: 0; background: transparent; border: none !important; }
.kanban-meta { font-size: 0.75rem; color: var(--text-dim); margin-bottom: 8px; padding: 0 4px; }
.kanban-scroll { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 8px; }
.kanban-lane {
    min-width: 220px; max-width: 280px; flex-shrink: 0;
    background: var(--bg-panel); border: 1px solid var(--border);
    border-radius: var(--radius); display: flex; flex-direction: column;
}
.kanban-lane-hd {
    display: flex; align-items: center; justify-content: space-between;
    padding: 7px 10px; border-bottom: 1px solid var(--border);
    font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em;
}
.kanban-lane-title { color: var(--text-dim); }
.kanban-lane-count {
    background: var(--bg-elevated); color: var(--text-muted);
    border-radius: 10px; padding: 1px 6px; font-size: 0.68rem;
}
.lane-ready .kanban-lane-hd  { border-color: rgba(0,255,136,0.25); }
.lane-ready .kanban-lane-title { color: var(--accent); }
.lane-wip   .kanban-lane-hd  { border-color: rgba(0,212,255,0.25); }
.lane-wip   .kanban-lane-title { color: var(--secondary); }
.lane-review .kanban-lane-title { color: #f5a623; }
.lane-blocked .kanban-lane-title { color: var(--warning); }
.lane-done   .kanban-lane-title { color: var(--accent); opacity: 0.6; }
.lane-failed .kanban-lane-title { color: var(--warning); }
.kanban-cards { padding: 6px; display: flex; flex-direction: column; gap: 5px; }
.kanban-card {
    background: var(--bg-elevated); border: 1px solid var(--border);
    border-radius: 4px; padding: 6px 8px; cursor: default;
    transition: border-color 0.12s;
}
.kanban-card:hover { border-color: rgba(255,255,255,0.15); }
.kc-top { display: flex; align-items: center; gap: 5px; margin-bottom: 3px; }
.kc-pri {
    font-size: 0.65rem; font-weight: 700; color: var(--text-muted);
    background: var(--bg-panel); border-radius: 3px; padding: 0 4px;
}
.kc-id { font-size: 0.65rem; color: var(--text-dim); font-family: var(--font-mono); }
.kc-title { font-size: 0.74rem; color: var(--text-main); line-height: 1.35; word-break: break-word; }
.kc-goal {
    margin-top: 5px;
    color: var(--text-main);
    font-size: 0.72rem;
    line-height: 1.35;
    word-break: break-word;
}
.kc-flow {
    margin-top: 7px;
    display: grid;
    gap: 5px;
}
.kc-flow div {
    border-left: 2px solid rgba(255,255,255,0.08);
    padding-left: 7px;
}
.kc-flow span {
    display: block;
    margin-bottom: 1px;
    color: var(--text-dim);
    font-size: 0.58rem;
    font-family: var(--font-mono);
    text-transform: uppercase;
}
.kc-flow p {
    margin: 0;
    color: var(--text-muted);
    font-size: 0.66rem;
    line-height: 1.3;
    word-break: break-word;
}
.kc-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 7px;
}
.kc-meta span {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--text-dim);
    background: var(--bg-panel);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 3px;
    padding: 1px 5px;
    font-size: 0.6rem;
    font-family: var(--font-mono);
}
.kc-worker { font-size: 0.65rem; color: var(--text-dim); font-family: var(--font-mono); margin-top: 3px; display: block; }
.kanban-overflow { font-size: 0.7rem; color: var(--text-dim); text-align: center; padding: 4px; }
.kanban-empty { color: var(--text-dim); font-size: 0.8rem; padding: 20px; text-align: center; }
.kanban-empty-panel {
    min-height: 110px;
    border: 1px dashed var(--border);
    border-radius: var(--radius);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
}
.kanban-empty-title {
    font-family: var(--font-mono);
    font-size: 0.8rem;
    color: var(--text-dim);
}
.kanban-empty-sub {
    max-width: 360px;
    font-size: 0.74rem;
    line-height: 1.45;
    opacity: 0.75;
}

/* ── Sortie timeline ── */
.sortie-scroll { display: flex; flex-direction: column; gap: 8px; padding: 10px; }
.sortie-row {
    display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-start;
    position: relative;
}
.sortie-row + .sortie-row { border-top: 1px solid var(--border); padding-top: 8px; }
.st-parallel-badge {
    font-size: 0.65rem; font-weight: 600; color: var(--secondary);
    background: rgba(0,212,255,0.08); border: 1px solid rgba(0,212,255,0.2);
    border-radius: 10px; padding: 2px 8px; align-self: center; white-space: nowrap;
}
.sortie-card {
    min-width: 140px; max-width: 200px;
    background: var(--bg-elevated); border: 1px solid var(--border);
    border-radius: 6px; padding: 8px 10px; font-size: 0.72rem;
    transition: border-color 0.12s;
}
.sortie-card.sc-good { border-color: rgba(0,255,136,0.25); }
.sortie-card.sc-bad  { border-color: rgba(255,95,87,0.3); }
.sc-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px; }
.sc-id { font-family: var(--font-mono); font-size: 0.65rem; color: var(--text-dim); }
.sc-op { color: var(--text-muted); font-size: 0.68rem; font-family: var(--font-mono); margin-bottom: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.st-files { display: flex; flex-wrap: wrap; gap: 3px; margin-bottom: 4px; }
.st-file {
    font-size: 0.62rem; font-family: var(--font-mono); color: var(--accent);
    background: rgba(0,255,136,0.07); border-radius: 3px; padding: 1px 4px;
    max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.st-file-more { font-size: 0.62rem; color: var(--text-dim); padding: 1px 4px; }
.sc-meta { font-size: 0.65rem; color: var(--text-dim); }
