/* ───────────────────────────────────────────────────────────────────────────
   Cash forecast (/Reports/Forecast): payroll going out and payments coming
   in, by week, known kept apart from projected. Builds on the operations
   report's page, tiles, cards, tables and chart axes (operations-report.css,
   .op-page and .tc-*); only the bars, the certainty colours and the
   scenario editor live here. Scoped under .leaf-ds, from leaf-ds.css tokens.
   ─────────────────────────────────────────────────────────────────────────── */

/* How sure a figure is, one hue light → dark (the report's own ramp, validated as an ordinal ramp
   on the card surface): known darkest, worked mid, projected lightest and hatched, so it reads as
   projected in print, in forced colours and to a reader who can't tell the greens apart. */
.leaf-ds .fc-known { --tc-c: var(--op-s4); }
.leaf-ds .fc-worked { --tc-c: var(--op-s2); }
.leaf-ds .fc-projected {
    --tc-c: var(--op-s1);
    --fc-hatch: repeating-linear-gradient(135deg, rgba(255, 255, 255, .55) 0 2px, transparent 2px 6px);
}

.leaf-ds .fc-charts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 900px) { .leaf-ds .fc-charts { grid-template-columns: minmax(0, 1fr); } }
.leaf-ds .fc-card { min-width: 0; }
/* A flow that couldn't be priced, in its chart's place while the page shows dollars. */
.leaf-ds .fc-unpriced { display: flex; flex-direction: column; justify-content: center; gap: 6px; min-height: 160px; font-size: 13px; color: var(--ink-2); }
.leaf-ds .fc-unpriced p { margin: 0; }

/* Legend: a square swatch, since the marks are bars. */
.leaf-ds .fc-key { width: 12px; height: 12px; border-radius: 3px; background: var(--tc-c); background-image: var(--fc-hatch, none); }

/* One bar per week, anchored to the baseline; the segments keep a 2px surface gap and only the top
   end is rounded. The whole column is the hover target (.tc-col). */
.leaf-ds .fc-col { display: flex; align-items: flex-end; justify-content: center; }
.leaf-ds .fc-bar {
    width: min(62%, 44px); display: flex; flex-direction: column; gap: 2px;
    border-radius: 4px 4px 0 0; overflow: hidden;
}
.leaf-ds .fc-seg { flex-basis: 0; min-height: 2px; background: var(--tc-c); background-image: var(--fc-hatch, none); }
.leaf-ds .fc-col:hover .fc-bar { filter: brightness(1.06); }
.leaf-ds .fc-tip-k { display: inline-block; width: 10px; height: 10px; border-radius: 2px; background: var(--tc-c, transparent); background-image: var(--fc-hatch, none); }
.leaf-ds .fc-tip-note { margin: -2px 0 4px; color: var(--ink-3); }
.leaf-ds .fc-tip-total { border-top: 1px solid var(--line-2); margin-top: 4px; padding-top: 2px; }
.leaf-ds .tc-x span.fc-payweek { color: var(--ink-1); font-weight: 700; }

/* What the forecast assumes, in words. */
.leaf-ds .fc-assume { margin: 0; padding-left: 18px; font-size: 13px; color: var(--ink-2); line-height: 1.7; }
.leaf-ds .fc-assume b { color: var(--ink-1); }
.leaf-ds .fc-foot { display: flex; flex-direction: column; gap: 2px; margin: 10px 0 0; font-size: 12px; color: var(--ink-3); }

.leaf-ds .fc-table th .fc-tip-k { vertical-align: -1px; margin-right: 2px; }
.leaf-ds .fc-table .fc-th-group { text-align: center; border-bottom: 1px solid var(--line-2); }
/* Under the week's dates, so the week column stays narrow enough for every figure beside it. */
.leaf-ds .fc-payday { display: block; width: fit-content; margin: 3px 0 0; }
.leaf-ds .fc-table td:first-child { white-space: nowrap; }

/* ── Scenario editor ───────────────────────────────────────────────────── */
.leaf-ds .fs-form { display: flex; flex-direction: column; gap: 8px; }
.leaf-ds .fs-form > .lf-btn { align-self: flex-start; }
.leaf-ds .fs-h { margin: 12px 0 0; font-size: 12px; font-weight: 700; color: var(--ink-3); text-transform: uppercase; letter-spacing: .04em; }
.leaf-ds .fs-row { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--ink-2); }
.leaf-ds .fs-l { flex: 1; min-width: 0; }
.leaf-ds .fs-name { flex: 1; }
.leaf-ds .fs-num { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.leaf-ds .fs-num input, .leaf-ds .fs-days { width: 76px; text-align: right; }
.leaf-ds .fs-days { display: inline-block; margin: 0 4px; }
.leaf-ds .fs-rest { color: var(--ink-3); min-width: 118px; justify-content: flex-end; }
.leaf-ds .fs-curve { display: flex; flex-direction: column; gap: 6px; align-items: stretch; }
.leaf-ds .fs-curve > .lf-btn { align-self: flex-start; }
.leaf-ds .fs-payor { display: flex; flex-direction: column; gap: 6px; padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--r-6); }
.leaf-ds .fs-payor-h { display: flex; gap: 8px; align-items: center; }
.leaf-ds .fs-payor-h select { flex: 1; }
.leaf-ds .fs-help { margin: 0; font-size: 12.5px; color: var(--ink-3); }
.leaf-ds .fs-problems { margin: 8px 0 0; padding: 8px 12px 8px 28px; border-radius: var(--r-5); background: var(--c-warn-bg); color: var(--c-warn-fg); font-size: 12.5px; }

@media (max-width: 640px) {
    .leaf-ds .fs-row { flex-wrap: wrap; }
    .leaf-ds .fs-l { flex-basis: 100%; }
}