/* ═══════════════════════════════════════════════════════════════════════════
   VX-TABLE  — promoted from EDMS page-local styles (2026-06-01)
   Dense data table for list/register pages. Pairs with a page-specific
   scroll container (e.g. .edms-table-wrap) for border-radius + overflow.
   ═══════════════════════════════════════════════════════════════════════════ */

.vx-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.845rem;
}

/* Sticky header — wrapping container must have overflow-y:auto + max-height */
.vx-table thead {
    position: sticky;
    top: 0;
    z-index: 1;
}

.vx-table thead tr {
    background: var(--mud-palette-background-grey);
    border-bottom: 1.5px solid var(--mud-palette-lines-default);
}

.vx-table th {
    padding: 0.55rem 0.875rem;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.065em;
    font-weight: 700;
    color: var(--mud-palette-text-secondary);
    white-space: nowrap;
    text-align: left;
}

.vx-table td {
    padding: 0.55rem 0.875rem;
    border-bottom: 1px solid var(--mud-palette-lines-default);
    vertical-align: middle;
}

.vx-table tbody tr:last-child td {
    border-bottom: none;
}

/* Clickable row variant — add class="edms-row" or page-specific row class */
.vx-table tbody tr.clickable:hover,
.vx-table tbody tr.edms-row:hover {
    background: var(--mud-palette-action-default-hover);
    cursor: pointer;
}


/* ═══════════════════════════════════════════════════════════════════════════
   VX-BADGE COLOUR VARIANTS — promoted from EDMS page-local styles (2026-06-01)
   Base .vx-badge pill (padding, font-size, border-radius, font-weight)
   assumed to already exist above this block.
   Usage:  <span class="vx-badge primary">ISO 27001</span>
   ═══════════════════════════════════════════════════════════════════════════ */

.vx-badge.primary {
    background: rgba(33, 150, 243, 0.10);
    color: var(--mud-palette-primary);
}

.vx-badge.success {
    background: rgba(76, 175, 80, 0.12);
    color: #2e7d32;
}

.vx-badge.error {
    background: rgba(244, 67, 54, 0.10);
    color: #c62828;
}

.vx-badge.warning {
    background: rgba(255, 152, 0, 0.12);
    color: #e65100;
}

.vx-badge.info {
    background: rgba(2, 136, 209, 0.10);
    color: #0277bd;
}