/* Global overflow fixes to remove stray horizontal scrollbar */
html, body, #root, section {
  width: 100%;
  max-width: 100vw;
  overflow-x: clip;
}

/* Fallback for browsers not supporting overflow: clip */
@supports not (overflow: clip) {
  html, body, #root, section { overflow-x: hidden !important; }
}

/* Extra safety for motion/animated wrappers */
[data-motion] { overflow-x: clip; }

/* Prevent transforms and animated elements from causing side scroll */
[class*="animate-"],
[class*="motion-"],
.motion-safe\:animate-*,
.motion-safe\:motion-* {
  max-width: 100%;
  overflow-x: clip;
}

/* Ensure containers don't exceed viewport width */
* { box-sizing: border-box; max-width: 100vw; }

/* Prevent double vertical scrollbars by keeping vertical scroll only on body */
html, body { overflow-y: auto; }
#root, #root > * { overflow-y: hidden !important; }

/* Ensure the main content area never becomes its own scroll container */
main {
  width: 100%;
  max-width: 100vw;
  overflow-y: hidden !important;
  overflow-x: clip;
  height: auto !important;
  min-height: 0 !important;
}
/* Mobile scroll fixes */
@media (max-width: 768px) {
  html {
    scroll-behavior: smooth;
  }
  
  input, 
  select, 
  textarea,
  button {
    font-size: 16px !important; /* Prevent iOS zoom on focus */
  }

  /* Better tap targets for mobile */
  a, button {
    min-height: 44px;
    min-width: 44px;
  }
  
  /* Fix 100vh issue on mobile browsers */
  .min-h-screen,
  .min-h-dvh {
    min-height: -webkit-fill-available;
  }
}