/*---------------------------------------------------------------------------------

 Theme Name:   Divi Child Theme
 Theme URI:    https://lukas-fischer.de/
 Description:  Child Theme für Divi erstellt von Lukas Fischer.
 Author:       Lukas Fischer
 Author URI:   https://lukas-fischer.de
 Template:     Divi
 Version:      1.1.9


------------------------------ ADDITIONAL CSS HERE ------------------------------*/

.password-generator {
    font-family: Arial, sans-serif;
    width: 300px;
    margin: 0 auto;
    text-align: center;
}

#password-length {
    width: 100%;
    margin: 10px 0;
}

#generate-password {
    padding: 10px 20px;
    background-color: #0073aa;
    color: white;
    border: none;
    cursor: pointer;
    border-radius: 5px;
    margin-top: 10px;
}

#generated-password-container {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 20px;
}

#generated-password {
    width: 200px;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    margin-right: 10px;
}

#copy-password {
    padding: 10px;
    background-color: #0073aa;
    color: white;
    border: none;
    cursor: pointer;
    border-radius: 5px;
}






/*******STRUCTURAL LAYOUT*******/

/*WooCommerce Layout Structure*/
@media (min-width: 980px) {

/*Billing Detials Side*/
.woocommerce-checkout .woocommerce .col2-set, .woocommerce-checkout .woocommerce-page .col2-set {
float:left;
width: 55%;
}

/*Order Review Side*/
.woocommerce-checkout #order_review_heading, .woocommerce-checkout .woocommerce #order_review, .woocommerce-checkout .woocommerce-page #order_review {
float: left;
width:43%;
margin-left: 2%;
}
}

@media (max-width: 979px) {
/*Billing Detials Margin*/
.woocommerce-checkout .woocommerce .col2-set, .woocommerce-checkout .woocommerce-page .col2-set {
margin-bottom: 2em;
}
}

/*******LEFT SIDE*******/

/*Billing Details Headline*/
.woocommerce-account form h3:first-child, .woocommerce-checkout form h3:first-child {
display: none; /*This is my preference. You can remove this and use the margin-bottom style below instead*/
/*margin-bottom: 1em;*/
}

/*Form Container Styles*/
.woocommerce-checkout .woocommerce .col2-set, .woocommerce-checkout .woocommerce-page .col2-set {
background: white;
padding: 3em;
border-radius: 1em;
}

/*Form Field Title Styles*/
label, input, button, select, textarea {
font-size: 12px;
line-height: 1.7;
font-weight: 500;
color: #4a4a4a;
margin-bottom: 0.5em;
}

/*Form Field Styles*/
input.text, input.title, input[type=email], input[type=password], input[type=tel], input[type=text], select, textarea {
border: 1px solid #d9d9d9;
border-radius: 5px;
background-color: white;
height: 4em;
}

.woocommerce-account form .form-row, .woocommerce-checkout form .form-row {
margin-bottom: 1em;
}

/*Form Field Dropdown Styles*/

.select2-container--default .select2-selection--single {
background-color: #fff;
border: 1px solid #d9d9d9;
border-radius: 5px;
height: 4em;
}

.select2-container .select2-selection--single .select2-selection__rendered {
line-height: 4em;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
height: 100%;
position: absolute;
top: 1px;
right: 5px;
width: 25px;
}

.woocommerce-account form .payment_methods label, .woocommerce-checkout form .payment_methods label {
padding-left: 0px;
}

/*Form Field Focus Color Style*/
textarea:focus, input[type=text]:focus, input[type=password]:focus, input[type=datetime]:focus, input[type=datetime-local]:focus, input[type=date]:focus, input[type=month]:focus, input[type=time]:focus, input[type=week]:focus, input[type=number]:focus, input[type=email]:focus, input[type=url]:focus, input[type=search]:focus, input[type=tel]:focus, input[type=color]:focus, .uneditable-input:focus {
border-color: #4e22e9; /*Change this to a color that best suits your design*/
box-shadow: none;
outline: 0;
}

/*******RIGHT SIDE*******/

/*Order Review Headline Removal*/
h3#order_review_heading {
display: none;
}

/*Order Review Container Styles*/
div#order_review {
background: white;
padding: 3em;
border-radius: 1em;
box-shadow: 0 0.5em 2em rgb(0 0 0 / 10%);
}

/*Remove Product and Subtotal Headlines*/
table.shop_table.woocommerce-checkout-review-order-table thead{
display: none;
}

table.shop_table.woocommerce-checkout-review-order-table {
color: black;
text-transform: uppercase;
font-size: 14px;
}

table th, table td {
border-top: none; /*Change to set a divider line if desired*/
}

/*Order Total Line Item Styles*/
tr.order-total {
color: #0049ff; /*Accent color for total if desired*/
background: #0049ff21; /*Accent background color if desired*/
}

/*Stripe Form Field Styles*/
.wc-stripe-elements-field, .wc-stripe-iban-element-field {
border: 1px solid #d9d9d9;
border-radius: 5px;
background-color: #fff;
padding: 15px;
}

input#wc-stripe-new-payment-method {
margin-right: 1em;
}

/* Place Order Button Styles*/
#place_order {
width: 100%;
color: #fff;
border: none;
box-shadow: rgba(0, 0, 0, 0.28) 0px 2px 8px 0px;
padding: 1.5em;
}

#place_order:hover {
color: rgba(255,255,255,0.5);
}

/*Sticky Order Review*/
#order_review {
position: -webkit-sticky;
position: sticky;
top: 150px;
z-index:99;
}
body {
overflow-x:visible;
}

/*******COUPON & ALERT STYLES*******/

.woocommerce-info, .woocommerce-message {
background-color: #f7f8fa;
color: #474747;
border: none;
}

.woocommerce-error, .woocommerce-info, .woocommerce-message {
padding: 1em;
}

form.checkout_coupon.woocommerce-form-coupon {
padding: 3em;
background: white;
border-radius: 1em;
margin-top: 0em;
margin-bottom: 2em;
}

/*Error Alert*/
.woocommerce-error {
background-color: #ff7e7e;
border: none;
color: #761f1f;
}

.woocommerce-error, .woocommerce-info, .woocommerce-message {
text-shadow: none;
}

/*******REMOVE ADDITIONAL INFORMATION FIELD*******/

/*Delete This To Show Your Additional Fields Section*/
.woocommerce-additional-fields {
display: none;
}

/*******OPTIONAL WOOCOMMERCE SUBSCRIPTION STYLES*******/

/*WooCommerce Subscriptions Styles*/
/*This is commented out. Simply delete the comment slash and asterisk to activate*/

/*tr.order-total.recurring-total {
display: table-row;
background: #0049ff21;
}

.first-payment-date {
font-size: 0.85em;
}

tr.order-total {
display:none;
}*/




/* Standardstil für Checkbox-Labels innerhalb des Formulars */
#securityCheckForm label {
    font-size: 16px; /* Standard-Textgröße für größere Bildschirme */
}

/* Media Query für Mobilgeräte */
@media (max-width: 600px) {
    #securityCheckForm label {
        font-size: 13px; /* Kleinere Textgröße für mobile Geräte */
    }
	.compact-line-height {
    line-height: 0.8; /* Setzt eine kleinere Zeilenhöhe */
}

}



.intro {
	margin-top:-20px !important;
	margin-bottom:15px !important;
}




.pseudo-h2 {
    font-size: 1.5em; /* Größe ähnlich h2 */
    font-weight: bold; /* Fettgedruckt wie bei h2 */
    margin-top: 1px; /* Standardmarge oben für h2 */
    margin-bottom: 15px; /* Standardmarge unten für h2 */
	line-height:1.2em;
}




#multi-step-form .form-step {
    display: none;
    margin: 2px;
    padding: 2px;
    border-radius: 5px;
}

#multi-step-form .form-step.active {
    display: block;
}

button {
    padding: 10px 20px;
    background-color: #ffcf00;
	font-weight: bold;
    color: black;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    margin-top: 15px;
	margin-bottom: 1px;
	text-align:right;
	font-size:18px;
}

button:hover {
    background-color: #CDB23E;
}

input[type="checkbox"] {
    margin-right: 10px;
}





/*style onepage menu*/


#top-menu .current-menu-item a.mPS2id-highlight{
text-decoration:underline;
	color:#e9550d;

}

/*Kontaktformular*/

.et_contact_bottom_container {
    float: none;
    text-align: right;
    display: block !important;
  margin-top:30px;
  margin-left:20px;
}

@media (min-width: 768px) and (max-width: 991.98px){
  .et_contact_bottom_container {
     margin-top: -17px;
  }
}

@media (min-width: 300px) and (max-width: 767.98px){
  .et_contact_bottom_container {
     margin:25px;
    text-align:center;
  }
}




/*design back to top button*/

.et_pb_scroll_top.et-pb-icon {
	    background: rgba(233,85,13,0.67);
		bottom: 280px;
		right: 20px;
    	border-radius: 25px;
}

.et_pb_scroll_top.et-pb-icon:hover {
	    background: #e9550d;
		bottom: 280px;
		right: 20px;
    	border-radius: 25px;
}

.et_pb_scroll_top.et-visible {
    opacity: 1;
    -webkit-animation: fadeInBottom 1s 1 cubic-bezier(.77,0,.175,1);
    -moz-animation: fadeInBottom 1s 1 cubic-bezier(.77,0,.175,1);
    -o-animation: fadeInBottom 1s 1 cubic-bezier(.77,0,.175,1);
    animation: fadeInBottom 1s 1 cubic-bezier(.77,0,.175,1);
} 


/*mobil reihenfolge ändern anleitung:

display: flex;
flex-wrap: wrap;   ->  in mobile custom css der entsprechenden row einfügen

dann: order:1; order:2; usw bei den entsprechenden spalten in die mobile custom css einfügen

*/


/*place button modules next to each other in the same column -> klasse .inline-buttons in divi row einfügen, damit aktiv*/

.inline-buttons .et_pb_button_module_wrapper {
    display: inline-block;
}

.inline-buttons {
text-align: center !important;
}




/* CSS for buttons - Attention Grabber - Pulse */
#page-container .et-l .et_pb_section .dl-pulse {
  animation: button-pulse 2.0s infinite;
}

@keyframes button-pulse {

  0%,
  30%,
  60%,
  100% {
    transform: scale(1);
  }

  8%,
  12% {
    transform: scale(1.03);
  }
}

#page-container .et-l .et_pb_section .dl-pulse:hover {
  animation: none;
}




/*prevent horizontal scroll on mobile*/

@media all and (max-width: 980px) {
	html,
	body {
		overflow-x: hidden;
	}
	body {
		position: relative
	}
}

@media all and (max-width: 980px) {
#page-container {overflow:hidden;}	
}