/* Shared design tokens: spacing/typography/radius/shadow scale.
   Used by admin panel, SmmDadPrime and NebulaCircuit. Additive only —
   defines a new --space-, --font-, --radius- and --shadow- scale that
   component files (buttons/forms/cards/modals/misc) build on. */

:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;

  --font-size-xs: 0.75rem;
  --font-size-sm: 0.85rem;
  --font-size-base: 0.95rem;
  --font-size-lg: 1.1rem;
  --font-size-xl: 1.35rem;
  --font-size-2xl: 1.75rem;

  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  --line-height-tight: 1.2;
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.7;

  --letter-spacing-tight: -0.01em;
  --letter-spacing-normal: 0;
  --letter-spacing-wide: 0.04em;

  --ds-radius-sm: var(--admin-radius-sm, var(--radius-md, 8px));
  --ds-radius-md: var(--admin-radius-md, var(--radius-lg, 12px));
  --ds-radius-lg: var(--admin-radius-lg, 16px);

  --ds-shadow-sm: var(--admin-shadow, var(--shadow-sm, 0 1px 3px rgba(15, 23, 42, 0.08)));
  --ds-shadow-md: 0 6px 18px rgba(15, 23, 42, 0.1);
  --ds-shadow-lg: 0 16px 40px rgba(15, 23, 42, 0.16);

  /* Plain semantic names, aliasing whichever theme's real tokens are in
     scope (admin/SmmDadPrime/NebulaCircuit each define their own --admin-,
     --brand- and --nc- set) so component CSS can reference one vocabulary. */
  --primary: var(--admin-primary, var(--brand-primary, var(--primary-color, var(--nc-signal, #2563eb))));
  --secondary: var(--admin-text-muted, var(--text-muted, var(--nc-muted, #64748b)));
  --success: var(--admin-success, var(--success-color, #16a34a));
  --warning: var(--admin-warn, var(--warning-color, #d97706));
  --danger: var(--admin-danger, var(--danger-color, #dc2626));
  --info: var(--admin-info, var(--info-color, #0284c7));
  --surface: var(--admin-surface, var(--surface-color, var(--nc-panel, #ffffff)));
  --background: var(--admin-bg, var(--bg-color, var(--nc-bg, #f4f7fb)));
}

[data-theme="dark"] {
  --ds-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.35);
  --ds-shadow-md: 0 6px 18px rgba(0, 0, 0, 0.4);
  --ds-shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.5);
}