/* CSS Variables - Colors and Sizes (Updated for Blue Theme) */
:root {
  /* Primary Brand Colors - Blue Theme */
  --primary-color: #164789;
  --primary-light: #2763B4;
  --primary-dark: #0f3461;
  --accent-color: #3b7dd6;
  
  /* Secondary Colors */
  --secondary-color: #2763B4;
  --secondary-light: #4a8fd9;
  --secondary-dark: #1a4d8f;
  
  /* Utility Colors */
  --success-color: #28a745;
  --danger-color: #dc3545;
  --warning-color: #ffc107;
  --info-color: #17a2b8;
  
  /* Neutral Colors */
  --light-color: #f8f9fa;
  --dark-color: #1e293b;
  --white: #ffffff;
  --black: #000000;
  
  /* Background Colors */
  --bg-primary: #ffffff;
  --bg-secondary: #f1f5f9;
  --bg-dark: #0f172a;
  
  /* Text Colors */
  --text-primary: #1e293b;
  --text-secondary: #64748b;
  --text-light: #ffffff;
  
  /* Size Variables */
  --font-size-small: 0.875rem;
  --font-size-base: 1rem;
  --font-size-large: 1.25rem;
  --font-size-xl: 1.5rem;
  --font-size-xxl: 2rem;
  
  /* Spacing */
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 1.5rem;
  --spacing-xl: 2rem;
  --spacing-xxl: 3rem;
  
  /* Border Radius */
  --border-radius-sm: 0.25rem;
  --border-radius-md: 0.5rem;
  --border-radius-lg: 1rem;
  --border-radius-full: 50%;
  
  /* Container Widths */
  --container-sm: 540px;
  --container-md: 720px;
  --container-lg: 960px;
  --container-xl: 1140px;
}