/* ==========================================================
   PackGPT Mobile Login
   Applies to:
   ✓ index.html
   ✓ setup-password.php
   ✓ reset-password.php
========================================================== */

@media screen and (max-width:768px){

    body{

        overflow:auto;

    }

    #loginPage{

        position:relative;

        min-height:100vh;

        height:auto;

        padding:20px;

        display:flex;

        justify-content:center;

        align-items:center;

        box-sizing:border-box;

    }

    /* Login */

    .login-box{

        width:100%;

        max-width:400px;

        padding:28px 24px;

        border-radius:18px;

    }

    /* Password Pages */

    .password-box{

        width:100%;

        max-width:420px;

        padding:28px 24px;

        border-radius:18px;

    }

    /* Logo */

    .login-logo{

        width:64px;

        height:64px;

        font-size:30px;

        margin-bottom:14px;

    }

    /* Login */

    .login-title{

        font-size:32px;

        line-height:1.1;

    }

    .login-subtitle{

        max-width:100%;

        font-size:14px;

        line-height:1.5;

        margin-top:8px;

    }

    /* Password */

    .password-title{

        font-size:30px;

        line-height:1.15;

        margin-bottom:8px;

    }

    .password-subtitle{

        font-size:14px;

        line-height:1.4;

        margin-bottom:14px;

    }

    /* Form */

    .password-form{

        margin-top:10px;

    }

    .password-form label{

        text-align:left;

        margin-bottom:6px;

        font-size:14px;

    }

    input{

        height:50px;

        padding:12px;

        margin:8px 0;

        font-size:16px;

    }

    button{

        height:50px;

        margin-top:10px;

        font-size:16px;

    }

    /* Password Helper */

    .password-rules{

        grid-template-columns:1fr;

        gap:6px;

        font-size:13px;

    }

    /* Footer */

    .login-footer,

    .password-footer{

        margin-top:18px;

        font-size:12px;

    }

}