/* =========================================================
   Calendar Styles
========================================================= */

.calendar-shell,
#calendar {
    width: 100%;
    max-width: 100%;
}

.fc {
    max-width: 100%;
}

.fc .fc-scroller {
    -webkit-overflow-scrolling: touch;
}

.fc .fc-toolbar-title {
    font-size: clamp(1.1rem, 2.5vw, 1.75rem);
    line-height: 1.15;
}

.fc .fc-button {
    min-height: 38px;
    padding: 0.45rem 0.65rem;
    border-radius: 10px;
    font-size: 0.85rem;
}

.fc .fc-button-group {
    gap: 0.25rem;
}

.fc .fc-button-group > .fc-button {
    border-radius: 10px !important;
}

.fc .fc-event {
    cursor: pointer;
    overflow: hidden;
    border: 0 !important;
    border-radius: 0;
    color: #fff !important;
    min-height: 28px;
}

.fc .fc-event-title,
.fc .fc-event-time {
    display: none;
}

.fc .fc-event-main {
    overflow: hidden;
}

/* =========================================================
   Calendar Time Grid: Week + Day
========================================================= */

.calendar-view-week #calendar,
.calendar-view-day #calendar {
    min-height: 560px;
}

.calendar-view-week .fc,
.calendar-view-day .fc {
    min-height: 540px;
}

.calendar-view-week .fc-view-harness,
.calendar-view-day .fc-view-harness {
    min-height: 500px;
}

.calendar-view-week .fc-timegrid,
.calendar-view-week .fc-timegrid-container,
.calendar-view-week .fc-timegrid-body,
.calendar-view-week .fc-timegrid-slots,
.calendar-view-week .fc-timegrid-cols,
.calendar-view-day .fc-timegrid,
.calendar-view-day .fc-timegrid-container,
.calendar-view-day .fc-timegrid-body,
.calendar-view-day .fc-timegrid-slots,
.calendar-view-day .fc-timegrid-cols {
    min-height: 500px;
}

.calendar-view-week .fc-timegrid-slot,
.calendar-view-day .fc-timegrid-slot {
    height: 1.25rem;
}

.calendar-view-week .fc-timegrid-event,
.calendar-view-day .fc-timegrid-event {
    min-height: 32px;
}

.calendar-view-week .fc-timegrid-event .fc-event-main,
.calendar-view-day .fc-timegrid-event .fc-event-main {
    padding: 0.12rem 0.18rem;
}

/* =========================================================
   Calendar Month View
========================================================= */

.calendar-view-month #calendar {
    min-height: 760px;
}

.calendar-view-month .fc-view-harness {
    min-height: 660px;
}

.calendar-view-month .fc-daygrid-day-frame {
    min-height: 135px;
}

.calendar-view-month .fc-daygrid-day-events {
    min-height: 4rem;
}

.calendar-view-month .fc-daygrid-event {
    padding: 0.18rem 0.25rem;
    line-height: 1.25;
    white-space: normal;
}

/* =========================================================
   Calendar Event Content
========================================================= */

.calendar-event-content {
    display: grid !important;
    gap: 0.08rem;
    min-width: 0;
    padding: 0.12rem 0.16rem;
    line-height: 1.15;
    overflow: hidden;
}

.calendar-event-team,
.calendar-event-time,
.calendar-event-type,
.calendar-event-location {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.calendar-event-team {
    font-size: 0.72rem;
    font-weight: 900;
    line-height: 1.1;
}

.calendar-event-time {
    display: block !important;
    visibility: visible !important;
    font-size: 0.62rem;
    font-weight: 800;
    line-height: 1.05;
    opacity: 0.96;
}

.calendar-event-type {
    font-size: 0.62rem;
    font-weight: 800;
    line-height: 1.05;
    text-transform: capitalize;
    opacity: 0.9;
}

.calendar-event-location {
    font-size: 0.62rem;
    font-weight: 700;
    opacity: 0.9;
}

.calendar-view-month .fc-daygrid-event .calendar-event-location,
.calendar-view-month .fc-daygrid-event .calendar-event-type {
    display: none;
}

/* =========================================================
   Closed Hours / Blocked Time
========================================================= */

.calendar-blocked-time {
    background: #666666 !important;
    opacity: 0.75;
}

.fc-bg-event {
    cursor: not-allowed;
}

.fc .fc-timegrid-slot:hover,
.fc .fc-daygrid-day-frame:hover {
    background: rgba(29, 78, 216, 0.06);
    cursor: pointer;
}

/* =========================================================
   Division Colours
========================================================= */

.fc .fc-event.division-event,
.fc .fc-event.division-event .fc-event-main,
.fc .fc-event.division-event .calendar-event-content,
.fc .fc-event.division-event .calendar-event-team,
.fc .fc-event.division-event .calendar-event-time,
.fc .fc-event.division-event .calendar-event-type {
    color: #fff !important;
}

.fc .fc-event.division-8u,
.fc .fc-event.division-8u .fc-event-main {
    background-color: #2563eb !important;
}

.fc .fc-event.division-9u,
.fc .fc-event.division-9u .fc-event-main {
    background-color: #16a34a !important;
}

.fc .fc-event.division-10u,
.fc .fc-event.division-10u .fc-event-main {
    background-color: #9333ea !important;
}

.fc .fc-event.division-11u,
.fc .fc-event.division-11u .fc-event-main {
    background-color: #ea580c !important;
}

.fc .fc-event.division-12u,
.fc .fc-event.division-12u .fc-event-main {
    background-color: #0891b2 !important;
}

.fc .fc-event.division-13u,
.fc .fc-event.division-13u .fc-event-main {
    background-color: #be123c !important;
}

.fc .fc-event.division-15u,
.fc .fc-event.division-15u .fc-event-main {
    background-color: #4f46e5 !important;
}

.fc .fc-event.division-18u,
.fc .fc-event.division-18u .fc-event-main {
    background-color: #0f766e !important;
}

.fc .fc-event.division-unassigned,
.fc .fc-event.division-unassigned .fc-event-main {
    background-color: #64748b !important;
}

/* =========================================================
   Calendar Responsive
========================================================= */

@media (max-width: 900px) {
    .fc .fc-toolbar {
        display: grid;
        grid-template-columns: 1fr;
        gap: 0.75rem;
        justify-items: stretch;
    }

    .fc .fc-toolbar-chunk {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 0.4rem;
    }

    .fc .fc-toolbar-chunk:nth-child(2) {
        order: -1;
    }

    .fc .fc-toolbar-title {
        width: 100%;
        text-align: center;
    }

    .calendar-view-week .fc-timegrid-slot,
    .calendar-view-day .fc-timegrid-slot {
        height: 2.2rem;
    }
}

@media (max-width: 640px) {
    .fc {
        font-size: 0.86rem;
    }

    .fc .fc-toolbar {
        margin-bottom: 0.75rem;
    }

    .fc .fc-toolbar-title {
        font-size: 1.05rem;
    }

    .fc .fc-button {
        width: auto;
        min-height: 38px;
        padding: 0.42rem 0.52rem;
        font-size: 0.74rem;
    }

    .fc .fc-col-header-cell-cushion,
    .fc .fc-timegrid-axis-cushion,
    .fc .fc-timegrid-slot-label-cushion {
        font-size: 0.68rem;
    }

    .calendar-view-week .fc-timegrid-slot,
    .calendar-view-day .fc-timegrid-slot {
        height: 2.65rem;
    }

    .calendar-event-team {
        font-size: 0.68rem;
    }

    .calendar-event-time {
        font-size: 0.64rem;
    }

    .calendar-event-type,
    .calendar-event-location {
        display: none !important;
    }
}

@media (max-width: 380px) {
    .fc .fc-button {
        padding: 0.38rem 0.44rem;
        font-size: 0.68rem;
    }

    .calendar-event-team,
    .calendar-event-time {
        font-size: 0.6rem;
    }
}
