.blinds-customer-details-form {
	width: 100%;
}

.blinds-customer-details-section {
	margin-bottom: 40px;
}

.blinds-customer-details-row {
	display: flex;
	gap: 50px;
	margin-bottom: 40px;
}

.blinds-customer-details-row:last-child {
	margin-bottom: 0;
}

.blinds-customer-details-field {
	flex: 1;
	display: flex;
	flex-direction: column;
}

.blinds-customer-details-field.full-width {
	width: 100%;
}

.blinds-customer-details-field label {
	font-size: 18px;
	font-weight: 500;
	color: #161615;
	margin-bottom: 8px;
}

.blinds-customer-details-form h2 {
	font-size: 33px;
	font-weight: bold;
	color: #6a5d87;
}

.blinds-customer-details-field input {
	color: black;
	font-size: 16px;
	width: 100%;
	padding: 5px;
	border: 1.5px solid #747474;
	border-radius: 4px;
	margin-bottom: 8px;
}

.blinds-customer-details-field input:focus {
	outline: none;
	border-color: #4266ae !important;
	box-shadow: 0 0 10px rgba(66, 107, 174, 0.61);
}

.blinds-customer-details-required {
	font-size: 16px;
	font-weight: 400;
	color: #161615;
}

.blinds-customer-details-checkbox {
	display: flex;
	align-items: center;
	gap: 20px;
	position: relative;
}

.blinds-customer-details-checkbox input[type="checkbox"] {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width: 29px;
	height: 29px;
	border: 2px solid #4266ae;
	border-radius: 50%;
	margin: 0;
	cursor: pointer;
	position: relative;
	flex-shrink: 0;
}

/* Default state - Blue checkmark */
.blinds-customer-details-checkbox input[type="checkbox"]::after {
	content: "";
	position: absolute;
	top: 51%;
	left: 52%;
	transform: translate(-50%, -50%);
	width: 20px;
	height: 16px;
	opacity: 0;
	background-image: url("data:image/svg+xml,%3Csvg width='20' height='16' viewBox='0 0 20 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.6 15.2L14.072 7.668L19.021 2.679L16.358 0L6.6 9.842L2.663 5.871L0 8.55L6.6 15.2Z' fill='%234266AE'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
}

.blinds-customer-details-checkbox input[type="checkbox"]:checked::after {
	opacity: 1;
}

/* Valid state - Green border and checkmark */
.blinds-customer-details-checkbox input[type="checkbox"].valid-checkbox {
	border-color: #3a833c !important;
}

.blinds-customer-details-checkbox input[type="checkbox"].valid-checkbox::after {
	background-image: url("data:image/svg+xml,%3Csvg width='20' height='16' viewBox='0 0 20 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.6 15.2L14.072 7.668L19.021 2.679L16.358 0L6.6 9.842L2.663 5.871L0 8.55L6.6 15.2Z' fill='%233A833C'/%3E%3C/svg%3E");
}

/* Invalid state - Red border and checkmark */
.blinds-customer-details-checkbox input[type="checkbox"].invalid-checkbox {
	border-color: #9e0000 !important;
}

.blinds-customer-details-checkbox input[type="checkbox"].invalid-checkbox::after {
	background-image: url("data:image/svg+xml,%3Csvg width='20' height='16' viewBox='0 0 20 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.6 15.2L14.072 7.668L19.021 2.679L16.358 0L6.6 9.842L2.663 5.871L0 8.55L6.6 15.2Z' fill='%239E0000'/%3E%3C/svg%3E");
}

.blinds-customer-details-checkbox input[type="checkbox"]:focus {
	outline: none;
	box-shadow: 0 0 0 2px rgba(66, 102, 174, 0);
}

.blinds-customer-details-checkbox span {
	flex: 1;
	font-size: 18px;
}

.blinds-customer-details-submit,
.blinds-customer-details-submit:focus {
	width: 100%;
	padding: 8px;
	font-size: 26px;
	font-weight: bold;
	color: #fff;
	background: linear-gradient(to bottom, #816d9c, #544672);
	border: none;
	border-radius: 99px;
	outline: none;
	cursor: pointer;
}

.blinds-customer-details-submit:hover {
	background: linear-gradient(to top, #816d9c, #544672);
}

.blinds-customer-details-error {
	display: flex;
	align-items: center;
	gap: 8px;
	border: 1px solid #9e0000;
	background-color: #ffa4a4;
	border-radius: 4px;
	padding: 12px;
	margin-bottom: 20px;
}

.blinds-customer-details-error span {
	font-size: 18px;
	font-weight: 400;
	color: #9e0000;
}

.blinds-customer-details-error svg {
	flex-shrink: 0;
}

.blinds-customer-details-field {
	position: relative;
}

.blinds-customer-details-validation-icon {
	position: absolute;
	left: 9px;
	top: 36px;
	width: 15px;
	height: 15px;
	display: flex;
	align-items: center;
	pointer-events: none;
}

.blinds-customer-details-section .special-title-master-container {
	margin-bottom: 11px;
}

/* Adjust positioning for textarea's icon */
.blinds-customer-details-field textarea + .blinds-customer-details-validation-icon {
	top: 25px;
	transform: none;
}

.blinds-customer-details-checkbox {
	margin-bottom: -5px !important;
}

.blinds-customer-details-required.checkbox-bottom-required-label {
	margin-right: 49px;
}

@media screen and (max-width: 768px) {
	.blinds-customer-details-row {
		flex-direction: column;
		gap: 15px;
		margin-bottom: 15px;
	}

	.blinds-customer-details-field {
		width: 100%;
	}

	/* Adjust h2 size for mobile */
	.blinds-customer-details-form h2 {
		font-size: 18px;
	}

	.blinds-customer-details-field input {
		margin-bottom: 5px;
	}

	.blinds-customer-details-validation-icon {
		width: 11px;
		height: 11px;
		top: 38px;
	}

	.blinds-customer-details-checkbox {
		display: flex;
		align-items: flex-start;
	}

	.blinds-customer-details-checkbox span {
		line-height: 1.3;
		margin-bottom: 5px;
	}

	.blinds-customer-details-checkbox input[type="checkbox"] {
		height: 20px;
		width: 20px;
		margin-top: 3px;
		border-width: 1px;
	}

	.blinds-customer-details-checkbox input[type="checkbox"]::after {
		transform: scale(0.65);
		top: 1px;
		left: -1px;
	}

	.blinds-customer-details-checkbox {
		gap: 10px;
	}

	.blinds-customer-details-required.checkbox-bottom-required-label {
		margin-right: 30px;
	}

	.blinds-customer-details-submit,
	.blinds-customer-details-submit:hover {
		font-size: 22px !important;
		background: linear-gradient(to bottom, #816d9c, #544672);
	}
}

/* here are the delivery check */

.delivery-check {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0;
}

/* Search Container */
.checkout-search-wrapper {
	position: relative;
}

.checkout-city-results {
	position: absolute; /* Change from absolute to fixed */
	top: 60px;
	width: 100%;
	z-index: 2; /* Ensure it's above other elements */
	background: white;
	border: 1.5px solid #747474;
	border-radius: 0px 0px 12px 12px;
	max-height: 250px;
	overflow-y: auto;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	display: none; /* Hide by default */
	text-align: right;
}

/* Add these styles to javascript */
.checkout-city-results.visible {
	display: block;
}

.city-item {
	padding: 3px 8px;
	transition: background-color 0.2s ease;
	cursor: pointer;
	font-size: 16px;
}

.city-item.active {
	background-color: #6494fa !important;
	color: white;
}

.city-item:hover {
	background-color: #f0ebf7;
}

/* No Results Text */
.blinds-checkout-no-results-text {
	display: none;
	color: #ff0000;
	font-size: 0.9em;
	margin: 5px 0;
}

.city-search-loading {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	align-items: center;
	gap: 10px;
	color: #6a5d87;
}

.loading-spinner {
	display: inline-block;
	width: 20px;
	height: 20px;
	border: 2px solid #6a5d87;
	border-radius: 50%;
	border-top-color: transparent;
	animation: spin 1s linear infinite;
}

.blinds-checkout-delivery-limit,
.blinds-checkout-delivery-no-arrival,
.blinds-checkout-delivery-approved-arrival {
	display: none;
}
.checkout-delivery-alert {
	position: relative;
}
.checkout-delivery-alert p {
	position: relative;
	font-size: 15.5px;
	width: 100%;
	border-radius: 4px;
	padding: 3px 11px;
	text-align: center;
	line-height: 19px;
	background-color: white;
	z-index: 1;
	margin: 0;
}
.checkout-delivery-alert div {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 4px;
	right: 4px;
	border-radius: 4px;
}
.blinds-checkout-delivery-limit p {
	color: #4266ae;
	border: solid 1.5px #4266ae;
}
.blinds-checkout-delivery-limit div {
	background-color: #a7c7fb;
}
.blinds-checkout-delivery-no-arrival p {
	color: #9e0000;
	border: solid 1.5px #9e0000;
}
.blinds-checkout-delivery-no-arrival div {
	background-color: #ffa4a4;
}
.blinds-checkout-delivery-approved-arrival p {
	color: #3a833c;
	border: solid 1.5px #3a833c;
}
.blinds-checkout-delivery-approved-arrival div {
	background-color: #77b379;
}

@keyframes spin {
	to {
		transform: rotate(360deg);
	}
}

@media screen and (max-width: 782px) {
	/* Search Container */
	.city-results {
		border-radius: 12px;
		max-height: 250px;
	}

	.city-item {
		padding: 3px 8px;
		font-size: 16px;
	}

	.city-item:hover {
		background-color: #f0ebf7;
	}

	/* No Results Text */
	.blinds-checkout-no-results-text {
		display: none;
		color: #ff0000;
		font-size: 0.9em;
		margin: 5px 0;
	}
}
