/* Shared density and theme for every console table, including loaded partials. */
:root {
    --hwc-grid-bg: #fff;
    --hwc-grid-stripe: #f0f5fc;
    --hwc-grid-header: #e5edf8;
    --hwc-grid-border: #d4deeb;
    --hwc-grid-hover: #d9e9ff;
    --hwc-grid-hover-text: #102d53;
    --hwc-grid-accent: #0d6efd;
    --hwc-table-font-size: 13px;
    --hwc-table-cell-padding-y: 7px;
    --hwc-table-cell-padding-x: 10px;
}
[data-theme="dark"] {
    --hwc-grid-bg: #0b1b2d;
    --hwc-grid-stripe: #1f2937;
    --hwc-grid-header: #203955;
    --hwc-grid-border: #34465c;
    --hwc-grid-hover: #234e80;
    --hwc-grid-hover-text: #fff;
    --hwc-grid-accent: #79b6ff;
}
.table,
[data-theme="dark"] .table {
    --bs-table-bg: var(--hwc-grid-bg);
    --bs-table-striped-bg: transparent;
    --bs-table-hover-bg: transparent;
    --bs-table-border-color: var(--hwc-grid-border);
    font-size: 13px;
    line-height: 1.2;
}
.table > :not(caption) > * > * {
    padding: 7px 10px !important;
    border-color: var(--hwc-grid-border) !important;
    vertical-align: middle;
    overflow-wrap: normal;
    word-break: normal;
    white-space: nowrap;
}
.table > thead > tr > th,
[data-theme="dark"] .table > thead > tr > th {
    background: var(--hwc-grid-header) !important;
    font-size: 12px;
    font-weight: 600;
    padding: 9px 10px !important;
    box-shadow: none;
}
.table > tbody > tr > * {
    height: 38px;
    background-color: var(--hwc-grid-bg) !important;
    box-shadow: none;
}
.table > tbody > tr:nth-child(odd) > * {
    background-color: var(--hwc-grid-stripe) !important;
}
/* Keep Bootstrap's semantic row/cell backgrounds where a page uses them. */
.table > tbody > tr[class*="table-"] > *,
.table > tbody > tr > [class*="table-"] {
    background-color: var(--bs-table-bg) !important;
}
.table > tbody > tr:hover > *,
.table > tbody > tr:focus-within > *,
[data-theme="dark"] .table > tbody > tr:hover > *,
[data-theme="dark"] .table > tbody > tr:focus-within > * {
    background-color: var(--hwc-grid-hover) !important;
    color: var(--hwc-grid-hover-text);
    box-shadow: none;
}
.table > tbody > tr:hover > :first-child,
.table > tbody > tr:focus-within > :first-child,
[data-theme="dark"] .table > tbody > tr:hover > :first-child,
[data-theme="dark"] .table > tbody > tr:focus-within > :first-child {
    box-shadow: inset 3px 0 var(--hwc-grid-accent);
}
.table .btn,
.table.table-compact .btn.btn-sm {
    padding: 4px 7px;
    font-size: 12px;
    line-height: 1.2;
    white-space: nowrap;
}
.table .form-control,
.table .form-select,
.table .input-group-text {
    font-size: 13px;
    min-height: 28px;
    padding-top: 4px;
    padding-bottom: 4px;
}
.table .badge { font-size: 11px; }
.table .text-wrap,
.table details,
.trace-signals td:last-child {
    white-space: normal;
}
.table pre {
    max-width: 640px;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}
.table-responsive { max-width: 100%; }
main:has(.table) { min-width: 0; }
main:has(.table) > h2,
main:has(.table) > .d-flex h2,
main:has(.table) > .d-flex h1.h3 {
    font-size: 24px;
    line-height: 1.25;
}
main:has(.table) > .d-flex {
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 12px !important;
}
main:has(.table) > .d-flex .btn {
    font-size: 13px;
    padding: 6px 10px;
    min-height: 32px;
}
@media (max-width: 600px) {
    main:has(.table) > .d-flex > .d-flex { flex-wrap: wrap; }
    main:has(.table) > .d-flex .ms-auto { margin-left: 0 !important; }
}