/* Color Variables for Light and Dark Theme */

:root {
    /* Light Theme Colors */
    --background-color-light: #ffffff;  /* Light background color */
    --text-color-light: #333333;        /* Dark text color for light theme */
    --primary-color-light: #4CAF50;     /* Primary color for buttons and links */
    --secondary-color-light: #f1f1f1;   /* Secondary background color */
}

[data-theme='dark'] {
    /* Dark Theme Colors */
    --background-color-dark: #121212;   /* Dark background color */
    --text-color-dark: #ffffff;         /* Light text color for dark theme */
    --primary-color-dark: #BB86FC;      /* Primary color for buttons and links */
    --secondary-color-dark: #3700B3;    /* Secondary background color */
}