/* =====================================================
   VOLTAVA BRAND VARIABLES
   Based on Voltava Brand Guidelines
   ===================================================== */

:root {
    /* Primary Brand Colors */
    --voltava-primary: #00A651;          /* Voltava Green */
    --voltava-primary-dark: #008542;     /* Darker green for hover states */
    --voltava-primary-light: #4DC47D;    /* Lighter green for accents */
    
    /* Secondary Colors */
    --voltava-secondary: #1A1A2E;        /* Dark navy/charcoal */
    --voltava-secondary-light: #2D2D44;  /* Lighter navy */
    
    /* Accent Colors */
    --voltava-accent: #00C853;           /* Bright green accent */
    --voltava-gold: #FFD700;             /* Gold for awards/rankings */
    --voltava-silver: #C0C0C0;           /* Silver for 2nd place */
    --voltava-bronze: #CD7F32;           /* Bronze for 3rd place */
    
    /* Neutral Colors */
    --voltava-white: #FFFFFF;
    --voltava-off-white: #F8F9FA;
    --voltava-gray-100: #F1F3F4;
    --voltava-gray-200: #E9ECEF;
    --voltava-gray-300: #DEE2E6;
    --voltava-gray-400: #CED4DA;
    --voltava-gray-500: #ADB5BD;
    --voltava-gray-600: #6C757D;
    --voltava-gray-700: #495057;
    --voltava-gray-800: #343A40;
    --voltava-gray-900: #212529;
    --voltava-black: #000000;
    
    /* Text Colors */
    --voltava-text-primary: #1A1A2E;
    --voltava-text-secondary: #4A5568;
    --voltava-text-muted: #718096;
    --voltava-text-on-primary: #FFFFFF;
    
    /* Gradient */
    --voltava-gradient: linear-gradient(135deg, #00A651 0%, #00C853 100%);
    --voltava-gradient-dark: linear-gradient(135deg, #008542 0%, #00A651 100%);
    
    /* Shadows */
    --voltava-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --voltava-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    --voltava-shadow-md: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    --voltava-shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
    --voltava-shadow-xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    
    /* Border Radius */
    --voltava-radius-sm: 4px;
    --voltava-radius: 6px;
    --voltava-radius-md: 8px;
    --voltava-radius-lg: 12px;
    --voltava-radius-xl: 16px;
    --voltava-radius-full: 9999px;
    
    /* Typography */
    --voltava-font-family: 'Inter', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
    --voltava-font-family-heading: 'Inter', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
    
    /* Transitions */
    --voltava-transition-fast: 0.15s ease;
    --voltava-transition: 0.2s ease;
    --voltava-transition-slow: 0.3s ease;
}

/* =====================================================
   GLOBAL BRAND OVERRIDES
   ===================================================== */

/* Apply brand font globally */
html, body {
    font-family: var(--voltava-font-family);
}

/* Brand-colored links */
a {
    color: var(--voltava-primary);
    transition: color var(--voltava-transition);
}

a:hover {
    color: var(--voltava-primary-dark);
}

/* =====================================================
   RADZEN COMPONENT OVERRIDES
   ===================================================== */

/* Primary buttons - use gradient for emphasis */
.rz-button.rz-primary {
    background: var(--voltava-gradient) !important;
    border-color: var(--voltava-primary) !important;
}

.rz-button.rz-primary:hover {
    background: var(--voltava-gradient-dark) !important;
    border-color: var(--voltava-primary-dark) !important;
}

/* Note: Header and Sidebar overrides are in app.css for better organization */

/* =====================================================
   UTILITY CLASSES
   ===================================================== */

.voltava-bg-primary {
    background-color: var(--voltava-primary);
}

.voltava-bg-gradient {
    background: var(--voltava-gradient);
}

.voltava-text-primary {
    color: var(--voltava-primary);
}

.voltava-text-gradient {
    background: var(--voltava-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.rz-body {
    padding: 0 !important;
}