:root {
  /* NGU Official Brand Tokens (from knowledge transfer) */
  --ngu-bg: #F8F9FB;
  --ngu-surface: #FFFFFF;

  --ngu-primary: #2453FF;
  --ngu-primary-dark: #1A3EDC;
  --ngu-primary-light: #5B7BFF;

  /* Secondary/Accent mapping for marketing pages */
  --ngu-secondary: #1A3EDC; /* use darker primary as secondary by default */
  --ngu-accent: #5B7BFF;    /* lighter primary as accent */

  --ngu-success: #28C76F;
  --ngu-success-dark: #1EA45A;

  --ngu-warning: #FFA800;
  --ngu-warning-dark: #E69500;

  --ngu-danger: #EA5455;
  --ngu-danger-dark: #D03E3F;

  --ngu-text: #212529;
  --ngu-text-muted: #4B5563;
}

/* Map existing sidebar variables to NGU tokens, without changing base files */
:root {
  --primary-color: var(--ngu-primary);
  --primary-dark: var(--ngu-primary-dark);
  --primary-light: var(--ngu-primary-light);
  --secondary-color: var(--ngu-secondary);
  --accent-color: var(--ngu-accent);

  --success-color: var(--ngu-success);
  --warning-color: var(--ngu-warning);
  --danger-color: var(--ngu-danger);
  --info-color: #0ea5e9;

  --gray-50: #f8fafc;
  --gray-100: #f1f5f9;
  --gray-200: #e2e8f0;
  --gray-300: #cbd5e1;
  --gray-400: #94a3b8;
  --gray-500: #64748b;
  --gray-600: #475569;
  --gray-700: #334155;
  --gray-800: #1e293b;
  --gray-900: #0f172a;

  /* Map marketing/common text variables */
  --text-dark: var(--ngu-text);
  --text-light: var(--ngu-text-muted);
  --border: var(--gray-200);

  /* Auth/login page variable aliases */
  --primary: var(--ngu-primary);
  --primary-dark: var(--ngu-primary-dark);
  --accent: var(--ngu-primary-light);
  --danger: var(--ngu-danger);
  --warning: var(--ngu-warning);
  --light: var(--ngu-bg);
  --dark: var(--text-dark);
  --text-primary: var(--ngu-text);
  --text-secondary: var(--ngu-text-muted);
}

/* Global application background/text alignment to tokens */
html, body {
  background-color: var(--ngu-bg);
  color: var(--ngu-text);
}

/* Super Admin Variables */
:root {
  --sa-bg: var(--ngu-bg);
  --sa-surface: var(--ngu-surface);
  --sa-primary: var(--ngu-primary);
  --sa-primary-dark: var(--ngu-primary-dark);
  --sa-primary-light: var(--ngu-primary-light);
  --sa-secondary: var(--ngu-secondary);
  --sa-accent: var(--ngu-accent);
  --sa-success: var(--ngu-success);
  --sa-warning: var(--ngu-warning);
  --sa-danger: var(--ngu-danger);
  --sa-text: var(--ngu-text);
  --sa-text-muted: var(--ngu-text-muted);
  --sa-border: var(--gray-200);
  --sa-border-light: var(--gray-100);
  --sa-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --sa-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
  --sa-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  --sa-radius-sm: 0.375rem;
  --sa-radius-md: 0.5rem;
  --sa-radius-lg: 0.75rem;
  --sa-spacing-xs: 0.25rem;
  --sa-spacing-sm: 0.5rem;
  --sa-spacing-md: 1rem;
  --sa-spacing-lg: 1.5rem;
  --sa-spacing-xl: 2rem;
  --sa-font-size-sm: 0.875rem;
  --sa-font-size-base: 1rem;
  --sa-font-size-lg: 1.125rem;
  --sa-font-size-xl: 1.25rem;
  --sa-font-size-2xl: 1.5rem;
  --sa-transition: all 0.2s ease-in-out;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}