/* Custom styles for https://fullcalendar.io/ */

#calendar-container {
	display: flex;
	flex-direction: column;
	> *:nth-child(1) { order: 1 }
	> *:nth-child(2) { order: 3 }
	> *:nth-child(3) { order: 2 }
}

.fc {
	--fc-border-color: transparent;
	--fc-today-bg-color: var(--bg-color-dark);
	--fc-button-text-color: var(--text-color);
	--fc-button-bg-color: white;
	--fc-button-border-color: var(--color-neutral-200);
	--fc-button-hover-bg-color: var(--text-color);
	--fc-button-hover-text-color: white;
	--fc-button-active-bg-color: var(--text-color);
	--fc-button-active-text-color: white;
}

.fc-header-toolbar {
	margin: 0 !important;
	background-color: white;
	padding-bottom: calc(4 * var(--spacing));

	@media (width < 40rem) {
		padding: calc(4 * var(--spacing));
		padding-bottom: 0;
	}
}

.fc-footer-toolbar {
	margin: 0 !important;
	border-bottom: 1px solid var(--color-neutral-200);
	background-color: white;
	padding-bottom: calc(4 * var(--spacing));

	@media (width < 40rem) {
		padding: calc(4 * var(--spacing));
	}
}

.fc-button {
	border-radius: var(--rounded-lg) !important;
}

.fc-direction-ltr .fc-button-group > .fc-button:not(:last-child) {
	border-bottom-right-radius: 0px !important;
	border-top-right-radius: 0px !important;
}

.fc-direction-ltr .fc-button-group > .fc-button:not(:first-child) {
	border-bottom-left-radius: 0px !important;
	border-top-left-radius: 0px !important
}

.fc-button-active {
	color: var(--fc-button-active-text-color) !important;
}

.fc-button-primary:disabled {
	opacity: 1 !important;
}

.fc-icon {
	position: relative;
	top: -3px;
}

.fc-view-harness {
	@media (width < 40rem) {
		margin: calc(4 * var(--spacing));
	}
}

.fc-toolbar-title {
	@media (width < 40rem) {
		font-size: var(--text-xl) !important;
	}
}

.fc-daygrid-day-number {
	margin: 0 auto;
}

.fc-day-today {
	border-radius: var(--rounded-md);
}