/*Colocar siempre el footer al final*/
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@700;800&family=Poppins:wght@300;500&display=swap');

/* ________________________________________________________________________ */

.parent {
    display: flex;
    min-height: 100vh!important;
    flex-direction: column;
}

.middle {
    display: flex;
    flex: 1;
    /* min-height: 100%; */
    height: 100%;
    overflow: scroll;
    scrollbar-color: white !important;
}

.inputTable {
    width: 100px!important;
}


/*Alinear a la derecha*/

.derechaSegment {
    justify-content: flex-end!important;
    align-items: flex-end!important;
    display: grid!important;
}


/*Alinear hacia abajo*/

.ajustarAbajo {
    display: -webkit-flex!important;
    display: flex!important;
    -webkit-align-items: center!important;
    align-items: center!important;
    -webkit-justify-content: flex-end!important;
    justify-content: flex-end!important;
}


/*Estilo tab*/


/*Títulos*/

.tabular.menu>.item:hover {
    /* color: #0088ce!important; */
    color: #F0741E !important;
}

.tabular.menu>.item.active {
    /* color: #0088ce!important; */
    color: #F0741E !important;
    /* border-top: 3px solid #f0ab00!important; */
    border-top: 3px solid #FBD21A!important;
    /* background-color: #F7F6EE!important; */
    background-color: rgba(247, 246, 238,.2);
}


/*Mrgen de los tab*/

.tabular.menu>.item {
    border-top: 1px solid #BDBDBD!important;
    border-right: 1px solid #BDBDBD!important;
    border-left: 1px solid #BDBDBD!important;
    color: #858585 !important;
    /*height:*/
}


/*Tab cuentas bancarias*/

.specialTab {
    border-top: none!important;
}


/*Fondo tab*/

.tab.segment {
    /* background-color: #F7F6EE!important; */
    /* background-color: #f5f5ef59!important; */
    background-color: rgba(247, 246, 238,.2);
}


/*Fondo tab basic segment*/

.tab.basic.segment {
    background-color: white!important;
}


/*Estilo para los popup */

.popStyle {
    background-color: #FAECBF!important;
    border-color: #f0ab00!important;
    border-width: 2px!important;
}

.popStyle2 {
    background: #FAECBF!important;
    border-top: solid!important;
    border-left: solid!important;
    border-color: #f0ab00!important;
    border-width: thin!important;
}

.borderRight {
    border: 1px solid!important;
    /*border-right: none!important;*/
    border-color: lightgray!important;
}

.borderLeft {
    border: 1px solid!important;
    /*border-left: none!important;*/
    border-color: lightgray!important;
}

/*Fondo para los label de solo lectura*/
.bkgOrange{
    background-color: #ffc39c !important;
}
/*Estilo texto de los label*/

.labelText {
    /*font-family:  "Myriad Pro", Myriad, "Liberation Sans", "Nimbus Sans L", "Helvetica Neue", Helvetica, Arial, sans-serif!important;*/
    font-family: Lato, 'Helvetica Neue', Arial, Helvetica, sans-serif;
    font-size: 10pt!important;
    color: black!important;
    font-style: normal!important;
    font-weight: normal!important;
}


/*Estilo texto de los label modal*/

.labelTM {
    /*font-family:  "Myriad Pro", Myriad, "Liberation Sans", "Nimbus Sans L", "Helvetica Neue", Helvetica, Arial, sans-serif!important;*/
    font-family: Lato, 'Helvetica Neue', Arial, Helvetica, sans-serif;
    font-size: 10pt!important;
    font-style: normal!important;
    font-weight: bold!important;
}

label {
    /*font-family:  "Myriad Pro", Myriad, "Liberation Sans", "Nimbus Sans L", "Helvetica Neue", Helvetica, Arial, sans-serif!important;*/
    font-family: Lato, 'Helvetica Neue', Arial, Helvetica, sans-serif;
    font-size: 10pt!important;
    font-style: normal!important;
    font-weight: bold!important;
}


/*subTitulos tab*/

.letraSub {
    font-family: "Myriad Pro", Myriad, "Liberation Sans", "Nimbus Sans L", "Helvetica Neue", Helvetica, Arial, sans-serif!important;
    font-size: 14pt!important;
    color: #f0ab00!important;
    font-style: bold!important;
}


/*Estilo versión*/

.ajs-message.ajs-custom {
    color: #31708f!important;
    background-color: #d9edf7!important;
    border-color: #31708f!important;
}

.MyCenter {
    display: flex !important;
    justify-content: center!important;
    align-items: center!important;
    flex-direction: column;
}

.textColumnsMdl {
    color: gray!important;
}

.rojito {
    color: red;
}

th {
    /* background-color: #FAECBF!important; */
    background-image: linear-gradient(#6bdfff,#3b8ed5) !important;
    background-color: #3079b9 !important;
    text-align: center!important;
    color: white !important;
}

.ui.celled.definition.table thead:not(.full-width) th:first-child {
    box-shadow: 0 -1px 0 1px #fff!important;
    pointer-events: none;
    background-color: #fff!important;
    font-weight: 400;
    color: rgba(0, 0, 0, .4);
}


/*---------------Botones Auiditoría--------------------------*/

.ui.label.audit:hover {
    background: yellowgreen!important;
    color: black!important;
}

.ui.label.audit {
    background: #4d4f53!important;
    margin-bottom: 15px!important;
    color: white!important;
}

.ui.label.audit_close:hover {
    background: yellowgreen!important;
    color: black!important;
}

.ui.label.audit_close {
    background: #4d4f53!important;
    margin-bottom: 15px!important;
    color: white!important;
}


/*------------------------------------------------------------------*/

.paddingCero {
    padding: 0!important;
}

.ui.left.sidebar {
    width: 300px;
}


/*Perfiles*/


/*Tamaño de un modal*/

.ui.modal>.content {
    max-height: calc(100vh - 200px);
    overflow-y: auto;
}

.parametros {
    max-height: calc(70vh - 200px);
    overflow-y: auto;
}


/*ui  top attached header*/

.headerTopAtt {
    /*color: #4d4f53!important;*/
    text-align: center!important;
    background-color: #FAECBF!important;
}


/*Fondo mysegment*/

.bkgMySegment {
    background: floralwhite!important;
}


/*Botón circular eliminar*/

.styleRemove {
    background: #4d4f53!important;
}


/*Botón circular editar*/

.styleEdit {
    background: #0088ce!important;
}


/*Botón mostrar más*/

.btnMore {
    background: #4d4f53!important;
}

.btnMore:hover {
    background: #f0ab00!important;
    color: white!important;
}

.searchIcon {
    box-sizing: border-box;
}

:focus {
    outline: none!important;
}

.textAling {
    margin: 5px!important;
}


/* ------------------------TOOLTIP----------------------------*/

[data-position="top left"][data-tooltip]:before {
    background: #F7F2E1!important;
    border-bottom: solid!important;
    border-right: solid!important;
    border-color: #0088ce!important;
    border-width: thin!important;
}

[data-position="right center"][data-tooltip]:before {
    background: #F7F2E1!important;
    border-bottom: solid!important;
    border-left: solid!important;
    border-color: #0088ce!important;
    border-width: thin!important;
}

[data-position="top right"][data-tooltip]:before {
    background: #F7F2E1!important;
    border-bottom: solid!important;
    border-right: solid!important;
    border-color: #0088ce!important;
    border-width: thin!important;
}

[data-position="top center"][data-tooltip]:before {
    background: #F7F2E1!important;
    border-bottom: solid!important;
    border-right: solid!important;
    border-color: #0088ce!important;
    border-width: thin!important;
}

[data-position="bottom left"][data-tooltip]:before {
    background: #F7F2E1!important;
    border-top: solid!important;
    border-left: solid!important;
    border-color: #0088ce!important;
    border-width: thin!important;
}

[data-position="bottom center"][data-tooltip]:before {
    background: #F7F2E1!important;
    border-top: solid!important;
    border-left: solid!important;
    border-color: #0088ce!important;
    border-width: thin!important;
}

[data-position="bottom right"][data-tooltip]:before {
    background: #F7F2E1!important;
    border-top: solid!important;
    border-left: solid!important;
    border-color: #0088ce!important;
    border-width: thin!important;
}

[data-position="left center"][data-tooltip]:before {
    background: #F7F2E1!important;
    border-top: solid!important;
    border-right: solid!important;
    border-color: #0088ce!important;
    border-width: thin!important;
}

[data-tooltip]:after {
    background-color: #F7F2E1!important;
    border-color: #0088ce!important;
    border-width: 1px!important;
}


/*---------------END TOOLTIP---------------------------------*/


/*Inputs*/

.colorGray {
    color: gray!important;
}

.activeInput {
    border-color: darkgray!important;
}

.activeInput:focus {
    border-color: #96c8da!important;
}

.disabledInput {
    border-color: white!important;
}


/*Botón eliminar*/

.btnDelete {
    background: #4d4f53!important;
}

.btnDelete:hover {
    background: red!important;
    color: white!important;
}


/*Botón deshacer*/

.btnUndo {
    background: #4d4f53!important;
}

.btnUndo:hover {
    background: #0088ce!important;
    color: white!important;
}

.ui.tabular.menu>.item {
    box-shadow: inset 0 -8px 7px -9px rgba(0, 0, 0, .4), -2px -2px 5px -2px rgba(0, 0, 0, .4);
}


/* **************************************ESTILO DROPDOWN******************************************* */

.ui.selection.dropdown.backDropdown {
    background: #DEF2FD;
    border-color: #CBE9F9;
    color: #000000;
}

.ui.dropdown .Colordropdown>.item:hover {
    background: #DEF2FD;
}

.ui.selection.dropdown .Colordropdown>.item {
    border-top: 1px solid #DFF2FC;
}

.ui.selection.active.dropdown .Colordropdown {
    border-color: #96c8da;
    background: #CBE9F9;
}

.centerDropdown {
    display: flex;
    align-items: center;
    justify-content: center;
}


/* **************************************FIN ESTILO DROPDOWN******************************************* */


/* **************************************ESTILO BUSCAR EN DATATABLE******************************************* */


/* **************************************FIN ESTILO BUSCAR EN DATATABLE******************************************* */


/*----------------------------------------------------Encabezado modal----------------------------------------------------------*/

.ui.modal>.header {
    padding: 10px!important;
    background-color: #E9E9EA!important;
    color: #2185d0!important;
    font-size: 1.71428571em!important;
}

.ui.modal>.actions {
    background: #E9E9EA!important;
}

.ui.modal.mdlDelete>.header {
    padding: 10px!important;
    background-color: transparent!important;
    color: #2185d0!important;
    font-size: 1.71428571em!important;
}

.ui.modal.mdlDelete>.actions {
    background: transparent!important;
}

.ui.modal.mdlCancelar>.header {
    padding: 10px!important;
    background-color: transparent!important;
    color: #2185d0!important;
    font-size: 1.71428571em!important;
}

.ui.modal.mdlCancelar>.actions {
    background: transparent!important;
}

.ui.modal.mdlChgStatus>.header {
    padding: 10px!important;
    background-color: transparent!important;
    color: #2185d0!important;
    font-size: 1.71428571em!important;
}

.ui.modal.mdlChgStatus>.actions {
    background: transparent!important;
}

.styleBuscar {
    border-color: #96c8da!important;
}

.colorBkg {
    background: #F7F6EE!important;
}

.gris {
    background: lightgray!important;
}

tfoot>tr>th {
    background: lightgray!important;
}


/* **************************************FIN ESTILO BUSCAR EN DATATABLE******************************************* */

.stlSegment {
    max-width: 100%!important;
    overflow-x: scroll;
}


/*Estilo para los popup */


/* ------------------------POPUP----------------------------*/

.ui.popup.top.left:before {
    background: #F7F2E1!important;
    border-bottom: solid!important;
    border-right: solid!important;
    border-color: #0088ce!important;
    border-width: thin!important;
}

.ui.popup.right.center:before {
    background: #F7F2E1!important;
    border-bottom: solid!important;
    border-left: solid!important;
    border-color: #0088ce!important;
    border-width: thin!important;
}

.ui.popup.top.right:before {
    background: #F7F2E1!important;
    border-bottom: solid!important;
    border-right: solid!important;
    border-color: #0088ce!important;
    border-width: thin!important;
}

.ui.popup.top.center:before {
    background: #F7F2E1!important;
    border-bottom: solid!important;
    border-right: solid!important;
    border-color: #0088ce!important;
    border-width: thin!important;
}

.ui.popup.bottom:before {
    background: #F7F2E1!important;
    border-top: solid!important;
    border-left: solid!important;
    border-color: #0088ce!important;
    border-width: thin!important;
}

.ui.popup.bottom.center:before {
    background: #F7F2E1!important;
    border-top: solid!important;
    border-left: solid!important;
    border-color: #0088ce!important;
    border-width: thin!important;
}

.ui.popup.bottom.right:before {
    background: #F7F2E1!important;
    border-top: solid!important;
    border-left: solid!important;
    border-color: #0088ce!important;
    border-width: thin!important;
}

.ui.popup.left.center:before {
    background: #F7F2E1!important;
    border-top: solid!important;
    border-right: solid!important;
    border-color: #0088ce!important;
    border-width: thin!important;
}

.ui.popup {
    background-color: #F7F2E1!important;
    border-color: #0088ce!important;
    border-width: 1px!important;
}


/*color para columnas de la tabla*/

.columnGreen {
    background-color: #fcfff5!important;
}

.columnRed {
    background-color: #ffe7e7!important;
}

.columnOrange {
    background-color: #fffaf3!important;
}

.columnGray {
    background-color: #f9fafb;
    ;
}


/* ------------------------END POPUP----------------------------*/


/*-------------------------Ancho tabla--------------------------*/

.anchoTabla {
    max-width: calc(300vh - 50px);
    overflow-y: auto;
}


/* ------------------------END ancho tabla----------------------*/

.suelta {
    padding: 10px;
    margin-bottom: -25px;
    border: 1px solid #ddd;
    width: 200px;
    height: 110px;
    float: right;
    text-align: center;
}

.stlH2 {
    font-size: 14px;
}

.ejes {
    width: 308px;
    height: 70px;
    max-width: 100%;
    opacity: .3;
}


/*Background's colors*/

.bkgGreen {
    background: #f1ffe2;
}

.bkgBlue {
    background: #e0f9ff;
}

#oculto {
    visibility: collapse!important;
}

.imgRedonda {
    width: 100px;
    height: 100px;
    border-radius: 120px;
    border: 5px solid rgb(255, 255, 255);
}


.swal2-modal.swal2-show{
    border-radius: 5em !important;
}
.swal2-modal .swal2-styled {
    border: 0;
    border-radius: 1rem !important;
    -webkit-box-shadow: none;
    box-shadow: none;
    color: #fff;
    cursor: pointer;
    font-size: 17px;
    font-weight: 500;
    margin: 15px 5px 0;
    padding: 10px 32px;
}
.swal2-confirm.swal2-styled{
    color: #5D5540 !important;
    background-image: linear-gradient(#FBD21A,#E7B72B) !important;
}
.swal2-confirm.swal2-styled:hover{    
    background-image: linear-gradient(#ffdf52,#cfaa3a) !important;
}

/*=====  End of swall  ======*/

/*=============================================
=            modal            =
=============================================*/
.ui.modal>.actions {
    background: #f9fafb;
    padding: 1rem 5rem !important;
    border-top: 1px solid rgba(34,36,38,.15);
    text-align: center !important;
}
.pieModal{
    display: flex;
    justify-content: space-between;
}
.pieModal .green.left.floated{
    background-color: #E08653 !important;
}
.pieModal .green.left.floated:hover{
    background-color: #d37a46 !important;
}
.pieModal .red.left.floated,.pieModal .green.left.floated {
    /* background-color: #7C7C7C !important; */
    color: white !important;
    font-weight: 500 !important;
    border-radius: 1rem !important;
    border-radius: 1rem !important;    
}
.pieModal .red.left.floated{
    background-color: #E0E1E1 !important;
    color: #6a6767 !important;
}
.pieModal .red.left.floated:hover{
    background-color: #c2c2c2 !important;
    color: #6a6767 !important;
}
.pieModal .grupoBtn{
    display: flex;
    justify-content: space-evenly;
    width: 100% !important;
}
.pieModal .grupoAcc{
    display: flex;
    justify-content: space-evenly;
    width: 45% !important;
}
.ui.modal{
    border-radius: 50px !important;
}
.ui.modal>.icon:first-child+*, .ui.modal>:first-child:not(.icon) {
    border-top-left-radius: 50px;
    border-top-right-radius: 50px;
    background-image: linear-gradient(#6bdfff,#3b8ed5) !important;
}
.ui.modal>.actions {   
    border-radius: 0 0 50px 50px !important;
    background-image: linear-gradient(#3b8ed5,#6bdfff) !important;
}
.content.sizeMdl{
    background-image: url('/assets/images/login/logo-solo-color-01.png') !;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-color: bisque;
}
.ui.modal>.content{
    background-color: transparent !important;
    background: url('/assets/images/login/logocolorOpacity.png') !important;
    background-size: contain !important;
    background-position: center !important;
    background-repeat: no-repeat !important;

}
.ui.modal>.content>.description{
    /* background: url('/assets/images/login/logo-solo-color-01.png') !important; */
    /* background: url('/assets/images/login/logocolorOpacity.png') !important; */
    background-size: contain !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}
.ui.modal>.header{
    color: white !important;
    letter-spacing: 1px;
    text-align: center;
}
.pieModal .ui.positive.button{
    background-image: linear-gradient(#FBD21A,#E7B72B) !important;
    color: #5D5540 !important;
    font-weight: 600 !important;
    border-radius: 1rem !important;
    letter-spacing: 1px
}
.pieModal .ui.positive.button:hover{
    background-image: linear-gradient(#ffdf52,#cfaa3a) !important;
    color: #5D5540 !important;
    font-weight: 600 !important;    
}
.pieModal .ui.deny.button, .ui.negative.button{
    background-color: #7C7C7C !important;
    color: white !important;
    font-weight: 500 !important;
    border-radius: 1rem !important;
    letter-spacing: 1px
}
.pieModal .ui.deny.button:hover{
    background-color: #5a5a5a !important;
    color: white !important;    
}


/*=====  End of modal  ======*/


/*=============================================
=            label            =
=============================================*/
.ui.form input[type=text], .borderInput{
    border-radius: 10px !important;
}
.blueInput, .ui.selection .menu.transition.visible{
    background-color: #A2E2FC !important;
}
.blueInput::placeholder{
    color: gray !important;
    font-weight: 300 !important;
}
/* input::placeholder {
    font-weight: bold;
    opacity: .5;
    color: red;
} */

.ui.form .field>label{
    font-weight: 300 !important;
    font-size: medium !important;
}
.ui.selection .default.text{
    color: rgba(112, 112, 112, 0.9) !important;
}
#table_listContent_filter input, #table_catClientes_filter input, .dataTables_filter.ui.input input{
    border-radius: 20px !important; 
    font-family: 'Poppins', sans-serif !important;
    font-size: 1rem;
    font-weight: 500;
    text-align: center;
}
#table_listContent_length .selection.ui.dropdown, .dataTables_length .selection.ui.dropdown{ 
    border-radius: 20px !important;
}
/*=====  End of label  ======*/

.dataTables_scrollBody .ui.celled.table.collapsing.nowrap.dataTable.no-footer{
    border-radius: 0 0 20px 20px !important;
}