/*@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;700&display=swap');*/
.ButtonsCustom {
    text-align: left !important;
    width: 100%;
    background-color: white !important;
    color: black !important;
    margin-bottom: 15px;
    font-size: 20px;
    border: 1px solid #CBCED5 !important;
    border-radius: 4px;
    border-top-width: 1px !important;
}

.popoverHeaderCustomize {
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: 700;
    font-size: 16px !important;
    line-height: 21px;
    color: #4B77A7 !important;
    text-transform: uppercase;
    background-color: white !important;
}

.popoverFooterCustomize {
    padding: 0.5rem 0.75rem;
}

.popoverBodyCustomize {
    overflow-y: scroll;
    height: 21em;
}

    .popoverBodyCustomize::-webkit-scrollbar {
        display: none; /* Ocultar scroll */
    }

.columnVisibilityCheckbox {
    margin-left: 10px;
}

#elemento-original {
    position: relative;
    z-index: 2;
}

#elemento-clonado {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.ButtonsTable {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 16px;
    gap: 16px;
}

.TitleTable {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 16px;
    gap: 16px;
}

.H6bolduppercase {
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 21px;
    color: #4B77A7;
    text-transform: uppercase;
}

.TitleTable h6 {
    /* Headers/H6 bold uppercase */

    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 21px;
    /* identical to box height */

    letter-spacing: -0.02em;
    text-transform: uppercase;
    /* Brand/Primary 500 */

    color: #4B77A7;
}

.ParaghapsTextbold {
    font-style: normal;
    font-size: 14px !important;
    line-height: 18px !important;
    color: #253B54 !important;
}

.ParaghapsSmallbold {    
    font-style: normal;   
    font-size: 14px !important;
    line-height: 18px !important;
    color: #253B54 !important;
}

.ParaghapsSmallboldBlue {
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: 700 !important;
    font-size: 14px !important;
    line-height: 18px !important;
    color: #0D6EFD !important;
}

.ParaghapsSmall {
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
    color: #253B54;
}

.ParaghapsSmallGray {
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    color: #6B6F7C
}

.dt-info {
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.01em;
    color: #4B77A7 !important;
    padding: 16px;
    direction: ltr !important;
}

.dt-length {
    padding-top: 2px;
}

    .dt-length label p {
        padding-right: 5px;
    }

    .dt-length label {
        padding: 16px !important;
        display: flex !important;
        align-items: center !important;
        font-size: 14px !important;
        font-family: var(--fontFamily) !important;
        font-style: normal !important;
        font-weight: 400 !important;
        line-height: 24.1px !important;
        letter-spacing: 0.14px !important;
        color: var(--c-principal-n, #4B77A7) !important;
        text-align: right !important;
    }

        .dt-length label select {
            font-size: 14px !important;
            font-family: var(--fontFamily) !important;
            font-style: normal !important;
            font-weight: 400 !important;
            line-height: 0.944rem !important;
            letter-spacing: 0.14px !important;
            color: var(--c-principal-n, #4B77A7) !important;
            text-align: right !important;
        }

.dt-paging .pagination {
    align-items: baseline;
    margin: var(--marginPagination) !important;
    direction: ltr !important;
}

.fsTableLength {
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 18px;
    color: #4B77A7;
    width: 68px;
    height: 28px;
    border: 1px solid #CBCED5;
    border-radius: 4px;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: #F6F9FE !important;
}

.popoverCustomizeTable {
    max-width: 383px !important;
    margin-left: 10px;
}

.bHideColumnSearchTrue {
    position: absolute;
    left: -9999px;
    background-color: rgb(231, 239, 246);
}

.bHideColumnSearchFalse {
    background-color: rgb(231, 239, 246)
}

.tdNumber {
    text-align: right !important;
}

.fixedHeader-locked {
    top: 0px !important;
}

table.fixedHeader-locked {
    position: fixed !important;
    background-color: white;
}

.dataTables_wrapper {
    overflow-x: var(--overflow);
}

.dt-container {
    overflow-x: var(--overflow);
}

.dtfh-floatingparenthead {
    max-width: var(--widthtable) !important;
}

.dt-center {
    text-align: center;
    vertical-align:middle !important;
}

@media (max-width: 500px) {

    table.table.dataTable tbody {
        font-size: 8px !important;
    }

    table.dataTable.nowrap th, table.dataTable.nowrap td {
        white-space: inherit;
    }
}
/* Load Icons and change with hover */
.fsBTNDeletePLugin {
    background-image: url(/Content/Icons/trash.svg) !important;
    padding: 0.25rem .8rem !important;
}

    .fsBTNDeletePLugin:hover {
        background-image: url(/Content/Icons/trash-white.svg) !important;
        padding: 0.25rem .8rem !important;
    }

.fsBTNEditPLugin {
    background-image: url(/Content/Icons/pencil.svg) !important;
    padding: 0.25rem .8rem !important;
}

    .fsBTNEditPLugin:hover {
        background-image: url(/Content/Icons/pencil-white.svg) !important;
        padding: 0.25rem .8rem !important;
    }

.fsBTNAddPLugin {
    background-image: url(/Content/Icons/plus.svg) !important;
    padding: 0.25rem .8rem !important;
}

    .fsBTNAddPLugin:hover {
        background-image: url(/Content/Icons/Plus-white.svg) !important;
        padding: 0.1rem 0.7rem !important;
    }

.dt-container {
    width: 100%
}

div.dt-container .dt-paging .dt-paging-button.current, div.dt-container .dt-paging .dt-paging-button.current:hover {
    background: linear-gradient(to bottom, rgb(0 123 255) 0%, rgb(0 123 255) 100%) !important;
    color: white !important;
}

tr.dtrg-group td {
    cursor: pointer;
    background-color: #f5f5f5;
}

/*tr.dtrg-group.collapsed  {
    content: url(/Content/Icons/PlusBorderIcon.svg);
    margin-right: 5px;
}

tr.dtrg-group  {
    content: url(/Content/Icons/RestIcon.svg);
    margin-right: 5px;
}*/

tr.dtrg-group.fsParentGroupTr.collapsed td:before {
    content: url(/Content/Icons/PlusBorderIcon.svg);
    margin-right: 5px;
}

tr.dtrg-group.fsParentGroupTr td:before {
    content: url(/Content/Icons/RestIcon.svg);
    margin-right: 5px;
}

tr.dtrg-group td {
    background-color: #F6F7F8;
    color: #0D6EFD;
    font-size: 14px;
    font-family: DM Sans;
    font-weight: 400;
    letter-spacing: 0.42px;
    word-wrap: break-word;
}

tr.dtrg-group td.fsParentGroupTd {
    background-color: #4B77A7;
    color: white;
    font-size: 14px;
    font-family: DM Sans;
    font-weight: 400;
    letter-spacing: 0.42px;
    word-wrap: break-word;
}

.dt-processing {
    display: none !important
}

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

table.dataTable.dtr-column > tbody > tr > td.dtr-control:before, table.dataTable.dtr-column > tbody > tr > th.dtr-control:before, table.dataTable.dtr-column > tbody > tr > td.control:before, table.dataTable.dtr-column > tbody > tr > th.control:before {
    left: 4px;
    height: 14px;
    width: 14px;
    display: block !important;
    color: white;
    border: 2px solid white;
    border-radius: 14px;
    box-shadow: 0 0 3px #444;
    box-sizing: content-box !important;
    text-align: center;
    text-indent: 0 !important;
    font-family: 'Courier New', Courier, monospace;
    line-height: 14px;
    content: '+' !important;
    background-color: #0275d8;
    border-top: none !important;
    border-left: none !important;
    border-bottom: none !important;
    border-right: none !important;
}

table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control:before, table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control:before {
    left: 4px;
    height: 14px;
    width: 14px;
    display: block !important;
    color: white;
    border: 2px solid white;
    border-radius: 14px;
    box-shadow: 0 0 3px #444;
    box-sizing: content-box !important;
    text-align: center;
    text-indent: 0 !important;
    font-family: 'Courier New', Courier, monospace;
    line-height: 14px;
    content: '+' !important;
    background-color: #0275d8;
    border-top: none !important;
    border-left: none !important;
    border-bottom: none !important;
    border-right: none !important;
}


table.dataTable.dtr-column > tbody > tr.dtr-expanded td.dtr-control:before, table.dataTable.dtr-column > tbody > tr.dtr-expanded th.dtr-control:before, table.dataTable.dtr-column > tbody > tr.dtr-expanded td.control:before, table.dataTable.dtr-column > tbody > tr.dtr-expanded th.control:before {
    left: 4px;
    height: 14px;
    width: 14px;
    display: block;
    color: white;
    border: 2px solid white;
    border-radius: 14px;
    box-shadow: 0 0 3px #444;
    box-sizing: content-box;
    text-align: center;
    text-indent: 0 !important;
    font-family: 'Courier New', Courier, monospace;
    line-height: 14px;
    content: '-' !important;
    background-color: #d33333 !important;
}
table.dataTable.dtr-inline.collapsed > tbody > tr.dtr-expanded > td.dtr-control:before, table.dataTable.dtr-inline.collapsed > tbody > tr.dtr-expanded > th.dtr-control:before {
    left: 4px;
    height: 14px;
    width: 14px;
    display: block;
    color: white;
    border: 2px solid white;
    border-radius: 14px;
    box-shadow: 0 0 3px #444;
    box-sizing: content-box;
    text-align: center;
    text-indent: 0 !important;
    font-family: 'Courier New', Courier, monospace;
    line-height: 14px;
    content: '-' !important;
    background-color: #d33333 !important;
}

table.dataTable th{
    text-align: center !important;
}

.fsdropdownOptionsTablePlugin .btn {
    padding: 0rem !important;
    line-height: 0;
}
.dt-container .dt-buttons .dt-button {
    display: none;
}
td, th.sorting_1 {
    box-shadow: none !important;
}