/* HousekeepingBoard.css -- the room-turn board */
/* Layout: VerticalStackTemplate > Panel > ExpandablePanel per building > section rows */
/* Components: Panel, ExpandablePanel, RoomCard, StatsGrid, StatusBanner, Modal */
/* All values from design-tokens.css -- no hardcoded colours, spacing or radii */

/* The stack of buildings, and the sections inside one. The PARENT owns the space
   between children via gap; no component here carries an external margin. */
.board-buildings {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.board-sections {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

/* ONE SECTION = ONE ROW: label above, that section's rooms flowing across beneath.
   The same shape as AvailabilityStrip's seating row, because a labelled run of cells
   reads as one unit of work -- and a housekeeping section is a cleaner's round. */
.board-section-row {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.board-section-label {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.board-section-name {
    font-size: var(--text-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--text-primary);
}

.board-section-meta {
    font-size: var(--text-2xs);
    color: var(--text-muted);
}

/* A section whose rooms can reach no team. It is the one thing on this board that
   looks completely normal and silently does nothing, so it is marked. */
.board-section-row--unroutable .board-section-name {
    color: var(--color-warning);
}

/* Drag a room onto another section's row to route it there for the day. */
.board-section-rooms {
    border-radius: var(--border-radius-md);
    border: var(--border-width-1) dashed transparent;
    padding: var(--space-1);
    transition: border-color var(--duration-200) var(--easing-out),
                background-color var(--duration-200) var(--easing-out);
    /* Rooms pack from the left. Something in the ambient cascade resolves this row to
       space-between -- no rule in the tree declares it and the molecule's own
       flex-start does not win -- which strings a short last line of rooms across the
       full width, so three rooms read as three unrelated things instead of the tail of
       one section. Declared here because this stylesheet loads after the molecule's. */
    justify-content: flex-start;
}

.board-section-rooms--drop-target {
    border-color: var(--color-primary);
    background: var(--color-primary-light);
}

.room-card--dragging {
    opacity: 0.4;
}

/* A room routed somewhere other than its own section, for today only. */
.room-card--rerouted {
    border-style: dashed;
    border-color: var(--color-info);
}