/**
 * SAS Panel - Premium Theme Variables
 * Modern, cohesive design system with consistent colors, spacing, and shadows.
 */

:root {
    /* === Color Palette: Premium Indigo & Slate === */
    --primary-50: #eef2ff;
    --primary-100: #e0e7ff;
    --primary-400: #818cf8;
    --primary-500: #4f46e5;
    /* Deep Indigo - More Premium than standard Blue */
    --primary-600: #4338ca;
    --primary-700: #3730a3;

    --secondary-50: #f8fafc;
    --secondary-100: #eff6ff;
    --secondary-400: #94a3b8;
    --secondary-500: #64748b;
    /* Main Secondary */
    --secondary-600: #475569;
    --secondary-900: #1e293b;
    /* Darker Slate for Text */

    /* === Semantic Colors (Softer, Modern Tones) === */
    --success-bg: #ecfdf5;
    --success-text: #065f46;
    --success-main: #10b981;

    --danger-bg: #fef2f2;
    --danger-text: #991b1b;
    --danger-main: #f43f5e;
    /* Rose instead of Red */

    --warning-bg: #fffbeb;
    --warning-text: #92400e;
    --warning-main: #f59e0b;

    --info-bg: #f0f9ff;
    --info-text: #075985;
    --info-main: #0ea5e9;

    /* === Gradients (Premium & Subtle) === */
    /* Smoother, consistent angles */
    --gradient-primary: linear-gradient(135deg, #4f46e5 0%, #3730a3 100%);
    --gradient-success: linear-gradient(135deg, #10b981 0%, #047857 100%);
    --gradient-danger: linear-gradient(135deg, #f43f5e 0%, #be123c 100%);
    --gradient-warning: linear-gradient(135deg, #f59e0b 0%, #b45309 100%);
    --gradient-info: linear-gradient(135deg, #0ea5e9 0%, #0284c7 100%);
    --gradient-glass: linear-gradient(145deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.75));
    --gradient-header: linear-gradient(135deg, #4338ca 0%, #312e81 100%);
    /* Deep consistent header */

    /* === Layout & Shapes === */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 20px;
    /* Increased for modern look */
    --radius-xl: 28px;
    --radius-full: 9999px;

    /* === Shadows (Soft & Layered) === */
    --shadow-sm: 0 2px 4px rgba(148, 163, 184, 0.1);
    --shadow-md: 0 4px 12px rgba(148, 163, 184, 0.15);
    --shadow-lg: 0 10px 25px -5px rgba(148, 163, 184, 0.2);
    --shadow-xl: 0 20px 40px -10px rgba(148, 163, 184, 0.25);
    --shadow-glow: 0 0 20px rgba(79, 70, 229, 0.25);
    /* Primary Glow */

    /* === Typography === */
    --font-heading: 'Noto Naskh Arabic', 'Segoe UI', sans-serif;
    --font-body: 'Noto Naskh Arabic', 'Segoe UI', Tahoma, sans-serif;

    /* === Backgrounds === */
    --bg-app: #f1f5f9;
    /* Light Blue/Gray */
    --bg-card: #ffffff;
    --bg-hover: #f8fafc;
}

/* Dark Mode Hooks (Prepared for future) */
[data-theme="dark"] {
    --bg-app: #0f172a;
    --bg-card: #1e293b;
    --secondary-900: #f1f5f9;
    /* Light Text */
    --secondary-500: #94a3b8;
}