/**
 * TCB Partnerlogos
 *
 * Grundlegende Frontend-Struktur für die Partnerlogo-Ausgabe.
 *
 * Die Datei enthält bewusst nur Layout- und Strukturregeln.
 * Farben, Schriftarten und allgemeine Typografie sollen
 * weiterhin vom aktiven WordPress-Theme übernommen werden.
 */

/**
 * Äußerer Shortcode-Container.
 *
 * Dieser Container dient hauptsächlich als technische Hülle
 * für eine einzelne Shortcode-Instanz.
 */
.tcb-partnerlogos {
    width: 100%;
}

/**
 * Enthält alle aktuell ausgewählten Partner.
 *
 * Flexbox ermöglicht:
 *
 * - horizontale Anordnung auf größeren Bildschirmen
 * - automatischen Zeilenumbruch bei Platzmangel
 * - zentrierte Darstellung der gesamten Partnergruppe
 */
.tcb-partnerlogos__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
}

/**
 * Einzelner Partner innerhalb der Liste.
 *
 * Logo, optionaler Name und optionaler Kurztext
 * werden als gemeinsame Einheit zentriert dargestellt.
 */
.tcb-partnerlogos__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

/**
 * Verlinktes Partnerlogo.
 *
 * Der Link soll nur den eigentlichen Logo-Bereich umfassen.
 */
.tcb-partnerlogos__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/**
 * Partnerlogo.
 *
 * Die konkrete maximale Höhe wird je Shortcode-Instanz
 * direkt über JavaScript gesetzt.
 *
 * width:auto sorgt dafür, dass das ursprüngliche
 * Seitenverhältnis des Logos erhalten bleibt.
 */
.tcb-partnerlogos__logo {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

/**
 * Optional sichtbarer Partnername.
 *
 * Typografie und Farbe werden bewusst nicht festgelegt,
 * damit diese Werte vom Theme geerbt werden.
 */
.tcb-partnerlogos__name {
    margin-top: 0.5em;
}

/**
 * Optionaler Kurztext.
 *
 * Auch hier übernimmt das Theme Schriftart und Farbe.
 */
.tcb-partnerlogos__text {
    margin-top: 0.25em;
    white-space: normal;
    overflow-wrap: break-word;
    max-width: 320px;
}

/**
 * Dezenter Hover-Effekt für verlinkte Partnerlogos.
 *
 * Der Effekt soll sichtbar, aber zurückhaltend bleiben.
 * Nicht verlinkte Logos erhalten bewusst keinen Hover-Effekt.
 */
.tcb-partnerlogos__link .tcb-partnerlogos__logo {
    transition:
        transform 0.2s ease,
        opacity 0.2s ease;
}

.tcb-partnerlogos__link:hover .tcb-partnerlogos__logo,
.tcb-partnerlogos__link:focus-visible .tcb-partnerlogos__logo {
    transform: scale(1.10);
    opacity: 0.75;
}

/**
 * Berücksichtigt die Systemeinstellung für reduzierte Bewegung.
 *
 * Nutzer, die Animationen reduziert haben möchten,
 * erhalten keinen Skalierungs- oder Übergangseffekt.
 */
@media (prefers-reduced-motion: reduce) {
    .tcb-partnerlogos__link .tcb-partnerlogos__logo {
        transition: none;
    }

    .tcb-partnerlogos__link:hover .tcb-partnerlogos__logo,
    .tcb-partnerlogos__link:focus-visible .tcb-partnerlogos__logo {
        transform: none;
    }
}