/*
 * Per-room availability calendar (M1.2).
 *
 * Overrides FullCalendar's default chrome to match the CJNDG site brand and
 * styles the neutral "Réservé / Booked" event pill that replaces every ICS
 * SUMMARY in render.
 */

.cjdng-rental-availability-wrap {
	margin: 2rem 0;
}

.cjdng-rental-availability-title {
	font-family: 'Inter', sans-serif;
	font-size: clamp(1.6rem, 1.2rem + 1vw, 2.2rem);
	font-weight: 600;
	margin: 0 0 0.4rem;
	line-height: 1.2;
}

.cjdng-rental-availability-intro {
	color: var(--ast-global-color-3, #4a4a4a);
	font-size: 0.95rem;
	margin: 0 0 1rem;
	max-width: 60ch;
}

.cjdng-rental-availability {
	--cjdng-busy-bg: var(--ast-global-color-0, #2563eb);
	--cjdng-busy-fg: #ffffff;
	--cjdng-cal-border: rgba(0, 0, 0, 0.08);
	--cjdng-cal-today-bg: rgba(37, 99, 235, 0.05);

	background: #ffffff;
	border: 1px solid var(--cjdng-cal-border);
	border-radius: 12px;
	padding: 1rem;
	font-family: 'Poppins', sans-serif;
}

/* Header toolbar */
.cjdng-rental-availability .fc-toolbar.fc-header-toolbar {
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-bottom: 1rem;
}

.cjdng-rental-availability .fc-toolbar-title {
	font-family: 'Inter', sans-serif;
	font-size: 1.1rem;
	font-weight: 600;
}

.cjdng-rental-availability .fc-button {
	background: transparent;
	color: var(--ast-global-color-2, #1f2937);
	border: 1px solid var(--cjdng-cal-border);
	box-shadow: none;
	font-weight: 500;
	font-size: 0.85rem;
	padding: 0.35rem 0.7rem;
	border-radius: 6px;
	text-transform: none;
}

.cjdng-rental-availability .fc-button:hover,
.cjdng-rental-availability .fc-button:focus {
	background: var(--ast-global-color-5, #f3f4f6);
	color: var(--ast-global-color-2, #1f2937);
	border-color: var(--cjdng-busy-bg);
	box-shadow: none;
}

.cjdng-rental-availability .fc-button-primary:not(:disabled).fc-button-active,
.cjdng-rental-availability .fc-button-primary:not(:disabled):active {
	background: var(--cjdng-busy-bg);
	color: var(--cjdng-busy-fg);
	border-color: var(--cjdng-busy-bg);
}

/* Month grid */
.cjdng-rental-availability .fc-daygrid-day.fc-day-today {
	background: var(--cjdng-cal-today-bg);
}

.cjdng-rental-availability .fc-col-header-cell {
	font-family: 'Inter', sans-serif;
	font-size: 0.75rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--ast-global-color-3, #4a4a4a);
	padding: 0.5rem 0;
}

/* Event pill (neutral — never carries ICS title) */
.cjdng-busy-event {
	background: var(--cjdng-busy-bg) !important;
	border: none !important;
	border-radius: 4px !important;
	padding: 0 !important;
}

.cjdng-busy-event .fc-event-main {
	padding: 2px 6px;
}

.cjdng-busy-pill {
	display: inline-block;
	color: var(--cjdng-busy-fg);
	font-size: 0.75rem;
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: 0.01em;
}

/* Multi-month view — compact bars (visible markers per booking) */
.cjdng-rental-availability .fc-multimonth-title {
	font-family: 'Inter', sans-serif;
	font-size: 0.95rem;
	font-weight: 600;
	padding: 0.5rem 0;
}

.cjdng-rental-availability .fc-multimonth-daygrid-day-frame {
	min-height: 2rem;
	padding-bottom: 4px;
}

/* Each booking renders as a full-width red bar in its day cell. Stack
   vertically if multiple bookings fall on the same day. */
.cjdng-rental-availability .fc-multimonth .fc-daygrid-event-harness {
	margin: 1px 3px;
}

.cjdng-rental-availability .fc-multimonth .fc-daygrid-dot-event,
.cjdng-rental-availability .fc-multimonth .fc-daygrid-event {
	background: var(--cjdng-busy-bg) !important;
	border: none !important;
	border-radius: 2px !important;
	padding: 0 !important;
	display: block !important;
	height: 5px !important;
	overflow: hidden;
}

.cjdng-rental-availability .fc-multimonth .fc-daygrid-event-dot {
	display: none;
}

/* Pill text is invisible in multi-month (cells too small) but kept in DOM
   as the privacy-rewrite mechanism. */
.cjdng-rental-availability .fc-multimonth .cjdng-busy-pill {
	display: block;
	font-size: 0;
	height: 100%;
	width: 100%;
}

/* Time-grid (week/day) views */
.cjdng-rental-availability .fc-timegrid-slot {
	height: 2.2rem;
}

.cjdng-rental-availability .fc-timegrid-slot-label {
	font-size: 0.75rem;
	color: var(--ast-global-color-3, #4a4a4a);
}

.cjdng-rental-availability .fc-timegrid-event {
	background: var(--cjdng-busy-bg) !important;
	border: none !important;
	padding: 2px 4px !important;
}

.cjdng-rental-availability .fc-timegrid-event .cjdng-busy-pill {
	font-size: 0.7rem;
}

/* Noscript fallback */
.cjdng-rental-availability-noscript a {
	color: var(--ast-global-color-0, #2563eb);
	text-decoration: underline;
}

/* Mobile */
@media (max-width: 640px) {
	.cjdng-rental-availability {
		padding: 0.5rem;
	}
	.cjdng-rental-availability .fc-toolbar.fc-header-toolbar {
		justify-content: center;
		text-align: center;
	}
	.cjdng-rental-availability .fc-toolbar-chunk {
		display: flex;
		justify-content: center;
		width: 100%;
	}
	.cjdng-rental-availability .fc-toolbar-title {
		font-size: 1rem;
	}
}