/*
Theme Name: Hello Elementor Child
*/

/* =======================================
   GLOBAL BASICS
======================================= */
:root{
  /* Karten mobil */
  --cp-card-w-mobile: 78%;
  --cp-card-max-mobile: 320px;

  /* Standort-UI */
  --loc-max: 860px;          /* max. Breite der Location-Zeile */
  --loc-pad-x: 8px;          /* horizontales Padding des Wrappers */
  --loc-input-pad-v: 12px;   /* vertikales Padding im Input (für Button-Höhe) */

  /* Farben */
  --btn-bg: var(--e-global-color-d49ac81, #3598DB);
  --btn-fg: #fff;
}





/* ÜBERSCHRIFT AMELIA ANZAHL FREIZEITAKTIVITÄTEN AUSBLENDEN */
.hidden,
.am-els__available { display: none !important; } 



.centerContent { text-align: center; }

html, body { overflow-x: hidden; }
* { box-sizing: border-box; }

/* =======================================
   SHORTCODE-CONTAINER
======================================= */
.comPartnerMainWrap,
#commCreatorWrap{
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

.comPartnerWrap{
  width:100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0;
}

/* =======================================
   STANDORT-UI – EINHEITLICH (Creator & Partner)
   Wrapper: gleiche Breite, Input 100%, Button einheitlich
======================================= */

/* Gleiche Wrapper-Breite für beide Shortcodes (Elementor-Schutz) */
#commCreatorWrap .locationInputWrap,
.comPartnerMainWrap .locationInputWrap{
  position: relative;
  margin: 0 auto 1rem !important;
  padding: 0 var(--loc-pad-x) !important;
  width: 100% !important;
  max-width: var(--loc-max) !important;
}

/* Input: identisch bei beiden */
#commCreatorWrap #location-input,
.comPartnerMainWrap #partner-location-input{
  width: 100%;
  display: block;
  margin: 0 auto;
  padding: var(--loc-input-pad-v) 44px;
  border: none;
  border-radius: 5px;
  box-shadow: 0 0 10px rgba(0,0,0,.5);
  outline: none;
  background: #fff;
  font-family: var(--e-global-typography-44ebb6b-font-family, system-ui, sans-serif);
  font-size: 16px;
  line-height: 1.3;
}

/* Button (Grundstil) – gleiche Optik */
#commCreatorWrap #detect-location,
.comPartnerMainWrap #partner-detect-location{
  border: 0;
  border-radius: 5px;
  padding: 10px 14px;
  cursor: pointer;
  box-shadow: 0 0 10px rgba(0,0,0,.2);
  background: var(--btn-bg);
  color: var(--btn-fg) !important;
  line-height: 1.1;
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  white-space: nowrap;
}

/* Button – Textfarbe konstant */
#commCreatorWrap #detect-location,
#commCreatorWrap #detect-location:hover,
#commCreatorWrap #detect-location:focus,
#commCreatorWrap #detect-location:active,
.comPartnerMainWrap #partner-detect-location,
.comPartnerMainWrap #partner-detect-location:hover,
.comPartnerMainWrap #partner-detect-location:focus,
.comPartnerMainWrap #partner-detect-location:active{
  color:#fff !important;
}

/* Standort-Text (identisch) – wird per JS sichtbar gemacht */
#commCreatorWrap #selected-location,
.comPartnerMainWrap #partner-selected-location{
  display:none;
  margin: 8px 0 12px;
  text-align: center;
  color: var(--e-global-color-secondary);
  font-family: var(--e-global-typography-44ebb6b-font-family, system-ui, sans-serif);
  font-size: var(--e-global-typography-44ebb6b-font-size, 1rem);
  line-height: var(--e-global-typography-44ebb6b-line-height, 1.4);
  font-weight:400;
}
#commCreatorWrap #selected-location p,
.comPartnerMainWrap #partner-selected-location p{
  margin:.2rem 0;
  color: var(--e-global-color-secondary);
}

/* =======================================
   LOCATION-BUTTON FINAL
   - Mobile/Tablet: zwischen Input & Text, mittig
   - Desktop: rechts im Input, vertikal zentriert und gleiche Höhe
======================================= */

/* Mobile & Tablet ≤ 1024px */
@media (max-width:1024px){
  /* Wrapper voll breit und Kinder stretchen */
  #commCreatorWrap .locationInputWrap,
  .comPartnerMainWrap .locationInputWrap{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;           /* WICHTIG: statt center */
  }

  /* Das Feld selbst auf 100% Breite ziehen */
  #commCreatorWrap .locationInputWrap .cod-loc-field,
  .comPartnerMainWrap .locationInputWrap .cod-loc-field{
    width: 100%;
  }

  /* Button mittig unter dem Input lassen */
  #commCreatorWrap #detect-location,
  .comPartnerMainWrap #partner-detect-location{
    position: static !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    margin: .75rem auto 0 !important;
    transform: none !important;
    left: auto !important; right: auto !important; top: auto !important;
    width: auto;
    height: auto;
  }
}


/* Desktop ≥ 1025px – Button OBERHALB des Inputs, mittig */
@media (min-width:1025px){
  #commCreatorWrap .locationInputWrap,
  .comPartnerMainWrap .locationInputWrap{
    display:flex; flex-direction:column;
  }

  /* Reihenfolge: 1) Button, 2) Input */
  #commCreatorWrap .locationInputWrap .btn-row,
  .comPartnerMainWrap .locationInputWrap .btn-row{
    order:1;
    display:flex;
    justify-content:center;
  }
  #commCreatorWrap .locationInputWrap .cod-loc-field,
  .comPartnerMainWrap .locationInputWrap .cod-loc-field{
    order:2;
  }

  /* Button zentriert, nicht absolut positionieren */
  #commCreatorWrap #detect-location,
  .comPartnerMainWrap #partner-detect-location{
    position: static !important;
    transform: none !important;
    margin: 0 auto .75rem !important; /* oben Abstand nach unten */
    height: var(--cod-field-h);
    padding-top: 0; padding-bottom: 0;
    float: none;
  }

  /* Input braucht rechts keinen Extra-Platz */
  #commCreatorWrap #location-input,
  .comPartnerMainWrap #partner-location-input{
    padding-right: 14px;
    padding-left: 44px;
  }
}




/* Tablet-Wrapper etwas schmaler */
@media (min-width:768px) and (max-width:1024px){
  #commCreatorWrap .locationInputWrap,
  .comPartnerMainWrap .locationInputWrap{ width: 100% !important; }
}

/* =======================================
   COMMUNITY CREATORS – ITEMS
======================================= */
#creators-results .partner-item { text-align: center; transition: transform .2s ease; margin: 0 auto; }
#creators-results .partner-item img {
  width: 100%; max-width: 200px; margin: 0 auto 5px; aspect-ratio: 1/1; object-fit: cover;
  border: 4px solid rgb(213,216,218); border-radius: 30px;
}
#creators-results .partner-item.allEvents img { padding: .5rem; background: #fff; }
#creators-results .partner-item.active img { border: 4px solid #FFCD02; }

/* Carousel-Nav (Creators) */
.owl-nav { display: block !important; }
.owl-carousel .owl-nav .owl-next,
.owl-carousel .owl-nav .owl-prev { position: absolute; }
button.owl-prev, button.owl-next { left: auto !important; right: auto !important; }

#creators-results{
  position: relative;
  overflow: visible;
  padding: 0 22px !important;
  --navY: 110px;
  --navInset: 0px;
}
#creators-results .owl-stage-outer{ overflow: hidden !important; }
#creators-results .owl-nav{ display: block !important; z-index: 20; pointer-events:auto; }
#creators-results .owl-nav button{
  position: absolute;
  top: var(--navY) !important;
  transform: translateY(-50%);
  width:56px; height:56px; border:0; border-radius:50%;
  background:transparent !important; line-height:56px; cursor:pointer;
}
#creators-results .owl-nav .owl-prev{ left:  var(--navInset) !important; right:auto !important; }
#creators-results .owl-nav .owl-next{ right: var(--navInset) !important; left:auto !important; }
#creators-results .owl-nav .owl-prev::before,
#creators-results .owl-nav .owl-next::before{
  content:''; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  font-size:64px; line-height:1; color:#4d4d4d; pointer-events:none;
}
#creators-results .owl-nav .owl-prev::before{ content:'‹'; }
#creators-results .owl-nav .owl-next::before{ content:'›'; }
#creators-results .owl-nav button:hover{ background: rgba(0,0,0,.08); }

@media (max-width:767px){
  #creators-results{ --navInset: -18px; padding: 0 18px !important; }
}
@media (min-width:768px) and (max-width:1024px){
  #creators-results{ --navInset: -26px;  padding: 0 24px !important; }
}
@media (min-width:1025px){
  #creators-results{ --navInset:  -20px;  padding: 0 28px !important; }
}

/* Community Creator Texte & Intro */
#commCreatorWrap #selected-location{ margin: 8px 0 12px; text-align: center; }
#commCreatorWrap #selected-location p{ margin: .2rem 0; color: var(--e-global-color-secondary); }
#creators-results .partner-item .creator-title{
  font-family: var(--e-global-typography-dbdb71b-font-family, var(--e-global-typography-44ebb6b-font-family, system-ui, sans-serif));
  font-size:   var(--e-global-typography-dbdb71b-font-size, 1.05rem);
  font-weight: var(--e-global-typography-dbdb71b-font-weight, 700);
  line-height: var(--e-global-typography-dbdb71b-line-height, 1.2);
  margin: .5rem 0 .25rem;
  color: var(--e-global-color-secondary);
  -webkit-hyphens: auto; hyphens: auto; overflow-wrap: break-word; word-break: break-word;
}
#creators-results .partner-item .creator-distance{
  font-size:   var(--e-global-typography-887c3e7-font-size, 1.05rem);
  line-height: var(--e-global-typography-887c3e7-line-height, 1.2);
  margin: .3rem 0 .4rem;
  color: var(--e-global-color-secondary);
}
@media (max-width: 767px){
  #creators-results .partner-item .creator-distance{ line-height: 1.15; }
}
#creators-results .trigger-detect-location,
#creators-results .trigger-detect-location:visited{
  font-size: inherit;
  line-height: inherit;
  color: var(--e-global-color-d49ac81) !important;
  text-decoration: underline;
  font-weight: 600;
}
#creators-results .trigger-detect-location:hover{ text-decoration: underline; }

/* Intro Text oben + gleicher Stil unten */
#creator-intro-text,
.intro-like{
  width: 70%;
  max-width: none;
  margin: 20px auto;
  padding: 0 16px;
  text-align: center;
  color: var(--e-global-color-secondary);
}
#creator-intro-text b, #creator-intro-text strong,
.intro-like b, .intro-like strong{
  color: var(--e-global-color-secondary);
}
@media (max-width:1024px){
  #creator-intro-text,
  .intro-like{ width: 85%; }
}
@media (max-width:767px){
  #creator-intro-text,
  .intro-like{ width: 90%; }
}


#commCreatorWrap :where(p, a, li, span, small, button, input, label):not(.creator-title):not(.creator-distance):not(.trigger-detect-location),
#commCreatorWrap #selected-location,
#commCreatorWrap #creator-intro-text,
#commCreatorWrap #creators-results .partner-item :where(p, a, span):not(.creator-title):not(.creator-distance):not(.trigger-detect-location){
  font-family: var(--e-global-typography-44ebb6b-font-family), Sans-serif;
  font-size: var(--e-global-typography-44ebb6b-font-size);
  line-height: var(--e-global-typography-44ebb6b-line-height);
  font-weight: var(--e-global-typography-44ebb6b-font-weight, 500);
}

/* =======================================
   COMMUNITY PARTNER – KARUSSELL
======================================= */
#com-partner-results{
  position: relative; width:100%; overflow: visible; padding: 0 !important;
  --navY: 230px; --navOutside: 80px;
}
#com-partner-results .owl-stage-outer{
  overflow: hidden !important;
  padding: 0 0 20px 0;
  margin: 0 auto;
}




/* vidjet sicher oben halten */
.partnerImageWrap .vidjetEmbed{ z-index: 9999 !important; }
[id*="vidjet"], [class*="vidjet"]{ z-index: 99999 !important; }

/* Standard von Owl belassen, nur das Bild-Overlay darf „überstehen“ */
#com-partner-results .owl-stage-outer{ overflow: hidden !important; }
#com-partner-results .partner-card{ overflow: visible; }
#com-partner-results .partnerImageWrap{ overflow: visible; }

/* Vidjet sicher oben halten */
.partnerImageWrap .vidjetEmbed{ z-index: 9999 !important; }



/* Karten */
.partner-card.item{
  background:#fff; text-align:center; border-radius:5px;
  box-shadow:0 0 10px rgba(0,0,0,.38);
}
.partner-card.item img{
  display:block; width:100%; height:auto; aspect-ratio: 6/5; object-fit:cover;
  border-top-left-radius:5px; border-top-right-radius:5px;
  opacity:0; transition:opacity .2s ease;
}
.partner-card.item img[src]{ opacity:1; }

.partner-card .partnerContent{ padding:15px; display:flex; flex-direction:column; justify-content:space-between; gap:.5rem; }
.partner-card h4{ font-size:1.3rem; margin:0; }
.partner-card p.partnerRolle{ color:#fb4c95; }

/* Partner-Pfeile */
#com-partner-results .owl-nav{ display:block !important; z-index:20; pointer-events:auto; }
#com-partner-results .owl-nav button{
  position:absolute; top: var(--navY); transform: translateY(-50%);
  width:56px; height:56px; border:0; border-radius:50%; background:transparent !important; line-height:56px; cursor:pointer;
}
#com-partner-results .owl-nav .owl-prev{ left: 0 !important; transform: translate(calc(-1 * var(--navOutside)), -50%); }
#com-partner-results .owl-nav .owl-next{ right: 0 !important; transform: translate(var(--navOutside), -50%); }
#com-partner-results .owl-nav .owl-prev::before,
#com-partner-results .owl-nav .owl-next::before{
  content:''; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  font-size:64px; line-height:1; color:#4d4d4d; pointer-events:none;
}
#com-partner-results .owl-nav .owl-prev::before{ content:'‹'; }
#com-partner-results .owl-nav .owl-next::before{ content:'›'; }
#com-partner-results .owl-nav button:hover{ background: rgba(0,0,0,.08); }

/* Mobil – Partnerkarten mittig */
@media (max-width:767px){
  #com-partner-results{ --navOutside: 12px; --navY: 230px; }
  #com-partner-results .owl-item{ display:flex !important; justify-content:center !important; }

  #com-partner-results .partner-card.item{
    width: var(--cp-card-w-mobile) !important;
    max-width: var(--cp-card-max-mobile) !important;
    margin: 0 auto !important;
    margin-top: 12px !important;
  }
}
@media (min-width:768px) and (max-width:1024px){
  #com-partner-results{ --navOutside: 50px; --navY: 230px; }
}
@media (min-width:1025px){
  #com-partner-results{ --navOutside: 80px; --navY: 230px; }
}

/* =======================================
   SOCIAL ICONS
======================================= */
.partner-card .partnerSMWrap{ display:flex; flex-wrap:wrap; justify-content:center; }
.partner-card .partnerSM{ margin:0; }
.partner-card .partnerSM a{
  display:flex; align-items:center; justify-content:center;
  border-radius:10%; background:#3598DB; text-decoration:none;
  box-shadow:0 0.9vw 1.8vw rgba(0,0,0,.16), 0 0.2vw 0.6vw rgba(0,0,0,.08);
  transition:transform .15s, box-shadow .15s, background .15s, outline-color .15s;
}
.partner-card .partnerSM a svg{ fill:#fff; display:block; flex:0 0 auto; }
.partner-card .partnerSM a:hover{
  background:#2C89CE; transform:translateY(-0.3vw);
  box-shadow:0 1.2vw 2vw rgba(0,0,0,.20), 0 0.3vw 0.8vw rgba(0,0,0,.10);
  outline:0.2vw solid #3598DB; outline-offset:0.2vw;
}

/* Desktop- / Tablet- / Mobile-Größen für Icons */
@media (min-width:1025px){
  .partner-card .partnerSMWrap{ gap:0.8vw; margin-top:1.2vw; }
  .partner-card .partnerSM a{ width:2.0vw; height:2.0vw; }
  .partner-card .partnerSM a svg{ width:1.2vw; height:1.2vw; }
}
@media (min-width:768px) and (max-width:1024px){
  .partner-card .partnerSMWrap{ gap:2.0vw; margin-top:2vw; }
  .partner-card .partnerSM a{ width:5.2vw; height:5.2vw; }
  .partner-card .partnerSM a svg{ width:3.2vw; height:3.2vw; }
}
@media (max-width:767px){
  .partner-card .partnerSMWrap{ gap:3.1vw; margin-top:3vw; }
  .partner-card .partnerSM a{ width:10vw; height:10vw; }
  .partner-card .partnerSM a svg{ width:6vw; height:6vw; }
}

/* harte Farb-Overrides */
#com-partner-results .partner-card .partnerSMWrap .partnerSM a,
#all-partners-grid     .partner-card .partnerSMWrap .partnerSM a{ background:#3598DB !important; }
#com-partner-results .partner-card .partnerSMWrap .partnerSM a svg,
#all-partners-grid     .partner-card .partnerSMWrap .partnerSM a svg{ fill:#fff !important; }



/* TELEGRAM */
.telegram-browser .owl-carousel .owl-stage{ display:flex !important; flex-wrap:nowrap !important; gap:20px; }
.telegram-browser .owl-carousel .owl-item{ min-width:210px !important; }

/* AMELIA (diverse kleine Anpassungen) */
#eventWrap .amelia-v2-booking .am-els__filters-menu__btn-inner{ display:none !important; }
#amelia-container .am-ct__info-spots__number,
#amelia-container .am-ct__info-spots__text{ display:none !important; }
@media (max-width:767px){
  .am-dialog-popup .el-dialog{ margin-top:0 !important; height:100vh !important; }
  .amelia-v2-booking #amelia-container :not(.am-eli).am-dialog-el__main-container{ height:calc(100vh - 228px) !important; }
  .amelia-v2-booking #amelia-container .am-eli.am-dialog-el__main-container{ height:calc(100vh - 168px) !important; }
}
.amelia-v2-booking #amelia-container .am-ec__actions.am-rw-400{ gap:8px; }
.amelia-v2-booking #amelia-container .am-ec__actions-price.am-rw-400 p{ text-align:left; }
#amelia-container .am-congrats__main > span,
#amelia-container .am-congrats__info-item__label{ color:#4D4D4D !important; }
@media (min-width:768px){ .amelia-v2-booking #amelia-container .am-ec__image{ width:126px !important; } }
.amelia-v2-booking #amelia-container .am-gc__display{
  background-size: contain !important; background-position:center !important; background-repeat:no-repeat !important;
  height:auto !important; min-height:300px !important;
}
.amelia-v2-booking #amelia-container .am-gc__bullets{ display:none !important; }
.el-overlay-dialog .el-dialog__headerbtn,
.el-overlay-dialog .el-dialog__headerbtn:hover,
.el-overlay-dialog .el-dialog__headerbtn:focus{ background-color:transparent !important; border:none !important; box-shadow:none !important; padding:.25rem; }
.elementor-kit-104 .el-overlay-dialog .el-dialog__headerbtn{ background-color:transparent !important; }

/* TYPO & Sonstiges */
.moreEventInfosWrap{
  margin-top:2rem;
  font-size:var(--e-global-typography-text-font-size);
  line-height:var(--e-global-typography-text-line-height);
  font-family:var(--e-global-typography-text-font-family), Sans-serif;
}
.cod-title{ text-align:center; }
.word-with-counter{ position:relative; display:inline-block; white-space:nowrap; }
.word-with-counter .booking-counter{
  position:absolute; left:100%; margin-left:.2em; top:.3em; transform:translateY(-35%);
  font-size:.95em; font-weight:600; line-height:1; color: var(--e-global-color-d49ac81);
}

/* Kleine Fixes */
#creators-results .allEvents .creator-distance{ margin-top:-1em; }



/* === Fix: Tablet-Schatten für Location-Input erzwingen (Creator & Partner) === */
#commCreatorWrap .locationInputWrap,
.comPartnerMainWrap .locationInputWrap{
  overflow: visible !important; /* falls ein Parent clippt */
}

#commCreatorWrap .locationInputWrap input,
.comPartnerMainWrap .locationInputWrap input{
  -webkit-appearance: none;
  appearance: none;
  background-clip: padding-box;
  box-shadow: 0 0 10px rgba(0,0,0,.5) !important;  /* Schatten immer an */
  border: none;                                    /* saubere Kante */
}

/* optional: falls Elementor im Tablet gezielt überschreibt, hier noch mal extra */
@media (min-width:768px) and (max-width:1024px){
  #commCreatorWrap .locationInputWrap input,
  .comPartnerMainWrap .locationInputWrap input{
    box-shadow: 0 0 10px rgba(0,0,0,.5) !important;
  }
}


/* ===== Autocomplete-Dropdown: korrekt unter dem Input, klickbar ===== */
#commCreatorWrap .locationInputWrap,
.comPartnerMainWrap .locationInputWrap{
  position: relative !important;   /* Anker für absolute Positionierung */
  overflow: visible !important;
}

#commCreatorWrap #autocomplete-results,
.comPartnerMainWrap #partner-autocomplete-results{
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: calc(100% + 6px) !important; /* UNTER dem Input */
  z-index: 100000 !important;       /* sicher über allem */
  background: #fff;
  border: 1px solid rgba(0,0,0,.15);
  border-radius: 8px;
  box-shadow: 0 8px 22px rgba(0,0,0,.12);
  max-height: 280px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

#commCreatorWrap #autocomplete-results li,
.comPartnerMainWrap #partner-autocomplete-results li{
  padding: 10px 12px;
  cursor: pointer;
}

#commCreatorWrap #autocomplete-results li:hover,
.comPartnerMainWrap #partner-autocomplete-results li:hover{
  background: #f3f6f9;
}


/* gleicher Stil wie oben für den Hinweis unter Amelia */
#eventWrap .intro-like{
  width: 70%;
  max-width: none;
  margin: 20px auto;
  padding: 0 16px;
  text-align: center;
  color: var(--e-global-color-secondary);
}

#eventWrap .intro-like,
#eventWrap .intro-like :where(p, a, li, span, small, strong){
  font-family: var(--e-global-typography-44ebb6b-font-family), Sans-serif;
  font-size: var(--e-global-typography-44ebb6b-font-size);
  line-height: var(--e-global-typography-44ebb6b-line-height);
  font-weight: var(--e-global-typography-44ebb6b-font-weight, 500);
}

#eventWrap .intro-like b,
#eventWrap .intro-like strong{
  color: var(--e-global-color-secondary);
}

@media (max-width:1024px){
  #eventWrap .intro-like{ width: 85%; }
}
@media (max-width:767px){
  #eventWrap .intro-like{ width: 90%; }
}


/* BUTTON STYLING GLEICH WIE ELEMENTOR STANDARD BUTTON*/
/* eigener Button Alle Community Partner anzeigen */
.cod-all-partners-btn{
  display: block;
  width: max-content;
  margin: 20px auto;          /* mittig */
  padding: 10px 20px;
  background: #3598DB;        /* basis wie deine blauen buttons */
  color: #fff;
  font-family: var(--e-global-typography-4778b4e-font-family), Sans-serif;
  font-size: var(--e-global-typography-4778b4e-font-size);
  font-weight: 700;
  border: 1px solid transparent;
  border-radius: 4px;
  box-shadow: 0 0 10px rgba(0,0,0,.2);
  cursor: pointer;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

/* hover nach elementor vorlage */
.cod-all-partners-btn:hover,
.cod-all-partners-btn:focus{
  background-color: var(--e-global-color-d49ac81);
  color: var(--e-global-color-text);
  border-color: var(--e-global-color-d49ac81);
  outline: none;
}

/* optional icon im button */
.cod-all-partners-btn svg{ fill: currentColor; }

/* responsive platzhalter */
@media (max-width:767px){ /* mobile */ }
@media (min-width:768px) and (max-width:1024px){ /* tablet */ }
@media (min-width:1025px){ /* desktop */ }



/*VIDJET VIDEO IN PARTNER PROFIL */
/* overlay für vidjet */
.partner-card{ position:relative; }
.partnerImageWrap{ position:relative; overflow:visible; }
.partnerImageWrap img{ position:relative; z-index:1; display:block; width:100%; height:auto; }
.partnerImageWrap .vidjetEmbed{
  position:absolute; right:10px; bottom:10px;
  width:180px; max-width:45%;
  z-index:9999; pointer-events:auto;
}
.partnerImageWrap .vidjetEmbed iframe{ display:block !important; opacity:1 !important; visibility:visible !important; }
[id*="vidjet"], [class*="vidjet"]{ z-index:100000 !important; }





/* Owl clippt normal, das Bild Overlay darf überstehen */
#com-partner-results .owl-stage-outer{ overflow: hidden !important; }
#com-partner-results .partner-card{ overflow: visible; }
#com-partner-results .partnerImageWrap{ overflow: visible; }

/* Vidjet Badge unten rechts sichtbar und ganz oben */
.partnerImageWrap .vidjetEmbed{ position:absolute; right:10px; bottom:10px; width:180px; max-width:45%; z-index:9999; pointer-events:auto; }
.partnerImageWrap .vidjetEmbed .vidjet-carousel-wrapper{ height:140px !important; }
[id*="vidjet"], [class*="vidjet"]{ z-index:100000 !important; }

/* Portal für großes Video */
.cod-vj-portal{ position:fixed; inset:0; z-index:100000; display:flex; align-items:center; justify-content:center; }
.cod-vj-backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.6); }
.cod-vj-frame{ position:relative; width:min(960px, 92vw); height:min(540px, 58vh); box-shadow:0 20px 60px rgba(0,0,0,.5); border-radius:10px; overflow:hidden; background:#000; }
.cod-vj-frame iframe{ width:100%; height:100%; display:block; border:0; }
.cod-vj-close{ position:absolute; top:6px; right:8px; font-size:28px; line-height:1; background:#fff; border:0; border-radius:8px; padding:2px 10px; cursor:pointer; }
@media (max-width:768px){ .cod-vj-frame{ width:94vw; height:56vh; } }




/* Wenn Vidjet-Overlay offen ist: Owl-Transforms neutralisieren,
   sonst "springen" fixed-Overlays in transformierten Eltern */
body.vj-open #com-partner-results .owl-stage,
body.vj-open #com-partner-results .owl-item{
  transform: none !important;
}
body.vj-open { overflow: hidden; } /* Scroll unter Overlay sperren */

/* Sicherheitsnetz: Vidjet wirklich über allem */
[id*="vidjet"], [class*="vidjet"]{ z-index: 100000 !important; }
.partnerImageWrap .vidjetEmbed{ z-index: 9999 !important; }


/* COMMUNITY CREATOR*/

  :root{
    --cod-text:#4d4d4d;
    --cod-cta:#2b86c5;
    --cod-cta2:#0ea5e9;
    --cod-soft:#eef6ff;
    --cod-blue:#1e90ff;
    --cod-border:rgba(0,0,0,.12);
    --cod-card-bg:#fff;
    --cod-accent:#0a84ff;
    --cod-price-date-color:#2b86c5;
    --cod-shadow-input: 0 4px 10px rgba(0,0,0,.5);
    --cod-shadow-card: 0 8px 20px rgba(0,0,0,.08);
    --cod-badge-desktop: 96px;
    --cod-badge-tablet: 80px;
    --cod-badge-mobile: 55px;
    --cod-field-h: 48px;
    --cod-card-pad-x: 14px;
    --cod-danger:#C13A2B;
    --cod-text-lh: 35px; /* Zeilenhöhe des Textes/Placeholders im Feld */
  }

  /* Icon (bleibt wie bei dir) */
  .cod-loc-field{
    position:relative;
  }
  .cod-loc-field::before{
    content:"";
    position:absolute;
    left:12px;
    top:50%;
    transform:translateY(-50%);
    width:25px;
    height:25px;
    background-color:#4D4D4D;
    -webkit-mask: url("https://communityofdreams.net/wp-content/themes/hello-theme-child-master/assets/svg/location-dot-solid-full.svg") no-repeat center / contain;
    mask: url("https://communityofdreams.net/wp-content/themes/hello-theme-child-master/assets/svg/location-dot-solid-full.svg") no-repeat center / contain;
    pointer-events:none;
  }

  /* placeholder gleich mit ausrichten (sicher für diverse Browser) */
  #location-input::placeholder{
    line-height: var(--cod-text-lh);
  }

  .cod-wrap{
    max-width:1200px;
    margin:0 auto;
    padding:0 28px
  }

  @media (max-width:767px){
    .cod-wrap{
      padding-left:5vw;
      padding-right:5vw;
    }
  }

  /* Location */

  /* Icon im Ortsfeld – 25x25, Farbe #4d4d4d, mit deinem SVG */
  .cod-loc-field{
    position:relative;
  }
  .cod-loc-field::before{
    content:"";
    position:absolute;
    left:12px;
    top:50%;
    transform:translateY(-50%);
    width:25px;
    height:25px;
    background-color:#4D4D4D; /* Farbe des Icons */
    -webkit-mask: url("https://communityofdreams.net/wp-content/themes/hello-theme-child-master/assets/svg/location-dot-solid-full.svg") no-repeat center / contain;
    mask: url("https://communityofdreams.net/wp-content/themes/hello-theme-child-master/assets/svg/location-dot-solid-full.svg") no-repeat center / contain;
    pointer-events:none;
  }

  /* Input selbst ohne Hintergrundbild, mit mehr Platz links fürs Icon
  #location-input{
    background:none !important;
    padding-left:54px;
    padding-top:0;
    padding-bottom:0;
    height:48px;
    line-height:48px;
    display:block;
  } */

  .cod-inner-location{
    display:flex;
    flex-direction:column;
    gap:14px;
    margin:0 ;
    padding:0px 0 60px 0;
    color:var(--cod-text)
  }

  .cod-loc-btnrow{
    display:flex;
    justify-content:center
  }

  .cod-loc-slab{
    position:relative;
    margin:0;
    padding:20px;
  }
  .cod-loc-slab::before{
    content:"";
    position:absolute;
    left:0;
    right:0; /* nicht mehr überstehen */
    top:-2px;
    bottom:-2px;
    background:#fff;
    border-radius:12px;
    pointer-events:none;
    z-index:-1;
  }

  .cod-locbar{
    background:#fff;
    border:1px solid var(--cod-border);
    border-radius:12px;
    /* etwas kräftigerer shadow */
    box-shadow:0 8px 20px rgba(0,0,0,.5);
    padding:16px;
  }

  .cod-btn{
    flex:0 0 auto;
    min-width:240px;
    appearance:none;
    border:0;
    border-radius:8px;
    min-height:56px; /* höher */
    padding:0 22px; /* breiter innenabstand */
    font-size:18px; /* größerer text */
    background:var(--cod-cta);
    color:#fff;
    font-weight:800;
    box-shadow:0 8px 20px rgba(0,0,0,.5); /* deutlicherer shadow */
    cursor:pointer;
    text-decoration:none;
    -webkit-tap-highlight-color:transparent;
  }
  .cod-btn:hover,
  .cod-btn:focus,
  .cod-btn:active,
  .cod-btn:visited{
    background:var(--cod-cta);
    color:#fff;
    box-shadow:0 8px 20px rgba(0,0,0,.5);
    transform:none;
    filter:none;
    outline:none;
  }

  /* ===== Button-State fix: Farbe bleibt identisch bei Hover/Active/Focus ===== */
  /* ===== Button-State: Farbe fix + sanftes Grow ===== */
  #Freizeitaktivitaeten .cod-btn{
    background-color: var(--cod-cta);
    color:#fff;
    box-shadow:0 8px 20px rgba(0,0,0,.5);
    outline:none;
    text-decoration:none;
    -webkit-appearance:none;
    appearance:none;
    -webkit-tap-highlight-color:transparent;
    /* Animation */
    transition: transform .16s ease, box-shadow .16s ease;
    transform: translateZ(0); /* gegen Blurring */
    will-change: transform;
  }

  /* Hover/Focus: leicht wachsen (nur auf Geräten mit Hover) */
  @media (hover:hover){
    #Freizeitaktivitaeten .cod-btn:hover,
    #Freizeitaktivitaeten .cod-btn:focus,
    #Freizeitaktivitaeten .cod-btn:focus-visible{
      background-color: var(--cod-cta) !important;
      color:#fff !important;
      transform: scale(1.03);
      box-shadow:0 10px 24px rgba(0,0,0,.5) !important;
    }
  }

  /* Active/Pressed: minimal „press“ */
  #Freizeitaktivitaeten .cod-btn:active{
    background-color: var(--cod-cta) !important;
    color:#fff !important;
    transform: scale(0.98);
    box-shadow:0 6px 16px rgba(0,0,0,.5) !important;
  }

  /* Firefox Innenrahmen entfernen */
  #Freizeitaktivitaeten .cod-btn::-moz-focus-inner{
    border:0;
  }

  /* Disabled bleibt gleich (keine Farbänderung) */
  #Freizeitaktivitaeten .cod-btn:disabled{
    opacity:1 !important;
    background-color: var(--cod-cta) !important;
    color:#fff !important;
    transform:none !important;
  }

  /* Firefox Innenrahmen entfernen */
  #Freizeitaktivitaeten .cod-btn::-moz-focus-inner {
    border: 0;
  }

  /* selbst wenn disabled: keine Farbänderung */
  #Freizeitaktivitaeten .cod-btn:disabled {
    opacity: 1 !important;
    background-color: var(--cod-cta) !important;
    color: #fff !important;
  }

  @media (max-width:767px){
    /* Button-Reihe: volle Breite, Rand 5% */
    .cod-loc-btnrow{
      padding:0 5vw;
    }
    .cod-loc-btnrow .cod-btn{
      width:100%;
    }
    /* Weißes Panel (hinter Ort + Radius) bis 5% vom Rand */
    .cod-loc-slab{
      padding-left:0;
      padding-right:0;
    }
    .cod-locbar{
      margin:0 ;
    }
  }

  .cod-loc-grid{
    display:grid;
    grid-template-columns: 1fr max-content; /* rechts nur so breit wie nötig */
    gap:12px;
    align-items:center;
  }
  @media (max-width:767px){
    .cod-loc-grid{
      grid-template-columns:1fr;
      align-items:start
    }
  }

  .cod-loc-field{
    position:relative
  }

  .cod-input{
    width:100%;
    min-height:var(--cod-field-h);
    padding:12px 1rem;
    border:1px solid var(--cod-border);
    border-radius:5px;
    font-size:18px;
    box-shadow:var(--cod-shadow-input);
    background:#fff
  }

  /* Ortsfeld: vertikale Zentrierung unabhängig vom .cod-input-Padding */
  #Freizeitaktivitaeten #location-input{
    background:none !important;
    height: var(--cod-field-h); /* 48px */
    line-height: var(--cod-text-lh); /* z.B. 35px */
    padding-top: calc((var(--cod-field-h) - var(--cod-text-lh)) / 2) !important;
    padding-bottom: calc((var(--cod-field-h) - var(--cod-text-lh)) / 2) !important;
    /* horizontal wie gehabt */
    padding-left: 44px;
    padding-right: 14px;
    border: 1px solid var(--cod-border);
    border-radius: 5px;
    box-sizing: border-box;
    display: block; /* kein Flex auf Inputs */
  }

  /* Placeholder ebenfalls mittig */
  #Freizeitaktivitaeten #location-input::placeholder{
    line-height: var(--cod-text-lh);
  }

  .cod-radius-row{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:nowrap
  }
  @media (max-width:767px){
    .cod-radius-row{
      margin-top:6px
    }
  }

  .cod-radius-input{
    width: 4ch; /* Breite anpassen (z.B. 3.5ch–5ch) */
    height: var(--cod-field-h); /* NICHT höher werden */
    padding: 0 .5rem; /* nur seitlich Padding */
    line-height: var(--cod-field-h);
    box-sizing: border-box; /* Breite inkl. Padding/Border */
    text-align: center;
    border: 1px solid var(--cod-border);
    border-radius: 5px;
    box-shadow: var(--cod-shadow-input);
    font-size: 18px;
    -moz-appearance: textfield; /* Firefox: keine Pfeile */
  }

  /* Chrome / Safari: native Pfeile ausblenden */
  #Freizeitaktivitaeten input[type="number"]::-webkit-outer-spin-button,
  #Freizeitaktivitaeten input[type="number"]::-webkit-inner-spin-button{
    -webkit-appearance: none;
    margin: 0;
  }

  /* Einheitlich als Textfeld rendern (auch für WebKit) */
  #Freizeitaktivitaeten input[type="number"]{
    appearance: textfield;
  }

  /* Pfeil-Steuerung neben dem Radius-Feld */
  /* Wrapper jetzt relativ, damit die Pfeile ins Feld positioniert werden */
  .cod-radius-wrapper{
    position: relative;
    display: inline-block;
  }

  /* Pfeile sitzen innerhalb des Inputs, rechts zentriert */
  .cod-radius-controls{
    position:absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    gap: 2px;
    z-index: 1; /* über dem Input */
    pointer-events: auto;
  }

  /* Buttons ohne Rahmen/Shadow – nur die Pfeile (#4d4d4d) */
  .cod-radius-controls button{
    width: 18px;
    height: 14px;
    padding: 0;
    line-height: 1;
    border: 0;
    background: transparent;
    box-shadow: none;
    cursor: pointer;
    color: #4d4d4d; /* Pfeilfarbe */
    font-size: 12px; /* Größe der Pfeile ▲ ▼ */
  }
  .cod-radius-controls button:hover{
    filter: brightness(0.85);
  }
  .cod-radius-controls button:hover{
    background:#f3f6fb;
  }

  .cod-umk{
    white-space:nowrap;
  }

  #autocomplete-results{
    position:absolute;
    left:0;
    top:100%;
    margin-top:6px;
    z-index:400000;
    background:#fff;
    border:1px solid #ccc;
    border-radius:8px;
    display:none;
    box-shadow:var(--cod-shadow-input);
    max-height:260px;
    overflow:auto;
    width:100%
  }
  #autocomplete-results li{
    list-style:none;
    padding:10px 12px;
    cursor:pointer
  }
  #autocomplete-results li:hover{
    background:#f3f6fb
  }

  #Freizeitaktivitaeten input[type="text"]:focus,
  #Freizeitaktivitaeten input[type="number"]:focus,
  #Freizeitaktivitaeten input[type="search"]:focus{
    outline:none !important;
    border-color:var(--cod-border) !important;
    box-shadow:var(--cod-shadow-input) !important;
  }

  /* Creators Karussell */
  .cod-creators-wrap{
    max-width:1200px;
    margin:0 auto 10px auto;
  }

  .cod-creators-intro{
    width:70%;
    margin:12px auto 14px;
    padding:0 16px;
    text-align:center;
    color:var(--e-global-color-secondary);
  }
  @media (max-width:1024px){
    .cod-creators-intro{
      width:85%;
    }
  }
  @media (max-width:767px){
    .cod-creators-intro{
      width:90%;
    }
  }

  #cod-creators-results{
    position:relative;
    overflow:visible;
    padding:0 22px !important;
    --navY:110px;
    --navInset:0px;
    min-height:120px;
  }
  #cod-creators-results .owl-stage-outer{
    overflow:hidden !important;
  }
  #cod-creators-results .owl-nav{
    display:block !important;
    z-index:20;
    pointer-events:auto;
  }
  #cod-creators-results .owl-nav button{
    position:absolute;
    top:var(--navY) !important;
    transform:translateY(-50%);
    width:56px;
    height:56px;
    border:0;
    border-radius:50%;
    background:transparent !important;
    line-height:56px;
    cursor:pointer;
  }
  #cod-creators-results .owl-nav .owl-prev{
    left:var(--navInset) !important;
    right:auto !important;
  }
  #cod-creators-results .owl-nav .owl-next{
    right:var(--navInset) !important;
    left:auto !important;
  }
  #cod-creators-results .owl-nav .owl-prev::before,
  #cod-creators-results .owl-nav .owl-next::before{
    content:'';
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%, -50%);
    font-size:64px;
    line-height:1;
    color:#4d4d4d;
    pointer-events:none;
  }
  #cod-creators-results .owl-nav .owl-prev::before{
    content:'‹';
  }
  #cod-creators-results .owl-nav .owl-next::before{
    content:'›';
  }
  #cod-creators-results .owl-nav button:hover{
    background: rgba(0,0,0,.08);
  }

  @media (max-width:767px){
    /* keine Innenabstände im Karussell-Container */
    #cod-creators-results{
      padding:0 !important;
    }

    /* Pfeile leicht außerhalb des Carousels platzieren */
    #cod-creators-results .owl-nav {
      display:block !important;
    }
    #cod-creators-results .owl-nav .owl-prev{
      left: calc(-5vw - 20px) !important;
      transform: translateY(-50%) !important;
    }
    #cod-creators-results .owl-nav .owl-next{
      right: calc(-5vw - 20px) !important;
      transform: translateY(-50%) !important;
    }

    /* Location-Panel über die 5vw-Ränder hinausziehen */
    .cod-loc-slab{
      margin-left:-5vw;
      margin-right:-5vw;
    }
    /* Weißer Hintergrund dann bündig bis zum Rand */
    .cod-loc-slab::before{
      left:0;
      right:0;
    }

    /* Pfeile etwas kompakter */
    #cod-creators-results .owl-nav button{
      width:44px;
      height:44px;
    }
  }

  @media (min-width:768px) and (max-width:1024px){
    /* Location-Slab über volle Breite ziehen */
    .cod-loc-slab {
      margin-left: -26px;
      margin-right: -26px;
    }
    .cod-loc-slab::before {
      left: 0;
      right: 0;
    }
  }

  @media (min-width:768px) and (max-width:1024px){
    #cod-creators-results{
      --navInset:-46px; /* Pfeile wieder 20px weiter nach außen */
      padding:0 24px !important;
    }

    .cod-loc-slab {
      margin-left: -55px;
      margin-right: -55px;
    }
    .cod-loc-slab::before {
      left: 0;
      right: 0;
    }
  }

  /* Desktop: Pfeile wieder nach außen */
  @media (min-width:1025px){
    #cod-creators-results{
      --navInset:-46px; /* bei Bedarf -50px oder -56px testen */
      padding:0 28px !important; /* dein bisheriger Desktop-Innenabstand */
    }
  }

  .cod-creator-item{
    text-align:center;
    transition:transform .2s ease;
    margin:0 auto;
  }


  .cod-creator-item img{
    width:100%;
    max-width:200px;
    margin:0 auto 5px;
    aspect-ratio:1/1;
    object-fit:cover;
    border:4px solid rgb(213,216,218);
    border-radius:30px; /* standard für desktop */
  }



  /* mobile kleiner radius */
  @media (max-width:767px){
    .cod-creator-item img{
      border-radius:22px;
    }
  }

/* Basis (falls ein Breakpoint mal nicht greift) */
#cod-creators-results .cod-creator-item img{
  box-sizing: border-box;
  border:4px solid rgb(213,216,218);
}
#cod-creators-results .cod-creator-item.active img{
  border-color:#FFCD02;
}

/* Handy (0–767px) */
@media (max-width:767px){
  #cod-creators-results .cod-creator-item img{ border-width:4px; }
  #cod-creators-results .cod-creator-item.active img{ border-width:4px; }
}

/* Tablet (768–1024px) */
@media (min-width:768px) and (max-width:1024px){
  #cod-creators-results .cod-creator-item img{ border-width:5px; }
  #cod-creators-results .cod-creator-item.active img{ border-width:6px; }
}

/* Desktop (ab 1025px) */
@media (min-width:1025px){
  #cod-creators-results .cod-creator-item img{ border-width:6px; }
  #cod-creitors-results .cod-creator-item.active img{ border-width:8px; }
}




  .cod-creator-item.cod-all img{
    padding:.5rem;
    background:#fff;
  }

  .cod-creator-item .creator-title{
    font-family: var(--e-global-typography-dbdb71b-font-family, var(--e-global-typography-44ebb6b-font-family, system-ui, sans-serif));
    font-size: var(--e-global-typography-dbdb71b-font-size, 1.05rem);
    font-weight: var(--e-global-typography-dbdb71b-font-weight, 700);
    line-height: var(--e-global-typography-dbdb71b-line-height, 1.2);
    margin:.5rem 0 .25rem;
    color:var(--e-global-color-secondary);
    -webkit-hyphens:auto;
    hyphens:auto;
    overflow-wrap:break-word;
    word-break:break-word;
  }
  .cod-creator-item .creator-distance{
    font-size: var(--e-global-typography-887c3e7-font-size, 1.05rem);
    line-height: var(--e-global-typography-887c3e7-line-height, 1.2);
    margin:.3rem 0 .4rem;
    color:var(--e-global-color-secondary);
  }
  .cod-trigger-detect-location{
    color:var(--e-global-color-d49ac81) !important;
    text-decoration:underline;
    font-weight:600;
  }

  /* Suche und Events */
  .cod-inner-events{
    display:flex;
    flex-direction:column;
    gap:14px;
    color:var(--cod-text)
  }

  .cod-area{
    position:relative
  }
  .cod-area::before{
    content:"";
    position:absolute;
    left:-20px;
    right:-20px;
    top:-20px;
    bottom:-20px;
    background:#fff;
    border-radius:12px;
    box-shadow:var(--cod-shadow-input);
    pointer-events:none
  }

  /* Zähler Zeile über der Suche */
  .cod-field-caption{
    margin:0 0 6px 0;
    color:var(--e-global-color-secondary);
    font-weight:600;
  }
  .cod-field-caption .cod-caption-count{
    font-weight:800;
  }

  /* Suche grid */
  .cod-search-wrap{
    position:relative;
    margin-bottom:14px;
    z-index:1;
  }
  .cod-search-grid{
    display:grid;
    grid-template-columns: 1fr auto;
    gap:12px;
    align-items:center;
  }
  .cod-search-box{
    position:relative;
  }
  .cod-search-box .ico{
    position:absolute;
    left:16px;
    top:50%;
    transform:translateY(-50%);
    width:24px;
    height:24px;
    opacity:.65;
    pointer-events:none;
    z-index:1;
  }
  .cod-search{
    width:100%;
    min-height:var(--cod-field-h);
    padding:12px 14px 12px 1rem;
    border:1px solid var(--cod-border);
    border-radius:10px;
    font-size:18px;
    background:#fff;
    box-shadow:var(--cod-shadow-input)
  }
  @media (min-width:768px){
    #Freizeitaktivitaeten input.cod-search[type="search"]{
      padding-left:45px !important;
    }
  }

  .cod-search-actions{
    display:flex;
    gap:10px;
    align-items:center;
  }

  .cod-calendar-btn,
  .cod-clear-btn{
    height:var(--cod-field-h);
    display:inline-flex;
    align-items:center;
    gap:10px;
    border:1px solid var(--cod-border);
    border-radius:10px;
    box-shadow:var(--cod-shadow-input);
    padding:0 14px;
    color:#fff;
    font-weight:700;
    cursor:pointer;
    background:var(--cod-cta);
  }
  .cod-calendar-btn img,
  .cod-clear-btn img{
    width:30px;
    height:30px;
    display:block;
    filter:brightness(0) invert(1);
  }
  .cod-calendar-btn .lbl{
    white-space:nowrap
  }

  /* Müllkübel mittig und kompakt */
  #Freizeitaktivitaeten .cod-clear-btn{
    background:var(--cod-danger) !important;
    padding:0 !important;
    width:var(--cod-field-h);
    min-width:var(--cod-field-h);
    height:var(--cod-field-h);
    display:flex;
    align-items:center;
    justify-content:center;
    line-height:0;
  }
  #Freizeitaktivitaeten .cod-clear-btn img{
    width:22px;
    height:22px;
    display:block;
    filter:brightness(0) invert(1);
  }
  #Freizeitaktivitaeten .cod-clear-btn:hover,
  #Freizeitaktivitaeten .cod-clear-btn:focus{
    background:var(--cod-danger) !important;
    color:#fff !important;
  }

  /* Popover */
  .cod-date-popover{
    position:absolute;
    right:0;
    top:calc(100% + 8px);
    z-index:10001;
    width:340px;
    padding:12px;
    background:#fff;
    border:1px solid var(--cod-border);
    border-radius:10px;
    box-shadow:var(--cod-shadow-input);
    display:none
  }
  .cod-date-popover.open{
    display:block
  }
  .cod-date-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:10px
  }

  /* === Date-Inputs: nur EIN Kalender-Icon === */
  .cod-date-popover .date-field{
    position:relative;
  }

  /* input selbst: kein background icon, nur platz fürs icon rechts */
  .cod-date-popover .date-field input[type="date"]{
    width:100%;
    min-height:48px;
    padding:10px 44px 10px 12px; /* rechts platz für unser icon */
    border:1px solid var(--cod-border);
    border-radius:8px;
    font-size:16px;
    box-shadow:var(--cod-shadow-input);
    text-align:left;
    background:none; /* wichtig: kein zweites icon */
    -webkit-appearance:none;
    appearance:none;
  }

  /* unser einziges icon rechts */
  .cod-date-popover .date-field::after{
    content:"";
    position:absolute;
    right:10px;
    top:50%;
    transform:translateY(-50%);
    width:20px;
    height:20px;
    background-color:#4d4d4d;
    -webkit-mask:url("https://communityofdreams.net/wp-content/themes/hello-theme-child-master/assets/svg/calendar-days-solid-full.svg") no-repeat center/contain;
    mask:url("https://communityofdreams.net/wp-content/themes/hello-theme-child-master/assets/svg/calendar-days-solid-full.svg") no-repeat center/contain;
    pointer-events:none;
  }

  /* chrome edge safari: natives picker icon komplett ausblenden */
  .cod-date-popover .date-field input[type="date"]::-webkit-calendar-picker-indicator{
    opacity:0 !important;
    display:none !important;
  }

  /* ios sonderfall: picker klickbar lassen, aber unsichtbar
  @supports (-webkit-touch-callout: none){
    .cod-date-popover .date-field input[type="date"]{
      -webkit-appearance: menulist;
      appearance:auto;
      background:none;
    }
    .cod-date-popover .date-field input[type="date"]::-webkit-calendar-picker-indicator{
      opacity:0 !important;
      display:block !important;
      position:absolute;
      right:0;
      top:0;
      width:44px;
      height:100%;
      cursor:pointer;
    }
  }*/

  /* du hast unten schon tablet und mobile höhen angepasst – die bleiben bestehen */

  /* Unser einziges Icon (per Mask, dadurch frei einfärbbar) */
  /* === Date-Inputs: EIN Icon (#4d4d4d) + iOS-kompatibel === */
  .cod-date-popover .date-field::after{
    content:"";
    position:absolute;
    right:10px;
    top:50%;
    transform:translateY(-50%);
    width:20px;
    height:20px;
    background-color:#4d4d4d;
    -webkit-mask:url("https://communityofdreams.net/wp-content/themes/hello-theme-child-master/assets/svg/calendar-days-solid-full.svg") no-repeat center/contain;
    mask:url("https://communityofdreams.net/wp-content/themes/hello-theme-child-master/assets/svg/calendar-days-solid-full.svg") no-repeat center/contain;
    pointer-events:none; /* blockiert keine Klicks */
  }

  /* iPhone/iPad: native Picker aktiv lassen */
  @supports (-webkit-touch-callout: none) {
    .cod-date-popover .date-field input[type="date"]{
      -webkit-appearance: menulist; /* iOS-Picker wieder aktiv */
      appearance: auto;
      background:none;
    }
    .cod-date-popover .date-field input[type="date"]::-webkit-calendar-picker-indicator{
      opacity:0;
      display:block;
      position:absolute;
      right:0;
      top:0;
      width:44px;
      height:100%; /* große Hit-Area für Finger */
      cursor:pointer;
    }
  }

  /* Tablet: niedriger machen */
  @media (max-width:1024px){
    .cod-date-popover .date-field input[type="date"]{
      min-height:50px;
      font-size:17px;
      padding:10px 46px 10px 14px;
    }
  }

  /* Mobile: noch niedriger + Popover-Breite */
  @media (max-width:767px){
    .cod-date-popover{
      left:50%;
      right:auto;
      transform:translateX(-50%);
      width:calc(100vw - 32px);
      max-width:480px;
    }
    .cod-date-popover .date-field input[type="date"]{
      min-height:46px;
      font-size:16px;
      padding:9px 48px 9px 14px;
    }
    .cod-date-popover .date-field::after{
      width:22px;
      height:22px;
    }
  }

  .cod-presets{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin:0 0 15px 0
  }
  .cod-preset{
    appearance:none;
    border:0;
    border-radius:999px;
    padding:6px 10px;
    background:#51B36F;
    color:#fff;
    font-weight:700;
    font-size:13px;
    cursor:pointer
  }
  .cod-date-actions{
    display:flex;
    gap:8px;
    justify-content:flex-end;
    margin-top:8px
  }
  .cod-date-apply,
  .cod-date-clear{
    appearance:none;
    border:0;
    border-radius:8px;
    padding:10px 14px;
    font-weight:700;
    cursor:pointer;
    box-shadow:var(--cod-shadow-input)
  }
  .cod-date-apply{
    background:var(--cod-cta);
    color:#fff
  }
  .cod-date-clear{
    background:var(--cod-soft)
  }

  /* Karten */
  .cod-card{
    position:relative;
    background:var(--cod-card-bg);
    border:1px solid var(--cod-border);
    border-radius:14px;
    padding:12px var(--cod-card-pad-x) 14px 14px;
    box-shadow:var(--cod-shadow-card);
    overflow:hidden;
    margin-bottom:20px
  }
  .cod-leftbar{
    position:relative;
    left:0;
    top:0;
    bottom:auto;
    width:8px;
    background:var(--cod-blue);
    border-radius:12px
  }
  .cod-bottombar{
    display:none;
    height:8px;
    background:var(--cod-blue);
    border-radius:8px;
    margin-top:10px
  }
  .cod-date{
    position:relative;
    display:flex;
    align-items:center;
    gap:10px;
    margin:0 84px 10px 22px;
    font-weight:700;
    font-size:14px;
    color:var(--cod-accent)
  }
  .cod-date .row{
    display:flex;
    gap:8px;
    flex-wrap:wrap
  }
  .cod-date .t .end::before{
    content:" - ";
  }
  .cod-date .cod-badge{
    position:absolute;
    top:0;
    right:-23px;
    cursor:pointer;
  }
  .cod-date .cod-price-chip{
    position:absolute;
    top:-5px;
    right:calc(var(--cod-badge-mobile) + 5px);
  }

  .cod-price-chip{
    background:var(--cod-soft);
    padding:5px 10px;
    border-radius:999px;
    font-weight:700;
    font-size:14px;
    color:var(--cod-cta);
  }

  .cod-badge{
    width:var(--cod-badge-desktop);
    height:var(--cod-badge-desktop);
    border:2px solid #FFCD02;
    border-radius:14px;
    overflow:hidden;
    background:#fff;
    box-shadow:var(--cod-shadow-input)
  }
  .cod-badge img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center
  }

  .cod-media{
    position:relative;
    border-radius:10px;
    overflow:hidden;
    margin-left:22px;
    width:calc(100% - 22px)
  }
  .cod-media::before{
    content:"";
    display:block;
    padding-top:70%
  }
  .cod-media img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center top
  }

  .cod-card h3.cod-title{
    font-size:14px !important;
    line-height:1.25 !important;
    font-weight:700 !important;
    margin:10px 0 6px 22px;
    color:var(--cod-text);
    text-align:left;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:3;
    overflow:hidden;
    text-overflow:ellipsis;
    max-height:calc(1.25em * 3);
    text-transform:none !important;
  }

  .cod-place,
  .cod-dist{
    font-size:16px !important;
    line-height:1.35 !important
  }
  .cod-info-line{
    display:block
  }
  .cod-place{
    display:block;
    margin:3px 0 2px -0px
  }
  .cod-dist{
    display:block;
    margin:0 0 10px -0px
  }

  .cod-actions{
    display:flex;
    flex-wrap:nowrap;
    gap:12px;
    z-index:3;
    margin-left:22px;
    justify-content:flex-end;
    padding-right:var(--cod-card-pad-x)
  }

  .cod-cta,
  .cod-cta.secondary{
    appearance:none;
    border:0;
    border-radius:5px;
    padding:12px 16px;
    color:#fff !important;
    font-weight:700;
    text-decoration:none;
    font-size:14px;
    white-space:nowrap;
    box-shadow:var(--cod-shadow-input)
  }
  .cod-cta{
    background:var(--cod-cta)
  }
  .cod-cta.secondary{
    background:var(--cod-cta2)
  }
  .cod-cta span{
    display:inline-block;
    line-height:1
  }

  @media (max-width:767px){
    .cod-leftbar{
      display:none
    }
    .cod-bottombar{
      display:block
    }

    .cod-search-box .ico{
      display:none;
    }
    .cod-search-grid{
      grid-template-columns: 1fr auto;
    }
    .cod-search-wrap.has-date .cod-search-grid{
      grid-template-columns: 1fr;
    }
    .cod-search-wrap.has-date .cod-search-actions{
      margin-top:8px;
    }
    .cod-calendar-btn .lbl{
      display:none;
    }
    .cod-search-wrap.has-date .cod-calendar-btn .lbl{
      display:inline;
    }

    .cod-card{
      position:relative;
    }
    .cod-card .cod-badge{
      position:absolute !important;
      top:5px;
      right:12px;
      width:var(--cod-badge-mobile);
      height:var(--cod-badge-mobile);
      margin:0;
      z-index:10;
    }
    .cod-date .cod-price-chip{
      right: calc(var(--cod-badge-mobile) + 11px) !important;
    }

    .cod-media{
      margin:5px 0 0 0;
      width:100%;
    }

    .cod-date{
      margin:0 0 8px 0;
      --cod-date-lh: 20px;
      --cod-date-gap: 6px;
    }
    .cod-date,
    .cod-date .row,
    .cod-date .t,
    .cod-date .only-date,
    .cod-date .only-time,
    .cod-date .start,
    .cod-date .end{
      line-height: var(--cod-date-lh) !important;
    }
    .cod-date .row{
      display:flex;
      flex-direction:column;
      gap:var(--cod-date-gap);
    }
    .cod-date .only-date{
      display:block;
      margin:0;
    }
    .cod-date .only-time{
      display:block;
      margin:0;
    }
    .cod-date .t{
      position:relative;
      display:flex;
      flex-direction:column;
      gap:var(--cod-date-gap);
    }
    .cod-date .t .start,
    .cod-date .t .end{
      display:block;
      margin:0;
    }
    .cod-date .t .end::before{
      content:"";
    }
    .cod-date .t::after{
      content:"";
      position:absolute;
      left:50%;
      top: calc(var(--cod-date-lh) + (var(--cod-date-gap) / 2));
      transform: translate(-50%, -50%);
      width:15%;
      height:2px;
      background: var(--cod-accent);
      border-radius:2px;
      pointer-events:none;
    }

    .cod-card h3.cod-title,
    .cod-place,
    .cod-dist,
    .cod-actions{
      margin-left:0;
    }

    .cod-actions{
      display:flex;
      gap:10px;
      padding:0 0;
      justify-content:flex-start;
      flex-wrap:nowrap;
    }

    .cod-price-chip{
      font-size:14px;
    }
  }

  @media (min-width:768px) and (max-width:1024px){
    .cod-card{
      position:relative;
      padding-bottom:20px;
    }

    .cod-row{
      display:grid;
      grid-template-columns: 18px 180px 1fr 240px;
      grid-template-rows: auto 1fr auto auto;
      grid-column-gap:20px;
      align-items:start;
    }

    .cod-media{
      grid-column:2/3;
      grid-row:2/4;
      margin:0;
      width:100%;
      transform:translateX(-23px);
      align-self:stretch;
    }

    .cod-date{
      grid-column:2/5;
      grid-row:1/2;
      margin:0 0 8px 0;
      gap:14px;
      font-size:18px;
      color:#4d4d4d;
      transform:translateX(-23px);
      position:static !important;
    }
    .cod-card .cod-price-chip{
      position:absolute !important;
      top:7px !important;
      right:12px !important;
      z-index:5;
      font-size:18px !important;
    }

    .cod-card h3.cod-title{
      grid-column:3/5;
      grid-row:2/3;
      margin:0 0 10px 0;
      margin-left:-20px !important;
      font-size:18px !important;
      max-width:none !important;
      padding-right:140px;
      display:-webkit-box;
      -webkit-box-orient:vertical;
      -webkit-line-clamp:2;
      overflow:hidden;
    }

    .cod-info-line{
      grid-column:3/4;
      grid-row:3/4;
      display:flex;
      flex-direction:column;
      gap:6px;
      align-self:end;
      margin-left:-20px !important;
      transform:translateY(14px);
    }
    .cod-place,
    .cod-dist{
      margin-left:0 !important;
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
    }

    .cod-actions{
      grid-column:2/5;
      grid-row:4/5;
      display:flex;
      gap:12px;
      align-items:center;
      justify-content:flex-start;
      align-self:end;
      margin:16px 0 -3px 0 !important;
      padding-right:calc(var(--cod-badge-tablet) + 16px);
      transform:translateX(-23px);
    }

    .cod-card .cod-badge{
      position:absolute !important;
      right:12px;
      bottom:12px;
      width:var(--cod-badge-tablet);
      height:var(--cod-badge-tablet);
      margin:0;
      z-index:3;
    }
    .cod-date .cod-badge{
      position:static !important;
    }
  }

  @media (min-width:1025px){
    .cod-card{
      padding:12px var(--cod-card-pad-x) 14px 14px
    }

    .cod-row{
      display:grid;
      grid-template-columns: 18px 190px 1fr 260px;
      grid-template-rows: auto 1fr auto;
      grid-column-gap:20px;
      align-items:start;
    }

    .cod-media{
      grid-column:2/3;
      grid-row:2/4;
      margin:0;
      width:100%;
      transform:translateX(-23px);
      align-self:stretch;
    }

    .cod-date{
      grid-column:2/5;
      grid-row:1/2;
      margin:0 0 8px 0;
      gap:16px;
      font-size:20px;
      color:#4d4d4d;
      transform:translateX(-23px)
    }
    .cod-date .row .only-date{
      display:inline !important;
      margin-right:8px;
    }
    .cod-date .row .only-time{
      display:inline !important;
    }

    .cod-card h3.cod-title{
      grid-column:3/5;
      grid-row:2/3;
      margin:0 0 12px 0;
      max-width:calc(100% - 260px);
      align-self:start;
      margin-left:-20px !important;
      font-size:20px !important;
    }

    .cod-price-chip{
      font-size:20px !important;
    }
    .cod-date .cod-price-chip{
      right: calc(var(--cod-badge-mobile) + 35px) !important;
    }

    .cod-info-line{
      grid-column:3/4;
      grid-row:3/4;
      margin-left:0 !important;
      transform:translateX(-20px);
    }

    .cod-actions{
      grid-column:4/5;
      grid-row:3/4;
      justify-content:flex-end;
      align-items:center;
      align-self:end;
      padding-right:0;
    }
  }

  @media (min-width:1025px) and (max-width:1240px){
    .cod-card .cod-badge{
      position:absolute !important;
      right:12px;
      bottom:12px;
      width:var(--cod-badge-tablet);
      height:var(--cod-badge-tablet);
      margin:0;
      z-index:3;
    }
    .cod-date .cod-badge{
      position:static !important;
    }
    .cod-actions{
      padding-right: calc(var(--cod-badge-tablet) + 16px);
    }
    .cod-card h3.cod-title{
      padding-right: calc(var(--cod-badge-tablet) + 28px);
    }
  }

  /* === Load More Button === */
  .cod-load-more-wrap{
    display:flex;
    justify-content:center;
    align-items:center;
    padding:10px 0 22px;
    position:relative;
    z-index:1;
    display:flex !important;
    opacity:1 !important;
    visibility:visible !important;
  }
  .cod-load-more{
    appearance:none;
    border:0;
    border-radius:999px;
    padding:12px 22px;
    font-weight:800;
    font-size:16px;
    cursor:pointer;
    background:var(--e-global-color-d7d34cf) !important;
    color:#fff !important;
    box-shadow:0 8px 20px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.25);
    transition:transform .05s ease, box-shadow .15s ease, filter .15s ease;
    display:inline-flex;
    align-items:center;
    gap:10px;
  }
  .cod-load-more:hover{
    filter:brightness(1.05);
  }
  .cod-load-more:active{
    transform:translateY(1px);
    box-shadow:0 6px 14px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.2);
  }

  /* ==== Radiusfeld fix: überall schmal halten ==== */
  /* Zweite Spalte soll nur so breit wie der Inhalt sein */
  .cod-loc-grid{
    grid-template-columns: 1fr auto !important;
  }
  /* Labels nicht umbrechen */
  .cod-umk,
  .cod-km {
    white-space: nowrap;
  }
  /* Das Number-Feld wirklich schmal machen */
  .cod-radius-row .cod-radius-input,
  #codRadius {
    width: 8.5ch !important; /* Breite: ca. 4 Ziffern */
    max-width: 8.5ch !important; /* Sicherheitsgrenze */
    flex: 0 0 auto !important; /* Flex darf es nicht strecken */
    box-sizing: border-box;
    height: var(--cod-field-h); /* gleiche Höhe wie Ort */
    line-height: var(--cod-field-h);
    padding: 0 .5rem; /* nur seitlich etwas Luft */
    padding-right: 34px;
  }
  /* Falls irgendein Globalstil number-Inputs auf 100% setzt, neutralisieren */
  .cod-loc-grid input[type="number"]{
    width: auto !important;
  }

  /* === Mobile: Ort oben, Radius-Zeile darunter === */
  @media (max-width: 767px){
    .cod-loc-grid{
      grid-template-columns: 1fr !important; /* wieder einspaltig */
      align-items: start;
    }
    .cod-radius-row{
      margin-top: 6px;
      justify-content: flex-start;
    }
  }
  @media (max-width: 767px){
    .cod-radius-row{
      margin-top: 6px;
      justify-content: flex-start; /* Inhalte linksbündig */
      text-align: left; /* Text links */
      width: 100%; /* volle Breite */
      padding-left: 2px;
    }
  }

  /* Desktop: bündig mit Karussell */
  @media (min-width:1025px){
    .cod-loc-slab{
      padding-left:28px;
      padding-right:28px;
    }
  }
  /* Tablet: bündig mit Karussell */
  @media (min-width:768px) and (max-width:1024px){
    .cod-loc-slab{
      padding-left:24px;
      padding-right:24px;
    }
  }

  /* Fixe Schriftgröße für Labels im Radiusbereich */
  #Freizeitaktivitaeten .cod-umk,
  #Freizeitaktivitaeten .cod-km {
    font-size: 17px; /* gleiche Größe wie Ort-Eingabe */
    line-height: var(--cod-field-h);
    flex-shrink: 0; /* verhindert kleiner werden bei engem Platz */
  }
  /* Mobile: "km anzeigen" zweizeilig erzwingen */
  @media (max-width:767px){
    #Freizeitaktivitaeten .cod-radius-row{
      display:flex;
      align-items:center;
      gap:10px;
      flex-wrap: nowrap; /* <- wichtig: nicht umbrechen */
    }
  }
  /* Standard: bleibt einzeilig neben dem Input */
  #Freizeitaktivitaeten .cod-km{
    display:inline-block;
    white-space: nowrap;
    line-height: var(--cod-field-h);
    margin-left: 0px;
  }

  #cod-creator-intro {
    width: 100%;
    padding-left: 2vw;
    padding-right: 2vw;
    margin-left: 0;
    margin-right: 0;
    box-sizing: border-box;
    margin-bottom: 50px; /* Abstand nach unten */
  }
  /* Tablet */
  @media (min-width:768px) and (max-width:1024px){
    #cod-creator-intro{
      padding-top: 30px; /* anpassen wie du willst */
    }
  }
  /* Desktop */
  @media (min-width:1025px){
    #cod-creator-intro{
      padding-top: 50px; /* anpassen wie du willst */
    }
  }

  #Freizeitaktivitaeten .cod-creators-intro,
  #Freizeitaktivitaeten .cod-field-caption,
  #Freizeitaktivitaeten .cod-umk,
  #Freizeitaktivitaeten .cod-km {
    font-family: var(--e-global-typography-44ebb6b-font-family, system-ui, sans-serif);
    font-size: var(--e-global-typography-44ebb6b-font-size, 1rem);
    font-weight: var(--e-global-typography-44ebb6b-font-weight, 400);
    line-height: var(--e-global-typography-44ebb6b-line-height, 1.4);
    color: var(--e-global-color-secondary);
  }

  /* Zahl in der Zählerzeile größer und fett */
  #Freizeitaktivitaeten .cod-field-caption .cod-caption-count{
    font-weight: 900;
    font-size: clamp(1.15rem, 1.6vw, 1.35rem);
  }

  /* ans Ende deines <style> Blocks setzen */
  #Freizeitaktivitaeten .cod-area{
    margin-bottom:20px; /* gewünschter Außenabstand */
  }
  #Freizeitaktivitaeten .cod-area::before{
    bottom:0; /* Weißfläche NICHT über das Ende hinausziehen */
  }
  #Freizeitaktivitaeten .cod-load-more-wrap{
    padding-bottom:20px; /* Buttonbereich sauber auf 20px begrenzen */
  }

  /* Klickbare Fläche über dem Icon */
  .cod-date-popover .date-field .picker-hit {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    width: 44px; /* breiter, damit Finger gut trifft */
    background: transparent;
    border: 0;
    padding: 0;
    margin: 0;
    cursor: pointer;
    z-index: 3;
  }

  /* Datum/Zeit/Strich einfärben wie Preistext */
  /* Datum/Zeit/Strich einfärben wie Preistext */
  #Freizeitaktivitaeten .cod-date .only-date,
  #Freizeitaktivitaeten .cod-date .only-time,
  #Freizeitaktivitaeten .cod-date .start.multi,
  #Freizeitaktivitaeten .cod-date .end {
    color: var(--cod-price-date-color);
  }
  /* Bindestrich zwischen Start und Ende: nur Textfarbe, KEIN Hintergrund */
  #Freizeitaktivitaeten .cod-date .end::before {
    color: var(--cod-price-date-color);
    background: none !important;
  }
  /* Mobile-Trenner-Linie (wird nur im Mobile-Layout sichtbar, weil dort content gesetzt wird) */
  #Freizeitaktivitaeten .cod-date .t::after {
    background: var(--cod-price-date-color);
  }

  /* Nur Mobile: Buttons in den Karten */
  @media (max-width:767px){
    #Freizeitaktivitaeten .cod-actions .cod-cta,
    #Freizeitaktivitaeten .cod-actions .cod-cta.secondary{
      font-size: 14px; /* kleinerer Text */
      padding: 14px 10px; /* weniger Innenabstand */
      min-width: auto; /* fixe Mindestbreite entfernen */
      min-height: auto; /* fixe Mindesthöhe entfernen */
      line-height: 1.2; /* Texthöhe anpassen */
    }
  }

  #Freizeitaktivitaeten .cod-search-wrap{
    z-index: 20;
  }

  /* === Fix für Kalender Popover === */
  #Freizeitaktivitaeten .cod-search-wrap{
    z-index: auto !important; /* verhindert eigenen Stacking-Context */
  }
  .cod-date-popover{
    z-index: 1001 !important; /* liegt sicher über dem Overlay (1000) */
  }

  /* nur mobile: titel etwas größer */
  @media (max-width:767px){
    #Freizeitaktivitaeten .cod-card h3.cod-title{
      font-size:16px !important; /* vorher 14px */
      line-height:1.28 !important;
      max-height:calc(1.28em * 3); /* drei zeilen clamp beibehalten */
    }
  }

  /* Schwarze Standard-Pfeile im Owl Carousel ausblenden */
  #cod-creators-results .owl-nav .owl-prev span,
  #cod-creators-results .owl-nav .owl-next span {
    display: none !important;
  }

