/**
 * Luxury Flatpickr theme — Minh Phát Hotel
 */

.flatpickr-calendar {
	background: #fffef9;
	border: 1px solid #e8e0cd;
	border-radius: 14px;
	box-shadow: 0 16px 40px rgba(15, 35, 28, 0.14);
	font-family: Montserrat, "Helvetica Neue", Arial, sans-serif;
	padding: 8px 4px 10px;
	width: 308px;
}

.flatpickr-calendar.arrowTop:before,
.flatpickr-calendar.arrowTop:after {
	border-bottom-color: #fffef9;
}

.flatpickr-calendar.arrowBottom:before,
.flatpickr-calendar.arrowBottom:after {
	border-top-color: #fffef9;
}

.flatpickr-months {
	padding: 6px 8px 10px;
	align-items: center;
}

.flatpickr-months .flatpickr-month {
	height: 40px;
	color: #03281f;
	fill: #03281f;
}

.flatpickr-current-month {
	font-size: 15px;
	font-weight: 600;
	padding-top: 6px;
	color: #03281f;
}

.flatpickr-current-month .flatpickr-monthDropdown-months,
.flatpickr-current-month input.cur-year {
	font-weight: 600;
	color: #03281f;
	background: transparent;
}

.flatpickr-current-month .flatpickr-monthDropdown-months:hover,
.flatpickr-current-month input.cur-year:hover {
	background: rgba(212, 166, 42, 0.12);
}

.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month {
	width: 32px;
	height: 32px;
	padding: 6px;
	border-radius: 50%;
	fill: #073b2d;
	color: #073b2d;
	top: 10px;
	transition: background 0.2s ease, fill 0.2s ease;
}

.flatpickr-months .flatpickr-prev-month:hover,
.flatpickr-months .flatpickr-next-month:hover {
	background: rgba(212, 166, 42, 0.18);
	fill: #d4a62a;
	color: #d4a62a;
}

.flatpickr-weekdays {
	background: transparent;
	padding: 0 6px;
}

span.flatpickr-weekday {
	color: #7a836f;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.flatpickr-days {
	padding: 4px 6px 6px;
	width: 100%;
}

.dayContainer {
	width: 100%;
	min-width: 100%;
	max-width: 100%;
}

.flatpickr-day {
	color: #1d2a24;
	border-radius: 10px;
	border: 1px solid transparent;
	font-weight: 500;
	max-width: 38px;
	height: 38px;
	line-height: 38px;
	margin: 1px 0;
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.flatpickr-day:hover,
.flatpickr-day:focus {
	background: rgba(212, 166, 42, 0.16);
	border-color: #f1e3b6;
	color: #03281f;
}

.flatpickr-day.today {
	border-color: #d4a62a;
	color: #073b2d;
	font-weight: 700;
}

.flatpickr-day.today:hover {
	background: rgba(212, 166, 42, 0.2);
	border-color: #d4a62a;
}

.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover,
.flatpickr-day.selected:focus,
.flatpickr-day.startRange:focus,
.flatpickr-day.endRange:focus {
	background: #073b2d;
	border-color: #073b2d;
	color: #fff;
	box-shadow: 0 4px 12px rgba(7, 59, 45, 0.28);
}

.flatpickr-day.inRange {
	background: rgba(212, 166, 42, 0.18);
	border-color: transparent;
	box-shadow: none;
	color: #03281f;
}

.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover {
	color: #c5c0b5;
	background: transparent;
	border-color: transparent;
}

.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay {
	color: #b7b2a6;
}

.flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)),
.flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n+1)),
.flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n+1)) {
	box-shadow: -10px 0 0 #073b2d;
}

/* Input field polish when flatpickr is active */
.mph-booking-form__input.mph-datepicker,
.mph-booking-form__input.flatpickr-input {
	cursor: pointer;
	caret-color: transparent;
}

.mph-booking-form__input.flatpickr-input:focus {
	outline: none;
}

/* Hide native picker chrome if any date inputs remain */
.mph-booking-form__input[type="date"]::-webkit-calendar-picker-indicator {
	opacity: 0;
	display: none;
}

.mph-booking-form__field:has(.flatpickr-input:focus),
.mph-booking-form__field:has(.mph-datepicker:focus) {
	box-shadow: inset 0 0 0 1px #f1e3b6;
	background: rgba(241, 227, 182, 0.14);
}
