import { StrictMode } from 'react';
import { createRoot } from 'react-dom/client';
import '@mantine/core/styles.css';
import '@mantine/notifications/styles.css';
import '@mantine/dates/styles.css';
import './styles.css';
import { App } from './app/app';

window.__USER_MANAGEMENT_BRANDING__ = {
  appName: 'Ethiopian Maritime Licence',
  organizationName: 'Ethiopian Maritime Authority',
  logoSrc: '/assets/emaLogo.jpg',
  logoAlt: 'EMA Logo',
  homePath: '/',
  moduleBasePath: '/user-management',
  backToAppPath: '/dashboard',
  backToAppLabel: 'Back to dashboard',
  cssVariables: {
    '--primary': '#2563eb',
    '--primary-foreground': 'oklch(0.99 0 0)',
    '--secondary': '#1d4ed8',
    '--secondary-foreground': 'oklch(0.99 0 0)',
    '--accent': '#60a5fa',
    '--accent-foreground': 'oklch(0.99 0 0)',
    '--ring': '#2563eb',
    '--sidebar': 'oklch(0.21 0.04 265)',
    '--sidebar-foreground': 'oklch(0.96 0.01 255)',
    '--sidebar-primary': '#3b82f6',
    '--sidebar-primary-foreground': 'oklch(0.99 0 0)',
    '--sidebar-accent': '#60a5fa',
    '--sidebar-accent-foreground': 'oklch(0.96 0.01 255)',
    '--sidebar-border': 'oklch(0.3 0.04 265)',
    '--sidebar-ring': '#3b82f6',
    '--brand-shell-bg': '#eff6ff',
    '--brand-sidebar-bg': '#0f172a',
    '--brand-sidebar-border': '#1e293b',
    '--brand-sidebar-muted': '#94a3b8',
    '--brand-primary-solid': '#2563eb',
    '--brand-primary-hover': '#1d4ed8',
    '--brand-hero-from': '#2563eb',
    '--brand-hero-to': '#1e40af',
  },
};

const root = document.getElementById('root');
if (!root) throw new Error('Root element not found');

createRoot(root).render(
  <StrictMode>
    <App />
  </StrictMode>,
);