/* Global redesign table layer. Keep legacy classes/JS contracts intact. */

/* Radius only on .own_aka_datatable_wrapper — never on .table-container (clips DataTables/fixed cols). */
.table-container,
.dark_theme .table-container {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin-bottom: 16px;
  overflow: visible !important;
  padding: 0 !important;
}

.own_aka_datatable_wrapper {
  background: var(--design-bg-surface);
  border: 1px solid var(--design-border);
  border-radius: var(--design-border-radius);
  display: block;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  width: 100%;
}

.wf_design_table_wrapper {
  border-radius: 8px;
}

.wf_design_table_wrapper > .text-center {
  color: var(--design-text-secondary);
  padding: 16px;
}

.dtfh-floatingparenthead {
  background: var(--design-bg-page);
  border-top-left-radius: var(--design-border-radius);
  border-top-right-radius: var(--design-border-radius);
  overflow: hidden !important;
}

.dark_theme .dtfh-floatingparenthead {
  background: var(--design-bg-muted);
}

/* Bootstrap .table / .table-bordered / .table-striped defaults — reset for wf_table */
.table.wf_table,
table.dataTable.wf_table,
.dataTables_scrollHead .table.wf_table,
.dtfh-floatingparenthead .table.wf_table {
  --bs-table-bg: var(--design-bg-surface);
  --bs-table-accent-bg: transparent;
  --bs-table-striped-bg: var(--design-bg-surface);
  --bs-table-striped-color: var(--design-text-primary);
  --bs-table-active-bg: var(--design-bg-subtle);
  --bs-table-active-color: var(--design-text-primary);
  --bs-table-hover-bg: var(--design-neutral-50);
  --bs-table-hover-color: var(--design-text-primary);
  border-color: var(--design-border);
  color: var(--design-text-primary);
  margin-bottom: 0;
  vertical-align: middle;
}

.table.wf_table > thead,
table.dataTable.wf_table > thead,
.dtfh-floatingparenthead .table.wf_table > thead {
  vertical-align: middle;
}

.table.wf_table > :not(:first-child),
table.dataTable.wf_table > :not(:first-child),
.dtfh-floatingparenthead .table.wf_table > :not(:first-child) {
  border-top: 0;
}

.table.wf_table > :not(caption) > * > *,
table.dataTable.wf_table > :not(caption) > * > *,
.dataTables_scrollHead .table.wf_table > :not(caption) > * > *,
.dtfh-floatingparenthead .table.wf_table > :not(caption) > * > * {
  border-color: var(--design-border);
  box-shadow: none;
}

.table.wf_table.table-bordered > :not(caption) > *,
.table.wf_table.table-bordered > :not(caption) > * > *,
table.dataTable.wf_table.table-bordered > :not(caption) > *,
table.dataTable.wf_table.table-bordered > :not(caption) > * > *,
.dtfh-floatingparenthead .table.wf_table.table-bordered > :not(caption) > *,
.dtfh-floatingparenthead
  .table.wf_table.table-bordered
  > :not(caption)
  > *
  > * {
  border-width: 0;
}

.table.wf_table.table-striped > tbody > tr:nth-of-type(odd) > *,
.table.wf_table.table-striped > tbody > tr:nth-of-type(even) > *,
table.dataTable.wf_table.table-striped > tbody > tr:nth-of-type(odd) > *,
table.dataTable.wf_table.table-striped > tbody > tr:nth-of-type(even) > * {
  --bs-table-accent-bg: transparent;
  box-shadow: none;
  color: inherit;
}

.dark_theme .table.wf_table,
.dark_theme table.dataTable.wf_table,
.dark_theme .dtfh-floatingparenthead .table.wf_table {
  --bs-table-hover-bg: var(--design-bg-subtle);
}

.table-container .wf_table {
  background: var(--design-bg-surface);
  border: 0;
  border-collapse: separate;
  border-spacing: 0;
  color: var(--design-text-primary);
  font-size: 12px;
  line-height: 14px;
  margin: 0 !important;
  min-width: 100%;
  table-layout: auto;
  width: max-content !important;
}

.clone-column-table-wrap > .wf_table,
.clone-column-head-table-wrap > .wf_table {
  background: var(--design-bg-surface);
  border: 0;
  border-collapse: separate;
  border-spacing: 0;
  color: var(--design-text-primary);
  font-size: 12px;
  line-height: 14px;
  margin: 0 !important;
  table-layout: auto;
  width: 100% !important;
}

.table-container .wf_table > :not(caption) > * > *,
.clone-column-table-wrap > .wf_table > :not(caption) > * > *,
.clone-column-head-table-wrap > .wf_table > :not(caption) > * > * {
  border-color: var(--design-border);
  box-shadow: none;
  color: inherit;
}

.table-container .wf_table thead,
.table-container .wf_table thead tr,
.clone-column-head-table-wrap > .wf_table thead,
.clone-column-head-table-wrap > .wf_table thead tr {
  background: var(--design-bg-page);
}

.table-container .wf_table thead th,
.clone-column-head-table-wrap > .wf_table thead th {
  background: var(--design-bg-page) !important;
  border-bottom: 1px solid var(--design-border);
  border-left: 0;
  border-right: 1px solid var(--design-border);
  border-top: 0;
  color: var(--design-text-primary);
  font-size: 11px;
  font-weight: 700;
  height: 32px;
  line-height: 14px;
  max-width: 320px;
  overflow: hidden;
  padding: 5px 8px;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap;
}

.table-container .wf_table thead th:last-child,
.clone-column-head-table-wrap > .wf_table thead th:last-child {
  border-right: 0;
}

.table-container .wf_table tbody td,
.clone-column-table-wrap > .wf_table tbody td,
.table-container .dataTables_scrollBody .wf_table tbody td {
  background: var(--design-bg-surface) !important;
  border-right: 1px solid var(--design-border);
  border-top: 1px solid var(--design-border);
  color: var(--design-text-primary);
  font-size: 12px;
  font-weight: 400;
  height: 40px;
  line-height: 14px;
  max-width: 320px;
  overflow: hidden;
  padding: 6px 8px;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap;
}

.table-container .wf_table tbody tr:first-child td,
.clone-column-table-wrap > .wf_table tbody tr:first-child td {
  border-top: 0;
}

.table-container .wf_table tbody td:last-child,
.clone-column-table-wrap > .wf_table tbody td:last-child {
  border-right: 0;
}

.table-container .wf_table.table-striped tbody tr:nth-of-type(odd),
.table-container .wf_table.table-striped tbody tr:nth-of-type(odd) > td,
.clone-column-table-wrap > .wf_table.table-striped tbody tr:nth-of-type(odd),
.clone-column-table-wrap
  > .wf_table.table-striped
  tbody
  tr:nth-of-type(odd)
  > td,
.table-container
  .dataTables_scrollBody
  .wf_table.table-striped
  tbody
  tr:nth-of-type(odd),
.table-container
  .dataTables_scrollBody
  .wf_table.table-striped
  tbody
  tr:nth-of-type(odd)
  > td {
  background: var(--design-bg-surface) !important;
  box-shadow: none !important;
}

.table-container .wf_table tbody tr:hover > td,
.clone-column-table-wrap > .wf_table tbody tr:hover > td {
  background: var(--design-neutral-50) !important;
}

.table-container .wf_table .table_empty_row td {
  color: var(--design-text-secondary);
  height: 64px;
  text-align: center;
}

.table-container .wf_table .rounded-circle.h-15px.w-15px,
.clone-column-table-wrap > .wf_table .rounded-circle.h-15px.w-15px {
  border-radius: 4px !important;
  height: 16px !important;
  width: 16px !important;
}

/* Sort icons — inner .wf_table_th_sort + view/icons/new-design/actions/ */
.table-container .wf_table th.sorting,
.table-container .wf_table th.sorting_asc,
.table-container .wf_table th.sorting_desc,
.clone-column-head-table-wrap > .wf_table th.sorting,
.clone-column-head-table-wrap > .wf_table th.sorting_asc,
.clone-column-head-table-wrap > .wf_table th.sorting_desc,
.dataTables_scrollHead .wf_table th.sorting,
.dataTables_scrollHead .wf_table th.sorting_asc,
.dataTables_scrollHead .wf_table th.sorting_desc,
.dtfh-floatingparenthead .wf_table th.sorting,
.dtfh-floatingparenthead .wf_table th.sorting_asc,
.dtfh-floatingparenthead .wf_table th.sorting_desc,
table.dataTable.wf_table thead > tr > th.sorting,
table.dataTable.wf_table thead > tr > th.sorting_asc,
table.dataTable.wf_table thead > tr > th.sorting_desc {
  cursor: pointer;
}

.wf_table th.sorting .wf_table_th_sort,
.wf_table th.sorting_asc .wf_table_th_sort,
.wf_table th.sorting_desc .wf_table_th_sort {
  align-items: center;
  display: inline-flex;
  gap: 5px;
  max-width: 100%;
  vertical-align: middle;
  padding: 4px 8px;
  border-radius: var(--design-border-radius);
}

.wf_table th.sorting .wf_table_th_sort:hover {
  background: var(--design-bg-subtle);
}

.dark_theme .wf_table th.sorting .wf_table_th_sort:hover {
  background: var(--design-neutral-500);
}

.wf_table th.text-center.sorting .wf_table_th_sort,
.wf_table th.text-center.sorting_asc .wf_table_th_sort,
.wf_table th.text-center.sorting_desc .wf_table_th_sort {
  justify-content: center;
}

.table-container .wf_table th.sorting::before,
.table-container .wf_table th.sorting::after,
.table-container .wf_table th.sorting_asc::before,
.table-container .wf_table th.sorting_asc::after,
.table-container .wf_table th.sorting_desc::before,
.table-container .wf_table th.sorting_desc::after,
.clone-column-head-table-wrap > .wf_table th.sorting::before,
.clone-column-head-table-wrap > .wf_table th.sorting::after,
.clone-column-head-table-wrap > .wf_table th.sorting_asc::before,
.clone-column-head-table-wrap > .wf_table th.sorting_asc::after,
.clone-column-head-table-wrap > .wf_table th.sorting_desc::before,
.clone-column-head-table-wrap > .wf_table th.sorting_desc::after,
.dataTables_scrollHead .wf_table th.sorting::before,
.dataTables_scrollHead .wf_table th.sorting::after,
.dataTables_scrollHead .wf_table th.sorting_asc::before,
.dataTables_scrollHead .wf_table th.sorting_asc::after,
.dataTables_scrollHead .wf_table th.sorting_desc::before,
.dataTables_scrollHead .wf_table th.sorting_desc::after,
.dtfh-floatingparenthead .wf_table th.sorting::before,
.dtfh-floatingparenthead .wf_table th.sorting::after,
.dtfh-floatingparenthead .wf_table th.sorting_asc::before,
.dtfh-floatingparenthead .wf_table th.sorting_asc::after,
.dtfh-floatingparenthead .wf_table th.sorting_desc::before,
.dtfh-floatingparenthead .wf_table th.sorting_desc::after,
table.dataTable.wf_table thead .sorting::before,
table.dataTable.wf_table thead .sorting::after,
table.dataTable.wf_table thead .sorting_asc::before,
table.dataTable.wf_table thead .sorting_asc::after,
table.dataTable.wf_table thead .sorting_desc::before,
table.dataTable.wf_table thead .sorting_desc::after,
table.dataTable.wf_table thead > tr > th.sorting::before,
table.dataTable.wf_table thead > tr > th.sorting::after,
table.dataTable.wf_table thead > tr > th.sorting_asc::before,
table.dataTable.wf_table thead > tr > th.sorting_asc::after,
table.dataTable.wf_table thead > tr > th.sorting_desc::before,
table.dataTable.wf_table thead > tr > th.sorting_desc::after {
  background: none !important;
  border: none !important;
  content: none !important;
  display: none !important;
  height: 0 !important;
  opacity: 0 !important;
  width: 0 !important;
}

table.dataTable.wf_table thead > tr > th.sorting,
table.dataTable.wf_table thead > tr > th.sorting_asc,
table.dataTable.wf_table thead > tr > th.sorting_desc {
  padding-right: 8px !important;
}

.wf_table th.sorting .wf_table_th_sort::after,
.wf_table th.sorting_asc .wf_table_th_sort::after,
.wf_table th.sorting_desc .wf_table_th_sort::after {
  background-color: currentColor !important;
  background-image: none !important;
  border: none !important;
  content: "" !important;
  display: block !important;
  flex-shrink: 0;
  font-size: 0 !important;
  height: 18px !important;
  line-height: 0 !important;
  margin: 0 !important;
  opacity: 1 !important;
  width: 18px !important;
}

.wf_table
  th.sorting:not(.sorting_asc):not(.sorting_desc)
  .wf_table_th_sort::after {
  color: var(--design-text-muted);
  mask: url("/view/icons/new-design/actions/sort.svg") center / contain
    no-repeat;
  -webkit-mask: url("/view/icons/new-design/actions/sort.svg") center / contain
    no-repeat;
}

.wf_table th.sorting_asc .wf_table_th_sort::after {
  color: var(--design-text-primary);
  mask: url("/view/icons/new-design/actions/arrow-top.svg") center / contain
    no-repeat;
  -webkit-mask: url("/view/icons/new-design/actions/arrow-top.svg") center /
    contain no-repeat;
}

.wf_table th.sorting_desc .wf_table_th_sort::after {
  color: var(--design-text-primary);
  mask: url("/view/icons/new-design/actions/arrow-bottom.svg") center / contain
    no-repeat;
  -webkit-mask: url("/view/icons/new-design/actions/arrow-bottom.svg") center /
    contain no-repeat;
}

.dataTables_scrollBody .wf_table thead th.sorting::before,
.dataTables_scrollBody .wf_table thead th.sorting::after,
.dataTables_scrollBody .wf_table thead th.sorting_asc::before,
.dataTables_scrollBody .wf_table thead th.sorting_asc::after,
.dataTables_scrollBody .wf_table thead th.sorting_desc::before,
.dataTables_scrollBody .wf_table thead th.sorting_desc::after,
.dataTables_scrollBody .wf_table thead th .wf_table_th_sort::after,
.dataTables_scrollBody table.dataTable thead .sorting::before,
.dataTables_scrollBody table.dataTable thead .sorting::after,
.dataTables_scrollBody table.dataTable thead .sorting_asc::before,
.dataTables_scrollBody table.dataTable thead .sorting_asc::after,
.dataTables_scrollBody table.dataTable thead .sorting_desc::before,
.dataTables_scrollBody table.dataTable thead .sorting_desc::after,
.dataTables_scrollBody table.dataTable thead .wf_table_th_sort::after {
  content: none !important;
  display: none !important;
}

.table-container .wf_table .td-actions {
  align-items: center;
  display: flex;
  flex-direction: row;
  gap: 4px;
  justify-content: flex-end;
}

.table-container .wf_table .td-actions a.icon {
  align-items: center;
  background: transparent;
  border-radius: var(--design-border-radius);
  color: var(--design-text-secondary);
  display: inline-flex;
  height: 24px;
  justify-content: center;
  margin: 0;
  width: 24px;
}

.table-container .wf_table .td-actions a.icon i {
  font-size: 14px;
  line-height: 1;
}

.table.wf_table .td-actions a.icon .design-icon {
  display: block;
  line-height: 0;
}

/* wf_table action icons — flat buttons (replaces legacy main.css colored fills) */
.table.wf_table .td-actions a.icon.blue,
.table.wf_table .td-actions a.icon.red,
.table.wf_table .td-actions a.icon.green {
  background: transparent !important;
  color: var(--design-text-secondary);
}

.table.wf_table .td-actions a.icon.blue:hover,
.table.wf_table .td-actions a.icon.blue:focus-visible,
.table.wf_table .td-actions a.icon.green:hover,
.table.wf_table .td-actions a.icon.green:focus-visible {
  background: var(--design-bg-subtle) !important;
  color: var(--design-text-primary);
}

.dark_theme .table.wf_table .td-actions a.icon.blue:hover,
.dark_theme .table.wf_table .td-actions a.icon.blue:focus-visible,
.dark_theme .table.wf_table .td-actions a.icon.green:hover,
.dark_theme .table.wf_table .td-actions a.icon.green:focus-visible {
  background: var(--design-neutral-500) !important;
}

.table.wf_table .td-actions a.icon.red:hover,
.table.wf_table .td-actions a.icon.red:focus-visible {
  background: var(--design-danger-bg) !important;
  color: var(--design-danger);
}

/* Leads title column — mail / archive markers */
.table[data-type="crm_leads"] .wf_leads_title_cell {
  align-items: center;
  color: inherit;
  display: inline-flex;
  gap: 4px;
  max-width: 100%;
  min-width: 0;
  vertical-align: middle;
}

.table[data-type="crm_leads"] .wf_crm_lead_table_cell_name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.table[data-type="crm_leads"] .wf_leads_title_icon {
  color: currentColor;
  flex-shrink: 0;
  line-height: 0;
}

.table-container .wf_table input[type="text"] {
  background: transparent;
  border: 0;
  color: var(--design-text-primary);
  font: inherit;
  min-height: 24px;
  padding: 0;
}

.dark_theme .own_aka_datatable_wrapper {
  background: var(--design-bg-surface);
  border-color: var(--design-border);
}

.dark_theme .table-container .wf_table thead,
.dark_theme .table-container .wf_table thead tr,
.dark_theme .clone-column-head-table-wrap > .wf_table thead,
.dark_theme .clone-column-head-table-wrap > .wf_table thead tr,
.dark_theme .table-container .wf_table thead th,
.dark_theme .clone-column-head-table-wrap > .wf_table thead th {
  background: var(--design-bg-muted) !important;
}

.dark_theme .table-container .wf_table tbody tr:hover > td,
.dark_theme .clone-column-table-wrap > .wf_table tbody tr:hover > td {
  background: var(--design-bg-subtle) !important;
}

.table-container .dataTables_wrapper {
  width: 100%;
}

.table-container .dataTables_scrollBody {
  -webkit-overflow-scrolling: touch;
}

/* DataTables clones header outside .table-container — keep new-design thead look */
.dataTables_scrollHead .wf_table,
.dtfh-floatingparenthead .wf_table,
table.dataTable.wf_table {
  background: var(--design-bg-surface);
  border: 0;
  color: var(--design-text-primary);
}

.dataTables_scrollHead .wf_table thead,
.dtfh-floatingparenthead .wf_table thead {
  background: var(--design-bg-page);
}

.dataTables_scrollHead .wf_table thead tr,
.dtfh-floatingparenthead .wf_table thead tr {
  background: inherit;
}

.dataTables_scrollHead .wf_table thead th,
.dtfh-floatingparenthead .wf_table thead th,
table.dataTable.wf_table thead th,
table.dataTable.wf_table thead th.dtfc-fixed-left {
  background: var(--design-bg-page) !important;
  border-bottom: 1px solid var(--design-border);
  border-left: 0;
  border-top: 0;
  box-shadow: none;
  color: var(--design-text-primary);
  font-size: 11px;
  font-weight: 700;
  height: 32px;
  line-height: 14px;
  max-width: 320px;
  overflow: hidden;
  padding: 5px 8px;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap;
}

.dataTables_scrollHead .wf_table thead th:last-child,
.dtfh-floatingparenthead .wf_table thead th:last-child,
table.dataTable.wf_table thead th:last-child {
  border-right: 0;
}

.table-container .dataTables_scrollBody .dtfc-fixed-left,
.dataTables_scrollBody .dtfc-fixed-left,
.table .dtfc-fixed-left,
table.dataTable.wf_table tbody td.dtfc-fixed-left,
.dataTable.table-striped tbody tr:nth-of-type(odd) > td.dtfc-fixed-left,
.dataTable.table-striped tbody tr:nth-of-type(even) > td.dtfc-fixed-left {
  background: var(--design-bg-surface) !important;
  box-shadow: none !important;
}

.dtfh-floatingparenthead table.dataTable thead th.dtfc-fixed-left {
  box-shadow: none;
}

table.dataTable.wf_table tbody td,
.dataTables_scrollBody table.dataTable.wf_table tbody td {
  background: var(--design-bg-surface) !important;
}

table.dataTable.wf_table.table-striped tbody tr:nth-of-type(odd),
table.dataTable.wf_table.table-striped tbody tr:nth-of-type(odd) > td,
.dataTables_scrollBody
  table.dataTable.wf_table.table-striped
  tbody
  tr:nth-of-type(odd),
.dataTables_scrollBody
  table.dataTable.wf_table.table-striped
  tbody
  tr:nth-of-type(odd)
  > td {
  background: var(--design-bg-surface) !important;
  box-shadow: none !important;
}

table.dataTable.wf_table tbody tr:hover > td,
.dataTables_scrollBody table.dataTable.wf_table tbody tr:hover > td {
  background: var(--design-neutral-50) !important;
}

/* Reusable base table from Figma node 2249:1423. */
.table-container .wf_design_table,
table.dataTable.wf_design_table,
.dataTables_scrollHead .wf_design_table,
.dtfh-floatingparenthead .wf_design_table {
  background: var(--design-bg-surface);
  border-collapse: separate;
  border-spacing: 0;
  color: var(--design-text-primary);
  font-size: 12px;
  line-height: 14px;
  min-width: 100%;
  table-layout: fixed;
  width: max-content !important;
}

.table-container .wf_design_table thead,
.table-container .wf_design_table thead tr,
.dataTables_scrollHead .wf_design_table thead,
.dataTables_scrollHead .wf_design_table thead tr,
.dtfh-floatingparenthead .wf_design_table thead,
.dtfh-floatingparenthead .wf_design_table thead tr {
  background: var(--design-bg-page);
}

.table-container .wf_design_table thead th,
table.dataTable.wf_table.wf_design_table thead th,
table.dataTable.wf_table.wf_design_table thead th.dtfc-fixed-left,
.dataTables_scrollHead .table.wf_table.wf_design_table thead th,
.dataTables_scrollHead .table.wf_table.wf_design_table thead th.dtfc-fixed-left,
.dtfh-floatingparenthead .table.wf_table.wf_design_table thead th,
.dtfh-floatingparenthead
  .table.wf_table.wf_design_table
  thead
  th.dtfc-fixed-left {
  background: var(--design-bg-page) !important;
  border-bottom: 1px solid var(--design-border);
  border-left: 0;
  border-right: 1px solid var(--design-border);
  border-top: 0;
  box-sizing: border-box;
  color: var(--design-text-primary);
  font-size: 11px;
  font-weight: 700;
  height: 32px;
  line-height: 14px;
  padding: 5px 8px;
  text-align: center;
}

.table-container .wf_design_table thead th:last-child,
table.dataTable.wf_table.wf_design_table thead th:last-child,
.dataTables_scrollHead .table.wf_table.wf_design_table thead th:last-child,
.dtfh-floatingparenthead .table.wf_table.wf_design_table thead th:last-child {
  border-right: 0;
}

.table-container .wf_design_table tbody td,
table.dataTable.wf_table.wf_design_table tbody td,
table.dataTable.wf_table.wf_design_table tbody td.dtfc-fixed-left,
.dataTables_scrollBody table.dataTable.wf_table.wf_design_table tbody td,
.dataTables_scrollBody
  table.dataTable.wf_table.wf_design_table
  tbody
  td.dtfc-fixed-left {
  background: var(--design-bg-surface) !important;
  border-right: 1px solid var(--design-border);
  border-top: 1px solid var(--design-border);
  box-sizing: border-box;
  color: var(--design-text-primary);
  font-size: 12px;
  font-weight: 400;
  height: 32px;
  line-height: 14px;
  padding: 5px 8px;
  text-align: center;
}

.table-container .wf_design_table tbody tr:first-child td,
table.dataTable.wf_table.wf_design_table tbody tr:first-child td,
.dataTables_scrollBody
  table.dataTable.wf_table.wf_design_table
  tbody
  tr:first-child
  td {
  border-top: 0;
}

.table-container .wf_design_table tbody td:last-child,
table.dataTable.wf_table.wf_design_table tbody td:last-child,
.dataTables_scrollBody
  table.dataTable.wf_table.wf_design_table
  tbody
  td:last-child {
  border-right: 0;
}

table.dataTable.wf_table.wf_design_table tbody tr:hover > td,
.dataTables_scrollBody
  table.dataTable.wf_table.wf_design_table
  tbody
  tr:hover
  > td,
table.dataTable.wf_table.wf_design_table tbody tr:hover > td.dtfc-fixed-left,
.dataTables_scrollBody
  table.dataTable.wf_table.wf_design_table
  tbody
  tr:hover
  > td.dtfc-fixed-left {
  background: var(--design-neutral-50) !important;
}

.wf_design_table .wf_design_table__number,
.wf_design_table tbody td:first-child {
  width: 44px;
}

.wf_design_table .wf_design_table__actions,
.wf_design_table .wf_datatable_no_sort {
  width: 72px;
}

.table-container .table.wf_table.wf_design_table thead th {
  border-bottom-color: var(--design-border) !important;
  border-bottom-style: solid !important;
  border-bottom-width: 1px !important;
  border-right-color: var(--design-border) !important;
  border-right-style: solid !important;
  border-right-width: 1px !important;
}

.table-container .table.wf_table.wf_design_table tbody td {
  border-right-color: var(--design-border) !important;
  border-right-style: solid !important;
  border-right-width: 1px !important;
  border-top-color: var(--design-border) !important;
  border-top-style: solid !important;
  border-top-width: 1px !important;
}

.table-container .table.wf_table.wf_design_table tbody tr:first-child td {
  border-top-width: 0 !important;
}

.table-container .table.wf_table.wf_design_table thead th:last-child,
.table-container .table.wf_table.wf_design_table tbody td:last-child {
  border-right-width: 0 !important;
}

#wfUserRolesTableWrapper {
  overflow: visible;
}

#wfUserRolesTable thead th {
  position: sticky;
  top: var(--wf-user-roles-sticky-top, 0);
  z-index: 3;
}

.table-container .wf_design_table .td-actions,
.wf_design_table .td-actions {
  gap: 8px;
  justify-content: center;
}

.table-container .wf_design_table .td-actions a.icon,
.wf_design_table .td-actions a.icon {
  align-items: center;
  background: transparent !important;
  border-radius: 8px;
  color: var(--design-text-primary);
  display: inline-flex;
  height: 24px;
  justify-content: center;
  margin: 0;
  transition:
    background-color 0.2s ease,
    color 0.2s ease;
  width: 24px;
}

.wf_design_table .td-actions a.icon:hover,
.wf_design_table .td-actions a.icon:focus-visible {
  background: var(--design-bg-subtle) !important;
  color: var(--design-primary);
}

.wf_design_table .td-actions a.icon.red:hover,
.wf_design_table .td-actions a.icon.red:focus-visible {
  background: var(--design-danger-bg) !important;
  color: var(--design-danger);
}

.wf_design_table .td-actions a.icon .design-icon {
  display: block;
  height: 20px;
  line-height: 0;
  width: 20px;
}

.wf_design_table .td-actions a.icon i {
  display: block;
  font-size: 0;
  height: 20px;
  line-height: 0;
  width: 20px;
}

.wf_design_table .td-actions a.icon i::before {
  background: currentColor;
  content: "";
  display: block;
  height: 20px;
  width: 20px;
}

.wf_design_table .td-actions a.icon i.icon-edit-2::before {
  mask: url("/view/icons/new-design/actions/edit.svg") center / contain
    no-repeat;
  -webkit-mask: url("/view/icons/new-design/actions/edit.svg") center / contain
    no-repeat;
}

.wf_design_table .td-actions a.icon i.icon-x::before {
  mask: url("/view/icons/new-design/actions/trash.svg") center / contain
    no-repeat;
  -webkit-mask: url("/view/icons/new-design/actions/trash.svg") center / contain
    no-repeat;
}

.dark_theme .wf_design_table .td-actions a.icon:hover,
.dark_theme .wf_design_table .td-actions a.icon:focus-visible {
  background: var(--design-bg-subtle) !important;
}

.dark_theme .dataTables_scrollHead .wf_table thead,
.dark_theme .dtfh-floatingparenthead .wf_table thead,
.dark_theme .dataTables_scrollHead .wf_table thead tr,
.dark_theme .dtfh-floatingparenthead .wf_table thead tr,
.dark_theme .dataTables_scrollHead .wf_table thead th,
.dark_theme .dtfh-floatingparenthead .wf_table thead th,
.dark_theme table.dataTable.wf_table thead th,
.dark_theme table.dataTable.wf_table thead th.dtfc-fixed-left,
.dark_theme .dtfh-floatingparenthead table.dataTable thead th,
.dark_theme .dtfh-floatingparenthead table.dataTable thead th.dtfc-fixed-left {
  background: var(--design-bg-muted) !important;
}

.dark_theme table.dataTable.wf_table tbody tr:hover > td,
.dark_theme
  .dataTables_scrollBody
  table.dataTable.wf_table
  tbody
  tr:hover
  > td {
  background: var(--design-bg-subtle) !important;
}

.dark_theme table.dataTable.wf_table.wf_design_table tbody tr:hover > td,
.dark_theme
  .dataTables_scrollBody
  table.dataTable.wf_table.wf_design_table
  tbody
  tr:hover
  > td,
.dark_theme
  table.dataTable.wf_table.wf_design_table
  tbody
  tr:hover
  > td.dtfc-fixed-left,
.dark_theme
  .dataTables_scrollBody
  table.dataTable.wf_table.wf_design_table
  tbody
  tr:hover
  > td.dtfc-fixed-left {
  background: var(--design-bg-subtle) !important;
}

.dark_theme .dataTables_scrollBody .dtfc-fixed-left {
  background: var(--design-bg-surface) !important;
  box-shadow: none !important;
}

/* Override legacy dark-theme table borders (main.css uses rgba white). */
.dark_theme .own_aka_datatable_wrapper,
.dark_theme .table-container .wf_table.table-bordered {
  border-color: var(--design-border) !important;
}

.dark_theme .table-container .wf_table > :not(caption) > * > *,
.dark_theme .clone-column-table-wrap > .wf_table > :not(caption) > * > *,
.dark_theme .clone-column-head-table-wrap > .wf_table > :not(caption) > * > *,
.dark_theme .dataTables_scrollHead .wf_table > :not(caption) > * > *,
.dark_theme .dtfh-floatingparenthead .wf_table > :not(caption) > * > *,
.dark_theme table.dataTable.wf_table > :not(caption) > * > * {
  border-color: var(--design-border) !important;
}

.dark_theme .table-container .dataTables_scrollBody .dtfc-fixed-left,
.dark_theme .dataTables_scrollBody .dtfc-fixed-left,
.dark_theme .table .dtfc-fixed-left,
.dark_theme table.dataTable.wf_table tbody td.dtfc-fixed-left,
.dark_theme
  .dataTable.table-striped
  tbody
  tr:nth-of-type(odd)
  > td.dtfc-fixed-left,
.dark_theme
  .dataTable.table-striped
  tbody
  tr:nth-of-type(even)
  > td.dtfc-fixed-left {
  background: var(--design-bg-surface) !important;
  box-shadow: none !important;
}

.dark_theme .table-container .wf_table thead th.dtfc-fixed-left,
.dark_theme .dataTables_scrollHead .wf_table thead th.dtfc-fixed-left,
.dark_theme .dtfh-floatingparenthead table.dataTable thead th.dtfc-fixed-left {
  background: var(--design-bg-muted) !important;
  box-shadow: none !important;
}

/* Div-based tables inside the reusable TableWrapper. */
.wf_design_table_wrapper {
  --wf-design-table-border: var(--design-border);
  --wf-design-table-header-bg: var(--design-bg-page);
  --wf-design-table-hover-bg: var(--design-neutral-50);
  --wf-design-table-row-bg: var(--design-bg-surface);
}

.wf_design_table_wrapper .wf_table_custom {
  background: var(--wf-design-table-row-bg);
  color: var(--design-text-primary);
  float: left;
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 12px;
  line-height: 16px;
  margin: 0;
  width: max-content;
}

.wf_design_table_wrapper .wf_table_custom .th,
.wf_design_table_wrapper .wf_table_custom .td {
  border-color: var(--wf-design-table-border);
  border-left: 0;
  border-right: 1px solid var(--wf-design-table-border);
  border-top: 1px solid var(--wf-design-table-border);
  border-bottom: 0;
  box-sizing: border-box;
  flex-shrink: 0;
  overflow: hidden;
}

.wf_design_table_wrapper .wf_table_custom .thead .th {
  align-items: center;
  background: var(--wf-design-table-header-bg);
  border-top: 0;
  color: var(--design-text-primary);
  display: flex;
  font-size: 11px;
  font-weight: 700;
  height: 32px;
  justify-content: center;
  line-height: 14px;
  padding: 5px 8px;
  text-align: center;
}

.wf_design_table_wrapper .wf_table_custom .tbody .tr:first-child .td {
  border-top: 0;
}

.wf_design_table_wrapper .wf_table_custom .tr .th:last-child,
.wf_design_table_wrapper .wf_table_custom .tr .td:last-child {
  border-right: 0;
}

.wf_design_table_wrapper .wf_table_custom .td {
  align-items: center;
  background: var(--wf-design-table-row-bg);
  color: var(--design-text-primary);
  display: flex;
  font-size: 12px;
  justify-content: center;
  line-height: 16px;
  min-height: 40px;
  padding: 8px;
}

.wf_design_table_wrapper .wf_table_custom .tbody .tr:hover .td {
  background: var(--wf-design-table-hover-bg);
}

.wf_design_table_wrapper .wf_table_custom .tbody {
  padding-bottom: 1px;
}

.dark_theme .wf_design_table_wrapper {
  --wf-design-table-border: var(--design-border);
  --wf-design-table-header-bg: var(--design-bg-muted);
  --wf-design-table-hover-bg: var(--design-bg-subtle);
  --wf-design-table-row-bg: var(--design-bg-surface);

  background: var(--design-bg-surface);
  border-color: var(--wf-design-table-border);
}
