/* Custom font import for a professional look */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap');

/* Define semantic color variables for light and dark mode */
:root {
    /* Light Mode (default) */
    --color-background: #f7f7f9;     /* Light gray page background */
    --color-card: #ffffff;           /* White card background */
    --color-text-primary: #1f2937;   /* Dark text */
    --color-text-secondary: #4b5563; /* Gray text */
    --color-border: #e5e7eb;         /* Light border */
    --color-primary: #4f46e5;        /* Indigo */
    --color-primary-hover: #4338ca;  /* Darker Indigo */
}

.dark {
    /* Dark Mode */
    --color-background: #111827;     /* Dark gray page background */
    --color-card: #1f2937;           /* Lighter dark card */
    --color-text-primary: #f9fafb;   /* Off-white text */
    --color-text-secondary: #9ca3af; /* Lighter gray text */
    --color-border: #374151;         /* Dark border */
    /* Primary colors can stay the same or be adjusted */
    --color-primary: #4f46e5;        
    --color-primary-hover: #6366f1;  /* Lighter Indigo hover for dark bg */
}

body {
    font-family: 'Inter', sans-serif;
}

/* Fix for Lucide icon vertical alignment */
[data-lucide] {
    vertical-align: middle;
}