/*
 * Structural layout only: enough for the board and My Work to be usable and
 * for drop targets to be visible. No colours, type scale, or branding here.
 * The design pass owns everything visual and can replace this file wholesale.
 */

.board,
.my-work { display: flex; flex-direction: column; gap: 1.5rem; }

.swimlane-title,
.bucket-title { margin: 0 0 .5rem; font-size: 1rem; }

.swimlane-title .count,
.bucket-title .count,
.column-head .count { opacity: .6; font-weight: normal; }

/* Board columns scroll sideways rather than squashing. */
.columns {
    display: flex;
    gap: .75rem;
    align-items: flex-start;
    overflow-x: auto;
    padding-bottom: .5rem;
}

.column {
    flex: 0 0 16rem;
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(128, 128, 128, .35);
    border-radius: .375rem;
}

.column-head {
    display: flex;
    justify-content: space-between;
    gap: .5rem;
    padding: .5rem .625rem;
    border-bottom: 1px solid rgba(128, 128, 128, .35);
}

/* min-height keeps an empty column a valid drop target. */
.cards {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    padding: .5rem;
    min-height: 4rem;
}

.my-work .cards { min-height: 3rem; }

.cards.is-drop-target { outline: 2px dashed currentColor; outline-offset: -2px; }

.card,
.row-card {
    display: block;
    padding: .5rem .625rem;
    border: 1px solid rgba(128, 128, 128, .35);
    border-radius: .25rem;
    cursor: grab;
    background: inherit;
}

.card.is-dragging,
.row-card.is-dragging { opacity: .4; cursor: grabbing; }

.card-title { display: block; }

.card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .375rem;
    margin-top: .375rem;
    font-size: .8125rem;
}

.card-meta .tag { border: 1px solid rgba(128, 128, 128, .35); border-radius: 1rem; padding: 0 .5rem; }
.card-id { margin-left: auto; opacity: .6; }

.cards .empty { margin: 0; padding: .5rem; opacity: .6; font-size: .875rem; }

.board-filters { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin: .75rem 0; }
.subnav { margin: .5rem 0 1rem; }

[data-toast] {
    position: fixed;
    inset: auto 1rem 1rem auto;
    max-width: 24rem;
    padding: .625rem .875rem;
    border: 1px solid currentColor;
    border-radius: .25rem;
    background: Canvas;
}