/* Disable touch zooming, dynamic time table height is implemented instead */
.course-calendar {
    touch-action: pan-x pan-y;
}

/* Dynamic calendar table height */
.course-calendar .fc-time-grid .fc-slats td {
    font-size: calc(-0.3em + 3.1vh);
}

/* Disable vertical scrollbar which is sometimes visible inside the calendar */
.course-calendar .fc-time-grid-container.fc-scroller {
    overflow: hidden !important;
}

/* Dynamic event text size, RTL direction, default cursor for IE/Edge */
.course-calendar .fc-event {
    font-size: calc(0.1em + 1.3vh);
    direction: rtl;
    cursor: default;
}

/* Remove opacity layer - https://github.com/fullcalendar/fullcalendar/issues/3684 */
.course-calendar .fc-event .fc-bg {
    display: none;
}

/* Keep the not-allowed cursor, which is otherwise overwritten by the above rule */
.fc-not-allowed .fc-event {
    cursor: not-allowed;
}

/* Center event text vertically */
.course-calendar .fc-time-grid-event {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Center event text horizontally */
.course-calendar .fc-content {
    text-align: center !important;
}

/* Calendar items */
.calendar-item-selected {
    background: linear-gradient(to top, rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0.1));
}

.calendar-item-selected:active {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0.1));
}

.calendar-item-unselected {
    background-color: #F8F9FA !important;
    color: black !important;
    border-color: black !important;
}

.calendar-item-unselected-hide-button {
    display: none;
    position: absolute;
    /* Place above the text which has the z-index value of 2 */
    z-index: 3;
    top: 5px;
    right: calc(min(5px, 20%));
    padding: 0 3px;
    color: black;
    background-color: white;
    border: 1px solid black;
    border-radius: 3px;
    cursor: pointer;
}

.calendar-item-unselected:hover .calendar-item-unselected-hide-button {
    display: block;
}

.calendar-item-unselected-hide-button:hover {
    color: white;
    background-color: #6c757d;
    border-color: #6c757d;
}

.calendar-item-previewed {
    border: 3px solid #1565C0 !important;
}

.calendar-item-same-course-as-hovered {
    border: 3px solid #1565C0 !important;
}

.calendar-item-same-type-as-hovered {
    border: 3px solid #CC0000 !important;
}

.calendar-item-previewed .fc-content,
.calendar-item-same-course-as-hovered .fc-content,
.calendar-item-same-type-as-hovered .fc-content {
    font-weight: bold;
}

.calendar-item-last-choice .fc-content {
    color: #AA66CC;
}