//  =================
//      Imports
//  =================

@import '../base/color_variables';      // Color Variables
@import '../base/fonticons';            // Fonticons Variables
@import '../base/urls';                 // URLS Variables
@import '../base/utilities_variables';  // Utilities Variables

button.dt-button {
    border: none;
    border-radius: $br-30;
    font-size: 13px;
    margin-right: 12px;
    padding: 6px 20px;
    color: $white;
    background-color: $additional-color-5;
    background-image: $no-color;
    box-shadow: $shadow-4;
    will-change: opacity, transform;
    transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
    &:hover {
        &:not(.disabled) {
            border: none;
            background-image: $no-color;
            background-color: $additional-color-11;
            color: $white !important;
            font-size: 13px;
            margin-right: 12px;
            padding: 6px 20px;
            box-shadow: $shadow-31;
            will-change: opacity, transform;
            transition: all 0.3s ease-out;
            -webkit-transition: all 0.3s ease-out;
        }
    }
    &:active {
        &:not(.disabled) {
            border: none;
            background-image: $no-color;
            background-color: $additional-color-11;
            color: $white;
            font-size: 13px;
            margin-right: 12px;
            padding: 6px 20px;
            box-shadow: $shadow-31;
            will-change: opacity, transform;
            transition: all 0.3s ease-out;
            -webkit-transition: all 0.3s ease-out;
            &:hover {
                &:not(.disabled) {
                    border: none;
                    background-image: none;
                    background-color: $additional-color-11;
                    color: $white;
                    font-size: 13px;
                    margin-right: 12px;
                    padding: 6px $p-20;
                    box-shadow: $shadow-33;
                }
            }
        }
    }
    &:focus {
        &:not(.disabled) {
            border: none;
            background-image: none;
            background-color: $additional-color-11;
            color: $white;
            font-size: 13px;
            margin-right: 12px;
            padding: 6px $p-20;
        }
    }
}
.dataTables_filter {
    input {
        margin-left: $m-5;
        border-radius: $br-30;
        padding-bottom: $p-5;
        padding-top: $p-5;
        border: $solid $b-width-1 $color_622;
    }
}
table.dataTable.display {
    tbody {
        tr.odd {
            background-color: $white;
            >.sorting_1 {
                background-color: $white;
            }
        }
        tr {
            &:hover {
                background-color: $white;
                >.sorting_1 {
                    background-color: $white;
                }
            }
        }
        tr.even {
            >.sorting_1 {
                background-color: $white;
            }
        }
    }
}
.table {
    >thead {
        >tr {
            >th {
                color: $additional-color-2;
                font-size: 16px;
            }
        }
    }
    thead {
        th {
            vertical-align: $v-align-bottom;
            border-bottom: $b-width-1 $solid $color_370;
        }
    }
    >tbody {
        >tr {
            >td {
                padding: 11px 14px;
                font-size: 14px;
            }
        }
    }
}
.dataTables_wrapper.dt-bootstrap4 {
    .table {
        >thead {
            >tr {
                >th {
                    &:hover {
                        color: $color_47;
                        border-bottom: $solid $b-width-1 $color_47;
                    }
                }
            }
        }
    }
}
.table-bordered {
    td {
        border: $b-width-1 $solid $color_369;
    }
}
td {
    color: $color_2;
}
.table-hover {
    tbody {
        tr {
            &:hover {
                >td {
                    color: $additional-color-5;
                    font-weight: 600;
                }
                >th {
                    color: $additional-color-5;
                    font-weight: 600;
                }
                will-change: opacity, transform;
                transition: all 0.3s ease-out;
                -webkit-transition: all 0.3s ease-out;
            }
        }
    }
}
#search-term_paginate {
    .pagination {
        >.active {
            >a {
                background-color: $additional-color-2;
                border-color: $color_none;
                color: $white;
                border-radius: $br-4;
                will-change: opacity, transform;
                transition: all 0.3s ease-out;
                -webkit-transition: all 0.3s ease-out;
            }
        }
    }
    ul.pagination {
        li {
            a {
                &:hover {
                    &:not(.active) {
                        background-color: $additional-color-11;
                        color: $white;
                    }
                }
                color: $additional-color-11;
                float: left;
                padding: $p-5 12px;
                border-radius: 4px;
                text-decoration: none;
                border: 0px $solid $color_118;
                font-size: 14px;
                margin-left: $m-0;
                transition: all .3s linear;
            }
        }
    }
}
div#search-term_paginate {
    .page-link {
        &:focus {
            box-shadow: none;
        }
    }
}