
/* Light Theme Card-Like Styles */
.card-like {
    background: var(--theme-card-background);
    color: var(--theme-color-text-muted);
    border-radius: var(--radius-lg);
    border: 1px solid var(--theme-color-border);
    box-shadow: var(--theme-shadow-2), var(--theme-shadow-1), var(--theme-shadow-inset-1);
    padding: var(--space-sm) var(--space-sm);
}

.card-like .card-header {
    font-weight: 600;
    font-size: 1.1rem;
    margin-bottom: 0.5rem;
    border-bottom: 1px solid var(--theme-color-border-bottom);
    padding-bottom: 0.5rem;
}

.card-like .card-body {
    font-size: 0.95rem;
}

.card-like .card-footer {
    margin-top: 0.75rem;
    border-top: 1px solid var(--theme-color-border-top);
    padding-top: 0.5rem;
    display: flex;
    gap: 0.5rem;
    justify-content: flex-end;
}

/* Light Theme - Queuing State */
.card-like.queueing::after {
    content: '';
    position: absolute;
    inset: -4px;
    border-radius: inherit;
    /*box-shadow: 0 0 18px rgba(34, 197, 94, 0.6);*/
    box-shadow: 0 0 18px var(--queuing-box-shadow-green);
    opacity: 0;
    pointer-events: none;
    will-change: opacity;
    transition: opacity 1.6s cubic-bezier(0.37, 0, 0.63, 1);
}

.card-like.queueing.pulse-on::after { opacity: 1; }
.card-like.queueing.pulse-off::after { opacity: 0; }
.card-like.queueing.pulse-finish::after { opacity: 1; }

/* Light Theme - On Deck State */
.card-like.onDeck::after {
    content: '';
    position: absolute;
    inset: -4px;
    border-radius: inherit;
    /*box-shadow: 0 0 18px rgba(220, 38, 38, 0.6);*/
    box-shadow: 0 0 18px var(--queuing-box-shadow-red);
    opacity: 0;
    pointer-events: none;
    will-change: opacity;
    transition: opacity 1.6s cubic-bezier(0.37, 0, 0.63, 1);
}

.card-like.onDeck.pulse-on::after { opacity: 1; }
.card-like.onDeck.pulse-off::after { opacity: 0; }
.card-like.onDeck.pulse-finish::after { opacity: 1; }


