/* Tema chiaro per Tabulator sui token del design system (/css/site.css) —
   PLN-017 T-13, rework dal walkthrough: la griglia adotta il canvas cream
   dell'app. Struttura dei selettori invariata rispetto al tema precedente
   (stessi hook .tabulator*), cambiano solo superfici e colori; gli
   !important restano necessari per vincere sul foglio CDN tabulator.min.css
   caricato prima. Abbinamenti testuali verificati ≥ 4.5:1 (AA).
   PLN-017 T-05 (DA-02) — audit di scoping: NESSUNA regola su elementi bari
   (body/a/header/nav/footer/h1-h3/*) in questo foglio — ogni selettore è già
   radicato sotto la classe `.tabulator` (il mount #dataset-table dentro
   l'app), quindi non può intercettare la chrome di sistema di site.css:
   nessuna restrizione necessaria. Gli unici selettori di elemento (input,
   select, span) sono discendenti di `.tabulator …`. */

.tabulator {
  background-color: var(--bg-code) !important;
  border: 1px solid var(--rule) !important;
  color: var(--ink) !important;
}

.tabulator .tabulator-header {
  background-color: var(--bg-soft) !important;
  border-bottom: 1px solid var(--rule) !important;
}

.tabulator .tabulator-header .tabulator-col {
  background-color: var(--bg-soft) !important;
  border-right: 1px solid var(--rule-soft) !important;
  color: var(--ink) !important;
}

.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title {
  color: var(--ink) !important;
  font-weight: 600; /* font-semibold */
}

.tabulator .tabulator-header .tabulator-col:hover {
  background-color: color-mix(in srgb, var(--ink) 6%, var(--bg-soft)) !important;
}

.tabulator .tabulator-tableholder .tabulator-table .tabulator-row {
  background-color: var(--bg-code) !important;
  border-bottom: 1px solid var(--rule-soft) !important;
  color: var(--ink) !important;
}

.tabulator .tabulator-tableholder .tabulator-table .tabulator-row:hover {
  background-color: color-mix(in srgb, var(--ink) 5%, var(--bg-code)) !important;
}

.tabulator .tabulator-tableholder .tabulator-table .tabulator-row .tabulator-cell {
  border-right: 1px solid var(--rule-soft) !important;
  color: var(--ink) !important;
}

.tabulator .tabulator-footer {
  background-color: var(--bg-soft) !important;
  border-top: 1px solid var(--rule) !important;
  color: var(--ink) !important;
}

.tabulator .tabulator-footer .tabulator-page {
  background-color: var(--bg-code) !important;
  border: 1px solid var(--rule) !important;
  color: var(--ink) !important;
}

.tabulator .tabulator-footer .tabulator-page:hover {
  background-color: color-mix(in srgb, var(--ink) 6%, var(--bg-code)) !important;
}

.tabulator .tabulator-footer .tabulator-page.active {
  background-color: var(--ink) !important;
  border-color: var(--ink) !important;
  color: var(--bg) !important;
}

/* Header filters */
.tabulator .tabulator-header .tabulator-col .tabulator-header-filter input,
.tabulator .tabulator-header .tabulator-col .tabulator-header-filter select {
  background-color: var(--bg) !important;
  border: 1px solid var(--rule) !important;
  color: var(--ink) !important;
  border-radius: 0.375rem; /* rounded-md */
  padding: 0.25rem 0.5rem; /* py-1 px-2 */
}

.tabulator .tabulator-header .tabulator-col .tabulator-header-filter input:focus,
.tabulator .tabulator-header .tabulator-col .tabulator-header-filter select:focus {
  outline: none;
  box-shadow: 0 0 0 2px var(--focus-outline); /* anello di focus inchiostro */
  border-color: transparent;
}

/* Pagination controls */
.tabulator .tabulator-footer .tabulator-paginator {
  color: var(--ink) !important;
}

.tabulator .tabulator-footer .tabulator-page-size {
  color: var(--ink) !important;
}

.tabulator .tabulator-footer .tabulator-page-size select {
  background-color: var(--bg) !important;
  border: 1px solid var(--rule) !important;
  color: var(--ink) !important;
  border-radius: 0.375rem; /* rounded-md */
  padding: 0.25rem 0.5rem; /* py-1 px-2 */
}

/* Page size label text */
.tabulator .tabulator-footer .tabulator-page-size .tabulator-page-size-label {
  color: var(--ink) !important;
  margin-right: 0.5rem; /* mr-2 */
}

/* All pagination text elements */
.tabulator .tabulator-footer .tabulator-paginator .tabulator-page-counter {
  color: var(--ink) !important;
}

.tabulator .tabulator-footer .tabulator-paginator .tabulator-pages {
  color: var(--ink) !important;
}

/* Pagination info text */
.tabulator .tabulator-footer .tabulator-paginator span {
  color: var(--ink) !important;
}

/* Loading overlay */
.tabulator .tabulator-loader {
  background-color: color-mix(in srgb, var(--bg-code) 80%, transparent) !important;
  color: var(--ink) !important;
}

/* Placeholder text */
.tabulator .tabulator-placeholder {
  color: var(--ink-3) !important;
  background-color: var(--bg-code) !important;
}

/* Sort arrows */
.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-arrow {
  border-bottom-color: var(--ink) !important;
  border-top-color: var(--ink) !important;
}

/* Column resize handle */
.tabulator .tabulator-header .tabulator-col .tabulator-col-resize-handle {
  background-color: var(--rule) !important;
}

.tabulator .tabulator-header .tabulator-col .tabulator-col-resize-handle:hover {
  background-color: var(--ink-3-decor) !important;
}

/* Selection styling */
.tabulator .tabulator-tableholder .tabulator-table .tabulator-row.tabulator-selected {
  background-color: color-mix(in srgb, var(--mark) 18%, var(--bg-code)) !important;
}

.tabulator .tabulator-tableholder .tabulator-table .tabulator-row.tabulator-selected:hover {
  background-color: color-mix(in srgb, var(--mark) 24%, var(--bg-code)) !important;
}