table {
    border-collapse: collapse;
    width: 100%;
    font-family: "Open Sans", sans-serif;
}

/* alignment */
.col--text,
.col--date {
    text-align: left;
}

.col--number {
    text-align: right;
}

/* full‑width thick header line */
thead tr {
    border-bottom: 3px solid #666;
}

thead th,
thead td {
    padding: 0.5rem 0.75rem;
    padding-left: 0px;
    text-align: left;
}

tbody th,
tbody td {
    padding: 0.45rem 0.75rem;
    padding-left: 0px;
    border-bottom: 1px solid #ddd;
}

/* Screenreader-only caption */
.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
}

/* Column headers */
table thead th {
    vertical-align: bottom;
}

/* Horizontal scroll */
.table-scroll {
    overflow-x: auto;
    width: 100%;
}

.table-scroll table {
    width: max-content;
    min-width: 100%;
    border-collapse: collapse;
    table-layout: auto;
}

.table-scroll th,
.table-scroll td {
    min-width: var(--min-col-width);
    max-width: var(--max-col-width);
    white-space: normal;     
    word-break: break-word; 
}

/* Freeze first column */
.table-scroll.freeze-first-col th:first-child,
.table-scroll.freeze-first-col td:first-child {
    position: sticky;
    left: 0;
    z-index: 2;
    background: white;
}

.table-scroll.freeze-first-col thead th:first-child {
    z-index: 4;
}

.table-scroll.freeze-first-col th.colgroup-header {
    position: relative;
    /* anchor for inner element */
}

.table-scroll.freeze-first-col .sticky-first-col {
    position: sticky;
    left: 0;
    z-index: 3;
    background: white;
    display: inline-block;
}

.table-scroll.freeze-first-col th:first-child,
.table-scroll.freeze-first-col td:first-child,
.table-scroll.freeze-first-col .sticky-first-col {
    box-shadow: 1px 0 0 white;
}