/* Styles for the opt-in DataTable extensions:
   finkit-datatable-selection.js and finkit-datatable-detail-rows.js. */

/* ---------- row selection (default rowClass) ---------- */
table.dataTable tbody tr.fk-row-selected > td {
    background-color: var(--primary01, #f4f8ec) !important;
}

[data-theme-mode="dark"] table.dataTable tbody tr.fk-row-selected > td {
    background-color: var(--primary07) !important;
}

/* ---------- expandable detail rows ---------- */

/* rowToggle: the whole row expands, so show it is interactive. Direct-child selectors
   only — a descendant match would also hit the rows of any table nested in a detail row,
   making read-only content look clickable. */
table.dataTable.fk-row-clickable > tbody > tr {
    cursor: pointer;
}

table.dataTable.fk-row-clickable > tbody > tr.fk-detail-row {
    cursor: default;
}

.fk-detail-inner table.dataTable > tbody > tr {
    cursor: default;
}

.fk-detail-toggle {
    cursor: pointer;
    display: inline-block;
    transition: transform 0.15s ease;
    color: rgb(var(--primary-rgb, 143, 189, 86));
}

.fk-detail-toggle.open {
    transform: rotate(90deg);
}

/* Spans the full width of the host table, matching the outer grid. */
.fk-detail-inner {
    padding: 0.9rem 1.1rem 1rem;
    text-align: left;
    box-sizing: border-box;
    width: 100%;
}

/* Compact child-table metrics, matching the Expected EOD Swap child table. */
.fk-detail-inner table.dataTable {
    width: 100% !important;
    margin: 0;
}

.fk-detail-inner table.dataTable > thead > tr > th {
    font-weight: 600;
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
    border: 0;
}

.fk-detail-inner table.dataTable > tbody > tr > td {
    border: 0;
}

/* With scrolling on, DataTables keeps a duplicate thead inside the scroll body purely to
   sync column widths. It must stay at zero height — the padding rule above would
   otherwise inflate it into a second visible header band. */
.fk-detail-inner .dt-scroll-body table.dataTable > thead > tr > th {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

table.dataTable tbody tr.fk-row-open > td {
    background-color: var(--primary01, #f4f8ec) !important;
    font-weight: 600;
}

[data-theme-mode="dark"] table.dataTable tbody tr.fk-row-open > td {
    background-color: var(--primary07) !important;
}