/*
CSS LOGIN
*/

/* Paginador */

.paginas span,
.paginas a {
    font-size: 14px !important;
    color: #707070 !important;
}

.borde_left span, .borde_left a{
    border-end-start-radius: 7px !important;
    border-start-start-radius: 7px !important;
}


.border_start span, .border_start a{
    border-end-end-radius: 7px !important;
    border-start-end-radius: 7px !important;
}

.paginas.active .page-link,
.paginas.page-item.active .page-link,
.active>.page-link {
    color: white !important;
    background-color: #F4B512 !important;
    padding-left: 5px;
    padding-right: 5px;
}

.ultimo_primero {
    font-size: 14px !important;
    color: white !important;
    margin-left: 5px;
    margin-right: 5px;
    border-radius: 5px !important;
}

.ultimo_primero a , .ultimo_primero span {
    font-size: 14px !important;
    background-color: #ACACAC !important;
    border-radius: 5px !important;
    color: white !important;
}

.ultimo_primero a span {
    font-size: 14px !important;
    color: white !important;
    background-color: #ACACAC !important;
    border-radius: 5px !important;
}



.Number {
    font-size: 40px;
    color: #4EAB38;
    font-weight: bold;
}

.fs_30 {
    font-size: 30px;
}

.hidden_label {
    visibility: hidden;
}

.signoPeso {
    color: #707070;
    font-size: 14px;
    font-weight: bold;
}

.SaldoTotal {
    background-color: white;
    padding: 20px;
    border-radius: 10px;
    border: 1px solid #ACACAC;
    box-shadow: 5px 5px 5px #00000029;
}

.div_valor_ticket span {
    font: 14px;
    letter-spacing: 0px;
    color: #707070;
    opacity: 1;
}


.btn_close:hover {
    color: inherit !important;
    text-decoration: none;
    opacity: 1 !important;
    background-color: unset !important;
    border-color: unset !important;
}

.NumberSaldo {
    font-size: 40px;
    color: #4EAB38 !important;
    font-weight: bold;
}

.signoPeso {
    color: #707070 !important;
    font-size: 14px;
    font-weight: bold;
}

.totalReportes {
    height: 104px;
    background-color: white;
    padding: 15px;
    border-radius: 10px;
    border: 1px solid #ACACAC;
    box-shadow: 5px 5px 5px #00000029;
}

.SaldoTotal {
    background-color: white;
    padding: 15px;
    border-radius: 10px;
    border: 1px solid #ACACAC;
    box-shadow: 5px 5px 5px #00000029;
}

.opacity_input_login::placeholder {
    opacity: 0.5;
}

/* Chrome, Safari, Edge, Opera */
.input_number::-webkit-outer-spin-button,
.input_number::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
.input_number[type=number] {
    -moz-appearance: textfield;
}

.h_fit_content {
    height: fit-content !important;
}

.div_login {
    font-family: 'Montserrat', sans-serif;
    width: 426px;
    height: 473px;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #ACACAC;
    box-shadow: 5px 5px 5px #00000029;
    border-radius: 20px;
    opacity: 1;
    margin: 0 auto;
}

.btn_login,
.btn_login:hover {
    background: #F4B511 0% 0% no-repeat padding-box !important;
    border-radius: 20px !important;
    opacity: 1;
    width: 182px;
    height: 40px;
    font-size: 14px !important;
    color: white !important;
    background-color: none !important;
    border: none !important;
}

.btn_login_margin_2 {
    margin-right: .5rem !important;
    margin-left: .5rem !important;
}

.btn_mas,
.btn_mas:hover {
    background: #0d6efd 0% 0% no-repeat padding-box !important;
    border-radius: 20px !important;
    opacity: 1;
    width: 182px;
    height: 40px;
    font-size: 14px !important;
    color: white !important;
    background-color: none !important;
    border: none !important;
}

.btn_entrada,
.btn_entrada:hover {
    background: #28a745 0% 0% no-repeat padding-box !important;
    border-radius: 20px !important;
    opacity: 1;
    width: 182px;
    height: 40px;
    font-size: 14px !important;
    color: white !important;
    background-color: none !important;
    border: none !important;
}

.btn_x,
.btn_x:hover {
    background: #dc3545 0% 0% no-repeat padding-box !important;
    border-radius: 20px !important;
    opacity: 1;
    width: 70px;
    height: 40px;
    font-size: 14px !important;
    color: white !important;
    background-color: none !important;
    border: none !important;
}

.btn_cancel {
    background: #F7F7F7 0% 0% no-repeat padding-box !important;
    border-radius: 20px !important;
    opacity: 1;
    width: 182px;
    height: 40px;
    font-size: 14px !important;
    color: #ACACAC !important;
    background-color: none !important;
    border: none !important;
    border: 1px solid #ACACAC !important;
}

.h1_login {
    color: #707070;
    text-align: center;
    font-size: 14px !important;
    letter-spacing: 0px;
    opacity: 1;
}

.label {
    color: #707070 !important;
    font-size: 14px !important;
    font-weight: bold !important;
    letter-spacing: 0px !important;
    opacity: 1 !important;
    margin-bottom: 5px;
}

.input_login {
    border: 1px solid #ACACAC !important;
    border-radius: 20px;
    opacity: 1;
}

.input_login::placeholder {
    font-size: 14px !important;
    padding-left: 10px;
    padding-right: 10px;
}

.byssof {
    color: #707070;
    text-align: left;
    font: normal normal normal 14px/18px 'Montserrat', sans-serif;
    letter-spacing: 0px;
    opacity: 1;
}

.input_password_login input {
    border-start-start-radius: 20px;
    border-end-start-radius: 20px;
}

.input_password_login span {
    border-end-end-radius: 20px;
    border-start-end-radius: 20px;
}

.loadingOverlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.loadingText {
    color: #007bff;
    margin-top: 1rem;
    font-size: 1.5rem;
    font-weight: 600;
    text-align: center;
}

.fs_18 {
    font-size: 18px;
}

.fs_11 {
    font-size: 11px;
}

.fs_14 {
    font-size: 14px !important;
}

.siete0 {
    color: #707070 !important;
}

.fs_12 {
    font-size: 12px;
}

.red {
    color: red;
}

.titulo {
    font-size: 24px;
    color: #707070 !important;
    font-family: 'Montserrat', sans-serif;
}

.hover_cliente:hover{
 background-color: #F7F7F7 !important;
}

.bg_gris {
    background-color: #F7F7F7;
}

.value {
    font-size: 1rem;
}

.h1_page {
    font-family: 'Montserrat', sans-serif;
    color: #707070 !important;
    font-size: 24px !important;
    letter-spacing: 0px;
    font-weight: bold !important;
}

.h2_page {
    font-family: 'Montserrat', sans-serif;
    color: #707070 !important;
    font-size: 20px !important;
    letter-spacing: 0px;
    font-weight: bold !important;
}

.w_fit_content {
    width: fit-content !important;
}

.btn_editar,
.btn_editar:hover,
.btn_editar:focus,
.btn_editar:active {
    background: #ACACAC 0% 0% no-repeat padding-box !important;
    opacity: 1;
    border-radius: 20px !important;
    width: 182px;
    height: 29px;
    font-size: 14px !important;
    font-weight: bold;
    color: white !important;
    border: none !important;
}

/* TABLAS DATOS */

.wrapper1,
.wrapper2 {
    transform: rotateX(180deg) !important;
}

.wrapper1 {
    overflow-x: auto !important;
    overflow-y: hidden !important;
}

.th_table {
    background-color: unset !important;
}

/* .table {
    border-collapse: initial !important;
} */

.tr_body {
    border-style: hidden !important;
}

.td {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    font-weight: 400;
    color: #707070;
}


.circleVerde {
    color: #14FF00;
    font-size: 14px;
}

.circleInfo {
    color: red;
    font-size: 14px;
}

.btn_acciones {
    background: #F7F7F7 0% 0% no-repeat padding-box !important;
    border: 1px solid #ACACAC !important;
    color: #303B4A !important;
    border-radius: 12px;
    opacity: 1;
    font-size: 12px;
    font-family: 'Montserrat', sans-serif !important;
}

.form-check-input:checked {
    background-color: #F4B511;
    border-color: #F4B511;
}

.cargando_opciones {
    font-size: 12px;
}

.display_none {
    display: initial !important;
}

.display_flex_buscar {
    display: flex;
}

.nueva_div{
    display: flex;
    justify-content: center;
    align-items: center;
}


@media (max-width: 1354px) {
    .display_none {
        display: none !important;
    }
}

@media (max-width: 991px) {

    .precio {
        font-size: 30px !important;
    }

    .h1_page {
        font-size: 20px !important;
    }

}

@media (max-width: 976px) {

    .display_flex_buscar {
        display: block;
    }

}

@media (max-width: 768px) {
    .loadingText {
        font-size: 1.25rem;
    }
}

@media (max-width: 575px) {

    .div_qrscanner video {
        width: 100% !important;
    }

    .btn_w_100_movil button {
        margin-top: 5px;
    }

    .px_5_movil {
        padding-left: 3rem !important;
        padding-right: 3rem !important;
    }

}

@media (max-width: 478px) {
    .btn_login_margin_2 {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
}

@media (max-width: 430px) {
    .div_login {
        width: 100% !important;
    }
}

@media (max-width: 420px) {

    .btn_w_100_movil {
        display: block !important;
        text-align: center;
    }

    .btn_w_100_movil button {
        margin-bottom: 8px;
        margin-right: 0px !important;
    }

}

@media (max-width: 400px) {

    .nueva_div{
        display: block !important;
        justify-content: unset !important;
        align-items: unset !important;
    }

    .nueva_div span{
        display: block !important;
        margin-bottom: 5px !important;
    }

    .nueva_div span + span{
        display: block !important;
        margin-bottom: 5px !important;
    }

    .display_flex_buscar {
        display: block !important;
    }

    .display_flex_buscar button {
        margin-top: 10px;
    }

    .h1_page {
        font-size: 18px !important;
    }

}

@media (max-width: 350px) {
    .precio {
        font-size: 25px !important;
    }
}

@media (max-width: 320px) {

    .logo_semot_movil {
        width: 150px;
    }

    .div_vehiculo {
        width: 120px !important;
    }
}