/*
Template Name: Material Ad Astra
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 {
        --mat-icon-button-state-layer-size: 38px;
        width: var(--mat-icon-button-state-layer-size);
        height: var(--mat-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: 0.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;
    }
}