/*
Template Name: Material HeadUp
Author: UnEspace
Email: rampeur@gmail.com
File: scss
*/

/*******************
Table
*******************/

.table-responsive {
    overflow: auto;
    .mat-table {
        min-width: 280px;
    }
    .mat-header-row {
        .mat-header-cell {
            white-space: nowrap;
        }
    }
    .mat-cell {
        white-space: nowrap;
    }
}
table {
    background-color:transparent;
    &.table {
        border-spacing: 0;
        border-collapse: collapse;
        margin-bottom:20px;
        max-width:100%;
        width:100%;
        text-align: left;
        td, th {
            padding: 0;
        }
        th {
            text-align:left
        }
    }
    .mat-mdc-icon-button.mat-mdc-button-base {
        --mdc-icon-button-state-layer-size: 38px;
        width: var(--mdc-icon-button-state-layer-size);
        height: var(--mdc-icon-button-state-layer-size);
        padding: 7px;
        .material-icons {
            font-size: 22px;
        }
        .mat-icon {
            height: 22px;
            width: 22px;
        }
    }
}
caption {
    padding-top:8px;
    padding-bottom:8px;
    color:#777;
    text-align:left
}
.table>tbody>tr>td,
.table>tbody>tr>th,
.table>tfoot>tr>td,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>thead>tr>th {
    padding:8px;
    line-height:1.42857143;
    vertical-align:top;
    border-top:1px solid #ddd
}
.table>thead>tr>th {
    vertical-align:bottom;
    border-bottom:2px solid #ddd
}

.table>caption+thead>tr:first-child>td,
.table>caption+thead>tr:first-child>th,
.table>colgroup+thead>tr:first-child>td,
.table>colgroup+thead>tr:first-child>th,
.table>thead:first-child>tr:first-child>td,
.table>thead:first-child>tr:first-child>th {
    border-top:0
}
.table>tbody+tbody {
    border-top:2px solid #ddd
}
.table .table {
    background-color:#fff
}
.table-condensed>tbody>tr>td,
.table-condensed>tbody>tr>th,
.table-condensed>tfoot>tr>td,
.table-condensed>tfoot>tr>th,
.table-condensed>thead>tr>td,
.table-condensed>thead>tr>th {
    padding:5px
}
.table-bordered {
    border:1px solid #ddd
}
.table-bordered>tbody>tr>td,
.table-bordered>tbody>tr>th,
.table-bordered>tfoot>tr>td,
.table-bordered>tfoot>tr>th,
.table-bordered>thead>tr>td,
.table-bordered>thead>tr>th {
    border:1px solid #ddd
}
.table-bordered>thead>tr>td,
.table-bordered>thead>tr>th {
    border-bottom-width:2px
}
.table-striped>tbody>tr:nth-of-type(odd) {
    background-color:#f9f9f9
}
.table-hover>tbody>tr:hover {
    background-color:#f5f5f5
}

table col[class*=col-] {
    position:static;
    display:table-column;
    float:none
}
table td[class*=col-],
table th[class*=col-] {
    position:static;
    display:table-cell;
    float:none
}
.table>tbody>tr.active>td,
.table>tbody>tr.active>th,
.table>tbody>tr>td.active,
.table>tbody>tr>th.active,
.table>tfoot>tr.active>td,
.table>tfoot>tr.active>th,
.table>tfoot>tr>td.active,
.table>tfoot>tr>th.active,
.table>thead>tr.active>td,
.table>thead>tr.active>th,
.table>thead>tr>td.active,
.table>thead>tr>th.active {
    background-color:#f5f5f5;
}
.table-hover>tbody>tr.active:hover>td,
.table-hover>tbody>tr.active:hover>th,
.table-hover>tbody>tr:hover>.active,
.table-hover>tbody>tr>td.active:hover,
.table-hover>tbody>tr>th.active:hover {
    background-color:#e8e8e8;
}
.table>tbody>tr.success>td,
.table>tbody>tr.success>th,
.table>tbody>tr>td.success,
.table>tbody>tr>th.success,
.table>tfoot>tr.success>td,
.table>tfoot>tr.success>th,
.table>tfoot>tr>td.success,
.table>tfoot>tr>th.success,
.table>thead>tr.success>td,
.table>thead>tr.success>th,
.table>thead>tr>td.success,
.table>thead>tr>th.success {
    background-color:#dff0d8;
}
.table-hover>tbody>tr.success:hover>td,
.table-hover>tbody>tr.success:hover>th,
.table-hover>tbody>tr:hover>.success,
.table-hover>tbody>tr>td.success:hover,
.table-hover>tbody>tr>th.success:hover {
    background-color:#d0e9c6;
}
.table>tbody>tr.info>td,
.table>tbody>tr.info>th,
.table>tbody>tr>td.info,
.table>tbody>tr>th.info,
.table>tfoot>tr.info>td,
.table>tfoot>tr.info>th,
.table>tfoot>tr>td.info,
.table>tfoot>tr>th.info,
.table>thead>tr.info>td,
.table>thead>tr.info>th,
.table>thead>tr>td.info,
.table>thead>tr>th.info {
    background-color:#d9edf7;
}
.table-hover>tbody>tr.info:hover>td,
.table-hover>tbody>tr.info:hover>th,
.table-hover>tbody>tr:hover>.info,
.table-hover>tbody>tr>td.info:hover,
.table-hover>tbody>tr>th.info:hover {
    background-color:#c4e3f3;
}
.table>tbody>tr.warning>td,
.table>tbody>tr.warning>th,
.table>tbody>tr>td.warning,
.table>tbody>tr>th.warning,
.table>tfoot>tr.warning>td,
.table>tfoot>tr.warning>th,
.table>tfoot>tr>td.warning,
.table>tfoot>tr>th.warning,
.table>thead>tr.warning>td,
.table>thead>tr.warning>th,
.table>thead>tr>td.warning,
.table>thead>tr>th.warning {
    background-color:#fcf8e3;
}
.table-hover>tbody>tr.warning:hover>td,
.table-hover>tbody>tr.warning:hover>th,
.table-hover>tbody>tr:hover>.warning,
.table-hover>tbody>tr>td.warning:hover,
.table-hover>tbody>tr>th.warning:hover {
    background-color:#faf2cc;
}
.table>tbody>tr.danger>td,
.table>tbody>tr.danger>th,
.table>tbody>tr>td.danger,
.table>tbody>tr>th.danger,
.table>tfoot>tr.danger>td,
.table>tfoot>tr.danger>th,
.table>tfoot>tr>td.danger,
.table>tfoot>tr>th.danger,
.table>thead>tr.danger>td,
.table>thead>tr.danger>th,
.table>thead>tr>td.danger,
.table>thead>tr>th.danger {
    background-color:#f2dede;
}
.table-hover>tbody>tr.danger:hover>td,
.table-hover>tbody>tr.danger:hover>th,
.table-hover>tbody>tr:hover>.danger,
.table-hover>tbody>tr>td.danger:hover,
.table-hover>tbody>tr>th.danger:hover {
    background-color:#ebcccc;
}

tr.mat-mdc-header-row.primary,
.table>thead>tr.primary {
    background-color: rgba(167, 212, 196, 0.1); // #a5d492;
}
.table>tbody>tr.primary.active>td,
.table>tbody>tr.primary.active>th,
.table>tbody>tr.primary>td.active,
.table>tbody>tr.primary>th.active,
.table>tfoot>tr.primary.active>td,
.table>tfoot>tr.primary.active>th,
.table>tfoot>tr.primary>td.active,
.table>tfoot>tr.primary>th.active,
.table>thead>tr.primary.active>td,
.table>thead>tr.primary.active>th,
.table>thead>tr.primary>td.active,
.table>thead>tr.primary>th.active {
    background-color: rgba(165, 212, 146, 0.2);
}
.table-hover>tbody>tr.primary.active:hover>td,
.table-hover>tbody>tr.primary.active:hover>th,
.table-hover>tbody>tr.primary:hover>.active,
.table-hover>tbody>tr.primary>td.active:hover,
.table-hover>tbody>tr.primary>th.active:hover {
    background-color: rgba(165, 212, 146, 0.3);
}

tr.mat-mdc-header-row.warn,
.table>thead>tr.warn {
    background-color: rgba(151, 136, 199, 0.1); // #9788c7
}
.table>tbody>tr.warn.active>td,
.table>tbody>tr.warn.active>th,
.table>tbody>tr.warn>td.active,
.table>tbody>tr.warn>th.active,
.table>tfoot>tr.warn.active>td,
.table>tfoot>tr.warn.active>th,
.table>tfoot>tr.warn>td.active,
.table>tfoot>tr.warn>th.active,
.table>thead>tr.warn.active>td,
.table>thead>tr.warn.active>th,
.table>thead>tr.warn>td.active,
.table>thead>tr.warn>th.active {
    background-color: rgba(151, 136, 199, 0.2);
}
.table-hover>tbody>tr.warn.active:hover>td,
.table-hover>tbody>tr.warn.active:hover>th,
.table-hover>tbody>tr.warn:hover>.active,
.table-hover>tbody>tr.warn>td.active:hover,
.table-hover>tbody>tr.warn>th.active:hover {
    background-color: rgba(151, 136, 199, 0.3);
}

tr.mat-mdc-header-row.accent,
.table>thead>tr.accent {
    background-color: rgba(205, 186, 152, 0.1); // #cdba98
}
.table>tbody>tr.accent.active>td,
.table>tbody>tr.accent.active>th,
.table>tbody>tr.accent>td.active,
.table>tbody>tr.accent>th.active,
.table>tfoot>tr.accent.active>td,
.table>tfoot>tr.accent.active>th,
.table>tfoot>tr.accent>td.active,
.table>tfoot>tr.accent>th.active,
.table>thead>tr.accent.active>td,
.table>thead>tr.accent.active>th,
.table>thead>tr.accent>td.active,
.table>thead>tr.accent>th.active {
    background-color: rgba(205, 186, 152, 0.2);
}
.table-hover>tbody>tr.accent.active:hover>td,
.table-hover>tbody>tr.accent.active:hover>th,
.table-hover>tbody>tr.accent:hover>.active,
.table-hover>tbody>tr.accent>td.active:hover,
.table-hover>tbody>tr.accent>th.active:hover {
    background-color: rgba(205, 186, 152, 0.3);
}

.table-responsive {
    min-height:.01%;
    overflow-x:auto
}
.table .mat-mdc-row {
    height: auto;
    color: inherit;
}
.table .mat-mdc-header-row {
    height: auto;
}

body.dark-theme {
    .table.table-dark>thead>tr>th,
    .table.table-dark>tbody>tr>th,
    .table.table-dark>tfoot>tr>th {
        background-color: rgba(0, 0, 0, 0.25);
        font-weight: normal;
    }
    .table.table-dark>tbody>tr>td,
    .table.table-dark>tbody>tr>th,
    .table.table-dark>tfoot>tr>td,
    .table.table-dark>tfoot>tr>th,
    .table.table-dark>thead>tr>td,
    .table.table-dark>thead>tr>th {
        border-top:1px solid rgba(221, 221, 221, 0.3);
    }
    .table.table-dark>thead>tr>th {
        border-bottom:2px solid rgba(221, 221, 221, 0.3);
        padding-top: 0.7rem;
    }
    .table.table-dark>tfoot>tr>th {
        border-top:2px solid rgba(221, 221, 221, 0.3);
    }
    .table.table-dark>tbody+tbody {
        border-top:2px solid rgb(221, 221, 221, 0.3);
    }
    .table-striped.table-dark>tbody>tr:nth-of-type(odd) {
        background-color:rgba(255, 255, 255, 0.03);
    }
    .table-striped.table-dark>tbody>tr:nth-of-type(even) {
        background-color:rgba(255, 255, 255, 0.01);
    }
    .table-hover.table-dark>tbody>tr:hover {
        background-color:rgba(0, 0, 0, 0.02);
    }
}

@media screen and (max-width:767px) {
    .table-responsive {
        width:100%;
        margin-bottom:15px;
        overflow-y:hidden;
        -ms-overflow-style:-ms-autohiding-scrollbar;
        border:1px solid #ddd
    }
    .table-responsive>.table {
        margin-bottom:0
    }
    .table-responsive>.table>tbody>tr>td,
    .table-responsive>.table>tbody>tr>th,
    .table-responsive>.table>tfoot>tr>td,
    .table-responsive>.table>tfoot>tr>th,
    .table-responsive>.table>thead>tr>td,
    .table-responsive>.table>thead>tr>th {
        white-space:nowrap
    }
    .table-responsive>.table-bordered {
        border:0
    }
    .table-responsive>.table-bordered>tbody>tr>td:first-child,
    .table-responsive>.table-bordered>tbody>tr>th:first-child,
    .table-responsive>.table-bordered>tfoot>tr>td:first-child,
    .table-responsive>.table-bordered>tfoot>tr>th:first-child,
    .table-responsive>.table-bordered>thead>tr>td:first-child,
    .table-responsive>.table-bordered>thead>tr>th:first-child {
        border-left:0
    }
    .table-responsive>.table-bordered>tbody>tr>td:last-child,
    .table-responsive>.table-bordered>tbody>tr>th:last-child,
    .table-responsive>.table-bordered>tfoot>tr>td:last-child,
    .table-responsive>.table-bordered>tfoot>tr>th:last-child,
    .table-responsive>.table-bordered>thead>tr>td:last-child,
    .table-responsive>.table-bordered>thead>tr>th:last-child {
        border-right:0
    }
    .table-responsive>.table-bordered>tbody>tr:last-child>td,
    .table-responsive>.table-bordered>tbody>tr:last-child>th,
    .table-responsive>.table-bordered>tfoot>tr:last-child>td,
    .table-responsive>.table-bordered>tfoot>tr:last-child>th {
        border-bottom:0
    }
}