/* ---------------------------------------------------------------------------
   MEC accessible month view — event panel behavior (Module AC)
   Pairs with aum-a11y-mec-grid.js. Moved verbatim from the child theme's
   css/a11y.css in v1.43.0 (no rule changes).
--------------------------------------------------------------------------- */

/* The week row is the positioning anchor so the panel can span full width. */
.mec-a11y-grid .mec-calendar-row {
  position: relative;
}

.mec-calendar-day.mec-has-event.mec-selected-day {
  position: unset;
}

.mec-calendar .mec-calendar-day.mec-has-event.mec-selected-day a {
  position: relative;
}

.mec-calendar .mec-calendar-day.mec-has-event.mec-selected-day a::after {
  content: '';
  position: absolute;
  display: block;
  background-color: #c24d1e;
  border-radius: 50%;  
  width: 8px;
  height: 8px;
  bottom: auto;
  top: 19px;
  left: 0;
  margin: 0;
  transition: all .25s ease;
}

/* Each day's events now live INSIDE its cell (for CSS-disabled meaning),
   but visually we break the panel out to the full calendar width and drop it
   just below the week it belongs to. */
.mec-a11y-grid .mec-calendar-day .mec-calendar-events-sec {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  z-index: 20;
  background: #fff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);

  /* Closed by default. !important beats MEC's inline style="display:block"
    and any display MEC's own JS sets, so visibility is controlled ONLY by
    the .mec-a11y-open class. This also fixes the panel that
    used to open on load and cover the dates below it. */
  display: none !important;
}

/* The one and only thing that opens a panel. */
.mec-a11y-grid .mec-calendar-day .mec-calendar-events-sec.mec-a11y-open {
  display: block !important;
}

/* Make it obvious the day is interactive. */
.mec-a11y-grid .mec-calendar-day.mec-has-event {
  cursor: pointer;
}