/**
 * Alkasim Flow — Global Design System & CSS Variables
 * Strictly adheres to the project specification color palette and typography.
 */
@import url('https://fonts.googleapis.com/css2?family=Exo+2:wght@400;500;600;700;800&family=Poppins:wght@300;400;500;600;700&display=swap');

:root {
  /* Specification Primary Palette */
  --primary: #6366F1;
  --primary-hover: #4F46E5;
  --primary-dark: #172554;
  --primary-darker: #0F172A;
  --primary-light: #E0E7FF;
  --primary-lighter: #F5F7FF;
  --primary-shadow: rgba(99, 102, 241, 0.3);
  --primary-shadow-light: rgba(99, 102, 241, 0.15);

  /* Neutrals & Dark Tones */
  --white: #FFFFFF;
  --black: #172554;
  --hero-dark: #0F172A;
  --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;

  /* Typography */
  --font-family: 'Poppins', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  --font-heading: 'Exo 2', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

  /* Functional Status Colors */
  --success: #10B981;
  --success-light: #D1FAE5;
  --success-dark: #065F46;
  --warning: #F59E0B;
  --warning-light: #FEF3C7;
  --warning-dark: #92400E;
  --danger: #EF4444;
  --danger-light: #FEE2E2;
  --danger-dark: #991B1B;
  --info: #3B82F6;
  --info-light: #DBEAFE;
  --info-dark: #1E40AF;

  /* UI Tokens */
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 9999px;

  /* Shadows */
  --shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.05);
  --shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.1), 0 1px 2px rgba(15, 23, 42, 0.06);
  --shadow-md: 0 4px 6px -1px rgba(15, 23, 42, 0.1), 0 2px 4px -1px rgba(15, 23, 42, 0.06);
  --shadow-lg: 0 10px 15px -3px rgba(15, 23, 42, 0.1), 0 4px 6px -2px rgba(15, 23, 42, 0.05);
  --shadow-xl: 0 20px 25px -5px rgba(15, 23, 42, 0.1), 0 10px 10px -5px rgba(15, 23, 42, 0.04);
  --shadow-primary: 0 10px 25px -5px var(--primary-shadow);

  /* Transitions */
  --transition-fast: 0.15s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-normal: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 0.35s cubic-bezier(0.4, 0, 0.2, 1);

  /* Layering */
  --z-dropdown: 1000;
  --z-sticky: 1020;
  --z-fixed: 1030;
  --z-modal-backdrop: 1040;
  --z-modal: 1050;
  --z-toast: 1060;
  --z-tooltip: 1070;
}