/* =============================================================================
   Scrum Boards — SWIMLANES (phase 2, 2026-08-09).

   Columns mode grouped into one horizontal row per team or per assignee.
   Owned by the Wave 2 "swimlanes" stream; loaded from the index.html phase-2
   CSS seam. Reuses the ocsb-col* column styles from oc-scrum-board.css — this
   file only adds the lane chrome around them, plus the settings picker.

   Colours come from --oc-* tokens ONLY (raw values live in oc-theme.css alone),
   so dark mode flips for free and check-oc-tokens.ps1 stays green.
   ============================================================================= */

/* The stack of lanes owns BOTH scroll axes: lanes are min-width:max-content and
   every lane renders every section, so their columns stay vertically aligned
   while the whole surface pans as one — per-lane horizontal scrollbars would
   let rows drift out of sync. */
.ocsb-swimlanes {
    display: flex;
    flex-direction: column;
    gap: .75rem;
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    padding-bottom: .5rem;
}

.ocsb-swimlanes-hint { margin: 0; }

.ocsb-lane {
    min-width: max-content;
    border: 1px solid var(--oc-border);
    border-radius: var(--oc-radius-lg);
    background: var(--oc-surface);
}

.ocsb-lane-head {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .5rem .75rem;
    border-bottom: 1px solid var(--oc-border);
}

.ocsb-lane.is-collapsed .ocsb-lane-head { border-bottom: 0; }

.ocsb-lane-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    padding: 0;
    border: 0;
    border-radius: var(--oc-radius-sm);
    background: none;
    color: var(--oc-text-muted);
    cursor: pointer;
}

.ocsb-lane-toggle:hover {
    background: var(--oc-gray-50);
    color: var(--oc-text);
}

.ocsb-lane-name {
    font-weight: 700;
    font-size: var(--oc-fs-sm);
    color: var(--oc-text);
}

.ocsb-lane-name .bi { color: var(--oc-text-muted); }

.ocsb-lane-count {
    font-size: var(--oc-fs-xs);
    color: var(--oc-text-muted);
    font-variant-numeric: tabular-nums;
}

/* Inside a lane the columns row gives up its own scrolling (the surface pans
   instead) but keeps the flex layout and gap it inherits from .ocsb-cols. */
.ocsb-lane-cols {
    overflow-x: visible;
    flex: 0 0 auto;
    padding: .5rem .75rem .75rem;
}

.ocsb-lane.is-collapsed .ocsb-lane-cols { display: none; }

/* ------------------------------------------------------- settings picker */

.ocsb-swim-picker {
    margin-top: 1rem;
    padding: .75rem;
    border: 1px solid var(--oc-border);
    border-radius: var(--oc-radius-lg);
    background: var(--oc-surface);
}

.ocsb-swim-picker-title {
    display: block;
    font-weight: 700;
    font-size: var(--oc-fs-sm);
    color: var(--oc-text);
}

.ocsb-swim-picker-head { margin-bottom: .5rem; }
.ocsb-swim-picker-head .ocsb-subtitle { margin: .125rem 0 0; }