/* Accra Avenue 1.9.1 — mobile discovery/filter usability hotfix.
 * The persistent bottom dock is useful while browsing results, but it must not
 * cover primary search/filter controls. JS adds .aa-mobile-discovery-controls-visible
 * while a discovery control surface is in the mobile viewport or has focus.
 */
@media (max-width: 768px) {
  /* The shared #main wrapper must span the viewport. Its child .container
     provides the text gutter; padding both layers left white strips beside
     every archive and page hero on narrow screens. */
  body #main.site-content {
    width: 100%;
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
  }

  .aa-mobile-dock,
  .aa-bm-toggle,
  .aa-wa-float,
  .mobile-submit-link {
    transition: transform .18s ease, opacity .18s ease, visibility .18s ease !important;
  }

  body.aa-mobile-discovery-controls-visible .aa-mobile-dock,
  body.aa-mobile-discovery-controls-visible .aa-bm-toggle,
  body.aa-mobile-discovery-controls-visible .aa-wa-float,
  body.aa-mobile-discovery-controls-visible .mobile-submit-link {
    transform: translateY(calc(100% + 32px)) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  /* Keep the discovery controls comfortably touchable once the dock clears. */
  .archive-hero .aa-advanced-search,
  #aa-filter-bar .aa-filters__form,
  .aa-shop-discovery,
  .aa-job-filter {
    scroll-margin-bottom: 28px;
  }

  .archive-hero .aa-advanced-search :is(input, select, button),
  #aa-filter-bar .aa-filters__form :is(input, select, button),
  .aa-search-form :is(input, button) {
    min-height: 48px;
  }

  #aa-filter-bar.aa-filters {
    padding-bottom: 22px;
  }

  .archive-hero .aa-advanced-search {
    margin-bottom: 8px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .aa-mobile-dock,
  .aa-bm-toggle,
  .aa-wa-float,
  .mobile-submit-link {
    transition: none !important;
  }
}