/* CashMyGadget Design Tokens */
:root {
    /* Brand Colors (Constant in both themes usually, but matching doc) */
    --primary: #FF8A00;
    --primary-hover: #F97316;
    --primary-active: #EA580C;

    /* Light Theme (Default) */
    --bg-app: #F6F8FB;
    --bg-card: #FFFFFF;
    --bg-navbar: #FFFFFF;
    --bg-sidebar: #1E293B;
    --bg-modal: #FFFFFF;
    --glass-bg-sidebar: rgba(30, 41, 59, 0.95);
    --glass-bg-navbar: rgba(255, 255, 255, 0.85);
    --glass-bg-card: rgba(255, 255, 255, 0.7);
    --glass-border: rgba(255, 255, 255, 0.4);

    --secondary: #334155;
    --success: #10B981;
    --warning: #F59E0B;
    --danger: #EF4444;
    --info: #3B82F6;
    --purple: #8B5CF6;
    --cyan: #06B6D4;

    --text-primary: #111827;
    --text-secondary: #6B7280;
    --text-disabled: #9CA3AF;

    --border-color: #E5E7EB;
    --divider-color: #F1F5F9;

    --shadow-card: 0 8px 24px rgba(15,23,42,.08);
    --shadow-card-hover: 0 12px 30px rgba(15,23,42,.12);
    --shadow-navbar: 0 1px 3px rgba(0,0,0,0.05);

    /* Border Radius */
    --radius-sm: 8px;
    --radius-button: 10px;
    --radius-input: 10px;
    --radius-md: 12px;
    --radius-table: 14px;
    --radius-card: 16px;
    --radius-chart: 16px;
    --radius-modal: 18px;
    --radius-badge: 999px;

    /* Typography */
    --font-family: 'Inter', 'Roboto', sans-serif;
    
    /* Animation Speeds */
    --transition-fast: 150ms ease;
    --transition-normal: 200ms ease;
    --transition-slow: 250ms ease;
    --transition-chart: 500ms ease;
}

[data-theme="dark"] {
    --bg-app: #0F172A;
    --bg-card: #1E293B;
    --bg-navbar: #111827;
    --bg-sidebar: #111827;
    --bg-modal: #1E293B;
    --glass-bg-sidebar: rgba(17, 24, 39, 0.85);
    --glass-bg-navbar: rgba(17, 24, 39, 0.85);
    --glass-bg-card: rgba(30, 41, 59, 0.7);
    --glass-border: rgba(255, 255, 255, 0.08);

    --primary-hover: #FB923C;

    --success: #22C55E;
    --warning: #FBBF24;
    --danger: #F87171;
    --info: #38BDF8;
    --purple: #A78BFA;
    --cyan: #22D3EE;

    --text-primary: #F8FAFC;
    --text-secondary: #CBD5E1;
    --text-disabled: #94A3B8;

    --border-color: #334155;
    --divider-color: #1E293B;

    --shadow-card: 0 10px 30px rgba(0,0,0,.45);
    --shadow-card-hover: 0 15px 40px rgba(0,0,0,.60);
    --shadow-navbar: 0 1px 3px rgba(0,0,0,0.5);
}

/* Base Body Styles */
body {
    background-color: var(--bg-app) !important;
    color: var(--text-primary) !important;
    font-family: var(--font-family) !important;
    transition: background-color var(--transition-normal), color var(--transition-normal);
}