/* Mobile interaction refinements layered onto the current production build. */
@media (max-width: 767px) {
  button[aria-label^="Show slide "] {
    position: relative;
    width: 44px !important;
    height: 44px !important;
    border-radius: 9999px;
    background: transparent !important;
  }

  button[aria-label^="Show slide "]::after {
    content: "";
    position: absolute;
    inset: 18px;
    border-radius: 9999px;
    background: rgb(124 58 237 / 45%);
  }

  button[aria-label^="Show slide "][class*="w-7"]::after {
    inset-inline: 8px;
    background: rgb(124 58 237);
  }

  footer a[aria-label],
  nav[aria-label$="pagination" i] button,
  nav[aria-label$="pagination" i] a {
    min-width: 44px !important;
    min-height: 44px !important;
  }

  main label:has(> input[type="checkbox"]) {
    min-height: 44px;
    cursor: pointer;
  }
}