/* v2 styles: tables and DataTables (owner W2-G-B).
   The prototype's product/tables.css is identical to static/css/tables.css, so there is no
   prototype delta to port. This file only overrides the v1 rules that would beat the v2 table
   look (mostly !important ones). The Bootstrap table look itself lives in styles/dp-v2/_tables.scss.
   Every rule is scoped under .dp-v2 and uses tokens only. */

/* Table frame: one 1px border with a 6px radius, horizontal rules only */
.dp-v2 .dp-table {
    border: 1px solid var(--bs-border-color);
    border-radius: var(--dp-radius);
    border-collapse: separate;
    border-spacing: 0;
}

.dp-v2 .dp-table th,
.dp-v2 .dp-table td {
    font-size: var(--dp-font-size);
    border: 0 !important;
    border-bottom: 1px solid var(--bs-border-color) !important;
}

.dp-v2 .dp-table tbody tr:last-child > * {
    border-bottom: 0 !important;
}

/* Muted header. Padding matches $table-cell-padding-y (.45rem) and the .5rem horizontal cell padding. */
.dp-v2 .dp-table th {
    padding: .45rem .5rem !important;
    font-weight: 500;
    color: var(--dp-muted-fg) !important;
    background-color: var(--dp-muted) !important;
}

/* The header corners follow the table radius, because the table does not clip (sticky headers need it) */
.dp-v2 .dp-table th:first-child {
    border-top-left-radius: var(--dp-radius) !important;
}

.dp-v2 .dp-table th:last-child {
    border-top-right-radius: var(--dp-radius) !important;
}

/* Status chips inside tables */
.dp-v2 .dp-table .badge {
    padding: .25em .6em;
    font-size: .6875rem;
    font-weight: 500;
    border-radius: var(--dp-radius-pill);
}

/* DataTables pagination (Previous / Next and page numbers) */
.dp-v2 .dataTables_wrapper .dataTables_paginate {
    font-size: var(--dp-font-size);
}

.dp-v2 .dataTables_wrapper .dataTables_paginate .paginate_button {
    color: var(--dp-fg) !important;
}

.dp-v2 .dataTables_wrapper .dataTables_paginate .paginate_button:not(.current):hover {
    background-color: var(--dp-muted) !important;
    color: var(--dp-fg) !important;
}

.dp-v2 .dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dp-v2 .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background-color: var(--dp-muted) !important;
    color: var(--dp-fg) !important;
    font-weight: 500;
}

.dp-v2 .dataTables_info {
    font-size: var(--dp-font-size);
}

/* DataTables length and search controls: 32px, 4px radius, teal focus ring */
.dp-v2 .dataTables_wrapper .dataTables_filter input,
.dp-v2 .dataTables_wrapper .dataTables_length select {
    height: 2rem;
    font-size: var(--dp-font-size);
    border: 1px solid var(--dp-input-border);
    border-radius: var(--dp-radius-ctl);
    background-color: var(--dp-card);
}

.dp-v2 #tab-2 .dataTables_wrapper .dataTables_filter input,
.dp-v2 #tab-2 .dataTables_wrapper .dataTables_length select {
    height: 2rem;
    font-size: var(--dp-font-size);
}

.dp-v2 .dataTables_wrapper .dataTables_filter input:focus {
    border-color: var(--bs-primary);
    box-shadow: 0 0 0 var(--bs-focus-ring-width) var(--bs-focus-ring-color);
    outline: 0;
}

/* Selects inside responsive tables: drop the forced 8px vertical padding so they match the 32px input height */
.dp-v2 .table-responsive select {
    height: 2rem;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    border-color: var(--dp-input-border) !important;
    font-size: var(--dp-font-size);
}

/* Dash tables embedded in platform pages: base font size */
.dp-v2 .dash-table-container .dash-cell div,
.dp-v2 .dash-table-container .dash-cell div a,
.dp-v2 .dash-table-container .dash-cell div p {
    font-size: var(--dp-font-size) !important;
}

/* Company group header band */
.dp-v2 .company-group-first {
    background-color: var(--dp-muted) !important;
}

/* List tables (Disclosures, Portfolio): the prototype's list look. The table itself is the
   white card (1px border, 6px radius); no header or row rules, no striping, 16px cell sides.
   DataTables' info and pagination sit under the card on the page. Opt in with .dp-table-list. */
.dp-v2 .dp-table-list {
    --bs-table-striped-bg: transparent;
    --bs-table-hover-bg: color-mix(in srgb, var(--dp-fg) 3%, transparent);
    --bs-table-border-color: transparent;
    --bs-table-bg: transparent;
    /* separate, or the browser ignores the radius and draws the border square */
    border-collapse: separate !important;
    border-spacing: 0;
    margin-top: 0 !important;
    background: var(--dp-card);
    border: 1px solid var(--dp-border);
    border-radius: var(--dp-radius);
}

.dp-v2 .table-responsive:has(> .dataTables_wrapper > .dp-table-list),
.dp-v2 .table-responsive:has(> .dp-table-list) {
    border: 0;
    border-radius: 0;
    background: transparent;
}

.dp-v2 .dp-table-list tbody tr:last-child > td:first-child {
    border-bottom-left-radius: var(--dp-radius);
}

.dp-v2 .dp-table-list tbody tr:last-child > td:last-child {
    border-bottom-right-radius: var(--dp-radius);
}

.dp-v2 .dp-table-list thead th {
    box-sizing: border-box;
    height: 40px;
    font-size: var(--dp-font-size) !important;
    font-weight: 500 !important;
    white-space: nowrap;
    color: var(--dp-muted-fg) !important;
    background: transparent !important;
    border: 0 !important;
}

.dp-v2 .dp-table-list td {
    vertical-align: middle;
    white-space: nowrap;
    font-size: var(--dp-font-size);
    border: 0 !important;
}

/* Columns size to their content, as the prototype: lift the v1 5rem cell cap (static/css/tables.css). */
.dp-v2 .dp-table-list th,
.dp-v2 .dp-table-list td {
    max-width: none;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
}

/* Row actions sit flush in the row (no inherited .btn margin), so a row is 42px as the prototype. */
.dp-v2 .dp-table-list td .btn-icon {
    margin-top: 0;
    margin-bottom: 0;
}