/*
 * Coverage badges for the shift calendar page (session 24). Aligns with
 * the existing gantt body grid via --gantt-day-w (5.2px) and --total-days.
 * Loaded only when ShiftCalendar is mounted (the badge row only renders
 * when coverageMap !== null), so the styles are inert on the vacation page.
 */

.gantt-coverage-row {
    display: grid;
    grid-template-columns: var(--gantt-label-w) 1fr;
    height: 22px;
    border-bottom: 1px solid #ececec;
    background: #fafaf7;
    font-size: 10px;
    line-height: 1;
    color: #666;
}

.gantt-coverage-spacer {
    width: var(--gantt-label-w);
}

.gantt-coverage-cells {
    display: grid;
    grid-template-columns: repeat(var(--total-days), var(--gantt-day-w));
}

.gantt-coverage-cell {
    display: flex;
    align-items: center;
    justify-content: center;
    border-right: 1px solid #f4f4ee;
    overflow: hidden;
}

.gantt-coverage-badge {
    font-weight: 600;
    letter-spacing: 0;
    white-space: nowrap;
}

.gantt-coverage-cell--shortfall {
    background: #fef3c7;
}

.gantt-coverage-cell--shortfall .gantt-coverage-badge {
    color: #92400e;
}