.calendar-event-box.has-events:hover {
  z-index: 20;
}

.calendar-event-box.has-events>div:hover {
  width: 10rem !important;
  height: auto !important;
  overflow-y: visible;
  background: var(--body-bg);
  border: 1px solid var(--light);
  top: -1px;
  left: -1px;
}

.full-date {
  display: none;
}

.calendar-event-box.has-events>div:hover .full-date {
  display: inline;
}

.calendar-event-box.has-events>div:hover .day-num {
  display: none;
}