/*
 * SphericalOne — Official Design Tokens (single source of truth)
 * Loaded early; later layers should reference these variables.
 */
:root {
  --so-primary: #226DB4;
  --so-primary-dark: #185487;
  --so-primary-light: #EAF4FB;
  --so-navy: #0F1C2E;

  --so-bg: #F7F9FC;
  --so-surface: #FFFFFF;

  --so-text: #172033;
  --so-text-secondary: #667085;
  --so-text-muted: #98A2B3;

  --so-border: #E4E7EC;
  --so-divider: #EAECF0;

  --so-success: #12B76A;
  --so-success-light: #ECFDF3;
  --so-warning: #F79009;
  --so-warning-light: #FFFAEB;
  --so-danger: #F04438;
  --so-danger-light: #FEF3F2;
  --so-info: #2E90FA;
  --so-info-light: #EFF8FF;

  --so-radius-sm: 6px;
  --so-radius-md: 10px;
  --so-radius-lg: 12px;
  --so-radius-xl: 16px;

  --so-shadow-sm: 0 1px 2px rgba(23, 32, 51, 0.04);
  --so-shadow-md: 0 2px 8px rgba(23, 32, 51, 0.06);
  --so-focus-ring: 0 0 0 3px rgba(34, 109, 180, 0.18);

  /* Bridge to existing --crm-* / --sphere-* / Bootstrap */
  --crm-primary: var(--so-primary);
  --crm-primary-hover: var(--so-primary-dark);
  --crm-primary-soft: var(--so-primary-light);
  --crm-navy: var(--so-navy);
  --crm-bg: var(--so-bg);
  --crm-surface: var(--so-surface);
  --crm-text: var(--so-text);
  --crm-muted: var(--so-text-secondary);
  --crm-muted-light: var(--so-text-muted);
  --crm-border: var(--so-border);
  --crm-divider: var(--so-divider);
  --crm-success: var(--so-success);
  --crm-success-soft: var(--so-success-light);
  --crm-warning: var(--so-warning);
  --crm-warning-soft: var(--so-warning-light);
  --crm-danger: var(--so-danger);
  --crm-danger-soft: var(--so-danger-light);
  --crm-info: var(--so-info);
  --crm-info-soft: var(--so-info-light);
  --crm-radius-sm: var(--so-radius-sm);
  --crm-radius-md: var(--so-radius-md);
  --crm-radius-lg: var(--so-radius-lg);
  --crm-shadow-sm: var(--so-shadow-sm);
  --crm-shadow-md: var(--so-shadow-md);
  --crm-brand-gradient: var(--so-primary);
  --crm-row-hover: var(--so-primary-light);
  --crm-surface-muted: var(--so-bg);

  --sphere-primary: var(--so-primary);
  --sphere-primary-soft: var(--so-primary-light);
  --sphere-border: var(--so-border);
  --sphere-muted: var(--so-text-secondary);
  --sphere-success: var(--so-success);
  --sphere-warning: var(--so-warning);
  --sphere-danger: var(--so-danger);
  --sphere-radius: var(--so-radius-md);

  --bs-primary: var(--so-primary);
  --bs-primary-rgb: 34, 109, 180;
  --bs-link-color: var(--so-primary);
  --bs-link-hover-color: var(--so-primary-dark);
  --bs-border-color: var(--so-border);
  --bs-body-bg: var(--so-bg);
  --bs-body-color: var(--so-text);
}