/* Oud-Beijerland.org V0.3.6.3.8.3 - events desktop category bar parity */
@media (min-width: 681px) {
  /* Same visual language as .content-switch on Routes / Bezienswaardigheden. */
  .agenda-page .event-category-switch-v036383 {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 24px 0 14px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .agenda-page .event-category-switch-v036383 a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 46px !important;
    padding: 11px 16px !important;
    border: 1px solid #d9e2da !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: #0d2e2a !important;
    font-weight: 850 !important;
    line-height: 1.1 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    box-shadow: none !important;
  }

  .agenda-page .event-category-switch-v036383 a:hover {
    border-color: #174c35 !important;
    color: #174c35 !important;
  }

  .agenda-page .event-category-switch-v036383 a.active,
  .agenda-page .event-category-switch-v036383 a[aria-current="page"] {
    border-color: #174c35 !important;
    background: #174c35 !important;
    color: #fff !important;
  }

  /* Keep Agenda / Vandaag / Dit weekend as a separate time-scope switch,
     but align its spacing with the same listing rhythm. */
  .agenda-page .view-tabs {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin: 24px 0 0 !important;
  }

  .agenda-page .view-tabs a {
    min-height: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 11px 16px !important;
    border: 1px solid #d9e2da !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: #0d2e2a !important;
    font-weight: 850 !important;
    text-decoration: none !important;
  }

  .agenda-page .view-tabs a.active {
    border-color: #174c35 !important;
    background: #174c35 !important;
    color: #fff !important;
  }

  /* Category is now selected with the pills above on desktop.
     Keep the select in the form (not disabled) so the selected GET value
     remains part of subsequent filter submissions. */
  .agenda-page .filter-bar select[name="category"] {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }
}