/* =========================================================
   BLK CALENDAR - FINAL EVENT DESIGN
   ========================================================= */


/* Calendar */

#blk-calendar {
    width: 100% !important;
    max-width: 100% !important;
}


/* ---------------------------------------------------------
   EVENT
   --------------------------------------------------------- */

#blk-calendar .fc-daygrid-event.fc-daygrid-dot-event {

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    width: 100% !important;

    min-height: 18px !important;

    margin: 3px 0 !important;

    padding: 3px 0 !important;

    border: 0 !important;

    background: transparent !important;

    box-shadow: none !important;

    overflow: visible !important;

    position: relative !important;

    cursor: pointer !important;
}


/* ---------------------------------------------------------
   HIDE EVENT TEXT
   --------------------------------------------------------- */

#blk-calendar .fc-daygrid-event.fc-daygrid-dot-event
.fc-event-title {

    display: none !important;
}


#blk-calendar .fc-daygrid-event.fc-daygrid-dot-event
.fc-event-time {

    display: none !important;
}


/* ---------------------------------------------------------
   BLUE DOT
   --------------------------------------------------------- */

#blk-calendar .fc-daygrid-event.fc-daygrid-dot-event
.fc-daygrid-event-dot {

    display: block !important;

    width: 9px !important;

    height: 9px !important;

    min-width: 9px !important;

    max-width: 9px !important;

    min-height: 9px !important;

    max-height: 9px !important;

    margin: 0 !important;

    padding: 0 !important;

    border: 0 !important;

    border-radius: 50% !important;

    background: #2563eb !important;

    box-sizing: border-box !important;

    transition: all 0.15s ease !important;
}


/* ---------------------------------------------------------
   HOVER DOT
   --------------------------------------------------------- */

#blk-calendar .fc-daygrid-event.fc-daygrid-dot-event:hover
.fc-daygrid-event-dot {

    width: 11px !important;

    height: 11px !important;

    min-width: 11px !important;

    max-width: 11px !important;

    min-height: 11px !important;

    max-height: 11px !important;

    background: #1d4ed8 !important;

    box-shadow:
        0 0 0 4px rgba(37, 99, 235, 0.12) !important;
}


/* ---------------------------------------------------------
   TOOLTIP
   --------------------------------------------------------- */

#blk-calendar .fc-daygrid-event.fc-daygrid-dot-event::after {

    content: attr(data-event-title);

    position: absolute;

    left: 50%;

    bottom: calc(100% + 8px);

    transform: translateX(-50%);

    z-index: 99999;

    display: none;

    white-space: nowrap;

    padding: 7px 10px;

    background: #172033;

    color: white;

    border-radius: 6px;

    font-family:
        Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    font-size: 12px;

    font-weight: 500;

    line-height: 1.2;

    box-shadow:
        0 6px 20px rgba(15, 23, 42, 0.20);

    pointer-events: none;
}


/* Show tooltip */

#blk-calendar .fc-daygrid-event.fc-daygrid-dot-event:hover::after {

    display: block;
}


/* ---------------------------------------------------------
   TOOLTIP ARROW
   --------------------------------------------------------- */

#blk-calendar .fc-daygrid-event.fc-daygrid-dot-event::before {

    content: "";

    position: absolute;

    left: 50%;

    bottom: calc(100% + 3px);

    transform: translateX(-50%);

    z-index: 100000;

    display: none;

    border-left: 5px solid transparent;

    border-right: 5px solid transparent;

    border-top: 5px solid #172033;

    pointer-events: none;
}


#blk-calendar .fc-daygrid-event.fc-daygrid-dot-event:hover::before {

    display: block;
}


/* ---------------------------------------------------------
   PREVENT TOOLTIP FROM BEING CLIPPED
   --------------------------------------------------------- */

#blk-calendar .fc-daygrid-day-frame {

    overflow: visible !important;
}


#blk-calendar .fc-daygrid-day-events {

    overflow: visible !important;
}


#blk-calendar .fc-daygrid-day {

    overflow: visible !important;
}


/* ---------------------------------------------------------
   CALENDAR CELLS
   --------------------------------------------------------- */

#blk-calendar .fc-daygrid-day-frame {

    min-height: 100px !important;
}


/* ---------------------------------------------------------
   TODAY
   --------------------------------------------------------- */

#blk-calendar .fc-day-today {

    background: #edb182!important;
}


#blk-calendar .fc-day-today .fc-daygrid-day-number {

    color: #2563eb !important;

    font-weight: 700 !important;
}


/* ---------------------------------------------------------
   TITLE
   --------------------------------------------------------- */

.blk-calendar-title {
    text-align: center;

    margin: 0 0 22px 0 !important;

    padding: 0 0 18px 0 !important;

    border-bottom: 1px solid #e5e7eb !important;

    color: #111827 !important;

    font-size: 28px !important;

    font-weight: 700 !important;

    line-height: 1.2 !important;
}