.qry2cfgQuickFilter {    
    display: flex; 
    flex-direction: row;
    justify-content: flex-start; 
    align-items: flex-start; 
    width: 100%; 
    height: 100%; 
    border: 2px solid grey; 
    box-sizing: border-box; }
.qry2cfgQuickFilter:focus {
    border: 2px solid orangered; }
.in-quick-filter-2v-1-toolbar {
    display: flex; 
    flex-direction: column;
    justify-content: flex-start; 
    align-items: center; 
    width: 110px;
    min-width: 110px;
    max-width: 110px;
    height: 100%;
    background-color: hsl(0, 0%, 82%);
    background: linear-gradient(hsl(0, 0%, 20%),hsl(0, 0%, 40%),hsl(0, 0%, 20%));
    padding: 30px;
    z-index: 200; 
    box-sizing: border-box; }
    .in-quick-filter-2v-1-toolbar-top {
        display: flex; 
        flex-direction: column;
        justify-content: flex-start; 
        align-items: center; }
    .in-quick-filter-2v-1-toolbar-center {
        display: flex; 
        flex-direction: column;
        justify-content: center; 
        align-items: center; }
    .in-quick-filter-2v-1-toolbar-bottom {
        display: flex; 
        flex-direction: column;
        justify-content: flex-end; 
        align-items: center; 
        padding: 10px 0}
/*--------------------------*/
.quick-filter-field {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 6px;
    border: none;
    outline: none;
    box-shadow: none; }
    .quick-filter-field-no-view-no-rol {
        flex-direction: row;
        height: 36px; }
    .quick-filter-field-view-no-rol {
        height: 100%; }
        .quick-filter-field-view-in-grid-4 {
            flex-direction: column;
            align-items: flex-start;
            width: 100%; }
        .quick-filter-field-view-button-group {
            flex-direction: row;
            align-items: center; }            
    .quick-filter-field-no-view-rol {
        flex-direction: row;
        width: 100%; }
        .quick-filter-field-rol-color {
            align-items: flex-start;
            height: 35px; }        
        .quick-filter-field-rol-codigo-barra {
            align-items: center;
            height: 100px;
            min-height: 100px;
            max-height: 100px; }
        .quick-filter-field-rol-codigo-qr {
            align-items: center;
            height: 200px; 
            min-height: 200px; 
            max-height: 200px; }
        .quick-filter-field-rol-imagen {
            align-items: center;
            height: 200px; 
            min-height: 200px; 
            max-height: 200px; }    
    .quick-filter-field-editable {
        cursor: pointer; }
    .quick-filter-field-no-editable {
        cursor: default; }
    .quick-filter-field-focus {}
    /*--------------------------*/
    .quick-filter-field-label-wrapper { 
        display: flex;
        justify-content: space-between;
        align-items: center;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        font-weight: 100; }
        .quick-filter-field-label-wrapper-no-view-no-rol {}
        .quick-filter-field-label-wrapper-view-no-rol {
            height: 50px; }
            .quick-filter-field-label-wrapper-view-in-grid-4 {
                width: 100%!important;
                min-width: 100%!important; }
            .quick-filter-field-label-wrapper-view-button-group {}
        .quick-filter-field-label-wrapper-no-view-rol {}    
            .quick-filter-field-label-wrapper-rol-color {}
            .quick-filter-field-label-wrapper-rol-codigo-barra {}
            .quick-filter-field-label-wrapper-rol-codigo-qr {}
            .quick-filter-field-label-wrapper-rol-imagen {}
    .quick-filter-field-label-wrapper-focus {
        font-weight: 800; }
    .quick-filter-field-label-wrapper-dply-filas {
        margin-left: 10px; }
    .quick-filter-field-label-wrapper-dply-columnas {
        width: 100px;
        min-width: 100px;
        max-width: 100px; }
    .quick-filter-field-label-wrapper-editable {
        color: hsl(0, 0%, 30%); }
    .quick-filter-field-label-wrapper-no-editable {
        color: hsl(0, 0%, 50%); }
        /*--------------------------*/
    .quick-filter-field-label { 
        font-family: Arial, Helvetica, sans-serif;
        text-wrap: nowrap;
        margin-right: 6px; }
        .quick-filter-field-label-no-view-no-rol {
            font-size: 12px;
            font-weight: 100; }
        .quick-filter-field-label-view-no-rol {}
            .quick-filter-field-label-view-in-grid-4 {
                text-transform: uppercase;
                font-size: 16px;
                font-weight: 600;
                text-shadow: 1px 1px 1px rgb(48,48,48);
                width: 240px; }
            .quick-filter-field-label-view-button-group {}
        .quick-filter-field-label-no-view-rol {
            font-size: 12px;
            font-weight: 100; }
            .quick-filter-field-label-rol-color {}
            .quick-filter-field-label-rol-codigo-barra {}
            .quick-filter-field-label-rol-codigo-qr {}
            .quick-filter-field-label-rol-imagen {}            
        .quick-filter-field-label-focus {
            font-weight: 800; }
        .quick-filter-field-label-dply-filas {
            /*margin-left: 10px;*/ }
        .quick-filter-field-label-dply-columnas {
            /*width: 100px;*/ }
        .quick-filter-field-label-editable {
            color: hsl(0, 0%, 30%); }
        .quick-filter-field-label-no-editable {
            color: hsl(0, 0%, 50%); }
    /*--------------------------*/
    .quick-filter-field-data-wrapper-2 {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        position: relative; }
        .quick-filter-field-data-wrapper-2-no-view-no-rol {}
        .quick-filter-field-data-wrapper-2-view-no-rol {}
            .quick-filter-field-data-wrapper-2-view-in-grid-4 {
                width: 100%;
                height: 100%; }
            .quick-filter-field-data-wrapper-2-view-button-group {
                height: 100%; }            
        .quick-filter-field-data-wrapper-2-no-view-rol {}
            .quick-filter-field-data-wrapper-2-rol-color {}
            .quick-filter-field-data-wrapper-2-rol-codigo-barra {
                /*width: 100%;*/
                height: 100%; }                    
            .quick-filter-field-data-wrapper-2-rol-codigo-qr {
                height: 100%; }  
            .quick-filter-field-data-wrapper-2-rol-imagen {
                height: 100%; }  
        .quick-filter-field-data-wrapper-2-focus {
            border: 2px solid rgb(41 25 255);
            border-radius: 8px;
            box-shadow: 2px 2px 8px rgb(53 98 253); }
    /*--------------------------*/              
    .quick-filter-field-data-wrapper {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 5px;
        background-color: hsl(0, 0%, 95%);
        border-radius: 5px;
        border: none;
        outline: none;
        box-shadow: 1px 1px 1px hsl(0, 0%, 30%); }
        .quick-filter-field-data-wrapper-no-view-no-rol {}
        .quick-filter-field-data-wrapper-view-no-rol {}
            .quick-filter-field-data-wrapper-view-in-grid-4 {
                width: 100%;
                height: 100%; 
                margin-left: 0!important;
                padding: 0; }
            .quick-filter-field-data-wrapper-view-button-group {
                height: 100%; 
                margin-left: 0!important;
                background-color: transparent!important;
                padding: 0; }            
        .quick-filter-field-data-wrapper-no-view-rol {}
            .quick-filter-field-data-wrapper-rol-color {}
            .quick-filter-field-data-wrapper-rol-codigo-barra {
                /*width: 100%;*/
                height: 100%;
                margin-left: 0!important;
                padding: 0 5px 0 0; }
            .quick-filter-field-data-wrapper-rol-codigo-qr {
                height: 100%;
                margin-left: 0!important;
                padding: 0 5px 0 0; }
            .quick-filter-field-data-wrapper-rol-imagen {
                height: 100%;
                margin-left: 0!important;
                padding: 0 5px 0 0; }                    
            .quick-filter-field-data-wrapper-view-focus {}
        .quick-filter-field-data-wrapper-focus {
            background-color: hsl(0, 0%, 25%)!important;
            color: white!important; }            
        .quick-filter-field-data-wrapper-edition {
            background-color: hsl(61, 100%, 79%)!important; }
        .quick-filter-field-data-wrapper-editable {
            background-color: hsl(0, 0%, 95%); }
        .quick-filter-field-data-wrapper-no-editable {
            background-color: hsl(0, 0%, 70%);
            color: hsl(0, 0%, 50%)!important; }
    /*--------------------------*/
    .quick-filter-field-data {
        flex: 1 1 auto;
        margin-left: 0;
        padding: 0;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 14px;
        font-weight: 800;
        height: 20px;
        border: none;
        outline: none;
        box-shadow: none;
        display: flex;
        justify-content: space-between;
        align-items: center; }
        .quick-filter-field-data-no-view-no-rol {}
        .quick-filter-field-data-view-no-rol {}
            .quick-filter-field-data-view-in-grid-4 {
                width: 100%;
                height: 100%; }
            .quick-filter-field-data-view-button-group {
                height: 100%; }
        .quick-filter-field-data-no-view-rol {}
            .quick-filter-field-data-rol-color {}
            .quick-filter-field-data-rol-codigo-barra {
                height: 100%; }
            .quick-filter-field-data-rol-codigo-qr {
                height: 100%; }
            .quick-filter-field-data-rol-imagen {
                height: 100%; }                        
            .quick-filter-field-data-view-focus {}
        .quick-filter-field-data-querydef {
            justify-content: flex-start;
            align-items: flex-start; }
        .quick-filter-field-data-no-querydef {
            justify-content: space-between;
            align-items: center; }                        
        .quick-filter-field-data-focus {
            color: white!important; }
        .quick-filter-field-data-editable {}
        .quick-filter-field-data-no-editable {
            color: hsl(0, 0%, 50%); }
    /*--------------------------*/
    .quick-filter-field-data-value-pre-unit {
        margin-right: 3px;
        font-weight: 100; }
    .quick-filter-field-data-value {
        flex: 1 1 auto;
        margin-left: 0;
        padding: 0;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 14px;
        font-weight: 800;
        height: 26px;
        border: none;
        outline: none;
        box-shadow: none; }
        .quick-filter-field-data-value-no-view-no-rol {}
        .quick-filter-field-data-value-view-no-rol {}
            .quick-filter-field-data-value-view-in-grid-4 {}
            .quick-filter-field-data-value-view-button-group {}
        .quick-filter-field-data-value-no-view-rol {}
            .quick-filter-field-data-value-rol-color {}
            .quick-filter-field-data-value-rol-codigo-barra {}
            .quick-filter-field-data-value-rol-codigo-qr {}
            .quick-filter-field-data-value-rol-imagen {
                width: 100%;
                height: 100%; }
            .quick-filter-field-data-value-view-focus {}
        .quick-filter-field-data-value-focus {
            color: white!important; }
        .quick-filter-field-data-value-editable {}
        .quick-filter-field-data-value-no-editable {
            color: hsl(0, 0%, 50%); }
        .quick-filter-field-data-value-querydef {
            justify-content: flex-start;
            align-items: flex-start; }                        
        .quick-filter-field-data-value-no-querydef {
            justify-content: space-between;
            align-items: center; 
            flex-wrap: wrap; }                          
        .quick-filter-field-data-value-post-unit {
            margin-left: 3px;
            font-weight: 100; }
    /*--------------------------*/
    .quick-filter-field-data-tool {
        flex: 0 0 auto;
        margin-left: 2px;
        padding: 0;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 8px;
        font-weight: 100;
        border: none;
        outline: none;
        box-shadow: none;
        text-wrap: nowrap; }
        .quick-filter-field-data-tool-editable {}
        .quick-filter-field-data-tool-no-editable { 
            display: none; }
        .quick-filter-field-data-tool-view {
            display: none; }                            
        .quick-filter-field-data-tool-btn {
            box-shadow: 1px 1px 1px #444;
            border-radius: 2px;
            width: 13px;
            min-width: 13px;
            max-width: 13px;
            height: 13px;
            min-height: 13px;
            max-height: 13px;
            font-weight: 100;
            font-size: 7px;
            padding: 0;
            outline: none;
            border: 1px solid white;
            cursor: pointer;
            color: white; }
            .quick-filter-field-data-tool-btn-editable {}
            .quick-filter-field-data-tool-btn-no-editable {
                display: none; }  
    .quick-filter-field-data-input {
        /*flex: 1 1 auto;*/
        margin-left: 0;
        padding: 0;
        background-color: hsl(61, 100%, 79%);
        color: hsl(21, 97%, 30%)!important;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 14px;
        font-weight: 800;
        height: 26px;
        border: none;
        outline: none;
        box-shadow: none; }
.quick-filter-field-data-dropdown {
    position: absolute; 
    left: 0; 
    top: 30px;
    width: 600px; 
    height: 200px; 
    border: 1px solid darkgreen; 
    background-color: #aaa;
    border-radius: 4px;
    z-index: 1000;
    box-shadow: 1px 1px 1px #333; }
/*datatypes*/
.quick-filter-dt {
    /*color: hsl(0, 0%, 40%);*/
    display: flex;
}
.quick-filter-dt-entero {
    font-size: 14px;
    justify-content: flex-end;
    align-items: center;
}
.quick-filter-dt-decimal {
    font-size: 14px;
    justify-content: flex-end;
    align-items: center;
}
.quick-filter-dt-fechaHora {
    font-size: 14px;
    justify-content: center;
    align-items: center;
}
.quick-filter-dt-fecha {
    font-size: 14px;
    justify-content: center;
    align-items: center;
}
.quick-filter-dt-hora {
    font-size: 14px;
    justify-content: center;
    align-items: center;
}
.quick-filter-dt-string {
    font-size: 14px;
    justify-content: flex-start;
    align-items: center;
}
.quick-filter-dt-texto {
    font-size: 14px;
    justify-content: flex-start;
    align-items: center;
}
.quick-filter-dt-objeto {
    font-size: 14px;
    justify-content: flex-start;
    align-items: center;
}
.quick-filter-dt-enum {
    font-size: 14px;
    justify-content: flex-start;
    align-items: center;
}
.quick-filter-dt-array {
    font-size: 14px;
    justify-content: flex-start;
    align-items: center;
}
.quick-filter-dt-logico {
    color: hsl(0, 0%, 40%);
    font-size: 18px;
    justify-content: center;
    align-items: center;
}



/*tool por datatypes*/
.quick-filter-dt-tool {}
.quick-filter-dt-tool-entero {}
.quick-filter-dt-tool-decimal {}
.quick-filter-dt-tool-fechaHora {}
.quick-filter-dt-tool-fecha {}
.quick-filter-dt-tool-hora {}
.quick-filter-dt-tool-string {}
.quick-filter-dt-tool-texto {}
.quick-filter-dt-tool-objeto {}
.quick-filter-dt-tool-enum {}
.quick-filter-dt-tool-array {}
.quick-filter-dt-tool-logico {
    display: none;}

/*btn tool por datatypes*/
.quick-filter-dt-tool-btn {}
.quick-filter-dt-tool-btn-entero {}
.quick-filter-dt-tool-btn-decimal {}
.quick-filter-dt-tool-btn-fechaHora {}
.quick-filter-dt-tool-btn-fecha {}
.quick-filter-dt-tool-btn-hora {}
.quick-filter-dt-tool-btn-string {}
.quick-filter-dt-tool-btn-texto {}
.quick-filter-dt-tool-btn-objeto {}
.quick-filter-dt-tool-btn-enum {}
.quick-filter-dt-tool-btn-array {}
.quick-filter-dt-tool-btn-logico {}

/*Button type*/
.quick-filter-btn-ok {
    background-color: rgb(8, 160, 0);
}
.quick-filter-btn-cancel {
    background-color: rgb(166, 15, 15);
}
.quick-filter-btn-query {
    background-color: rgb(160, 160, 0);
}
.quick-filter-btn-edit {
    background-color: rgb(0, 93, 160);
}
.quick-filter-btn-delete {
    background-color: rgb(166, 85, 15);
}
.quick-filter-btn-dropdown {
    background-color: rgb(126, 11, 144);
}


.numero-positivo {
	background: linear-gradient(to top, hsl(120, 97%, 12%),hsl(120, 61%, 39%),hsl(120, 97%, 12%));
	color: white!important; }
.numero-negativo {
	background: linear-gradient(to top, hsl(0, 100%, 18%),hsl(0, 96%, 60%),hsl(0, 100%, 18%));
	color: white!important; }
.data-wrapper-numero-cero {
	background: linear-gradient(to top, hsl(238, 97%, 12%),hsl(238, 97%, 39%),hsl(238, 97%, 12%)); }
.data-wrapper-numero-positivo {
	background: linear-gradient(to top, hsl(120, 97%, 12%),hsl(120, 61%, 39%),hsl(120, 97%, 12%)); }
.data-wrapper-numero-negativo {
	background: linear-gradient(to top, hsl(0, 100%, 18%),hsl(0, 96%, 60%),hsl(0, 100%, 18%)); }
.data-numero-cero {
	color: white!important; }
.data-numero-positivo { 
    color: white!important; }
.data-numero-negativo {
	color: white!important; }


.quick-filter-desc {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: nowrap;
    padding: 2px 6px;
    border-radius: 4px;
    margin-right: 0;
    background: linear-gradient(hsla(0, 0%, 70%, 0.1),hsla(0, 0%, 90%, 0.1), hsla(0, 0%, 70%, 0.1)); }    
    .quick-filter-desc-field {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 9px;
        font-weight: 600; }
    .quick-filter-desc-conector {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 8px;
        font-weight: 200; }
    .quick-filter-desc-value {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 9px;
        font-weight: 800; }