@charset "UTF-8";

/* ========================================================================
     Estilos del sitio
 ========================================================================== */

/* Colores de la marca */
:root {
    --white: #FFFFFF;
    --black: #000000;
    --primary-color: 0, 109, 78; /* green #006D4E */
    --light-primary-color: 78, 209, 118; /* light green #4ED176 */
    --secondary-color: 7, 157, 239; /* blue #079DEF */
    --light-secondary-color: 82, 222, 255; /* light blue #52DEFF */
    --third-color: #FF7150; /* red */
    --light-third-color: #FF9C9C; /* red light */
    --fourth-color: #FF9FCF;
    --light-fourth-color: #FFBDDE;
    --skyblue-color: #2AB5DF;
    --wet-asphalt-color: #40516F;
    --gray-color: #C0C0C0;
    --modal-text: #212529;
}

html, body {
    width: 100%;
    min-height: 100%;
    min-width: 320px;
    font-size: 13px;
}

/* Nuevos utils */
.link {
    text-decoration: underline;
}

.link:hover {
    opacity: .7;
}

.link-green, .link-green:hover {
    color: rgb(var(--light-primary-color));
}

.link-blue, .link-blue:hover {
    color: rgb(var(--secondary-color));
}

.link-back {
    color: var(--third-color);
    transition: all .2s;
}

.link-back:hover {
    color: var(--third-color);
    opacity: 0.5;
}

.link-back:active,
.link-back:focus,
.link-back:first-child:active,
.link-back:first-child:focus {
    color: var(--third-color);
    opacity: 0.5;
    border-color: var(--third-color);
}


/** listas **/
.list-space-y li {
    padding-bottom: .5em;
}

.list-space-y li:last-child {
    padding-bottom: 0;
}

/* Nuevo Login */
.login {
    min-height: 100vh;
    background-color: rgb(var(--primary-color));
    position: relative;
}

.login-bg-circle:before {
    content: '';
    display: block;
    width: 100%;
    padding-bottom: 70%;
    background-image: url('Images/circle.svg');
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: center 130%;
    position: absolute;
    left: 0;
    top: 0;
}

.login-logo-wrp {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.login-logo-wrp:before {
    content: '';
    display: block;
    background: #FFF;
    position: absolute;
    width: calc(100% - 3em);
    height: 2px;
    bottom: 0;
}

.login-bg-circle .login-logo-wrp:before {
    display: none;
}

.login-logo {
    display: block;
    width: 70%; /*80*/
    max-width: 32em; /*490px*/
    margin: auto;
}

.login-form-wrp {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.login-form {
    width: 100%;
}

.login-body {
    width: 100%;
    margin: 0 auto;
}

.login-title {
    font-size: 2.25em;
    margin-bottom: .5em;
}

.login-text {
    margin-bottom: 2.8em;
}

.login-btn-pass {
    cursor: pointer;
}

/* Nuevo Login - Mensajes Email */
.login-msg {
    background-color: var(--white);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.login-msg-logo {
    max-width: 15em;
}

/* Nuevo Restablecer contraeña (cambio en HTML para que funcione correctamente) */
.login-reset .row {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: wrap;
}

.login-reset .login-logo-wrp {
    width: 100%;
}

.login-reset .login-form-wrp {
    order: 1;
}

.login-reset .panel-body {
    width: 100%;
    margin: 0 auto;
    padding: 0;
}

.login-reset .form-group {
    position: relative;
    display: table;
    border-collapse: separate;
}

.login-reset .form-control {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
    border-right-width: 0;
}

.login-reset .form-control:focus {
    border-right-width: 0;
}

.login-reset .input-group-addon {
    border-bottom-right-radius: 4px !important;
    border-top-right-radius: 4px !important;
}

.login-reset .form-control:focus + .input-group-addon {
    border-left-width: 0;
}

.login-reset .btn {
    text-transform: uppercase;
    font-size: .85em; /* 12px */
    border-color: transparent;
    border-width: 2px;
    border-style: outset;
    outline: 0;
    padding: 1.1em 1em;
    line-height: 1.2;
}

.login-reset .btn:focus, .login-reset .btn:hover {
    opacity: .7;
    text-decoration: none;
    box-shadow: none;
}

.login-reset .btn-danger {
    background-color: rgb(var(--secondary-color)) !important;
}

.login-reset .text-danger {
    display: table-row;
}


/* Nuevo Login - reset estilos de bootstrap */
.login .mb-sm {
    margin-bottom: 1.5em !important;
}

.login .form-group,
.login .mb-lg {
    margin-bottom: 2.5rem !important;
}

.login .mb-xl {
    margin-bottom: 3.5rem !important;
}

.login .c-checkbox span {
    border-color: var(--white);
    background: var(--white);
}

.login .c-checkbox:hover span {
    border-color: rgb(var(--secondary-color));
}

.login .c-checkbox input[type=checkbox]:checked + span {
    border-color: rgb(var(--secondary-color));
    background: rgb(var(--secondary-color));
}

.login .form-control {
    border-width: 2px;
    border-color: transparent;
}

.login .form-control:focus {
    border-color: var(--gray-color);
}

.login .input-group-addon {
    color: rgb(var(--secondary-color));
    text-align: center;
    background-color: var(--white);
    border-color: var(--white);
    border-width: 2px;
}

.login .form-control:focus + .input-group-addon {
    border-color: var(--gray-color);
}

.login .btn-danger:hover,
.login .btn-danger:focus {
    background-color: #f05050;
    border-color: transparent;
}

.login .text-danger {
    text-shadow: 0px 0px 2px rgba(0, 0, 0, .5);
}

.login-msg .panel {
    max-width: 21em;
    box-shadow: none;
}


/***** Opciones de menu de preacreditado *****/
.client-card {
    position: relative;
    border-radius: 1rem;
    box-shadow: 0 0.375rem 0.5rem rgba(0, 0, 0, 0.13);
    display: flex;
    flex-direction: column;
    height: 100%;
}

.client-card--disabled {
    -webkit-user-select: none; /* Safari */
    user-select: none; /* Standard syntax */
    pointer-events: none;
}

.client-card--disabled:after {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    background: rgba(73, 85, 100, 0.50);
    top: 0;
    left: 0;
    border-radius: 1rem;
    z-index: 2;
}

.client-card--completed:before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: rgba(73, 85, 100, 0.50);
    background-image: url("Images/Icons/icono-check-outline.svg");
    background-repeat: no-repeat;
    background-size: 25% auto;
    background-position: center;
    top: 0;
    left: 0;
    border-radius: 1rem;
}

.client-card-img-wrp {
    border-radius: 1rem 1rem 0 0;
    overflow: hidden;
}

.client-card-cta {
    position: relative;
    border-radius: 1rem;
    background: #FFF;
    padding: 1.36rem 1.36rem 1rem;
    margin-top: -12%;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    z-index: 1;
}

.client-card-title {
    color: #4F4F4F;
    /*font-family: Inter;*/
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin-bottom: 1rem;
}

.client-card-btn {
    --bs-btn-bg: #079DEF;
    --bs-btn-border-color: #079DEF;
    /*--bs-btn-border-radius: 0;*/
    width: 100%;
    max-width: 13rem;
    padding: 0.3125rem;
    color: #FFF;
    line-height: normal;
    margin: 0 auto;
}

.client-card-btn:hover,
.client-card-btn:focus,
.client-card-btn:active {
    --bs-btn-hover-bg: rgba(7, 157, 239, .7);
    --bs-btn-active-bg: rgba(7, 157, 239, .7);
    --bs-btn-hover-border-color: rgba(7, 157, 239, .7);
    --bs-btn-active-border-color: rgba(7, 157, 239, .7);
}

.client-card-link {
    --bs-link-color: #079DEF;
    --bs-btn-hover-color: rgba(7, 157, 239, .7);
    --bs-btn-active-color: rgba(7, 157, 239, .7);
    /*font-family: Poppins;*/
    font-size: 0.75rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    text-transform: uppercase;
    background: url("../../Content/Images/Icons/arrow.svg") no-repeat right center;
    text-decoration: none;
    padding-right: 1.8rem;
    align-self: end;
}



/********* Datos de solicitud ******/
.client-data-header .link-back {
    font-size: 1.1rem;
}

.client-data-overview-btn {
    width: 100%;
    min-height: 1.5em;
    background-color: #EEF1F6;
    color: #495564;
    margin-bottom: 30px;
    border: none;
    outline: none;
    padding: 16px 20px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    font-weight: bold;
}

.client-data-overview-btn span {
    display: flex;
    align-items: center;
}

.client-data-overview-btn .title {
    padding-right: 20px;
}

.client-data-overview-btn .status {
    flex: 1;
    max-width: 9em;
    padding-right: 2.5em;
}

.client-data-overview-btn .status.completed {
    background-repeat: no-repeat;
    background-position: right center;
    background-size: auto 1.5em;
    background-image: url('Images/Icons/icono-check-outline.svg');
    color: #279B14;
}

.client-data-overview-btn .status.incompleted {
    color: #C87800;
}

.client-data-overview-btn img {
    padding-left: 70px;
}

/* Indicador de Pasos de datos de solicitud */
.client-data-stepper {
    max-width: 65em;
    width: 100%;
    font-size: 0.8em;
    overflow-x: auto;
}

.client-data-stepper-btn {
    flex: 1 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    background-color: transparent;
    border: 0;
    outline: 0;
    width: 30%;
}

.client-data-stepper-btn:before {
    content: '';
    position: relative;
    z-index: 1;
    display: block;
    width: 2em;
    height: 2em;
    border-radius: 20em;
    background-color: #D9D9D9;
    margin: 0 auto 1em;
}

    .client-data-stepper-btn:after {
        width: 100%;
        content: "";
        position: relative;
        top: 1.1em;
        left: 50%;
        height: 4px;
        background-color: #D9D9D9;
        order: -1;
    }

.client-data-stepper-btn:last-child:after,
.client-data-stepper-btn.completed:last-child:after {
    background-color: transparent;
}

.client-data-stepper-txt {
    color: #495564;
    font-size: 1em;
    font-weight: bold;
    padding: 0;
}

.client-data-stepper-btn.completed:before,
.client-data-stepper-btn.completed:after {
    background-color: #079647; /*#006D4E*/
}

.client-data-stepper-btn.active:before,
.client-data-stepper-btn.active:active {
    background-color: #FFF;
    border: 5px solid #079647;
}

.client-data-stepper-btn.danger .client-data-stepper-txt {
    color: #FF7150;
}


/********* Carga de documentos ******/
.documents-table tbody tr td,
.documents-table .altura,
.documents-table .altura > a,
.documents-table .altura > img,
.documents-table .altura > .link {
    vertical-align: middle;
}

.documents-table .altura {
    width: 100%;
    min-width: 12em;
    display: inline-block;
}

.documents-table .accepted {
    padding-right: 2em;
    background-image: url('Images/Icons/icono-aceptado.png');
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 2em;
}

.documents-table .rejected {
    padding-right: 2em;
    background-image: url('Images/Icons/icono-rechazado.png');
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 2em;
}

.uploaded-docs-completed + .table-gral-others {
    display: none;
}

/* Mensaje de revisión de documentos */
.msg-reviewing-docs {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    min-height: 20em;
    justify-content: center;
    font-size: 0.8em;
}

.msg-reviewing-docs-title {
    font-size: 1.5em;
    font-weight: bold;
    margin-bottom: 1em;
}

.msg-reviewing-docs-title:before {
    content: '';
    display: block;
    width: 100%;
    max-width: 4.5em;
    padding-bottom: 34%;
    margin: 0 auto 1em;
    background-image: url("Images/Icons/circle-check-green.svg");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.msg-reviewing-docs p {
    max-width: 27em;
    margin: 0 auto;
}

/* Media queries extra */
@media screen and (min-width: 420px) {
    .login-title {
        font-size: 2.8em;
        margin-bottom: .35em;
    }
}

/* Mismos media queries que Bootstrap */
@media screen and (min-width: 576px) {
    .login-body {
        max-width: 25em; /*350px*/
    }

    .login-reset .panel-body {
        max-width: 25em; /*350px*/
    }

    .client-data-stepper {
        overflow-x: hidden;
    }

    .client-data-stepper-btn {
        flex: 1;
        width: auto;
    }

    .client-data-stepper-btn:before {
        width: 3em;
        height: 3em;
    }

    .client-data-stepper-btn:after {
        top: 1.7em;
        height: 8px;
    }

    /* Mensaje de revisión de documentos */
    .msg-reviewing-docs {
        padding: 0 0.5em;
        font-size: 1em;
    }
}

@media screen and (min-width: 992px) {
    .login-logo {
        width: 62%; /*70*/
    }

    /* Botones Datos de solicitud*/
    .client-data-overview-btn {
        padding: 16px 7%;
    }

    /* Indicador de pasos */
    .client-data-stepper {
        font-size: 1em;
    }

    /* Mensaje de revisión de documentos */
    .msg-reviewing-docs {
        padding: 2em;
        font-size: 1.1em;
    }
}

@media screen and (min-width: 768px) {
    .login-logo-wrp, .login-form-wrp {
        min-height: 100vh;
    }

    .login-logo-wrp:before {
        height: calc(100vh - 3em);
        width: 2px;
        right: 0;
        bottom: auto;
    }

    .login-bg-circle:before {
        padding-bottom: 0;
        width: 58%;
        min-height: 100vh;
        background-size: 108% auto;
        background-position: right center;
        left: 0;
        top: 0;
    }

    .login-reset .row {
        flex-direction: row;
        align-items: initial;
        flex-wrap: nowrap;
    }

    .login-reset .login-logo-wrp {
        width: 50%;
    }

    .client-data-stepper {
        width: 80%;
    }
}