/*
 * Optional styles for @acunsoft/datatable-dom (also used by the Vue, React and
 * Livewire packages).
 *   import '@acunsoft/datatable-dom/styles.css';
 *
 * Every colour, size and radius is a --adt-* custom property: set them on
 * .adt (the outermost adt-* element) to theme the table without touching
 * selectors; the defaults are declared only there, so they inherit. Sizes:
 * add adt-size--sm or adt-size--lg (on .adt or an ancestor).
 * Selectors use :where() where possible, so your own rules win easily.
 *
 * Light by default. Dark when an ancestor has data-theme="dark",
 * data-bs-theme="dark" (Bootstrap 5.3) or the class "dark" (Tailwind); follow
 * the system setting with data-theme="auto". The
 * component cannot see the page background, so it never turns dark on its own.
 */
:where(.adt, .adt-table-wrap, .adt-paging, .adt-info, .adt-length, .adt-search, .adt-selection, .adt-columns, .adt-toolbar, .adt-import, .adt-dialog):not(:where(.adt, .adt-table-wrap, .adt-paging, .adt-info, .adt-length, .adt-search, .adt-selection, .adt-columns, .adt-toolbar, .adt-import, .adt-dialog) *) {
  --adt-bg: #ffffff;
  --adt-surface: #ffffff;        /* panels: bars and the table */
  --adt-fg: #1f2430;
  --adt-muted: #667085;
  --adt-line: #e4e7ec;
  --adt-head-bg: transparent;
  --adt-head-fg: #667085;
  --adt-hover: #f7f8fa;
  --adt-selected: #f3f0ff;
  --adt-accent: #6d4aff;
  --adt-accent-fg: #ffffff;
  --adt-focus: color-mix(in srgb, var(--adt-accent) 35%, transparent);
  --adt-danger: #d92d20;
  --adt-radius: 8px;             /* panels */
  --adt-control-radius: 6px;     /* buttons, inputs, page numbers */
  --adt-control-height: 2.375rem;
  --adt-gap: 1rem;               /* space between the bars and the table */
  --adt-shadow: 0 1px 2px rgb(16 24 40 / 0.04);
  --adt-font: inherit;
  --adt-font-size: 0.9375rem;
  --adt-cell-padding: 0.875rem 1rem;
  --adt-bar-padding: 0.75rem 1rem;
  --adt-head-transform: uppercase; /* none for normal-case headers */
  --adt-stack-below: 640px;      /* documentation only: media queries cannot read variables */
  color-scheme: light;           /* native checkboxes, selects and scrollbars follow the theme */
  font-family: var(--adt-font);
  font-size: var(--adt-font-size);
  color: var(--adt-fg);
}
:where([data-theme="dark"], [data-bs-theme="dark"], .dark) :where(.adt, .adt-table-wrap, .adt-paging, .adt-info, .adt-length, .adt-search, .adt-selection, .adt-columns, .adt-toolbar, .adt-import, .adt-dialog):not(:where(.adt, .adt-table-wrap, .adt-paging, .adt-info, .adt-length, .adt-search, .adt-selection, .adt-columns, .adt-toolbar, .adt-import, .adt-dialog) *) {
  --adt-bg: #0f1218; --adt-surface: #151922; --adt-fg: #e6e8ec; --adt-muted: #98a2b3; --adt-line: #262c38;
  --adt-head-fg: #98a2b3; --adt-hover: #1b202b; --adt-selected: #221c3d; --adt-accent: #8f75ff; --adt-accent-fg: #0f1218; --adt-danger: #ff6b61;
  --adt-shadow: none; color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
  :where([data-theme="auto"]) :where(.adt, .adt-table-wrap, .adt-paging, .adt-info, .adt-length, .adt-search, .adt-selection, .adt-columns, .adt-toolbar, .adt-import, .adt-dialog):not(:where(.adt, .adt-table-wrap, .adt-paging, .adt-info, .adt-length, .adt-search, .adt-selection, .adt-columns, .adt-toolbar, .adt-import, .adt-dialog) *) {
    --adt-bg: #0f1218; --adt-surface: #151922; --adt-fg: #e6e8ec; --adt-muted: #98a2b3; --adt-line: #262c38;
    --adt-head-fg: #98a2b3; --adt-hover: #1b202b; --adt-selected: #221c3d; --adt-accent: #8f75ff; --adt-accent-fg: #0f1218; --adt-danger: #ff6b61;
    --adt-shadow: none; color-scheme: dark;
  }
}
/* Sizes: compact and spacious; md is the default above. */
:where(.adt-size--sm), :where(.adt-size--sm) :where(.adt, .adt-table-wrap, .adt-paging, .adt-info, .adt-length, .adt-search, .adt-selection, .adt-columns, .adt-toolbar, .adt-import, .adt-dialog):not(:where(.adt, .adt-table-wrap, .adt-paging, .adt-info, .adt-length, .adt-search, .adt-selection, .adt-columns, .adt-toolbar, .adt-import, .adt-dialog) *) {
  --adt-font-size: 0.875rem; --adt-cell-padding: 0.5rem 0.75rem; --adt-control-height: 2rem;
  --adt-bar-padding: 0.5rem 0.75rem; --adt-gap: 0.75rem;
}
:where(.adt-size--lg), :where(.adt-size--lg) :where(.adt, .adt-table-wrap, .adt-paging, .adt-info, .adt-length, .adt-search, .adt-selection, .adt-columns, .adt-toolbar, .adt-import, .adt-dialog):not(:where(.adt, .adt-table-wrap, .adt-paging, .adt-info, .adt-length, .adt-search, .adt-selection, .adt-columns, .adt-toolbar, .adt-import, .adt-dialog) *) {
  --adt-font-size: 1rem; --adt-cell-padding: 1.125rem 1.25rem; --adt-control-height: 2.75rem;
  --adt-bar-padding: 1rem 1.25rem; --adt-gap: 1.25rem;
}
:where(.adt, .adt-table-wrap, .adt-paging, .adt-info, .adt-length, .adt-search, .adt-selection, .adt-columns, .adt-toolbar, .adt-import, .adt-dialog),
:where(.adt, .adt-table-wrap, .adt-paging, .adt-length, .adt-search, .adt-selection, .adt-columns, .adt-toolbar, .adt-import, .adt-dialog) * {
  box-sizing: border-box;
}
/* Browsers give buttons, inputs and selects a font of their own; these take the page's. */
:where(.adt, .adt-table-wrap, .adt-paging, .adt-length, .adt-search, .adt-selection, .adt-columns, .adt-toolbar, .adt-import, .adt-dialog) :where(button, input, select, textarea) {
  font-family: inherit;
}

/* Screen-reader-only text (labels of the page-size select and the search input) */
.adt-sr-only {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.adt-icon { flex: none; display: block; }

/* Layout (renderDataTable and the Livewire view): bars above and below the table */
.adt { display: flex; flex-direction: column; gap: var(--adt-gap); }
.adt-bar {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.75rem 1rem;
  padding: var(--adt-bar-padding); background: var(--adt-surface); border: 1px solid var(--adt-line);
  border-radius: var(--adt-radius); box-shadow: var(--adt-shadow);
}
.adt-bar-start, .adt-bar-end { display: flex; flex-wrap: wrap; align-items: center; gap: 0.625rem; min-width: 0; }
.adt-bar-start:empty, .adt-bar-end:empty { display: none; }
.adt-bar-start { flex: 1 1 auto; }
.adt-bar-end { margin-left: auto; justify-content: flex-end; }
.adt-feature { display: contents; }
.adt-feature--search { display: block; flex: 1 1 18rem; max-width: 28rem; min-width: 0; }

/* Shared look of inputs, selects and buttons */
:where(.adt-control, .adt-search input, .adt-length select, .adt-columns summary, .adt-filter-open, .adt-button, .adt-export button,
  .adt-import button, .adt-retry, .adt-selection .adt-bulk-action) {
  font: inherit; font-size: 0.9375em; color: var(--adt-fg); background: var(--adt-bg);
  height: var(--adt-control-height); padding: 0 0.875rem; border: 1px solid var(--adt-line);
  border-radius: var(--adt-control-radius); line-height: 1; margin: 0;
  transition: border-color 0.15s, box-shadow 0.15s, background-color 0.15s;
}
:where(.adt-columns summary, .adt-filter-open, .adt-button, .adt-export button, .adt-import button, .adt-retry, .adt-selection .adt-bulk-action) {
  display: inline-flex; align-items: center; gap: 0.5rem; cursor: pointer; font-weight: 500; white-space: nowrap;
}
:where(.adt-columns summary, .adt-filter-open, .adt-button, .adt-export button, .adt-import button, .adt-retry, .adt-selection .adt-bulk-action):hover { background: var(--adt-hover); }
:where(.adt-search input, .adt-length select):hover { border-color: color-mix(in srgb, var(--adt-line) 50%, var(--adt-muted)); }
:where(.adt-search input, .adt-length select):focus { outline: none; border-color: var(--adt-accent); box-shadow: 0 0 0 3px var(--adt-focus); }
.adt-button[aria-pressed="true"] { color: var(--adt-accent); border-color: var(--adt-accent); background: color-mix(in srgb, var(--adt-accent) 8%, var(--adt-bg)); }
.adt-button--primary { color: var(--adt-accent-fg); background: var(--adt-accent); border-color: var(--adt-accent); }
.adt-button--primary:hover { background: color-mix(in srgb, var(--adt-accent) 88%, #000); }

/* Keyboard focus is always visible */
:where(.adt, .adt-table-wrap, .adt-paging, .adt-search, .adt-length, .adt-selection, .adt-columns, .adt-toolbar, .adt-import, .adt-dialog) :focus-visible {
  outline: 2px solid var(--adt-accent); outline-offset: 2px;
}
:where(.adt-search input, .adt-length select):focus-visible { outline: none; }

/* Page size */
.adt-length { display: inline-flex; align-items: center; gap: 0.5rem; color: var(--adt-muted); }
.adt-length select {
  appearance: none; -webkit-appearance: none; cursor: pointer; padding-right: 2.25rem; min-width: 5rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23667085' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-position: right 0.7rem center; background-size: 1rem; background-repeat: no-repeat;
}

/* Search */
.adt-search { position: relative; display: flex; align-items: center; width: 100%; color: var(--adt-muted); }
.adt-search .adt-icon { position: absolute; left: 0.8rem; pointer-events: none; }
.adt-search input { width: 100%; min-width: 0; padding-left: 2.4rem; }
.adt-search input::placeholder { color: var(--adt-muted); opacity: 1; } /* the muted colour is AA (4.9:1); fainter is not */
.adt-search input::-webkit-search-cancel-button { cursor: pointer; }

/* Table */
.adt-table-wrap { position: relative; }
.adt-scroll {
  overflow-x: auto; -webkit-overflow-scrolling: touch; background: var(--adt-surface);
  border: 1px solid var(--adt-line); border-radius: var(--adt-radius); box-shadow: var(--adt-shadow);
}
.adt-table { width: 100%; border-collapse: collapse; }
.adt-table caption { caption-side: top; text-align: left; padding: 1rem; font-weight: 600; }
.adt-table th, .adt-table td { padding: var(--adt-cell-padding); text-align: left; border-bottom: 1px solid var(--adt-line); vertical-align: middle; }
.adt-table thead th {
  background: var(--adt-head-bg); color: var(--adt-head-fg); font-size: 0.8em; font-weight: 600;
  letter-spacing: 0.04em; text-transform: var(--adt-head-transform); white-space: nowrap;
}
.adt-table tbody:last-child > tr:last-child > td, .adt-table tbody:last-child > .adt-row:has(+ .adt-detail[style*="none"]) > td { border-bottom: 0; }
.adt-row { transition: background-color 0.1s; }
.adt-row:hover { background: var(--adt-hover); }
.adt-row--selected, .adt-row--selected:hover { background: var(--adt-selected); }
.adt-table .adt-select { width: 3rem; padding-right: 0; }
.adt-select-all { display: inline-flex; align-items: center; gap: 0.625rem; vertical-align: middle; cursor: pointer; }
.adt-select-all-text { display: none; font-size: 0.875em; font-weight: 600; color: var(--adt-muted); }
.adt-table input[type="checkbox"] { width: 1.05rem; height: 1.05rem; margin: 0; accent-color: var(--adt-accent); cursor: pointer; vertical-align: middle; }
.adt-table :is(th, td).adt-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.adt-table tfoot :is(th, td) { font-weight: 600; border-top: 2px solid var(--adt-line); border-bottom: 0; background: var(--adt-head-bg); text-align: left; }
.adt-table tfoot .adt-num { text-align: right; }
.adt-empty td { text-align: center; color: var(--adt-muted); padding: 3rem 1rem; }

/* Sortable headers: a faint up/down mark, the active direction in the accent colour */
.adt-sort {
  all: unset; cursor: pointer; display: inline-flex; align-items: center; gap: 0.4rem;
  font: inherit; color: inherit; letter-spacing: inherit; text-transform: inherit; border-radius: 4px;
}
.adt-sort:hover { color: var(--adt-fg); }
.adt-sort-mark { display: inline-flex; align-items: center; min-width: 0.6rem; font-size: 0.7em; color: var(--adt-accent); letter-spacing: 0; }
.adt-sort:not(.adt-sort--asc, .adt-sort--desc) .adt-sort-mark::before {
  content: ""; width: 0.6rem; height: 0.9rem; background: currentColor; color: var(--adt-muted); opacity: 0.45;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 16'%3E%3Cpath d='M5 1 9 6H1zM5 15 1 10h8z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 16'%3E%3Cpath d='M5 1 9 6H1zM5 15 1 10h8z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.adt-sort:hover .adt-sort-mark::before { opacity: 0.8; }

/* Sticky header: with the page (stickyHeader, DataTables fixedHeader) or inside a fixed height (scrollY) */
.adt-scroll-y .adt-scroll { max-height: var(--adt-scroll-y); overflow: auto; overscroll-behavior: contain; }
.adt-sticky-header:not(.adt-scroll-y) .adt-scroll { overflow: visible; }
:is(.adt-sticky-header, .adt-scroll-y) .adt-table thead :is(th, td) {
  position: sticky; top: var(--adt-sticky-top, 0px); z-index: 3;
  background: var(--adt-surface); box-shadow: inset 0 -1px 0 var(--adt-line);
}
.adt-scroll-y .adt-table thead :is(th, td) { top: 0; }
:is(.adt-sticky-header, .adt-scroll-y) .adt-table thead tr > :first-child { border-top-left-radius: var(--adt-radius); }
:is(.adt-sticky-header, .adt-scroll-y) .adt-table thead tr > :last-child { border-top-right-radius: var(--adt-radius); }

/* Server-mode states */
.adt-notice:empty { display: none; }
.adt-notice { display: flex; align-items: center; gap: 0.75rem; padding: 0.625rem 1rem; margin-bottom: 0.5rem; color: var(--adt-muted); }
.adt-notice[role="alert"] { color: var(--adt-danger); border: 1px solid currentColor; border-radius: var(--adt-radius); }
.adt-loading .adt-scroll { opacity: 0.6; transition: opacity 0.15s; }

/* Skeleton rows while the first rows load (skeleton option) */
.adt-skeleton-on .adt-scroll { opacity: 1; }
.adt-skeleton-on .adt-notice { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.adt-skeleton {
  display: inline-block; width: 70%; max-width: 12rem; height: 0.75em; vertical-align: middle; border-radius: 999px;
  background: linear-gradient(90deg, var(--adt-line) 25%, var(--adt-hover) 50%, var(--adt-line) 75%) 0 0 / 300% 100%;
  animation: adt-shimmer 1.4s ease-in-out infinite;
}
.adt-skeleton-row:nth-child(3n + 2) td:nth-child(odd) .adt-skeleton { width: 50%; }
.adt-skeleton-row:nth-child(3n) td:nth-child(even) .adt-skeleton { width: 40%; }
.adt-skeleton-row:hover { background: transparent; }
.adt-skeleton--control { width: 4.5rem; height: 2.25rem; border-radius: var(--adt-control-radius); }
.adt-skeleton--search { width: 14rem; max-width: 50vw; height: 2.25rem; border-radius: var(--adt-control-radius); }
@keyframes adt-shimmer { from { background-position: 100% 0; } to { background-position: 0 0; } }
@media (prefers-reduced-motion: reduce) { .adt-skeleton { animation: none; } }

/* Info: "1–25 of 5,000 rows" */
.adt-info { color: var(--adt-muted); font-variant-numeric: tabular-nums; }

/* Numbered pages: ‹ 1 … 4 5 6 … 20 › */
.adt-paging { display: flex; align-items: center; gap: 0.375rem; }
.adt-page-numbers { display: contents; }
.adt-page {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: var(--adt-control-height); height: var(--adt-control-height); padding: 0 0.5rem;
  font: inherit; font-size: 0.9375em; font-weight: 500; font-variant-numeric: tabular-nums; color: var(--adt-fg);
  background: var(--adt-bg); border: 1px solid var(--adt-line); border-radius: var(--adt-control-radius);
  cursor: pointer; transition: background-color 0.15s, border-color 0.15s, color 0.15s;
}
.adt-page:hover { background: var(--adt-hover); border-color: color-mix(in srgb, var(--adt-line) 50%, var(--adt-muted)); }
.adt-page[aria-current="page"] { color: var(--adt-accent-fg); background: var(--adt-accent); border-color: var(--adt-accent); cursor: default; }
.adt-page-arrow { color: var(--adt-muted); }
.adt-page[aria-disabled="true"] { opacity: 0.45; cursor: not-allowed; background: var(--adt-bg); }
.adt-page[hidden] { display: none; }
.adt-page-gap { display: inline-flex; align-items: flex-end; justify-content: center; min-width: 1.5rem; color: var(--adt-muted); user-select: none; }

/* Selection bar (renderBulkActions and the Livewire view) */
.adt-selection {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; padding: 0.625rem 1rem;
  background: var(--adt-selected); border: 1px solid color-mix(in srgb, var(--adt-accent) 25%, transparent); border-radius: var(--adt-radius);
}
.adt-selection-count { font-weight: 600; }
.adt-selection button { font: inherit; color: var(--adt-accent); background: none; border: 0; padding: 0; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.adt-selection[hidden], .adt-selection [hidden] { display: none; }
.adt-selection .adt-bulk-action { height: 2rem; text-decoration: none; color: var(--adt-fg); background: var(--adt-bg); }
.adt-selection [aria-disabled="true"] { opacity: 0.45; cursor: not-allowed; }
.adt-feature--selection:has(> .adt-selection[hidden]) { display: none; }
.adt-selection .adt-selection-menu { display: none; }

/* Column visibility menu */
.adt-columns { position: relative; display: inline-block; }
.adt-columns summary { list-style: none; user-select: none; }
.adt-columns summary::-webkit-details-marker { display: none; }
.adt-columns summary::after {
  content: ""; width: 0.4rem; height: 0.4rem; margin: -0.2rem 0 0 0.15rem;
  border-right: 1.5px solid var(--adt-muted); border-bottom: 1.5px solid var(--adt-muted); transform: rotate(45deg);
}
.adt-columns[open] summary { border-color: var(--adt-accent); box-shadow: 0 0 0 3px var(--adt-focus); }
/* A toolbar button with iconOnly: the text stays for screen readers */
:is(.adt-columns > summary, .adt-filter-open).adt-icon-only { position: relative; justify-content: center; width: var(--adt-control-height); padding: 0; }
.adt-columns > summary.adt-icon-only::after { display: none; }
.adt-icon-only .adt-summary-text { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.adt-icon-only .adt-badge { position: absolute; top: -0.45rem; right: -0.45rem; }
/* --adt-menu-shift: set by placeMenu() when an open panel would stick out of the window */
:is(.adt-columns > fieldset, .adt-menu-list, .adt-filter-panel) { transform: translateX(var(--adt-menu-shift, 0)); }
.adt-columns > fieldset {
  position: absolute; right: 0; z-index: 20; min-width: 14rem; max-height: 22rem; overflow: auto;
  margin: 0.375rem 0 0; padding: 0.5rem; border: 1px solid var(--adt-line); border-radius: var(--adt-radius);
  background: var(--adt-bg); box-shadow: 0 12px 24px -6px rgb(16 24 40 / 0.16), 0 4px 8px -4px rgb(16 24 40 / 0.08);
}
.adt-columns > fieldset legend { float: left; width: 100%; padding: 0.25rem 0.5rem 0.375rem; color: var(--adt-muted); font-size: 0.8em; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; }
.adt-columns > fieldset label { display: flex; align-items: center; gap: 0.625rem; padding: 0.45rem 0.5rem; border-radius: var(--adt-control-radius); clear: both; cursor: pointer; }
.adt-columns > fieldset label:hover { background: var(--adt-hover); }
.adt-columns > fieldset input { width: 1rem; height: 1rem; margin: 0; accent-color: var(--adt-accent); }
.adt-columns > fieldset input:disabled + span { color: var(--adt-muted); }

/* Dropdown menu (the tools menu: export, print, import) */
.adt-menu-list {
  position: absolute; right: 0; z-index: 20; min-width: 13rem; margin-top: 0.375rem; padding: 0.375rem;
  display: flex; flex-direction: column; border: 1px solid var(--adt-line); border-radius: var(--adt-radius);
  background: var(--adt-bg); box-shadow: 0 12px 24px -6px rgb(16 24 40 / 0.16), 0 4px 8px -4px rgb(16 24 40 / 0.08);
}
.adt-menu-group { display: flex; flex-direction: column; }
.adt-menu-label { padding: 0.375rem 0.625rem 0.25rem; color: var(--adt-muted); font-size: 0.75em; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; }
.adt-menu-item {
  display: flex; align-items: center; gap: 0.5rem; width: 100%; padding: 0.5rem 0.625rem; text-align: left;
  font: inherit; font-size: 0.9375em; color: var(--adt-fg); background: none; border: 0; border-radius: var(--adt-control-radius); cursor: pointer;
}
.adt-menu-item:hover, .adt-menu-item:focus-visible { background: var(--adt-hover); }
.adt-menu-status { margin: 0; font-size: 0.875em; color: var(--adt-muted); }
.adt-menu-status:empty { display: none; }
.adt-menu-status--error { color: var(--adt-danger); }
.adt-menu-separator { height: 1px; margin: 0.375rem 0; border: 0; background: var(--adt-line); }

/* Filter panel (renderFilters / Livewire 'filters') and active filter chips */
.adt-badge {
  display: inline-flex; align-items: center; justify-content: center; min-width: 1.25rem; height: 1.25rem; padding: 0 0.35rem;
  border-radius: 999px; background: var(--adt-accent); color: var(--adt-accent-fg); font-size: 0.75em; font-weight: 700; line-height: 1;
}
.adt-badge[hidden] { display: none; }
/* The fields: on their own (renderFilterPanel, in your drawer or modal), under the button, or in a dialog */
.adt-filter-panel { display: flex; flex-direction: column; gap: 0.75rem; }
.adt-filters > .adt-filter-panel {
  position: absolute; right: 0; z-index: 20; width: min(22rem, calc(100vw - 2rem)); max-height: min(32rem, 70vh); overflow: auto;
  margin-top: 0.375rem; padding: 0.75rem;
  border: 1px solid var(--adt-line); border-radius: var(--adt-radius); background: var(--adt-bg);
  box-shadow: 0 12px 24px -6px rgb(16 24 40 / 0.16), 0 4px 8px -4px rgb(16 24 40 / 0.08);
}
/* filterPanel: 'drawer' (from the side) and 'modal' (centred) */
.adt-filter-dialog .adt-filter-panel { padding: 1rem 1.25rem 0; }
.adt-filter-dialog .adt-filter-foot {
  position: sticky; bottom: 0; gap: 0.5rem; margin: 0 -1.25rem; padding: 0.75rem 1.25rem; background: var(--adt-bg);
}
.adt-filter-dialog .adt-filter-foot .adt-button { height: var(--adt-control-height); }
.adt-dialog.adt-filter-dialog--modal { width: min(32rem, calc(100vw - 2rem)); }
.adt-dialog.adt-filter-dialog--drawer {
  width: min(24rem, 100vw); height: 100dvh; max-height: 100dvh; margin: 0 0 0 auto;
  border-width: 0 0 0 1px; border-radius: 0; animation: adt-drawer-in 0.2s ease-out;
}
@keyframes adt-drawer-in { from { transform: translateX(100%); } }
@media (prefers-reduced-motion: reduce) { .adt-dialog.adt-filter-dialog--drawer { animation: none; } }
.adt-filter { margin: 0; padding: 0; border: 0; min-width: 0; display: flex; flex-wrap: wrap; gap: 0.375rem 0.75rem; }
.adt-filter legend {
  float: left; width: 100%; padding: 0 0 0.375rem; color: var(--adt-muted); font-size: 0.75em; font-weight: 600;
  letter-spacing: 0.04em; text-transform: uppercase;
}
.adt-filter > .adt-control { width: 100%; }
.adt-filter-range { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 0.5rem; width: 100%; color: var(--adt-muted); }
.adt-filter-range .adt-control { width: 100%; min-width: 0; padding: 0 0.625rem; }
.adt-filter-choice { display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.2rem 0; cursor: pointer; }
.adt-filter-choice input { width: 1rem; height: 1rem; margin: 0; accent-color: var(--adt-accent); }
.adt-filter--options .adt-filter-choice { width: 100%; }
.adt-filter-foot { display: flex; justify-content: flex-end; padding-top: 0.5rem; border-top: 1px solid var(--adt-line); }
.adt-filter-foot .adt-button { height: 2rem; }
.adt-filter-foot .adt-button:disabled { opacity: 0.45; cursor: not-allowed; }
.adt-filter-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
.adt-filter-chips[hidden], .adt-feature--chips:has(> .adt-filter-chips[hidden]) { display: none; }
.adt-chip {
  display: inline-flex; align-items: center; gap: 0.25rem; max-width: 100%; padding: 0.25rem 0.3rem 0.25rem 0.7rem;
  border: 1px solid color-mix(in srgb, var(--adt-accent) 30%, transparent); border-radius: 999px;
  background: var(--adt-selected); color: var(--adt-fg); font-size: 0.875em; font-weight: 500;
}
.adt-chip-remove {
  display: inline-flex; align-items: center; justify-content: center; width: 1.25rem; height: 1.25rem; padding: 0;
  color: var(--adt-muted); background: none; border: 0; border-radius: 999px; cursor: pointer;
}
.adt-chip-remove .adt-icon { width: 0.8rem; height: 0.8rem; }
.adt-chip-remove:hover { color: var(--adt-fg); background: color-mix(in srgb, var(--adt-accent) 15%, transparent); }
.adt-chip-clear { font: inherit; font-size: 0.875em; color: var(--adt-accent); background: none; border: 0; padding: 0.25rem; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
:where(.adt-filter-chips, .adt-filter-panel) :focus-visible { outline: 2px solid var(--adt-accent); outline-offset: 2px; }

/* Toolbar, export and import (Livewire views) */
.adt-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.625rem; }
.adt-export { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
.adt-import {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.625rem 1rem; padding: 0.75rem 1rem;
  background: var(--adt-surface); border: 1px solid var(--adt-line); border-radius: var(--adt-radius); box-shadow: var(--adt-shadow);
}
.adt-import--idle { display: contents; }
.adt-import-title { font-weight: 600; }
.adt-import-file { color: var(--adt-muted); overflow-wrap: anywhere; }
.adt-import-buttons { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-left: auto; }
.adt-import label { display: inline-flex; align-items: center; gap: 0.5rem; }
.adt-import input[type="file"] { font: inherit; font-size: 0.9375em; color: var(--adt-muted); }
.adt-import input[type="file"]::file-selector-button {
  font: inherit; color: var(--adt-fg); background: var(--adt-bg); border: 1px solid var(--adt-line);
  border-radius: var(--adt-control-radius); height: var(--adt-control-height); padding: 0 0.875rem; margin-right: 0.75rem; cursor: pointer;
}
.adt-import [aria-disabled="true"] { opacity: 0.45; cursor: progress; }
.adt-field-error { color: var(--adt-danger); margin: 0; flex-basis: 100%; }
.adt-import-report { flex-basis: 100%; padding: 0.625rem 1rem; border: 1px solid var(--adt-line); border-radius: var(--adt-radius); }
.adt-import-report p, .adt-import-report ul { margin: 0.25rem 0; }
.adt-import-report ul { max-height: 12rem; overflow: auto; padding-left: 1.25rem; color: var(--adt-muted); }

/* Row actions */
.adt-table .adt-actions { white-space: nowrap; width: 1%; text-align: right; }
.adt-action {
  font: inherit; font-size: 0.875em; font-weight: 500; color: var(--adt-fg); background: var(--adt-bg);
  border: 1px solid var(--adt-line); border-radius: var(--adt-control-radius); height: 2rem; padding: 0 0.7rem; cursor: pointer;
}
.adt-action + .adt-action { margin-left: 0.375rem; }
.adt-action:hover { background: var(--adt-hover); border-color: color-mix(in srgb, var(--adt-line) 50%, var(--adt-muted)); }
.adt-action[aria-disabled="true"] { opacity: 0.45; cursor: not-allowed; }
.adt-action { display: inline-flex; align-items: center; justify-content: center; gap: 0.375rem; vertical-align: middle; }
.adt-action--icon { width: 2rem; padding: 0; color: var(--adt-muted); }
.adt-action--icon:hover { color: var(--adt-fg); }
.adt-action--danger { color: var(--adt-danger); border-color: color-mix(in srgb, var(--adt-danger) 30%, var(--adt-line)); }
.adt-action--danger:hover { color: var(--adt-danger); background: color-mix(in srgb, var(--adt-danger) 8%, var(--adt-bg)); }
.adt-row-menu { position: relative; display: inline-block; margin-left: 0.375rem; vertical-align: middle; }
.adt-row-menu > summary { list-style: none; }
.adt-row-menu > summary::-webkit-details-marker { display: none; }
.adt-row-menu .adt-menu-list { top: 100%; text-align: left; white-space: nowrap; }
/* placed by placeMenu(): over the page, so the table's scroll box and the cards do not cut it off */
.adt-row-menu[open] > .adt-menu-list { position: fixed; top: var(--adt-menu-y); left: var(--adt-menu-x); right: auto; margin: 0; }
.adt-menu-item--danger, .adt-menu-item--danger:hover { color: var(--adt-danger); }
.adt-menu-item .adt-icon { color: var(--adt-muted); }
.adt-menu-item--danger .adt-icon { color: inherit; }

/* Responsive collapse / modal: a details button per row (hidden while every column fits) */
.adt-table .adt-expand-cell { display: none; width: 2.75rem; padding-right: 0; }
.adt-expand {
  display: inline-flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; padding: 0;
  color: var(--adt-accent); background: none; border: 0; border-radius: 999px; cursor: pointer;
}
.adt-expand .adt-icon { width: 1.25rem; height: 1.25rem; }
.adt-expand:hover { background: color-mix(in srgb, var(--adt-accent) 10%, transparent); }
.adt-row--expanded, .adt-row--expanded:hover { background: var(--adt-hover); }
.adt-row--expanded > td { border-bottom-color: transparent; }
.adt-table .adt-detail > td { padding: 0 1rem 0.75rem 3.75rem; background: var(--adt-hover); }
.adt-detail-list { display: grid; margin: 0; }
.adt-detail-item {
  display: none; grid-template-columns: minmax(7rem, 35%) 1fr; gap: 0.75rem; align-items: center;
  padding: 0.5rem 0; border-bottom: 1px solid var(--adt-line);
}
.adt-detail-item:last-child { border-bottom: 0; }
.adt-detail-item dt { color: var(--adt-muted); font-size: 0.875em; font-weight: 600; }
.adt-detail-item dd { margin: 0; overflow-wrap: anywhere; }
.adt-detail-actions { display: flex; flex-wrap: wrap; gap: 0.375rem; }
.adt-detail-actions .adt-action + .adt-action { margin-left: 0; }
@media (max-width: 960px) {
  :is(.adt-responsive--collapse, .adt-responsive--modal) .adt-table :is(th, td).adt-col--p3 { display: none; }
  :is(.adt-responsive--collapse, .adt-responsive--modal) .adt-has-p3 .adt-expand-cell { display: table-cell; }
  .adt-responsive--collapse .adt-detail-item.adt-col--p3 { display: grid; }
}
@media (max-width: 640px) {
  :is(.adt-responsive--collapse, .adt-responsive--modal) .adt-table :is(th, td).adt-col--p2 { display: none; }
  :is(.adt-responsive--collapse, .adt-responsive--modal) .adt-has-p2 .adt-expand-cell { display: table-cell; }
  .adt-responsive--collapse .adt-detail-item.adt-col--p2 { display: grid; }
  .adt-table .adt-detail > td { padding-left: 1rem; }
}
@media (min-width: 961px) { :is(.adt-responsive--collapse, .adt-responsive--modal) .adt-table:not(.adt-has-detail) .adt-detail { display: none; } }

/* Responsive auto: columns hidden while the table does not fit (measured, any width) */
.adt-responsive--auto .adt-table :is(th, td) { white-space: nowrap; }
.adt-responsive--auto .adt-table .adt-detail > td { white-space: normal; }
.adt-responsive--auto .adt-table :is(th, td).adt-auto-hidden { display: none; }
.adt-responsive--auto .adt-table.adt-auto-collapsed .adt-expand-cell { display: table-cell; }
.adt-responsive--auto .adt-detail-item.adt-auto-shown { display: grid; }
.adt-responsive--auto .adt-table:not(.adt-auto-collapsed):not(.adt-has-detail) .adt-detail { display: none; }

/* Child rows (detail): the button is always there; hidden-column items still follow the screen width */
.adt-table.adt-has-detail .adt-expand-cell { display: table-cell; }
.adt-detail-content { padding: 0.75rem 0 0.25rem; overflow-wrap: anywhere; }
.adt-detail-list:has(+ .adt-detail-content) > .adt-detail-item:last-child { border-bottom: 1px solid var(--adt-line); }
.adt-detail-status { color: var(--adt-muted); }
.adt-detail-status--error { color: var(--adt-danger, #b42318); }
.adt-dialog .adt-detail-content { padding: 0.75rem 1.25rem 1.25rem; border-top: 1px solid var(--adt-line); }

/* Virtual scrolling: spacer rows stand in for the rows out of view */
.adt-table .adt-spacer > td { padding: 0; border: 0; }
.adt-virtual .adt-table tbody .adt-row > td { white-space: nowrap; }

/* A queued task (Livewire: large export, queued bulk action) */
.adt-task {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.625rem; margin-bottom: 0.75rem; padding: 0.625rem 0.875rem;
  color: var(--adt-fg); background: var(--adt-surface); border: 1px solid var(--adt-line); border-radius: var(--adt-radius);
}
.adt-task--ready { border-color: color-mix(in srgb, var(--adt-accent) 40%, var(--adt-line)); }
.adt-task--failed { color: var(--adt-danger); border-color: currentColor; }
.adt-task-spinner {
  width: 1rem; height: 1rem; border: 2px solid var(--adt-line); border-top-color: var(--adt-accent); border-radius: 999px;
  animation: adt-spin 0.8s linear infinite;
}
@keyframes adt-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .adt-task-spinner { animation: none; } }
.adt-task-link { font-weight: 600; color: var(--adt-accent); }
.adt-task-close {
  display: inline-flex; margin-left: auto; padding: 0.25rem; color: var(--adt-muted); background: none; border: 0;
  border-radius: var(--adt-control-radius); cursor: pointer;
}
.adt-task-close:hover { color: var(--adt-fg); background: var(--adt-hover); }

/* Editing in place (editable columns, onEdit) */
.adt-table td.adt-editable { position: relative; }
.adt-edit {
  display: inline-flex; align-items: center; justify-content: center; width: 1.6rem; height: 1.6rem; margin-left: 0.375rem; padding: 0;
  vertical-align: middle; color: var(--adt-muted); background: none; border: 0; border-radius: var(--adt-control-radius); cursor: pointer;
  opacity: 0; transition: opacity 0.1s;
}
.adt-edit .adt-icon { width: 0.9rem; height: 0.9rem; }
.adt-row:hover .adt-edit, .adt-edit:focus-visible { opacity: 1; }
.adt-edit:hover { color: var(--adt-accent); background: color-mix(in srgb, var(--adt-accent) 10%, transparent); }
@media (hover: none) { .adt-edit { opacity: 1; } }
.adt-table td.adt-editing { padding-top: 0.3rem; padding-bottom: 0.3rem; }
.adt-editor { display: grid; gap: 0.25rem; min-width: 7rem; }
.adt-edit-control {
  width: 100%; min-width: 0; height: 2.1rem; padding: 0 0.5rem; font: inherit; color: var(--adt-fg); background: var(--adt-bg);
  border: 1px solid var(--adt-accent); border-radius: var(--adt-control-radius); box-shadow: 0 0 0 3px color-mix(in srgb, var(--adt-accent) 18%, transparent);
}
.adt-num .adt-edit-control { text-align: right; }
.adt-edit-control:focus { outline: none; }
.adt-edit-control[aria-invalid="true"] { border-color: var(--adt-danger); box-shadow: 0 0 0 3px color-mix(in srgb, var(--adt-danger) 18%, transparent); }
.adt-edit-control[aria-busy="true"] { opacity: 0.7; }
.adt-edit-message:empty { display: none; }
.adt-edit-message { font-size: 0.8em; color: var(--adt-muted); white-space: normal; text-align: left; }
.adt-edit-message[role="alert"] { color: var(--adt-danger); }

/* Resizable and movable columns (resizableColumns, reorderableColumns) */
.adt-table.adt-fixed-layout { table-layout: fixed; }
.adt-fixed-layout :is(th, td):not(.adt-actions) { overflow: hidden; text-overflow: ellipsis; overflow-wrap: anywhere; }
.adt-fixed-layout :is(th, td).adt-actions { width: var(--adt-actions-width, auto); }
/* A column without a width of its own in the fixed layout: a usable width, never the leftover nothing */
.adt-fixed-layout th.adt-th--auto { width: var(--adt-column-width, 10rem); }
.adt-table th[data-column-id] { position: relative; }
.adt-resize {
  position: absolute; top: 0; right: 0; bottom: 0; width: 0.625rem; cursor: col-resize; touch-action: none; z-index: 1;
}
.adt-resize::after {
  content: ""; position: absolute; top: 25%; bottom: 25%; right: 0.25rem; width: 2px; border-radius: 1px;
  background: var(--adt-line); transition: background-color 0.1s;
}
.adt-resize:hover::after, .adt-resize:focus-visible::after, .adt-resizing .adt-resize:hover::after { top: 0; bottom: 0; background: var(--adt-accent); }
.adt-resize:focus-visible { outline: none; }
.adt-resizing, .adt-resizing * { cursor: col-resize !important; user-select: none; }
.adt-table th[draggable="true"] { cursor: grab; }
.adt-table th[draggable="true"] .adt-sort { cursor: pointer; }
.adt-table th.adt-dragging { opacity: 0.5; }
.adt-table th.adt-drop-before { box-shadow: inset 3px 0 0 var(--adt-accent); }
.adt-table th.adt-drop-after { box-shadow: inset -3px 0 0 var(--adt-accent); }
.adt-column-item { display: flex; align-items: center; gap: 0.125rem; clear: both; padding-right: 0.25rem; border-radius: var(--adt-control-radius); }
.adt-column-item:hover { background: var(--adt-hover); }
.adt-columns > fieldset .adt-column-item label { flex: 1; min-width: 0; }
.adt-columns > fieldset .adt-column-item label:hover { background: none; }
.adt-move {
  display: inline-flex; align-items: center; justify-content: center; width: 1.5rem; height: 1.5rem; padding: 0;
  color: var(--adt-muted); background: none; border: 0; border-radius: var(--adt-control-radius); cursor: pointer;
}
.adt-move + .adt-move { margin-left: 0; }
.adt-move:hover { color: var(--adt-fg); background: var(--adt-hover); }
.adt-move[aria-disabled="true"] { opacity: 0.35; cursor: default; }
.adt-move .adt-icon { width: 0.95rem; height: 0.95rem; }
.adt-columns-reset { display: block; width: 100%; margin-top: 0.375rem; padding: 0.4rem 0.5rem; text-align: left; color: var(--adt-accent); background: none; border: 0; border-top: 1px solid var(--adt-line); cursor: pointer; font: inherit; }
.adt-columns-reset:hover { background: var(--adt-hover); }
@media (max-width: 640px) {
  .adt-responsive--cards .adt-resize { display: none; }
  .adt-responsive--cards .adt-table.adt-fixed-layout { table-layout: auto; }
}

/* Fixed columns (fixedColumns): cells stay in place while the table scrolls sideways */
/* As strong as the resize handle's and the editor's position: relative (th[data-column-id], td.adt-editable), and after them, so a pinned cell stays sticky. */
.adt-table :is(th, td).adt-pin { position: sticky; z-index: 1; background: var(--adt-surface); }
.adt-table thead .adt-pin { z-index: 4; }
.adt-table tfoot .adt-pin { background: var(--adt-surface); }
.adt-row:hover > .adt-pin { background: var(--adt-hover); }
.adt-row--expanded > .adt-pin { background: var(--adt-hover); }
.adt-row--selected > .adt-pin { background: var(--adt-selected); }
.adt-pin--edge-start { box-shadow: 8px 0 8px -8px rgb(16 24 40 / 0.18); }
.adt-pin--edge-end { box-shadow: -8px 0 8px -8px rgb(16 24 40 / 0.18); }
:is(.adt-sticky-header, .adt-scroll-y) .adt-table thead .adt-pin--edge-start { box-shadow: inset 0 -1px 0 var(--adt-line), 8px 0 8px -8px rgb(16 24 40 / 0.18); }
:is(.adt-sticky-header, .adt-scroll-y) .adt-table thead .adt-pin--edge-end { box-shadow: inset 0 -1px 0 var(--adt-line), -8px 0 8px -8px rgb(16 24 40 / 0.18); }

/* Responsive scroll: the table keeps its columns and scrolls sideways */
@media (max-width: 640px) {
  .adt-responsive--scroll .adt-table :is(th, td) { white-space: nowrap; }
}

/* Details dialog (responsive: 'modal') */
.adt-dialog {
  width: min(36rem, calc(100vw - 2rem)); max-height: calc(100dvh - 2rem); padding: 0; overflow: auto;
  color: var(--adt-fg); background: var(--adt-bg); border: 1px solid var(--adt-line); border-radius: calc(var(--adt-radius) + 4px);
  box-shadow: 0 24px 48px -12px rgb(16 24 40 / 0.25);
}
.adt-dialog::backdrop { background: rgb(16 24 40 / 0.45); }
.adt-dialog-head {
  position: sticky; top: 0; display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: 1rem 1.25rem; background: var(--adt-bg); border-bottom: 1px solid var(--adt-line);
}
.adt-dialog-title { margin: 0; font-size: 1.125rem; font-weight: 600; line-height: 1.3; }
.adt-dialog-close {
  display: inline-flex; align-items: center; justify-content: center; flex: none; width: 2rem; height: 2rem; padding: 0;
  color: var(--adt-muted); background: none; border: 0; border-radius: var(--adt-control-radius); cursor: pointer;
}
.adt-dialog-close:hover { color: var(--adt-fg); background: var(--adt-hover); }
.adt-dialog .adt-detail-list { padding: 0.25rem 1.25rem 1rem; }
.adt-dialog .adt-detail-item { display: grid; padding: 0.75rem 0; }
.adt-dialog :focus-visible { outline: 2px solid var(--adt-accent); outline-offset: 2px; }

/* Printing: only the table, without the controls */
@media print {
  .adt-bar, .adt-selection, .adt-import, .adt-notice, .adt-dialog, .adt-table .adt-select, .adt-table .adt-actions, .adt-table .adt-expand-cell, .adt-table .adt-detail { display: none !important; }
  .adt-table :is(th, td)[class*="adt-col--p"] { display: table-cell !important; }
  .adt-scroll { overflow: visible; border: 0; box-shadow: none; }
  .adt-table th, .adt-table td { padding: 0.35rem 0.5rem; }
  .adt-sort-mark { display: none; }
  .adt-row { break-inside: avoid; }
}

/* Medium screens: the bars stack, the pager moves under the info */
@media (max-width: 860px) {
  .adt-bottom { justify-content: center; }
  .adt-bottom .adt-bar-start, .adt-bottom .adt-bar-end { width: 100%; justify-content: center; margin-left: 0; }
}

/* Narrow screens: full-width controls, a compact pager and each row as a card. */
@media (max-width: 640px) {
  .adt-bar { padding: 0.75rem; }
  .adt-top .adt-bar-start, .adt-top .adt-bar-end { width: 100%; margin-left: 0; }
  .adt-top .adt-bar-end { justify-content: flex-start; }
  .adt-feature--search { flex: 1 1 10rem; max-width: none; }
  /* The menu buttons (columns, filters, tools) as icons; the name stays for screen readers */
  :is(.adt-columns > summary, .adt-filter-open) { position: relative; justify-content: center; width: var(--adt-control-height); padding: 0; }
  .adt-columns > summary::after { display: none; }
  :is(.adt-columns > summary, .adt-filter-open) .adt-summary-text {
    position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
  }
  :is(.adt-columns > summary, .adt-filter-open) .adt-badge { position: absolute; top: -0.45rem; right: -0.45rem; }
  /* The selection bar ("select all N matching", bulk actions) under the rows, held at the
     bottom of the window while they scroll by: a bar above the table is out of sight there */
  .adt-selection { order: 1; position: sticky; bottom: 0.75rem; z-index: 6; flex-wrap: nowrap; box-shadow: 0 10px 28px -6px rgb(16 24 40 / 0.28); }
  /* One line: the count and a select with the choices (bulk actions, select all matching, clear) */
  .adt-selection > button { display: none; }
  .adt-selection .adt-selection-menu { display: block; flex: 0 1 auto; min-width: 0; max-width: 60%; margin-left: auto; }
  .adt-bottom { order: 2; }
  .adt-paging { gap: 0.25rem; }
  /* Compact pager when pages are left out: arrows, the ends and the current page (‹ 1 … 7 … 48 ›) */
  .adt-page { min-width: 2.25rem; height: 2.25rem; }
  .adt-page-numbers:has(> .adt-page-gap) > .adt-page:not([aria-current]):not(:first-child):not(:last-child) { display: none; }
  .adt-page-gap { min-width: 1rem; }

  /* Cards (responsive: 'cards', the default): each row a card, each cell with its header */
  .adt-responsive--cards .adt-table .adt-pin { position: static; box-shadow: none; background: transparent; }
  .adt-responsive--cards .adt-table thead :is(th, td) { position: static; box-shadow: none; background: transparent; }
  .adt-responsive--cards .adt-scroll { border: 0; background: transparent; box-shadow: none; }
  .adt-responsive--cards:not(.adt-scroll-y) .adt-scroll { overflow: visible; } /* with scrollY the cards scroll in their box */
  .adt-responsive--cards .adt-table, .adt-responsive--cards .adt-table tbody, .adt-responsive--cards .adt-table tr, .adt-responsive--cards .adt-table td { display: block; width: 100%; }
  /* No column names above the cards (every card names its values); "select all" stays, with its text */
  .adt-responsive--cards .adt-table thead { display: block; }
  .adt-responsive--cards .adt-table thead tr { display: flex; padding: 0 0 0.75rem; }
  .adt-responsive--cards .adt-table thead tr:not(:has(.adt-select-all)) { display: none; }
  .adt-responsive--cards .adt-table thead :is(th, td):not(.adt-select) { display: none; }
  .adt-responsive--cards .adt-table thead th.adt-select { display: block; width: auto !important; padding: 0 0 0 calc(0.875rem + 1px); border: 0; font-size: 1em; letter-spacing: normal; text-transform: none; }
  .adt-responsive--cards .adt-select-all-text { display: inline; }
  .adt-responsive--cards .adt-row, .adt-responsive--cards .adt-empty { border: 1px solid var(--adt-line); border-radius: var(--adt-radius); margin-bottom: 0.75rem; background: var(--adt-surface); overflow: hidden; }
  .adt-responsive--cards .adt-table td { display: grid; grid-template-columns: minmax(7rem, 40%) 1fr; gap: 0.75rem; padding: 0.625rem 0.875rem; border-bottom: 1px solid var(--adt-line); overflow-wrap: anywhere; }
  .adt-responsive--cards .adt-table td.adt-num { text-align: left; }
  .adt-responsive--cards .adt-table tfoot, .adt-responsive--cards .adt-table tfoot tr, .adt-responsive--cards .adt-table tfoot :is(th, td) { display: block; width: 100%; }
  .adt-responsive--cards .adt-table tfoot tr { border: 1px solid var(--adt-line); border-radius: var(--adt-radius); background: var(--adt-surface); overflow: hidden; }
  .adt-responsive--cards .adt-table tfoot td { display: grid; grid-template-columns: minmax(7rem, 40%) 1fr; gap: 0.75rem; padding: 0.625rem 0.875rem; }
  .adt-responsive--cards .adt-table tfoot td::before { content: attr(data-label); color: var(--adt-muted); font-size: 0.875em; }
  .adt-responsive--cards .adt-table tfoot :is(td.adt-select, td.adt-actions, td.adt-expand-cell, td:empty) { display: none; }
  .adt-responsive--cards .adt-table td::before { content: attr(data-label); font-weight: 600; font-size: 0.875em; color: var(--adt-muted); }
  .adt-responsive--cards .adt-table td.adt-select, .adt-responsive--cards .adt-empty td { display: block; width: 100%; }
  /* Child rows: the ⊕ button sits in the card's top corner */
  .adt-responsive--cards .adt-has-detail .adt-row { position: relative; }
  .adt-responsive--cards .adt-table tbody td.adt-expand-cell { position: absolute; top: 0.3rem; right: 0.375rem; display: block; width: auto; padding: 0; border: 0; }
  .adt-responsive--cards .adt-table tbody td.adt-expand-cell::before { content: none; }
  .adt-responsive--cards .adt-has-detail .adt-row > td:nth-child(2) { padding-right: 2.75rem; }
  .adt-responsive--cards .adt-row--expanded { margin-bottom: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
  .adt-responsive--cards .adt-table .adt-detail { margin-bottom: 0.75rem; border: 1px solid var(--adt-line); border-top: 0; border-radius: 0 0 var(--adt-radius) var(--adt-radius); background: var(--adt-hover); }
  .adt-responsive--cards .adt-table .adt-detail > td { display: block; padding: 0 0.875rem 0.75rem; border: 0; background: transparent; }
  .adt-responsive--cards .adt-table .adt-detail > td::before { content: none; }
  .adt-responsive--cards .adt-table caption { padding: 0 0 0.5rem; }
  .adt-responsive--cards .adt-table td.adt-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.375rem; width: 100%; white-space: normal; text-align: left; }
  .adt-responsive--cards .adt-table td.adt-actions::before { flex: 0 0 calc(40% - 0.375rem); min-width: 7rem; margin-right: 0.375rem; }
  .adt-responsive--cards .adt-table td.adt-actions .adt-action + .adt-action { margin-left: 0; }
  .adt-responsive--cards .adt-table th.adt-actions { display: none; }
  .adt-responsive--cards .adt-table td.adt-select::before, .adt-responsive--cards .adt-empty td::before { content: none; }
}