@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;600;700&display=swap');

:root {
    --color-primary: #056283;
    --color-primary-hover: #044a61;
    --color-primary-soft: #e6f2f6;
    --color-primary-mid: #0a7ba3;
    --color-bg: #ffffff;
    --color-surface: #ffffff;
    --color-surface-2: #f8fafc;
    --color-text: #111827;
    --color-muted: #64748b;
    --color-border: #e5e7eb;
    --color-success: #15803d;
    --color-success-soft: #dcfce7;
    --color-warning: #b45309;
    --color-warning-soft: #fef3c7;
    --color-danger: #b91c1c;
    --color-danger-soft: #fee2e2;
    --color-info: #056283;
    --color-info-soft: #e6f2f6;
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.07), 0 1px 2px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 10px 30px rgba(15, 23, 42, 0.08), 0 2px 8px rgba(15, 23, 42, 0.05);
    --shadow-lg: 0 18px 40px rgba(15, 23, 42, 0.12);
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;
    --sidebar-width: 260px;
    --header-height: 64px;
    --topnav-height: 64px;
    --nav-h: 64px;
    --font-sans: 'Open Sans', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
    --brand: #056283;
    --brand-light: #e6f2f6;
    --brand-mid: #0a7ba3;
    --brand-dark: #044a61;
    --brand-rgb: 5, 98, 131;
    --transition: 180ms ease;
}