$color_1: #000;
$color_2: #fff;
$color_3: #A8A8A8;
$color_4: #191E29;
$color_5: #ff0000;
$color_6: #FFF;
$color_7: #008000;
$background-color_1: #f1f1f1;
$background-color_2: #F1F1F1;
$background-color_3: #191E29;
$background-color_4: #fff;

/* Booking Form Css end  */
/* Safari */
@-webkit-keyframes spin {
	0% {
		-webkit-transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
	}
}
@keyframes spin {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}
/* datepicker css start  */
/* new css for testing  */
/* checkout page css start */
/* checkout page css end */
/* static time show in datepicker popup css start */
/* static time show in datepicker popup css end */
/* media query */
.icrmw_booking_form_main {
	width: 100%;
	display: block;
	margin-top: 20px;
	.icrmw_tabs {
		overflow: hidden;
		background-color: $background-color_1;
		border-top-left-radius: 10px;
		border-top-right-radius: 10px;
		display: flex;
		.icrmw-tab {
			text-transform: capitalize;
			float: left;
			border: none;
			outline: none;
			cursor: pointer;
			padding: 14px 16px;
			font-size: 18px;
			font-weight: 500;
			width: 100%;
			color: $color_1;
			background-color: $background-color_2;
			border-radius: 0px;
			&:hover {
				color: $color_1;
				background-color: $background-color_2;
			}
		}
		.icrmw-tab.active {
			background-color: $background-color_3;
			color: $color_2;
			&:hover {
				background-color: $background-color_3;
				color: $color_2;
			}
		}
	}
	.icrmw_form_details {
		border: 1px solid #F5F5F5;
		box-shadow: 0px 4px 14px rgba(0,0,0,8%);
		border-bottom-left-radius: 10px;
		border-bottom-right-radius: 10px;
		background-color: $background-color_4;
		.icrmw-tab-content {
			display: none;
			padding: 20px 16px 16px 16px;
			border-top: none;
			label {
				font-weight: 500;
				font-size: 14px;
				font-style: normal;
				line-height: 30px;
				text-align: left;
				color: $color_1;
				text-transform: capitalize;
			}
			.icrmw_passengers_field {
				.icrmw-passengers-content {
					grid-template-columns: 6fr 6fr;
					display: grid;
					grid-gap: 25px;
					clear: both;
					justify-content: space-between;
					input {
						&::-webkit-outer-spin-button {
							-webkit-appearance: none;
							margin: 0;
						}
						&::-webkit-inner-spin-button {
							-webkit-appearance: none;
							margin: 0;
						}
						&:focus {
							outline: none;
						}
						border: none;
						text-align: center;
						appearance: none;
						color: $color_1;
						font-size: 14px;
						font-style: normal;
						font-weight: 400;
						line-height: normal;
						height: auto;
						width: 60%;
						background: transparent;
						margin-bottom: 0px;
						padding: unset;
						outline: none;
						box-shadow: none;
						-moz-appearance: textfield;
					}
					.icrmw-passenger-field-group {
						border-radius: 30px;
						padding: 12px;
						border: 1px solid rgba(19, 45, 70, 0.30);
						margin-top: 8px;
						height: 38px;
						vertical-align: middle;
						align-items: center;
						display: flex;
						justify-content: space-around;
						line-height: normal;
					}
				}
			}
			.icrmw-request-tab {
				.icrmw_phone_field {
					input {
						&::-webkit-inner-spin-button {
							-webkit-appearance: none;
							margin: 0;
						}
					}
				}
				input[type="number"] {
					-moz-appearance: textfield;
					&::-webkit-inner-spin-button {
						-webkit-appearance: none;
						-moz-appearance: textfield;
						margin: 0;
					}
					&::-webkit-outer-spin-button {
						-webkit-appearance: none;
						-moz-appearance: textfield;
						margin: 0;
					}
					&::-moz-number-spin-box {
						-webkit-appearance: none;
						-moz-appearance: textfield;
						margin: 0;
					}
				}
			}
			.icrmw_error_msg {
				label {
					color: $color_5;
					font-weight: 500;
					font-size: 12px;
					text-align: left;
					text-transform: inherit;
				}
				display: none;
				margin-bottom: 10px;
			}
			.icrmw_error_msg.active {
				display: block;
			}
		}
		.icrmw-tab-content.active {
			display: block;
			position: relative;
		}
		.icrmw_form_group {
			input.icrmw_date_time {
				border-radius: 30px;
				padding: 12px;
				border: 1px solid rgba(19, 45, 70, 0.30);
				margin-bottom: 20px;
				background: transparent;
				color: $color_1;
				height: 38px;
				max-width: 100%;
				box-shadow: none;
				text-align: center;
				font-size: 14px;
				font-style: normal;
				font-weight: 400;
				line-height: normal;
				margin: 8px 0px 20px;
				&::placeholder {
					color: $color_3;
					font-size: 14px;
					font-style: normal;
					font-weight: 400;
				}
			}
			.icrmw-passenger-field-group {
				span {
					text-align: center;
					font-size: 20px;
					font-style: normal;
					font-weight: 500;
					width: 20%;
					cursor: pointer;
				}
				span.icrmw_disabled {
					cursor: not-allowed;
				}
			}
		}
		.icrmw_total_amount {
			padding: 0px 0px 25px;
			margin-top: 25px;
			grid-template-columns: 6fr 6fr;
			display: grid;
			.icrmw_currency {
				color: $color_4;
				font-size: 20px;
				font-weight: 700;
				text-align: right;
			}
			.icrmw_amount_label {
				color: $color_4;
				font-size: 14px;
				margin-bottom: 0px;
				display: flex;
				vertical-align: middle;
				align-items: center;
				text-transform: capitalize;
			}
		}
		.icrmw_footer_group{
			display: block;
            border-top: 1px solid #C4C4C4;
            margin-top: 40px;
		}
		.icrmw_btn_group {
			button[type="submit"] {
				border: none;
				cursor: pointer;
				background: #191E29;
				width: 100%;
				color: $color_2;
				text-transform: capitalize;
				font-weight: 500;
				padding: 13px 10px;
				border-radius: 50px;
				font-size: 18px;
				letter-spacing: 0.4px;
				margin-top: 0px;
				&:hover {
					text-decoration: none;
				}
			}
			padding: 16px 2px 0px;
			border-top: 1px solid #C4C4C4;
			clear: both;
		}
		.icrmw-request-tab {
			input {
				border-radius: 30px;
				border: 1px solid rgba(19, 45, 70, 0.30);
				padding: 12px;
				gap: 10px;
				margin: 8px 0px 20px;
				background: transparent;
				height: 38px;
				box-shadow: none;
				max-width: 100%;
				&::placeholder {
					color: $color_3;
					font-size: 14px;
					font-style: normal;
					font-weight: 400;
					line-height: 150%;
				}
				&:focus {
					border: 1px solid rgba(19, 45, 70, 0.30);
				}
				&:focus-visible {
					border: 1px solid rgba(19, 45, 70, 0.30);
				}
			}
			.icrmw_form_group {
				display: flex;
				flex-direction: column;
			}
		}
		span.icrmw_required {
			color: $color_5;
		}
		.form-group {
			margin-bottom: 0px;
		}
	}
	.icrmw_loader {
		border: 10px solid #f3f3f3;
		border-radius: 50%;
		border-top: 10px solid #000;
		width: 90px;
		height: 90px;
		-webkit-animation: spin 2s linear infinite;
		animation: spin 2s linear infinite;
		position: absolute;
		bottom: 50%;
		left: 40%;
		display: none;
	}
	.icrmw_rloader {
		border: 10px solid #f3f3f3;
		border-radius: 50%;
		border-top: 10px solid #000;
		width: 90px;
		height: 90px;
		-webkit-animation: spin 2s linear infinite;
		animation: spin 2s linear infinite;
		position: absolute;
		bottom: 50%;
		left: 40%;
		display: none;
	}
	.icrmw_loader.active {
		display: block;
	}
	.icrmw_rloader.active {
		display: block;
	}
	.icrmw_loader_effect {
		opacity: 0.3;
		pointer-events: none;
	}
	.icrmw_booking_form {
		margin-bottom: 0px;
		.icrmw_form_group {
			input {
				&.icrmw_date_time {
					font-weight: 600;
				}
			}
		}
		.icrmw_bdate_picker {
			display: flex;
			flex-direction: column;
		}
	}
	
	.icrmw-request-tab {
		.icrmw_success_msg {
			display: none;
			margin-bottom: 20px;
			color: $color_7;
			font-weight: 600;
			font-size: 14px;
			text-align: left;
		}
		.icrmw_success_msg.active {
			display: block;
		}
		.icrmw_mail_error_msg {
			display: none;
			margin-bottom: 20px;
			color: $color_5;
			font-weight: 600;
			font-size: 14px;
			text-align: left;
		}
		.icrmw_mail_error_msg.active{
			display: block;
		}
		
	}
}
.single-product {
	.daterangepicker {
		z-index: 999999;
	}
}
.daterangepicker {
	.drp-buttons {
		.applyBtn {
			border-radius: 10.849px;
			background: #000;
			box-shadow: 19.37296485900879px 19.37296485900879px 15.498372077941895px 0px rgba(0, 0, 0, 0.10);
			color: $color_6;
			text-align: center;
			font-size: 16px;
			font-style: normal;
			font-weight: 500;
			line-height: 24px;
		}
		.cancelBtn {
			border-radius: 10.849px;
			background: #000;
			box-shadow: 19.37296485900879px 19.37296485900879px 15.498372077941895px 0px rgba(0, 0, 0, 0.10);
			color: $color_6;
			text-align: center;
			font-size: 16px;
			font-style: normal;
			font-weight: 500;
			line-height: 24px;
		}
	}
	.icrmw_cin_cout {
		text-align: center;
		display: flex;
		align-items: center;
		float: left;
		margin-bottom: 10px;
		.icrmw_checkin_time {
			margin-right: 10px;
			label {
				font-size: 14px;
			}
			.cin_cout_content {
				font-size: 13px;
				margin-top: 8px;
				font-weight: 600;
			}
		}
		.icrmw_checkout_time {
			label {
				font-size: 14px;
			}
			.cin_cout_content {
				font-size: 13px;
				margin-top: 8px;
				font-weight: 600;
			}
		}
	}
	.icrmw_cin_cout {
		.icrmw_checkin_time {
			.label {
				font-size: 12px;
			}
		}
		.icrmw_checkout_time {
			.label {
				font-size: 12px;
			}
		}
	}
}
.woocommerce-page.woocommerce-checkout {
	#main {
		form {
			#order_review {
				td.product-name {
					display: block;
					width: 100%;
				}
			}
		}
	}
}
body.woocommerce-checkout {
	.woocommerce-checkout-review-order-table {
		.product-name {
			dl.variation {
				margin-top: 20px;
			}
		}
	}
}
body.woocommerce-cart {
	.woocommerce-cart-form {
		.product-name {
			dl.variation {
				margin-top: 20px;
			}
		}
	}
}
.woocommerce-checkout-review-order-table {
	.cart_item {
		.product-name {
			dd {
				p {
					line-height: inherit;
				}
			}
		}
	}
}
@media (min-width: 320px) and (max-width: 768px) {
	.daterangepicker {
		.drp-selected {
			margin-bottom: 20px;
			line-height: normal;
			width: 100%;
		}
		.icrmw_cin_cout {
			float: none;
			justify-content: center;
			margin-top: 5px;
		}
	}
	.daterangepicker.show-calendar {
		.drp-buttons {
			text-align: center;
		}
	}
}
