/*
Theme Name:     Divi Child_Theme
Theme URL:      https://www.elegantthemes.com
Description:    Divi Child_Theme
Author:         dtwardon
Author URL:     https://www.casa-torre.eu
Template:       Divi
Version:        2.0.0
*/

/*  Enter your custom CSS below */ 

/* Gravity Form Anpassungen - Formularanpassungen Anfang ---------------------- */

/* Gravity Form - Verändert den Font, die Textfarbe und Textgröße über(!) den Gravity Eingabefeldern */
.gform_wrapper .gfield .gfield_label {
    font-family: 'Open Sans', sans-serif; /* Sicherstellen, dass die Schriftart geladen wird */
    color: #333;
    font-size: 1.0em;
    font-weight: normal;
    margin-bottom: 4px; /* Abstand zwischen Text und Textrahmen */
}

/* Gravity Form - Verändert Rahmenfarbe, Rahmendicke, Radius und Schrift in (!) den Feldern für alle Formulare und Felder */
.gform_wrapper .gfield input[type="text"],
.gform_wrapper .gfield input[type="email"],
.gform_wrapper .gfield input[type="url"],
.gform_wrapper .gfield input[type="password"],
.gform_wrapper .gfield input[type="number"],
.gform_wrapper .gfield input[type="tel"],
.gform_wrapper .gfield select,
.gform_wrapper .gfield textarea {
    background-color: #fff;
    border: 1px solid #ddd;
    font-size: 0.96em;
    padding: 5px; /* Etwas mehr Padding für bessere Lesbarkeit */
    box-sizing: border-box; /* Wichtig für konsistente Breitenberechnung */
    width: 100%; /* Felder füllen den Container aus */
    border-radius: 4px; /* Kurzform für alle Browser */
}

/* Gravity Form - Styles für Sub-Labels im Namensfeld des Formulars mit ID 18 und ID 30,
   im Adressfeld mit ID 26 und ID 50, im Emailfeld mit ID 28 und ID 52,
   und im Datei-hochladen-Feld mit ID 29 und ID 53 */
body .gform_wrapper#gform_wrapper_18 .gform_body .gform_fields #field_18_21 .gform-field-label--type-sub,
body .gform_wrapper#gform_wrapper_18 .gform_body .gform_fields #field_18_23 .gform-field-label--type-sub,
body .gform_wrapper#gform_wrapper_18 .gform_body .gform_fields #field_18_26 .gform-field-label--type-sub,
body .gform_wrapper#gform_wrapper_18 .gform_body .gform_fields #field_18_28 .gform-field-label--type-sub,
body .gform_wrapper#gform_wrapper_18 .gform_body .gform_fields #field_18_29 .ginput_container span,
body .gform_wrapper#gform_wrapper_30 .gform_body .gform_fields #field_30_21 .gform-field-label--type-sub,
body .gform_wrapper#gform_wrapper_30 .gform_body .gform_fields #field_30_23 .gform-field-label--type-sub,
body .gform_wrapper#gform_wrapper_30 .gform_body .gform_fields #field_30_26 .gform-field-label--type-sub,
body .gform_wrapper#gform_wrapper_30 .gform_body .gform_fields #field_30_28 .gform-field-label--type-sub,
body .gform_wrapper#gform_wrapper_30 .gform_body .gform_fields #field_30_29 .ginput_container span {
    color: #333;
    font-size: 0.76rem; /* Verwendet rem für bessere Skalierbarkeit */
    font-style: normal;
    margin-bottom: 0px;
    display: block;
    position: relative;
    top: -2px; /* Negativer Wert verschiebt das Label nach oben */
    -webkit-font-smoothing: antialiased; /* Optional: bessere Schriftglättung für Webkit-Browser */
    -moz-osx-font-smoothing: grayscale; /* Optional: bessere Schriftglättung für Firefox */
}

/* Gravity Form - Anpassungen für das Datei-hochladen-Feld */
body .gform_wrapper#gform_wrapper_18 .gform_body .gform_fields #field_18_29 .ginput_container span,
body .gform_wrapper#gform_wrapper_30 .gform_body .gform_fields #field_30_29 .ginput_container span {
    top: -15px; /* Negativer Wert verschiebt das Label nach oben */
}

/*Gravity Form - Verändert Postion des ZIP und CITY Feld im ADRESS Feld"*/
/* Container für die Felder */
#input_18_26,
#input_30_26 { 
    display: flex; /* Flexbox Layout für horizontale Anordnung */
    width: 100%; 
    box-sizing: border-box; 
    gap: 10px; /* Abstand zwischen den Feldern */
}

/* Nur für das ZIP-Feld */
#input_18_26_5_container,
#input_30_26_5_container { 
    flex: 1 1 20%; /* Flex-Anpassung für 20% Breite */
    padding: 5px;
    box-sizing: border-box; 
    margin: 0; 
}

/* Nur für das City-Feld */
#input_18_26_3_container,
#input_30_26_3_container { 
    flex: 1 1 75%; /* Flex-Anpassung für 75% Breite */
    padding: 5px; /* Konsistenz mit ZIP-Feld */
    box-sizing: border-box; 
    margin: 0; /* Entfernen von standard-margin */
}

/* Sicherstellen, dass die Input-Felder selbst auch korrekt behandelt werden */
#input_18_26_5,
#input_18_26_3,
#input_30_26_5,
#input_30_26_3 {
    width: 100%; /* Volle Breite des Containers nutzen */
    padding: 5px;
    box-sizing: border-box; 
    margin: 0;
}

/* Gravity Form - Verändert Postion der Überschrift "Kostenübersicht- HTML" für zwei Forms (DE/EN) */
/* Hier musst du die neuen Selektoren für die HTML-Felder verwenden.
   Nutze die Entwicklertools, um die korrekten Klassen zu finden.
   Beispiel (kann abweichen): */

#field_18_33.gfield.gfield_html.gfield_html_formatted.gfield_no_follows_desc.field_sublabel_below.field_description_below.gfield_visibility_visible,
#field_30_33.gfield.gfield_html.gfield_html_formatted.gfield_no_follows_desc.field_sublabel_below.field_description_below.gfield_visibility_visible {
  text-decoration: underline;
  text-indent: 0px;
  font-weight: bold;
  word-spacing: 0px;
  border-top-width: 0px;
  border-bottom-width: 0px;
  margin-top: 25px;
  margin-bottom: -10px;
}

/* Stil für das heutige Datum */
.ui-state-highlight {
    background-color: lightgrey !important; /* Ersetze "your-highlight-color" durch die gewünschte Hintergrundfarbe */
    color: black !important; /* Ersetze "your-text-color" durch die gewünschte Textfarbe */
    font-weight: bold !important;
	border-color: darkgrey!important;
    border-width: 2px !important; /* Ändere "border-size" zu "border-width" */
}

/* Mehr spezifischer Stil für das heutige Datum, wenn es außerhalb des erlaubten Zeitraums ist */
.ui-datepicker .ui-datepicker-calendar .ui-datepicker-unselectable.ui-state-highlight {
    background-color: darkgrey !important; /* Ersetze "your-unselectable-highlight-color" durch die gewünschte Hintergrundfarbe */
    color: red !important; /* Ersetze "your-unselectable-text-color" durch die gewünschte Textfarbe */
}

/* Erzwingt, das Submit Button links positioniert wird (initiale position) */
.gform_wrapper.gravity-theme button[type="submit"] {
    margin: initial !important;
}



/*Gravity Form Änderungen - Formularanpassungen Ende */

/*Divi Full Width Menu - Festlegung der Schriftgröße --> verhindert ungewollten Animationseffekt*/
.top-header-menu a {
/*font-family: 'open sans', Helvetica, Arial, Lucida, sans-serif;*/
font-size: 16px!important;
color: #666666;
letter-spacing: 0px;
}
/*Divi Full Width Header - Verschiebung nach Links - Header und Subheader*/
.et_pb_module_header {
  text-align: left;
  text-indent: -60px;
}
.et_pb_fullwidth_header_subhead {
  text-indent: -60px!important;
}

/*Widget - Verschiebung der Belegungsplan Überschrift nach rechts - ist das noch notwendig?*/
.et_pb_column_1_4 h4 {
  text-indent: 0px!important;
  font-size: 18px!important;
}

/*Top Header Menue Hover Effekt*/
.top-header-menu a::after {
  position: absolute;
  top: 100%; /*you may want to adjust this - vertically distance change of hover line*/
  left: 0; /*you may want to adjust this - position change of hover underline*/
  width: 100%; /*you may want to adjust this - width of hover underline*/
  height: 2px; /*you may want to adjust this - height of hover underline*/
  background: #666666; /*you may want to adjust this - color of hover underline*/
  content: ''; /*you may want to adjust this - content below hover underline*/
  opacity: 0;
  -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
  -moz-transition: opacity 0.3s, -moz-transform 0.3s;
  transition: opacity 0.3s, transform 0.3s;
  -webkit-transform: translateY(0px);
  -moz-transform: translateY(0px);
  transform: translateY(0px);
}
.top-header-menu a:hover::after,
.top-header-menu a:focus::after {
  opacity: 1;
  -webkit-transform: translateY(0px);
  -moz-transform: translateY(0px);
  transform: translateY(0px);
}


/*Hamburger Menu wird beim Schließen durch ein x dargestellt
.mobile_nav.opened .mobile_menu_bar:before {
 content: "\4d";
}*/
.mobile_menu_bar::before {
	display: block;
	transition: all .4s ease;
}
.mobile_nav.opened .mobile_menu_bar::before {
	content: "M";
	transform: rotate(90deg);
}



/* Mobiles Menü-Elemente zentrieren */
.et_mobile_menu li {
text-align:center !important;
}

.et_mobile_menu li li, .et_mobile_menu li ul {
padding-left:0 !important;
}

/* Mobiles Menü auf volle Höhe setzen */
.et_mobile_menu {
min-height:100vh !important;
min-height: -webkit-fill-available;
padding-top:40px !important;
}

html {
height: -webkit-fill-available;
}
/* Animation entfernen um Verzögerung zu vermeiden */
.mobile_nav.opened .et_mobile_menu {
display:block !important;
}

/* Stellt sicher, dass das Menü die volle Breite des Boxed Containers nutzt */
.et_mobile_menu {
  width: calc(100% + 9.2vw) !important; /* Passt sich dynamisch an das Boxed Layout an */
  max-width: none !important;
  margin-left: -4.6vw !important; /* Zentriert das Menü innerhalb des Containers */
  margin-right: -4.6vw !important;
  padding: 0 !important;
  box-sizing: border-box;
}

/* Falls es auf sehr kleinen Screens immer noch Abweichungen gibt */
@media (max-width: 768px) {
  .et_mobile_menu {
    width: calc(100% + 8vw) !important;
    margin-left: -4vw !important;
    margin-right: -4vw !important;
  }
}

@media (max-width: 480px) {
  .et_mobile_menu {
    width: calc(100% + 6vw) !important;
    margin-left: -3vw !important;
    margin-right: -3vw !important;
  }
}



/*Optimiert die Darstellung auf Mobiles*/
@media screen and (max-width:767px) {
h3 {
font-size: 1.4em!important;
}
}



/*SLIDER - GRID*/ 
/*Galerie wird mit einem Graufilter versehen, Hover erzeugt farbiges Bild, Hover Marker ist unsichtbar*/

/* Graufilter-Effekt für die Galerie */
.grayscale .et_pb_gallery_image {
    -webkit-filter: grayscale(70%);
    filter: grayscale(70%);
    opacity: 0.8;
    transition: filter 0.5s ease, opacity 0.5s ease; /*verlangsamt den Wechsel, wirkt smoother*/
}

.grayscale .et_pb_gallery_image:hover {
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%);
    opacity: 1;
}

/* Entfernen des Overlays */
.et_overlay:before {
    display: none;
}

/*Unerwünschter Animationseffect von DIVI (link-->rechts Verschiebung des GRIDS) wird unterdrückt*/
.grayscale .et_pb_gallery_item{
-webkit-animation: none !important;
-moz-animation: none !important;
-o-animation: none !important;
-ms-animation: none !important;
animation: none !important;
}