/*
 * Responsive fixes written by hand.
 * The compiled Tailwind file (build/assets/main-*.css) only contains classes that existed when it
 * was built, so new utility classes cannot be added to the pages. Keep fixes here instead.
 */

/* 1) The cookie banner used to sit on top of the mobile bottom nav (both fixed to the bottom).
      The bottom nav is shown below 1024px and is about 84px tall, so lift the banner above it. */
@media (max-width: 1023.98px) {
  #cookie-consent-banner {
    bottom: calc(5.75rem + env(safe-area-inset-bottom, 0px)) !important;
    left: 0.75rem !important;
    right: 0.75rem !important;
    max-width: none;
    border-radius: 0.75rem;
  }
}

/* Tablets: a card in the lower left corner (above the nav) instead of a full-width bar */
@media (min-width: 768px) and (max-width: 1023.98px) {
  #cookie-consent-banner {
    right: auto !important;
    max-width: 24rem;
  }
}

/* 2) Small text links (breadcrumb "Home", phone, e-mail, Facebook) were 20px tall.
      Touch targets should be at least 24px. */
.touch-link {
  display: inline-block;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}