﻿/* LOGIN RESPONSIVE */
.login-page {
    min-height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
}

.login-container {
    width: 100%;
    max-width: 440px;
}

    .login-container .card {
        width: 100%;
        border-radius: .55rem;
    }

    /*CABECERA*/
    .login-container .card-header {
        padding: 1rem 1.3rem;
    }

        .login-container .card-header h3 {
            margin: 0;
            font-size: 1.6rem;
            font-weight: 700;
        }

    /*CUERPO*/
    .login-container .card-body {
        padding: 1.6rem 1.4rem 1.7rem;
    }

    .login-container .mb-3 {
        margin-bottom: 1.35rem !important;
    }

    /*LABELS*/
    .login-container .form-label {
        font-weight: 600;
        margin-bottom: .45rem;
    }

    /*INPUTS*/
    .login-container .form-control {
        min-height: 44px;
        border-radius: .4rem;
    }

    .login-container .input-group .btn {
        min-width: 48px;
    }

    /*BOTÓN*/
    .login-container .btn-app-login {
        min-height: 46px;
        margin-top: .4rem;
        font-weight: 600;
    }

    /*VALIDACIONES*/
    .login-container .text-danger {
        font-size: .82rem;
    }

/*TABLET*/
@media (max-width: 768px) {

    .login-page {
        padding: 1.75rem 1rem;
    }

    .login-container {
        max-width: 460px;
    }

        .login-container .card-body {
            padding: 1.45rem 1.25rem 1.5rem;
        }
}

/*TELÉFONO*/
@media (max-width: 576px) {

    .login-page {
        align-items: flex-start;
        padding: 2rem .85rem 1rem;
    }

    .login-container {
        max-width: none;
    }

        .login-container .card {
            border-radius: .45rem;
        }

        .login-container .card-header {
            padding: .95rem 1rem;
        }

            .login-container .card-header h3 {
                font-size: 1.35rem;
            }

        .login-container .card-body {
            padding: 1.2rem 1rem 1.3rem;
        }

        .login-container .form-control,
        .login-container .input-group .btn,
        .login-container .btn-app-login {
            min-height: 44px;
        }
}
