/*** Separate CSS for styling fullcalendar view for /calendar page ***/

/***full calendars toolbar with options***/
/*
.fc-toolbar.fc-header-toolbar {
}*/

/** overwriting some default settings from full calendar **/
/*
.fc-unthemed .fc-content, .fc-unthemed .fc-divider, .fc-unthemed .fc-list-heading td, .fc-unthemed .fc-list-view, .fc-unthemed .fc-popover, .fc-unthemed .fc-row, .fc-unthemed tbody, .fc-unthemed td, .fc-unthemed th, .fc-unthemed thead {
}
.fc-unthemed th {
}*/


/*Styling calendar toolbar buttons*/
.calendar_recurring_events .fc-button {
    padding: 0px;
    font-size: 0.9rem;
    line-height: 1rem;
    padding: 10px 30px;
    background-color: #d3d3d3;
    font-weight: bold;
    color:black;
    border: none;
}
/*Styling calendar toolbar active button*/
.fc-button-group>.fc-button.fc-button-active {
    background-color: #adadad;
}

/*Styling calendar toolbar*/
.calendar_recurring_events .fc-header-toolbar {
    display: flex;
    flex-wrap: wrap !important;
}
/*Styling calendar toolbar title*/
.calendar_recurring_events .fc-toolbar h2 {
    text-align: center;
    font-weight: bold;
}
/*Styling calendar toolbar center part*/
.calendar_recurring_events .fc-header-toolbar .fc-center {
    width: 60%;
}
/*Styling calendar toolbar center part*/
.calendar_recurring_events .fc-header-toolbar .fc-center > div {
    display: flex;
    justify-content: center;
    align-items: center;
}
/*Styling calendar toolbar center part - previous (month) button*/
.calendar_recurring_events .fc-header-toolbar .fc-center .fc-prev-button {
    margin-right: 10px;
    border:0px;
    color:var(--theme-color);
    background-color: transparent;
}
/*Styling calendar toolbar center part - previous (month) button icon*/
.calendar_recurring_events .fc-header-toolbar .fc-center .fc-prev-button .fc-icon {
    font-weight: bolder;
    font-size: 2rem;
}
/*Styling calendar toolbar center part - next (month) button*/
.calendar_recurring_events .fc-header-toolbar .fc-center .fc-next-button {
    margin-left: 10px;
    border:0px;
    color:var(--theme-color);
    background-color: transparent;
}
/*Styling calendar toolbar center part - next (month) button icon*/
.calendar_recurring_events .fc-header-toolbar .fc-center .fc-next-button .fc-icon {
    font-weight: bolder;
    font-size: 2rem;
}
/*Styling calendar toolbar left and right part*/
.calendar_recurring_events .fc-header-toolbar .fc-right,
.calendar_recurring_events .fc-header-toolbar .fc-left{
    width: 20%;
}

/*Monthly display - header containing days in week*/
.calendar_recurring_events .fc-dayGridMonth-view .fc-head tr {
    background-color: white !important;
}
/*
.calendar_recurring_events .fc-dayGridMonth-view td.fc-day {
    background-color: white !important;
}*/
/** gives padding to row displaying weekdays for monthly grid view **/
.calendar_recurring_events .fc-dayGridMonth-view td.fc-head-container.fc-widget-header {
    border: 0px;
}
.calendar_recurring_events .fc-dayGridMonth-view .fc-dayGridMonth-view table thead.fc-head {
    border:0px;
}
/*** removes background color from rows representing days ***/
.calendar_recurring_events tr:nth-child(odd) {
    background-color: white;
}
.calendar_recurring_events tr:nth-child(even) {
    background-color: white;
}

/*** removes borders ***/
.calendar_recurring_events .fc-unthemed thead,
.calendar_recurring_events .fc-unthemed tbody,
.calendar_recurring_events .fc-unthemed td {
    border-color: transparent;
}
/*** affects day names in monthly calendar view ***/
.calendar_recurring_events .fc-dayGridMonth-view th.fc-day-header.fc-widget-header {
    text-transform: uppercase;
    font-family: 'LatoBlack';
    font-weight: bold;
    font-size: 1rem;
    text-align: left;
    border:0px;
    padding-left: 10px;
}
.calendar_recurring_events .fc-dayGridMonth-view td.fc-day-top a {
    font-size: 2rem;
    font-family: 'LatoBlack';
    width: 90%;
    border-top :3px solid black;
    transition: none !important;
    margin-right: 4%;
}.calendar_recurring_events .fc-dayGridMonth-view td.fc-day-top a:hover {
    border-bottom: 0px;
    transition: none !important;
}
.calendar_recurring_events .fc-event-container .fc-content {
    white-space: normal;
    overflow: visible;
}
.calendar_recurring_events td.fc-event-container a.fc-day-grid-event{
    background-color: white !important;
    border:0px !important;
    color:black;
    font-family: 'LatoBlack';
}
.calendar_recurring_events td.fc-event-container a.fc-day-grid-event:hover {
    color: #2ba6cb;
}
.calendar_recurring_events a.fc-day-grid-event.fc-h-event.fc-event.fc-start.fc-end.fc-other-month {
    opacity: 0.7;
}
.calendar_recurring_events td.fc-day-top.fc-other-month {
    opacity: 0.5;
}

/*** Styles today's date ***/
.calendar_recurring_events .fc-content-skeleton td.fc-today,
.calendar_recurring_events td.fc-day-top.fc-today, 
.calendar_recurring_events td.fc-day.fc-today
{
   background-color: #dedede;
}
.calendar_recurring_events .fc-dayGridMonth-view td.fc-day-top.fc-today > a {
    border-top :3px solid #f68026;
}
.calendar_recurring_events td.fc-day-top.fc-today, 
.calendar_recurring_events td.fc-day.fc-today
{
    width: fit-content;
}


/*** List view - for given event date show dayname closer to the date ***/
.calendar_recurring_events table.fc-list-table  tr.fc-list-heading td.fc-widget-header a:last-child {
    float:left;
    margin-left: 5rem;
}


/*** MEDIA QUERIES - small to small desktop viewports ***/
@media screen and (max-width: 1200px) {
    /*center content in toolbar*/
    .calendar_recurring_events .fc-header-toolbar {
        text-align: center;
    }
    /*** make all parts of toolbar to appear in each row ***/
    .calendar_recurring_events .fc-header-toolbar .fc-center {
        width: 100%;
    }
    .calendar_recurring_events .fc-header-toolbar .fc-right,
    .calendar_recurring_events .fc-header-toolbar .fc-left{
        width: 100%;
    } 
}