[data-page="calendar"].calendar-page {
  min-width: 0;
}

@media (max-width: 1040px) {
  [data-page="calendar"].calendar-page {
    flex-direction: column !important;
    overflow: auto;
  }

  [data-page="calendar"] .calendar-page__sidebar {
    width: auto !important;
  }

  [data-page="calendar"] .calendar-page__legend {
    flex-wrap: wrap;
    row-gap: 8px;
  }
}

@media (max-width: 720px) {
  [data-page="calendar"] .calendar-page__header {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
}