/* theme.css */
:root {
    /* Primary Colors */
    --color-primary: #526177;
    --color-primary-light: #6a7a8f;
    --color-primary-dark: #3a485a;
    
    /* Accent Colors */
    --color-accent-red: #E67662;
    --color-accent-red-dark: #C65A48;
    --color-accent-orange: #F3A358;
    --color-accent-orange-dark: #E28C3A;
    --color-accent-green: #77C58E;
    --color-accent-green-light: #CDE9CE;
    
    /* Background Colors */
    --color-bg-primary: #f3f4f6; /* gray-100 */
    --color-bg-light: #ffffff;
    
    /* Text Colors */
    --color-text-primary: #374151; /* gray-700 */
    --color-text-secondary: #6b7280; /* gray-500 */
    --color-text-light: #f9fafb; /* gray-50 */
    
    /* Border Colors */
    --color-border: #d1d5db; /* gray-300 */
    
    /* State Colors */
    --color-success: #10b981; /* green-500 */
    --color-error: #ef4444; /* red-500 */
    --color-warning: #f59e0b; /* amber-500 */
    --color-info: #3b82f6; /* blue-500 */
}

/* Optional: Dark theme if you want to support it */
@media (prefers-color-scheme: dark) {
    :root {
        --color-primary: #3a485a;
        --color-primary-light: #526177;
        --color-bg-primary: #1f2937;
        --color-bg-light: #374151;
        --color-text-primary: #f9fafb;
        --color-text-secondary: #d1d5db;
    }
}