/* ==========================================================================
   AMGB mobile polish v3, additions on top of mobile-v2.css
   --------------------------------------------------------------------------
   Loaded AFTER mobile-v2.css. Fixes uncovered by the 2026-05-28 cross-device
   QA loop (10 pages x 9 viewports = 90 captures).

   Root causes addressed
     1. .amgb-btn-tertiary text links sat at 34 px tall, below WCAG 2.5.8
        target size minimum of 44 px on mobile/tablet
     2. Long .amgb-btn-tertiary labels (e.g. "Reviews from jewellery sellers
        and more on the testimonials page") wrapped past the viewport edge on
        narrow phones (393 px and 384 px wide), causing horizontal overflow
        on the sell-gold page in particular
     3. .amgb-btn-tertiary and .amgb-page__link-row paragraphs need a
        minimum tap-target height across all touch viewports
   ========================================================================== */

/* --- Tap-target sizing for tertiary CTAs across all viewports ------------- */
.amgb-btn-tertiary {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding-top: 10px;
  padding-bottom: 10px;
  line-height: 1.3;
}

/* Long-label wrap protection on narrow viewports (phone widths) */
@media (max-width: 640px) {
  .amgb-btn-tertiary {
    white-space: normal;
    word-break: normal;
    overflow-wrap: anywhere;
    max-width: 100%;
  }

  .amgb-page__link-row,
  .amgb-home__what-link,
  .amgb-home__how-link,
  .amgb-home__why-link,
  .amgb-home__test-link,
  .amgb-home__faq-link {
    display: flex;
    flex-wrap: wrap;
    max-width: 100%;
  }

  .amgb-page__link-row a,
  .amgb-home__what-link a,
  .amgb-home__how-link a,
  .amgb-home__why-link a,
  .amgb-home__test-link a,
  .amgb-home__faq-link a {
    max-width: 100%;
    word-break: normal;
    overflow-wrap: anywhere;
  }
}

/* Tablet portrait widths (810 px iPad 10) — same min-height contract */
@media (min-width: 641px) and (max-width: 1023px) {
  .amgb-btn-tertiary,
  .amgb-page__link-row a,
  .amgb-home__what-link a,
  .amgb-home__how-link a,
  .amgb-home__why-link a,
  .amgb-home__test-link a,
  .amgb-home__faq-link a {
    min-height: 44px;
    padding-top: 10px;
    padding-bottom: 10px;
    display: inline-flex;
    align-items: center;
  }
}

/* --- Inline tel: / mailto: tap target lift on mobile and tablet ----------- */
@media (max-width: 1023px) {
  a[href^="tel:"],
  a[href^="mailto:"] {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding-top: 6px;
    padding-bottom: 6px;
  }
}

/* --- Defensive: any tertiary CTA inside an SVG-bearing wrapper that might
       have overflowed on narrow viewports gets explicit max-width ---------- */
.amgb-btn-tertiary svg {
  flex: 0 0 auto;
  max-width: 1em;
}
