/* Small overrides to prevent horizontal overflow on mobile */
html,
body {
  overflow-x: hidden;
}

/* Safer box-sizing to avoid padding causing overflow */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Prefer percent-based sizing over viewport units to avoid scrollbar width issues */
.modal-backdrop {
  width: 100% !important;
  height: 100% !important;
  left: 0;
}

.min-vw-100,
.vw-100 {
  min-width: 100% !important;
  width: 100% !important;
}

/* Make media and large fixed elements respect container width */
img,
iframe,
embed,
object,
video {
  max-width: 100%;
  height: auto;
}

/* Utility: if any element still causes overflow, it can be targeted with this helper in dev tools */
.no-overflow-x {
  overflow-x: hidden !important;
}