/** NEW JOOL master form */
.wpforms-container input::placeholder {
	color: #838383;
}
.jooll-master-form {
	max-width: 640px;
	border: 2px solid #6ab6a9!important;
	padding: 3%!important;
	border-radius: 8px!important;
	background: white!important; 
	margin-top: 3em!important; 
	margin-bottom: 6em!important; 
}

.jooll-master-form .wpforms-page-indicator.circles {
	border-top: none!important; 
	border-bottom: none!important;
	margin: auto!important; 
}


.jooll-master-form input[type="text"],
.jooll-master-form input[type="email"],
.jooll-master-form input[type="tel"] {
	border-left: none!important; 
	border-top: none!important; 
	border-right: none!important; 
}

.jooll-master-form h3 {
	color: #6ab6a9;
	font-size: 18px!important;
	font-weight: 600;
	text-align: center; 
} 

.jooll-master-form .wpforms-title {
	color: #6ab6a9;
	font-weight: 600;
	text-align: center;
	margin-top: 10px!important;
}

.jooll-master-form .wpforms-description {
	color: #929292;
	width: 80%!important;
	margin: auto!important;
}

h3.bike-name-form {
	margin-top: 20px!important; 
} 

input#wpforms-14999-field_29[value="1"] > ul#wpforms-14999-field_33 li.choice-4 {
	display: none; 
}

div.wpforms-container-full .wpforms-form .wpforms-field-label {
	color: #6ab6a9;
}


*/

/* General fix for all forms */
.wpforms-field-container .wpforms-field.wpforms-field-select.bike-size.wpforms-field-select-style-classic,
.wpforms-field-container .wpforms-field.wpforms-field-select.gender.wpforms-field-select-style-classic,
.wpforms-field-container .wpforms-field.wpforms-field-select.cargobikes.wpforms-field-select-style-classic,
.wpforms-field-container .wpforms-field.wpforms-field-select.hood-color.wpforms-field-select-style-classic {
	width: 48%;
	display: inline-block;	
}

.wpforms-field-container .wpforms-field.wpforms-field-select.bike-size.wpforms-field-select-style-classic select,
.wpforms-field-container .wpforms-field.wpforms-field-select.gender.wpforms-field-select-style-classic select,
.wpforms-field-container .wpforms-field.wpforms-field-select.cargobikes.wpforms-field-select-style-classic select,
.wpforms-field-container .wpforms-field.wpforms-field-select.hood-color.wpforms-field-select-style-classic select,
.wpforms-field-container .wpforms-field.wpforms-field-select.bike-color.wpforms-field-select-style-classic select {
	 max-width: 100%!important;
}

.wpforms-field-container .wpforms-field.wpforms-field-select.bike-size.wpforms-field-select-style-classic,
.wpforms-field-container .wpforms-field.wpforms-field-select.cargobikes.wpforms-field-select-style-classic {
	margin-right: 4%; 
}

/** End general fixes for all forms **/

div.wpforms-container-full .wpforms-form .wpforms-page-button,
button#wpforms-submit-14999 {
	border-radius: 5px;
	background-color: #6ab6a9!important;
	color: white!important; 
}

div.wpforms-container-full .wpforms-form .wpforms-page-button:hover,
button#wpforms-submit-14999;hover {
	background-color: #78d1c2!important
}

button#wpforms-submit-14999 {
	width: 100%!important; 
}


ul.wpforms-image-choices li label {
	border: none!important;	
	padding: 10px 20px 10px 20px!important;
}

ul.wpforms-image-choices li {
	max-width: 23.3% !important; 
}

span.wpforms-image-choices-image:after {
	background: #848484!important;
}

span.wpforms-image-choices-label {
	font-size: 12px !important;
}

.wpforms-confirmation-container-full {
  border: none !important;
  background: none !important;
}

/* Category card */
.category-card .elementor-image {
	max-height: 130px!important; 
}

/* add-on price amount */
span.add-on-price--amount {
	font-size: 12px!important;
  font-weight: 600;
}


li.wpforms-image-choices-item {
	position: relative!important;
}

li.wpforms-image-choices-item a i:before {
    font-size: 15px;
}

@media all and (min-width:460px) and (max-width:628px) {
	ul.wpforms-image-choices li.wpforms-image-choices-item {
		width: 33%;
		max-width: 31% !important;
	}
}

@media all and (max-width:459px) {
	ul.wpforms-image-choices li.wpforms-image-choices-item {
		width: 45%;
		max-width: 45% !important;
	}
}



/* Body no-addons */
body.no-addons div[data-field-id="27"] {
	display: none!important; 
}


/** COMPANIES FORM CODES **/
/* New additions to company forms */
form#wpforms-form-16990 .wpforms-field-description {
	  font-size: 11px;
    color: #a5a5a5;
}


span.wpforms-image-choices-label.english {
	display: none!important; 	
}

/* Header in mobiles */
@media (max-width: 980px) {
  header#main-header .container {
    width: 92%;
  }
}

/* Close pop up button */
.popup-button-close {
    margin: auto;
    display: block;
    margin-top: 15px;
    background: red;
    border: none;
    color: white;
    background: #6bb3a8;
    padding: 0.75em 1.5em;
    font-size: .9em;
}

/* Hide in form */
#wpforms-14999-field_60-container,
#wpforms-14999-field_61-container {
	display: none; 
}

/* Wpforms */
button[name="wpforms[submit]"] {
	background: #6bb3a6!important;
    color: white!important;
    width: 100%!important;
} 

.total-price-net {
	display: none; 
}


/* Hiding calculation fields in new form */
#wpforms-38876-field_146-container,
#wpforms-38876-field_143-container,
#wpforms-38874-field_146-container,
#wpforms-38874-field_143-container {
	display: none; 
}
.wpforms-container .add-ons ul.wpforms-image-choices label input {
    top: 0 !important;
    width: 100%;
    height: 100%;
    position: absolute !important;
    left: 0;
    margin: 0 !important;
    cursor: pointer;
    z-index: 2;
    opacity: 0;
}
.add-ons ul {
    display: grid !important;
    grid-template-columns: repeat(4,1fr) !important;
    flex-wrap: nowrap;
}
.add-ons ul li {
    width: 100% !important;
    max-width: 100% !important;
}

@media(max-width:630px){
	.add-ons ul {
		grid-template-columns: repeat(2,1fr) !important;
	}
}
@media(max-width:480px){
	.add-ons ul {
		grid-template-columns: repeat(1,1fr) !important;
	}
	body .wpforms-container .add-ons ul li {
		width: 100%!important;
		max-width: 100%!important;
	}
	body .wpforms-container .add-ons ul li label {
		border: none!important;
		padding: 10px 20px 10px 20px!important;
		max-width: 140px;
	}
}
	.range-slider {
	    width: 100%;
	    margin: 0 auto;
	    position: relative;
	    margin-top: 0px;
	    margin-bottom: 15px;
		max-width: 100%;
	}

	#range {
	    -webkit-appearance: none;
	    appearance: none;
	    width: 100%;
	    border-radius: 100%;
	    margin: 0px;
	}
	#range:focus {
		outline: none;
	}

	#range::-webkit-slider-runnable-track {
		width: 100%;
		height: 1rem;
		cursor: pointer;
		animate: 0.2s;
		background: linear-gradient(
			90deg,
			#6ab6a9 var(--range-progress),
			#dee4ec var(--range-progress)
		);
		border-radius: 0.4rem;
	}
	#range::-webkit-slider-thumb {
		-webkit-appearance: none;
		border: 2px solid #fff;
		box-shadow: 0 1px 3px rgba(0, 0, 255, 0.3);
		border-radius: 100%;
		background-image: url(<?php echo site_url(); ?>/wp-content/uploads/2024/12/arrow_white.png);
		background-size: 20px;
		background-repeat: no-repeat !important;
	    background-position: center;
	    background-color: #6ab6a9;
		cursor: pointer;
		height: 32px;
		width: 32px;
		transform: translateY(calc(-50% + 8px));
	}
	#range::-moz-range-track {
		width: 100%;
		height: 1rem;
		cursor: pointer;
		animate: 0.2s;
		background: linear-gradient(
			90deg,
			#6ab6a9 var(--range-progress),
			#dee4ec var(--range-progress)
		);
		border-radius: 0.4rem;
	}
	#range::-moz-range-thumb {
		-webkit-appearance: none;
		border: 2px solid #fff;
		box-shadow: 0 1px 3px rgba(0, 0, 255, 0.3);
		border-radius: 100%;
		background-image: url(<?php echo site_url(); ?>/wp-content/uploads/2024/12/arrow_white.png);
		background-size: 20px;
		background-repeat: no-repeat !important;
	    background-position: center;
	    background-color: #6ab6a9;
		cursor: pointer;
		height: 32px;
		width: 32px;
		transform: translateY(calc(-45% + 12px));
	}
	#tooltip {
		position: absolute;
		top:0px;
		z-index: 1;
		display: none;
	}
	#tooltip img {
	    width: 19px;
	    left: -7px !important;
	    position: relative;
	}
	.left-right-price {
	    width: 100%;
	    display: flex;
	    gap: 15px;
	    align-items: center;
	    justify-content: space-between;
	    margin: 0px 0px 20px;
	}
	.left-col {
	    width: 50%;
	    text-align: left;
	}
	.right-col {
	    width: 50%;
	    text-align: right;
	}
	.left-right-price h4 {
	    color: #6ab3a7;
	    font-size: 20px !important;
	    font-weight: 700 !important;
	    margin-top: 0px !important;
	    margin-bottom: 10px !important;
	    padding: 0px !important;
	}
	.left-right-price p {
	    font-size: 16px;
	    font-weight: 600;
	    margin: 0px;
	}
	.form-range {
	    margin: 0 auto !important;
	    max-width: 85%;
	    padding: 0px !important;
	}
	.form-range ~.form-range {
	    margin-top: 23px !important;
	    margin-bottom: 23px !important;
	}
	.wpforms-field-medium.wpforms-payment-price,p.customNewfieldProMonat {
	    display: flex;
	    align-items: center;
	    justify-content: space-between;
	    font-weight: 700;
		gap:15px;
	}
	.form-range #wpforms-38876-field_92, .form-range #wpforms-38874-field_92 {
	    -webkit-appearance: none!important;
	    width: 100%!important;
	    border-radius: 100%!important;
	    margin: 10px 0px!important;
	    height: auto !important;
	    border: 0px !important;
	    padding: 0px !important;
	    box-shadow: none !important;
	}
	.form-range #wpforms-38876-field_92:focus, .form-range #wpforms-38874-field_92:focus {
		outline: none !important;
	}
	.form-range #wpforms-38876-field_92::-webkit-slider-runnable-track, .form-range #wpforms-38874-field_92::-webkit-slider-runnable-track {
		/* width: 100% !important; */
		height: 1rem !important;
		cursor: pointer !important;
		animate: 0.2s !important;
		background: linear-gradient(
			90deg,
			#6AB6A9 var(--range-progress),
			#DEE4EC var(--range-progress)
		) !important;
		border-radius: 0.4rem;
	}
	.form-range #wpforms-38876-field_92::-webkit-slider-thumb, .form-range #wpforms-38874-field_92::-webkit-slider-thumb {
		-webkit-appearance: none !important;
		border: 2px solid #fff !important;
		box-shadow: 0 1px 3px rgba(0, 0, 255, 0.3) !important;
		border-radius: 100% !important;
		background-image: url(/de/wp-content/uploads/2024/12/arrow_white.png) !important;
		background-size: 20px !important;
		background-repeat: no-repeat !important;
	    background-position: center !important;
	    background-color: #6AB6A9 !important;
		cursor: pointer !important;
		height: 32px !important;
		width: 32px !important;
		transform: translateY(calc(-36% + 8px)) !important;
	}
	.form-range #wpforms-38876-field_92::-moz-range-track, .form-range #wpforms-38874-field_92::-moz-range-track {
		/* width: 100% !important; */
		height: 1rem !important;
		cursor: pointer !important;
		animate: 0.2s !important;
		background: linear-gradient(
			90deg,
			#6AB6A9 var(--range-progress),
			#DEE4EC var(--range-progress)
		) !important;
		border-radius: 0.4rem;
	}
	.form-range #wpforms-38876-field_92::-moz-range-thumb, .form-range #wpforms-38874-field_92::-moz-range-thumb {
		-webkit-appearance: none !important;
		border: 2px solid #fff !important;
		box-shadow: 0 1px 3px rgba(0, 0, 255, 0.3) !important;
		border-radius: 100% !important;
		background-image: url(/de/wp-content/uploads/2024/12/arrow_white.png) !important;
		background-size: 20px !important;
		background-repeat: no-repeat !important;
	    background-position: center !important;
	    background-color: #6AB6A9 !important;
		cursor: pointer !important;
		height: 32px !important;
		width: 32px !important;
		transform: translateY(calc(-36% + 8px)) !important;
	}
	p.customNewfieldProMonat {
	    font-size: 16px !important;
		font-weight: 700;
	}
	.slider-icon {
	    display: flex;
	    align-items: center;
	    justify-content: space-between;
	    gap: 15px;
	    margin-bottom: 15px;
	}

	.slider-icon img {
	    width: 50px !important;
	    height: 50px !important;
	    object-fit: contain;
	}
	.wpforms-field.hidden {
	    display: none;
	}
	.center-heading {
	    padding: 0px !important;
	    text-align: center;
	}
	.center-heading h2 {
	    margin: 10px 0px 20px !important;
	    font-size: 16px !important;
	    display: inline-block;
	    text-decoration: underline;
	}
	.customer_label {
	    padding-top: 0px !important;
	    padding-bottom: 10px !important;
	}
	.wpforms-field-description {
	    font-size: 12px !important;
	}
	form .wpforms-container .wpforms-field {
	    padding: 5px 0px;
	}