/* AIMERS landing A-MIGO — mobile-only interaction polish.
 * Loaded outside the app bundle so the fix remains cheap on KVM4/low-power devices.
 */
@media (max-width: 767px) {
  /* The guide menu used to float as a narrow translucent card over the first
     A-MIGO reply. Make it an opaque, full-width action tray below the header. */
  div.absolute:has(> .space-y-1 > a[href="#contact"]):has(a[href^="tel:"]) {
    left: 1rem !important;
    right: 1rem !important;
    top: 4.75rem !important;
    width: auto !important;
    overflow: hidden !important;
    border-radius: 1rem !important;
    background: rgb(14 14 14 / 0.99) !important;
    border-color: rgb(255 255 255 / 0.14) !important;
    box-shadow: 0 18px 42px rgb(0 0 0 / 0.72) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  div.absolute:has(> .space-y-1 > a[href="#contact"]):has(a[href^="tel:"]) > .space-y-1 {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.25rem !important;
    padding: 0.5rem !important;
  }

  div.absolute:has(> .space-y-1 > a[href="#contact"]):has(a[href^="tel:"]) a {
    min-height: 44px !important;
    justify-content: flex-start !important;
    padding: 0.65rem 0.75rem !important;
    font-size: 0.875rem !important;
    line-height: 1.25rem !important;
    color: rgb(255 255 255 / 0.78) !important;
  }

  /* The horizontal suggestion rail showed a bright scrollbar that looked like
     an accidental progress bar in the mobile UI. Keep touch scrolling, hide chrome. */
  .custom-scrollbar:has(> button) {
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
  }

  .custom-scrollbar:has(> button)::-webkit-scrollbar {
    display: none !important;
  }
}