:root {
	/*
	--calendar-color-green: #198754;
	--calendar-color-red: #dc3545;
	*/
	--calendar-color-green: #34CD4E;
	--calendar-color-red: #FF5148;
	
	--calendar-color-yellow: #f2e6bd;
	--calendar-color-light: #ffffff;
	--calendar-grey-light: #eeeeee;
	--calendar-grey-medium: #dddddd;
	--calendar-grey-dark: #343434;
	--calendar-text-color: #000000;
	
}
.availability-calendar-wrap .calendar-container {
	margin-bottom: 40px;
}
.availability-calendar-wrap strong {
	font-weight: 500;
}
.availability-calendar-wrap .calendar-header {
	flex-wrap: nowrap;
}
.availability-calendar-wrap .calendar-current-month {
	text-align: center;
	font-weight: 700;
	font-size: 1.8rem;
	margin: 10px 0 5px 0;
}
.availability-calendar-wrap .calendar {
	border-collapse: collapse;
	width: 100%;
}
.availability-calendar-wrap .calendar td,
.availability-calendar-wrap .calendar th {
	border: 1px solid var(--calendar-grey-medium);
	width: 14%;
	height: 35px;
	font-weight: 700;
	font-size: 1.3rem;
	text-align: center;
}
.availability-calendar-wrap .free {
	background: var(--calendar-color-green);
	color: var(--calendar-text-color);
}
.availability-calendar-wrap .booked {
	background: var(--calendar-color-red);
	color: var(--calendar-text-color);
}
.availability-calendar-wrap .past {
	background: var(--calendar-grey-light);
	color: var(--calendar-grey-dark);
}
.availability-calendar-wrap .arrival-day {
	background: linear-gradient(120deg,var(--calendar-color-green),var(--calendar-color-green) 50%,var(--calendar-color-red) 50%);
	color: var(--calendar-text-color);
}
.availability-calendar-wrap .departure-day {
	background: linear-gradient(120deg,var(--calendar-color-red),var(--calendar-color-red) 50%,var(--calendar-color-green) 50%);
	color: var(--calendar-text-color);
}
.availability-calendar-wrap .change-day {
	background: var(--calendar-color-red);
	color: var(--calendar-text-color);
}
.availability-calendar-wrap td.booked + td.booked.arrival-day {
	background: linear-gradient(120deg,var(--calendar-color-red),var(--calendar-color-red) 49%,var(--calendar-grey-light) 50%,var(--calendar-color-red) 51%, var(--calendar-color-red) 50%);
}
.availability-calendar-wrap .calendar td.holiday {
	border: 2px solid var(--calendar-color-yellow);
	color: var(--calendar-text-color);
	font-weight: 700;
}
.availability-calendar-wrap .calendar td.holiday.past {
	background: var(--calendar-grey-light);
	color: var(--calendar-grey-dark);
}
/* Select */
#availabilityMonthSelect {
	max-width: 150px;
}
/* Stylesheet: Belegungsplan Modified On 2026-05-07 12:17:38 */