/*
 * Casting board (spec §4.2).
 *
 * Filament's compiled panel CSS carries no Tailwind utilities for custom
 * views, so the board ships its own small, class-based stylesheet.
 * Colours come from Filament's CSS custom properties, which are full
 * colour values in Filament 5, so the board follows the panel theme in
 * both light and dark mode.
 */

.ph-board {
    display: grid;
    gap: 1.25rem;
}

.ph-board__role-actions {
    display: flex;
    gap: 0.25rem;
    align-items: center;
}

.ph-board__empty {
    font-size: 0.875rem;
    color: var(--gray-500);
}

.ph-board__cards {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
    gap: 0.75rem;
}

.ph-card {
    position: relative;
    display: grid;
    grid-template-columns: 4px 1fr;
    border: 1px solid color-mix(in srgb, var(--gray-500) 30%, transparent);
    border-radius: 0.75rem;
    overflow: hidden;
}

.ph-card__strip {
    background: var(--gray-400);
}

.ph-card--shortlisted .ph-card__strip {
    background: var(--primary-500);
}

.ph-card--booked .ph-card__strip {
    background: var(--success-500);
}

.ph-card--rejected .ph-card__strip {
    background: var(--danger-500);
}

/*
 * A card whose model was soft-deleted stays on the board (the assignment
 * outlives the model) but is visibly muted and carries a "Model gelöscht"
 * badge; only the remove action is offered on it.
 */
.ph-card--deleted {
    opacity: 0.7;
}

.ph-card__body {
    display: grid;
    gap: 0.5rem;
    padding: 0.75rem;
    min-width: 0;
}

.ph-card__head {
    display: grid;
    grid-template-columns: 2.5rem 1fr auto;
    gap: 0.625rem;
    align-items: center;
}

.ph-card__thumb {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 9999px;
    object-fit: cover;
    background: color-mix(in srgb, var(--gray-500) 20%, transparent);
}

.ph-card__title {
    display: grid;
    min-width: 0;
}

.ph-card__number {
    font-size: 0.75rem;
    color: var(--gray-500);
    letter-spacing: 0.02em;
}

.ph-card__name {
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ph-card__conflicts {
    display: flex;
    gap: 0.25rem;
}

.ph-card__conflict {
    width: 1.25rem;
    height: 1.25rem;
    color: var(--danger-500);
}

.ph-card__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

.ph-card__meta {
    display: grid;
    gap: 0.125rem;
    font-size: 0.8125rem;
}

.ph-card__meta div {
    display: grid;
    grid-template-columns: 5rem 1fr;
    gap: 0.5rem;
}

.ph-card__meta dt {
    color: var(--gray-500);
}

.ph-card__meta dd {
    margin: 0;
    overflow-wrap: anywhere;
}

.ph-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    padding-top: 0.25rem;
    border-top: 1px solid color-mix(in srgb, var(--gray-500) 20%, transparent);
}

@media (prefers-reduced-motion: no-preference) {
    .ph-card {
        transition: box-shadow 120ms ease;
    }

    .ph-card:hover {
        box-shadow: 0 1px 3px color-mix(in srgb, var(--gray-950) 12%, transparent);
    }
}

@media (max-width: 640px) {
    .ph-board__cards {
        grid-template-columns: 1fr;
    }
}
