/* Floxsystem UI — September 2026. Opt-in presentation only.
   No column widths, visibility, selection, API or business rules are changed. */
:root[data-flox-ui="202609"] {
  --erp-brand: #47c7eb;
  --erp-bg: #f4f7fb;
  --erp-surface: #ffffff;
  --erp-soft: #f8fafc;
  --erp-text: #172033;
  --erp-muted: #56647a;
  --erp-border: #dce4ee;
  --erp-input-border: #8391a4;
  --erp-ink: #062f3d;
  --erp-link: #086782;
  --erp-focus: #087591;
  --erp-shadow: 0 4px 20px rgb(23 32 51 / 5%);
  --erp-font: "Segoe UI", Roboto, system-ui, -apple-system, sans-serif;
  color-scheme: light;
}
:root[data-flox-ui="202609"][data-theme="dark"],
:root[data-flox-ui="202609"]:not([data-theme])[data-flox-theme="dark"] {
  --erp-bg: #0b1020;
  --erp-surface: #111827;
  --erp-soft: #182133;
  --erp-text: #edf2ff;
  --erp-muted: #b3bed1;
  --erp-border: #35405a;
  --erp-input-border: #73829c;
  --erp-link: #8adff4;
  --erp-focus: #8adff4;
  --erp-shadow: 0 4px 20px rgb(0 0 0 / 15%);
  color-scheme: dark;
}
html[data-flox-ui="202609"] body {
  --flox-bg: var(--erp-bg); --flox-surface: var(--erp-surface);
  --flox-surface-soft: var(--erp-soft); --flox-text: var(--erp-text);
  --flox-muted: var(--erp-muted); --flox-border: var(--erp-border);
  --flox-primary: var(--erp-brand); --flox-primary-contrast: var(--erp-ink);
  font-family: var(--erp-font);
  -webkit-font-smoothing: antialiased;
}
html[data-flox-ui="202609"] :where(button, a, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--erp-focus);
  outline-offset: 3px;
  scroll-margin-block: 88px 24px;
}
html[data-flox-ui="202609"] :where(input, textarea)::placeholder { opacity: 1; }
html[data-flox-ui="202609"] :where(button, a, input, select, textarea) { -webkit-tap-highlight-color: transparent; }
html[data-flox-ui="202609"] input { accent-color: var(--erp-link); }
html[data-flox-ui="202609"] :where(table, .summary-strip, .grid-footer) { font-variant-numeric: tabular-nums; }
html[data-flox-ui="202609"] body[data-erp-appearance="standard"] {
  --page: var(--erp-bg); --panel: var(--erp-surface); --surface: var(--erp-surface);
  --soft: var(--erp-soft); --surface-soft: var(--erp-soft);
  --text: var(--erp-text); --muted: var(--erp-muted); --border: var(--erp-border);
  --input: var(--erp-input-border); --primary: var(--erp-brand); --color-primary-text: var(--erp-ink);
  --grid-card: var(--erp-surface); --grid-text: var(--erp-text); --grid-muted: var(--erp-muted);
  --grid-border: var(--erp-border); --grid-soft: var(--erp-soft); --shadow: var(--erp-shadow);
  background-color: var(--erp-bg);
  color: var(--erp-text);
}
html[data-flox-ui="202609"] body[data-erp-appearance="standard"] :where(.panel, .grid-panel) {
  border-color: var(--erp-border); border-radius: 16px; box-shadow: var(--erp-shadow);
}
html[data-flox-ui="202609"] body[data-erp-appearance="standard"] :where(.header, .grid-toolbar) {
  background: var(--erp-surface); border-color: var(--erp-border);
}
html[data-flox-ui="202609"] body[data-erp-appearance="standard"] :where(.header h1, .page-head h1) {
  letter-spacing: -.025em; line-height: 1.25;
}
html[data-flox-ui="202609"] body[data-erp-appearance="standard"] :where(.header .primary, .grid-toolbar .primary) {
  background: var(--erp-brand); color: var(--erp-ink); border-color: var(--erp-brand); box-shadow: none;
}
html[data-flox-ui="202609"] body[data-erp-appearance="standard"] :where(table.data, .orders-table) th {
  background: var(--erp-soft); color: var(--erp-muted);
}
html[data-flox-ui="202609"] body[data-erp-appearance="standard"] :where(table.data, .orders-table) td {
  border-color: var(--erp-border);
}
html[data-flox-ui="202609"] body[data-erp-appearance="standard"] :where(.flox-ui-dialog, .flox-ui-toast) {
  border-color: var(--erp-border); color: var(--erp-text); background: var(--erp-surface);
}
@media (prefers-reduced-motion: reduce) {
  html[data-flox-ui="202609"] *, html[data-flox-ui="202609"] *::before, html[data-flox-ui="202609"] *::after {
    animation-duration: .01ms !important; animation-iteration-count: 1 !important;
    transition-duration: .01ms !important; scroll-behavior: auto !important;
  }
}
@media (forced-colors: active) {
  html[data-flox-ui="202609"] :where(button, input, select, textarea) { border: 1px solid ButtonText; }
}