/* Tabulator theme for energy_router_web -- neutral light look matching styles.css tokens.
   Loaded after tabulator.min.css. Tables fill their .section and scroll inside when wider. */

.tabulator {
  display: inline-block;          /* shrink to the columns' width ... */
  width: auto !important;         /* (Tabulator sets width:100% inline) */
  max-width: 100% !important;     /* ... but never wider than the section: scroll inside instead */
  vertical-align: top;
  background: var(--surface, #fff);
  color: var(--text, #1f2933);
  border: 1px solid var(--border, #dfe4ea);
  border-radius: var(--radius, 8px);
  overflow: hidden;
  font-family: var(--font, system-ui, sans-serif);
  font-size: 13px;
}

/* Tabulator's inner holders must not force the full width either */
.tabulator .tabulator-tableholder,
.tabulator .tabulator-table { width: auto !important; max-width: 100% !important; }
.tabulator .tabulator-header { min-width: 100%; }

/* .tab-fill: a table that fills its container (layout: 'fitColumns') and wraps cell text */
.tabulator.tab-fill { display: block; width: 100% !important; }
.tabulator.tab-fill .tabulator-tableholder, .tabulator.tab-fill .tabulator-table { width: 100% !important; }
.tabulator.tab-fill .tabulator-row .tabulator-cell { white-space: normal; overflow-wrap: normal; }
.tabulator.tab-fill .tabulator-row .tabulator-cell .reading { white-space: normal; }

/* Header */
.tabulator .tabulator-header {
  background: var(--surface-2, #f8fafc);
  color: var(--text, #1f2933);
  border-bottom: 1px solid var(--border, #dfe4ea);
  font-weight: 600;
}
.tabulator .tabulator-header .tabulator-col {
  background: transparent;
  border-right: 1px solid var(--border, #dfe4ea);
}
.tabulator .tabulator-header .tabulator-col:last-child { border-right: none; }
.tabulator .tabulator-header .tabulator-col .tabulator-col-content { padding: 9px 10px; }
.tabulator .tabulator-header .tabulator-col .tabulator-col-title {
  font-size: 12.5px;
  font-weight: 600;
  color: #334155;
  letter-spacing: .1px;
}
.tabulator .tabulator-header .tabulator-col.tabulator-sortable:hover { background: #eef2f7; }
.tabulator .tabulator-header .tabulator-col.tabulator-sortable .tabulator-col-title { padding-right: 18px; }
.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-sorter .tabulator-arrow { border-bottom-color: #94a3b8; }
.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort="ascending"] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow { border-bottom-color: var(--accent, #2563eb); }
.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort="descending"] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow { border-top-color: var(--accent, #2563eb); }
.tabulator .tabulator-header .tabulator-col .tabulator-header-filter { margin-top: 6px; }
.tabulator .tabulator-header .tabulator-col .tabulator-header-filter input,
.tabulator .tabulator-header .tabulator-col .tabulator-header-filter select {
  width: 100%;
  height: 28px;
  padding: 0 8px;
  background: var(--surface, #fff);
  color: var(--text, #1f2933);
  border: 1px solid var(--border-strong, #c7cfd8);
  border-radius: 6px;
  font-size: 12px;
  font-weight: 400;
}
.tabulator .tabulator-header .tabulator-col .tabulator-header-filter input:focus,
.tabulator .tabulator-header .tabulator-col .tabulator-header-filter select:focus {
  outline: none;
  border-color: var(--accent, #2563eb);
  box-shadow: var(--focus, 0 0 0 3px rgba(37, 99, 235, .25));
}
.tabulator .tabulator-header .tabulator-frozen.tabulator-frozen-left { border-right: 2px solid var(--border, #dfe4ea); }
.tabulator .tabulator-header .tabulator-frozen.tabulator-frozen-right { border-left: 2px solid var(--border, #dfe4ea); }

/* Body */
.tabulator .tabulator-tableholder { background: var(--surface, #fff); }
.tabulator .tabulator-tableholder .tabulator-placeholder .tabulator-placeholder-contents {
  color: var(--muted, #64748b);
  font-size: 13px;
  font-weight: 400;
}
.tabulator-row {
  background: var(--surface, #fff);
  border-bottom: 1px solid #eef2f7;
  min-height: 34px;
}
.tabulator-row.tabulator-row-even { background: #fbfcfd; }
.tabulator-row:hover { background: #f1f5f9; }
.tabulator-row.tabulator-selected { background: var(--accent-soft, #dbeafe); }
.tabulator-row.tabulator-selected:hover { background: #cfe0fc; }
.tabulator-row .tabulator-cell {
  padding: 7px 10px;
  color: var(--text, #1f2933);
  border-right: 1px solid #f1f5f9;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.tabulator-row .tabulator-cell:last-of-type { border-right: none; }
.tabulator-row .tabulator-cell.tabulator-frozen.tabulator-frozen-left { border-right: 2px solid var(--border, #dfe4ea); }
.tabulator-row .tabulator-cell.tabulator-frozen.tabulator-frozen-right { border-left: 2px solid var(--border, #dfe4ea); }
.tabulator-row .tabulator-cell.tabulator-editing {
  border: 1px solid var(--accent, #2563eb);
  padding: 0;
  background: #fff;
}
.tabulator-row .tabulator-cell.tabulator-editing input,
.tabulator-row .tabulator-cell.tabulator-editing select,
.tabulator-row .tabulator-cell.tabulator-editing textarea {
  height: 100%;
  min-height: 32px;
  padding: 4px 8px;
  border: none;
  border-radius: 0;
  box-shadow: none;
  background: #fff;
  font-size: 13px;
}
.tabulator-row .tabulator-cell.tabulator-editing textarea { min-height: 60px; }
/* editable cells get a faint pencil hint on hover */
.tabulator-row .tabulator-cell.tabulator-editable:hover { background: #eef2ff; cursor: text; }

/* Buttons rendered inside cells */
.tabulator-row .tabulator-cell .btn { height: 26px; padding: 0 10px; font-size: 12.5px; }
.tabulator-row .tabulator-cell:has(> .btn) { text-align: center; }
.tabulator-row .tabulator-cell:has(> .reading) { white-space: normal; }

/* Footer */
.tabulator .tabulator-footer {
  background: var(--surface-2, #f8fafc);
  border-top: 1px solid var(--border, #dfe4ea);
  color: var(--text, #1f2933);
  padding: 6px 8px;
  font-weight: 400;
}

/* Scrollbars */
.tabulator .tabulator-tableholder { scrollbar-width: thin; scrollbar-color: #cbd5e1 transparent; }
.tabulator .tabulator-tableholder::-webkit-scrollbar { width: 10px; height: 10px; }
.tabulator .tabulator-tableholder::-webkit-scrollbar-track { background: transparent; }
.tabulator .tabulator-tableholder::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 10px; border: 2px solid #fff; }
.tabulator .tabulator-tableholder::-webkit-scrollbar-thumb:hover { background: #94a3b8; }