/*
Theme Name: GeneratePress Child
Theme URI: https://generatepress.com
Description: Default GeneratePress child theme
Author: Thomas Weichselbaumer
Author URI: https://weichselbaumer.com
Template: generatepress
Version: 0.1
*/

/* --- Accessibility Improvements --- */

/* Global Focus Style */
:focus-visible {
    outline: 2px solid var(--accent-pink, #cf0f5a);
    outline-offset: 2px;
}

/* Contrast Adjustment for Pink on White */
/* We define a darker shade for text usage on light backgrounds */
:root {
    --accent-pink-darker: #b00c4c; /* Darkened for 4.5:1 contrast on white */
}

/* Fix Focus for Cards with overflow:hidden (Teaser Tiles, Calendar Cards) */
.teaser-tile-link:focus-visible,
.syncevents-event-card:focus-visible,
.syncevents-card-link:focus-visible {
    outline: 3px solid var(--accent-pink, #cf0f5a) !important;
    outline-offset: -3px !important; /* Draw INSIDE to avoid clipping */
}

/* Ensure buttons have consistent focus */
.syncevents-load-more-btn:focus-visible,
.syncevents-cat-button:focus-visible,
.va-ticket-button:focus-visible {
    outline: 2px solid var(--accent-pink, #cf0f5a) !important;
    outline-offset: 2px !important;
}

/* --- Leichtgewichtiges responsives Grid-System by Gemini --- */
/*
 * ANLEITUNG:
 *
 * 1. Erstellen Sie einen Container mit der Klasse "grid".
 *    <div class="grid">
 *
 * 2. Fügen Sie Spalten mit der Klasse "grid-col" hinzu.
 *    <div class="grid">
 *      <div class="grid-col">...</div>
 *      <div class="grid-col">...</div>
 *    </div>
 *
 * 3. Weisen Sie den Spalten Breiten für Desktops zu (z.B. "grid-col-desktop-50" für 50%).
 *    Auf Mobilgeräten werden die Spalten automatisch untereinander gestapelt (Mobile-First).
 *
 * BEISPIEL für ein 2-Spalten-Layout auf dem Desktop:
 * <div class="grid">
 *   <div class="grid-col grid-col-desktop-50"> Inhalt Spalte 1 </div>
 *   <div class="grid-col grid-col-desktop-50"> Inhalt Spalte 2 </div>
 * </div>
*/

/* Grid-Container */
.grid {
    display: flex;
    flex-wrap: wrap;
    margin-left: -15px; /* Negativer Rand für den Spaltenabstand */
    margin-right: -15px; /* Negativer Rand für den Spaltenabstand */
    align-items: stretch;
    gap: 0;
}

/* Grid-Spalten */
.grid-col {
    padding-left: 15px; /* Innenabstand links */
    padding-right: 15px; /* Innenabstand rechts */
    padding-top: 0;
    padding-bottom: 0;
    box-sizing: border-box;
    width: 100%; /* Standard: 100% Breite für Mobile */
    display: flex;
    flex-direction: column;
}

.grid-col > * {
    margin: 0;
}

/* Spaltenbreiten für Desktops (ab 782px) */
/* GeneratePress nutzt 782px als Breakpoint (WP Standard), daher starten wir bei 782px */
@media (min-width: 782px) {
    .grid {
        flex-wrap: nowrap !important;
    }

    .grid-col-desktop-25 {
        width: 25% !important;
        flex-shrink: 0;
    }
    .grid-col-desktop-33 {
        width: 33.3333%;
    }
    .grid-col-desktop-50 {
        width: 50% !important;
        flex-shrink: 0;
    }
    .grid-col-desktop-66 {
        width: 66.6667%;
    }
    .grid-col-desktop-75 {
        width: 75% !important;
        flex-shrink: 0;
    }
    .grid-col-desktop-100 {
        width: 100%;
    }

    /* Desktop: Grid-Spalte wird Flex-Container */
    .grid-col {
        display: flex;
        flex-direction: column;
        height: auto;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
}

/* Optionale Spaltenbreiten für Tablets (zwischen 500px und 781px) */
@media (min-width: 500px) and (max-width: 781px) {
    .grid-col-tablet-50 {
        width: 50%;
    }
    .grid-col-tablet-75 {
        width: 75%;
    }
    .grid-col-tablet-100 {
        width: 100%;
    }
}

/* Fix für Slider/Grid Layout moved to slider.css */

/* Info Buttons Styling moved to blocks/info-buttons/style.css */

body .inside-article {
    background-color: color-mix(in srgb, var(--glass-bg) 85%, transparent);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
    border: 1px solid rgba(255, 255, 255, 0.05);
    overflow: hidden; /* Fix für horizontales Scrollen und abgerundete Ecken */
}

/* Inside-Article Hintergrundfarbe - außer auf der Startseite */
/*
body:not(.home) .inside-article {
    background-color: var(--base-3);
    border-radius: 8px;
} */

/* Gutenberg Gruppen mit Hintergrund */
.wp-block-group.has-background {
    border-radius: 8px;
}

/* Letztes Element in Gutenberg Gruppen ohne margin-bottom */
.wp-block-group__inner-container > *:last-child {
    margin-bottom: 0 !important;
}

/* ===== NAVIGATION MENÜ STYLING ===== */

/* -- Top Level Menu Items -- */
.main-navigation .main-nav > ul > li > a {
    position: relative;
    transition: color 0.3s ease;
}

/* Animated Underline */
.main-navigation .main-nav > ul > li > a::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: 10px; /* Abstand von unten anpassen */
    left: 50%;
    background-color: var(--accent-pink, #cf0f5a);
    transition:
        width 0.3s cubic-bezier(0.4, 0, 0.2, 1),
        opacity 0.3s ease;
    transform: translateX(-50%);
    opacity: 0;
}

.main-navigation .main-nav > ul > li:hover > a::after,
.main-navigation .main-nav > ul > li.current-menu-item > a::after,
.main-navigation .main-nav > ul > li.current-menu-ancestor > a::after {
    width: 70%;
    opacity: 1;
}

/* -- Dropdown Menu Container -- */
.main-navigation .main-nav ul ul {
    /* Glassmorphism Fix: Semi-transparent background needed */
    background-color: color-mix(
        in srgb,
        var(--glass-bg) 60%,
        transparent
    ); /* Dark semi-transparent */
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
    border: 1px solid rgba(255, 255, 255, 0.05);
    padding: 8px 0;

    /* Animation Setup */
    display: block;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px); /* Reduced distance for snappier feel */
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

    /* Positionierung */
    margin-top: 15px;
}

/* Bridge the gap to prevent hover loss - IMPROVED */
.main-navigation .main-nav li > ul::before {
    content: '';
    position: absolute;
    top: -30px; /* Extended reach upwards */
    left: 0;
    width: 100%;
    height: 30px; /* Taller bridge */
    background: transparent;
    z-index: 100; /* Ensure it's on top */
}

/* Show Dropdown on Hover */
.main-navigation .main-nav li:hover > ul,
.main-navigation .main-nav li.sfHover > ul {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* -- Dropdown Menu Items -- */
.main-navigation .main-nav ul ul li a {
    padding: 12px 24px;
    font-size: 0.95rem;
    border-left: 3px solid transparent;
    transition: all 0.2s ease;
    position: relative;
    overflow: hidden;
}

/* Dropdown Hover Effect */
.main-navigation .main-nav ul ul li a:hover,
.main-navigation .main-nav ul ul li a:focus-visible {
    background-color: rgba(255, 255, 255, 0.08);
    padding-left: 30px;
    border-left-color: var(--accent-pink, #cf0f5a);
    color: var(--text-light, #fff);
}

/* Separators */
.main-navigation .main-nav ul ul li:not(:last-child) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

/* Active Item in Dropdown */
.main-navigation .main-nav ul ul li.current-menu-item > a {
    background-color: rgba(255, 255, 255, 0.12);
    border-left-color: var(--accent-pink, #cf0f5a);
    padding-left: 30px;
    font-weight: 600;
}

/* Dropdown Arrow */
.main-navigation .menu-item-has-children .dropdown-menu-toggle {
    padding-right: 10px;
}

/* -- Mobile Menu -- */
@media (max-width: 781px) {
    /* Mobile Menu Overlay - Blur auf gesamter Hintergrundfläche */
    .main-navigation.toggled::before {
        content: '';
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: rgba(0, 0, 0, 0); /* Dunkle Overlay-Farbe */
        backdrop-filter: blur(8px); /* Blur auf gesamten Hintergrund */
        -webkit-backdrop-filter: blur(8px);
        z-index: 998; /* Hinter dem Menü */
        pointer-events: none; /* Klicks durchlassen */
    }

    /* Mobile Hauptmenü */
    .main-navigation.toggled .main-nav > ul {
        background-color: color-mix(
            in srgb,
            var(--glass-bg) 95%,
            transparent
        ); /* Dunkler für bessere Lesbarkeit */
        border-radius: 0 0 8px 8px;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
        border-top: 1px solid rgba(255, 255, 255, 0.1);
        position: absolute;
        left: 0;
        right: 0;
        top: 100%;
        z-index: 999;
    }

    /* Mobile Menu Underline - Volle Breite */
    .main-navigation .main-nav > ul > li:hover > a::after,
    .main-navigation .main-nav > ul > li.current-menu-item > a::after,
    .main-navigation .main-nav > ul > li.current-menu-ancestor > a::after {
        width: 100%;
        bottom: 0; /* Direkt am unteren Rand */
    }

    .main-navigation .main-nav ul ul {
        background-color: transparent; /* Kein eigener Hintergrund */
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        border: none;
        box-shadow: none;
        margin-top: 0;
        padding-top: 5px;
        padding-bottom: 5px;
    }

    /* Remove the bridge on mobile */
    .main-navigation .main-nav li > ul::before {
        display: none;
    }

    .main-navigation .main-nav ul ul li a {
        padding-left: 30px;
        border-left: none;
    }

    .main-navigation .main-nav ul ul li a:hover {
        padding-left: 35px;
        background-color: rgba(255, 255, 255, 0.05);
    }

    /* Mobile Toggle Button Animation */
    .menu-toggle .gp-icon svg {
        transition: transform 0.3s ease;
    }

    /* Wenn das Menü geöffnet ist (Klasse muss ggf. geprüft werden, oft 'toggled') */
    button.menu-toggle[aria-expanded='true'] .gp-icon svg {
        transform: rotate(90deg);
    }
}

.image-copyright-overlay {
    position: absolute;
    bottom: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--text-light, #fff);
    padding: 3px 8px;
    font-size: 11px;
    line-height: 1.3;
    pointer-events: none;
    z-index: 10;
    border-top-left-radius: 6px;
    border-bottom-right-radius: 8px; /* Passt sich der abgerundeten Ecke an */
}

/* ===== LOGO ÜBERLAGERUNG ===== */

/* Logo Container absolut positioniert und überlagernd */
.site-header .site-logo {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    max-width: 1200px; /* Container Breite an Content angepasst */
    margin: 0 auto; /* Zentrieren */
    padding: 0 40px; /* Seitenabstand */
    box-sizing: border-box;
    z-index: 100;
    pointer-events: none; /* Klicks durchlassen */
    display: flex;
    justify-content: flex-start; /* Links ausrichten */
    height: 0; /* Höhe auf 0 setzen */
}

/* Logo Link/Bild Wrapper */
.site-header .site-logo a {
    display: block;
    width: 170px; /* Logo Breite Desktop */
    pointer-events: auto; /* Logo klickbar */
}

/* Logo Bild anpassen */
.site-header .site-logo img {
    width: 100%;
    height: auto;
    display: block;
    transition:
        transform 0.3s ease,
        filter 0.3s ease;
    /* Fix für Unschärfe beim Skalieren */
    backface-visibility: hidden;
    transform: translateZ(0);
    will-change: transform;
}

.site-header .site-logo a:hover img {
    transform: scale(1.05);
    /* Helligkeit + Drop Shadow für Tiefe */
    filter: brightness(1.1) drop-shadow(0 5px 15px rgba(0, 0, 0, 0.3));
}

/* Header anpassen damit Logo nicht doppelt erscheint */
.site-header {
    position: relative;
}

/* Mobile Ansicht - Logo kleiner */
@media (max-width: 781px) {
    .site-header .site-logo a {
        width: 120px;
    }

    .site-header .site-logo {
        padding: 0 30px; /* Weniger Abstand mobil */
    }
}

/* Fix für Seiten ohne Headerbild: Inhalt nach unten schieben */
body:not(.home) .site-content {
    padding-top: 0px;
}

/* SPEZIALBEHANDLUNG: Seiten OHNE Featured Image (Logo-Kollision vermeiden) */
body.no-post-thumbnail:not(.home) .site-content {
    padding-top: 0; /* Reset padding, wir regeln das über den Header */
}

/* Einheitlicher Header-Titel-Bereich für alle Unterseiten (mit und ohne Bild) */
body:not(.home) .entry-header {
    background: linear-gradient(
        to right,
        rgba(255, 255, 255, 0.05),
        transparent
    );
    padding-bottom: 40px;
    padding-left: 40px;
    padding-right: 40px;
    margin-left: -40px;
    margin-right: -40px;
    margin-bottom: 40px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    /* Standard Padding oben für Beiträge MIT Bild */
    padding-top: 40px;
}

/* SPEZIAL: Wenn KEIN Bild da ist, muss mehr Platz für das Logo sein */
body.no-post-thumbnail:not(.home) .entry-header {
    padding-top: 80px;
}

/* Mobile Anpassung für den Header-Bereich */
@media (max-width: 781px) {
    /* Content auf allen Seiten (Home, Beiträge, etc.) nach oben ziehen */
    .site-content {
        padding-top: 0 !important;
        margin-top: -25px !important;
    }

    /* Mobile Styles für alle Header */
    .entry-header {
        padding-left: 20px;
        padding-right: 20px;
        margin-left: -20px;
        margin-right: -20px;
        padding-top: 30px;
    }

    /* Extra Platz nur wenn kein Bild da ist */
    body.no-post-thumbnail .entry-header {
        padding-top: 100px;
    }

    /* Featured Image größer auf Mobile (weniger Rand) */
    .featured-image,
    .post-image,
    .page-header-image {
        margin-left: -20px;
        margin-right: -20px;
        width: calc(100% + 40px);
        max-width: none;
    }
} /* Titel und Slogan ausblenden (da im Logo enthalten) */
.site-branding {
    display: none;
}

/* ===== ZUSÄTZLICHE MENU OPTIMIERUNGEN ===== */

/* Sticky Navigation Schatten */
.main-navigation.navigation-stick {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

/* Such-Icon Hover Effekt */
.main-navigation .search-item > a {
    transition:
        transform 0.3s ease,
        color 0.3s ease;
}

.main-navigation .search-item > a:hover {
    transform: scale(1.1) rotate(5deg);
    color: var(--accent-pink, #cf0f5a);
}

/* Close Icon für Mobile Menu / Search Overlay */
.slideout-exit:before,
.do-overlay .search-item.active > a:before {
    transition: transform 0.3s ease;
}

.slideout-exit:hover:before,
.do-overlay .search-item.active > a:hover:before {
    transform: rotate(90deg);
    color: var(--accent-pink, #cf0f5a);
}

/* ===== FEATURED IMAGES & COPYRIGHT STYLING ===== */

/* Wrapper für Bilder mit Copyright-Overlay */
.image-copyright-wrapper {
    border-radius: 8px;
    overflow: hidden;
    max-width: 100%;
}

/* Abgerundete Ecken für alle Featured Images */
.post-image img,
.featured-image img,
.page-header-image img,
.wp-block-image img {
    border-radius: 8px;
}

/* 16:9 Format erzwingen für Featured Images (Konsistenz mit Slider/Kacheln) */
.post-image img,
.featured-image img,
.page-header-image img {
    aspect-ratio: 16/9;
    object-fit: cover; /* Verhindert Verzerrung, schneidet Bild ggf. zu */
    width: 100%;
    height: auto;
}

/* Kontaktkarten-Bilder: das feste Höhenverhältnis wird in block CSS geregelt (.contact-person-photo-wrapper). */

/* ===== CONTENT TYPOGRAPHY & LISTS ===== */

/* Listen-Abstände vergrößern */
.entry-content ul,
.entry-content ol {
    margin-bottom: 1.5em;
}

.entry-content li {
    margin-bottom: 0.8em; /* Mehr Luft zwischen Listenpunkten */
    line-height: 1.6;
}

/* Nested lists spacing */
.entry-content li > ul,
.entry-content li > ol {
    margin-top: 0.8em;
    margin-bottom: 0;
}

/* ===== GLOBAL TEXT LINK STYLING (Content & Footer) ===== */
/* 1. Default Dark Background Style */
.entry-content
    a:not(.button):not(.wp-block-button__link):not(.info-button a):not(
        .slide-link
    ):not(.slide-ticket-button):not(.syncevents-card-link):not(
        .syncevents-ticket-button
    ):not([class*='teaser']):not(.light-bg-link),
.site-footer a:not(.button):not(.wp-block-button__link) {
    color: var(--text-light, #fff);
    text-decoration: none;
    border-bottom: 1px solid var(--accent-pink, #cf0f5a); /* Feine Linie in Akzentfarbe */
    transition: all 0.3s ease;
    padding-bottom: 1px;
}

.entry-content
    a:not(.button):not(.wp-block-button__link):not(.info-button a):not(
        .slide-link
    ):not(.slide-ticket-button):not(.syncevents-card-link):not(
        .syncevents-ticket-button
    ):not([class*='teaser']):not(.light-bg-link):hover,
.site-footer a:not(.button):not(.wp-block-button__link):hover {
    color: var(--text-light, #fff);
    border-bottom-color: var(--accent-pink, #cf0f5a);
    background-color: transparent;
    text-shadow:
        0 0 5px var(--accent-pink, #cf0f5a),
        0 0 15px var(--accent-pink, #cf0f5a); /* Stärkerer Neon Glow */
}

/* ===== LIGHT BACKGROUND LINK STYLING (Overrides) ===== */

/* Fix links in blocks with dark text color */
.entry-content .has-text-dark-color a:not(.button):not(.wp-block-button__link) {
    color: var(--text-dark, #000) !important;
}

.entry-content
    .has-text-dark-color
    a:not(.button):not(.wp-block-button__link):hover {
    text-shadow: 0 0 10px var(--accent-pink, #cf0f5a) !important;
}

/* ===== WP BLOCK BUTTON STYLING (Matching SyncEvents "Mehr" Button) ===== */

/* High specificity to override GeneratePress Customizer settings */
body a.wp-block-button__link:not(.has-background) {
    padding: 12px 30px;
    font-size: 16px;
    border: none;
    background-color: var(--accent-blue, #4d92cf);
    color: var(--text-light, #fff);
    border-radius: 4px;
    cursor: pointer;
    font-weight: bold;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    text-decoration: none;
}

body a.wp-block-button__link:not(.has-background):hover,
body a.wp-block-button__link:not(.has-background):focus-visible {
    background-color: var(--accent-blue, #4d92cf);
    color: var(--text-light, #fff);
    transform: translateY(-3px);
    box-shadow:
        0 4px 8px rgba(0, 0, 0, 0.3),
        inset 0 0 0 100px rgba(0, 0, 0, 0.1);
}

body a.wp-block-button__link:not(.has-background):active {
    background-color: var(--accent-blue, #4d92cf);
    transform: translateY(0);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* ===== TEXTAUSWAHL (User Selection) ===== */
/* Einheitliche Hervorhebung beim Markieren von Text mit der Maus */
::selection {
    background: var(--accent-pink, #cf0f5a);
    color: var(--text-light, #fff);
    text-shadow: none; /* Lesbarkeit sichern */
}
::-moz-selection {
    background: var(--accent-pink, #cf0f5a);
    color: var(--text-light, #fff);
    text-shadow: none;
}

/* ===== FOOTER STYLING ===== */

.site-footer {
    background-color: transparent !important; /* Transparent, damit der Hintergrund durchscheint */
    border-top: none !important;
    margin-top: 40px; /* Abstand zum Content */
}

/* Footer Widgets als "Glass Card" - passend zum Content */
/* Wir nutzen .footer-widgets-container, damit die Box nicht volle Breite hat, sondern wie der Content ist */
.site-footer .footer-widgets-container {
    background-color: color-mix(in srgb, var(--glass-bg) 15%, transparent);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-radius: 8px; /* Abgerundete Ecken */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
    padding: 60px 40px; /* Innenabstand */
    color: var(--text-light, #fff);
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 20px; /* Abstand zum Copyright */
    position: relative;
    z-index: 1;
}

/* Copyright Bereich - Außerhalb der Box */
.site-info {
    background-color: transparent !important; /* Kein Hintergrund */
    color: var(--text-light, #fff);
    text-align: center;
    border-top: none !important;
    margin-top: 0;
    font-size: 14px;
    padding-bottom: 20px;
}

.site-info a {
    color: var(--text-light, #fff);
    text-decoration: none;
    transition: color 0.3s ease;
}

.site-info a:hover {
    color: var(--accent-pink, #cf0f5a);
}

/* Widget Titles */
.site-footer .widget-title {
    color: var(--text-light, #fff);
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 25px;
    text-transform: uppercase;
    letter-spacing: 1px;
    border-bottom: 2px solid var(--accent-pink, #cf0f5a); /* Underline title */
    display: inline-block;
    padding-bottom: 5px;
}

/* Remove border from structural links (like logo if linked) */
.site-footer .footer-logo-link,
.site-footer .custom-logo-link {
    border-bottom: none !important;
}

.site-footer .footer-logo-link:hover,
.site-footer .custom-logo-link:hover {
    text-shadow: none !important;
    background: none !important;
}

/* List Styling in Footer */
.site-footer ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.site-footer li {
    margin-bottom: 10px;
}

/* Address/Contact Info Styling */
.site-footer p {
    margin-bottom: 15px;
    opacity: 0.9;
}

/* Icons in Footer (if any) */
.site-footer .fa,
.site-footer .fas,
.site-footer .far {
    color: var(--accent-pink, #cf0f5a);
    margin-right: 10px;
    width: 20px;
    text-align: center;
}

/* --- Gallery Styles (Custom) --- */

/* 1. Gallery Item Animation & Shape */
/* Target nested images specifically to override core styles */
.wp-block-gallery.has-nested-images figure.wp-block-image {
    border-radius: 8px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    margin-bottom: 0; /* Fix potential double margins */
    background-color: #000; /* Prevent white flashes during animation */
    transform: translateZ(0); /* Hardware acceleration */
    -webkit-backface-visibility: hidden; /* Fix flickering */
    backface-visibility: hidden;
    line-height: 0; /* Remove any vertical spacing reserved for text */
}

/* Ensure image fills container perfectly to avoid gaps */
.wp-block-gallery.has-nested-images figure.wp-block-image img {
    display: block;
    width: 100%;
    height: auto;
}

.wp-block-gallery.has-nested-images figure.wp-block-image:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 14px rgba(0, 0, 0, 0.18);
    z-index: 2; /* Lift above siblings */
}

/* Remove default WP gradient/blur overlay on ::before */
.wp-block-gallery.has-nested-images figure.wp-block-image::before,
.wp-block-gallery.has-nested-images
    figure.wp-block-image:has(figcaption)::before {
    content: none !important;
    display: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* Ensure gallery items are relative for absolute positioning of overlays */
.wp-block-gallery.has-nested-images figure.wp-block-image {
    position: relative;
}

/* Lightbox Overlay Styling */
.wp-lightbox-overlay .image-copyright-overlay {
    position: absolute !important;
    bottom: 0 !important;
    right: 0 !important;
    background-color: rgba(0, 0, 0, 0.75) !important;
    color: var(--text-light, #fff) !important;
    padding: 8px 14px !important;
    font-size: 13px !important;
    line-height: 1.3 !important;
    pointer-events: none !important;
    z-index: 2147483647 !important;
    border-top-left-radius: 6px !important;
    white-space: nowrap !important;
}

/* Ensure lightbox figure/container is positioned relatively */
.wp-lightbox-overlay figure,
.wp-lightbox-overlay .wp-lightbox-container,
.wp-lightbox-overlay .wp-block-image {
    position: relative !important;
    overflow: visible !important;
}

/* Custom Gradient Overlay for items with caption */
.wp-block-gallery.has-nested-images
    figure.wp-block-image:has(figcaption)::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
    pointer-events: none;
    z-index: 1;
}

/* 2. Gallery Captions */
/* Use specific selector including wp-element-caption */
.wp-block-gallery.has-nested-images
    figure.wp-block-image
    figcaption.wp-element-caption {
    font-size: 1em;
    font-weight: 400;
    color: var(--text-light, #fff);
    text-align: left;
    padding: 25px;
    pointer-events: none;
    text-shadow: none;
    z-index: 2;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}

/* 3. Lightbox Background */
/* Target the overlay specifically */
.wp-lightbox-overlay .scrim {
    background-color: color-mix(
        in srgb,
        var(--glass-bg) 75%,
        transparent
    ) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
}

/* 4. Lightbox Close Button */
.wp-lightbox-overlay .close-button {
    fill: #fff !important;
}

.wp-block-details summary {
    font-weight: 400;
    padding-bottom: 10px;
}

.wp-block-details p {
    padding-top: 10px;
    padding-left: 17px;
}

/* ===== GLOBAL CONTACT INFO BLOCKS (Veranstalter & Kontakt) ===== */
/* Nutzung im Editor: Gruppe mit Klasse "contact-info-box" erstellen */

.contact-info-box,
.va-meta-organizer-block {
    margin-top: 1.2em;
    color: var(--text-light, #fff);
    margin-bottom: 1.5em;
}

.contact-info-box:first-child,
.va-meta-organizer-block:first-child,
.va-related-events + .va-meta-organizer-block {
    margin-top: 0;
}

.contact-info-box p,
.va-meta-organizer-block p {
    margin: 0.3em 0;
    line-height: 1.5;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
}

/* Name / Title */
.contact-info-name,
.va-meta-organizer-name {
    font-weight: 600;
    margin-bottom: 0.5em !important;
}

/* Links (Tel, Email, Web) */
.contact-info-link,
.va-meta-organizer-tel,
.va-meta-organizer-email,
.va-meta-organizer-web {
    display: flex;
    align-items: center;
}

.contact-info-link a,
.va-meta-organizer-tel a,
.va-meta-organizer-email a,
.va-meta-organizer-web a {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s ease;
    margin-left: 0; /* Margin handled by gap now, but keeping 0 just in case or small adjust */
    /* border-bottom: none; Removed to restore default underline */
    word-break: break-word;
    overflow-wrap: anywhere;
}

.contact-info-link a:hover,
.va-meta-organizer-tel a:hover,
.va-meta-organizer-email a:hover,
.va-meta-organizer-web a:hover {
    color: var(--accent-blue, #4d92cf);
    background-color: transparent;
    text-shadow: none;
}

/* Icons */
.contact-info-icon,
.va-icon-fixed-width {
    width: 20px;
    text-align: center;
    margin-right: 10px;
    color: var(--accent-blue, #4d92cf);
}

/* ===== BACK BUTTON STYLING ===== */
.back-button-wrapper {
    margin-top: 40px;
    margin-bottom: 20px;
    clear: both;
}

.back-button {
    display: inline-flex;
    align-items: center;
    padding: 8px 20px; /* Etwas kleiner als der Standard-Button */
    font-size: 14px;
    border: none;
    background-color: var(--accent-blue, #4d92cf);
    color: var(
        --text-light,
        #fff
    ) !important; /* Important um Link-Farben zu überschreiben */
    border-radius: 4px;
    cursor: pointer;
    font-weight: bold;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    text-decoration: none;
}

.back-button:hover,
.back-button:focus-visible {
    background-color: var(
        --accent-blue,
        #4d92cf
    ) !important; /* Override theme hover style */
    color: var(--text-light, #fff) !important;
    transform: translateY(-2px);
    box-shadow:
        0 4px 8px rgba(0, 0, 0, 0.3),
        inset 0 0 0 100px rgba(0, 0, 0, 0.1); /* Exakt wie beim Mehr-Button (0.1) */
}

.back-button:active {
    background-color: var(--accent-blue, #4d92cf);
    transform: translateY(0);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.back-button i {
    margin-right: 8px;
}

/* --- Suchergebnisse Optimierung --- */

/* Header-Überlappung korrigieren */
body.search .site-content {
    padding-top: 180px; /* Abstand für den fixierten Header */
}

/* Google-Style Suchergebnisse */
.search-results-list {
    width: 100%;
}

.search-list-item {
    margin-bottom: 15px;
    padding: 15px;
    border-radius: 8px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.search-list-item:hover {
    background-color: rgba(255, 255, 255, 0.05);
    transform: translateY(-3px);
    box-shadow: none; /* Neon-Glow entfernen */
}

.search-item-title {
    margin-bottom: 5px;
}

.search-item-link {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    text-decoration: none;
    color: inherit;
    border-bottom: none !important;
    text-shadow: none !important;
}

/* Search Results Styling with Thumbnails */
.search-item-image {
    flex-shrink: 0;
    width: 120px; /* Fixed width for the thumbnail container */
}

.search-item-image img {
    width: 100%;
    height: auto;
    border-radius: 4px;
    display: block;
    object-fit: cover;
    aspect-ratio: 1/1; /* Force square aspect ratio if desired, or remove for natural */
}

.search-item-content {
    flex-grow: 1;
    min-width: 0; /* Prevents flex child from overflowing */
}

/* Ensure title and summary look good */
.search-item-title {
    margin-top: 0;
    margin-bottom: 0.5em;
}

/* Mobile adjustments */
@media (max-width: 781px) {
    .search-item-link {
        flex-direction: row; /* Keep side-by-side on mobile too, usually looks better for lists */
    }

    .search-item-image {
        width: 80px; /* Smaller on mobile */
    }
}

/* Header-Überlappung korrigieren - nicht mehr nötig wenn im Container */
body.search .site-content {
    padding-top: 0;
}

/* Header-Abstand auf Suchseite analog zu anderen Seiten */
body.search .entry-header {
    padding-top: 80px;
}

/* --- Such-Modal Styling --- */

/* Hintergrund und allgemeines Layout */
.gp-search-modal .gp-modal__overlay {
    background-color: color-mix(in srgb, var(--glass-bg) 60%, transparent);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

/* Container für Suchfeld und Button */
.gp-search-modal .search-modal-fields {
    position: relative;
    max-width: 800px;
    margin: 0 auto;
    display: flex;
    align-items: center;
}

.search-modal-form {
    background: none;
}

/* Suchfeld */
.gp-search-modal input.search-field {
    font-family: 'Fira Sans', sans-serif !important; /* Schriftart anpassen */
    background-color: color-mix(in srgb, var(--glass-bg) 60%, transparent);
    border: 1px solid rgba(255, 255, 255, 0.1) !important; /* Dezenter Rahmen */
    border-radius: 8px !important; /* Abgerundete Ecken (Pill-Shape) */
    color: var(--text-light, #fff) !important;
    font-size: 24px !important;
    font-weight: 400;
    text-align: center;
    padding: 15px 60px 15px 30px !important; /* Rechts mehr Platz für Button */
    transition: all 0.3s ease;
    width: 100%;
    margin: 0;
}

.gp-search-modal input.search-field:focus-visible {
    border-color: #e91e63 !important; /* Akzentfarbe (Pink) */
    box-shadow: 0 0 0 2px rgba(233, 30, 99, 0.2); /* Glow Effekt */
    background-color: color-mix(in srgb, var(--glass-bg) 60%, transparent);
    outline: none !important;
}

/* Such-Button innerhalb des Feldes */
.gp-search-modal .search-modal-fields button {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    padding: 5px;
    transition: color 0.3s ease;
}

.gp-search-modal .search-modal-fields button:hover {
    color: #e91e63;
}

.gp-search-modal .search-modal-fields button svg {
    width: 24px;
    height: 24px;
    fill: currentColor;
}

/* Placeholder Farbe */
.gp-search-modal input.search-field::placeholder {
    color: rgba(255, 255, 255, 0.4);
}

/* Blaues Kreuz (Browser-Standard) entfernen */
.gp-search-modal input[type='search']::-webkit-search-decoration,
.gp-search-modal input[type='search']::-webkit-search-cancel-button,
.gp-search-modal input[type='search']::-webkit-search-results-button,
.gp-search-modal input[type='search']::-webkit-search-results-decoration {
    display: none;
}

/* Schließen-Button */
.gp-search-modal .gp-modal-close {
    color: var(--text-light, #fff) !important;
    opacity: 0.7;
    transition:
        opacity 0.3s ease,
        transform 0.3s ease;
}

.gp-search-modal .gp-modal-close:hover {
    opacity: 1;
    transform: rotate(90deg);
    color: #e91e63 !important;
}

/* Google Map Block Styling */
.wp-block-generatepress-child-google-map {
    margin-bottom: 30px;
}

.wp-block-generatepress-child-google-map iframe {
    border-radius: 8px;
    overflow: hidden;
}

/* ===== YOUTUBE / EMBED STYLING ===== */
.wp-block-embed {
    margin-bottom: 40px; /* Mehr Abstand nach unten */
}

.wp-block-embed__wrapper {
    border-radius: 8px; /* Abgerundete Ecken */
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3); /* Schatten passend zum Glassmorphismus */
    background-color: #000; /* Verhindert weiße Blitzer */
}

.wp-block-embed iframe {
    display: block;
    border-radius: 8px;
}

/* ===== MODERN TABLE STYLING ===== */

/* Responsive Wrapper */
.wp-block-table {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 1.5em;
}

/* Main Table Style */
.wp-block-table table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    border-radius: 8px; /* Abgerundete Ecken für den Container-Effekt */
    overflow: hidden; /* Stellt sicher, dass die abgerundeten Ecken wirken */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    border: none; /* Entfernt den Standard-Rahmen */
}

/* Table Header */
.wp-block-table thead {
    background-color: rgba(
        255,
        255,
        255,
        0.05
    ); /* Leichter Header-Hintergrund */
}

.wp-block-table th {
    padding: 16px 20px;
    text-align: left;
    font-weight: 600;
    color: var(--text-light, #fff);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border: none;
    border-bottom: 1px solid var(--accent-pink, #cf0f5a);
}

/* Table Body Cells */
.wp-block-table td {
    padding: 14px 20px;
    color: rgba(255, 255, 255, 0.85);
    border: none;
    vertical-align: middle; /* Vertikal zentrieren */
}

/* Row Styling */
.wp-block-table tbody tr {
    transition: background-color 0.2s ease-in-out;
}

/* Zebra-Striping für bessere Lesbarkeit */
.wp-block-table tbody tr:nth-child(even) {
    background-color: rgba(255, 255, 255, 0.02);
}

/* Hover Effect */
.wp-block-table tbody tr:hover {
    background-color: rgba(var(--accent-blue-rgb, 77, 146, 207), 0.15);
}

/* Last row no border */
.wp-block-table tbody tr:last-child td {
    border-bottom: none;
}

/* Strong-Tag in Zellen hervorheben */
.wp-block-table td strong {
    font-weight: 600;
    color: var(--text-light, #fff);
}

/* ===== RESPONSIVE TABLES (Card View) ===== */
@media (max-width: 781px) {
    .wp-block-table thead {
        display: none; /* Header ausblenden */
    }

    .wp-block-table table,
    .wp-block-table tbody,
    .wp-block-table tr,
    .wp-block-table td {
        display: block;
        width: 100%;
    }

    .wp-block-table tr {
        margin-bottom: 20px;
        background-color: rgba(255, 255, 255, 0.05);
        border-radius: 8px;
        padding: 15px;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
        border: none;
    }

    .wp-block-table td {
        display: flex;
        justify-content: space-between;
        align-items: center;
        text-align: right;
        padding: 10px 0;
        border: none;
    }

    .wp-block-table td:last-child {
        border-bottom: none;
    }

    /* Label vor dem Inhalt (via JS injected data-label) */
    .wp-block-table td::before {
        content: attr(data-label);
        float: left;
        font-weight: 600;
        text-transform: uppercase;
        font-size: 0.85em;
        color: var(--text-light, #fff);
        margin-right: 15px;
        text-align: left;
    }
}

/* ===== BORLABS COOKIE CONTENT BLOCKER STYLING ===== */
/*
 * Override ALL styles within Borlabs Content Blocker containers.
 * Uses maximum specificity with body prefix and !important.
 */

/* Container - prevent overflow clipping on hover animations */
body .brlbs-cmpnt-content-blocker,
body .brlbs-cmpnt-container.brlbs-cmpnt-content-blocker {
    overflow: visible !important;
}

/* Ensure the preset containers also allow overflow */
body .brlbs-cmpnt-cb-preset-a,
body .brlbs-cmpnt-cb-preset-b,
body .brlbs-cmpnt-cb-preset-c {
    overflow: visible !important;
}

/* Button container - needs extra padding for hover animation */
body .brlbs-cmpnt-content-blocker .brlbs-cmpnt-cb-buttons {
    overflow: visible !important;
    padding-bottom: 8px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
}

/* ===== RESET LINK STYLES - Exclude Buttons ===== */
body
    .entry-content
    .brlbs-cmpnt-content-blocker
    a.brlbs-cmpnt-cb-provider-toggle,
body .brlbs-cmpnt-content-blocker a.brlbs-cmpnt-cb-provider-toggle {
    all: unset !important;
    display: inline-block !important;
    cursor: pointer !important;
    color: #666 !important;
    text-decoration: underline !important;
    font-size: 0.9em !important;
    margin-top: 8px !important;
}

body
    .entry-content
    .brlbs-cmpnt-content-blocker
    a.brlbs-cmpnt-cb-provider-toggle:hover,
body .brlbs-cmpnt-content-blocker a.brlbs-cmpnt-cb-provider-toggle:hover {
    color: #333 !important;
    text-decoration: underline !important;
}

/* ===== BUTTON STYLING - Maximum Specificity ===== */
body .brlbs-cmpnt-content-blocker .brlbs-cmpnt-cb-buttons a.brlbs-cmpnt-cb-btn,
body
    .entry-content
    .brlbs-cmpnt-content-blocker
    .brlbs-cmpnt-cb-buttons
    a.brlbs-cmpnt-cb-btn,
body .brlbs-cmpnt-container .brlbs-cmpnt-cb-buttons a.brlbs-cmpnt-cb-btn {
    all: unset !important;
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    padding: 15px 30px !important;
    border: none !important;
    border-radius: 4px !important;
    text-decoration: none !important;
    font-weight: bold !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    text-align: center !important;
    cursor: pointer !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Primary button (Inhalt entsperren) - Theme Blue */
body
    .brlbs-cmpnt-content-blocker
    .brlbs-cmpnt-cb-buttons
    a.brlbs-cmpnt-cb-btn[data-borlabs-cookie-unblock],
body
    .entry-content
    .brlbs-cmpnt-content-blocker
    .brlbs-cmpnt-cb-buttons
    a.brlbs-cmpnt-cb-btn[data-borlabs-cookie-unblock],
body
    .brlbs-cmpnt-container
    .brlbs-cmpnt-cb-buttons
    a.brlbs-cmpnt-cb-btn[data-borlabs-cookie-unblock] {
    background-color: var(--accent-blue, #4d92cf) !important;
    color: #fff !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}

body
    .brlbs-cmpnt-content-blocker
    .brlbs-cmpnt-cb-buttons
    a.brlbs-cmpnt-cb-btn[data-borlabs-cookie-unblock]:hover,
body
    .entry-content
    .brlbs-cmpnt-content-blocker
    .brlbs-cmpnt-cb-buttons
    a.brlbs-cmpnt-cb-btn[data-borlabs-cookie-unblock]:hover,
body
    .brlbs-cmpnt-container
    .brlbs-cmpnt-cb-buttons
    a.brlbs-cmpnt-cb-btn[data-borlabs-cookie-unblock]:hover {
    background-color: var(--accent-blue, #4d92cf) !important;
    color: #fff !important;
    transform: translateY(-3px) !important;
    box-shadow:
        0 4px 8px rgba(0, 0, 0, 0.3),
        inset 0 0 0 100px rgba(0, 0, 0, 0.1) !important;
}

/* Secondary button (Service akzeptieren) - Theme Pink */
body
    .brlbs-cmpnt-content-blocker
    .brlbs-cmpnt-cb-buttons
    a.brlbs-cmpnt-cb-btn[data-borlabs-cookie-accept-service],
body
    .entry-content
    .brlbs-cmpnt-content-blocker
    .brlbs-cmpnt-cb-buttons
    a.brlbs-cmpnt-cb-btn[data-borlabs-cookie-accept-service],
body
    .brlbs-cmpnt-container
    .brlbs-cmpnt-cb-buttons
    a.brlbs-cmpnt-cb-btn[data-borlabs-cookie-accept-service] {
    background-color: var(--accent-pink, #cf0f5a) !important;
    color: #fff !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}

body
    .brlbs-cmpnt-content-blocker
    .brlbs-cmpnt-cb-buttons
    a.brlbs-cmpnt-cb-btn[data-borlabs-cookie-accept-service]:hover,
body
    .entry-content
    .brlbs-cmpnt-content-blocker
    .brlbs-cmpnt-cb-buttons
    a.brlbs-cmpnt-cb-btn[data-borlabs-cookie-accept-service]:hover,
body
    .brlbs-cmpnt-container
    .brlbs-cmpnt-cb-buttons
    a.brlbs-cmpnt-cb-btn[data-borlabs-cookie-accept-service]:hover {
    background-color: var(--accent-pink, #cf0f5a) !important;
    color: #fff !important;
    transform: translateY(-3px) !important;
    box-shadow:
        0 4px 8px rgba(0, 0, 0, 0.3),
        inset 0 0 0 100px rgba(0, 0, 0, 0.1) !important;
}

/* ===== BORLABS DIALOG BUTTONS (Info-Fenster, Cookie-Dialog) ===== */
body .brlbs-cmpnt-btn,
body button.brlbs-cmpnt-btn {
    padding: 12px 30px !important;
    font-size: 16px !important;
    border: none !important;
    border-radius: 4px !important;
    cursor: pointer !important;
    font-weight: bold !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
    text-decoration: none !important;
}

/* Schließen-Button im Info-Dialog */
body .brlbs-cmpnt-btn.brlbs-cmpnt-btn-close,
body button.brlbs-cmpnt-btn.brlbs-cmpnt-btn-close {
    background-color: var(--accent-blue, #4d92cf) !important;
    color: #fff !important;
}

body .brlbs-cmpnt-btn.brlbs-cmpnt-btn-close:hover,
body button.brlbs-cmpnt-btn.brlbs-cmpnt-btn-close:hover {
    background-color: var(--accent-blue, #4d92cf) !important;
    color: #fff !important;
    transform: translateY(-3px) !important;
    box-shadow:
        0 4px 8px rgba(0, 0, 0, 0.3),
        inset 0 0 0 100px rgba(0, 0, 0, 0.1) !important;
}

/* ===== COOKIE DIALOG BUTTONS ===== */
/* Alle Dialog-Buttons einheitlich: Theme-Blau */
body .brlbs-cmpnt-btn,
body button.brlbs-cmpnt-btn {
    background-color: var(--accent-blue, #4d92cf) !important;
    color: #fff !important;
}

/* Basis-Hover für alle Dialog-Buttons */
body .brlbs-cmpnt-btn:hover,
body button.brlbs-cmpnt-btn:hover {
    background-color: var(--accent-blue, #4d92cf) !important;
    color: #fff !important;
    transform: translateY(-3px) !important;
    box-shadow:
        0 4px 8px rgba(0, 0, 0, 0.3),
        inset 0 0 0 100px rgba(0, 0, 0, 0.1) !important;
}