nav {
  align-items: center;
  flex-wrap: wrap;
}

nav .calendar-filters {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0 0 0 auto;
  padding: 4px 6px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
}

nav .calendar-filters label {
  min-width: 0;
  font-size: 0;
}

nav .calendar-filters select {
  width: 145px;
  margin: 0;
  padding: 9px 10px;
  font-size: 12px;
}

nav .calendar-filters button {
  padding: 9px 11px;
  font-size: 12px;
}

nav .calendar-filters.active {
  border-color: #9aa579;
  background: #f0f3e3;
}

nav .calendar-filters.hidden {
  display: none;
}

.nav-count {
  display: inline-grid;
  place-items: center;
  min-width: 21px;
  height: 21px;
  margin-left: 5px;
  padding: 0 6px;
  border-radius: 11px;
  background: #b85c50;
  color: white;
  font-size: 11px;
  font-weight: 800;
}

.nav-count[hidden] { display: none; }

@media (max-width: 750px) {
  nav { overflow: visible; }
  nav .calendar-filters {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    width: 100%;
    margin-left: 0;
  }
  nav .calendar-filters select { width: 100%; }
  nav .calendar-filters button { grid-column: auto; }
}