table.data-table {
    width: 100%;
    border-radius: 5px;
    border-collapse: collapse;
    outline: 1px solid rgb(0 0 0 / 34%);

    thead {
        height: 50px;
    }

    tbody tr:last-child {
        border-bottom: 0 !important;
    }

    tr {
        min-height: 50px;
    }

    td,
    th {
        min-height: 200px;
        padding: 5px;
        text-align: center;
        font-size: 14px;
    }
}

.filter {
    margin-bottom: 7px;

    button {
        margin-bottom: 0 !important;
        margin-top: 40px !important;
        margin-right: 5px;
    }
}

.paginator-container {
    .box-container{
        position: absolute;
        .box {
            min-height: 38px;
            min-width: 35px;
            border-top: 1px solid #dee2e6;
            border-left: 1px solid #dee2e6;
            border-bottom: 1px solid #dee2e6;
            color: var(--blue-button);
            background-color: var(--white);
            cursor: pointer;
            fa-icon {
                font-size: 12px;
            }
        }
        .current {
            color: white;
        }
        .box:first-child {
            border-top-left-radius: 5px;
            border-bottom-left-radius: 5px;
        }
        .box:last-child {
            border-top-right-radius: 5px;
            border-bottom-right-radius: 5px;
            border-right: 1px solid #dee2e6;
        }
        .box:hover {
            background-color: #e9ecef;
        }
    }
    .total {
        margin-left: auto;
        font-size: 13px;
        color: gray;
        text-transform: lowercase;
    }
    select{
        max-width: 60px;
    }
}