/* Vedanta Booking — public form layout.
   Inputs reuse the theme's Tailwind classes; this file handles structure. */

/* Hero reuses theme classes (container + border-background lines +
   trigger-header-black). Only the vertical padding comes from here: Tailwind's
   py-40 / py-52 aren't in the theme's compiled (purged) CSS, so set it directly
   to give the hero its height and clear the fixed header. */
.vb-hero > .container {
	padding-top: 150px;
	padding-bottom: 88px;
}
@media (min-width: 1024px) {
	.vb-hero > .container {
		padding-top: 210px;
		padding-bottom: 130px;
	}
}

/* White form section */
.vb-booking {
	background: #fff;
}
/* Width/centering come from the theme's .container so the form aligns with the
   header, hero and footer; this only adds the vertical rhythm + text colour. */
.vb-booking__inner {
	padding-top: 72px;
	padding-bottom: 96px;
	color: #14110f;
}

.vb-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 40px;
}
@media (min-width: 1024px) {
	.vb-grid {
		/* 75% details / 25% date+time (3:1 ratio fills the row after the gap) */
		grid-template-columns: 3fr 1fr;
		gap: 64px;
	}
}

.vb-field {
	margin-bottom: 22px;
}
.vb-field > label {
	display: block;
	margin-bottom: 8px;
	font-size: 15px;
}

.vb-row2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}

/* Add-ons */
.vb-addons {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px 28px;
	margin-top: 6px;
}
@media (max-width: 600px) {
	.vb-addons { grid-template-columns: 1fr; }
}
.vb-addon {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 14px;
	line-height: 1.35;
	cursor: pointer;
}
.vb-addon input { margin-top: 3px; }

/* Preferred-time slots */
.vb-timeslots {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
	margin-top: 6px;
}
.vb-timeslot {
	border: 1px solid #dcdcdc;
	background: #fff;
	color: #14110f;
	padding: 13px 10px;
	border-radius: 8px;
	font-weight: 300;
	font-size: 15px;
	cursor: pointer;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.vb-timeslot:hover { border-color: #14110f; }
.vb-timeslot.is-selected {
	background: #14110f;
	color: #fff;
	border-color: #14110f;
}

/* Inline calendar — full column width, larger cells */
.vb-calendar { margin-top: 6px; }
.vb-calendar .flatpickr-calendar.inline {
	box-shadow: none;
	width: 100% !important;
	max-width: 100% !important;
	border: 1px solid #ececec;
	border-radius: 10px;
	padding: 12px 16px 18px;
}
.vb-calendar .flatpickr-rContainer,
.vb-calendar .flatpickr-weekdaycontainer,
.vb-calendar .flatpickr-weekdays,
.vb-calendar .flatpickr-days,
.vb-calendar .dayContainer {
	width: 100% !important;
	min-width: 100% !important;
	max-width: 100% !important;
}
.vb-calendar .dayContainer { justify-content: flex-start; }
.vb-calendar span.flatpickr-day {
	max-width: 14.2857%;
	flex-basis: 14.2857%;
	height: 50px;
	line-height: 50px;
	border-radius: 6px;
	font-size: 15px;
}
.vb-calendar .flatpickr-weekday { font-size: 13px; font-weight: 600; }
.vb-calendar .flatpickr-current-month { font-size: 18px; }
.vb-calendar .flatpickr-day.selected,
.vb-calendar .flatpickr-day.selected:hover {
	background: #14110f;
	border-color: #14110f;
}

/* Submit row */
.vb-submit-row {
	margin-top: 40px;
	text-align: center;
}
.vb-terms {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	margin-bottom: 22px;
}
.vb-terms a { text-decoration: underline; }

.vb-actions .btn-black {
	min-width: 220px;
}
.vb-actions .btn-black.is-loading {
	cursor: progress;
	opacity: 0.9;
}

/* Submit loading spinner */
.vb-spinner {
	display: inline-block;
	width: 16px;
	height: 16px;
	margin-right: 10px;
	border: 2px solid rgba(255, 255, 255, 0.35);
	border-top-color: #fff;
	border-radius: 50%;
	vertical-align: -3px;
	animation: vb-spin 0.6s linear infinite;
}
@keyframes vb-spin {
	to { transform: rotate(360deg); }
}

.vb-feedback { margin-top: 16px; font-size: 14px; }
.vb-feedback.is-error { color: #b32d2e; }

/* Honeypot */
.vb-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* Success */
.vb-success {
	text-align: center;
	padding: 56px 16px;
}
.vb-success__title {
	font-size: 32px;
	text-transform: uppercase;
	margin-bottom: 12px;
}
.vb-ref {
	margin-top: 10px;
	letter-spacing: .04em;
	opacity: .7;
}