.col-options-button {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="black" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" /> </svg>')
}

.col-options {
    color: gray;
}

/*.search-box {
  border: solid 1px #0a58ca;
  border-radius: 5px;
  padding: 5px;
  width: 20rem;
}*/
.search-box input[type=search] {
    width: 20rem;
    padding: 0.75rem 0.75rem 0.75rem 2.5rem;
    color: rgb(17 24 39);
    background-color: rgb(249 250 251);
    border: 1px solid rgb(209 213 219);
    border-radius: 0.5rem;
    outline-offset: 1px;
}

    .search-box input[type=search]:focus {
        border-color: rgb(59 130 246);
        outline-color: rgb(59 130 246);
    }

.detail-search {
    outline: none;
    border: none;
    width: 17rem;
}

input:focus .detail-search {
    outline: none;
}

.quickgrid[theme=fancy-table] {
    width: 100%;
}

    .quickgrid[theme=fancy-table] td, th {
        /*padding: 20px .625em .625em .625em;*/
        height: 10%;
        vertical-align: middle;
        box-sizing: border-box;
        overflow-x: hidden;
        overflow-y: auto;
        /*width: 100%;*/
        font-size: 12px;
        text-overflow: ellipsis;
        text-align: center;
    }

    .quickgrid[theme=fancy-table] .col-title {
        display: flex; /* So that we can make col-title-text expand as much as possible, and still hide overflow with ellipsis */
        min-width: 0px;
        flex-grow: 1;
        padding: 0;
        flex-wrap: wrap;
        font-size: 12px;
    }

    .quickgrid[theme=fancy-table] .col-title-text {
        white-space: pre-line;
    }

    .quickgrid[theme=fancy-table] td {
        border-right: 1px solid #f8f8f8;
        border-bottom: 1px solid #f8f8f8;
        font-size: 12px;
    }

    .quickgrid[theme=fancy-table] thead th {
        border-bottom: 1px solid #f7f7f9;
        color: #ffffff;
        /*background: #4FC3A1;*/
        /*background: #13317a*/
        background: var(--color-1);
    }

        .quickgrid[theme=fancy-table] thead th:nth-child(odd) {
            color: #ffffff;
            /*background: #324960;*/
            /*background: #13317a;*/
            background: var(--color-1);
        }

    .quickgrid[theme=fancy-table] tr:nth-child(even) {
        /*background: #F8F8F8;*/
        /*background: #13317a;*/
        background: var(--color-1);
    }

.quickgrid-wrapper {
    margin: 10px 70px 70px;
    box-shadow: 0px 35px 50px rgba( 0, 0, 0, 0.2 );
}

.tempC .col-options-button {
    background-image: url('data:image/svg+xml;utf8,<svg width="24px" height="24px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M13.0256 6.6C13.0256 8.58823 11.4185 10.2 9.4359 10.2C7.45334 10.2 5.84615 8.58823 5.84615 6.6C5.84615 4.61177 7.45334 3 9.4359 3C11.4185 3 13.0256 4.61177 13.0256 6.6Z" fill="#030D45"/> <path fill-rule="evenodd" clip-rule="evenodd" d="M2 6.6C2 6.17395 2.3444 5.82857 2.76923 5.82857H5.84615C6.27099 5.82857 6.61539 6.17395 6.61539 6.6C6.61539 7.02605 6.27099 7.37143 5.84615 7.37143H2.76923C2.3444 7.37143 2 7.02605 2 6.6Z" fill="#030D45"/> <path fill-rule="evenodd" clip-rule="evenodd" d="M14.3077 6.6C14.3077 6.17395 14.6521 5.82857 15.0769 5.82857L21.2308 5.82857C21.6556 5.82857 22 6.17395 22 6.6C22 7.02605 21.6556 7.37143 21.2308 7.37143L15.0769 7.37143C14.6521 7.37143 14.3077 7.02605 14.3077 6.6Z" fill="#030D45"/> <path d="M10.9744 17.4C10.9744 19.3882 12.5815 21 14.5641 21C16.5467 21 18.1538 19.3882 18.1538 17.4C18.1538 15.4118 16.5467 13.8 14.5641 13.8C12.5815 13.8 10.9744 15.4118 10.9744 17.4Z" fill="#030D45"/> <path fill-rule="evenodd" clip-rule="evenodd" d="M22 17.4C22 16.974 21.6556 16.6286 21.2308 16.6286H18.1538C17.729 16.6286 17.3846 16.974 17.3846 17.4C17.3846 17.826 17.729 18.1714 18.1538 18.1714H21.2308C21.6556 18.1714 22 17.826 22 17.4Z" fill="#030D45"/> <path fill-rule="evenodd" clip-rule="evenodd" d="M9.69231 17.4C9.69231 16.974 9.34791 16.6286 8.92308 16.6286L2.76923 16.6286C2.3444 16.6286 2 16.974 2 17.4C2 17.826 2.3444 18.1714 2.76923 18.1714L8.92308 18.1714C9.34791 18.1714 9.69231 17.826 9.69231 17.4Z" fill="#030D45"/> </svg>');
}

.detail .col-options-button {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="white" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" /> </svg>');
}

.quickgrid[theme=fancy-table] tbody tr:nth-child(odd) {
    background: none;
}

.quickgrid[theme=fancy-table] tr:nth-child(even) {
    background: transparent;
}

.quickgrid[theme=fancy-table] tr td:nth-child(odd) {
    /*background: #F8F8F8;*/
    background: #E7E7E7;
}

.quickgrid[theme=fancy-table] tr td:nth-child(even) {
    border-right: 1px solid #E6E4E4;
}

.quickgrid[theme=fancy-table] .col-title-text {
    color: #ffffff;
}

.quickgrid[theme=fancy-table] .col-title {
    justify-content: center;
}

.quickgrid[theme=fancy-table] .col-options-button {
    margin-left: 5px;
}

/* TEMA CARTERA FACTORING*/

.quickgrid[theme=carteraFactoring-table] {
    width: 100%;
}

    .quickgrid[theme=carteraFactoring-table] td, th {
        /*padding: 20px .625em .625em .625em;*/
        height: 10%;
        vertical-align: middle;
        box-sizing: border-box;
        overflow-x: hidden;
        overflow-y: auto;
        /*width: 100%;*/
        font-size: 12px;
        text-overflow: ellipsis;
        text-align: center;
    }

    .quickgrid[theme=carteraFactoring-table] .col-title {
        display: flex; /* So that we can make col-title-text expand as much as possible, and still hide overflow with ellipsis */
        min-width: 0px;
        flex-grow: 1;
        padding: 0;
        flex-wrap: wrap;
        font-size: 12px;
    }

    .quickgrid[theme=carteraFactoring-table] .col-title-text {
        white-space: pre-line;
    }

    .quickgrid[theme=carteraFactoring-table] td {
        border-right: 1px solid #f8f8f8;
        border-bottom: 1px solid #f8f8f8;
        font-size: 12px;
    }

    .quickgrid[theme=carteraFactoring-table] thead th {
        border-bottom: 1px solid #f7f7f9;
        color: #ffffff;
        /*background: #4FC3A1;*/
        /*background: #13317a*/
        background: var(--color-1);
    }

        .quickgrid[theme=carteraFactoring-table] thead th:nth-child(odd) {
            color: #ffffff;
            /*background: #324960;*/
            /*background: #13317a;*/
            background: var(--color-1);
        }

    .quickgrid[theme=carteraFactoring-table] tr:nth-child(even) {
        /*background: #F8F8F8;*/
        /*background: #13317a;*/
        background: var(--color-1);
    }

    .quickgrid[theme=carteraFactoring-table] tbody tr:nth-child(odd) {
        background: none;
    }

    .quickgrid[theme=carteraFactoring-table] tr:nth-child(even) {
        background: transparent;
    }

    .quickgrid[theme=carteraFactoring-table] tr td:nth-child(odd) {
        /*background: #F8F8F8;*/
        background: #E7E7E7;
    }

    .quickgrid[theme=carteraFactoring-table] tr td:nth-child(even) {
        border-right: 1px solid #E6E4E4;
    }

    .quickgrid[theme=carteraFactoring-table] .col-title-text {
        color: #ffffff;
    }

    .quickgrid[theme=carteraFactoring-table] .col-title {
        justify-content: center;
    }

    .quickgrid[theme=carteraFactoring-table] .col-options-button {
        margin-left: 5px;
    }


.quickgrid[theme=fancy-table] .rsocial-cvigente {
    width: 150px !important;
}

.quickgrid[theme=fancy-table] .oper-cvigente {
    width: 80px !important;
}

.quickgrid[theme=fancy-table] .tipodocto-cvigente {
    width: 150px !important;
}

.quickgrid[theme=fancy-table] .ndocto-cvigente {
    width: 80px !important;
}

.quickgrid[theme=fancy-table] .fchoper-cvigente {
    width: 80px !important;
}

.quickgrid[theme=fancy-table] .fchvcto-cvigente {
    width: 70px !important;
}

.quickgrid[theme=fancy-table] .montodocto-cvigente {
    width: 80px !important;
}

.quickgrid[theme=fancy-table] .montovigente-cvigente {
    width: 80px !important;
}

.quickgrid[theme=fancy-table] .estado-cvigente {
    width: 70px !important;
}

.quickgrid[theme=fancy-table] .diasmora-cvigente {
    width: 50px !important;
}

.quickgrid[theme=fancy-table] .gescobranza-cvigente {
    width: 80px !important;
}