/* Frontend-only colors for the shared paginator. Preserve its responsive geometry. */
:root[data-style][data-theme] .wms-pager {
  --pager-bg: #edf1f5;
  --pager-border: var(--biz-theme-border, #cbd5e1);
  --pager-label: #52606d;
  --pager-input-bg: #fff;
  --pager-input-text: #223042;
  --pager-button-bg: #fff;
  --pager-button-text: #334155;
  --pager-control-border: #c4ccd8;
  --pager-hover-bg: #dfe6ee;
  --pager-hover-border: #a8b6c7;
  --pager-disabled-bg: #f4f6f9;
  --pager-disabled-border: #d7dee8;
  --pager-disabled-text: #98a6b7;
  --pager-current: #143d79;
}
:root[data-style][data-theme="light"] .wms-pager {
  --pager-bg: #eef3f9;
  --pager-button-bg: #e6ecf5;
  --pager-button-text: #2d4766;
  --pager-control-border: #c9d4e4;
  --pager-hover-bg: #dde6f2;
  --pager-hover-border: #bccadd;
  --pager-disabled-bg: #eff3f9;
  --pager-disabled-border: #d8e1ee;
  --pager-disabled-text: #90a0b4;
  --pager-current: #1f5da0;
}
:root[data-style][data-theme="light"] .inventory-stats-themed-card .wms-pager {
  --pager-bg: #edf1f5;
  --pager-button-bg: #fff;
  --pager-button-text: #334155;
  --pager-control-border: #c4ccd8;
  --pager-hover-bg: #dfe6ee;
  --pager-hover-border: #a8b6c7;
  --pager-disabled-bg: #f4f6f9;
  --pager-disabled-border: #d7dee8;
  --pager-disabled-text: #98a6b7;
  --pager-current: #143d79;
}
:root[data-style][data-theme="dark"] .wms-pager {
  --pager-bg: #172231;
  --pager-border: #334155;
  --pager-label: #a6b7cb;
  --pager-input-bg: #111827;
  --pager-input-text: #e2e8f0;
  --pager-button-bg: #273549;
  --pager-button-text: #dbeafe;
  --pager-control-border: #3f5672;
  --pager-hover-bg: #30425b;
  --pager-hover-border: #4e6a8d;
  --pager-disabled-bg: #1f2b3c;
  --pager-disabled-border: #32465f;
  --pager-disabled-text: #6f8198;
  --pager-current: #2563eb;
}
:root[data-style][data-theme="dark"] .inventory-stats-themed-card .wms-pager {
  --pager-bg: #222a35;
  --pager-border: #55606f;
  --pager-label: #cbd5e1;
  --pager-button-bg: #1a2230;
  --pager-button-text: #dbe4ef;
  --pager-control-border: #55606f;
  --pager-hover-bg: #273244;
  --pager-hover-border: #718096;
  --pager-disabled-bg: #151b27;
  --pager-disabled-border: #3d4756;
  --pager-disabled-text: #6f7b8d;
  --pager-current: #143d79;
}
:root[data-style][data-theme] .table-pagination-bar.wms-pager {
  background: var(--pager-bg);
  border-color: var(--pager-border);
}
:root[data-style][data-theme] .wms-pager :is(.wms-pager-size, .wms-pager-jump, .wms-pager-info) {
  color: var(--pager-label);
}
:root[data-style][data-theme] .wms-pager .wms-pager-button {
  background: var(--pager-button-bg);
  border-color: var(--pager-control-border);
  color: var(--pager-button-text);
}
:root[data-style][data-theme] .wms-pager .wms-pager-button:hover:not(:disabled) {
  background: var(--pager-hover-bg);
  border-color: var(--pager-hover-border);
  color: var(--pager-button-text);
}
:root[data-style][data-theme] .wms-pager .wms-pager-button[aria-current="page"] {
  background: var(--pager-current);
  border-color: var(--pager-current);
  color: #fff;
}
:root[data-style][data-theme] .wms-pager .wms-pager-button:disabled {
  background: var(--pager-disabled-bg);
  border-color: var(--pager-disabled-border);
  color: var(--pager-disabled-text);
  opacity: 1;
}
:root[data-style][data-theme] .wms-pager :is(.wms-pager-select, .wms-pager-input) {
  background: var(--pager-input-bg);
  border-color: var(--pager-control-border);
  color: var(--pager-input-text);
}
:root[data-style][data-theme] .wms-pager :is(.wms-pager-button, .wms-pager-select, .wms-pager-input):focus-visible {
  outline: 2px solid var(--pager-current);
  outline-offset: 2px;
}
/* All dialog pagers, including dynamically generated ones, share theme surfaces. */
:root[data-style][data-theme] :is(dialog, [role="dialog"], .dash-ua-modal-card) .wms-pager {
  --pager-dialog-surface: var(--surface-bg, #fff);
  --pager-dialog-text: var(--text, #0b1220);
  --pager-dialog-muted: var(--label, #475569);
  --pager-dialog-line: var(--line, #d7e0ea);
  --pager-bg: transparent;
  --pager-border: var(--pager-dialog-line);
  --pager-label: var(--pager-dialog-muted);
  --pager-input-bg: var(--pager-dialog-surface);
  --pager-input-text: var(--pager-dialog-text);
  --pager-button-bg: color-mix(in srgb, var(--pager-dialog-surface) 60%, transparent);
  --pager-button-text: var(--pager-dialog-text);
  --pager-control-border: var(--pager-dialog-line);
  --pager-hover-bg: color-mix(in srgb, var(--pager-dialog-text) 8%, var(--pager-dialog-surface));
  --pager-hover-border: color-mix(in srgb, var(--pager-dialog-text) 28%, var(--pager-dialog-line));
  --pager-disabled-bg: transparent;
  --pager-disabled-border: color-mix(in srgb, var(--pager-dialog-line) 55%, transparent);
  --pager-disabled-text: color-mix(in srgb, var(--pager-dialog-muted) 60%, var(--pager-dialog-surface));
  --pager-current: var(--pager-dialog-text);
}
:root[data-style][data-theme] :is(dialog, [role="dialog"], .dash-ua-modal-card) .table-pagination-bar.wms-pager {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
:root[data-style][data-theme] :is(dialog, [role="dialog"], .dash-ua-modal-card) .wms-pager .wms-pager-button[aria-current="page"] {
  background: var(--pager-current);
  border-color: var(--pager-current);
  color: var(--pager-dialog-surface);
}
/* Filters retain the solid control surfaces from the original dashboard. */
:root[data-style][data-theme] :is(.inventory-stats-filter-bar, .business-report-toolbar) {
  --btn-border: #cbd5e1;
  --btn-border-hover: #94a3b8;
  --btn-bg: #fff;
  --btn-text: #334155;
  --btn-primary-bg: #0f766e;
  --btn-primary-border: #0f766e;
  --btn-primary-hover: #0d635d;
}
:root[data-style][data-theme] :is(.inventory-stats-filter-bar, .business-report-toolbar) .business-report-select {
  background: #fff;
  color: #0f172a;
  border-color: #d7e0ea;
  box-shadow: none;
}
:root[data-style][data-theme="dark"] :is(.inventory-stats-filter-bar, .business-report-toolbar) {
  --btn-border: #3c3c3c;
  --btn-border-hover: #595959;
  --btn-bg: #252526;
  --btn-text: #d4d4d4;
  --btn-primary-bg: #0e639c;
  --btn-primary-border: #1177bb;
  --btn-primary-hover: #1177bb;
}
:root[data-style][data-theme="dark"] :is(.inventory-stats-filter-bar, .business-report-toolbar) .business-report-select {
  background: var(--btn-bg);
  color: var(--btn-text);
  border-color: var(--btn-border);
}
