/* ========================================
   Concert Card - Shared Component
   Used by: ConcertDiscovery, What's New, anywhere concerts are shown
   ======================================== */

.ccc-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1rem;
}

.ccc-card {
    border: 1px solid var(--mv-border-color, var(--mv-border-color));
    border-radius: 12px;
    overflow: hidden;
    background: var(--mv-bg-card, #ffffff);
    display: flex;
    flex-direction: column;
}

.ccc-image {
    width: 100%;
    height: 180px;
    object-fit: cover;
    background: var(--mv-bg-surface, #f8f9fa);
}

.ccc-body {
    padding: 0.9rem;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.ccc-actions {
    margin-top: auto;
}

.ccc-meta {
    color: var(--mv-text-muted, #6c757d);
    font-size: 0.9rem;
}

.ccc-location {
    font-size: 0.85rem;
    color: var(--mv-text-secondary, #495057);
}

.ccc-source {
    font-size: 0.8rem;
    color: var(--mv-text-muted, #6c757d);
}

/* ========================================
   Responsive
   ======================================== */
@media (max-width: 575px) {
    .ccc-grid {
        grid-template-columns: 1fr;
    }

    .ccc-image {
        height: 150px;
    }
}

/* ========================================
   DARK MODE
   ======================================== */
[data-bs-theme="dark"] .ccc-card {
    background: var(--mv-bg-card);
    border-color: var(--mv-border-color);
}

[data-bs-theme="dark"] .ccc-image {
    background: var(--mv-bg-surface);
}

[data-bs-theme="dark"] .ccc-meta,
[data-bs-theme="dark"] .ccc-source {
    color: var(--mv-text-muted);
}

[data-bs-theme="dark"] .ccc-location {
    color: var(--mv-text-secondary);
}