/* Shared styles used by both web and mobile hosts.
   Mobile-specific overrides live in PaceBudget.Mobile/wwwroot/css/app.css.
   Web-specific styles stay in PaceBudget.Web/wwwroot/. */

:root {
    --color-surface: #F7F6F3;
    --color-card: #FFFFFF;
    --color-card-border: #E5DDD5;
    --color-muted: #94908A;
    --color-brand: #4A7C28;
    --color-brand-light: #EBF3E4;
    --color-elevated: #FFFFFF;
    --color-primary: #1f2937;
    --color-secondary: #374151;
    --color-tertiary: #4b5563;
    --color-subtle: #f3f4f6;
    --color-pace-good: #2E7D32;
    --color-pace-good-light: #E8F5E9;
    --color-pace-good-lighter: #C8E6C9;
    --color-pace-good-mid: #558B2F;
    --color-pace-tight: #E65100;
    --color-pace-tight-light: #FFF8E1;
    --color-pace-tight-lighter: #FFECB3;
    --color-pace-tight-mid: #F57F17;
    --color-pace-over: #880E4F;
    --color-pace-over-light: #FCE4EC;
    --color-pace-over-lighter: #F8BBD0;
    --color-pace-over-mid: #AD1457;
    --color-alert-error-bg: #fef2f2;
    --color-alert-success-bg: #f0fdf4;
    --color-alert-warning-bg: #fffbeb;
    --color-alert-warning-text: #92400e;
    --color-alert-info-bg: #eff6ff;
    --color-alert-info-text: #1e40af;
}

.dark {
    --color-surface: #1C1B19;
    --color-card: #2A2826;
    --color-card-border: #3D3A36;
    --color-muted: #8A8681;
    --color-brand: #5B9A33;
    --color-brand-light: #2A3525;
    --color-elevated: #242220;
    --color-primary: #E8E5E0;
    --color-secondary: #D4D0CA;
    --color-tertiary: #B8B4AD;
    --color-subtle: #3D3A36;
    --color-pace-good: #43A047;
    --color-pace-good-light: #1C2E1C;
    --color-pace-good-lighter: #243524;
    --color-pace-good-mid: #6BA33A;
    --color-pace-tight: #FF7043;
    --color-pace-tight-light: #332B1C;
    --color-pace-tight-lighter: #3D3322;
    --color-pace-tight-mid: #FFB300;
    --color-pace-over: #E91E63;
    --color-pace-over-light: #3B1C26;
    --color-pace-over-lighter: #4A2433;
    --color-pace-over-mid: #F06292;
    --color-alert-error-bg: #3B1C1C;
    --color-alert-success-bg: #1C2E1C;
    --color-alert-warning-bg: #332B1C;
    --color-alert-warning-text: #fcd34d;
    --color-alert-info-bg: #1C2433;
    --color-alert-info-text: #93c5fd;
}