.calendar-page-container {
    display: grid;
    grid-template-columns: auto;
    grid-template-rows: max-content 1fr;
}

.fc .fc-toolbar {
    display: grid;
    align-self: center;
    width: 100%;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-template-areas:
        "cal-nav cal-type"
        "cal-title cal-title";
}

.fc-toolbar-chunk:nth-child(1) {
    justify-self: start;
    grid-area: cal-nav;
}

.fc-toolbar-chunk:nth-child(2) {
    justify-self: center;
    grid-area: cal-title;
}

.fc-toolbar-chunk:nth-child(3) {
    justify-self: end;
    grid-area: cal-type;
    text-align: right;
}

.fc-direction-ltr .fc-toolbar > * > :not(:first-child) {
    margin-left: 0.1rem;
}

.fc .fc-button {
    margin-bottom: 0.3rem;
}

@media screen and (min-width: 1185px) {
    .calendar-page-container {
        grid-template-columns: 75% 1fr;
        grid-template-rows: auto;
    }

    .fc .fc-toolbar {
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: 1fr;
        grid-template-areas:
            "cal-nav cal-title cal-type";
    }

    .fc-direction-ltr .fc-toolbar > * > :not(:first-child) {
        margin-left: 0.75rem;
    }

    .fc .fc-button {
        margin-bottom: 0;
    }
    
}