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

:root {
    --font-primary: 'Outfit', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    
    /* Harmonious HSL Tailored Colors */
    --fluent-primary: #5c5cd6; /* Sleek Slate Blue / Violet */
    --fluent-primary-rgb: 92, 92, 214;
    --fluent-primary-light: #7c7cf0;
    --fluent-accent: #00f2fe; /* Glowing Cyan */
    --fluent-accent-rgb: 0, 242, 254;
    --fluent-secondary: #4facfe; /* Deep sky blue */
    
    /* Theme Light */
    --fluent-bg: #f3f4f9;
    --fluent-bg-alt: rgba(255, 255, 255, 0.75); /* Glassmorphism light */
    --fluent-bg-pure: #ffffff;
    --fluent-border: rgba(92, 92, 214, 0.12);
    
    --fluent-text: #1e1e2f;
    --fluent-text-muted: #6c757d;
    --fluent-text-light: #ffffff;
    
    /* Alerts and tools */
    --color-ping: #2ecc71;
    --color-wol: #e67e22;
    --color-dhcp: #3498db;
    --color-wmi: #9b59b6;
    
    /* Shadows and Glows */
    --fluent-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.08);
    --fluent-shadow-soft: 0 4px 12px 0 rgba(0, 0, 0, 0.03);
    --fluent-glow: 0 0 20px rgba(92, 92, 214, 0.2);
    
    --fluent-radius: 16px;
    --fluent-radius-small: 10px;
    
    --fluent-transition: 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

[data-bs-theme="dark"] {
    --fluent-bg: #0b0c16;
    --fluent-bg-alt: rgba(18, 20, 38, 0.65); /* Glassmorphism dark */
    --fluent-bg-pure: #0f1122;
    --fluent-border: rgba(255, 255, 255, 0.06);
    
    --fluent-text: #e2e8f0;
    --fluent-text-muted: #94a3b8;
    
    --fluent-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
    --fluent-shadow-soft: 0 4px 12px 0 rgba(0, 0, 0, 0.2);
    --fluent-glow: 0 0 20px rgba(0, 242, 254, 0.15);
}