/* =====================================================
   Safe IRA Rollover — Global Mobile Width Fix
   Prevents horizontal overflow on mobile pages
   Last updated: 2026-07-10
   ===================================================== */

html,
body {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

* {
  box-sizing: border-box;
}

main,
section,
article,
aside,
header,
footer,
nav,
div {
  max-width: 100%;
}

/* Prevent long text, URLs, affiliate links, and table text from pushing layout wider */
p,
li,
span,
a,
strong,
em,
td,
th,
h1,
h2,
h3,
h4,
h5,
h6 {
  overflow-wrap: anywhere;
  word-break: normal;
}

/* Images, videos, embeds */
img,
svg,
video,
canvas,
iframe {
  max-width: 100% !important;
}

/* Tables should scroll inside, not push whole page */
table {
  width: 100%;
  max-width: 100%;
  border-collapse: collapse;
}

.table-wrap,
.table-wrapper,
.overflow-table,
.comparison-table,
.pricing-table {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* Code/pre blocks */
pre,
code {
  max-width: 100%;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

/* Tailwind-style wide utilities that often cause mobile overflow */
.w-screen,
.min-w-full {
  max-width: 100vw !important;
}

/* Let flex/grid children shrink on mobile */
.flex > *,
.grid > * {
  min-width: 0;
}

/* Common CTA/button rows */
.flex-wrap {
  max-width: 100%;
}

/* Mobile-specific tightening */
@media (max-width: 640px) {
  .max-w-6xl,
  .max-w-5xl,
  .max-w-4xl,
  .max-w-3xl,
  .max-w-2xl,
  .container {
    max-width: 100% !important;
  }

  .px-8 {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  .p-8 {
    padding: 1.25rem !important;
  }

  .rounded-\[2rem\] {
    border-radius: 1.25rem !important;
  }

  /* Buttons should not force page wider */
  a,
  button {
    max-width: 100%;
  }

  .inline-flex,
  .flex {
    min-width: 0;
  }

  /* If a row refuses to fit, let it wrap */
  .gap-6,
  .gap-8,
  .gap-10 {
    row-gap: 1rem;
  }

  /* Long CTA buttons */
  a[class*="inline-flex"],
  a[class*="block"],
  button {
    white-space: normal;
    text-align: center;
  }
}
