/* ============================================================
   WPCarSync — aktion-detail.css
   Einzelseite für eine Aktion / Offergroup (Promotion)
   Voraussetzung: style.css, marke.css (Brand-Section, Hero-Stats),
                  angebote.css (Offer-Cards)
   ============================================================ */


/* ============================================================
   HERO — Offergroup-Modifier auf .wpcs-hero
   Stats horizontal wie bei Marke/Standort
   ============================================================ */

.wpcs-hero--offergroup .wpcs-aktion-teaser__stats {
    display: flex;
    flex-direction: row;
    gap: 2px;
    background: var(--wpcs-color-border);
    border: 1px solid var(--wpcs-color-border);
    border-radius: var(--wpcs-radius-lg);
    overflow: hidden;
    margin-top: 28px;
    min-width: 0;
}

.wpcs-hero--offergroup .wpcs-hero-stat {
    flex: 1;
    flex-direction: column;
    align-items: flex-start;
    padding: 16px 20px;
    gap: 4px;
    background: var(--wpcs-color-surface);
}

.wpcs-hero--offergroup .wpcs-hero-stat:hover {
    background: var(--wpcs-color-surface-3);
}

.wpcs-hero--offergroup .wpcs-hero-stat__value {
    font-size: var(--wpcs-text-4xl);
    min-width: unset;
    text-align: left;
}

.wpcs-hero--offergroup .wpcs-hero__body {
    max-width: none;
}


/* ============================================================
   AKTION CONTENT (WordPress-Freitextbereich)
   ============================================================ */

.wpcs-aktion-content__body {
    max-width: var(--wpcs-content-body-width);
}

.wpcs-aktion-content__intro {
    margin-bottom: 0;
}

.wpcs-aktion-content__intro h2 {
    font-family: var(--wpcs-font-label);
    font-size: var(--wpcs-text-3xl);
    font-weight: 700;
    color: var(--wpcs-color-text);
    margin: 0 0 16px;
}

.wpcs-aktion-content__intro p {
    font-family: var(--wpcs-font-body);
    font-size: var(--wpcs-text-base);
    line-height: 1.8;
    color: var(--wpcs-color-text-muted);
    margin: 0 0 12px;
}


/* ============================================================
   ANGEBOTE-LISTE
   ============================================================ */

.wpcs-aktion-offers__count {
    font-family: var(--wpcs-font-mono);
    font-size: var(--wpcs-text-sm);
    color: var(--wpcs-color-text-muted);
}

.wpcs-aktion-offers__count strong {
    color: var(--wpcs-color-text);
    font-weight: 500;
}

.wpcs-aktion-offers .wpcs-offers-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}


/* ============================================================
   FILTER BUTTONS
   ============================================================ */

.wpcs-aktion-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;
}

.wpcs-aktion-filters .wpcs-btn.active {
    background: var(--wpcs-color-text);
    color: #fff;
    border-color: var(--wpcs-color-text);
}


/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 768px) {
    .wpcs-hero--offergroup .wpcs-aktion-teaser__stats {
        flex-direction: column;
        gap: 2px;
    }

    .wpcs-hero--offergroup .wpcs-hero-stat {
        flex-direction: row;
        align-items: center;
        padding: 14px 20px;
    }
}
