/* =========================
   GLOBAL MOBILE SCROLL FIX
   ========================= */

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

@media (max-width: 991.98px) {

    html,
    body {
        height: auto;
        min-height: 100%;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    body.modal-open {
        overflow-y: auto !important;
        padding-right: 0 !important;
    }

    .container-fluid.mt-4 {
        margin-top: 1rem !important;
        padding-left: 12px;
        padding-right: 12px;
        overflow: visible !important;
    }

    .row.align-items-stretch {
        row-gap: 16px;
    }

    /* LEFT + RIGHT columns full natural height */
    .col-lg-5,
    .col-lg-7 {
        width: 100%;
    }

    /* MAP */
    #map {
        min-height: 220px !important;
        height: auto !important;
        overflow: visible !important;
    }

    /* When register page loads inside map area */
    #map > * {
        max-width: 100%;
    }

    /* IMPORTANT: register page scroll should use full page, not inner box scroll */
    .contractor-container,
    .labour-container,
    #contractor-form,
    #labour-form {
        max-height: none !important;
        height: auto !important;
        overflow: visible !important;
        padding-right: 0 !important;
    }

    /* Signin modal */
    #signinModal .modal-dialog {
        margin: 12px;
    }

    #signinModal .modal-content {
        border-radius: 16px;
    }

    #signinModal .welcome-panel {
        padding: 24px 18px !important;
    }

    #signinModal .welcome-title {
        font-size: 32px !important;
        line-height: 1.2;
    }

    #signinModal .emoji {
        font-size: 48px !important;
        margin: 20px 0 !important;
    }

    #signinModal .register-text {
        margin-top: 20px !important;
        font-size: 14px;
    }

    #signinModal .col-md-6.p-5 {
        padding: 20px !important;
    }

    #signinModal .phone-row,
    #signinModal .otp-row,
    #signinModal .signin-btn-row {
        flex-direction: column;
        gap: 10px !important;
    }

    #signinModal .country-code,
    #signinModal #phoneNumber,
    #signinModal #otpInput,
    #signinModal .otp-row button,
    #signinModal .signin-btn-row button {
        width: 100% !important;
    }

    /* Hero */
    .hero-section {
        padding: 20px 15px !important;
    }

    .slider-section {
        width: 100% !important;
        margin-top: 18px;
    }

    .distance-value {
        text-align: center;
        font-size: 14px;
    }

    /* Nearby cards */
    .worker-card {
        padding: 16px !important;
    }

    .avatar {
        width: 60px;
        height: 60px;
    }

    /* Footer full scroll visible */
    #footer,
    #footer footer {
        overflow: visible !important;
        height: auto !important;
        min-height: auto !important;
        margin-bottom: 20px;
    }

    /* Chat widget overlap avoid */
    body {
        padding-bottom: 90px;
    }

    /* Toast */
    #toastContainer {
        top: 12px !important;
        right: 12px !important;
        left: 12px !important;
    }

    #toastContainer > div {
        width: 100%;
        min-width: auto !important;
    }
}

@media (max-width: 575.98px) {
    #map {
        min-height: 200px !important;
    }

    .hero-section {
        padding: 16px 12px !important;
    }

    body {
        padding-bottom: 100px;
    }
}