/* 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;
}

/* ------------------------------------------------------------------ */
/* FIX FÜR UNBEDINGT IDENTISCHE KACHELHÖHEN (ÜBERSCHREIBT JS)         */
/* ------------------------------------------------------------------ */

/* Zwingt die gesamte Zeile des Sliders auf eine einheitliche Höhe */
.slick-track {
  display: flex !important;
  align-items: stretch !important;
  height: auto !important;
}

/* Verhindert, dass Slick die Slides per Inline-Style ungleich hoch berechnet */
.slick-slide {
  height: auto !important;
  display: flex !important;
  align-items: stretch !important;
}

.slick-slide > div {
  display: flex !important;
  align-items: stretch !important;
  width: 100% !important;
  height: 100% !important;
}

.ect-carousel-event {
  display: flex !important;
  width: 100% !important;
  height: 100% !important;
}

/* Basis-Kachel: Streckt sich über die gesamte verfügbare Höhe */
.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;

  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  width: 100% !important;
  align-self: stretch !important;
}

/* Bildbereich fixieren, damit er sich nicht verzerrt */
.ect-carousel-image {
  flex-shrink: 0 !important;
}

/* Text-Bereich: Hier wird die exakte Mindesthöhe definiert.  */
/* Falls dein längster Text noch mehr Platz braucht, erhöhe die '320px' schrittweise. */
.ect-carousel-post-content {
  transform: translateZ(50px);
  flex-grow: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  min-height: 320px !important; 
}

/* Schiebt den Info-/Ticket- und Readmore-Bereich bündig an die Kachelunterkante */
.ect-readmore-cost {
  margin-top: auto !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
}

/* ------------------------------------------------------------------ */
/* ENDE FIX                                                           */
/* ------------------------------------------------------------------ */

/* 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;
}