/* /src/assets/css/theme.css
   Design tokens: colors, radii, spacing, typography.
   Update --brand-* to match Aisin palette when you have exact hex codes. */
:root {
  /* Brand */
  --brand-primary: #0f3a8a; /* placeholder deep blue */
  --brand-primary-hover: #1e40af; /* slightly lighter blue for hover */
  --brand-accent:  #0ea5e9; /* placeholder light blue */
  
  /* Semantic */
  --bg:        #f9fafb;
  --bg-hover:  #f3f4f6; /* slightly darker for hover */
  --card:      #ffffff;
  --text:      #111827;
  --muted:     #6b7280;
  --border:    #e5e7eb;
  --border-hover: #d1d5db; /* slightly darker for hover */
  --success:   #10b981;
  --warning:   #f59e0b;
  --danger:    #b91c1c;
  --danger-bg: #fef2f2;
  
  /* Radii */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px; /* Add this since it's used in the CSS */
  
  /* Spacing */
  --space-0: 0;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  
  /* Shadows */
  --shadow-1: 0 10px 15px rgba(0,0,0,.03);
  --shadow-2: 0 12px 24px rgba(0,0,0,.08);
  
  /* Typography */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --text-xs: 12px;
  --text-sm: 13px;
  --text-md: 14px;
  --text-lg: 16px;
  --text-xl: 18px;
}