/* Horizontal Scroll Prevention Fix */

/* Prevent horizontal scrolling on all devices */
html, body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
    position: relative !important;
}

/* Ensure all containers respect viewport width */
.container,
.container-fluid,
.row {
    max-width: 100% !important;
    overflow-x: hidden !important;
}

/* Fix any elements that might extend beyond viewport */
* {
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Specific fixes for common culprits */
.hero-section,
.section,
.navbar,
.footer {
    max-width: 100vw !important;
    overflow-x: hidden !important;
}

/* Fix swiper containers */
.swiper,
.swiper-container {
    max-width: 100% !important;
    overflow-x: hidden !important;
}

/* Fix any absolute positioned elements */
.position-absolute,
.fixed-top,
.fixed-bottom {
    max-width: 100vw !important;
}

/* Prevent text from causing overflow */
h1, h2, h3, h4, h5, h6, p, div, span {
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
}

/* Fix images that might be too wide */
img {
    max-width: 100% !important;
    height: auto !important;
}

/* Fix any floating elements */
.float-left,
.float-right {
    max-width: 100% !important;
}

/* Mobile specific fixes */
@media (max-width: 768px) {
    body {
        overflow-x: hidden !important;
        position: relative !important;
    }
    
    /* Ensure no element can cause horizontal scroll */
    * {
        max-width: 100vw !important;
    }
    
    /* Fix any margins that might cause overflow */
    .container {
        padding-left: 15px !important;
        padding-right: 15px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    .row {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    [class*="col-"] {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
}

/* Disable touch scrolling horizontally on mobile */
@media (max-width: 768px) {
    body {
        touch-action: pan-y pinch-zoom !important;
    }
    
    /* Prevent horizontal pan gestures */
    .hero-section,
    .section {
        touch-action: pan-y !important;
    }
}

/* Fix for any elements with negative margins */
[class*="m-"],
[class*="mx-"],
[class*="ml-"],
[class*="mr-"] {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Ensure viewport meta tag behavior */
@viewport {
    width: device-width;
    initial-scale: 1.0;
    maximum-scale: 1.0;
    user-scalable: no;
}