/**
 * Dar D'Art Luz — Flatpickr theming on top of flatpickr.min.css.
 * Reuses base.css custom properties: --or (#FFD60A), --charbon (#3D4528),
 * --ivoire, --blanc, --gris-doux.
 */

/* Trigger input look: native date inputs are converted to readonly text — keep them tappable */
.darluz-reservation input[name="checkin"],
.darluz-reservation input[name="checkout"],
.booking-bar input[name="checkin"],
.booking-bar input[name="checkout"],
.be-field input[name="checkin"],
.be-field input[name="checkout"],
input[data-darluz-checkin],
input[data-darluz-checkout] {
	cursor: pointer;
	background-image: none;
}

/* Calendar shell — soft shadow, rounded, ivoire bg */
.flatpickr-calendar {
	font-family: var(--font-sans, 'Inter', system-ui, sans-serif) !important;
	box-shadow: 0 24px 60px rgba(61, 69, 40, 0.18), 0 6px 18px rgba(61, 69, 40, 0.08) !important;
	border: 1px solid rgba(61, 69, 40, 0.08) !important;
	border-radius: 12px !important;
	overflow: hidden;
	background: var(--blanc, #FDFBF7) !important;
}

/* Month / year header */
.flatpickr-months {
	background: var(--charbon, #3D4528);
	padding: 10px 0;
}
.flatpickr-months .flatpickr-month,
.flatpickr-current-month,
.flatpickr-current-month input.cur-year,
.flatpickr-monthDropdown-months {
	color: var(--blanc, #FDFBF7) !important;
	font-family: var(--font-serif, 'Playfair Display', Georgia, serif) !important;
	font-weight: 600;
}
.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month {
	color: var(--blanc, #FDFBF7) !important;
	fill: var(--blanc, #FDFBF7) !important;
	padding: 10px;
	top: 4px;
}
.flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-months .flatpickr-next-month:hover svg {
	fill: var(--or, #FFD60A) !important;
}
.flatpickr-monthDropdown-months {
	background: var(--charbon, #3D4528) !important;
}
.flatpickr-current-month input.cur-year {
	background: transparent;
	border: none;
}

/* Weekday labels */
.flatpickr-weekdays {
	background: var(--ivoire, #F5EFE0);
	padding: 6px 0;
}
.flatpickr-weekday {
	color: var(--charbon, #3D4528) !important;
	font-weight: 600 !important;
	font-size: 0.72rem !important;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* Day cells */
.flatpickr-day {
	color: var(--charbon, #3D4528);
	border-radius: 6px !important;
	margin: 1px;
	font-weight: 500;
	font-size: 0.88rem;
}
.flatpickr-day:hover {
	background: rgba(255, 214, 10, 0.18);
	border-color: rgba(255, 214, 10, 0.3);
}
.flatpickr-day.today {
	border-color: var(--or, #FFD60A) !important;
	font-weight: 700;
}
.flatpickr-day.today:not(.selected):not(.startRange):not(.endRange) {
	color: var(--charbon, #3D4528);
	background: transparent;
}

/* Selected / range */
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected.startRange,
.flatpickr-day.selected.endRange {
	background: var(--or, #FFD60A) !important;
	border-color: var(--or, #FFD60A) !important;
	color: var(--charbon, #3D4528) !important;
	font-weight: 700;
	box-shadow: 0 4px 12px rgba(255, 214, 10, 0.35);
}
.flatpickr-day.inRange,
.flatpickr-day.inRange:hover {
	background: rgba(255, 214, 10, 0.22) !important;
	border-color: transparent !important;
	color: var(--charbon, #3D4528) !important;
	box-shadow: -5px 0 0 rgba(255, 214, 10, 0.22), 5px 0 0 rgba(255, 214, 10, 0.22);
}
.flatpickr-day.startRange { border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; }
.flatpickr-day.endRange   { border-top-left-radius: 0 !important;  border-bottom-left-radius: 0 !important; }

/* Disabled / past / fully booked */
.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover,
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay {
	color: rgba(61, 69, 40, 0.25) !important;
	background: repeating-linear-gradient(45deg, transparent 0 4px, rgba(61, 69, 40, 0.06) 4px 5px);
	text-decoration: line-through;
	text-decoration-color: rgba(61, 69, 40, 0.3);
	cursor: not-allowed;
}

/* Tight days (≤ 2 rooms free) — subtle yellow underline */
.flatpickr-day.darluz-day-tight:not(.flatpickr-disabled) {
	position: relative;
}
.flatpickr-day.darluz-day-tight::after {
	content: '';
	position: absolute;
	bottom: 4px;
	left: 50%;
	transform: translateX(-50%);
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: #E89F3B;
}

/* Availability chip — three states: ok / warn (tight) / error (not enough) */
[data-darluz-availability-warning] {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.4rem 0.8rem;
	margin-top: 0.6rem;
	border-radius: 50px;
	font-size: 0.78rem;
	font-weight: 600;
	background: rgba(255, 214, 10, 0.18);
	color: var(--charbon, #3D4528);
	border: 1px solid rgba(255, 214, 10, 0.4);
}
[data-darluz-availability-warning].is-ok {
	background: rgba(107, 168, 80, 0.12);
	color: #2F5C1F;
	border-color: rgba(107, 168, 80, 0.4);
}
[data-darluz-availability-warning].is-warn {
	background: rgba(232, 159, 59, 0.14);
	color: #804B14;
	border-color: rgba(232, 159, 59, 0.4);
}
[data-darluz-availability-warning].is-error {
	background: rgba(200, 50, 50, 0.10);
	color: #9C2020;
	border-color: rgba(200, 50, 50, 0.4);
}

/* Rooms-needed hint (e.g. "Il vous faut 2 chambres pour 3 personnes") */
[data-darluz-rooms-hint] {
	display: block;
	margin-top: 0.4rem;
	font-size: 0.78rem;
	color: var(--gris-doux, #8B8070);
	font-weight: 500;
}
/* When inside the booking-bar-meta row, sit inline */
.booking-bar-meta [data-darluz-rooms-hint] {
	display: inline-flex;
	margin: 0;
	font-size: 0.78rem;
}
.booking-bar-meta [data-darluz-availability-warning] {
	margin: 0;
}

/* Nights badge in summary */
[data-darluz-nights] {
	color: var(--or, #FFD60A);
	font-weight: 600;
}

/* RTL: flip range tail shadows */
html[dir="rtl"] .flatpickr-day.inRange,
html[lang="ar"] .flatpickr-day.inRange {
	box-shadow: 5px 0 0 rgba(255, 214, 10, 0.22), -5px 0 0 rgba(255, 214, 10, 0.22);
}
html[dir="rtl"] .flatpickr-day.startRange,
html[lang="ar"] .flatpickr-day.startRange {
	border-top-right-radius: 6px !important;
	border-bottom-right-radius: 6px !important;
	border-top-left-radius: 0 !important;
	border-bottom-left-radius: 0 !important;
}
html[dir="rtl"] .flatpickr-day.endRange,
html[lang="ar"] .flatpickr-day.endRange {
	border-top-right-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
	border-top-left-radius: 6px !important;
	border-bottom-left-radius: 6px !important;
}

/* Mobile: full-width responsive picker */
@media (max-width: 600px) {
	.flatpickr-calendar {
		width: calc(100vw - 24px) !important;
		max-width: 360px !important;
		left: 12px !important;
		right: 12px !important;
		margin: 0 auto !important;
	}
	.flatpickr-days,
	.dayContainer {
		width: 100% !important;
		min-width: 0 !important;
		max-width: none !important;
	}
	.dayContainer {
		display: grid !important;
		grid-template-columns: repeat(7, 1fr);
		gap: 1px;
	}
	.flatpickr-day {
		max-width: none !important;
		flex-basis: auto !important;
		height: 38px;
		line-height: 38px;
	}
}
