/* Dynamint Module CSS - auto-generated from ui-model.css files */

/* Module: Nexum Load Plugin */
/* ============================================================
   nexum-load — Resource Scheduler styling.

   GRantt Scheduler is headless: this module maps its primitives to the Nexum
   semantic tokens through the ordered /ui-model/css channel. Keep geometry
   computed by the component inline; visual styling belongs here.
   ============================================================ */

.nexum-scheduler-host {
    --g-border: hsl(var(--border));
    --g-header-font-size: 11px;
    --g-selected-bg: color-mix(in srgb, var(--nx-selection) 16%, transparent);
    --g-focus-bg: color-mix(in srgb, var(--nx-selection) 12%, transparent);
    --g-focus-border: hsl(var(--ring));
    --g-assignment-bg: var(--nx-gantt-bar);
    --g-cell-color: hsl(var(--foreground));
    --g-cell-input-bg: hsl(var(--card));
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 8px;
    background: hsl(var(--card));
    color: hsl(var(--card-foreground));
    font-family: inherit;
    font-size: 13px;
}

.nexum-scheduler-empty {
    padding: 24px;
    color: hsl(var(--muted-foreground));
    font-size: 13px;
}

/* Toolbar */
.nexum-scheduler-toolbar {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 8px;
    flex: 0 0 auto;
    flex-wrap: wrap;
    background: hsl(var(--card));
    border-bottom: 1px solid hsl(var(--border));
}

.nexum-scheduler-toolbar-button,
.nexum-scheduler-toolbar-select {
    height: 32px;
    border: 1px solid hsl(var(--border));
    border-radius: 6px;
    background: hsl(var(--card));
    color: hsl(var(--card-foreground));
    font-family: inherit;
    font-size: 13px;
    outline: none;
}

.nexum-scheduler-toolbar-button {
    padding: 0 10px;
    cursor: pointer;
    font-weight: 500;
    transition: transform 120ms cubic-bezier(0.23, 1, 0.32, 1),
                background-color 120ms ease,
                border-color 120ms ease;
}

.nexum-scheduler-toolbar-select { padding: 0 28px 0 10px; }
.nexum-scheduler-granularity-select { margin-inline-start: 8px; }

@media (hover: hover) and (pointer: fine) {
    .nexum-scheduler-toolbar-button:hover { background: hsl(var(--accent)); }
}

.nexum-scheduler-toolbar-button:active { transform: scale(0.98); }
.nexum-scheduler-toolbar-button:disabled { opacity: 0.45; cursor: not-allowed; }
.nexum-scheduler-toolbar-button[data-active] {
    background: var(--nx-selection);
    border-color: var(--nx-selection);
    color: hsl(var(--primary-foreground));
}
.nexum-scheduler-toolbar-button:focus-visible,
.nexum-scheduler-toolbar-select:focus-visible {
    box-shadow: 0 0 0 3px color-mix(in srgb, hsl(var(--ring)) 30%, transparent);
}

.nexum-scheduler-time-nav {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-inline-start: auto;
    direction: ltr;
}

.nexum-scheduler-range-label {
    min-width: 130px;
    color: hsl(var(--muted-foreground));
    font-size: 12px;
    text-align: right;
    unicode-bidi: isolate;
}

.nexum-scheduler-analysis-period {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-inline-start: auto;
    direction: ltr;
}

.nexum-scheduler-analysis-label {
    color: hsl(var(--muted-foreground));
    font-size: 12px;
    font-weight: 600;
}

.nexum-scheduler-analysis-period input[type="date"] {
    width: 132px;
    height: 32px;
    box-sizing: border-box;
    border: 1px solid hsl(var(--border));
    border-radius: 6px;
    padding: 0 8px;
    background: hsl(var(--card));
    color: hsl(var(--card-foreground));
    color-scheme: inherit;
    font: inherit;
}

.nexum-scheduler-analysis-period input[type="date"]:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, hsl(var(--ring)) 30%, transparent);
}

.nexum-scheduler-link-button { white-space: nowrap; }

@media (max-width: 1100px) {
    .nexum-scheduler-toolbar { flex-wrap: wrap; }
    .nexum-scheduler-analysis-period { width: 100%; margin-inline-start: 0; }
}

/* Scheduler surfaces */
.nexum-scheduler-host [data-scheduler-root] {
    min-height: 0;
    font-family: inherit;
    font-size: 13px;
}

.nexum-scheduler-host [data-scheduler-resource-list] {
    background: hsl(var(--card));
    border-inline-end: 1px solid hsl(var(--border));
}

.nexum-scheduler-host [data-scheduler-resource-list-header],
.nexum-scheduler-host [data-scheduler-timeline-header],
.nexum-scheduler-host [data-scheduler-grid-header] {
    background: hsl(var(--muted));
    border-bottom: 1px solid hsl(var(--border));
    color: hsl(var(--muted-foreground));
}

.nexum-scheduler-host [data-scheduler-resource-list-header] [data-column-id] {
    display: flex;
    align-items: center;
    height: 100%;
    color: hsl(var(--muted-foreground));
    text-transform: uppercase;
    letter-spacing: 0.5px;
    user-select: none;
}

.nexum-scheduler-host [data-grantt-scale-row] {
    position: relative;
    border-bottom: 1px solid hsl(var(--border));
}

.nexum-scheduler-host [data-grantt-scale-cell] {
    display: flex;
    align-items: center;
    padding-left: 6px;
    overflow: hidden;
    border-right: 1px solid hsl(var(--border));
    box-sizing: border-box;
    color: hsl(var(--muted-foreground));
    font-size: 11px;
    white-space: nowrap;
}

/* Same as the Gantt header: the terminal cell is a partial period and must not be inflated
   past the timeline edge by its own border-box padding + border floor. */
.nexum-scheduler-host [data-grantt-scale-row] [data-grantt-scale-cell]:last-child {
    border-right: 0;
}

.nexum-scheduler-host [data-grantt-scale-row][data-unit="month"] [data-grantt-scale-cell],
.nexum-scheduler-host [data-grantt-scale-row][data-unit="year"] [data-grantt-scale-cell] {
    color: hsl(var(--foreground));
    font-size: 12px;
    font-weight: 600;
}

.nexum-scheduler-host [data-grantt-scale-row][data-unit="week"] [data-grantt-scale-cell] {
    color: hsl(var(--muted-foreground));
    font-size: 10px;
}

.nexum-scheduler-host [data-scheduler-timeline],
.nexum-scheduler-host div[data-scheduler-grid] { background: hsl(var(--card)); }
.nexum-scheduler-host [data-scheduler-timeline-scroll] { cursor: grab; }
.nexum-scheduler-host [data-scheduler-timeline-scroll][data-dragging] {
    cursor: grabbing;
    user-select: none;
}
.nexum-scheduler-host svg[data-scheduler-grid] { color: hsl(var(--border)); }

.nexum-scheduler-host [data-scheduler-row] {
    border-bottom: 1px solid hsl(var(--border));
    box-sizing: border-box;
}

/* Splitter follows the same quiet/active language as the Gantt splitter. */
.nexum-scheduler-host [data-resource-manager-column-splitter] {
    --g-splitter-bg: hsl(var(--border));
    transition: background-color 120ms ease;
}
@media (hover: hover) and (pointer: fine) {
    .nexum-scheduler-host [data-resource-manager-column-splitter]:hover {
        --g-splitter-bg: var(--nx-selection);
    }
}
.nexum-scheduler-host [data-resource-manager-column-splitter]:active {
    --g-splitter-bg: var(--nx-selection);
}

/* Allocation bars use the same visual grammar as Gantt bars. */
.nexum-scheduler-host [data-scheduler-assignment] {
    border-radius: 4px;
    box-shadow: 0 1px 3px rgb(0 0 0 / 0.24);
    color: #fff;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 0 4px;
    overflow: hidden;
    font-size: 11px;
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: box-shadow 120ms ease;
}
.nexum-scheduler-host [data-scheduler-assignment][data-type="absence"] {
    --g-assignment-bg: hsl(var(--muted-foreground) / 0.35);
    box-shadow: none;
}
@media (hover: hover) and (pointer: fine) {
    .nexum-scheduler-host [data-scheduler-assignment]:hover {
        z-index: 5;
        box-shadow: 0 2px 8px rgb(0 0 0 / 0.35);
    }
}
.nexum-scheduler-host [data-scheduler-assignment]:focus-visible {
    z-index: 10;
    outline: 2px solid hsl(var(--ring));
    outline-offset: 1px;
}
.nexum-scheduler-host [data-scheduler-assignment][data-dragging] {
    z-index: 20;
    opacity: 0.85;
    box-shadow: 0 0 0 2px var(--nx-selection),
                0 4px 16px color-mix(in srgb, var(--nx-selection) 40%, transparent);
}

/* Editable grid */
.nexum-scheduler-host [data-scheduler-grid-cell] {
    color: var(--g-cell-color);
    font-size: 12px;
}
.nexum-scheduler-host [data-scheduler-grid-cell-input] {
    color: var(--g-cell-color);
    background: var(--g-cell-input-bg);
    caret-color: hsl(var(--primary));
    font-family: inherit;
    font-size: 12px;
}
.nexum-scheduler-host [data-scheduler-grid-cell][data-editing] {
    box-shadow: inset 0 0 0 2px hsl(var(--ring));
}

/* Diagnostic and state styling (ADR-0074, ADR-0076) */
.nexum-scheduler-host [data-scheduler-assignment][data-diagnostic="invalid"] {
    outline: 2px solid var(--nx-load-invalid);
    outline-offset: -1px;
}

.nexum-scheduler-host [data-scheduler-assignment][data-diagnostic="inert"] {
    background: repeating-linear-gradient(
        45deg,
        color-mix(in srgb, var(--nx-load-inert) 30%, transparent),
        color-mix(in srgb, var(--nx-load-inert) 30%, transparent) 4px,
        transparent 4px,
        transparent 8px
    );
    text-decoration: line-through;
    opacity: 0.75;
}

.nexum-scheduler-host [data-scheduler-grid-cell][data-locked] {
    background: color-mix(in srgb, var(--nx-load-locked) 25%, transparent);
    cursor: not-allowed;
    opacity: 0.8;
}

.nexum-scheduler-host [data-scheduler-grid-cell][data-manual]::after {
    content: '';
    position: absolute;
    top: 2px;
    right: 2px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: hsl(var(--primary));
}

/* Overload & utilization badges */
.nexum-scheduler-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 1px 5px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    line-height: 14px;
}

.nexum-scheduler-badge-over {
    background: color-mix(in srgb, var(--nx-load-over) 16%, transparent);
    color: var(--nx-load-over);
    border: 1px solid color-mix(in srgb, var(--nx-load-over) 30%, transparent);
}

.nexum-scheduler-badge-warn {
    background: color-mix(in srgb, var(--nx-load-warn) 16%, transparent);
    color: var(--nx-load-warn);
    border: 1px solid color-mix(in srgb, var(--nx-load-warn) 30%, transparent);
}

.nexum-scheduler-badge-ok {
    background: color-mix(in srgb, var(--nx-load-ok) 16%, transparent);
    color: var(--nx-load-ok);
    border: 1px solid color-mix(in srgb, var(--nx-load-ok) 30%, transparent);
}

.nexum-scheduler-badge-under {
    background: color-mix(in srgb, var(--nx-load-under) 16%, transparent);
    color: var(--nx-load-under);
    border: 1px solid color-mix(in srgb, var(--nx-load-under) 30%, transparent);
}

/* Orientation switch segmented control (ADR-0073) */
.nexum-scheduler-segmented-control {
    display: inline-flex;
    align-items: center;
    background: hsl(var(--muted));
    border-radius: 6px;
    padding: 2px;
    gap: 2px;
}

.nexum-scheduler-segmented-item {
    padding: 3px 10px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    background: transparent;
    border: none;
    color: hsl(var(--muted-foreground));
    transition: background-color 120ms ease, color 120ms ease;
}

.nexum-scheduler-segmented-item[data-active] {
    background: hsl(var(--card));
    color: hsl(var(--card-foreground));
    box-shadow: 0 1px 2px rgb(0 0 0 / 0.1);
    font-weight: 600;
}

/* Need drawer styling (ADR-0073 §7) */
.nexum-scheduler-drawer {
    background: hsl(var(--card));
    border-right: 1px solid hsl(var(--border));
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.nexum-scheduler-drawer-overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: auto;
    width: 320px;
    z-index: 50;
    background: hsl(var(--card));
    border-left: 1px solid hsl(var(--border));
    border-right: none;
    box-shadow: -4px 0 20px -2px rgb(0 0 0 / 0.15), -2px 0 8px -2px rgb(0 0 0 / 0.1);
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    padding: 12px;
    animation: nexum-slide-in-right 180ms cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes nexum-slide-in-right {
    from { transform: translateX(100%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}

.nexum-scheduler-drawer-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    font-size: 13px;
    font-weight: 600;
}

.nexum-scheduler-need-card {
    padding: 8px 10px;
    border-radius: 6px;
    margin-bottom: 8px;
    cursor: pointer;
    background: hsl(var(--muted) / 0.4);
    border: 1px solid hsl(var(--border));
    transition: background-color 120ms ease, border-color 120ms ease;
}

.nexum-scheduler-need-card:hover {
    background: hsl(var(--muted) / 0.7);
}

.nexum-scheduler-need-card[data-selected] {
    background: hsl(var(--accent));
    border-color: var(--nx-selection);
}

.nexum-scheduler-candidate-list {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid hsl(var(--border));
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.nexum-scheduler-candidate-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 6px;
    border-radius: 4px;
    background: hsl(var(--card));
    border: 1px solid hsl(var(--border));
    font-size: 11px;
}

@media (prefers-reduced-motion: reduce) {
    .nexum-scheduler-toolbar-button,
    .nexum-scheduler-host [data-resource-manager-column-splitter],
    .nexum-scheduler-host [data-scheduler-assignment],
    .nexum-scheduler-drawer,
    .nexum-scheduler-drawer-overlay,
    .nexum-scheduler-segmented-item { transition: none; animation: none; }
    .nexum-scheduler-toolbar-button:active { transform: none; }
}

/* Toolbar filter row (ADR-0066): the framework's input owns its own look, so only the row's
   layout belongs here. */
.nexum-scheduler-filter-row {
    order: 999;
    flex: 0 0 100%;
    display: flex;
    align-items: center;
    gap: 6px;
    padding-top: 4px;
}

.nexum-scheduler-filter-row > :first-child {
    flex: 1 1 auto;
    min-width: 0;
}

.nexum-scheduler-toolbar-check {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: hsl(var(--muted-foreground));
    cursor: pointer;
    white-space: nowrap;
}

.nexum-scheduler-toolbar-check input {
    accent-color: hsl(var(--primary));
    cursor: pointer;
}

/* Scope chip: which task subtree the demand and the allocations are read on. */
.nexum-scheduler-scope {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.nexum-scheduler-scope-chip {
    display: inline-flex;
    align-items: center;
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 12px;
    background: color-mix(in srgb, var(--nx-selection) 18%, transparent);
    border: 1px solid hsl(var(--border));
    color: hsl(var(--foreground));
}


/* Module: Nexum Gantt */
/* ============================================================
   nexum-gantt — Gantt-exclusive tokens and styling.

   Everything here concerns the Gantt view and nothing else, so it is owned by
   this module rather than by nexum-core. It reaches the browser through
   GET /ui-model/css, which concatenates module stylesheets in chained-module
   order — the deterministic channel (ADR-0032). Bundle-injected CSS is not:
   it lands after that link whatever the module chain says, which is what drove
   the arms race this file replaces.

   Rules reference the host's semantic tokens and never hard-code a colour, so
   the Gantt follows the active theme instead of shipping its own palette.
   ============================================================ */

:root {
    /* Gantt colour grammar: violet = simulation, amber = baseline,
       desaturated blue = plan, muted red = critical. Deliberately absolute rather than
       token-derived: they encode meaning a theme must not reinterpret. */
    --nx-gantt-bar:          #4f86e0;
    --nx-gantt-bar-progress: #2c5fb3;
    --nx-gantt-baseline:     #e0b43a;
    --nx-gantt-simulation:   #8b7fd6;
    --nx-gantt-critical:     #d9534f;
    --nx-gantt-milestone:    #2d3748;
    /* The milestone diamond: neither the critical path's red nor the baseline's amber,
       which is also the colour of a milestone's baseline diamond. */
    --nx-gantt-milestone-point: #2f9e8f;
    --nx-gantt-summary:      #64748b;
    --nx-gantt-project:      #6366f1;
    --nx-gantt-today:        #f97316;

    /* Selection / edit accent (Gantt rows, cell editors) */
    --nx-selection: #6366f1;
}

@keyframes nexum-gantt-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

/* Host container */
.nexum-gantt-host {
    color: inherit;
    background: transparent;
    border-radius: 0.75rem;
    padding: 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}
.nexum-gantt-host > .wx-willow-theme,
.nexum-gantt-host > .wx-willow-dark-theme { height: 100%; width: 100%; min-height: 0; overflow: hidden; }

/* Same root cause on the rows: GRantt sizes the task-list and its rows to the
   panel width, so when columns overflow, row backgrounds (stripes/hover/selection)
   stop mid-grid and leave a bare strip. Size them to the columns' total width
   (min 100% of the panel) so backgrounds span every column. */
[data-grantt-tasklist],
[data-grantt-tasklist-body],
[data-task-list-row],
[data-grantt-new-task-row] { width: max-content; min-width: 100%; }

/* ── Toolbar and controls ─────────────────────────────────────── */
.nexum-gantt-toolbar { display: flex; align-items: center; gap: 10px; padding: 6px 8px; flex: 0 0 auto; flex-wrap: wrap; position: relative; z-index: 50; }
.nexum-gantt-group { display: inline-flex; align-items: center; gap: 6px; padding: 4px; border-radius: 8px; }
.nexum-gantt-toolbar button,
.nexum-gantt-toolbar select,
.nexum-gantt-toolbar input { height: 32px; border-radius: 6px; padding: 0 10px; font-size: 13px; outline: none; font-family: inherit; }
.nexum-gantt-toolbar button {
    cursor: pointer; font-weight: 500;
    transition: background-color .15s ease, border-color .15s ease;
    background: hsl(var(--card)); color: hsl(var(--card-foreground)); border: 1px solid hsl(var(--border));
}
.nexum-gantt-toolbar button:hover:not(:disabled) { background: hsl(var(--accent)); }
.nexum-gantt-toolbar button:disabled { opacity: 0.4; cursor: not-allowed; }
.nexum-gantt-toolbar select,
.nexum-gantt-toolbar input[type="date"] { background: hsl(var(--card)); color: hsl(var(--card-foreground)); border: 1px solid hsl(var(--border)); color-scheme: inherit; }
.nexum-gantt-toolbar input:focus,
.nexum-gantt-toolbar select:focus { box-shadow: 0 0 0 3px color-mix(in srgb, var(--nx-selection) 30%, transparent); }
.nexum-gantt-toolbar select { padding-right: 28px; }
.nexum-gantt-period-label { color: hsl(var(--muted-foreground)); font-size: 12px; font-weight: 600; }
/* Its own row under the toolbar: the expression is long, and wedging it after the date editors
   pushed them around every time it appeared. `order` puts it last in the flex flow whatever its
   position in the markup — full width alone would break the line mid-toolbar and push the groups
   that follow it (critical path, columns, event timeline) down with it. */
.nexum-gantt-filter-row { order: 999; flex: 0 0 100%; }
.nexum-gantt-filter-row .nexum-gantt-filter-input { flex: 1 1 auto; }
.nexum-gantt-filter-input {
    min-width: 320px;
    background: hsl(var(--card)); color: hsl(var(--card-foreground)); border: 1px solid hsl(var(--border));
}
.nexum-gantt-toolbar button.active {
    background: var(--nx-selection);
    color: hsl(var(--primary-foreground));
    border-color: var(--nx-selection);
}

/* ── Gantt body ───────────────────────────────────────────────── */
.nexum-gantt-body { flex: 1 1 auto; min-height: 0; overflow: hidden; border-radius: 8px; border: 1px solid hsl(var(--border)); background: hsl(var(--card)); }
.nexum-gantt-body > .wx-willow-theme,
.nexum-gantt-body > .wx-willow-dark-theme { height: 100%; width: 100%; min-height: 0; overflow: hidden; }
.nexum-gantt-body .wx-gantt { height: 100%; min-height: 0; overscroll-behavior: contain; }
.nexum-gantt-body [data-grantt-layout],
.nexum-gantt-body [data-grantt-layout-grid],
.nexum-gantt-body [data-grantt-layout-timeline] { height: 100%; min-height: 100%; background: hsl(var(--card)); }
.nexum-gantt-body svg[data-grantt-grid] { height: 100%; }
.nexum-gantt-body svg[data-grantt-grid] line[data-grantt-grid-line] { y2: 100%; }
.nexum-gantt-body svg[data-grantt-grid] rect[data-grantt-grid-offdate],
.nexum-gantt-body svg[data-grantt-grid] rect[data-grantt-grid-highlight] { height: 100%; }
.nexum-gantt-body .wx-bar, .nexum-gantt-body .wx-row { cursor: grab; }
.nexum-gantt-body .nexum-edit-cell, .nexum-gantt-body .nexum-edit-cell * { cursor: pointer; }
.nexum-gantt-body .nexum-edit-cell:hover { background: color-mix(in srgb, var(--nx-selection) 8%, transparent); }
.nexum-gantt-body .nexum-edit-cell:focus-visible { outline: 2px solid var(--nx-selection); outline-offset: -2px; background: color-mix(in srgb, var(--nx-selection) 10%, transparent); }
.nexum-gantt-body .wx-bar:active,
.nexum-gantt-dragging .nexum-gantt-body,
.nexum-gantt-dragging .nexum-gantt-body * { cursor: grabbing !important; }
.nexum-gantt-dragging .wx-reorder-task, .nexum-gantt-dragging .wx-cut { opacity: 0; }

/* Placeholder new-task row */
.nexum-gantt-body .nexum-placeholder-row { opacity: 0.5; font-style: italic; }
.nexum-gantt-body .nexum-placeholder-invalid { opacity: 1; outline: 2px solid hsl(var(--destructive)); outline-offset: -2px; }
.nexum-gantt-body .nexum-root-target { opacity: 1; outline: 2px solid hsl(var(--primary)); outline-offset: -2px; }

/* ── Column picker dropdown ───────────────────────────────────── */
.nexum-col-picker {
    position: absolute; top: 100%; right: 0; z-index: 9999; min-width: 220px;
    background: hsl(var(--popover)); color: hsl(var(--popover-foreground));
    border: 1px solid hsl(var(--border)); border-radius: 8px;
    box-shadow: 0 8px 24px rgb(0 0 0 / 0.24); padding: 6px 0;
}
.nexum-col-picker-row { display: flex; align-items: center; gap: 6px; padding: 4px 10px; }
.nexum-col-picker-row:hover { background: hsl(var(--accent)); }
.nexum-col-picker-handle { color: hsl(var(--muted-foreground)); cursor: grab; font-size: 14px; user-select: none; }
.nexum-col-picker-label { flex: 1; font-size: 13px; }
.nexum-col-picker-row[draggable]:active { opacity: 0.5; }
.nexum-col-picker-row input:disabled + .nexum-col-picker-label { opacity: 0.45; }
.nexum-col-picker-group-label { padding: 6px 10px 2px; font-size: 11px; font-weight: 600; text-transform: uppercase; color: hsl(var(--muted-foreground)); }

/* ── Drag preview ─────────────────────────────────────────────── */
.nexum-gantt-drag-preview { position: fixed; z-index: 2147483647; pointer-events: none; width: 260px; transform: translate(14px, 14px); }
.nexum-gantt-drag-card {
    position: absolute; left: 0; right: 0; min-height: 34px; display: flex; align-items: center; gap: 8px;
    padding: 7px 10px; border: 1px solid color-mix(in srgb, var(--nx-selection) 40%, transparent); border-radius: 7px;
    background: hsl(var(--popover)); color: hsl(var(--popover-foreground));
    box-shadow: 0 10px 26px rgb(0 0 0 / 0.35);
    font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.nexum-gantt-drag-card:nth-child(1) { top: 0; z-index: 4; }
.nexum-gantt-drag-card:nth-child(2) { top: 8px; left: 8px; opacity: 0.82; z-index: 3; }
.nexum-gantt-drag-card:nth-child(3) { top: 16px; left: 16px; opacity: 0.66; z-index: 2; }
.nexum-gantt-drag-badge {
    flex: 0 0 auto; min-width: 24px; height: 22px; display: inline-flex; align-items: center; justify-content: center;
    border-radius: 999px; background: var(--nx-selection); color: hsl(var(--primary-foreground)); font-size: 12px;
}

/* Drop target overlay */
.nexum-gantt-drop-target {
    position: fixed; z-index: 2147483646; pointer-events: none; transform: translate(-50%, -100%);
    max-width: min(420px, calc(100vw - 32px)); padding: 8px 12px;
    border: 1px solid color-mix(in srgb, var(--nx-selection) 40%, transparent); border-radius: 7px;
    background: hsl(var(--popover)); color: hsl(var(--popover-foreground));
    box-shadow: 0 8px 22px rgb(0 0 0 / 0.3);
    font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* ── Calendar highlight classes ───────────────────────────────── */
/* Alpha over the surface underneath, so these read correctly on any theme. */
.nexum-gantt-weekend { background: rgb(128 128 128 / 0.15); }
/* A closed day is a calendar fact, not an error: it shades deeper than a weekend
   rather than borrowing the destructive colour, which banded the grid in red. */
.nexum-gantt-closed-day { background: hsl(var(--muted-foreground) / 0.16); }
/* Hold (suspension) shading + badge */
.nexum-gantt-hold-day { background: color-mix(in srgb, var(--nx-gantt-baseline) 18%, transparent); }
.nexum-gantt-hold-badge {
    flex: 0 0 auto; font-size: 10px; font-weight: 600; line-height: 16px;
    color: var(--nx-gantt-baseline);
    background: color-mix(in srgb, var(--nx-gantt-baseline) 18%, transparent);
    border: 1px solid color-mix(in srgb, var(--nx-gantt-baseline) 50%, transparent);
    border-radius: 999px; padding: 0 6px; white-space: nowrap;
}

/* ADR-0071 signals: saturation (the effort does not fit the residual capacity) and calendar
   conflict (a constrained task sits on a day its calendar now calls non-working). Both are
   read-only signals — they never move a bar, they only say the plan disagrees with reality. */
.nexum-gantt-signal-badge {
    flex: 0 0 auto; font-size: 10px; font-weight: 600; line-height: 16px;
    color: hsl(var(--destructive));
    background: color-mix(in srgb, hsl(var(--destructive)) 15%, transparent);
    border: 1px solid color-mix(in srgb, hsl(var(--destructive)) 45%, transparent);
    border-radius: 999px; padding: 0 6px; white-space: nowrap;
}
.nexum-gantt-bar[data-saturated],
.nexum-gantt-bar[data-calendar-conflict] {
    outline: 1px dashed color-mix(in srgb, hsl(var(--destructive)) 60%, transparent);
    outline-offset: -1px;
}

/* ── In-cell editor overlay: neutral grid style, covers the cell ── */
.nexum-cell-editor { box-sizing: border-box; background: hsl(var(--card)); color: hsl(var(--card-foreground)); }
.nexum-cell-editor .dynamint-grid-cell-editor,
.nexum-cell-editor .dynamint-grid-cell-editor-item { height: 100%; }
.nexum-cell-editor input,
.nexum-cell-editor select,
.nexum-cell-editor textarea,
.nexum-cell-editor button[role="combobox"] {
    width: 100%; height: 100%; min-height: 0; box-sizing: border-box;
    margin: 0; padding: 0 8px;
    border: 1px solid var(--nx-selection); border-radius: 0;
    box-shadow: none; outline: none;
    font-size: 13px; font-family: inherit;
    background: inherit; color: inherit;
    overflow: hidden;
}
.nexum-cell-editor select, .nexum-cell-editor button[role="combobox"] { cursor: pointer; }

/* ── GRantt primitives ────────────────────────────────────────── */
.nexum-gantt-body [data-grantt-root] { font-family: inherit; font-size: 13px; }

/* Layout splitter */
.nexum-gantt-body [data-grantt-layout-splitter] { background: hsl(var(--border)); cursor: col-resize; transition: background 0.15s; }
.nexum-gantt-body [data-grantt-layout-splitter]:hover,
.nexum-gantt-body [data-grantt-layout-splitter]:active { background: var(--nx-selection); }

/* Task list */
.nexum-gantt-body [data-grantt-tasklist] { min-height: 100%; height: 100%; flex: 1 1 auto; border-right: 1px solid hsl(var(--border)); background: hsl(var(--card)); }
.nexum-gantt-body [data-grantt-tasklist-body] { min-height: calc(100% - 48px); background: hsl(var(--card)); }
.nexum-gantt-body [data-grantt-tasklist] [data-grantt-tasklist-header],
.nexum-gantt-body [data-grantt-tasklist-header] {
    display: flex;
    align-items: center;
    background-color: hsl(var(--muted));
    border-bottom: 1px solid hsl(var(--border));
}
.nexum-gantt-body [data-grantt-tasklist-header-cell] {
    display: flex; align-items: center; padding: 0 10px; height: 100%;
    font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em;
    color: hsl(var(--muted-foreground)); user-select: none; white-space: nowrap; overflow: hidden;
}
.nexum-gantt-body [data-grantt-col-resize-handle] { background: transparent; transition: background 0.12s ease; }
.nexum-gantt-body [data-grantt-col-resize-handle]:hover { background: var(--nx-selection); }

/* Rows */
[data-task-list-row] { display: flex; align-items: center; border-bottom: 1px solid hsl(var(--border) / 0.4); cursor: pointer; transition: background 0.12s ease; }
[data-task-list-row]:hover { background: color-mix(in srgb, var(--nx-selection) 8%, transparent); }
[data-task-list-row][data-selected] { background: color-mix(in srgb, var(--nx-selection) 15%, transparent); box-shadow: inset 3px 0 0 var(--nx-selection); }
[data-task-list-row][data-drop-target][data-drop-position="before"] { box-shadow: inset 0 2px 0 var(--nx-selection); }
[data-task-list-row][data-drop-target][data-drop-position="after"] { box-shadow: inset 0 -2px 0 var(--nx-selection); }
[data-task-list-row][data-drop-target][data-drop-position="into"] { background: color-mix(in srgb, var(--nx-selection) 22%, transparent); }

/* Cells */
.nexum-gantt-body [data-grantt-cell] {
    font-size: 12px; color: hsl(var(--card-foreground)); padding: 0 8px;
    display: flex; align-items: center; height: 100%;
    overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
    border-right: 1px solid hsl(var(--border));
}
.nexum-gantt-body [data-grantt-cell][data-column="wbs"] { color: hsl(var(--muted-foreground)); font-size: 11px; }
.nexum-gantt-body [data-grantt-cell][data-column="_rowNum"] { color: hsl(var(--muted-foreground)); font-size: 11px; justify-content: center; }
.nexum-gantt-body [data-grantt-cell][data-column="startDate"],
.nexum-gantt-body [data-grantt-cell][data-column="endDate"] { color: hsl(var(--muted-foreground)); }
.nexum-gantt-body [data-grantt-cell][data-column="progress"] { color: hsl(var(--muted-foreground)); justify-content: center; }

/* Toggle expand/collapse */
.nexum-gantt-body [data-grantt-row-toggle] {
    width: 18px; height: 18px; border: none; background: transparent; color: hsl(var(--muted-foreground));
    font-size: 10px; cursor: pointer; display: flex; align-items: center; justify-content: center;
    border-radius: 4px; flex-shrink: 0; transition: all 0.12s ease;
}
.nexum-gantt-body [data-grantt-row-toggle]:hover { background: hsl(var(--accent)); color: hsl(var(--accent-foreground)); transform: scale(1.08); }
.nexum-gantt-body [data-grantt-row-toggle-spacer] { width: 18px; flex-shrink: 0; }

/* Timeline */
.nexum-gantt-body [data-grantt-timeline] { background: hsl(var(--card)); height: 100%; }
.nexum-gantt-body [data-grantt-timeline-header] {
    background: hsl(var(--muted));
    border-bottom: 1px solid hsl(var(--border));
}
.nexum-gantt-body [data-grantt-timeline-scroll] { cursor: grab; }
.nexum-gantt-body [data-grantt-timeline-scroll][data-dragging] { cursor: grabbing; user-select: none; }

/* Scale */
.nexum-gantt-body [data-grantt-scale-row],
[data-timeline-root] [data-grantt-scale-row] { border-bottom: 1px solid hsl(var(--border) / 0.5); position: relative; }
.nexum-gantt-body [data-grantt-scale-cell],
[data-timeline-root] [data-grantt-scale-cell] {
    display: flex; align-items: center; padding: 0 8px; overflow: hidden; white-space: nowrap;
    border-right: 1px solid hsl(var(--border) / 0.5); font-size: 11px; font-weight: 500; letter-spacing: 0.02em;
    color: hsl(var(--muted-foreground)); box-sizing: border-box; transition: background 0.12s ease;
}
.nexum-gantt-body [data-grantt-scale-row][data-unit="month"] [data-grantt-scale-cell],
[data-timeline-root] [data-grantt-scale-row][data-unit="month"] [data-grantt-scale-cell],
.nexum-gantt-body [data-grantt-scale-row][data-unit="year"] [data-grantt-scale-cell],
[data-timeline-root] [data-grantt-scale-row][data-unit="year"] [data-grantt-scale-cell] {
    font-size: 12px; font-weight: 600; letter-spacing: 0.03em; color: hsl(var(--foreground)); text-transform: capitalize;
}
.nexum-gantt-body [data-grantt-scale-row][data-unit="week"] [data-grantt-scale-cell],
[data-timeline-root] [data-grantt-scale-row][data-unit="week"] [data-grantt-scale-cell] {
    font-size: 10.5px; font-weight: 500; color: hsl(var(--muted-foreground));
}
/* The terminal cell of a scale row is a partial period and can be narrower than its own
   padding + border, which a border-box floor would then inflate past the timeline edge. */
.nexum-gantt-body [data-grantt-scale-row] [data-grantt-scale-cell]:last-child,
[data-timeline-root] [data-grantt-scale-row] [data-grantt-scale-cell]:last-child {
    padding-right: 0; border-right: 0;
}
.nexum-gantt-body [data-grantt-scale-cell].nexum-gantt-weekend { background: hsl(var(--muted) / 0.4); }
/* Day shading only applies to day cells: a month/week cell carries its first day's date,
   so a closed 1st would paint the whole header band. */
[data-grantt-scale-cell][data-unit]:not([data-unit="day"]) { background: transparent; }

/* Grid */
.nexum-gantt-body [data-grantt-grid-line] { stroke: hsl(var(--border) / 0.4); stroke-width: 1; }
.nexum-gantt-body [data-grantt-grid-rowline] { stroke: hsl(var(--border) / 0.35); stroke-width: 1; opacity: 1; }
/* The timeline reads off its day lines, not off filled bands. A weekend is the
   norm, and shading every one of them turned the grid into a striped surface the
   bars had to compete with. Only the exceptions a calendar declares — a closed
   day, a hold — stay shaded, and faintly.
   This also side-steps a GRantt defect: the off-date range is sized from the
   viewport rather than from the rendered period, so above the week scale the
   band stopped two thirds across and read as data it was not. */
.nexum-gantt-body [data-grantt-grid-offdate],
.nexum-gantt-body [data-grantt-grid-highlight].nexum-gantt-weekend { display: none; }
.nexum-gantt-body [data-grantt-grid-row-highlight].nexum-gantt-closed-day { fill: hsl(var(--muted-foreground) / 0.12); opacity: 1; }
.nexum-gantt-body [data-grantt-grid-highlight].nexum-gantt-hold-day { fill: color-mix(in srgb, var(--nx-gantt-baseline) 10%, transparent); opacity: 1; }
.nexum-gantt-body [data-grantt-grid-row-selected] { fill: var(--nx-selection); opacity: 0.1; }

/* A closed day above the week scale is a filet nobody can read, and GRantt draws
   it there as multi-month blocks. ponytail: masking; the range belongs in GRantt. */
[data-time-axis-preset="month"] .nexum-gantt-body [data-grantt-grid-highlight].nexum-gantt-closed-day,
[data-time-axis-preset="quarter"] .nexum-gantt-body [data-grantt-grid-highlight].nexum-gantt-closed-day,
[data-time-axis-preset="year"] .nexum-gantt-body [data-grantt-grid-highlight].nexum-gantt-closed-day {
    display: none;
}

/* Today */
.nexum-gantt-body [data-grantt-today] {
    background: var(--nx-gantt-today);
    box-shadow: 0 0 8px color-mix(in srgb, var(--nx-gantt-today) 70%, transparent);
    opacity: 0.95;
    z-index: 8;
}

/* ── Bars ─────────────────────────────────────────────────────────
   Read by colour and extent first; a soft top light and a small drop shadow give
   the bar body without changing either. The colour stays a token, the relief is
   a neutral overlay, so a branch or critical colour keeps the same finish. */
.nexum-gantt-bar {
    background-color: var(--nx-gantt-bar);
    background-image: linear-gradient(180deg, rgb(255 255 255 / 0.18), rgb(255 255 255 / 0) 60%);
    border: none;
    border-radius: 6px;
    box-shadow: 0 1px 2px rgb(0 0 0 / 0.25), inset 0 1px 0 rgb(255 255 255 / 0.12);
    cursor: grab;
    /* The label sits outside the bar, so the bar must not clip it. The progress
       fill is left-anchored and never wider than the bar, so it needs no clip. */
    overflow: visible;
    display: flex;
    align-items: center;
    position: relative;
    /* Above the grid: the non-working shading is painted after the bars in the
       timeline content, so without this it stripes straight across them. */
    z-index: 2;
    transition: filter 0.12s ease, box-shadow 0.12s ease;
}
.nexum-gantt-bar:hover {
    filter: brightness(1.1);
    box-shadow: 0 3px 10px rgb(0 0 0 / 0.3), inset 0 1px 0 rgb(255 255 255 / 0.12);
    z-index: 5;
}
.nexum-gantt-bar[data-state="dragging"] {
    cursor: grabbing;
    z-index: 20;
    opacity: 0.92;
    box-shadow: 0 0 0 2px var(--nx-selection);
}
.nexum-gantt-bar[data-state="pending"] { opacity: 0.6; }
.nexum-gantt-bar[data-critical] {
    background-color: var(--nx-gantt-critical);
}

/* Progress Fills — derived from the bar's own colour, so a branch's progress
   stays that branch's colour instead of reverting to the default blue. */
.nexum-gantt-body [data-grantt-bar-progress-fill] {
    background: color-mix(in srgb, var(--nx-gantt-bar) 62%, black);
    --grantt-progress-height: 100%;
    border-radius: 6px 0 0 6px;
}

/* Focus ring on the bars */
.nexum-gantt-bar:focus-visible {
    outline: 2px solid hsl(var(--ring));
    outline-offset: 1px;
    z-index: 10;
}
.nexum-gantt-bar:not(.nexum-gantt-group-bar)[aria-selected="true"] {
    box-shadow: 0 0 0 2px var(--nx-selection);
}

/* Bar labels — set beside the bar, the way a planning tool does it. The bar then
   carries duration only, which frees the fill from any contrast constraint and
   keeps a short bar readable instead of truncating its name to an ellipsis. */
.nexum-gantt-bar [data-grantt-bar-label],
.nexum-gantt-group-bar [data-grantt-bar-label],
.dark .nexum-gantt-bar [data-grantt-bar-label],
.wx-willow-dark-theme .nexum-gantt-bar [data-grantt-bar-label] {
    position: absolute;
    inset-inline-start: 100%;
    margin-inline-start: 8px;
    font-size: 11px;
    font-weight: 400;
    letter-spacing: 0;
    color: hsl(var(--foreground));
    text-shadow: none;
    padding: 0;
    white-space: nowrap;
    pointer-events: none;
    user-select: none;
    flex: none;
    z-index: 3;
}

/* A summary is a bracket over its children, not a task: a thin band along the bottom
   of the bar box with a point hanging from each end, so the level reads as containment
   rather than as work of its own. The box keeps its full height as the hit area; the
   band is drawn by the background, since GRantt sets the box's height inline.
   --nx-summary-color carries the kind (summary, project, critical) to band and points. */
.nexum-gantt-group-bar {
    --nx-summary-color: var(--nx-gantt-summary);
    --nx-summary-band: 8px;
    background: linear-gradient(to top, var(--nx-summary-color) 0 var(--nx-summary-band), transparent var(--nx-summary-band));
    border: none;
    box-shadow: none;
    border-radius: 0;
    align-items: flex-end;
    overflow: visible;
    position: relative;
    z-index: 2;
}
.nexum-gantt-group-bar::before,
.nexum-gantt-group-bar::after {
    content: "";
    position: absolute;
    bottom: -5px;
    border-top: 5px solid var(--nx-summary-color);
    pointer-events: none;
}
.nexum-gantt-group-bar::before { left: 0; border-right: 6px solid transparent; }
.nexum-gantt-group-bar::after { right: 0; border-left: 6px solid transparent; }
.nexum-gantt-group-bar:hover { filter: brightness(1.15); box-shadow: none; z-index: 5; }
.nexum-gantt-group-bar [data-grantt-bar-progress-fill] {
    background: color-mix(in srgb, var(--nx-summary-color) 55%, black);
    --grantt-progress-height: var(--nx-summary-band);
    border-radius: 0;
}
.nexum-gantt-group-bar [data-grantt-bar-label] { bottom: -3px; }

/* A summary names a level, so it keeps the weight its children do not have. */
.nexum-gantt-group-bar [data-grantt-bar-label],
.dark .nexum-gantt-group-bar [data-grantt-bar-label],
.wx-willow-dark-theme .nexum-gantt-group-bar [data-grantt-bar-label] {
    font-weight: 600;
}

/* A Project row is neither a task nor one of its summaries — it is the container the
   whole plan hangs from, so it carries its own colour rather than borrowing one.
   Last of the four kinds, so it wins over the summary rule it also matches. */
.nexum-gantt-bar[data-project] {
    background-color: var(--nx-gantt-project);
}
.nexum-gantt-group-bar[data-project] { --nx-summary-color: var(--nx-gantt-project); }
.nexum-gantt-group-bar[data-critical] { --nx-summary-color: var(--nx-gantt-critical); }

/* Comparison layers */
.nexum-gantt-compare-layer {
    /* ponytail: a milestone layer has start == end, so its width is 0 — a floor is
       all it takes to make it a visible marker. */
    min-width: 6px;
    opacity: 0.85;
    border-radius: 2px;
    pointer-events: none;
}
.nexum-gantt-compare-layer[data-compare-type="simulation"] {
    background: var(--nx-gantt-simulation);
}
.nexum-gantt-compare-layer[data-compare-type="baseline"] {
    background: var(--nx-gantt-baseline);
}
.nexum-gantt-compare-layer[data-compare-mode="overlay"] { opacity: 0.45; }

/* Dependencies of the compared simulation: same colour code as its bars, dashed so an
   arrow that exists only in the simulation is not mistaken for the live plan's own. */
.nexum-gantt-compare-links path {
    stroke: var(--nx-gantt-simulation);
    stroke-dasharray: 4 3;
}
.nexum-gantt-compare-links polygon,
.nexum-gantt-compare-links marker path {
    fill: var(--nx-gantt-simulation);
}

/* Milestones */
.nexum-gantt-body [data-grantt-milestone] {
    overflow: visible;
}
/* A milestone is the one thing on the row that is not a duration, so it does not share
   the bars' colour. GRantt paints the diamond inline from --grantt-bar-color: setting the
   variable is what reaches it — a background rule loses to the inline style. */
.nexum-gantt-body [data-grantt-milestone] {
    --grantt-bar-color: var(--nx-gantt-milestone-point);
}
.nexum-gantt-body [data-grantt-milestone-diamond] {
    border: none;
    border-radius: 2px;
    background-image: linear-gradient(135deg, rgb(255 255 255 / 0.25), rgb(255 255 255 / 0) 60%);
    box-shadow: 0 1px 3px rgb(0 0 0 / 0.3);
    transition: filter 0.15s ease;
}

.nexum-gantt-body [data-grantt-milestone][data-critical] {
    --grantt-bar-color: var(--nx-gantt-critical);
}

.nexum-gantt-body [data-grantt-milestone]:hover [data-grantt-milestone-diamond] {
    filter: brightness(1.12);
}

.nexum-gantt-body [data-grantt-milestone][data-selected] [data-grantt-milestone-diamond] {
    box-shadow: 0 0 0 2px var(--nx-selection);
}

/* Dependencies */
.nexum-gantt-body [data-grantt-dependency-line] {
    stroke: hsl(var(--muted-foreground) / 0.55);
    stroke-width: 1.25;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.nexum-gantt-body [data-grantt-dependency-arrow] {
    fill: hsl(var(--muted-foreground) / 0.55);
}
.nexum-gantt-body [data-grantt-dependency][data-critical] [data-grantt-dependency-line] {
    stroke: var(--nx-gantt-critical);
    stroke-width: 2;
}
.nexum-gantt-body [data-grantt-dependency][data-critical] [data-grantt-dependency-arrow] {
    fill: var(--nx-gantt-critical);
}
.nexum-gantt-body [data-grantt-bar] { overflow: visible; }
.nexum-gantt-body [data-grantt-link-handle] {
    background-color: var(--nx-selection);
    border: 2px solid #ffffff;
    border-radius: 50%;
    cursor: crosshair;
    opacity: 0;
    box-shadow: 0 0 6px var(--nx-selection);
    transition: opacity 0.15s ease, transform 0.15s ease;
}
.nexum-gantt-body [data-grantt-bar]:hover [data-grantt-link-handle],
.nexum-gantt-body [data-grantt-milestone]:hover [data-grantt-link-handle] {
    opacity: 1;
    transform: scale(1.15);
}

/* ── ADR-0023 scenario-levers popup ──────────────────────────── */
.nexum-gantt-levier-popup-backdrop { position: fixed; inset: 0; z-index: 2147483000; background: rgb(0 0 0 / 0.5); display: flex; align-items: center; justify-content: center; }
.nexum-gantt-levier-popup {
    background: hsl(var(--popover)); color: hsl(var(--popover-foreground));
    border: 1px solid hsl(var(--border)); border-radius: 8px; padding: 16px 18px; min-width: 260px;
    box-shadow: 0 8px 32px rgb(0 0 0 / 0.4);
}
.nexum-gantt-levier-popup h4 { margin: 0 0 10px; font-size: 14px; }
.nexum-gantt-levier-popup label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; margin-bottom: 12px; }
.nexum-gantt-levier-popup input[type="date"] { padding: 4px 6px; border: 1px solid hsl(var(--border)); border-radius: 4px; background: hsl(var(--card)); color: hsl(var(--card-foreground)); }
.nexum-gantt-levier-popup-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.nexum-gantt-levier-popup-actions button {
    font-size: 12px; padding: 5px 9px; border: 1px solid hsl(var(--border)); border-radius: 4px;
    background: hsl(var(--secondary)); color: hsl(var(--secondary-foreground)); cursor: pointer;
}
.nexum-gantt-levier-popup-actions button:disabled { opacity: 0.5; cursor: not-allowed; }
.nexum-gantt-levier-popup-close { font-size: 12px; padding: 4px 10px; border: none; background: transparent; color: hsl(var(--muted-foreground)); cursor: pointer; }

/* ── Event timeline panel ─────────────────────────────────────── */
.nexum-event-timeline-panel {
    background: hsl(var(--card));
    border: 1px solid hsl(var(--border));
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 12px;
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.2), 0 1px 2px -1px rgb(0 0 0 / 0.2);
}
.nexum-event-timeline-header {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 12px; font-size: 14px; font-weight: 600; color: hsl(var(--card-foreground));
}
.nexum-event-timeline-close {
    background: transparent; border: none; color: hsl(var(--muted-foreground)); cursor: pointer;
    font-size: 18px; line-height: 1; padding: 2px 8px; border-radius: 4px; transition: background 0.15s ease;
}
.nexum-event-timeline-close:hover { background: hsl(var(--accent)); color: hsl(var(--accent-foreground)); }
.nexum-event-timeline-add-btn {
    background: var(--nx-selection); color: hsl(var(--primary-foreground)); border: none; border-radius: 4px;
    padding: 4px 10px; font-size: 12px; font-weight: 500; cursor: pointer; transition: opacity 0.15s ease;
}
.nexum-event-timeline-add-btn:hover { opacity: 0.9; }
.nexum-event-timeline-empty {
    display: flex; align-items: center; justify-content: center; height: 100%;
    color: hsl(var(--muted-foreground)); font-size: 13px; font-style: italic;
    border: 1px dashed hsl(var(--border)); border-radius: 6px; background: hsl(var(--muted));
}
[data-timeline-root] { border: 1px solid hsl(var(--border)); border-radius: 6px; background: hsl(var(--muted)); }
[data-timeline-header] { background: hsl(var(--card)); border-bottom: 1px solid hsl(var(--border)); }
[data-timeline-item] { transition: opacity 0.15s ease; margin-top: 6px; }
[data-timeline-item]:hover { opacity: 0.95; }
[data-timeline-interval] {
    border-radius: 4px;
}
[data-timeline-label] {
    font-size: 11px; font-family: inherit; color: hsl(var(--card-foreground)); font-weight: 500;
}
.nexum-timeline-remove {
    position: absolute; right: -16px; top: 2px; border: none; background: transparent;
    color: hsl(var(--destructive)); cursor: pointer; font-size: 14px;
    opacity: 0; transition: opacity 0.15s ease; padding: 0 4px; line-height: 1;
}
[data-timeline-item]:hover .nexum-timeline-remove { opacity: 1; }

/* ── Dependency link dialog & Predecessor badges ──────────────── */
.nexum-gantt-link-popup-backdrop {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    background: rgb(0 0 0 / 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
}
.nexum-gantt-link-popup {
    background: hsl(var(--popover));
    color: hsl(var(--popover-foreground));
    border: 1px solid hsl(var(--border));
    border-radius: 8px;
    padding: 18px 20px;
    min-width: 320px;
    max-width: 440px;
    width: 90vw;
    box-shadow: 0 8px 32px rgb(0 0 0 / 0.4);
}
.nexum-gantt-pred-badge {
    display: inline-flex;
    align-items: center;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 500;
    background-color: hsl(var(--secondary));
    color: hsl(var(--secondary-foreground));
    border: 1px solid hsl(var(--border));
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.nexum-gantt-pred-badge:hover {
    background-color: hsl(var(--accent));
    color: hsl(var(--accent-foreground));
    border-color: hsl(var(--ring));
}



/* Module: Nexum Core */
/* Nexum Core Theme - DynaMint Blue Edition
 * Project-management UI: modern, innovative, readable, airy, serious & user-friendly.
 * Mirrors the PetClinic theme architecture (shadcn HSL tokens + Tailwind utilities + glassmorphism)
 * but swaps the warm "Fauve" orange for a professional pure Blue palette on a slate base.
 */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300..800&family=Space+Grotesk:wght@500;700;800&family=Syne:wght@700;800&family=Unbounded:wght@600;700;800&display=swap');

.light {
    /* Blue Light Theme */

    /* Primary (Blue) — cobalt-600: blue-500 on white is 3.68:1, fails WCAG AA */
    --primary: 221 83% 53%;
    /* #2563eb (blue-600) */
    --primary-foreground: 0 0% 100%;
    /* #ffffff */

    /* Backgrounds (Cool Slate / Ivory-white) */
    --background: 210 40% 98%;
    /* #f8fafc (slate-50) */
    --foreground: 222 47% 11%;
    /* #0f172a (slate-900) */

    /* Cards (White) */
    --card: 0 0% 100%;
    /* #ffffff */
    --card-foreground: 222 47% 11%;
    /* #0f172a */

    /* Popovers (White) */
    --popover: 0 0% 100%;
    /* #ffffff */
    --popover-foreground: 222 47% 11%;
    /* #0f172a */

    /* Secondary / Accent / Muted (Blue pastels + cool grays) */
    --secondary: 214 100% 97%;
    /* #eff6ff (blue-50) */
    --secondary-foreground: 224 75% 33%;
    /* #1e3a8a (blue-900) */

    --muted: 210 40% 96%;
    /* #f1f5f9 (slate-100) */
    --muted-foreground: 215 16% 47%;
    /* #64748b (slate-500) */

    --accent: 214 95% 93%;
    /* #dbeafe (blue-100) */
    --accent-foreground: 224 75% 33%;
    /* #1e3a8a (blue-900) */

    --destructive: 0 72% 51%;
    /* #dc2626 */
    --destructive-foreground: 0 0% 100%;

    /* Inputs / Borders */
    --border: 214 32% 91%;
    /* #e2e8f0 (slate-200) */
    --input: 214 32% 91%;
    /* #e2e8f0 */
    --ring: 221 83% 53%;
    /* #2563eb */

    --radius: 0.5rem;
}

:root {
    /* Form density (framework defaults shown; tune per app) */
    --dyn-input-h: 2rem;            /* input & select trigger height */
    --dyn-field-label-gap: 0.25rem; /* gap between label and its control */
    --dyn-form-gap: 0.5rem;         /* vertical gap between fields */
    --dyn-group-p: 1rem;            /* field-group padding */

    /* Blue Scale Colors Palette */
    --cobalt-50: #eff6ff;
    --cobalt-100: #dbeafe;
    --cobalt-200: #bfdbfe;
    --cobalt-300: #93c5fd;
    --cobalt-400: #60a5fa;
    --cobalt-500: #3b82f6;
    --cobalt-600: #2563eb;
    --cobalt-700: #1d4ed8;
    --cobalt-800: #1e40af;
    --cobalt-900: #1e3a8a;
    --cobalt-950: #172554;

    /* Cool slate neutrals (airy backgrounds & lines) */
    --slate-50: #f8fafc;
    --slate-100: #f1f5f9;
    --slate-200: #e2e8f0;
    --slate-300: #cbd5e1;
    --slate-700: #334155;
    --slate-800: #1e293b;
    --slate-900: #0f172a;

    /* ============================================================ */
    /* NX SEMANTIC TOKENS — PPM domain layer (see docs/DESIGN_SYSTEM.md) */
    /* Plugins consume and override these; never hardcode hex in TSX.   */
    /* ============================================================ */

    /* Work statuses */
    --nx-status-todo:     #94a3b8;
    --nx-status-progress: #2563eb;
    --nx-status-done:     #059669;
    --nx-status-blocked:  #e11d48;

    /* Project health (RAG) */
    --nx-health-green: #059669;
    --nx-health-amber: #d97706;
    --nx-health-red:   #dc2626;

    /* Priority */
    --nx-priority-low:      #64748b;
    --nx-priority-medium:   #2563eb;
    --nx-priority-high:     #d97706;
    --nx-priority-critical: #dc2626;

    /* Gantt tokens (--nx-gantt-*, --nx-selection) are owned by nexum-gantt's
       own ui-model.css — they concern that view alone. */

    /* Load / capacity */
    --nx-load-under: #93c5fd;
    --nx-load-ok:    #10b981;
    --nx-load-warn:  #f59e0b;
    --nx-load-over:  #ef4444;

    /* Load diagnostics & state tokens (ADR-0074) */
    --nx-load-invalid:   #ef4444;
    --nx-load-inert:     #94a3b8;
    --nx-load-uncovered: #f59e0b;
    --nx-load-locked:    #cbd5e1;

    /* Rate card scopes (nexum-costload) */
    --nx-scope-resource: #3b82f6;
    --nx-scope-skill:    #10b981;
    --nx-scope-orgunit:  #f59e0b;
    --nx-scope-global:   #8b5cf6;
    --nx-scope-default:  #6b7280;

    /* Chart categorical palette (Recharts / analysis views) */
    --nx-chart-1: #2563eb;  --nx-chart-2: #0d9488;
    --nx-chart-3: #d97706;  --nx-chart-4: #7c3aed;
    --nx-chart-5: #db2777;  --nx-chart-6: #059669;
    --nx-chart-7: #64748b;  --nx-chart-8: #b45309;

    /* Cost axes: budget / forecast / actual */
    --nx-axis-budget:   #64748b;
    --nx-axis-forecast: #2563eb;
    --nx-axis-actual:   #0f172a;

    /* Legacy aliases (migration: prefer --nx-status-*) */
    --status-todo: var(--nx-status-todo);
    --status-progress: var(--nx-status-progress);
    --status-done: var(--nx-status-done);
    --status-blocked: var(--nx-status-blocked);

    --surface-light: #ffffff;
    --surface-dark: #1e293b;
    --background-light: #f8fafc;
    --background-dark: #0f172a;

    --dyn-card-shadow: 0 1px 2px 0 rgba(15, 23, 42, 0.06), 0 1px 3px -1px rgba(15, 23, 42, 0.08);
    --table-cell-padding: 0.625rem;
    --table-header-padding: 1rem;
}

/* Dark mode via .dark class (JS toggle) */
:root.dark {
    /* Primary (Blue, bright in dark mode) */
    --primary: 213 94% 68%;
    /* #60a5fa (blue-400) */
    --primary-foreground: 0 0% 100%;
    /* #ffffff */

    /* Dark backgrounds */
    --background: 222 47% 11%;
    /* #0f172a (slate-900) */
    --foreground: 210 40% 98%;
    /* #f8fafc */

    /* Dark cards */
    --card: 217 33% 17%;
    /* #1e293b (slate-800) */
    --card-foreground: 210 40% 98%;
    /* #f8fafc */

    /* Dark popovers */
    --popover: 217 33% 17%;
    /* #1e293b (slate-800) */
    --popover-foreground: 210 40% 98%;
    /* #f8fafc */

    /* Dark secondary / muted (dark blue, no purple) */
    --secondary: 215 44% 19%;
    /* #1a2d42 (dark blue) */
    --secondary-foreground: 210 40% 98%;
    /* #f8fafc */

    --muted: 217 33% 17%;
    /* #1e293b (slate-800) */
    --muted-foreground: 215 20% 65%;
    /* #94a3b8 (slate-400) */

    --accent: 215 44% 22%;
    /* #1e3452 (dark blue) */
    --accent-foreground: 210 40% 98%;
    /* #f8fafc */

    --destructive: 0 72% 51%;
    /* #dc2626 */
    --destructive-foreground: 0 0% 100%;

    /* Dark inputs / borders */
    --border: 215 25% 27%;
    /* #334155 (slate-700) */
    --input: 215 25% 27%;
    /* #334155 */
    --ring: 213 94% 68%;
    /* #60a5fa */

    --radius: 0.75rem;

    /* Dark shadows */
    --dyn-card-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3), 0 1px 3px -1px rgba(0, 0, 0, 0.4);

    /* Project health (RAG) — dark mode ramps */
    --nx-health-green: #34d399;
    --nx-health-amber: #fbbf24;
    --nx-health-red:   #f87171;

    /* Load / capacity — dark mode ramps */
    --nx-load-under: #60a5fa;
    --nx-load-ok:    #34d399;
    --nx-load-warn:  #fbbf24;
    --nx-load-over:  #f87171;

    /* Load diagnostics & state tokens (ADR-0074) — dark mode */
    --nx-load-invalid:   #f87171;
    --nx-load-inert:     #64748b;
    --nx-load-uncovered: #fbbf24;
    --nx-load-locked:    #475569;
}


/* Global Font Override — Inter for a crisp, serious, highly legible UI */
body,
input,
textarea,
select,
button {
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    font-feature-settings: 'cv11', 'ss01';
    letter-spacing: -0.011em;
}

/* Tabular numerals — all data columns & KPIs align vertically */
td,
.nx-kpi-value {
    font-variant-numeric: tabular-nums;
}

/* Reduced motion — kill transitions/animations for users who ask */
@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}

/* Base custom utility classes matching Tailwind */
.bg-surface-light {
    background-color: var(--surface-light);
}

.bg-background-light {
    background-color: var(--background-light);
}

.text-primary-content {
    color: var(--primary-content);
}

.bg-cobalt-50 {
    background-color: var(--cobalt-50);
}

.bg-cobalt-100 {
    background-color: var(--cobalt-100);
}

.bg-cobalt-200 {
    background-color: var(--cobalt-200);
}

.bg-cobalt-300 {
    background-color: var(--cobalt-300);
}

.bg-cobalt-400 {
    background-color: var(--cobalt-400);
}

.bg-cobalt-500 {
    background-color: var(--cobalt-500);
}

.bg-cobalt-600 {
    background-color: var(--cobalt-600);
}

.bg-cobalt-700 {
    background-color: var(--cobalt-700);
}

.bg-cobalt-800 {
    background-color: var(--cobalt-800);
}

.bg-cobalt-900 {
    background-color: var(--cobalt-900);
}

.bg-cobalt-950 {
    background-color: var(--cobalt-950);
}

/* Project status pills (todo / in-progress / done / blocked) */
.status-todo {
    color: var(--status-todo);
}

.status-progress {
    color: var(--status-progress);
}

.status-done {
    color: var(--status-done);
}

.status-blocked {
    color: var(--status-blocked);
}

/* ========================================= */
/* SHADCN UI GLASSMORPHISM GLOBAL OVERRIDES  */
/* ========================================= */

/* Background Gradient for Body */
.light {
    --bg-grad-start: var(--cobalt-50);
}

:root:not(.light) {
    --bg-grad-start: hsl(var(--card));
}

body>div[id="root"] {
    background: linear-gradient(180deg, var(--bg-grad-start) 0%, transparent 45%);
    background-color: hsl(var(--background));
}

/* Content cards — opaque and still. FRAMEWORK_UX §1.3: le chrome reste en retrait.
 * No blur (per-frame GPU cost on long grids), no hover lift (a `transform` creates a
 * containing block and re-anchors any fixed-position popover inside the card), and no
 * `!important` (§3.3: surcharger des tokens, pas des selecteurs).
 */
.bg-card,
.card {
    box-shadow: var(--dyn-card-shadow);
}

/* ── Dynamint layout token overrides ──────────────────────────── */
/* Customize the header, sidebar and logo by overriding --dyn-*   */
/* variables. No !important needed — variables cascade naturally.  */
:root {
    /* Sidebar: opaque — it overlays content when expanded, must not show through */
    --dyn-sidebar-bg:     hsl(var(--card));
    --dyn-sidebar-blur:   none;
    --dyn-sidebar-radius: 1rem;
    --dyn-sidebar-shadow: 0 4px 24px -4px rgb(0 0 0 / 0.15);

    --dyn-header-height:      3.5rem;        /* header height */
    --dyn-logo-height:        2.25rem;     /* logo image height (must fit in header) */
    --dyn-header-bg:            hsl(var(--background) / 0.9);
    --dyn-header-blur:          blur(12px);
    --dyn-header-border-bottom: 1px solid hsl(var(--border) / 0.3);

    /* Sidebar card zones */
    --dyn-sidebar-card-bg:     hsl(var(--card) / 0.5);
    --dyn-sidebar-card-radius: 0.875rem;

    /* Action pills: keep them pill-shaped */
    --dyn-pill-radius: 9999px;
}

.dyn-app-title {
    font-family: 'Unbounded', sans-serif;
    font-size: 1.35rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.2;
    color: hsl(var(--foreground));
    user-select: none;
    -webkit-font-smoothing: antialiased;
}

/* Primary action button (consumed by plugin views: stage-gate, timesheet, load, risk,
 * invest-portfolio). Scoped to the class alone — `.bg-primary` is a Tailwind utility worn
 * by the active sidebar item, and `button[type="submit"]` already has its shadcn variant.
 */
.btn-primary {
    background-color: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
    border-radius: var(--radius);
    border: none;
    transition: background-color 0.15s ease;
}

.btn-primary:hover {
    background-color: var(--cobalt-700);
}

.btn-primary:active {
    background-color: var(--cobalt-800);
}

/* Text selections & scrollbars */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: var(--cobalt-200);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--cobalt-500);
}

::selection {
    background-color: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
}

/* Focus ring — theme-aware override (replaces hardcoded ring-offset-slate-900 from base CSS) */
:root *:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px hsl(var(--background)), 0 0 0 4px hsl(var(--ring));
}

/* Sidebar width transition handled by React — no override needed */

/* ========================================= */
/* REACT BIG CALENDAR DARK MODE OVERRIDES    */
/* ========================================= */

:root:not(.light) .rbc-calendar {
    color: hsl(var(--foreground));
    background-color: transparent;
}

:root:not(.light) .rbc-header {
    border-bottom: 1px solid hsl(var(--border) / 0.5);
    color: hsl(var(--foreground));
}

:root:not(.light) .rbc-header+.rbc-header {
    border-left: 1px solid hsl(var(--border) / 0.5);
}

:root:not(.light) .rbc-day-bg {
    background-color: transparent;
}

:root:not(.light) .rbc-day-bg+.rbc-day-bg {
    border-left: 1px solid hsl(var(--border) / 0.5);
}

:root:not(.light) .rbc-month-view,
:root:not(.light) .rbc-time-view,
:root:not(.light) .rbc-agenda-view {
    border: 1px solid hsl(var(--border) / 0.5);
    background-color: hsl(var(--card) / 0.4);
    backdrop-filter: blur(8px);
    border-radius: var(--radius);
}

:root:not(.light) .rbc-time-header.rbc-overflowing {
    border-right: 1px solid hsl(var(--border) / 0.5);
}

:root:not(.light) .rbc-time-content {
    border-top: 2px solid hsl(var(--border));
}

:root:not(.light) .rbc-time-content>*+*>*,
:root:not(.light) .rbc-day-slot .rbc-time-slot {
    border-top: 1px solid hsl(var(--border) / 0.3);
}

:root:not(.light) .rbc-event {
    background-color: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
    border: 1px solid hsl(var(--primary) / 0.5);
}

:root:not(.light) .rbc-off-range-bg {
    background-color: hsl(var(--muted) / 0.2);
}

:root:not(.light) .rbc-today {
    background-color: hsl(var(--accent) / 0.2);
}

:root:not(.light) .rbc-toolbar button {
    color: hsl(var(--foreground));
    border: 1px solid hsl(var(--border));
    background-color: hsl(var(--secondary) / 0.5);
}

:root:not(.light) .rbc-toolbar button:hover,
:root:not(.light) .rbc-toolbar button:active,
:root:not(.light) .rbc-toolbar button.rbc-active {
    background-color: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
    border-color: hsl(var(--primary));
}

:root:not(.light) .rbc-timeslot-group {
    border-bottom: 1px solid hsl(var(--border) / 0.3);
}

:root:not(.light) .rbc-time-gutter .rbc-timeslot-group {
    border-bottom: none;
}

:root:not(.light) .rbc-label {
    color: hsl(var(--muted-foreground));
}

/* Light-mode "today" highlight — soft cobalt wash */
.light .rbc-today {
    background-color: hsl(var(--accent) / 0.5);
}

/* =============================================================== */
/* POPUP DIALOGS & FORM DIFFERENTIATION (Cobalt Theme Integration) */
/* =============================================================== */

/* Fix Popup Dialogs in Dark Mode */
:root:not(.light) [role="dialog"].bg-white {
    background-color: hsl(var(--card));
    color: hsl(var(--foreground));
    border: 1px solid hsl(var(--border) / 0.5);
    backdrop-filter: blur(12px);
}

/* Fix Invisible Description Text */
[role="dialog"] .text-gray-100 {
    color: hsl(var(--muted-foreground));
}

/* Enhance Label/Data Differentiation */
/* Enhance Label/Data Differentiation across all forms and dialogs */
form label,
.dyn-field-readonly label,
[role="dialog"] label {
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 0.05em;
    color: hsl(var(--muted-foreground));
    margin-bottom: 4px;
}

/* Data Points & Read-only Field Styling */
.dyn-field-readonly input,
.dyn-field-readonly textarea,
.dyn-field-readonly button[role="combobox"],
[role="dialog"] form p,
[role="dialog"] form .form-value {
    background-color: hsl(var(--muted) / 0.35);
    border-color: hsl(var(--border) / 0.6);
    color: hsl(var(--foreground));
}

[role="dialog"] form .space-y-2 {
    margin-bottom: 1.1rem;
}

/* ========================================= */
/* TABLE CUSTOMIZATIONS — airy, scannable    */
/* ========================================= */

th {
    padding-left: var(--table-header-padding);
    padding-right: var(--table-header-padding);
    padding-top: 0.6rem;
    padding-bottom: 0.6rem;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: hsl(var(--muted-foreground));
}

td {
    padding-left: var(--table-cell-padding);
    padding-right: var(--table-cell-padding);
    padding-top: 0.55rem;
    padding-bottom: 0.55rem;
}

/* Gentle zebra + row hover for dense project/task lists */
tbody tr {
    transition: background-color 0.15s ease;
}

tbody tr:hover {
    background-color: hsl(var(--accent) / 0.35);
}

/* Column separators on all grid/tree-grid tables */
.dynamint-grid-body table td,
.dynamint-grid-body table th,
.dynamint-tree-body table td,
.dynamint-tree-body table th {
    box-shadow: inset -1px 0 0 hsl(var(--border));
}
.dynamint-grid-body table td:last-child,
.dynamint-grid-body table th:last-child,
.dynamint-tree-body table td:last-child,
.dynamint-tree-body table th:last-child {
    box-shadow: none;
}

/* Theme contributed by nexum-core (ADR-0032): selector is the theme identifier. */
.nexum-slate {
    --background: 215 28% 17%;
    --foreground: 210 40% 98%;
    --card: 215 25% 22%;
    --card-foreground: 210 40% 98%;
    --popover: 215 25% 22%;
    --popover-foreground: 210 40% 98%;
    --primary: 199 89% 60%;
    --primary-foreground: 215 28% 12%;
    --muted: 215 25% 22%;
    --muted-foreground: 215 16% 70%;
    --border: 215 20% 32%;
    --input: 215 20% 32%;
    --ring: 199 89% 60%;
}

.nexum-carbon {
    --background: 0 0% 12%;
    --foreground: 0 0% 96%;
    --card: 0 0% 16%;
    --card-foreground: 0 0% 96%;
    --popover: 0 0% 16%;
    --popover-foreground: 0 0% 96%;
    --primary: 32 95% 58%;
    --primary-foreground: 0 0% 10%;
    --muted: 0 0% 18%;
    --muted-foreground: 0 0% 68%;
    --border: 0 0% 26%;
    --input: 0 0% 26%;
    --ring: 32 95% 58%;
}

/* ============================================================
   ADR-0065 — Entity tooltips.

   A tooltip is a glance, not a form: term/value pairs in a definition list
   rather than stacked labelled fields. The rules live here rather than in the
   frontend bundle because GET /ui-model/css is the deterministic channel
   (ADR-0032) — a plugin's own ui-model.css comes later in the module chain and
   therefore overrides any of these without !important.

   Overridable surface: .dyn-tooltip, -title, -list, -term, -detail, -state.
   ============================================================ */

/* Colours come from the popover tokens, applied on the component itself because
   Tailwind utilities from the bundle outrank module CSS: retune a tooltip's palette
   by redefining --popover / --popover-foreground for the theme, not by fighting the
   utility. Everything below is structure, and is plugin-overridable as usual. */

.dyn-tooltip {
    max-width: var(--dyn-tooltip-max-width, 18rem);
    border-radius: 0.5rem;
}

.dyn-tooltip-title {
    padding: 0.3rem 0.6rem;
    border-bottom: 1px solid hsl(var(--border));
    font-size: 0.65rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: hsl(var(--muted-foreground));
}

/* rows that flow, never a label column: a grid would align values like a form */
.dyn-tooltip-list {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 0.4rem 0.6rem;
    font-size: 0.72rem;
    line-height: 1.35;
}

.dyn-tooltip-row {
    display: flex;
    align-items: baseline;
    gap: 0.35rem;
    min-width: 0;
}

/* a label is opt-in and stays subordinate to the value it introduces */
.dyn-tooltip-term {
    color: hsl(var(--muted-foreground));
    font-weight: 400;
    white-space: nowrap;
}

.dyn-tooltip-detail {
    min-width: 0;
    overflow-wrap: anywhere;
}

/* the cell that claims the width leads the tooltip, like a heading */
.dyn-tooltip-lead {
    padding-bottom: 0.15rem;
    font-size: 0.8rem;
    font-weight: 600;
}

/* a value carrying its own layout (avatar, badge) must not be stretched by the row */
.dyn-tooltip-detail > * {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
}

.dyn-tooltip-state {
    padding: 0.5rem 0.6rem;
    font-size: 0.72rem;
    color: hsl(var(--muted-foreground));
}