/* Dionis theme overrides for Tabulator — light + dark via CSS variables */

.dionis-table-host {
  width: 100%;
  min-width: 0;
  color: var(--text, var(--c-black));
}

.dionis-table-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  justify-content: flex-end;
  margin-bottom: 0.75rem;
}

/* Lead action stays left; trailing actions (export / migrate) stay right */
.dionis-table-toolbar > .btn:first-child:not(.dionis-table-export) {
  margin-right: auto;
}

.dionis-table-toolbar-grow {
  flex: 1 1 auto;
  min-width: 0;
}

.dionis-table-host .tabulator {
  background: var(--surface, transparent);
  border: 1px solid var(--line, color-mix(in srgb, currentColor 16%, transparent));
  border-radius: 0.5rem;
  font-size: inherit;
  font-family: inherit;
  color: var(--text, inherit);
  overflow: hidden;
}

.dionis-table-host .tabulator .tabulator-header {
  overflow: visible;
}

/* Wider hit target — default 5px feels unreliable next to header filters */
.dionis-table-host .tabulator .tabulator-col .tabulator-col-resize-handle {
  width: 10px;
  margin-left: -5px;
  right: -5px;
  z-index: 20;
}

.dionis-table-host .tabulator .tabulator-tableholder {
  overflow-x: auto;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
}

.dionis-table-host .tabulator .tabulator-tableholder,
.dionis-table-host .tabulator .tabulator-table {
  background: transparent;
  color: inherit;
}

.dionis-table-host .tabulator .tabulator-header {
  background: color-mix(in srgb, var(--text, currentColor) 6%, var(--surface, transparent));
  border-bottom: 1px solid var(--line, color-mix(in srgb, currentColor 14%, transparent));
  color: var(--muted, var(--text, inherit));
  font-weight: 600;
}

.dionis-table-host .tabulator .tabulator-header .tabulator-col {
  background: transparent;
  border-right: 1px solid var(--line, color-mix(in srgb, currentColor 10%, transparent));
  color: inherit;
}

.dionis-table-host .tabulator .tabulator-header .tabulator-col .tabulator-col-content {
  color: inherit;
}

.dionis-table-host .tabulator .tabulator-header .tabulator-col-content {
  padding: 0.55rem 0.65rem;
}

.dionis-table-host .tabulator .tabulator-header .tabulator-col .tabulator-col-title,
.dionis-table-host .tabulator .tabulator-header .tabulator-col .tabulator-col-sorter {
  color: inherit;
}

/*
 * Vendor Tabulator simple theme uses a hard-coded light hover (#e6e6e6).
 * On dark tables that washes out light header text — keep hover theme-aware.
 */
.dionis-table-host .tabulator .tabulator-header .tabulator-col.tabulator-col-sorter-element:hover,
.dionis-table-host .tabulator .tabulator-header .tabulator-col:hover {
  background: color-mix(in srgb, var(--text, currentColor) 12%, var(--surface, transparent)) !important;
  color: var(--text, inherit) !important;
}

.dionis-table-host .tabulator .tabulator-header .tabulator-col.tabulator-col-sorter-element:hover .tabulator-col-content,
.dionis-table-host .tabulator .tabulator-header .tabulator-col:hover .tabulator-col-content,
.dionis-table-host .tabulator .tabulator-header .tabulator-col.tabulator-col-sorter-element:hover .tabulator-col-title,
.dionis-table-host .tabulator .tabulator-header .tabulator-col:hover .tabulator-col-title,
.dionis-table-host .tabulator .tabulator-header .tabulator-col.tabulator-col-sorter-element:hover .tabulator-col-sorter,
.dionis-table-host .tabulator .tabulator-header .tabulator-col:hover .tabulator-col-sorter {
  color: inherit !important;
}

/* Sort arrows: use muted text instead of hardcoded #666 */
.dionis-table-host .tabulator .tabulator-header .tabulator-col .tabulator-col-sorter .tabulator-arrow {
  border-bottom-color: var(--muted, var(--c-gray-66));
}

.dionis-table-host .tabulator .tabulator-header .tabulator-col.tabulator-col-sorter-element:hover .tabulator-col-sorter .tabulator-arrow,
.dionis-table-host .tabulator .tabulator-header .tabulator-col[aria-sort="ascending"] .tabulator-col-sorter .tabulator-arrow,
.dionis-table-host .tabulator .tabulator-header .tabulator-col[aria-sort="descending"] .tabulator-col-sorter .tabulator-arrow {
  border-bottom-color: var(--text, var(--c-gray-55));
  border-top-color: var(--text, var(--c-gray-55));
}

/* Custom checkboxes so dark tables don’t get OS “light” white faces */
/* Row-header / frozen: always follow host --surface (Tabulator defaults to #e6e6e6). */
.dionis-table-host .tabulator-row .tabulator-cell.tabulator-row-header,
.dionis-table-host .tabulator-header .tabulator-col.tabulator-row-header,
.dionis-table-host .tabulator-row .tabulator-cell.tabulator-frozen,
.dionis-table-host .tabulator-header .tabulator-col.tabulator-frozen {
  background: var(--surface, transparent) !important;
  color: var(--text, inherit);
  border-right-color: var(--line, color-mix(in srgb, currentColor 12%, transparent));
}

.dionis-table-host input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 1rem !important;
  min-width: 1rem !important;
  max-width: 1rem !important;
  height: 1rem !important;
  min-height: 1rem !important;
  margin: 0 auto;
  padding: 0 !important;
  flex-shrink: 0;
  display: block;
  vertical-align: middle;
  box-sizing: border-box;
  border: 1.5px solid color-mix(in srgb, var(--text, currentColor) 70%, transparent);
  border-radius: 3px !important;
  background-color: transparent;
  color: var(--text, currentColor);
  cursor: pointer;
}
.dionis-table-host input[type="checkbox"]:hover {
  border-color: var(--text, currentColor);
}
.dionis-table-host input[type="checkbox"]:focus-visible {
  outline: 2px solid var(--mint, var(--accent, var(--c-mint)));
  outline-offset: 2px;
}
.dionis-table-host input[type="checkbox"]:checked {
  border-color: var(--mint, var(--accent, var(--c-mint)));
  background-color: var(--mint, var(--accent, var(--c-mint)));
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='M3.5 8.5 6.5 11.5 12.5 4.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0.85rem 0.85rem;
}
.dionis-table-host input[type="checkbox"]:indeterminate {
  border-color: var(--mint, var(--accent, var(--c-mint)));
  background-color: var(--mint, var(--accent, var(--c-mint)));
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' d='M3.5 8h9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0.85rem 0.85rem;
}

.dionis-table-host .tabulator-row {
  background: transparent;
  border-bottom: 1px solid var(--line, color-mix(in srgb, currentColor 10%, transparent));
  color: var(--text, inherit);
  min-height: 2.5rem;
  transition:
    background 180ms ease,
    box-shadow 180ms ease,
    transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.dionis-table-host .tabulator-row.tabulator-row-even {
  background: color-mix(in srgb, var(--text, currentColor) 3%, transparent);
}

.dionis-table-host .tabulator-row .tabulator-cell {
  border-right: 0;
  color: inherit;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Keep action / control cells from forcing a single clipped line */
.dionis-table-host .tabulator-row .tabulator-cell:has(.btn),
.dionis-table-host .tabulator-row .tabulator-cell:has(input),
.dionis-table-host .tabulator-row .tabulator-cell:has(textarea),
.dionis-table-host .tabulator-row .tabulator-cell:has(select),
.dionis-table-host .tabulator-row .tabulator-cell.member-table-actions,
.dionis-table-host .tabulator-row .tabulator-cell.dionis-cell-no-ellipsis {
  white-space: normal;
  text-overflow: clip;
  overflow: visible;
}

.dionis-table-host .tabulator-row.tabulator-selectable:hover {
  background: color-mix(in srgb, var(--mint, var(--c-mint)) 10%, transparent);
  box-shadow: inset 3px 0 0 var(--mint, var(--c-mint));
  color: var(--text, inherit);
}

.dionis-table-host .tabulator-row.tabulator-selected,
.dionis-table-host .tabulator-row.active-row {
  background: color-mix(in srgb, var(--mint, var(--c-mint)) 16%, transparent);
  box-shadow: inset 3px 0 0 var(--mint, var(--c-mint));
  color: var(--text, inherit);
}

.dionis-table-host .tabulator-row.tabulator-selected:hover {
  background: color-mix(in srgb, var(--mint, var(--c-mint)) 22%, transparent);
  color: var(--text, inherit);
}

.dionis-table-host .tabulator-cell {
  padding: 0.5rem 0.65rem;
}

.dionis-table-host .tabulator-footer {
  background: color-mix(in srgb, var(--text, currentColor) 4%, var(--surface, transparent));
  border-top: 1px solid var(--line, color-mix(in srgb, currentColor 12%, transparent));
  color: var(--text, inherit);
}

.dionis-table-host .tabulator-footer .tabulator-footer-contents {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 0.75rem;
  width: 100%;
  box-sizing: border-box;
}

.dionis-table-host .tabulator-footer .tabulator-page-counter {
  flex: 1 1 12rem;
  min-width: 0;
  color: inherit;
}

.dionis-table-host .tabulator-footer .tabulator-footer-contents,
.dionis-table-host .tabulator-footer .tabulator-paginator,
.dionis-table-host .tabulator-footer .tabulator-page-counter,
.dionis-table-host .tabulator-footer label {
  color: inherit;
}

.dionis-table-host .tabulator-page {
  border-radius: 0;
  border: 1px solid var(--line, color-mix(in srgb, currentColor 20%, transparent));
  background: transparent;
  color: var(--text, inherit);
  min-width: 2rem;
  transition: background 160ms ease, border-color 160ms ease, color 160ms ease;
}

.dionis-table-host .tabulator-page:not(.disabled):hover {
  border-color: var(--mint, var(--c-mint));
  background: color-mix(in srgb, var(--mint, var(--c-mint)) 10%, transparent);
  color: var(--text, inherit);
}

.dionis-table-host .tabulator-page.active,
.dionis-table-host .tabulator-page[aria-current="page"] {
  background: var(--ink, #111);
  border-color: var(--ink, #111);
  color: #fff;
  font-weight: 700;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #fff 12%, transparent);
}
.dionis-table-host .tabulator-page.active:hover,
.dionis-table-host .tabulator-page[aria-current="page"]:hover {
  background: var(--ink, #111);
  border-color: var(--ink, #111);
  color: #fff;
}
.dionis-table-host .tabulator-footer .tabulator-page-size {
  margin-inline-end: 0.5rem;
}

.dionis-table-host .tabulator-page.disabled {
  opacity: 0.45;
  color: var(--muted, inherit);
}

.dionis-table-host .tabulator-paginator {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
  justify-content: flex-end;
  flex: 1 1 16rem;
  min-width: 0;
  padding: 0.15rem 0;
  color: inherit;
}

/* One page: keep "Showing…" only — hide First/Prev/pages/Next/Last */
.dionis-table-host.dionis-table--single-page .tabulator-paginator {
  display: none;
}

@media (max-width: 40rem) {
  .dionis-table-host .tabulator-footer .tabulator-footer-contents {
    flex-direction: column;
    align-items: stretch;
  }

  .dionis-table-host .tabulator-footer .tabulator-page-counter,
  .dionis-table-host .tabulator-paginator {
    flex: 0 0 auto;
    width: 100%;
  }

  .dionis-table-host .tabulator-paginator {
    justify-content: flex-start;
  }
}

.dionis-table-host .tabulator-header-filter input,
.dionis-table-host .tabulator-header-filter select,
.dionis-table-host .tabulator-footer select,
.dionis-table-host .tabulator .tabulator-cell input:not([type="checkbox"]):not([type="radio"]),
.dionis-table-host .tabulator .tabulator-cell select,
.dionis-table-host .tabulator .tabulator-cell textarea {
  width: 100%;
  max-width: 100%;
  border-radius: 0.35rem;
  border: 1px solid var(--line, color-mix(in srgb, currentColor 22%, transparent));
  background: var(--bg, var(--surface, transparent));
  color: var(--text, inherit);
  padding: 0.25rem 0.4rem;
  font: inherit;
  caret-color: var(--text, currentColor);
}

.dionis-table-host .tabulator-header-filter input::placeholder,
.dionis-table-host .tabulator .tabulator-cell input::placeholder,
.dionis-table-host .tabulator .tabulator-cell textarea::placeholder {
  color: var(--muted, var(--c-gray-88));
  opacity: 1;
}

.dionis-table-host .tabulator-header-filter select option,
.dionis-table-host .tabulator-footer select option {
  background: var(--surface, var(--c-white));
  color: var(--text, var(--c-black));
}

.dionis-table-host .tabulator-placeholder,
.dionis-table-host .tabulator-placeholder span {
  color: var(--muted, var(--c-gray-66));
}

.dionis-table-host .tabulator-alert {
  background: color-mix(in srgb, var(--surface, var(--c-white)) 88%, transparent);
  color: var(--text, inherit);
}

.dionis-table-host .tabulator-responsive-collapse {
  border-top: 1px solid var(--line, color-mix(in srgb, currentColor 10%, transparent));
  padding: 0.5rem 0.75rem;
  background: color-mix(in srgb, var(--text, currentColor) 3%, transparent);
  color: inherit;
}

.dionis-table-host .tabulator-responsive-collapse table {
  width: 100%;
  color: inherit;
}

.dionis-table-host .tabulator-responsive-collapse td {
  color: inherit;
}

/* Frozen / calcs / loader accents stay theme-aware */
.dionis-table-host .tabulator .tabulator-loader-msg {
  background: var(--surface, var(--c-white));
  border: 1px solid var(--line, var(--c-gray-99));
  color: var(--text, var(--c-black));
}

.dionis-table-host .tabulator .tabulator-calcs {
  background: color-mix(in srgb, var(--text, currentColor) 5%, var(--surface, transparent)) !important;
  color: var(--text, inherit) !important;
}

@media (prefers-reduced-motion: reduce) {
  .dionis-table-host .tabulator-row,
  .dionis-table-host .tabulator-page {
    transition: none !important;
  }
}

/* Explicit dark-theme reinforcement (vendor CSS uses hard-coded light colors) */
:root[data-theme="dark"] .dionis-table-host .tabulator,
html[data-theme="dark"] .dionis-table-host .tabulator,
body[data-theme="dark"] .dionis-table-host .tabulator {
  background: var(--surface, var(--c-gray-0a));
  color: var(--text, var(--c-white));
  border-color: var(--line, rgba(255, 255, 255, 0.16));
}

:root[data-theme="dark"] .dionis-table-host .tabulator .tabulator-header,
html[data-theme="dark"] .dionis-table-host .tabulator .tabulator-header,
body[data-theme="dark"] .dionis-table-host .tabulator .tabulator-header {
  background: color-mix(in srgb, var(--c-white) 7%, var(--surface, var(--c-gray-0a)));
  color: var(--text, var(--c-white));
  border-bottom-color: var(--line, rgba(255, 255, 255, 0.16));
}

:root[data-theme="dark"] .dionis-table-host .tabulator .tabulator-header .tabulator-col,
html[data-theme="dark"] .dionis-table-host .tabulator .tabulator-header .tabulator-col,
body[data-theme="dark"] .dionis-table-host .tabulator .tabulator-header .tabulator-col {
  background: transparent;
  color: var(--text, var(--c-white));
  border-right-color: var(--line, rgba(255, 255, 255, 0.12));
}

:root[data-theme="dark"] .dionis-table-host .tabulator-row,
html[data-theme="dark"] .dionis-table-host .tabulator-row,
body[data-theme="dark"] .dionis-table-host .tabulator-row {
  background: transparent;
  color: var(--text, var(--c-white));
  border-bottom-color: var(--line, rgba(255, 255, 255, 0.12));
}

:root[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-row-even,
html[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-row-even,
body[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-row-even {
  background: color-mix(in srgb, var(--c-white) 4%, transparent);
}

:root[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-selectable:hover,
html[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-selectable:hover,
body[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-selectable:hover {
  background: color-mix(in srgb, var(--mint, var(--c-mint)) 14%, transparent);
  color: var(--text, var(--c-white));
}

:root[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-selected,
:root[data-theme="dark"] .dionis-table-host .tabulator-row.active-row,
html[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-selected,
html[data-theme="dark"] .dionis-table-host .tabulator-row.active-row,
body[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-selected,
body[data-theme="dark"] .dionis-table-host .tabulator-row.active-row {
  background: color-mix(in srgb, var(--mint, var(--c-mint)) 20%, transparent);
  color: var(--text, var(--c-white));
}

:root[data-theme="dark"] .dionis-table-host .tabulator-row .tabulator-cell.tabulator-frozen,
:root[data-theme="dark"] .dionis-table-host .tabulator-header .tabulator-col.tabulator-frozen,
:root[data-theme="dark"] .dionis-table-host .tabulator-row .tabulator-cell.tabulator-row-header,
:root[data-theme="dark"] .dionis-table-host .tabulator-header .tabulator-col.tabulator-row-header,
html[data-theme="dark"] .dionis-table-host .tabulator-row .tabulator-cell.tabulator-frozen,
html[data-theme="dark"] .dionis-table-host .tabulator-header .tabulator-col.tabulator-frozen,
html[data-theme="dark"] .dionis-table-host .tabulator-row .tabulator-cell.tabulator-row-header,
html[data-theme="dark"] .dionis-table-host .tabulator-header .tabulator-col.tabulator-row-header,
body[data-theme="dark"] .dionis-table-host .tabulator-row .tabulator-cell.tabulator-frozen,
body[data-theme="dark"] .dionis-table-host .tabulator-header .tabulator-col.tabulator-frozen,
body[data-theme="dark"] .dionis-table-host .tabulator-row .tabulator-cell.tabulator-row-header,
body[data-theme="dark"] .dionis-table-host .tabulator-header .tabulator-col.tabulator-row-header {
  background: var(--surface, var(--c-gray-0a)) !important;
  color: var(--text, var(--c-white));
  border-right-color: var(--line, rgba(255, 255, 255, 0.12));
}

:root[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-row-even .tabulator-cell.tabulator-frozen,
:root[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-row-even .tabulator-cell.tabulator-row-header,
html[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-row-even .tabulator-cell.tabulator-frozen,
html[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-row-even .tabulator-cell.tabulator-row-header,
body[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-row-even .tabulator-cell.tabulator-frozen,
body[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-row-even .tabulator-cell.tabulator-row-header {
  background: color-mix(in srgb, var(--c-white) 4%, var(--surface, var(--c-gray-0a))) !important;
}

:root[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-selected .tabulator-cell.tabulator-frozen,
:root[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-selected .tabulator-cell.tabulator-row-header,
html[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-selected .tabulator-cell.tabulator-frozen,
html[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-selected .tabulator-cell.tabulator-row-header,
body[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-selected .tabulator-cell.tabulator-frozen,
body[data-theme="dark"] .dionis-table-host .tabulator-row.tabulator-selected .tabulator-cell.tabulator-row-header {
  background: color-mix(in srgb, var(--mint, var(--c-mint)) 20%, var(--surface, var(--c-gray-0a))) !important;
}

:root[data-theme="dark"] .dionis-table-host .tabulator-footer,
html[data-theme="dark"] .dionis-table-host .tabulator-footer,
body[data-theme="dark"] .dionis-table-host .tabulator-footer {
  background: color-mix(in srgb, var(--c-white) 5%, var(--surface, var(--c-gray-0a)));
  color: var(--text, var(--c-white));
  border-top-color: var(--line, rgba(255, 255, 255, 0.16));
}

:root[data-theme="dark"] .dionis-table-host .tabulator-page,
html[data-theme="dark"] .dionis-table-host .tabulator-page,
body[data-theme="dark"] .dionis-table-host .tabulator-page {
  background: transparent;
  color: var(--text, var(--c-white));
  border-color: var(--line, rgba(255, 255, 255, 0.2));
}

:root[data-theme="dark"] .dionis-table-host .tabulator-page.active,
:root[data-theme="dark"] .dionis-table-host .tabulator-page[aria-current="page"],
html[data-theme="dark"] .dionis-table-host .tabulator-page.active,
html[data-theme="dark"] .dionis-table-host .tabulator-page[aria-current="page"],
body[data-theme="dark"] .dionis-table-host .tabulator-page.active,
body[data-theme="dark"] .dionis-table-host .tabulator-page[aria-current="page"] {
  background: #fff;
  border-color: #fff;
  color: #111;
}

:root[data-theme="dark"] .dionis-table-host .tabulator-header-filter input,
:root[data-theme="dark"] .dionis-table-host .tabulator-header-filter select,
:root[data-theme="dark"] .dionis-table-host .tabulator-footer select,
:root[data-theme="dark"] .dionis-table-host .tabulator .tabulator-cell input:not([type="checkbox"]):not([type="radio"]),
:root[data-theme="dark"] .dionis-table-host .tabulator .tabulator-cell select,
:root[data-theme="dark"] .dionis-table-host .tabulator .tabulator-cell textarea,
html[data-theme="dark"] .dionis-table-host .tabulator-header-filter input,
html[data-theme="dark"] .dionis-table-host .tabulator-header-filter select,
html[data-theme="dark"] .dionis-table-host .tabulator-footer select,
html[data-theme="dark"] .dionis-table-host .tabulator .tabulator-cell input:not([type="checkbox"]):not([type="radio"]),
html[data-theme="dark"] .dionis-table-host .tabulator .tabulator-cell select,
html[data-theme="dark"] .dionis-table-host .tabulator .tabulator-cell textarea,
body[data-theme="dark"] .dionis-table-host .tabulator-header-filter input,
body[data-theme="dark"] .dionis-table-host .tabulator-header-filter select,
body[data-theme="dark"] .dionis-table-host .tabulator-footer select,
body[data-theme="dark"] .dionis-table-host .tabulator .tabulator-cell input:not([type="checkbox"]):not([type="radio"]),
body[data-theme="dark"] .dionis-table-host .tabulator .tabulator-cell select,
body[data-theme="dark"] .dionis-table-host .tabulator .tabulator-cell textarea {
  background: var(--bg, var(--c-black));
  color: var(--text, var(--c-white));
  border-color: var(--line, rgba(255, 255, 255, 0.22));
}

:root[data-theme="dark"] .dionis-table-host .tabulator-header-filter select option,
:root[data-theme="dark"] .dionis-table-host .tabulator-footer select option,
html[data-theme="dark"] .dionis-table-host .tabulator-header-filter select option,
html[data-theme="dark"] .dionis-table-host .tabulator-footer select option,
body[data-theme="dark"] .dionis-table-host .tabulator-header-filter select option,
body[data-theme="dark"] .dionis-table-host .tabulator-footer select option {
  background: var(--surface, var(--c-gray-0a));
  color: var(--text, var(--c-white));
}

:root[data-theme="dark"] .dionis-table-host .tabulator .tabulator-loader-msg,
html[data-theme="dark"] .dionis-table-host .tabulator .tabulator-loader-msg,
body[data-theme="dark"] .dionis-table-host .tabulator .tabulator-loader-msg {
  background: var(--surface, var(--c-gray-0a));
  border-color: var(--line, rgba(255, 255, 255, 0.2));
  color: var(--text, var(--c-white));
}

@media (max-width: 640px) {
  .dionis-table-host .tabulator .tabulator-header .tabulator-col-content {
    padding: 0.4rem 0.45rem;
  }

  .dionis-table-host .tabulator-cell {
    padding: 0.4rem 0.45rem;
  }

  /* Header search boxes eat too much height on phones — hide; sort still works */
  .dionis-table-host .tabulator-header .tabulator-header-filter {
    display: none;
  }

  .dionis-table-host {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}