/*==================================================
 Bareilly Taxi Premium Theme
 Booking Engine CSS
 Part : 1
 File : assets/css/booking.css
==================================================*/

.bt-booking-engine{

	position:relative;

	padding:90px 0;

	background:#f8fafc;

}

.bt-booking-engine::before{

	content:"";

	position:absolute;

	top:0;

	left:0;

	right:0;

	height:280px;

	background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%);

	z-index:1;

}

.bt-booking-engine .bt-container{

	position:relative;

	z-index:2;

}

/*==================================
 Header
===================================*/

.bt-booking-header{

	max-width:820px;

	margin:0 auto 50px;

	text-align:center;

}

.bt-section-badge{

	display:inline-flex;

	align-items:center;

	justify-content:center;

	padding:10px 22px;

	background:#e0f2fe;

	color:#2563eb;

	border-radius:50px;

	font-size:14px;

	font-weight:700;

	margin-bottom:18px;

}

.bt-booking-header h2{

	font-size:42px;

	font-weight:800;

	line-height:1.2;

	color:#0f172a;

	margin-bottom:18px;

}

.bt-booking-header p{

	font-size:18px;

	line-height:1.8;

	color:#64748b;

}

/*==================================
 Tabs
===================================*/

.bt-booking-tabs{

	display:flex;

	flex-wrap:wrap;

	justify-content:center;

	gap:15px;

	margin-bottom:40px;

}

.bt-tab{

	padding:14px 28px;

	border:none;

	border-radius:60px;

	background:#ffffff;

	color:#0f172a;

	font-size:15px;

	font-weight:700;

	cursor:pointer;

	box-shadow:0 12px 30px rgba(15,23,42,.08);

	transition:.30s;

}

.bt-tab:hover{

	transform:translateY(-3px);

	background:#2563eb;

	color:#ffffff;

}

.bt-tab.active{

	background:#2563eb;

	color:#ffffff;

}

/*==================================
 Main Form
===================================*/

.bt-booking-form{

	background:#ffffff;

	border-radius:28px;

	padding:40px;

	box-shadow:0 25px 70px rgba(15,23,42,.10);

	border:1px solid #edf2f7;

}

.bt-booking-grid{

	display:grid;

	grid-template-columns:repeat(3,1fr);

	gap:22px;

}

.bt-form-group{

	display:flex;

	flex-direction:column;

}

.bt-form-full{

	grid-column:1/-1;

}

/*==================================
 Labels
===================================*/

.bt-form-group label{

	font-size:14px;

	font-weight:700;

	color:#334155;

	margin-bottom:10px;

}/*==================================================
 Premium Inputs
 Booking CSS Part : 2
==================================================*/

.bt-form-group input,
.bt-form-group select,
.bt-form-group textarea{

	width:100%;

	height:58px;

	padding:0 18px;

	border:1px solid #dbe4ee;

	border-radius:16px;

	background:#ffffff;

	font-size:15px;

	font-weight:500;

	color:#0f172a;

	outline:none;

	transition:.30s;

}

.bt-form-group textarea{

	height:120px;

	padding:18px;

	resize:vertical;

}

.bt-form-group input::placeholder,
.bt-form-group textarea::placeholder{

	color:#94a3b8;

}

.bt-form-group input:focus,
.bt-form-group select:focus,
.bt-form-group textarea:focus{

	border-color:#2563eb;

	box-shadow:0 0 0 4px rgba(37,99,235,.10);

}

/*==================================
 Booking Footer
===================================*/

.bt-booking-footer{

	display:flex;

	align-items:center;

	justify-content:space-between;

	gap:30px;

	margin-top:40px;

	padding-top:35px;

	border-top:1px solid #edf2f7;

}

/*==================================
 Fare Box
===================================*/

.bt-fare-box{

	flex:1;

	padding:28px;

	border-radius:22px;

	background:linear-gradient(135deg,#2563eb,#1d4ed8);

	color:#ffffff;

	box-shadow:0 20px 50px rgba(37,99,235,.25);

}

.bt-fare-title{

	display:flex;

	align-items:center;

	gap:10px;

	font-size:16px;

	font-weight:700;

	margin-bottom:18px;

}

.bt-fare-price{

	font-size:42px;

	font-weight:800;

	line-height:1;

	margin-bottom:12px;

}

.bt-fare-box small{

	display:block;

	line-height:1.7;

	opacity:.90;

}

/*==================================
 Buttons
===================================*/

.bt-booking-actions{

	display:flex;

	flex-direction:column;

	gap:15px;

	width:320px;

}

.bt-book-submit,
.bt-btn-whatsapp,
.bt-btn-call{

	display:flex;

	align-items:center;

	justify-content:center;

	gap:10px;

	height:58px;

	border-radius:16px;

	text-decoration:none;

	font-size:16px;

	font-weight:700;

	transition:.30s;

	border:none;

	cursor:pointer;

}

.bt-book-submit{

	background:#f59e0b;

	color:#ffffff;

	box-shadow:0 18px 35px rgba(245,158,11,.28);

}

.bt-book-submit:hover{

	background:#d97706;

	transform:translateY(-3px);

}

.bt-btn-whatsapp{

	background:#22c55e;

	color:#ffffff;

}

.bt-btn-whatsapp:hover{

	background:#16a34a;

	transform:translateY(-3px);

}

.bt-btn-call{

	background:#2563eb;

	color:#ffffff;

}

.bt-btn-call:hover{

	background:#1d4ed8;

	transform:translateY(-3px);

}

/*==================================
 Trust Strip
===================================*/

.bt-booking-trust{

	display:grid;

	grid-template-columns:repeat(6,1fr);

	gap:18px;

	margin-top:45px;

}

.bt-booking-trust .bt-trust-item{

	display:flex;

	align-items:center;

	justify-content:center;

	gap:10px;

	padding:18px;

	background:#ffffff;

	border-radius:18px;

	font-size:14px;

	font-weight:700;

	color:#0f172a;

	box-shadow:0 12px 35px rgba(15,23,42,.06);

	text-align:center;

}

.bt-booking-trust .bt-trust-item i{

	color:#22c55e;

	font-size:18px;

}

/*==================================
 Hover Effects
===================================*/

.bt-booking-form,
.bt-booking-trust .bt-trust-item,
.bt-tab,
.bt-fare-box{

	transition:all .30s ease;

}

.bt-booking-trust .bt-trust-item:hover{

	transform:translateY(-6px);

	box-shadow:0 20px 45px rgba(15,23,42,.10);

}

/*==================================
 Responsive
===================================*/

@media(max-width:1200px){

	.bt-booking-grid{

		grid-template-columns:repeat(2,1fr);

	}

	.bt-booking-footer{

		flex-direction:column;

		align-items:stretch;

	}

	.bt-booking-actions{

		width:100%;

	}

	.bt-booking-trust{

		grid-template-columns:repeat(3,1fr);

	}

}

@media(max-width:768px){

	.bt-booking-engine{

		padding:70px 0;

	}

	.bt-booking-header h2{

		font-size:32px;

	}

	.bt-booking-header p{

		font-size:16px;

	}

	.bt-booking-form{

		padding:25px;

		border-radius:22px;

	}

	.bt-booking-grid{

		grid-template-columns:1fr;

	}

	.bt-booking-trust{

		grid-template-columns:repeat(2,1fr);

	}

	.bt-tab{

		flex:1 1 calc(50% - 10px);

	}

}

@media(max-width:480px){

	.bt-booking-header h2{

		font-size:28px;

	}

	.bt-booking-form{

		padding:18px;

	}

	.bt-booking-trust{

		grid-template-columns:1fr;

	}

	.bt-tab{

		width:100%;

	}

	.bt-fare-price{

		font-size:34px;

	}

}