﻿/*Cambios HCM*/
/*Textos simples y elementos interactivos no deberían ser del mismo color*/
/*La implementación de Margarito sigue el diseño en la propuesta y usa etiquetas en el formulario. El nuevo PreveNet usa placeholders en los formularios. Se modifica para ser coherente con los formularios nuevos.*/

html .blank-page .content.app-content {
    background: linear-gradient(31deg,rgba(23, 1, 31, 1) 0, rgba(0, 83, 253, 1) 37%, rgba(250, 164, 252, 1) 72%, rgba(243, 231, 212, 1) 100%);
}

.auth-wrapper .auth-bg {
    background: #ffffff;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.2) 0, rgba(255, 255, 255, 0.5) 100%);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    border: 1.5px solid #fff;
    border-radius: 25px;
    box-shadow: 2px 2px 5px #000000;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
}

.form-control,
.form-check-input {
    background-color: #ffffff;
    background-color: rgba(255, 255, 255, 0.0);
    border: 1px solid #fff;
}

    .form-control:focus, .form-control.form-control-merge.valid {
        background-color: #ffffff;
        background-color: rgba(255, 255, 255, 0.0);
        border: 1px solid #fff !important;
    }

.auth-wrapper .auth-bg {
    width: 31.5%;
    height: 95%;
}

.auth-wrapper.auth-cover .auth-inner {
    place-items: center;
}

/*Textos simples*/
h2.card-title.fw-bold {
    font-weight: 800 !important;
    font-size: 2.3rem;
    color: #002C6F !important;
}

p.card-text {
    color: #0D65FF;
    color: #002C6F !important;
    font-weight: 800;
    font-size: 1.2rem;
}

p.card-text small.text-muted {
    font-weight: 300;
    font-size: 1rem;
    color: #0D65FF !important;
    color: #002C6F !important;
}

label {
    color: #021939 !important;
    font-weight: 400;
    font-size: 1.2rem !important;
}

.form-check-label, a.text-primary {
    color: #0D65FF !important;
}

.btn {
    border-radius: 1.5rem;
}

button.btn.btn-primary {
    border-color: #0D65FF !important;
    background-color: #0D65FF !important;
    font-size: 1.2rem !important;
}

.input-group-text {
    color: #0D65FF !important;
}

/* Standard syntax for modern browsers */
input[type="text"].form-control::placeholder, input[type="password"].form-control::placeholder {
    color: #ffffff; /* Sets the placeholder color */
    opacity: 1; /* Ensures consistent opacity in Firefox */
}

div.input-group.input-group-merge.form-password-toggle span.input-group-text.cursor-pointer {
    border: 1px solid #fff;
}


@media (min-width: 992px) {
    .col-lg-8 {
        flex: 0 0 auto;
        width: 65.66667%;
    }
}

@media (min-width: 992px) {
    .p-lg-5 {
        padding: 1rem !important;
    }
}

/*Empiezan estilos para responsive*/
/*@media (max-height: 825px) and (max-width: 991.98px) {*/
@media (max-width: 991.98px) {

    html .blank-page .content.app-content {
        background: #ffffff;
    }

    .auth-wrapper .auth-bg {
        width: 100%;
        height: 100%;
        padding-bottom: 3rem;
        border-radius: 0;
    }

    .auth-wrapper.auth-cover .auth-inner {
        padding-bottom: 0;
    }

    .form-control, .form-check-input {
        background-color: #ffffff;
        background-color: rgba(255, 255, 255, 0.0);
        border: 1px solid #ccc;
    }

        .form-control:focus {
            background-color: #ffffff;
            background-color: rgba(255, 255, 255, 0.0);
            border: 1px solid #ccc;
        }

    .p-lg-5 {
        padding: 0 3rem 3rem 3rem !important;
    }

    h2.card-title.fw-bold {
        font-size: 1.5rem;
        text-align: center;
        color: #3764F4 !important;
    }

    .mb-2 {
        text-align: center;
    }

    .card-text {
        display: none;
    }

    .mx-auto {
        height: 100%;
    }

    .btn-primary {
        background-color: #2577FC !important;
    }

    div.input-group.input-group-merge.form-password-toggle span.input-group-text.cursor-pointer {
        border: 1px solid #ccc;
    }
}

/*Notas Margarito*/
/* Se agrego una imagen que se llama curva-degradado.svg */
/* Se ajusto el archivo Login_Disenio1B_2_alt1.svg colores y tamaño de texto */
/* Se modifico el archivo Isotipo_Color.svg en color y forma*/
/* Se quito el placeholder del formulario*/