body {
    background: #f5f7fa;
}


.agenda-stat-card {
    border: 0;
}


.activity-description {
    max-width: 500px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


/* ============================================================
   CALENDAR
   ============================================================ */

.agenda-calendar {
    width: 100%;
}


.calendar-weekdays {
    display: grid;
    grid-template-columns:
        repeat(7, 1fr);

    border-bottom: 1px solid #dee2e6;

    margin-bottom: 1px;
}


.calendar-weekdays > div {
    padding: 8px;

    text-align: center;

    font-size: 12px;

    font-weight: 600;

    color: #6c757d;
}


.calendar-grid {
    display: grid;

    grid-template-columns:
        repeat(7, 1fr);

    gap: 1px;

    background: #dee2e6;
}


.calendar-day {
    position: relative;

    min-height: 85px;

    border: 0;

    background: #fff;

    padding: 8px;

    text-align: left;

    cursor: pointer;

    transition:
        background .15s ease;
}


.calendar-day:hover {
    background: #f0f6ff;
}


.calendar-day.muted {
    color: #adb5bd;

    background: #f8f9fa;
}


.calendar-day.today {
    box-shadow:
        inset 0 0 0 2px
        #007bff;
}


.calendar-day-number {
    font-weight: 600;
}


.calendar-count {
    position: absolute;

    right: 7px;

    top: 7px;

    min-width: 22px;

    height: 22px;

    line-height: 22px;

    border-radius: 50%;

    background: #007bff;

    color: #fff;

    text-align: center;

    font-size: 11px;
}


/* ============================================================
   TOAST
   ============================================================ */

#agendaToastContainer {
    position: fixed;

    right: 20px;

    bottom: 20px;

    z-index: 99999;
}


#agendaToastContainer .alert {
    min-width: 280px;

    box-shadow:
        0 5px 20px
        rgba(0, 0, 0, .15);

    transition:
        opacity .3s ease;
}


/* ============================================================
   MOBILE
   ============================================================ */

@media (
    max-width: 767px
) {

    .calendar-day {
        min-height: 55px;

        padding: 5px;

        font-size: 12px;
    }


    .calendar-count {
        position: static;

        display: inline-block;

        margin-left: 3px;
    }


    .calendar-weekdays > div {
        padding: 5px 2px;

        font-size: 10px;
    }


    #activitiesTable {
        min-width: 850px;
    }


    .modal-dialog {
        margin: .5rem;
    }

}