/* =============================================================================
   Affiliate Tours – Frontend-Stylesheet (nur strukturelle Regeln)
   Alle Klassen beginnen mit .at- um Theme-Konflikte zu vermeiden.
   Visuelles Styling (Farben, Schriftgrößen, Abstände) wird per Theme-CSS gesteuert.
   ============================================================================= */

/* =============================================================================
   Basis
   ============================================================================= */

.at-duration,
.at-languages {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

/* =============================================================================
   Bilder-Galerie
   ============================================================================= */

.at-images {
    display: grid;
    gap: 6px;
}

.at-images--1 { grid-template-columns: 1fr; }

.at-images--2 { grid-template-columns: 1fr 1fr; }

.at-images--3 {
    grid-template-columns: 2fr 1fr;
    grid-template-rows: auto auto;
}
.at-images--3 .at-image--1 {
    grid-row: 1 / 3;
}

.at-images--4,
.at-images--5,
.at-images--6 {
    grid-template-columns: repeat(3, 1fr);
}

.at-image {
    width: 100%;
    height: 220px;
    object-fit: cover;
    display: block;
}

.at-images--1 .at-image {
    height: 300px;
}

@media (max-width: 600px) {
    .at-images--3,
    .at-images--4,
    .at-images--5,
    .at-images--6 {
        grid-template-columns: 1fr 1fr;
    }
    .at-images--3 .at-image--1 {
        grid-row: auto;
        grid-column: 1 / 3;
    }
    .at-image {
        height: 160px;
    }
}

/* =============================================================================
   Preis
   ============================================================================= */

.at-price--simple {
    display: inline-block;
}

/* =============================================================================
   Bewertungs-Score
   ============================================================================= */

.at-rating {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.at-stars {
    display: inline-flex;
    gap: 1px;
}

/* Klammern dekorativ via CSS – kein Text-Node im HTML, damit der Label-Span sauber bleibt */
.at-rating__count::before { content: "("; }
.at-rating__count::after  { content: ")"; }

/* =============================================================================
   Vertrauens-Badges
   ============================================================================= */

.at-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.at-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
}

/* =============================================================================
   Treffpunkt
   ============================================================================= */

.at-meetingpoint {
    display: flex;
    align-items: baseline;
    gap: 6px;
}

.at-meetingpoint__label {
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Doppelpunkt nach dem Label via CSS */
.at-meetingpoint__label::after {
    content: ":";
}

/* =============================================================================
   Nächster Termin
   ============================================================================= */

.at-next-date {
    display: inline;
}