.elementor-2298 .elementor-element.elementor-element-a1a39ad{--display:flex;--min-height:80vh;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--overlay-opacity:0.25;--margin-top:-65px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-2298 .elementor-element.elementor-element-a1a39ad:not(.elementor-motion-effects-element-type-background), .elementor-2298 .elementor-element.elementor-element-a1a39ad > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://dittrich-fewo.de/wp-content/uploads/2026/01/IMG_6064-2048x1536.jpg");background-position:100% -550px;background-repeat:no-repeat;background-size:cover;}.elementor-2298 .elementor-element.elementor-element-a1a39ad::before, .elementor-2298 .elementor-element.elementor-element-a1a39ad > .elementor-background-video-container::before, .elementor-2298 .elementor-element.elementor-element-a1a39ad > .e-con-inner > .elementor-background-video-container::before, .elementor-2298 .elementor-element.elementor-element-a1a39ad > .elementor-background-slideshow::before, .elementor-2298 .elementor-element.elementor-element-a1a39ad > .e-con-inner > .elementor-background-slideshow::before, .elementor-2298 .elementor-element.elementor-element-a1a39ad > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:var( --e-global-color-astglobalcolor2 );--background-overlay:'';}.elementor-2298 .elementor-element.elementor-element-a1a39ad.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-2298 .elementor-element.elementor-element-a43a742{--display:flex;--padding-top:300px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2298 .elementor-element.elementor-element-a43a742.e-con{--align-self:center;--flex-grow:1;--flex-shrink:0;}.elementor-2298 .elementor-element.elementor-element-01f46c1.elementor-element{--align-self:center;}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-2298 .elementor-element.elementor-element-a1a39ad:not(.elementor-motion-effects-element-type-background), .elementor-2298 .elementor-element.elementor-element-a1a39ad > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-position:0% 0px;}.elementor-2298 .elementor-element.elementor-element-01f46c1.elementor-element{--align-self:center;}}@media(min-width:768px){.elementor-2298 .elementor-element.elementor-element-a1a39ad{--width:100%;}}@media(max-width:767px){.elementor-2298 .elementor-element.elementor-element-a1a39ad{--min-height:100vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-2298 .elementor-element.elementor-element-a1a39ad:not(.elementor-motion-effects-element-type-background), .elementor-2298 .elementor-element.elementor-element-a1a39ad > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-position:44% -64px;}.elementor-2298 .elementor-element.elementor-element-a43a742{--content-width:420px;--gap:16px 16px;--row-gap:16px;--column-gap:16px;--padding-top:300px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2298 .elementor-element.elementor-element-01f46c1.elementor-element{--align-self:center;}}/* Start custom CSS for html, class: .elementor-element-01f46c1 *//* =========================
   BOOKING BAR – BASIS
========================= */

.booking-wrapper{
  display:flex;
  gap:24px;
  align-items:flex-end;
  background:#fff;
  padding:18px 22px;
  border-radius:14px;
  box-shadow:0 12px 30px rgba(0,0,0,.25);
  max-width:1100px;
}

.booking-field{
  flex:1;
}

.booking-field label{
  display:block;
  font-size:13px;
  font-weight:600;
  margin-bottom:6px;
  color:#333;
}

.booking-field input,
.booking-field select{
  width:100%;
  height:48px;
  border:1px solid #ddd;
  border-radius:8px;
  padding:0 14px;
  font-size:16px;
  background:#fff;
  cursor:pointer;
}


/* =========================
   SUCHBUTTON
========================= */

/* Button Reset */
#searchBtn{
  all:unset;
  width:48px;
  height:48px;
  background:#696969;
  border-radius:8px;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  position:relative;
}

/* 🔍 Lupe als Icon – NICHT löschbar */
#searchBtn::before{
  content:"";
  width:22px;
  height:22px;
  background:no-repeat center/contain;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='16.65' y1='16.65' x2='21' y2='21'/%3E%3C/svg%3E");
}


/* =========================
   FLATPICKR – GRUNDLAYOUT
========================= */

.flatpickr-calendar{
  border-radius:14px;
  box-shadow:0 12px 30px rgba(0,0,0,.25);
  font-family:inherit;
  padding:12px;
}

.flatpickr-months{
  margin-bottom:8px;
}

.flatpickr-current-month{
  font-size:18px;
  font-weight:600;
}

.flatpickr-weekdays span{
  font-weight:600;
  color:#666;
}


/* =========================
   TAGE – SAUBER WIE REFERENZ
========================= */

.flatpickr-day{
  border-radius:6px;
  font-size:14px;
}

/* Heute */
.flatpickr-day.today{
  border:1px solid #0b5d3b;
}

/* Start + Ende */
.flatpickr-day.startRange,
.flatpickr-day.endRange{
  background:#0b5d3b;
  color:#fff;
  border-radius:6px;
}

/* Bereich dazwischen */
.flatpickr-day.inRange{
  background:rgba(11,93,59,.18);
  color:#000;
}

/* Hover */
.flatpickr-day:hover{
  background:rgba(11,93,59,.12);
}

/* deaktivierte Tage */
.flatpickr-day.disabled,
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay{
  color:#ccc;
}


/* =========================
   NAVIGATION (PFEILE)
========================= */

.flatpickr-prev-month,
.flatpickr-next-month{
  top:12px;
}

.flatpickr-prev-month svg,
.flatpickr-next-month svg{
  fill:#0b5d3b;
}


/* =========================
   MOBILE
========================= */

@media (max-width:768px){
  .booking-wrapper{
    flex-direction:column;
    gap:14px;
    padding:16px;
  }

  #searchBtn{
    width:52px;
    height:52px;
    border-radius:10px;
  }

  #searchBtn svg{
    width:24px;
    height:24px;
  }
}
/* ZWINGEND – überschreibt Flatpickr Theme */
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange{
  background:#0b5d3b !important;
  color:#fff !important;
}

.flatpickr-day.inRange{
  background:rgba(11,93,59,.18) !important;
  color:#000 !important;
}

.flatpickr-day.today{
  border:1px solid #0b5d3b !important;
}

.flatpickr-prev-month svg,
.flatpickr-next-month svg{
  fill:#0b5d3b !important;
}
/* 🔍 SVG Lupe FINAL fix */
#searchBtn svg{
  display:block !important;
  width:22px !important;
  height:22px !important;
  stroke:#ffffff !important;
  stroke-width:2 !important;
  fill:none !important;
  opacity:1 !important;
  visibility:visible !important;
}

/* falls Elementor currentColor nutzt */
#searchBtn{
  color:#ffffff !important;
}
/* ================================
   FLATPICKR – RANGE ECKIG (FINAL)
   ================================ */

/* Start- & Enddatum */
.flatpickr-day.startRange,
.flatpickr-day.endRange{
  background:#0b5d3b !important;
  color:#ffffff !important;
  border-radius:0 !important;
}

/* Bereich zwischen Start & Ende */
.flatpickr-day.inRange{
  background:rgba(11,93,59,0.18) !important;
  color:#000 !important;
  border-radius:0 !important;
}

/* Hover ebenfalls eckig */
.flatpickr-day:hover{
  border-radius:0 !important;
}

/* Heute-Markierung eckig */
.flatpickr-day.today{
  border-radius:0 !important;
}

/* Sicherheit: keine Rundung von außen */
.flatpickr-day{
  border-radius:0 !important;
}
/* Kalender etwas tiefer positionieren */
.flatpickr-calendar{
  margin-top:20px !important;
}
/* Fokus-Rand sauber schließen (kein Spalt mehr) */
.booking-field input:focus{
    outline:none;
    box-shadow:0 0 0 2px rgba(11,93,59,0.15);
    border-color:#0b5d3b;
}
/* ❌ Theme-Lupe entfernen */
#searchBtn{
  background-image: none !important;
}

/* falls Elementor ein ::before / ::after Icon nutzt */
#searchBtn::before,
#searchBtn::after{
  content: none !important;
  display: none !important;
}

/* sicherstellen, dass nur dein SVG sichtbar ist */
#searchBtn svg{
  display: block !important;
}
/* =========================
   BUCHUNGSBOX – FINAL CENTER
========================= */

/* 1️⃣ Elementor Section & Container zentrieren */
.elementor-section,
.elementor-container {
  justify-content: center !important;
}

/* 2️⃣ Seitliches Padding von Elementor entfernen (nur für diesen Bereich) */
.elementor-widget-html {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 3️⃣ Booking Wrapper selbst exakt mittig */
.booking-wrapper {
  margin: 0 auto !important;
  max-width: 420px;
  width: calc(100% - 20px); /* links + rechts je 10px */
}

/* 4️⃣ Mobile Feinschliff */
@media (max-width: 768px) {
  .booking-wrapper {
    left: 0 !important;
    transform: none !important;
  }
}

/* =========================
   DESKTOP ONLY – SUCHBUTTON QUADRATISCH
========================= */
@media (min-width: 1025px) {
  #searchBtn{
    flex: 0 0 48px !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    align-self: flex-end !important;
    padding: 0 !important;
  }
}/* End custom CSS */