

/*custome checkbox start*/

.custom-check {
	position: relative;
	display: inline-block;
	width: 22px;
	height: 22px;
	cursor: pointer;
}

.custom-check input {
	opacity: 0;
	width: 0;
	height: 0;
}

/* Outer circle */
.checkmark {
	position: absolute;
	top: 0;
	left: 0;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	border: 2px solid #53bc43;
	background-color: #fff;
	transition: all 0.3s ease;
}

/* Tick mark */
.checkmark::after {
	content: "";
	position: absolute;
	display: none;
	left: 6px;
	top: 3px;
	width: 6px;
	height: 11px;
	border: solid #53bc43;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
	transition: all 0.3s ease;
}

/* When checked */
.custom-check input:checked ~ .checkmark {
	background-color: #53bc43;
}

.custom-check input:checked ~ .checkmark::after {
	display: block;
	border-color: #fff;
}

/* Hover/Focus */
.custom-check:hover .checkmark {
	box-shadow: 0 0 5px rgba(26, 167, 255, 0.4);
}

/*custome checkbox end*/









/*select 2 css*/

.select2-container--default .select2-selection--single {
	background-color: #eaf7ff !important;
}

.select2-container--default .select2-selection--single {
	border: none !important;
}
.select2-search__field {
	background-color: #eaf7ff !important;
	border-radius: 5px !important;
	border: none !important;
}

.select2-search__field::placeholder {
	font-size: 14px; /* Change this as you like */
	color: #45b8ff !important;
	font-weight: 500; /* Optional: make it slightly bolder */
}
.select2-results__option--highlighted {
	background-color: #45b8ff !important;
}
.select2-dropdown {
	border: 2px dashed #45b8ff !important;
}

/*select 2 css*/

.is-invalid {
	border: 2px dashed red !important;
}

.text-danger {
	color: red;
	font-size: 13px;
	margin-top: 4px;
	display: block;
}


.selected-info {
	justify-content: center;
}

.info-badge {
	background: #f0f8ff;
	color: #1aa7ff;
	border: 1px solid #1aa7ff;
	border-radius: 30px;
	padding: 8px 16px;
	font-weight: 600;
	font-size: 16px;
	display: inline-flex;
	align-items: center;
	gap: 5px;
}

/* 👇 make only the label text black */
.info-badge strong {
	color: #000;
}



.cleaning-checklist {
	display: flex;
	gap: 70px;
	align-items: flex-start; /* was: center  ✅ keep items top-aligned */
	justify-content: center;
}
.other-language {
	display: flex;
	flex-direction: column;
}
@media screen and (max-width: 600px) {
	.cleaning-checklist {
		display: block;
		margin-left: 20px;
	}
}


/*start of new search select for countries code*/
.phone-group {
	display: flex;
	gap: 5px;
}

.phone-group select {
	width: auto;
	/* background: #203772; */
	border-radius: 10px;
	border: none;
	font-weight: 400;
	font-size: 15px;
	color: var(--tg-white);
	height: 50px;
	display: block;
}

.select2-container--default .select2-selection--single {
	/* background: #203772 !important; */
	border: 1px solid #ddd;
	border-radius: 5px !important;
	font-weight: 400 !important;
	font-size: 15px !important;
	color: var(--tg-white) !important;
	height: 50px !important;
	display: block !important;
}

.select2-container--default .select2-selection__rendered {
	line-height: 50px !important;
	color: var(--tg-white) !important;
}

.select2-container--default .select2-selection__arrow {
	height: 40px !important;
}

.phone-group input {
	flex: 1;
	padding: 5px;
	border: 1px solid #ccc;
	border-radius: 5px;
}
@media screen and (max-width: 768px) {
	.phone-group {
		display: block;
	}
	.phone-group input {
		margin-top: 5px;
	}
	.select2-container {
		width: 100%;
	}
}
/* @media screen and (min-width: 768px) {
	.select2-container {
		width: 50% !important;
	}
} */

/*end of new search select for countries code*/

input[type="text"],
input[type="tel"],
input[type="email"],
input[type="date"],
input[type="number"]:not(.zuri-hero-zip),
textarea,
select {
	width: 100%;
	padding: 10px;
	/* border: 1px solid #ddd !important; */
	border: none;
	border-radius: 5px;
	/* margin-bottom: 15px; */
	font-size: 15px;
	background-color: #eaf7ff;
}
