/* Design Tokens & Global CSS Custom Properties */
:root {
    /* Brand Accent Gradients */
    --brand-primary: #8B5CF6;
    --brand-secondary: #3B82F6;
    --gradient-brand: linear-gradient(135deg, #8B5CF6 0%, #3B82F6 100%);
    --gradient-success: linear-gradient(135deg, #10B981 0%, #059669 100%);
    --gradient-danger: linear-gradient(135deg, #EF4444 0%, #DC2626 100%);

    /* Semantic State Colors */
    --state-success: #10B981;
    --state-warning: #F59E0B;
    --state-danger: #EF4444;
    --state-info: #0EA5E9;

    /* Base Palette (Light Theme Defaults) */
    --bg-light-base: #f8fafc;
    --bg-light-card: #ffffff;
    --border-light: #e2e8f0;
    --text-light-main: #0f172a;
    --text-light-muted: #64748b;

    /* Typography */
    --font-sans: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --font-urdu: 'Noto Nastaliq Urdu', 'Jameel Noori Nastaleeq', 'Urdu Typesetting', Tahoma, sans-serif;

    /* Transitions & Easing */
    --transition-fast: 0.15s ease;
    --transition-normal: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-smooth: 0.4s cubic-bezier(0.16, 1, 0.3, 1);

    /* Radii */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 20px;
    --radius-pill: 9999px;

    /* Shadows */
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 15px rgba(0, 0, 0, 0.05);
    --shadow-lg: 0 10px 25px rgba(0, 0, 0, 0.08);
    --shadow-brand: 0 4px 14px rgba(139, 92, 246, 0.3);
}