﻿/*************************************************************************/
/* MODERN TABLES - Bootstrap 3 compatible                                */
/* Generic table system + compact/KPI variants + view extensions         */
/*************************************************************************/

/*************************************************************************/
/* THEME VARIABLES                                                       */
/*************************************************************************/

:root {
    --table-background: #ffffff;
    --table-background-soft: #f8fafc;
    --table-background-subtle: #fbfcfd;
    --table-header-background: #f6f8fa;
    --table-group-background: #edf2f6;
    --table-active-background: #eef3f7;
    --table-text: #3f4b59;
    --table-title: #344252;
    --table-muted: #657181;
    --table-muted-light: #8a94a1;
    --table-border: #dfe4ea;
    --table-border-light: #edf0f3;
    --table-accent: var(--panel-accent, #b18849);
    --table-accent-hover: #684b21;
    --table-success-text: #3c763d;
    --table-success-background: #f0f8f3;
    --table-success-border: #d5ead5;
    --table-warning-text: #8a6d3b;
    --table-warning-background: #fff7ed;
    --table-warning-border: #f0e1b9;
    --table-danger: #b94a48;
    --table-danger-background: #fdf1f1;
    --table-info-background: #f0f6fa;
    --table-radius: 7px;
}


/*************************************************************************/
/* STANDARD TABLES INSIDE MODERN PANELS                                  */
/*************************************************************************/

.panel.panel-x .panel-body .table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 0;
    color: var(--table-text);
    background-color: var(--table-background);
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.95em;
}


    /*************************************************************************/
    /* HEADER                                                                */
    /*************************************************************************/

    .panel.panel-x .panel-body .table > thead > tr > th {
        padding: 11px 14px;
        color: var(--table-muted);
        background-color: var(--table-header-background);
        border-top: 0;
        border-right: 0;
        border-bottom: 1px solid var(--table-border);
        border-left: 0;
        font-size: 0.82em;
        font-weight: 600;
        line-height: 1.35;
        letter-spacing: 0.025em;
        text-transform: uppercase;
        vertical-align: middle;
        white-space: nowrap;
    }


    /*************************************************************************/
    /* BODY CELLS                                                            */
    /*************************************************************************/

    .panel.panel-x .panel-body .table > tbody > tr > td,
    .panel.panel-x .panel-body .table > tbody > tr > th {
        padding: 12px 14px;
        border-top: 0;
        border-right: 0;
        border-bottom: 1px solid var(--table-border-light);
        border-left: 0;
        line-height: 1.45;
        vertical-align: middle;
    }

    .panel.panel-x .panel-body .table > tbody > tr:last-child > td,
    .panel.panel-x .panel-body .table > tbody > tr:last-child > th {
        border-bottom: 0;
    }


    /*************************************************************************/
    /* FOOTER                                                                */
    /*************************************************************************/

    .panel.panel-x .panel-body .table > tfoot > tr > td,
    .panel.panel-x .panel-body .table > tfoot > tr > th {
        padding: 12px 14px;
        color: var(--table-title);
        background-color: var(--table-background-soft);
        border-top: 1px solid var(--table-border);
        border-bottom: 0;
        font-weight: 600;
        vertical-align: middle;
    }


/*************************************************************************/
/* HOVER / STRIPED / ACTIVE                                              */
/*************************************************************************/

.panel.panel-x .panel-body .table-hover > tbody > tr {
    transition: background-color 0.15s ease;
}

    .panel.panel-x .panel-body .table-hover > tbody > tr:hover {
        background-color: var(--table-background-soft);
    }

.panel.panel-x > .panel-body .table-striped > tbody > tr:nth-of-type(odd) {
    background-color: var(--table-background-subtle);
}

.panel.panel-x > .panel-body .table-striped > tbody > tr:nth-of-type(even) {
    background-color: var(--table-background);
}

.panel.panel-x > .panel-body .table > tbody > tr.active > td,
.panel.panel-x > .panel-body .table > tbody > tr.active > th,
.panel.panel-x > .panel-body .table > tbody > tr.selected > td,
.panel.panel-x > .panel-body .table > tbody > tr.selected > th {
    background-color: var(--table-active-background);
}


/*************************************************************************/
/* SEMANTIC ROW STATES                                                   */
/*************************************************************************/

.panel.panel-x > .panel-body .table > tbody > tr.success > td {
    background-color: var(--table-success-background);
}

.panel.panel-x > .panel-body .table > tbody > tr.warning > td {
    background-color: var(--table-warning-background);
}

.panel.panel-x > .panel-body .table > tbody > tr.danger > td {
    background-color: var(--table-danger-background);
}

.panel.panel-x > .panel-body .table > tbody > tr.info > td {
    background-color: var(--table-info-background);
}


/*************************************************************************/
/* LINKS                                                                 */
/*************************************************************************/

.panel.panel-x > .panel-body .table a {
    color: var(--table-accent);
    font-weight: 500;
    text-decoration: none;
}

    .panel.panel-x > .panel-body .table a:hover,
    .panel.panel-x > .panel-body .table a:focus {
        color: var(--table-accent-hover);
        text-decoration: underline;
    }


/*************************************************************************/
/* BUTTONS INSIDE CELLS                                                  */
/*************************************************************************/

.panel.panel-x > .panel-body .table .btn {
    margin: 0;
    padding: 5px 9px;
    border-radius: 5px;
    font-size: 0.85em;
    line-height: 1.35;
}


/*************************************************************************/
/* CONTROLS INSIDE CELLS                                                 */
/*************************************************************************/

.panel.panel-x > .panel-body .table .form-control {
    min-width: 80px;
    height: 34px;
    padding: 6px 9px;
    border-color: var(--table-border);
    border-radius: 5px;
    font-size: 0.95em;
}


/*************************************************************************/
/* NUMBERS                                                               */
/*************************************************************************/

.panel.panel-x > .panel-body .table .text-number,
.panel.panel-x > .panel-body .table td.number,
.panel.panel-x > .panel-body .table th.number {
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}


/*************************************************************************/
/* ACTION COLUMN                                                         */
/*************************************************************************/

.panel.panel-x > .panel-body .table td.actions,
.panel.panel-x > .panel-body .table th.actions {
    width: 1%;
    text-align: right;
    white-space: nowrap;
}


/*************************************************************************/
/* EMPTY RESULT                                                          */
/*************************************************************************/

.panel.panel-x > .panel-body .table .table-empty,
.panel.panel-x > .panel-body .table td.empty {
    padding: 35px 20px;
    color: var(--table-muted-light);
    text-align: center;
    font-style: italic;
}


/*************************************************************************/
/* RESPONSIVE CONTAINER                                                  */
/*************************************************************************/

.panel.panel-x > .panel-body > .table-responsive {
    margin: 0;
    overflow-x: auto;
    border: 1px solid var(--table-border);
    border-radius: var(--table-radius);
    -webkit-overflow-scrolling: touch;
}

    .panel.panel-x > .panel-body > .table-responsive > .table {
        margin-bottom: 0;
    }

        .panel.panel-x > .panel-body > .table-responsive > .table > thead > tr:first-child > th:first-child {
            border-top-left-radius: var(--table-radius);
        }

        .panel.panel-x > .panel-body > .table-responsive > .table > thead > tr:first-child > th:last-child {
            border-top-right-radius: var(--table-radius);
        }


/*************************************************************************/
/* COMPACT TABLE                                                         */
/*************************************************************************/

.panel.panel-x .table.table-compact > thead > tr > th {
    padding: 6px 8px;
    font-size: 0.76em;
    line-height: 1.25;
}

.panel.panel-x .table.table-compact > tbody > tr > td,
.panel.panel-x .table.table-compact > tbody > tr > th,
.panel.panel-x .table.table-compact > tfoot > tr > td,
.panel.panel-x .table.table-compact > tfoot > tr > th {
    padding: 6px 8px;
    line-height: 1.3;
}


/*************************************************************************/
/* KPI COMPACT TABLES                                                    */
/*************************************************************************/

.panel.panel-x .kpis-container .table.table-compact {
    margin-bottom: 0;
    font-size: 0.85em;
}

    .panel.panel-x .kpis-container .table.table-compact > thead > tr > th,
    .panel.panel-x .kpis-container .table.table-compact > tbody > tr > td,
    .panel.panel-x .kpis-container .table.table-compact > tbody > tr > th,
    .panel.panel-x .kpis-container .table.table-compact > tfoot > tr > td,
    .panel.panel-x .kpis-container .table.table-compact > tfoot > tr > th {
        padding: 4px 6px;
    }


/*************************************************************************/
/* INSTRUMENT ACCESS TABLE                                               */
/* Extends the standard table styles above                               */
/*************************************************************************/

/*************************************************************************/
/* ACCESS - COLUMN SIZES                                                 */
/*************************************************************************/

.access-table .access-col-actions {
    width: 130px;
    white-space: nowrap;
}

.access-table .access-col-date {
    width: 90px;
    white-space: nowrap;
}

.access-table .access-col-type {
    width: 90px;
}

.access-table .access-col-flags {
    width: 100px;
    white-space: nowrap;
}

.access-table .access-col-id {
    min-width: 170px;
    max-width: 230px;
}

.access-table .access-col-name {
    min-width: 180px;
}

.access-table .access-col-recipient {
    width: 120px;
}

.access-table .access-col-code {
    width: 110px;
}

.access-table .access-col-diligence {
    width: 100px;
}

.access-table .access-col-orders {
    width: 75px;
}

.access-table .access-col-update {
    width: 130px;
    white-space: nowrap;
}


/*************************************************************************/
/* ACCESS - GROUP HEADER                                                 */
/*************************************************************************/

.access-table > thead > .access-table-groups > th {
    color: var(--table-muted);
    background-color: var(--table-group-background);
    font-size: 0.82em;
    font-weight: 650;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}


/*************************************************************************/
/* ACCESS - ACTIONS                                                      */
/*************************************************************************/

.access-actions {
    display: inline-flex;
    align-items: center;
    gap: 3px;
}

    .access-actions .btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 27px;
        height: 27px;
        padding: 0;
    }

    .access-actions .access-action-danger:hover,
    .access-actions .access-action-danger:focus {
        color: var(--table-danger);
    }


/*************************************************************************/
/* ACCESS - FLAGS                                                        */
/*************************************************************************/

.access-flags {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.access-flag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    color: var(--table-muted);
    background-color: var(--table-group-background);
    border: 1px solid var(--table-border);
    border-radius: 999px;
    font-size: 11px;
}


/*************************************************************************/
/* ACCESS - CONTENT                                                      */
/*************************************************************************/

.access-reference {
    font-family: Consolas, "Courier New", monospace;
    font-size: 0.9em;
}

.access-name {
    font-weight: 600;
}

.access-secondary-link {
    font-size: 0.92em;
}


/*************************************************************************/
/* ACCESS - ORDER BADGES                                                 */
/*************************************************************************/

.access-order-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 26px;
    height: 24px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 650;
    text-decoration: none;
}

.access-order-new {
    color: var(--table-success-text);
    background-color: var(--table-success-background);
    border: 1px solid var(--table-success-border);
}

.access-order-pending {
    color: var(--table-warning-text);
    background-color: var(--table-warning-background);
    border: 1px solid var(--table-warning-border);
}

.access-order-empty {
    color: var(--table-muted-light);
}


/*************************************************************************/
/* RESPONSIVE                                                            */
/*************************************************************************/

@media (max-width: 1199px) {
    .access-table {
        min-width: 1120px;
    }
}

@media (max-width: 767px) {
    .panel.panel-x > .panel-body .table {
        font-size: 0.9em;
    }

        .panel.panel-x > .panel-body .table > thead > tr > th,
        .panel.panel-x > .panel-body .table > tbody > tr > td,
        .panel.panel-x > .panel-body .table > tbody > tr > th,
        .panel.panel-x > .panel-body .table > tfoot > tr > td,
        .panel.panel-x > .panel-body .table > tfoot > tr > th {
            padding: 9px 10px;
        }
}
