.badran-booking-wrap {
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(circle at 92% 0%, rgba(226,196,127,.24), transparent 28%),
		linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,250,240,.92));
	border: 1px solid rgba(184, 138, 68, .22);
	border-radius: 28px;
	padding: clamp(1.1rem, 4vw, 2.6rem);
	box-shadow: 0 30px 90px rgba(7, 17, 31, 0.14);
	font-family: "IBM Plex Sans Arabic", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.badran-booking-wrap::before {
	content: "";
	position: absolute;
	inset-inline: 1.5rem;
	top: 0;
	height: 4px;
	background: linear-gradient(90deg, #b88a44, rgba(226,196,127,0));
}
.badran-booking-form {
	position: relative;
	z-index: 1;
	display: grid;
	gap: 1.25rem;
}
.badran-booking-form h2 {
	margin: 0;
	color: #07111f;
	font-weight: 800;
	font-size: clamp(1.55rem, 3vw, 2.35rem);
	line-height: 1.15;
}
.booking-progress {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: .55rem;
}
.booking-progress span {
	height: 7px;
	border-radius: 999px;
	background: rgba(7,17,31,.12);
	font-size: 0;
}
.booking-progress span.is-active {
	background: linear-gradient(135deg, #b88a44, #e2c47f);
}
.booking-step {
	display: none;
	animation: bookingFade .22s ease;
}
.booking-step.is-active {
	display: grid;
	gap: 1rem;
}
.booking-step-head {
	display: grid;
	gap: .35rem;
}
.booking-step-head span {
	color: #b88a44;
	font-weight: 800;
	font-size: .9rem;
}
.booking-step-head h3 {
	margin: 0;
	color: #07111f;
	font-size: clamp(1.15rem, 2vw, 1.45rem);
	font-weight: 800;
}
.booking-type-grid,
.booking-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
}
.booking-choice,
.booking-field,
.booking-consent,
.booking-review-box {
	border: 1px solid rgba(184, 138, 68, .18);
	background: rgba(255,255,255,.8);
	border-radius: 18px;
	box-shadow: 0 18px 45px rgba(7, 17, 31, .08);
}
.booking-choice {
	position: relative;
	cursor: pointer;
	padding: 1.05rem;
	display: grid;
	gap: .35rem;
}
.booking-choice input {
	position: absolute;
	inset-block-start: .9rem;
	inset-inline-end: .9rem;
	accent-color: #b88a44;
}
.booking-choice strong,
.booking-field span {
	color: #07111f;
	font-weight: 800;
}
.booking-choice small,
.booking-field small,
.booking-review-box p {
	color: #667085;
	line-height: 1.8;
}
.booking-field {
	display: grid;
	gap: .5rem;
	padding: .9rem;
}
.booking-field input,
.booking-field select,
.booking-field textarea {
	width: 100%;
	min-height: 52px;
	border: 1px solid rgba(184, 138, 68, .24);
	border-radius: 15px;
	padding: .9rem 1rem;
	font: inherit;
	background: rgba(255,250,240,.74);
	color: #172033;
	transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.booking-field textarea {
	min-height: 145px;
	resize: vertical;
}
.booking-field input:focus,
.booking-field select:focus,
.booking-field textarea:focus {
	border-color: #b88a44;
	background: #fff;
	box-shadow: 0 0 0 .22rem rgba(184,138,68,.14);
	outline: 0;
}
.booking-full {
	grid-column: 1 / -1;
}
.booking-conditional {
	display: none;
}
.booking-conditional.is-active {
	display: grid;
	gap: 1rem;
}
.booking-review-box {
	padding: 1.2rem;
	display: grid;
	gap: .7rem;
}
.booking-review-total {
	color: #07111f;
	font-size: 1.2rem;
}
.booking-consent {
	display: flex;
	gap: .7rem;
	align-items: flex-start;
	padding: .95rem 1rem;
	color: #344054;
	font-weight: 650;
	line-height: 1.7;
}
.booking-consent input {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	margin-top: .42rem;
	accent-color: #b88a44;
}
.booking-nav-actions {
	display: flex;
	gap: .8rem;
	justify-content: space-between;
}
.booking-submit,
.booking-next,
.booking-prev,
.badran-booking-form .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid rgba(226,196,127,.78);
	border-radius: 999px;
	padding: .95rem 1.45rem;
	background: linear-gradient(135deg, #b88a44, #e2c47f);
	color: #07111f;
	font-weight: 800;
	cursor: pointer;
	box-shadow: 0 18px 42px rgba(184, 138, 68, .24);
	transition: transform .22s ease, box-shadow .22s ease;
	min-height: 52px;
	text-decoration: none;
}
.booking-prev {
	background: #07111f;
	color: #fff;
	border-color: rgba(255,255,255,.18);
}
.booking-submit:hover,
.booking-next:hover,
.booking-prev:hover,
.badran-booking-form .button:hover {
	transform: translateY(-2px);
	box-shadow: 0 22px 52px rgba(184, 138, 68, .32);
}
.booking-hp {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	opacity: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	pointer-events: none;
}
.booking-notice {
	position: relative;
	z-index: 1;
	border-radius: 16px;
	padding: .95rem 1rem;
	margin-bottom: 1rem;
	font-weight: 800;
}
.booking-success { background: #e9f8ef; color: #17613d; border: 1px solid #bce6cc; }
.booking-error { background: #fff2f0; color: #8a1f11; border: 1px solid #f0b8b0; }
.booking-info { background: #eef4ff; color: #1849a9; border: 1px solid #b2ccff; }
@keyframes bookingFade {
	from { opacity: 0; transform: translateY(8px); }
	to { opacity: 1; transform: translateY(0); }
}
@media (max-width: 680px) {
	.badran-booking-wrap {
		border-radius: 22px;
		padding: 1rem;
	}
	.booking-type-grid,
	.booking-grid {
		grid-template-columns: 1fr;
	}
	.booking-nav-actions,
	.booking-submit,
	.booking-next,
	.booking-prev,
	.badran-booking-form .button {
		width: 100%;
	}
	.booking-nav-actions {
		display: grid;
		grid-template-columns: 1fr 1fr;
	}
	.booking-prev[hidden] + .booking-next {
		grid-column: 1 / -1;
	}
}

