/* 
* CampusUdaan - Mobile Fixes
* Prevents horizontal scrolling and fixes hamburger menu positioning on small screens
* Also fixes hero image rotation issues on mobile devices
*/

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

/* Fix for very small screens (below 318px) */
@media (max-width: 318px) {
    /* Adjust header container */
    header .container {
        padding-left: 10px !important;
        padding-right: 10px !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* Logo adjustments */
    .logo img {
        height: 40px !important; /* Adjusted for small screens */
        max-width: 180px !important;
    }
    
    /* Hamburger menu positioning */
    .navbar-toggler {
        position: relative !important;
        right: 0 !important;
        padding: 5px !important;
        margin-right: 0 !important;
    }
    
    /* Adjust navigation items */
    .navbar-nav {
        width: 100% !important;
    }
    
    /* Ensure page banner stays within viewport */
    .page-banner {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        left: 0 !important;
        right: 0 !important;
        box-sizing: border-box !important;
    }
    
    /* Fix for hero image rotation */
    .hero-image img.float {
        transform: none !important;
        -webkit-transform: none !important;
        -moz-transform: none !important;
        -ms-transform: none !important;
        -o-transform: none !important;
        perspective: none !important;
        animation: none !important;
        transition: none !important;
        box-shadow: 0 10px 20px rgba(0,0,0,0.15) !important;
        display: block !important;
        border-radius: 8px !important;
    }
    
    /* Adjust container padding */
    .container {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    
    /* Fix for Request Demo button */
    .btn-demo {
        padding: 8px 12px !important;
        font-size: 12px !important;
    }
}

/* Additional fixes for extremely small screens */
@media (max-width: 280px) {
    /* Further reduce logo size */
    .logo img {
        height: 35px !important;
        max-width: 150px !important;
    }
    
    /* Minimize hamburger menu */
    .navbar-toggler {
        padding: 3px !important;
    }
    
    /* Adjust page title size */
    .page-title {
        font-size: 1.5rem !important;
    }
    
    /* Adjust breadcrumb size */
    .breadcrumb {
        font-size: 12px !important;
    }
}