/* Breadcrumbs global auf der gesamten Website ausblenden */
#breadcrumbs, 
.nectar-breadcrumbs, 
.yoast-breadcrumbs {
    display: none !important;
}


/* Kalender Kacheln anpassen Anfang */
/* Perspektive für echten 3D-Eindruck */
#ect-carousel-wrapper {
  perspective: 1200px;
}
/* Mehr Luft für Hover nach oben */
.slick-list {
  overflow: visible !important;
  padding-top: 20px;
}

.ect-carousel-event {
  padding-top: 10px;
}
/* optional etwas mehr Abstand zwischen Slides */
.slick-list {
  padding-top: 20px;
}

/* Basis-Kachel */
.ect-carousel-event-area {
  position: relative;
  transform-style: preserve-3d;
  transition: transform 0.5s cubic-bezier(.2,.8,.2,1),
              box-shadow 0.5s ease,
              filter 0.4s ease;
  will-change: transform;
}

/* Hover: Kachel hebt ab + leichte Neigung */
.ect-carousel-event:hover .ect-carousel-event-area {
  transform: translateY(-15px) scale(1.04) rotateX(-15deg) rotateY(-6deg);
  box-shadow: 0 25px 60px rgba(0,0,0,0.4);
  filter: brightness(1.1);
  z-index: 10;
}

/* Optional: „Tiefe“ für Bild */
.ect-carousel-img img {
  transition: transform 0.6s ease;
}

.ect-carousel-event:hover .ect-carousel-img img {
  transform: scale(1.08) translateZ(30px);
}

/* Overlay für dunkleren Effekt (damit weiße Schrift besser knallt) */


.ect-carousel-event:hover .ect-carousel-event-area::after {
  background: rgba(0,0,0,0.45);
}

/* ALLE Texte auf weiß beim Hover */
.ect-carousel-event:hover .ect-carousel-post-content,
.ect-carousel-event:hover .ect-carousel-post-content * {
  color: #ffffff !important;
}

/* Links auch weiß */
.ect-carousel-event:hover a {
  color: #ffffff !important;
}

/* Icons ebenfalls */
.ect-carousel-event:hover i {
  color: #ffffff !important;
}

/* Optional: Button/Readmore hervorheben */
.ect-carousel-event:hover .ect-events-read-more {
  border-color: #fff;
  color: #fff !important;
}
/* Text-Schärfe erzwingen */
.ect-carousel-post-content,
.ect-carousel-post-content * {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  backface-visibility: hidden;
  transform: translateZ(0);
}

/* WICHTIG: Text aus der 3D-Ebene „rausziehen“ */
.ect-carousel-post-content {
  transform: translateZ(50px);
}
/* ENDE -----------------------------Kalender Kacheln anpassen Ende */

/* Buttons globa Anpassen-------------------------------------- */
/* Basis-Transition für alle Nectar Buttons */
a.nectar-button {
  transition: transform 2s ease !important,
              box-shadow 2s ease,
              background-color 2s ease;
  will-change: transform;
}

/* Hover Effekt */
a.nectar-button:hover {
  transform: scale(1.08);
  background-color: #9522d8 !important;
  box-shadow: 0 10px 25px rgba(0,0,0,0.25);
}

/* Optional: Icon bewegt sich leicht mit */
/* Basis-Transition für alle Nectar Buttons */
/* Basis-Transition für alle Nectar Buttons */
a.nectar-button {
  transition: transform 2s ease,
              box-shadow 0.25s ease,
              background-color 0.25s ease !important;
  will-change: transform;
}

/* Hover Effekt */
a.nectar-button:hover {
  transform: scale(1.08)!important;
  background-color: #9522d8 !important;
  box-shadow: 0 10px 25px rgba(0,0,0,0.25)!important;
}

/* Optional: Icon bewegt sich leicht mit */
a.nectar-button i {
  transition: transform 2s ease;
}

a.nectar-button:hover i {
  transform: translateX(4px);
}
/*----------------------------------------------------------------------------------------------------*/
/* Local Time Module komplett entfernen */
.espbp-local-time-wrapper, 
.espbp-single-event-local-time,
#espbp-local-time-wrapper,
div[class*="local-time"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}
/* Events Seite anpassen gesamt----------------------------------------------------------------------------------------------------*/
/* 1. Hintergrund und allgemeine Textfarbe für die Liste */
.tribe-events-view--list, 
.tribe-common-l-container, 
.tribe-events-l-container {
    background-color: transparent !important;
    color: #ffffff !important;
}

/* 2. Die einzelnen Veranstaltungs-Karten/Einträge stylen */
.tribe-events-calendar-list__event {
    background-color: rgba(255, 255, 255, 0.03) !important; /* Sehr dezentes Grauweiß */
   
    border-radius: 12px;
    margin-bottom: 25px !important;
    padding: 20px !important;
    transition: background 0.3s ease;
}

.tribe-events-calendar-list__event:hover {
    background-color: rgba(255, 255, 255, 0.07) !important;
}

/* 3. Titel, Daten und Beschreibungen auf Weiß */
.tribe-events-calendar-list__event-title a,
.tribe-events-calendar-list__event-datetime,
.tribe-events-calendar-list__event-description p,
.tribe-common-b2, 
.tribe-common-h3 {
    color: #ffffff !important;
    text-decoration: none !important;
}

/* 4. Den Lade-Indikator (Dots) weiß färben */
.tribe-common-c-loader__dot {
    fill: #ffffff !important;
}

/* 5. Icons (Kalender, Uhr, Ort) in der Liste */
.tribe-common-c-svgicon {
    fill: #ffffff !important;
}

/* 6. Buttons in der Liste (z.B. "Details finden") */
.tribe-common-c-btn-border, 
.tribe-events-c-small-cta__link {
    background-color: transparent !important;
    border: 1px solid #ffffff !important;
    color: #ffffff !important;
    border-radius: 5px !important;
}

.tribe-common-c-btn-border:hover {
    background-color: #ffffff !important;
    color: #000000 !important;
}

/* 7. "Keine Veranstaltungen gefunden" Text */
.tribe-events-view-loader__text {
    color: #dddddd !important;
}
/* Target the container and all spans inside it */
time.tribe-events-calendar-list__event-date-tag-datetime,
time.tribe-events-calendar-list__event-date-tag-datetime span {
    color: #ffffff !important;
    font-size: 1.5em !important;
}
/* Monats-Trenner: Schrift weiß und 50% größer */
time.tribe-events-calendar-list__month-separator-text {
    color: #ffffff !important;
    font-size: 1.5em !important;
}

/* Ticket button -------------------------------------------------------------------------------*/
/* Verwandelt den Link in einen Button */
a.ticket-button-zauber {
    display: inline-block !important;
    background-color: #e6b800 !important;
    color: #000000 !important;
    padding: 10px 22px !important;
    border-radius: 6px !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    transition: transform 0.2s ease !important;
    cursor: pointer !important;
    border: none !important;
}

a.ticket-button-zauber:hover {
    background-color: #ffffff !important;
    transform: scale(1.05);
}
/* Preis in der Listenansicht global weiß färben */
.tribe-events-c-small-cta__price {
    color: #ffffff !important;
}
/* Promo-Bereich/Export-Links am Ende der Liste ausblenden */
.tribe-events-promo, 
.tribe-events-c-promo {
    display: none !important;
}
/*weiter VA seiten anpassen---------------------------------------------------------------------------------------------------------------------------*/
/* --- TAGESANSICHT (DAY VIEW) AN DAS MASTER-DESIGN ANPASSEN --- */

/* 1. Hintergrund & Header-Bereich */
.tribe-events-view--day, 
.tribe-events-view--day .tribe-events-header,
.tribe-events-view--day .tribe-events-c-events-bar {
    background-color: transparent !important;
    color: #ffffff !important;
}

/* 2. Titel in der Tagesansicht: Weiß & 50% größer */
.tribe-events-view--day .tribe-events-calendar-day__event-title a,
.tribe-events-view--day .tribe-events-calendar-day__event-title {
    color: #ffffff !important;
    font-size: 1.5em !important;
    text-decoration: none !important;
}

/* 3. Datum & Zeitangaben in der Tagesansicht: Weiß & 50% größer */
.tribe-events-view--day .tribe-events-calendar-day__event-datetime,
.tribe-events-view--day .tribe-events-calendar-day__event-datetime time {
    color: #ffffff !important;
    font-size: 1.5em !important;
}

/* 4. Die Tages-Überschrift (z.B. "Veranstaltungen für Mai 9") */
.tribe-events-header__content-title .tribe-common-h1,
.tribe-events-view--day .tribe-common-h1 {
    color: #ffffff !important;
    font-size: 1.5em !important;
}

/* 5. Such-Leiste & Lupe weiß färben */
.tribe-events-c-events-bar__search-button-icon-svg path {
    fill: #ffffff !important;
}

.tribe-events-c-search__input {
    color: #ffffff !important;
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid #444 !important;
}

/* 6. "Exportiere iCal" Links am Ende der Tagesansicht ausblenden */
.tribe-events-view--day .tribe-events-c-subscribe-links {
    display: none !important;
}

/* 7. Lade-Indikator Dots auch hier weiß */
.tribe-events-view--day .tribe-common-c-loader__dot {
    fill: #ffffff !important;
}

/* 1. Vorbereitung der Boxen für 3D-Animation */
.row_col_wrap_12_inner .vc_column_container {
    perspective: 1200px !important; /* Gibt Tiefe für die Drehung */
}

.row_col_wrap_12_inner .vc_column-inner {
    transition: transform 0.5s cubic-bezier(0.2, 1, 0.3, 1), box-shadow 0.5s ease !important;
    transform-style: preserve-3d !important;
    will-change: transform;
}

/* 2. Der Hover-Effekt: Schweben + Y-Achsen-Drehung */
.row_col_wrap_12_inner .vc_column_container:hover .vc_column-inner {
    /* translateY(-12px) lässt es schweben, rotateY(6deg) dreht es */
    transform: translateY(-12px) rotateY(6deg) translateZ(20px) !important;
    
    /* Schatten für den Abheb-Effekt */
    box-shadow: 0 25px 50px rgba(0,0,0,0.6) !important;
    
    /* Optional: Falls du den lila Hintergrund beim Hover verstärken willst */
    background-color: rgba(149, 34, 216, 0.15) !important;
}

/* 3. Sicherstellen, dass Icons und Text mitkommen */
.row_col_wrap_12_inner .vc_column-inner .wpb_wrapper {
    transform: translateZ(30px); /* Lässt den Inhalt leicht "vor" der Box schweben */
}
/* 1. Prevent clipping by allowing content to overflow the containers */
.row_col_wrap_12_inner, 
.row_col_wrap_12_inner .vc_column_container {
    overflow: visible !important;
}

/* 2. Add extra space at the top so the box doesn't hit the section above */
.row_col_wrap_12_inner {
    padding-top: 30px !important;
    margin-top: 20px !important;
}

/* 3. Ensure the inner container doesn't clip its own 3D content */
.row_col_wrap_12_inner .vc_column-inner {
    overflow: visible !important;
    backface-visibility: hidden;
}
/* Glassmorphism Design für den Kalender */
.tribe-events-view--month {
    background: rgba(255, 255, 255, 0.1) !important; /* Transparenz */
    backdrop-filter: blur(15px) saturate(150%); /* Der "Iced Glass" Effekt */
    -webkit-backdrop-filter: blur(15px) saturate(150%);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 20px;
    padding: 20px;
    box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.2);
}

/* Einzelne Tage im Kalender anpassen */
.tribe-events-calendar-month__day {
    background-color: transparent !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

/* Event-Karten schöner machen */
.tribe-events-calendar-month__event {
    background: rgba(255, 255, 255, 0.2) !important;
    border-radius: 8px !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    transition: transform 0.2s ease;
}

.tribe-events-calendar-month__event:hover {
    transform: scale(1.03);
    background: rgba(255, 255, 255, 0.3) !important;
}

/* Responsive Optimierung für kleine Bildschirme */
@media (max-width: 768px) {
    .tribe-events-view--month {
        padding: 10px;
        border-radius: 10px;
    }
    
    .tribe-events-calendar-month__header-column {
        font-size: 0.8rem; /* Kürzere Wochentage auf Handy */
    }
}

/* Header & Text-Farben (damit sie auf Glas lesbar sind) */
.tribe-events-calendar-month__day-date, 
.tribe-events-calendar-month__header-column {
    color: #ffffff !important; 
    text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
}