/* Tokens del sistema de diseño ONTA Admin v2.
   Los componentes se escriben SOLO contra estas variables, nunca con colores literales.
   data-theme en <html> siempre gana sobre prefers-color-scheme. */

:root {
  --accent: #E8590C; --accent-strong: #C94E0A; --accent-soft: #FDEDE1; --on-accent: #FFFFFF;
  --canvas: #F7F6F3; --card: #FFFFFF; --sunken: #F1EFEB; --border: #E8E4DD; --border-strong: #D9D3C9;
  --ink-1: #1F1D1B; --ink-2: #6B6560; --ink-3: #9C958D;
  --success: #1F9254; --success-soft: #E4F5EB;
  --danger: #C7402B; --danger-soft: #FBEAE6;
  --warning: #A9660A; --warning-soft: #FCEFD8;
  --info: #2F6FB3; --info-soft: #E3EEF9;
  --shadow: 0 1px 2px rgba(31,29,27,.04), 0 8px 24px -12px rgba(31,29,27,.10);
  --shadow-lg: 0 2px 6px rgba(31,29,27,.06), 0 24px 48px -16px rgba(31,29,27,.22);
  --overlay: rgba(31,29,27,.38);
  --chart-1: #E8590C; --chart-2: #55565A; --chart-3: #1F9254; --chart-4: #2F6FB3; --chart-5: #A9660A; --chart-6: #9C958D;

  --radius-sm: 8px; --radius: 12px; --radius-lg: 16px;
  --font-ui: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-brand: 'Plus Jakarta Sans', var(--font-ui);
  --sidebar-w: 248px; --topbar-h: 60px;
  --row-pad: .7rem; /* densidad cómoda; .compacta la reduce */
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --accent: #FF7A3D; --accent-strong: #FF9459; --accent-soft: rgba(255,122,61,.16); --on-accent: #1A120C;
    --canvas: #16130F; --card: #201C17; --sunken: #2A241D; --border: #383029; --border-strong: #4A4037;
    --ink-1: #F4F1EC; --ink-2: #B6AFA5; --ink-3: #7C766C;
    --success: #3FCB86; --success-soft: rgba(63,203,134,.14);
    --danger: #FF6B57; --danger-soft: rgba(255,107,87,.14);
    --warning: #F0B429; --warning-soft: rgba(240,180,41,.14);
    --info: #6AA8F0; --info-soft: rgba(106,168,240,.14);
    --shadow: 0 1px 2px rgba(0,0,0,.3), 0 8px 24px -12px rgba(0,0,0,.5);
    --shadow-lg: 0 2px 6px rgba(0,0,0,.35), 0 24px 48px -16px rgba(0,0,0,.6);
    --overlay: rgba(0,0,0,.55);
    --chart-1: #FF7A3D; --chart-2: #B6AFA5; --chart-3: #3FCB86; --chart-4: #6AA8F0; --chart-5: #F0B429; --chart-6: #7C766C;
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --accent: #FF7A3D; --accent-strong: #FF9459; --accent-soft: rgba(255,122,61,.16); --on-accent: #1A120C;
  --canvas: #16130F; --card: #201C17; --sunken: #2A241D; --border: #383029; --border-strong: #4A4037;
  --ink-1: #F4F1EC; --ink-2: #B6AFA5; --ink-3: #7C766C;
  --success: #3FCB86; --success-soft: rgba(63,203,134,.14);
  --danger: #FF6B57; --danger-soft: rgba(255,107,87,.14);
  --warning: #F0B429; --warning-soft: rgba(240,180,41,.14);
  --info: #6AA8F0; --info-soft: rgba(106,168,240,.14);
  --shadow: 0 1px 2px rgba(0,0,0,.3), 0 8px 24px -12px rgba(0,0,0,.5);
  --shadow-lg: 0 2px 6px rgba(0,0,0,.35), 0 24px 48px -16px rgba(0,0,0,.6);
  --overlay: rgba(0,0,0,.55);
  --chart-1: #FF7A3D; --chart-2: #B6AFA5; --chart-3: #3FCB86; --chart-4: #6AA8F0; --chart-5: #F0B429; --chart-6: #7C766C;
  color-scheme: dark;
}

:root.compacta { --row-pad: .42rem; }