/**
 * RealSales - CSS Variables (Design Tokens)
 * Zentrale Definition aller Farben, Abstände, Schatten etc.
 * 
 * @package RealSales
 * @version 1.0
 */

:root {
    /* Brand Colors */
    --rs-purple: #6B4C9A;
    --rs-purple-dark: #533776;
    --rs-purple-light: #E9E3F0;
    --rs-purple-outline: #6B4C9A;
    
    /* Logo Colors */
    --rs-logo-real: #4a4458;        /* Dunkles entsättigtes Violett/Anthrazit */
    --rs-logo-sales: #4a6b54;       /* Dunkles gedecktes Grün */
    
    /* Neutral Colors */
    --rs-white: #FFFFFF;
    --rs-black: #000000;
    --rs-gray-50: #F9FAFB;
    --rs-gray-100: #F3F4F6;
    --rs-gray-200: #E5E7EB;
    --rs-gray-300: #D1D5DB;
    --rs-gray-400: #9CA3AF;
    --rs-gray-500: #6B7280;
    --rs-gray-600: #4B5563;
    --rs-gray-700: #374151;
    --rs-gray-800: #1F2937;
    --rs-gray-900: #111827;
    --rs-nav-text: #2b2b2b;         /* Navigations-Text */
    
    /* Header Background - Einfarbig */
    --rs-header-bg: #F0EDF6;
    
    /* Typography */
    --rs-font-primary: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --rs-font-secondary: "Lexend", -apple-system, sans-serif;
    
    /* Spacing */
    --rs-space-1: 0.25rem;   /* 4px */
    --rs-space-2: 0.5rem;    /* 8px */
    --rs-space-3: 0.75rem;   /* 12px */
    --rs-space-4: 1rem;      /* 16px */
    --rs-space-5: 1.25rem;   /* 20px */
    --rs-space-6: 1.5rem;    /* 24px */
    --rs-space-8: 2rem;      /* 32px */
    --rs-space-10: 2.5rem;   /* 40px */
    --rs-space-12: 3rem;     /* 48px */
    --rs-space-16: 4rem;     /* 64px */
    
    /* Shadows */
    --rs-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --rs-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    --rs-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --rs-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    
    /* Glassmorphism - Apple-Style Frosted Glass */
    --rs-glass-bg: rgba(255, 255, 255, 0.8);
    --rs-glass-bg-light: rgba(255, 255, 255, 0.6);
    --rs-glass-bg-strong: rgba(255, 255, 255, 0.9);
    --rs-glass-blur: blur(12px);
    --rs-glass-blur-strong: blur(16px) saturate(180%);
    --rs-glass-border: rgba(255, 255, 255, 0.3);
    --rs-glass-shadow: 0 4px 16px rgba(0, 0, 0, 0.08), 
                       inset 0 1px 0 rgba(255, 255, 255, 0.8),
                       0 0 0 1px rgba(255, 255, 255, 0.3);
    --rs-glass-shadow-hover: 0 6px 24px rgba(0, 0, 0, 0.12),
                             inset 0 1px 0 rgba(255, 255, 255, 0.9),
                             0 0 0 1px rgba(255, 255, 255, 0.4);
    
    /* Border Radius */
    --rs-radius-sm: 0.25rem;
    --rs-radius: 0.375rem;
    --rs-radius-md: 0.5rem;
    --rs-radius-lg: 0.75rem;
    --rs-radius-xl: 1rem;
    --rs-radius-full: 50px;
    
    /* Transitions */
    --rs-transition: all 0.2s ease;
    --rs-transition-fast: all 0.15s ease;
}

/* Global Resets */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: var(--rs-font-primary);
    font-size: 16px;
    line-height: 1.6;
    color: var(--rs-gray-700);
    background-color: #ffffff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}