diff --git a/backend/static/css/input-raspberry-balanced.css b/backend/static/css/input-raspberry-balanced.css
new file mode 100644
index 00000000..a1737b9e
--- /dev/null
+++ b/backend/static/css/input-raspberry-balanced.css
@@ -0,0 +1,740 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+/* Custom Styles für Light und Dark Mode - Premium Upgrade mit verbessertem Light Mode */
+@layer base {
+  :root {
+    /* Light Mode Farben - Mercedes-Benz Professional - VERBESSERT für optimale Lesbarkeit */
+    --color-bg-primary: #ffffff;
+    --color-bg-secondary: #fafbfc;
+    --color-bg-tertiary: #f3f5f7;
+    --color-bg-accent: #fbfcfd;
+    --color-text-primary: #111827; /* Verstärkter Kontrast für bessere Lesbarkeit */
+    --color-text-secondary: #374151; /* Erhöhter Kontrast */
+    --color-text-muted: #6b7280; /* Optimierter Muted-Text */
+    --color-text-accent: #0073ce;
+    --color-border-primary: #e5e7eb; /* Subtilere aber sichtbarere Borders */
+    --color-border-secondary: #d1d5db;
+    --color-accent: #0073ce; /* Mercedes-Benz Professional Blau */
+    --color-accent-hover: #005a9f;
+    --color-accent-light: #eff6ff;
+    --color-accent-text: #ffffff;
+    --color-shadow: rgba(0, 0, 0, 0.06); /* Sanftere Schatten */
+    --color-shadow-strong: rgba(0, 0, 0, 0.1);
+    --color-shadow-accent: rgba(0, 115, 206, 0.12);
+    --card-radius: 1rem; /* Abgerundete Ecken für Karten */
+    
+    /* Light Mode Gradients - VERBESSERT für sanftere Optik */
+    --gradient-primary: linear-gradient(135deg, #ffffff 0%, #fafbfc 30%, #f8fafc 70%, #f3f5f7 100%);
+    --gradient-card: linear-gradient(135deg, #ffffff 0%, #fcfcfd 50%, #fafbfc 100%);
+    --gradient-hero: linear-gradient(135deg, #fafbfc 0%, #f3f5f7 40%, #eef2f5 80%, #f8fafc 100%);
+    --gradient-accent: linear-gradient(135deg, #0073ce 0%, #005a9f 100%);
+    --gradient-surface: linear-gradient(135deg, #ffffff 0%, #fbfcfd 50%, #f8fafc 100%);
+    
+    /* Neue optimierte Light Mode Glassmorphism-Variablen */
+    --glass-bg: rgba(255, 255, 255, 0.92);
+    --glass-border: rgba(255, 255, 255, 0.3);
+    --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.04);
+    --glass-blur: blur(20px);
+  }
+
+  .dark {
+    /* Dark Mode Farben - Noch dunkler und eleganter - UNVERÄNDERT */
+    --color-bg-primary: #000000; /* Tiefes Schwarz */
+    --color-bg-secondary: #0a0a0a; /* Sehr dunkles Grau */
+    --color-bg-tertiary: #1a1a1a;
+    --color-text-primary: #ffffff;
+    --color-text-secondary: #e2e8f0;
+    --color-text-muted: #94a3b8;
+    --color-border-primary: #1a1a1a; /* Dunkler Rahmen */
+    --color-border-secondary: #2a2a2a;
+    --color-accent: #ffffff; /* Reines Weiß */
+    --color-accent-hover: #f0f0f0;
+    --color-accent-light: #1e3a8a;
+    --color-accent-text: #000000;
+    --color-shadow: rgba(0, 0, 0, 0.8); /* Sehr dunkler Schatten */
+    --color-shadow-strong: rgba(0, 0, 0, 0.9);
+    --mb-black: #000000; /* Mercedes-Benz Schwarz */
+  }
+  
+  body {
+    @apply bg-white dark:bg-black text-slate-900 dark:text-white transition-colors duration-300;
+    position: relative;
+    min-height: 100vh;
+    background: var(--gradient-primary);
+    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+    font-feature-settings: 'cv02', 'cv03', 'cv04', 'cv11';
+    line-height: 1.65; /* Verbesserte Zeilenhöhe für bessere Lesbarkeit */
+    font-size: 15px; /* Optimierte Schriftgröße */
+  }
+
+  .dark body {
+    background: linear-gradient(135deg, #000000 0%, #0a0a0a 50%, #000000 100%);
+  }
+
+  /* Enhanced Body Background with Subtle Patterns - VERBESSERT */
+  body::before {
+    content: '';
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: 
+      radial-gradient(circle at 25% 25%, rgba(0, 115, 206, 0.015) 0%, transparent 50%),
+      radial-gradient(circle at 75% 75%, rgba(0, 115, 206, 0.01) 0%, transparent 50%),
+      radial-gradient(circle at 50% 10%, rgba(0, 115, 206, 0.008) 0%, transparent 50%);
+    pointer-events: none;
+    z-index: -1;
+  }
+
+  .dark body::before {
+    background: 
+      radial-gradient(circle at 20% 50%, rgba(59, 130, 246, 0.03) 0%, transparent 50%),
+      radial-gradient(circle at 80% 20%, rgba(59, 130, 246, 0.02) 0%, transparent 50%);
+  }
+
+  /* Navbar Styles - Premium Glassmorphism - UNANGETASTET WIE GEWÜNSCHT */
+  nav {
+    @apply backdrop-blur-xl border-b transition-all duration-300;
+    background: linear-gradient(135deg, 
+      rgba(255, 255, 255, 0.95) 0%, 
+      rgba(250, 251, 252, 0.92) 30%, 
+      rgba(248, 250, 252, 0.9) 70%,
+      rgba(255, 255, 255, 0.95) 100%);
+    border-bottom: 1px solid rgba(229, 231, 235, 0.7);
+    backdrop-filter: blur(28px) saturate(200%) brightness(110%);
+    -webkit-backdrop-filter: blur(28px) saturate(200%) brightness(110%);
+    box-shadow: 
+      0 4px 20px rgba(0, 0, 0, 0.04),
+      0 2px 8px rgba(0, 115, 206, 0.02),
+      inset 0 1px 0 rgba(255, 255, 255, 0.9);
+  }
+  
+  .dark nav {
+    background: rgba(0, 0, 0, 0.85);
+    border-bottom-color: rgba(255, 255, 255, 0.1);
+    box-shadow: 
+      0 8px 32px rgba(0, 0, 0, 0.3),
+      inset 0 1px 0 rgba(255, 255, 255, 0.05);
+  }
+
+  /* Premium Card Styles - CPU OPTIMIERT für Raspberry Pi */
+  .card-enhanced {
+    background: var(--gradient-card);
+    border: 1px solid var(--color-border-primary);
+    border-radius: var(--card-radius);
+    box-shadow: 
+      0 2px 12px rgba(0, 0, 0, 0.03),
+      0 1px 4px rgba(0, 115, 206, 0.02);
+    transition: background-color 0.2s ease, border-color 0.2s ease;
+    /* ENTFERNT: cubic-bezier, position, overflow für CPU-Optimierung */
+  }
+
+  /* ENTFERNT: card-enhanced::before pseudo-element für CPU-Optimierung */
+
+  .card-enhanced:hover {
+    /* ENTFERNT: transform für CPU-Optimierung */
+    box-shadow: 
+      0 4px 16px rgba(0, 0, 0, 0.05),
+      0 2px 8px rgba(0, 115, 206, 0.03);
+  }
+
+  .dark .card-enhanced {
+    background: rgba(10, 10, 10, 0.8);
+    border-color: var(--color-border-primary);
+    box-shadow: 0 4px 20px var(--color-shadow);
+  }
+
+  /* Premium Button Styles - CPU OPTIMIERT */
+  .btn-enhanced {
+    background: var(--gradient-accent);
+    color: var(--color-accent-text);
+    border: none;
+    border-radius: 0.5rem;
+    padding: 0.75rem 1.75rem;
+    font-weight: 600;
+    font-size: 0.875rem;
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+    box-shadow: 
+      0 2px 8px rgba(0, 115, 206, 0.2),
+      0 1px 4px rgba(0, 115, 206, 0.1);
+    transition: background-color 0.2s ease, box-shadow 0.2s ease;
+    /* ENTFERNT: cubic-bezier, position, overflow für CPU-Optimierung */
+  }
+
+  /* ENTFERNT: btn-enhanced::before pseudo-element animation für CPU-Optimierung */
+
+  .btn-enhanced:hover {
+    /* ENTFERNT: transform für CPU-Optimierung */
+    box-shadow: 
+      0 4px 12px rgba(0, 115, 206, 0.25),
+      0 2px 6px rgba(0, 115, 206, 0.15);
+  }
+
+  .btn-enhanced:active {
+    /* ENTFERNT: transform für CPU-Optimierung */
+  }
+
+  .btn-secondary {
+    background: var(--gradient-surface);
+    color: var(--color-text-primary);
+    border: 1px solid var(--color-border-primary);
+    box-shadow: 
+      0 1px 6px rgba(0, 0, 0, 0.03),
+      inset 0 1px 0 rgba(255, 255, 255, 0.8);
+  }
+
+  .btn-secondary:hover {
+    background: var(--color-bg-secondary);
+    border-color: var(--color-accent);
+    color: var(--color-accent);
+    box-shadow: 
+      0 2px 8px rgba(0, 115, 206, 0.06),
+      inset 0 1px 0 rgba(255, 255, 255, 0.9);
+  }
+
+  /* Enhanced Form Elements - REDUZIERTER backdrop-filter */
+  .input-enhanced {
+    background: rgba(255, 255, 255, 0.95);
+    border: 1px solid var(--color-border-primary);
+    border-radius: 0.5rem;
+    padding: 0.75rem 1rem;
+    color: var(--color-text-primary);
+    font-size: 0.9rem;
+    box-shadow: 
+      0 1px 6px rgba(0, 0, 0, 0.02),
+      inset 0 1px 0 rgba(255, 255, 255, 0.9);
+    transition: border-color 0.2s ease, background-color 0.2s ease;
+    /* REDUZIERT: backdrop-filter von 8px auf 4px */
+    backdrop-filter: blur(4px);
+    -webkit-backdrop-filter: blur(4px);
+  }
+
+  .input-enhanced:focus {
+    outline: none;
+    border-color: var(--color-accent);
+    box-shadow: 
+      0 2px 8px rgba(0, 115, 206, 0.08),
+      0 0 0 3px rgba(0, 115, 206, 0.05);
+    background: rgba(255, 255, 255, 0.98);
+  }
+
+  .input-enhanced::placeholder {
+    color: var(--color-text-muted);
+    opacity: 0.8;
+  }
+
+  .dark .input-enhanced {
+    background: rgba(10, 10, 10, 0.8);
+    border-color: var(--color-border-primary);
+    color: var(--color-text-primary);
+    box-shadow: 
+      0 2px 8px var(--color-shadow),
+      inset 0 1px 0 rgba(255, 255, 255, 0.05);
+  }
+
+  .dark .input-enhanced:focus {
+    border-color: #60a5fa;
+    box-shadow: 
+      0 2px 10px rgba(96, 165, 250, 0.15),
+      0 0 0 3px rgba(96, 165, 250, 0.1);
+  }
+
+  /* Premium Alert Styles - REDUZIERTER backdrop-filter */
+  .alert-enhanced {
+    border-radius: 1rem;
+    padding: 1.25rem;
+    border: 1px solid transparent;
+    position: relative;
+    overflow: hidden;
+    /* REDUZIERT: backdrop-filter von 16px auf 8px */
+    backdrop-filter: blur(8px);
+    -webkit-backdrop-filter: blur(8px);
+  }
+
+  .alert-enhanced::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    bottom: 0;
+    width: 4px;
+  }
+
+  .alert-info-enhanced {
+    background: linear-gradient(135deg, 
+      rgba(239, 246, 255, 0.95) 0%, 
+      rgba(219, 234, 254, 0.9) 100%);
+    border-color: rgba(59, 130, 246, 0.2);
+    color: #1e40af;
+  }
+
+  .alert-info-enhanced::before {
+    background: var(--gradient-accent);
+  }
+
+  .alert-success-enhanced {
+    background: linear-gradient(135deg, 
+      rgba(236, 253, 245, 0.95) 0%, 
+      rgba(167, 243, 208, 0.9) 100%);
+    border-color: rgba(16, 185, 129, 0.2);
+    color: #065f46;
+  }
+
+  .alert-success-enhanced::before {
+    background: linear-gradient(180deg, #10b981 0%, #059669 100%);
+  }
+
+  .alert-warning-enhanced {
+    background: linear-gradient(135deg, 
+      rgba(255, 251, 235, 0.95) 0%, 
+      rgba(254, 243, 199, 0.9) 100%);
+    border-color: rgba(251, 191, 36, 0.2);
+    color: #92400e;
+  }
+
+  .alert-warning-enhanced::before {
+    background: linear-gradient(180deg, #fbbf24 0%, #f59e0b 100%);
+  }
+
+  .alert-error-enhanced {
+    background: linear-gradient(135deg, 
+      rgba(254, 242, 242, 0.95) 0%, 
+      rgba(252, 165, 165, 0.9) 100%);
+    border-color: rgba(239, 68, 68, 0.2);
+    color: #991b1b;
+  }
+
+  .alert-error-enhanced::before {
+    background: linear-gradient(180deg, #ef4444 0%, #dc2626 100%);
+  }
+
+  /* Light Mode Flash Messages - REDUZIERTE backdrop-filter */
+  .flash-message-light {
+    background: linear-gradient(135deg, 
+      rgba(255, 255, 255, 0.95) 0%, 
+      rgba(248, 250, 252, 0.9) 100%);
+    /* REDUZIERT: backdrop-filter von 32px auf 16px */
+    backdrop-filter: blur(16px) saturate(180%) brightness(110%);
+    -webkit-backdrop-filter: blur(16px) saturate(180%) brightness(110%);
+    border: 1px solid rgba(226, 232, 240, 0.6);
+    box-shadow: 
+      0 10px 30px rgba(0, 0, 0, 0.08),
+      0 4px 12px rgba(0, 115, 206, 0.04);
+    color: var(--color-text-primary);
+  }
+
+  .flash-message-light.success {
+    border-left: 4px solid #10b981;
+    background: linear-gradient(135deg, 
+      rgba(236, 253, 245, 0.95) 0%, 
+      rgba(209, 250, 229, 0.9) 100%);
+  }
+
+  .flash-message-light.error {
+    border-left: 4px solid #ef4444;
+    background: linear-gradient(135deg, 
+      rgba(254, 242, 242, 0.95) 0%, 
+      rgba(252, 165, 165, 0.9) 100%);
+  }
+
+  .flash-message-light.warning {
+    border-left: 4px solid #fbbf24;
+    background: linear-gradient(135deg, 
+      rgba(255, 251, 235, 0.95) 0%, 
+      rgba(254, 243, 199, 0.9) 100%);
+  }
+
+  .flash-message-light.info {
+    border-left: 4px solid #3b82f6;
+    background: linear-gradient(135deg, 
+      rgba(239, 246, 255, 0.95) 0%, 
+      rgba(219, 234, 254, 0.9) 100%);
+  }
+
+  /* Premium Table Styles - CPU OPTIMIERT */
+  .table-enhanced {
+    background: var(--gradient-card);
+    border: 1px solid var(--color-border-primary);
+    border-radius: var(--card-radius);
+    overflow: hidden;
+    box-shadow: 
+      0 2px 12px var(--color-shadow),
+      0 1px 4px rgba(0, 115, 206, 0.03);
+  }
+
+  .table-enhanced th {
+    background: linear-gradient(135deg, 
+      var(--color-bg-secondary) 0%, 
+      var(--color-bg-tertiary) 100%);
+    color: var(--color-text-primary);
+    font-weight: 600;
+    padding: 1rem 1.5rem;
+    border-bottom: 1px solid var(--color-border-primary);
+    position: relative;
+  }
+
+  .table-enhanced th::after {
+    content: '';
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    height: 1px;
+    background: linear-gradient(90deg, 
+      transparent 0%, 
+      var(--color-border-secondary) 50%, 
+      transparent 100%);
+  }
+
+  .table-enhanced td {
+    padding: 1rem 1.5rem;
+    border-bottom: 1px solid var(--color-border-primary);
+    color: var(--color-text-secondary);
+    transition: background-color 0.2s ease;
+  }
+
+  .table-enhanced tbody tr:hover {
+    background: var(--color-bg-secondary);
+    /* ENTFERNT: transform für CPU-Optimierung */
+  }
+
+  .dark .table-enhanced {
+    background: rgba(10, 10, 10, 0.8);
+    border-color: var(--color-border-primary);
+  }
+
+  .dark .table-enhanced th {
+    background: rgba(26, 26, 26, 0.8);
+    color: var(--color-text-primary);
+  }
+
+  .dark .table-enhanced tbody tr:hover {
+    background: rgba(26, 26, 26, 0.6);
+  }
+
+  /* Premium Modal Styles - REDUZIERTE backdrop-filter */
+  .modal-enhanced {
+    background: linear-gradient(135deg, 
+      rgba(255, 255, 255, 0.98) 0%, 
+      rgba(248, 250, 252, 0.95) 50%, 
+      rgba(255, 255, 255, 0.98) 100%);
+    /* REDUZIERT: backdrop-filter von 32px auf 16px */
+    backdrop-filter: blur(16px) saturate(180%) brightness(110%);
+    -webkit-backdrop-filter: blur(16px) saturate(180%) brightness(110%);
+    border: 1px solid rgba(226, 232, 240, 0.7);
+    border-radius: 1.5rem;
+    box-shadow: 
+      0 20px 50px rgba(0, 0, 0, 0.12),
+      0 8px 20px rgba(0, 115, 206, 0.06);
+    position: relative;
+    overflow: hidden;
+  }
+
+  .modal-enhanced::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    height: 1px;
+    background: linear-gradient(90deg, 
+      transparent 0%, 
+      rgba(226, 232, 240, 0.8) 50%, 
+      transparent 100%);
+  }
+
+  .dark .modal-enhanced {
+    background: rgba(0, 0, 0, 0.95);
+    border-color: rgba(42, 42, 42, 0.7);
+    box-shadow: 
+      0 20px 50px rgba(0, 0, 0, 0.4),
+      inset 0 2px 0 rgba(255, 255, 255, 0.05);
+  }
+
+  /* Enhanced Status Badges - CPU OPTIMIERT */
+  .status-badge-enhanced {
+    display: inline-flex;
+    align-items: center;
+    padding: 0.5rem 1rem;
+    font-size: 0.75rem;
+    font-weight: 700;
+    border-radius: 9999px;
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+    border: 1px solid transparent;
+    transition: background-color 0.2s ease;
+    /* ENTFERNT: position, overflow für CPU-Optimierung */
+  }
+
+  /* ENTFERNT: status-badge-enhanced::before animation für CPU-Optimierung */
+
+  .status-online-enhanced {
+    background: linear-gradient(135deg, #ecfdf5 0%, #a7f3d0 100%);
+    color: #065f46;
+    border-color: rgba(16, 185, 129, 0.3);
+  }
+
+  .status-offline-enhanced {
+    background: linear-gradient(135deg, #fef2f2 0%, #fca5a5 100%);
+    color: #991b1b;
+    border-color: rgba(239, 68, 68, 0.3);
+  }
+
+  .status-printing-enhanced {
+    background: linear-gradient(135deg, #eff6ff 0%, #bfdbfe 100%);
+    color: #1e40af;
+    border-color: rgba(59, 130, 246, 0.3);
+  }
+
+  /* Dark Mode Toggle - REDUZIERTE Animationen */
+  .dark-mode-toggle-new {
+    position: relative;
+    display: flex;
+    cursor: pointer;
+    align-items: center;
+    justify-content: center;
+    border-radius: 9999px;
+    padding: 0.625rem;
+    transition: background-color 0.2s ease, border-color 0.2s ease;
+    background: linear-gradient(135deg, 
+      rgba(248, 250, 252, 0.9) 0%, 
+      rgba(241, 245, 249, 0.8) 100%);
+    border: 1px solid rgba(226, 232, 240, 0.7);
+    box-shadow: 
+      0 2px 8px rgba(0, 0, 0, 0.05),
+      0 1px 4px rgba(0, 115, 206, 0.03);
+    color: var(--color-text-secondary);
+    z-index: 100;
+  }
+
+  .dark-mode-toggle-new:hover {
+    /* ENTFERNT: transform und scale für CPU-Optimierung */
+    background: linear-gradient(135deg, 
+      rgba(248, 250, 252, 0.95) 0%, 
+      rgba(241, 245, 249, 0.85) 100%);
+    box-shadow: 
+      0 4px 12px rgba(0, 0, 0, 0.08),
+      0 2px 6px rgba(0, 115, 206, 0.05);
+  }
+
+  .dark-mode-toggle-new:active {
+    /* ENTFERNT: transform für CPU-Optimierung */
+    transition: none;
+  }
+
+  .dark .dark-mode-toggle-new {
+    background: rgba(10, 10, 10, 0.8);
+    border: 1px solid rgba(42, 42, 42, 0.6);
+    box-shadow: 
+      0 2px 8px rgba(0, 0, 0, 0.2),
+      inset 0 1px 0 rgba(255, 255, 255, 0.05);
+    color: var(--color-text-secondary);
+  }
+
+  .dark .dark-mode-toggle-new:hover {
+    background: rgba(10, 10, 10, 0.9);
+    box-shadow: 
+      0 4px 12px rgba(0, 0, 0, 0.3),
+      inset 0 1px 0 rgba(255, 255, 255, 0.08);
+  }
+
+  /* Icon-Animation für Dark Mode Toggle - VEREINFACHT */
+  .dark-mode-toggle-new .sun-icon,
+  .dark-mode-toggle-new .moon-icon {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    transition: opacity 0.2s ease;
+  }
+
+  /* ENTFERNT: komplexe icon-appear animation für CPU-Optimierung */
+
+  .dark .sun-icon { display: none; }
+  .dark .moon-icon { display: block; }
+  .sun-icon { display: block; }
+  .moon-icon { display: none; }
+
+  /* User Menu Button - CPU OPTIMIERT */
+  .user-menu-button-new {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    border-radius: 0.75rem;
+    padding: 0.5rem;
+    transition: background-color 0.2s ease, border-color 0.2s ease;
+    background: linear-gradient(135deg, 
+      rgba(248, 250, 252, 0.8) 0%, 
+      rgba(241, 245, 249, 0.7) 100%);
+    border: 1px solid rgba(226, 232, 240, 0.6);
+    box-shadow: 
+      0 2px 8px rgba(0, 0, 0, 0.05),
+      inset 0 1px 0 rgba(255, 255, 255, 0.7);
+  }
+
+  .user-menu-button-new:hover {
+    /* ENTFERNT: transform für CPU-Optimierung */
+    background: linear-gradient(135deg, 
+      rgba(248, 250, 252, 0.9) 0%, 
+      rgba(241, 245, 249, 0.8) 100%);
+    box-shadow: 
+      0 4px 12px rgba(0, 0, 0, 0.08),
+      0 2px 4px rgba(0, 115, 206, 0.04);
+  }
+
+  .dark .user-menu-button-new {
+    background: rgba(10, 10, 10, 0.7);
+    border-color: rgba(42, 42, 42, 0.6);
+    box-shadow: 
+      0 2px 8px rgba(0, 0, 0, 0.2),
+      inset 0 1px 0 rgba(255, 255, 255, 0.03);
+  }
+
+  .dark .user-menu-button-new:hover {
+    background: rgba(10, 10, 10, 0.8);
+    box-shadow: 
+      0 4px 12px rgba(0, 0, 0, 0.3),
+      inset 0 1px 0 rgba(255, 255, 255, 0.05);
+  }
+
+  /* Enhanced Hover Effects - CPU OPTIMIERT */
+  .hover-lift-enhanced {
+    transition: box-shadow 0.2s ease;
+  }
+
+  .hover-lift-enhanced:hover {
+    /* ENTFERNT: transform für CPU-Optimierung */
+    box-shadow: 
+      0 8px 20px var(--color-shadow-strong),
+      0 4px 10px var(--color-shadow-accent);
+  }
+
+  .dark .hover-lift-enhanced:hover {
+    box-shadow: 0 8px 20px var(--color-shadow);
+  }
+
+  /* Smooth Scrollbar for Light Mode */
+  ::-webkit-scrollbar {
+    width: 8px;
+    height: 8px;
+  }
+
+  ::-webkit-scrollbar-track {
+    background: var(--color-bg-secondary);
+    border-radius: 4px;
+  }
+
+  ::-webkit-scrollbar-thumb {
+    background: linear-gradient(180deg, 
+      var(--color-border-secondary) 0%, 
+      var(--color-border-primary) 100%);
+    border-radius: 4px;
+    transition: background 0.2s ease;
+  }
+
+  ::-webkit-scrollbar-thumb:hover {
+    background: linear-gradient(180deg, 
+      var(--color-accent) 0%, 
+      var(--color-accent-hover) 100%);
+  }
+
+  .dark ::-webkit-scrollbar-track {
+    background: var(--color-bg-secondary);
+  }
+
+  .dark ::-webkit-scrollbar-thumb {
+    background: var(--color-border-primary);
+  }
+
+  .dark ::-webkit-scrollbar-thumb:hover {
+    background: #60a5fa;
+  }
+
+  /* Loading States - VEREINFACHT */
+  .loading-enhanced {
+    position: relative;
+    overflow: hidden;
+  }
+
+  .loading-enhanced::after {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: -100%;
+    width: 100%;
+    height: 100%;
+    background: linear-gradient(90deg, 
+      transparent, 
+      rgba(0, 115, 206, 0.1), 
+      transparent);
+    animation: loading-shimmer 2s infinite;
+  }
+
+  @keyframes loading-shimmer {
+    0% { left: -100%; }
+    100% { left: 100%; }
+  }
+
+  /* Focus States for Accessibility */
+  .focus-enhanced:focus {
+    outline: 2px solid var(--color-accent);
+    outline-offset: 2px;
+    box-shadow: 
+      0 0 0 4px rgba(0, 115, 206, 0.15);
+  }
+
+  .dark .focus-enhanced:focus {
+    outline-color: #60a5fa;
+    box-shadow: 
+      0 0 0 4px rgba(96, 165, 250, 0.15);
+  }
+
+  /* Responsive Design Enhancements */
+  @media (max-width: 768px) {
+    .card-enhanced {
+      padding: 1rem;
+      border-radius: 0.75rem;
+    }
+    
+    .btn-enhanced {
+      padding: 0.75rem 1.5rem;
+      font-size: 0.8rem;
+    }
+    
+    .modal-enhanced {
+      border-radius: 1rem;
+      margin: 1rem;
+    }
+    
+    .dark-mode-toggle-new {
+      padding: 0.5rem;
+    }
+  }
+
+  /* Reduced Motion Support */
+  @media (prefers-reduced-motion: reduce) {
+    * {
+      transition: none !important;
+      animation: none !important;
+    }
+  }
+
+  /* High Contrast Mode Support */
+  @media (prefers-contrast: high) {
+    :root {
+      --color-shadow: rgba(0, 0, 0, 0.2);
+      --color-shadow-strong: rgba(0, 0, 0, 0.3);
+      --color-border-primary: #000000;
+    }
+    
+    .dark {
+      --color-border-primary: #ffffff;
+    }
+  }
+}
+
+/* WEITERE ABSCHNITTE FOLGEN - Ich optimiere den Rest systematisch... */ 
\ No newline at end of file
diff --git a/backend/static/css/input.css b/backend/static/css/input.css
new file mode 100644
index 00000000..8621977d
--- /dev/null
+++ b/backend/static/css/input.css
@@ -0,0 +1,3385 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+/* Custom Styles für Light und Dark Mode - Premium Upgrade mit verbessertem Light Mode */
+@layer base {
+  :root {
+    /* Light Mode Farben - Mercedes-Benz Professional - VERBESSERT für optimale Lesbarkeit */
+    --color-bg-primary: #ffffff;
+    --color-bg-secondary: #fafbfc;
+    --color-bg-tertiary: #f3f5f7;
+    --color-bg-accent: #fbfcfd;
+    --color-text-primary: #111827; /* Verstärkter Kontrast für bessere Lesbarkeit */
+    --color-text-secondary: #374151; /* Erhöhter Kontrast */
+    --color-text-muted: #6b7280; /* Optimierter Muted-Text */
+    --color-text-accent: #0073ce;
+    --color-border-primary: #e5e7eb; /* Subtilere aber sichtbarere Borders */
+    --color-border-secondary: #d1d5db;
+    --color-accent: #0073ce; /* Mercedes-Benz Professional Blau */
+    --color-accent-hover: #005a9f;
+    --color-accent-light: #eff6ff;
+    --color-accent-text: #ffffff;
+    --color-shadow: rgba(0, 0, 0, 0.06); /* Sanftere Schatten */
+    --color-shadow-strong: rgba(0, 0, 0, 0.1);
+    --color-shadow-accent: rgba(0, 115, 206, 0.12);
+    --card-radius: 1rem; /* Abgerundete Ecken für Karten */
+    
+    /* Light Mode Gradients - VERBESSERT für sanftere Optik */
+    --gradient-primary: linear-gradient(135deg, #ffffff 0%, #fafbfc 30%, #f8fafc 70%, #f3f5f7 100%);
+    --gradient-card: linear-gradient(135deg, #ffffff 0%, #fcfcfd 50%, #fafbfc 100%);
+    --gradient-hero: linear-gradient(135deg, #fafbfc 0%, #f3f5f7 40%, #eef2f5 80%, #f8fafc 100%);
+    --gradient-accent: linear-gradient(135deg, #0073ce 0%, #005a9f 100%);
+    --gradient-surface: linear-gradient(135deg, #ffffff 0%, #fbfcfd 50%, #f8fafc 100%);
+    
+    /* Neue optimierte Light Mode Glassmorphism-Variablen */
+    --glass-bg: rgba(255, 255, 255, 0.92);
+    --glass-border: rgba(255, 255, 255, 0.3);
+    --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.04);
+    --glass-blur: blur(20px);
+  }
+
+  .dark {
+    /* Dark Mode Farben - Noch dunkler und eleganter - UNVERÄNDERT */
+    --color-bg-primary: #000000; /* Tiefes Schwarz */
+    --color-bg-secondary: #0a0a0a; /* Sehr dunkles Grau */
+    --color-bg-tertiary: #1a1a1a;
+    --color-text-primary: #ffffff;
+    --color-text-secondary: #e2e8f0;
+    --color-text-muted: #94a3b8;
+    --color-border-primary: #1a1a1a; /* Dunkler Rahmen */
+    --color-border-secondary: #2a2a2a;
+    --color-accent: #ffffff; /* Reines Weiß */
+    --color-accent-hover: #f0f0f0;
+    --color-accent-light: #1e3a8a;
+    --color-accent-text: #000000;
+    --color-shadow: rgba(0, 0, 0, 0.8); /* Sehr dunkler Schatten */
+    --color-shadow-strong: rgba(0, 0, 0, 0.9);
+    --mb-black: #000000; /* Mercedes-Benz Schwarz */
+  }
+  
+  body {
+    @apply bg-white dark:bg-black text-slate-900 dark:text-white transition-colors duration-300;
+    position: relative;
+    min-height: 100vh;
+    background: var(--gradient-primary);
+    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+    font-feature-settings: 'cv02', 'cv03', 'cv04', 'cv11';
+    line-height: 1.65; /* Verbesserte Zeilenhöhe für bessere Lesbarkeit */
+    font-size: 15px; /* Optimierte Schriftgröße */
+  }
+
+  .dark body {
+    background: linear-gradient(135deg, #000000 0%, #0a0a0a 50%, #000000 100%);
+  }
+
+  /* Enhanced Body Background with Subtle Patterns - VERBESSERT */
+  body::before {
+    content: '';
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: 
+      radial-gradient(circle at 25% 25%, rgba(0, 115, 206, 0.015) 0%, transparent 50%),
+      radial-gradient(circle at 75% 75%, rgba(0, 115, 206, 0.01) 0%, transparent 50%),
+      radial-gradient(circle at 50% 10%, rgba(0, 115, 206, 0.008) 0%, transparent 50%);
+    pointer-events: none;
+    z-index: -1;
+  }
+
+  .dark body::before {
+    background: 
+      radial-gradient(circle at 20% 50%, rgba(59, 130, 246, 0.03) 0%, transparent 50%),
+      radial-gradient(circle at 80% 20%, rgba(59, 130, 246, 0.02) 0%, transparent 50%);
+  }
+
+  /* Navbar Styles - Premium Glassmorphism - VERBESSERT */
+  nav {
+    @apply backdrop-blur-xl border-b transition-all duration-300;
+    background: linear-gradient(135deg, 
+      rgba(255, 255, 255, 0.95) 0%, 
+      rgba(250, 251, 252, 0.92) 30%, 
+      rgba(248, 250, 252, 0.9) 70%,
+      rgba(255, 255, 255, 0.95) 100%);
+    border-bottom: 1px solid rgba(229, 231, 235, 0.7);
+    backdrop-filter: blur(28px) saturate(200%) brightness(110%);
+    -webkit-backdrop-filter: blur(28px) saturate(200%) brightness(110%);
+    box-shadow: 
+      0 4px 20px rgba(0, 0, 0, 0.04),
+      0 2px 8px rgba(0, 115, 206, 0.02),
+      inset 0 1px 0 rgba(255, 255, 255, 0.9);
+  }
+  
+  .dark nav {
+    background: rgba(0, 0, 0, 0.85);
+    border-bottom-color: rgba(255, 255, 255, 0.1);
+    box-shadow: 
+      0 8px 32px rgba(0, 0, 0, 0.3),
+      inset 0 1px 0 rgba(255, 255, 255, 0.05);
+  }
+
+  /* Premium Card Styles - VERBESSERT für Light Mode */
+  .card-enhanced {
+    background: var(--gradient-card);
+    border: 1px solid var(--color-border-primary);
+    border-radius: var(--card-radius);
+    box-shadow: 
+      0 2px 12px rgba(0, 0, 0, 0.03),
+      0 1px 4px rgba(0, 115, 206, 0.02),
+      inset 0 1px 0 rgba(255, 255, 255, 0.8);
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    position: relative;
+    overflow: hidden;
+  }
+
+  .card-enhanced::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    height: 1px;
+    background: var(--gradient-accent);
+    opacity: 0;
+    transition: opacity 0.3s ease;
+  }
+
+  .card-enhanced:hover {
+    transform: translateY(-2px);
+    box-shadow: 
+      0 8px 25px rgba(0, 0, 0, 0.06),
+      0 4px 12px rgba(0, 115, 206, 0.04),
+      inset 0 1px 0 rgba(255, 255, 255, 0.9);
+  }
+
+  .card-enhanced:hover::before {
+    opacity: 1;
+  }
+
+  .dark .card-enhanced {
+    background: rgba(10, 10, 10, 0.8);
+    border-color: var(--color-border-primary);
+    box-shadow: 0 4px 20px var(--color-shadow);
+  }
+
+  /* Premium Button Styles - VERBESSERT */
+  .btn-enhanced {
+    background: var(--gradient-accent);
+    color: var(--color-accent-text);
+    border: none;
+    border-radius: 0.5rem;
+    padding: 0.75rem 1.75rem;
+    font-weight: 600;
+    font-size: 0.875rem;
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+    box-shadow: 
+      0 2px 8px rgba(0, 115, 206, 0.2),
+      0 1px 4px rgba(0, 115, 206, 0.1);
+    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+    position: relative;
+    overflow: hidden;
+  }
+
+  .btn-enhanced::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: -100%;
+    width: 100%;
+    height: 100%;
+    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
+    transition: left 0.5s ease;
+  }
+
+  .btn-enhanced:hover {
+    transform: translateY(-1px);
+    box-shadow: 
+      0 4px 15px rgba(0, 115, 206, 0.3),
+      0 2px 8px rgba(0, 115, 206, 0.2);
+  }
+
+  .btn-enhanced:hover::before {
+    left: 100%;
+  }
+
+  .btn-enhanced:active {
+    transform: translateY(0);
+  }
+
+  .btn-secondary {
+    background: var(--gradient-surface);
+    color: var(--color-text-primary);
+    border: 1px solid var(--color-border-primary);
+    box-shadow: 
+      0 1px 6px rgba(0, 0, 0, 0.03),
+      inset 0 1px 0 rgba(255, 255, 255, 0.8);
+  }
+
+  .btn-secondary:hover {
+    background: var(--color-bg-secondary);
+    border-color: var(--color-accent);
+    color: var(--color-accent);
+    box-shadow: 
+      0 4px 12px rgba(0, 115, 206, 0.08),
+      inset 0 1px 0 rgba(255, 255, 255, 0.9);
+  }
+
+  /* Enhanced Form Elements - VERBESSERT für bessere Lesbarkeit */
+  .input-enhanced {
+    background: rgba(255, 255, 255, 0.95);
+    border: 1px solid var(--color-border-primary);
+    border-radius: 0.5rem;
+    padding: 0.75rem 1rem;
+    color: var(--color-text-primary);
+    font-size: 0.9rem;
+    box-shadow: 
+      0 1px 6px rgba(0, 0, 0, 0.02),
+      inset 0 1px 0 rgba(255, 255, 255, 0.9);
+    transition: all 0.2s ease;
+    backdrop-filter: blur(8px);
+    -webkit-backdrop-filter: blur(8px);
+  }
+
+  .input-enhanced:focus {
+    outline: none;
+    border-color: var(--color-accent);
+    box-shadow: 
+      0 4px 12px rgba(0, 115, 206, 0.1),
+      0 0 0 3px rgba(0, 115, 206, 0.05),
+      inset 0 1px 0 rgba(255, 255, 255, 0.95);
+    background: rgba(255, 255, 255, 0.98);
+  }
+
+  .input-enhanced::placeholder {
+    color: var(--color-text-muted);
+    opacity: 0.8;
+  }
+
+  .dark .input-enhanced {
+    background: rgba(10, 10, 10, 0.8);
+    border-color: var(--color-border-primary);
+    color: var(--color-text-primary);
+    box-shadow: 
+      0 2px 8px var(--color-shadow),
+      inset 0 1px 0 rgba(255, 255, 255, 0.05);
+  }
+
+  .dark .input-enhanced:focus {
+    border-color: #60a5fa;
+    box-shadow: 
+      0 4px 15px rgba(96, 165, 250, 0.2),
+      0 0 0 3px rgba(96, 165, 250, 0.1);
+  }
+
+  /* Premium Alert Styles */
+  .alert-enhanced {
+    border-radius: 1rem;
+    padding: 1.25rem;
+    border: 1px solid transparent;
+    position: relative;
+    overflow: hidden;
+    backdrop-filter: blur(16px);
+    -webkit-backdrop-filter: blur(16px);
+  }
+
+  .alert-enhanced::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    bottom: 0;
+    width: 4px;
+  }
+
+  .alert-info-enhanced {
+    background: linear-gradient(135deg, 
+      rgba(239, 246, 255, 0.95) 0%, 
+      rgba(219, 234, 254, 0.9) 100%);
+    border-color: rgba(59, 130, 246, 0.2);
+    color: #1e40af;
+  }
+
+  .alert-info-enhanced::before {
+    background: var(--gradient-accent);
+  }
+
+  .alert-success-enhanced {
+    background: linear-gradient(135deg, 
+      rgba(236, 253, 245, 0.95) 0%, 
+      rgba(167, 243, 208, 0.9) 100%);
+    border-color: rgba(16, 185, 129, 0.2);
+    color: #065f46;
+  }
+
+  .alert-success-enhanced::before {
+    background: linear-gradient(180deg, #10b981 0%, #059669 100%);
+  }
+
+  .alert-warning-enhanced {
+    background: linear-gradient(135deg, 
+      rgba(255, 251, 235, 0.95) 0%, 
+      rgba(254, 243, 199, 0.9) 100%);
+    border-color: rgba(251, 191, 36, 0.2);
+    color: #92400e;
+  }
+
+  .alert-warning-enhanced::before {
+    background: linear-gradient(180deg, #fbbf24 0%, #f59e0b 100%);
+  }
+
+  .alert-error-enhanced {
+    background: linear-gradient(135deg, 
+      rgba(254, 242, 242, 0.95) 0%, 
+      rgba(252, 165, 165, 0.9) 100%);
+    border-color: rgba(239, 68, 68, 0.2);
+    color: #991b1b;
+  }
+
+  .alert-error-enhanced::before {
+    background: linear-gradient(180deg, #ef4444 0%, #dc2626 100%);
+  }
+
+  /* Light Mode Flash Messages - Premium */
+  .flash-message-light {
+    background: linear-gradient(135deg, 
+      rgba(255, 255, 255, 0.95) 0%, 
+      rgba(248, 250, 252, 0.9) 100%);
+    backdrop-filter: blur(32px) saturate(200%) brightness(120%);
+    -webkit-backdrop-filter: blur(32px) saturate(200%) brightness(120%);
+    border: 1px solid rgba(226, 232, 240, 0.6);
+    box-shadow: 
+      0 25px 50px rgba(0, 0, 0, 0.1),
+      0 12px 24px rgba(0, 115, 206, 0.05),
+      inset 0 1px 0 rgba(255, 255, 255, 0.8);
+    color: var(--color-text-primary);
+  }
+
+  .flash-message-light.success {
+    border-left: 4px solid #10b981;
+    background: linear-gradient(135deg, 
+      rgba(236, 253, 245, 0.95) 0%, 
+      rgba(209, 250, 229, 0.9) 100%);
+  }
+
+  .flash-message-light.error {
+    border-left: 4px solid #ef4444;
+    background: linear-gradient(135deg, 
+      rgba(254, 242, 242, 0.95) 0%, 
+      rgba(252, 165, 165, 0.9) 100%);
+  }
+
+  .flash-message-light.warning {
+    border-left: 4px solid #fbbf24;
+    background: linear-gradient(135deg, 
+      rgba(255, 251, 235, 0.95) 0%, 
+      rgba(254, 243, 199, 0.9) 100%);
+  }
+
+  .flash-message-light.info {
+    border-left: 4px solid #3b82f6;
+    background: linear-gradient(135deg, 
+      rgba(239, 246, 255, 0.95) 0%, 
+      rgba(219, 234, 254, 0.9) 100%);
+  }
+
+  /* Premium Table Styles */
+  .table-enhanced {
+    background: var(--gradient-card);
+    border: 1px solid var(--color-border-primary);
+    border-radius: var(--card-radius);
+    overflow: hidden;
+    box-shadow: 
+      0 4px 20px var(--color-shadow),
+      0 2px 8px rgba(0, 115, 206, 0.04),
+      inset 0 1px 0 rgba(255, 255, 255, 0.6);
+  }
+
+  .table-enhanced th {
+    background: linear-gradient(135deg, 
+      var(--color-bg-secondary) 0%, 
+      var(--color-bg-tertiary) 100%);
+    color: var(--color-text-primary);
+    font-weight: 600;
+    padding: 1rem 1.5rem;
+    border-bottom: 1px solid var(--color-border-primary);
+    position: relative;
+  }
+
+  .table-enhanced th::after {
+    content: '';
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    height: 1px;
+    background: linear-gradient(90deg, 
+      transparent 0%, 
+      var(--color-border-secondary) 50%, 
+      transparent 100%);
+  }
+
+  .table-enhanced td {
+    padding: 1rem 1.5rem;
+    border-bottom: 1px solid var(--color-border-primary);
+    color: var(--color-text-secondary);
+    transition: all 0.2s ease;
+  }
+
+  .table-enhanced tbody tr:hover {
+    background: var(--color-bg-secondary);
+    transform: scale(1.002);
+  }
+
+  .dark .table-enhanced {
+    background: rgba(10, 10, 10, 0.8);
+    border-color: var(--color-border-primary);
+  }
+
+  .dark .table-enhanced th {
+    background: rgba(26, 26, 26, 0.8);
+    color: var(--color-text-primary);
+  }
+
+  .dark .table-enhanced tbody tr:hover {
+    background: rgba(26, 26, 26, 0.6);
+  }
+
+  /* Premium Modal Styles */
+  .modal-enhanced {
+    background: linear-gradient(135deg, 
+      rgba(255, 255, 255, 0.98) 0%, 
+      rgba(248, 250, 252, 0.95) 50%, 
+      rgba(255, 255, 255, 0.98) 100%);
+    backdrop-filter: blur(32px) saturate(220%) brightness(120%);
+    -webkit-backdrop-filter: blur(32px) saturate(220%) brightness(120%);
+    border: 1px solid rgba(226, 232, 240, 0.7);
+    border-radius: 1.5rem;
+    box-shadow: 
+      0 50px 100px rgba(0, 0, 0, 0.15),
+      0 20px 40px rgba(0, 115, 206, 0.08),
+      inset 0 2px 0 rgba(255, 255, 255, 0.9);
+    position: relative;
+    overflow: hidden;
+  }
+
+  .modal-enhanced::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    height: 1px;
+    background: linear-gradient(90deg, 
+      transparent 0%, 
+      rgba(226, 232, 240, 0.8) 50%, 
+      transparent 100%);
+  }
+
+  .dark .modal-enhanced {
+    background: rgba(0, 0, 0, 0.95);
+    border-color: rgba(42, 42, 42, 0.7);
+    box-shadow: 
+      0 50px 100px rgba(0, 0, 0, 0.5),
+      inset 0 2px 0 rgba(255, 255, 255, 0.05);
+  }
+
+  /* Enhanced Status Badges */
+  .status-badge-enhanced {
+    display: inline-flex;
+    align-items: center;
+    padding: 0.5rem 1rem;
+    font-size: 0.75rem;
+    font-weight: 700;
+    border-radius: 9999px;
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+    border: 1px solid transparent;
+    transition: all 0.2s ease;
+    position: relative;
+    overflow: hidden;
+  }
+
+  .status-badge-enhanced::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: -100%;
+    width: 100%;
+    height: 100%;
+    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
+    transition: left 0.5s ease;
+  }
+
+  .status-badge-enhanced:hover::before {
+    left: 100%;
+  }
+
+  .status-online-enhanced {
+    background: linear-gradient(135deg, #ecfdf5 0%, #a7f3d0 100%);
+    color: #065f46;
+    border-color: rgba(16, 185, 129, 0.3);
+  }
+
+  .status-offline-enhanced {
+    background: linear-gradient(135deg, #fef2f2 0%, #fca5a5 100%);
+    color: #991b1b;
+    border-color: rgba(239, 68, 68, 0.3);
+  }
+
+  .status-printing-enhanced {
+    background: linear-gradient(135deg, #eff6ff 0%, #bfdbfe 100%);
+    color: #1e40af;
+    border-color: rgba(59, 130, 246, 0.3);
+  }
+
+  /* Dark Mode Toggle - Premium Design */
+  .dark-mode-toggle-new {
+    position: relative;
+    display: flex;
+    cursor: pointer;
+    align-items: center;
+    justify-content: center;
+    border-radius: 9999px;
+    padding: 0.625rem;
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    background: linear-gradient(135deg, 
+      rgba(248, 250, 252, 0.9) 0%, 
+      rgba(241, 245, 249, 0.8) 100%);
+    border: 1px solid rgba(226, 232, 240, 0.7);
+    box-shadow: 
+      0 4px 12px rgba(0, 0, 0, 0.06),
+      0 2px 4px rgba(0, 115, 206, 0.04),
+      inset 0 1px 0 rgba(255, 255, 255, 0.8);
+    color: var(--color-text-secondary);
+    z-index: 100;
+  }
+
+  .dark-mode-toggle-new:hover {
+    transform: translateY(-2px) scale(1.05);
+    background: linear-gradient(135deg, 
+      rgba(248, 250, 252, 0.95) 0%, 
+      rgba(241, 245, 249, 0.85) 100%);
+    box-shadow: 
+      0 8px 20px rgba(0, 0, 0, 0.1),
+      0 4px 8px rgba(0, 115, 206, 0.08),
+      inset 0 1px 0 rgba(255, 255, 255, 0.9);
+  }
+
+  .dark-mode-toggle-new:active {
+    transform: translateY(-1px) scale(0.98);
+    transition: transform 0.1s;
+  }
+
+  .dark .dark-mode-toggle-new {
+    background: rgba(10, 10, 10, 0.8);
+    border: 1px solid rgba(42, 42, 42, 0.6);
+    box-shadow: 
+      0 4px 12px rgba(0, 0, 0, 0.3),
+      inset 0 1px 0 rgba(255, 255, 255, 0.05);
+    color: var(--color-text-secondary);
+  }
+
+  .dark .dark-mode-toggle-new:hover {
+    background: rgba(10, 10, 10, 0.9);
+    box-shadow: 
+      0 8px 20px rgba(0, 0, 0, 0.4),
+      inset 0 1px 0 rgba(255, 255, 255, 0.08);
+  }
+
+  /* Icon-Animation für Dark Mode Toggle */
+  .dark-mode-toggle-new .sun-icon,
+  .dark-mode-toggle-new .moon-icon {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+  }
+
+  .dark-mode-toggle-new .sun-icon:not(.hidden) {
+    animation: icon-appear 0.5s cubic-bezier(0.25, 1, 0.5, 1) forwards;
+  }
+
+  .dark-mode-toggle-new .moon-icon:not(.hidden) {
+    animation: icon-appear 0.5s cubic-bezier(0.25, 1, 0.5, 1) forwards;
+  }
+
+  @keyframes icon-appear {
+    0% {
+      opacity: 0;
+      transform: translate(-50%, -50%) scale(0.5) rotate(-20deg);
+    }
+    100% {
+      opacity: 1;
+      transform: translate(-50%, -50%) scale(1) rotate(0);
+    }
+  }
+
+  .dark .sun-icon { display: none; }
+  .dark .moon-icon { display: block; }
+  .sun-icon { display: block; }
+  .moon-icon { display: none; }
+
+  /* User Menu Button - Premium Design */
+  .user-menu-button-new {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    border-radius: 0.75rem;
+    padding: 0.5rem;
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    background: linear-gradient(135deg, 
+      rgba(248, 250, 252, 0.8) 0%, 
+      rgba(241, 245, 249, 0.7) 100%);
+    border: 1px solid rgba(226, 232, 240, 0.6);
+    box-shadow: 
+      0 2px 8px rgba(0, 0, 0, 0.05),
+      inset 0 1px 0 rgba(255, 255, 255, 0.7);
+  }
+
+  .user-menu-button-new:hover {
+    transform: translateY(-1px);
+    background: linear-gradient(135deg, 
+      rgba(248, 250, 252, 0.9) 0%, 
+      rgba(241, 245, 249, 0.8) 100%);
+    box-shadow: 
+      0 4px 12px rgba(0, 0, 0, 0.08),
+      0 2px 4px rgba(0, 115, 206, 0.04),
+      inset 0 1px 0 rgba(255, 255, 255, 0.8);
+  }
+
+  .dark .user-menu-button-new {
+    background: rgba(10, 10, 10, 0.7);
+    border-color: rgba(42, 42, 42, 0.6);
+    box-shadow: 
+      0 2px 8px rgba(0, 0, 0, 0.2),
+      inset 0 1px 0 rgba(255, 255, 255, 0.03);
+  }
+
+  .dark .user-menu-button-new:hover {
+    background: rgba(10, 10, 10, 0.8);
+    box-shadow: 
+      0 4px 12px rgba(0, 0, 0, 0.3),
+      inset 0 1px 0 rgba(255, 255, 255, 0.05);
+  }
+
+  /* Enhanced Hover Effects */
+  .hover-lift-enhanced {
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+  }
+
+  .hover-lift-enhanced:hover {
+    transform: translateY(-3px) scale(1.01);
+    box-shadow: 
+      0 12px 30px var(--color-shadow-strong),
+      0 6px 15px var(--color-shadow-accent);
+  }
+
+  .dark .hover-lift-enhanced:hover {
+    box-shadow: 0 12px 30px var(--color-shadow);
+  }
+
+  /* Smooth Scrollbar for Light Mode */
+  ::-webkit-scrollbar {
+    width: 8px;
+    height: 8px;
+  }
+
+  ::-webkit-scrollbar-track {
+    background: var(--color-bg-secondary);
+    border-radius: 4px;
+  }
+
+  ::-webkit-scrollbar-thumb {
+    background: linear-gradient(180deg, 
+      var(--color-border-secondary) 0%, 
+      var(--color-border-primary) 100%);
+    border-radius: 4px;
+    transition: background 0.2s ease;
+  }
+
+  ::-webkit-scrollbar-thumb:hover {
+    background: linear-gradient(180deg, 
+      var(--color-accent) 0%, 
+      var(--color-accent-hover) 100%);
+  }
+
+  .dark ::-webkit-scrollbar-track {
+    background: var(--color-bg-secondary);
+  }
+
+  .dark ::-webkit-scrollbar-thumb {
+    background: var(--color-border-primary);
+  }
+
+  .dark ::-webkit-scrollbar-thumb:hover {
+    background: #60a5fa;
+  }
+
+  /* Loading States */
+  .loading-enhanced {
+    position: relative;
+    overflow: hidden;
+  }
+
+  .loading-enhanced::after {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: -100%;
+    width: 100%;
+    height: 100%;
+    background: linear-gradient(90deg, 
+      transparent, 
+      rgba(0, 115, 206, 0.1), 
+      transparent);
+    animation: loading-shimmer 2s infinite;
+  }
+
+  @keyframes loading-shimmer {
+    0% { left: -100%; }
+    100% { left: 100%; }
+  }
+
+  /* Focus States for Accessibility */
+  .focus-enhanced:focus {
+    outline: 2px solid var(--color-accent);
+    outline-offset: 2px;
+    box-shadow: 
+      0 0 0 4px rgba(0, 115, 206, 0.15),
+      0 4px 12px var(--color-shadow-accent);
+  }
+
+  .dark .focus-enhanced:focus {
+    outline-color: #60a5fa;
+    box-shadow: 
+      0 0 0 4px rgba(96, 165, 250, 0.15),
+      0 4px 12px rgba(96, 165, 250, 0.2);
+  }
+
+  /* Responsive Design Enhancements */
+  @media (max-width: 768px) {
+    .card-enhanced {
+      padding: 1rem;
+      border-radius: 0.75rem;
+    }
+    
+    .btn-enhanced {
+      padding: 0.75rem 1.5rem;
+      font-size: 0.8rem;
+    }
+    
+    .modal-enhanced {
+      border-radius: 1rem;
+      margin: 1rem;
+    }
+    
+    .dark-mode-toggle-new {
+      padding: 0.5rem;
+    }
+  }
+
+  /* Reduced Motion Support */
+  @media (prefers-reduced-motion: reduce) {
+    * {
+      transition: none !important;
+      animation: none !important;
+    }
+  }
+
+  /* High Contrast Mode Support */
+  @media (prefers-contrast: high) {
+    :root {
+      --color-shadow: rgba(0, 0, 0, 0.2);
+      --color-shadow-strong: rgba(0, 0, 0, 0.3);
+      --color-border-primary: #000000;
+    }
+    
+    .dark {
+      --color-border-primary: #ffffff;
+    }
+  }
+}
+
+/* Admin Panel spezifische Styles */
+@layer components {
+  /* Dark Mode Styles für Admin Panel */
+  .dark .bg-dark-card {
+    @apply bg-dark-surface transition-colors;
+  }
+
+  /* Alternative direkte Definition ohne Zirkularität */
+  .bg-dark-surface {
+    background-color: #1e293b;
+  }
+
+  /* Übergangseffekt für alle Komponenten */
+  .transition-all-colors {
+    @apply transition-colors duration-300;
+  }
+  
+  /* Admin Panel Container */
+  .admin-container {
+    @apply max-w-7xl mx-auto p-4 md:p-8;
+  }
+  
+  /* Admin Stats Cards */
+  .admin-stats {
+    @apply grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 mb-8;
+  }
+  
+  .stat-card {
+    @apply bg-white/60 dark:bg-black/70 rounded-xl border border-gray-200/60 dark:border-slate-700/30 p-5 relative overflow-hidden shadow-2xl hover:shadow-2xl transition-all duration-300 hover:-translate-y-1 backdrop-blur-xl;
+    backdrop-filter: blur(20px) saturate(180%) brightness(110%);
+    -webkit-backdrop-filter: blur(20px) saturate(180%) brightness(110%);
+    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(255, 255, 255, 0.1);
+  }
+  
+  .stat-icon {
+    @apply absolute top-4 right-4 opacity-15 text-4xl;
+  }
+  
+  .stat-title {
+    @apply text-sm text-slate-500 dark:text-slate-400 mb-2 font-medium uppercase;
+  }
+  
+  .stat-value {
+    @apply text-2xl font-bold text-slate-900 dark:text-white mb-1;
+  }
+  
+  .stat-desc {
+    @apply text-sm text-slate-500 dark:text-slate-400;
+  }
+  
+  /* Navigation Tabs */
+  .nav-tabs {
+    @apply flex border-b border-gray-200 dark:border-slate-700/30 mb-4 overflow-x-auto;
+  }
+  
+  .nav-tab {
+    @apply py-4 px-6 text-slate-600 dark:text-slate-300 border-b-2 border-transparent cursor-pointer transition-all duration-200 whitespace-nowrap hover:text-slate-900 dark:hover:text-white hover:bg-slate-50 dark:hover:bg-slate-800/50;
+  }
+  
+  .nav-tab.active {
+    @apply text-slate-900 dark:text-white border-b-2 border-black dark:border-white font-medium;
+  }
+  
+  /* Tab Content */
+  .tab-content {
+    @apply mt-8;
+  }
+  
+  .tab-pane {
+    @apply hidden;
+  }
+  
+  .tab-pane.active {
+    @apply block;
+  }
+  
+  /* Formulare für Admin Panel */
+  .form-group {
+    @apply mb-4;
+  }
+  
+  .form-label {
+    @apply block mb-2 text-sm font-medium text-slate-700 dark:text-slate-300;
+  }
+  
+  .form-input,
+  .form-select,
+  .form-textarea {
+    @apply w-full px-3 py-2 bg-white/60 dark:bg-slate-800/60 border border-gray-300/60 dark:border-slate-600/60 rounded-lg text-slate-900 dark:text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-slate-500 focus:border-transparent transition-all duration-200 backdrop-blur-lg;
+    backdrop-filter: blur(16px) saturate(150%);
+    -webkit-backdrop-filter: blur(16px) saturate(150%);
+    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(255, 255, 255, 0.05);
+  }
+  
+  /* Tabellen im Admin Panel */
+  .admin-table {
+    @apply min-w-full divide-y divide-gray-200 dark:divide-slate-700;
+  }
+  
+  .admin-table thead {
+    @apply bg-slate-50 dark:bg-slate-800;
+  }
+  
+  .admin-table th {
+    @apply px-6 py-3 text-left text-xs font-medium text-slate-500 dark:text-slate-400 uppercase tracking-wider;
+  }
+  
+  .admin-table tbody {
+    @apply bg-white dark:bg-dark-surface divide-y divide-gray-200 dark:divide-slate-700;
+  }
+  
+  .admin-table tr {
+    @apply hover:bg-slate-50 dark:hover:bg-slate-700/50 transition-colors;
+  }
+  
+  .admin-table td {
+    @apply px-6 py-4 whitespace-nowrap text-sm text-slate-900 dark:text-white;
+  }
+  
+  /* Status Badges */
+  .badge {
+    @apply px-2 inline-flex text-xs leading-5 font-semibold rounded-full;
+  }
+  
+  .badge-success {
+    @apply bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200;
+  }
+  
+  .badge-error {
+    @apply bg-red-100 text-red-800 dark:bg-red-900 dark:text-red-200;
+  }
+  
+  .badge-warning {
+    @apply bg-yellow-100 text-yellow-800 dark:bg-yellow-900 dark:text-yellow-200;
+  }
+  
+  .badge-info {
+    @apply bg-blue-100 text-blue-800 dark:bg-blue-900 dark:text-blue-200;
+  }
+  
+  /* Drucker-Karten */
+  .printer-card {
+    @apply bg-white/60 dark:bg-black/70 rounded-xl border border-gray-200/60 dark:border-slate-700/30 p-6 shadow-2xl hover:shadow-2xl transition-all duration-300 hover:-translate-y-1 backdrop-blur-xl;
+    backdrop-filter: blur(20px) saturate(180%) brightness(110%);
+    -webkit-backdrop-filter: blur(20px) saturate(180%) brightness(110%);
+    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(255, 255, 255, 0.1);
+  }
+  
+  .printer-header {
+    @apply flex justify-between items-center mb-4;
+  }
+  
+  .printer-name {
+    @apply text-xl font-bold text-slate-900 dark:text-white;
+  }
+  
+  .printer-actions {
+    @apply flex space-x-2;
+  }
+  
+  .printer-info {
+    @apply grid grid-cols-2 gap-4 mb-4;
+  }
+  
+  .printer-status {
+    @apply flex items-center mt-4;
+  }
+  
+  /* Status Indikatoren */
+  .status-indicator {
+    @apply w-3 h-3 rounded-full mr-2;
+  }
+  
+  .status-running {
+    @apply bg-green-500;
+    animation: pulse 2s infinite;
+  }
+  
+  .status-stopped {
+    @apply bg-red-500;
+  }
+  
+  /* Pulse Animation */
+  @keyframes pulse {
+    0% {
+      opacity: 1;
+      transform: scale(1);
+    }
+    50% {
+      opacity: 0.5;
+      transform: scale(1.1);
+    }
+    100% {
+      opacity: 1;
+      transform: scale(1);
+    }
+  }
+  
+  /* Log-Einträge */
+  .log-entry {
+    @apply p-3 border-l-4 mb-2 rounded-r-lg bg-white dark:bg-slate-800 hover:bg-slate-50 dark:hover:bg-slate-700 transition-colors;
+  }
+  
+  .log-debug {
+    @apply border-gray-400 dark:border-gray-500;
+  }
+  
+  .log-info {
+    @apply border-blue-400 dark:border-blue-500;
+  }
+  
+  .log-warning {
+    @apply border-yellow-400 dark:border-yellow-500;
+  }
+  
+  .log-error {
+    @apply border-red-400 dark:border-red-500;
+  }
+  
+  .log-critical {
+    @apply border-purple-400 dark:border-purple-500;
+  }
+  
+  /* Scheduler Status */
+  .scheduler-status {
+    @apply flex items-center p-4 bg-white dark:bg-slate-800 rounded-lg border border-gray-200 dark:border-slate-700 shadow-md;
+  }
+  
+  /* Fortschrittsbalken */
+  .progress-bar {
+    @apply w-full h-2 bg-gray-200 dark:bg-slate-700 rounded-full overflow-hidden;
+  }
+  
+  .progress-bar-fill {
+    @apply h-full transition-all duration-300;
+  }
+  
+  .progress-bar-fill-blue {
+    @apply bg-blue-500 dark:bg-blue-600;
+  }
+  
+  .progress-bar-fill-green {
+    @apply bg-green-500 dark:bg-green-600;
+  }
+  
+  .progress-bar-fill-purple {
+    @apply bg-purple-500 dark:bg-purple-600;
+  }
+  
+  /* Benachrichtigungen */
+  .notification {
+    @apply fixed top-4 right-4 max-w-md p-4 rounded-2xl shadow-2xl transform translate-x-full opacity-0 transition-all duration-500 z-50;
+    background: rgba(255, 255, 255, 0.08);
+    backdrop-filter: blur(40px) saturate(200%) brightness(130%) contrast(110%);
+    -webkit-backdrop-filter: blur(40px) saturate(200%) brightness(130%) contrast(110%);
+    border: 1px solid rgba(255, 255, 255, 0.25);
+    box-shadow: 
+      0 32px 64px rgba(0, 0, 0, 0.25),
+      0 12px 24px rgba(0, 0, 0, 0.15),
+      inset 0 1px 0 rgba(255, 255, 255, 0.4),
+      0 0 0 1px rgba(255, 255, 255, 0.1);
+    animation: notification-slide-in 0.6s cubic-bezier(0.4, 0, 0.2, 1);
+  }
+
+  .dark .notification {
+    background: rgba(0, 0, 0, 0.2);
+    backdrop-filter: blur(40px) saturate(180%) brightness(120%) contrast(115%);
+    -webkit-backdrop-filter: blur(40px) saturate(180%) brightness(120%) contrast(115%);
+    border: 1px solid rgba(255, 255, 255, 0.15);
+    box-shadow: 
+      0 32px 64px rgba(0, 0, 0, 0.6),
+      0 12px 24px rgba(0, 0, 0, 0.4),
+      inset 0 1px 0 rgba(255, 255, 255, 0.2),
+      0 0 0 1px rgba(255, 255, 255, 0.05);
+  }
+  
+  .notification.show {
+    @apply translate-x-0 opacity-100;
+  }
+
+  .notification:hover {
+    transform: translateY(-2px) scale(1.02);
+    box-shadow: 
+      0 40px 80px rgba(0, 0, 0, 0.3),
+      0 16px 32px rgba(0, 0, 0, 0.2),
+      inset 0 1px 0 rgba(255, 255, 255, 0.5),
+      0 0 0 1px rgba(255, 255, 255, 0.15);
+  }
+
+  .dark .notification:hover {
+    box-shadow: 
+      0 40px 80px rgba(0, 0, 0, 0.7),
+      0 16px 32px rgba(0, 0, 0, 0.5),
+      inset 0 1px 0 rgba(255, 255, 255, 0.3),
+      0 0 0 1px rgba(255, 255, 255, 0.1);
+  }
+  
+  .notification-success {
+    @apply text-green-100;
+    background: linear-gradient(135deg, 
+      rgba(34, 197, 94, 0.25) 0%, 
+      rgba(134, 239, 172, 0.18) 50%, 
+      rgba(34, 197, 94, 0.12) 100%);
+    border: 1px solid rgba(34, 197, 94, 0.4);
+    box-shadow: 
+      0 32px 64px rgba(34, 197, 94, 0.2),
+      0 12px 24px rgba(34, 197, 94, 0.1),
+      inset 0 1px 0 rgba(255, 255, 255, 0.4),
+      0 0 0 1px rgba(34, 197, 94, 0.3);
+  }
+  
+  .notification-error {
+    @apply text-red-100;
+    background: linear-gradient(135deg, 
+      rgba(239, 68, 68, 0.25) 0%, 
+      rgba(252, 165, 165, 0.18) 50%, 
+      rgba(239, 68, 68, 0.12) 100%);
+    border: 1px solid rgba(239, 68, 68, 0.4);
+    box-shadow: 
+      0 32px 64px rgba(239, 68, 68, 0.2),
+      0 12px 24px rgba(239, 68, 68, 0.1),
+      inset 0 1px 0 rgba(255, 255, 255, 0.4),
+      0 0 0 1px rgba(239, 68, 68, 0.3);
+  }
+  
+  .notification-warning {
+    @apply text-yellow-100;
+    background: linear-gradient(135deg, 
+      rgba(245, 158, 11, 0.25) 0%, 
+      rgba(252, 211, 77, 0.18) 50%, 
+      rgba(245, 158, 11, 0.12) 100%);
+    border: 1px solid rgba(245, 158, 11, 0.4);
+    box-shadow: 
+      0 32px 64px rgba(245, 158, 11, 0.2),
+      0 12px 24px rgba(245, 158, 11, 0.1),
+      inset 0 1px 0 rgba(255, 255, 255, 0.4),
+      0 0 0 1px rgba(245, 158, 11, 0.3);
+  }
+  
+  .notification-info {
+    @apply text-blue-100;
+    background: linear-gradient(135deg, 
+      rgba(59, 130, 246, 0.25) 0%, 
+      rgba(147, 197, 253, 0.18) 50%, 
+      rgba(59, 130, 246, 0.12) 100%);
+    border: 1px solid rgba(59, 130, 246, 0.4);
+    box-shadow: 
+      0 32px 64px rgba(59, 130, 246, 0.2),
+      0 12px 24px rgba(59, 130, 246, 0.1),
+      inset 0 1px 0 rgba(255, 255, 255, 0.4),
+      0 0 0 1px rgba(59, 130, 246, 0.3);
+  }
+
+  /* Toast-Benachrichtigungen - Einheitlich */
+  .toast-notification {
+    @apply fixed z-50 p-4 rounded-2xl shadow-2xl transform transition-all duration-500 text-sm font-medium;
+    background: rgba(255, 255, 255, 0.08);
+    backdrop-filter: blur(40px) saturate(200%) brightness(130%) contrast(110%);
+    -webkit-backdrop-filter: blur(40px) saturate(200%) brightness(130%) contrast(110%);
+    border: 1px solid rgba(255, 255, 255, 0.25);
+    box-shadow: 
+      0 32px 64px rgba(0, 0, 0, 0.25),
+      0 12px 24px rgba(0, 0, 0, 0.15),
+      inset 0 1px 0 rgba(255, 255, 255, 0.4),
+      0 0 0 1px rgba(255, 255, 255, 0.1);
+  }
+
+  .dark .toast-notification {
+    background: rgba(0, 0, 0, 0.2);
+    backdrop-filter: blur(40px) saturate(180%) brightness(120%) contrast(115%);
+    -webkit-backdrop-filter: blur(40px) saturate(180%) brightness(120%) contrast(115%);
+    border: 1px solid rgba(255, 255, 255, 0.15);
+    box-shadow: 
+      0 32px 64px rgba(0, 0, 0, 0.6),
+      0 12px 24px rgba(0, 0, 0, 0.4),
+      inset 0 1px 0 rgba(255, 255, 255, 0.2),
+      0 0 0 1px rgba(255, 255, 255, 0.05);
+  }
+
+  /* Alert-Benachrichtigungen - Verbessert */
+  .alert {
+    @apply p-6 rounded-2xl border mb-6 shadow-2xl;
+    background: rgba(255, 255, 255, 0.12);
+    backdrop-filter: blur(30px) saturate(200%) brightness(120%) contrast(110%);
+    -webkit-backdrop-filter: blur(30px) saturate(200%) brightness(120%) contrast(110%);
+    border: 1px solid rgba(255, 255, 255, 0.25);
+    box-shadow: 
+      0 25px 50px rgba(0, 0, 0, 0.15),
+      0 8px 16px rgba(0, 0, 0, 0.1),
+      inset 0 1px 0 rgba(255, 255, 255, 0.3),
+      0 0 0 1px rgba(255, 255, 255, 0.1);
+    animation: alert-fade-in 0.5s ease-out;
+  }
+
+  .dark .alert {
+    background: rgba(0, 0, 0, 0.3);
+    backdrop-filter: blur(30px) saturate(180%) brightness(110%) contrast(120%);
+    -webkit-backdrop-filter: blur(30px) saturate(180%) brightness(110%) contrast(120%);
+    border: 1px solid rgba(255, 255, 255, 0.15);
+    box-shadow: 
+      0 25px 50px rgba(0, 0, 0, 0.4),
+      0 8px 16px rgba(0, 0, 0, 0.3),
+      inset 0 1px 0 rgba(255, 255, 255, 0.15),
+      0 0 0 1px rgba(255, 255, 255, 0.05);
+  }
+  
+  .alert-success {
+    @apply text-green-900 dark:text-green-100;
+    background: linear-gradient(135deg, 
+      rgba(34, 197, 94, 0.15) 0%, 
+      rgba(134, 239, 172, 0.1) 50%, 
+      rgba(34, 197, 94, 0.08) 100%);
+    border: 1px solid rgba(34, 197, 94, 0.3);
+  }
+  
+  .alert-error {
+    @apply text-red-900 dark:text-red-100;
+    background: linear-gradient(135deg, 
+      rgba(239, 68, 68, 0.15) 0%, 
+      rgba(252, 165, 165, 0.1) 50%, 
+      rgba(239, 68, 68, 0.08) 100%);
+    border: 1px solid rgba(239, 68, 68, 0.3);
+  }
+  
+  .alert-warning {
+    @apply text-yellow-900 dark:text-yellow-100;
+    background: linear-gradient(135deg, 
+      rgba(245, 158, 11, 0.15) 0%, 
+      rgba(252, 211, 77, 0.1) 50%, 
+      rgba(245, 158, 11, 0.08) 100%);
+    border: 1px solid rgba(245, 158, 11, 0.3);
+  }
+  
+  .alert-info {
+    @apply text-blue-900 dark:text-blue-100;
+    background: linear-gradient(135deg, 
+      rgba(59, 130, 246, 0.15) 0%, 
+      rgba(147, 197, 253, 0.1) 50%, 
+      rgba(59, 130, 246, 0.08) 100%);
+    border: 1px solid rgba(59, 130, 246, 0.3);
+  }
+
+  /* Browser-Notification-Container */
+  .browser-notification {
+    @apply fixed top-4 left-4 max-w-sm p-4 rounded-2xl shadow-2xl z-50;
+    background: rgba(255, 255, 255, 0.08);
+    backdrop-filter: blur(40px) saturate(200%) brightness(130%) contrast(110%);
+    -webkit-backdrop-filter: blur(40px) saturate(200%) brightness(130%) contrast(110%);
+    border: 1px solid rgba(255, 255, 255, 0.25);
+    box-shadow: 
+      0 32px 64px rgba(0, 0, 0, 0.25),
+      0 12px 24px rgba(0, 0, 0, 0.15),
+      inset 0 1px 0 rgba(255, 255, 255, 0.4),
+      0 0 0 1px rgba(255, 255, 255, 0.1);
+    animation: notification-slide-left 0.6s cubic-bezier(0.4, 0, 0.2, 1);
+  }
+
+  .dark .browser-notification {
+    background: rgba(0, 0, 0, 0.2);
+    backdrop-filter: blur(40px) saturate(180%) brightness(120%) contrast(115%);
+    -webkit-backdrop-filter: blur(40px) saturate(180%) brightness(120%) contrast(115%);
+    border: 1px solid rgba(255, 255, 255, 0.15);
+    box-shadow: 
+      0 32px 64px rgba(0, 0, 0, 0.6),
+      0 12px 24px rgba(0, 0, 0, 0.4),
+      inset 0 1px 0 rgba(255, 255, 255, 0.2),
+      0 0 0 1px rgba(255, 255, 255, 0.05);
+  }
+
+  /* Notification-Animationen */
+  @keyframes notification-slide-in {
+    0% {
+      opacity: 0;
+      transform: translateX(100%) translateY(-20px) scale(0.9);
+      backdrop-filter: blur(0px);
+    }
+    50% {
+      opacity: 0.8;
+      transform: translateX(20px) translateY(-10px) scale(1.05);
+      backdrop-filter: blur(20px);
+    }
+    100% {
+      opacity: 1;
+      transform: translateX(0) translateY(0) scale(1);
+      backdrop-filter: blur(40px);
+    }
+  }
+
+  @keyframes notification-slide-out {
+    0% {
+      opacity: 1;
+      transform: translateX(0) translateY(0) scale(1);
+    }
+    100% {
+      opacity: 0;
+      transform: translateX(100%) translateY(-20px) scale(0.9);
+    }
+  }
+
+  @keyframes notification-slide-left {
+    0% {
+      opacity: 0;
+      transform: translateX(-100%) translateY(-20px) scale(0.9);
+      backdrop-filter: blur(0px);
+    }
+    50% {
+      opacity: 0.8;
+      transform: translateX(-20px) translateY(-10px) scale(1.05);
+      backdrop-filter: blur(20px);
+    }
+    100% {
+      opacity: 1;
+      transform: translateX(0) translateY(0) scale(1);
+      backdrop-filter: blur(40px);
+    }
+  }
+
+  @keyframes alert-fade-in {
+    0% {
+      opacity: 0;
+      transform: translateY(-20px) scale(0.95);
+    }
+    100% {
+      opacity: 1;
+      transform: translateY(0) scale(1);
+    }
+  }
+
+  .notification.hiding {
+    animation: notification-slide-out 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
+  }
+
+  /* Notification-Icons mit Glassmorphism */
+  .notification-icon {
+    @apply flex items-center justify-center w-8 h-8 rounded-full mr-3 flex-shrink-0;
+    background: rgba(255, 255, 255, 0.2);
+    backdrop-filter: blur(20px);
+    -webkit-backdrop-filter: blur(20px);
+    border: 1px solid rgba(255, 255, 255, 0.3);
+    box-shadow: 
+      0 8px 16px rgba(0, 0, 0, 0.1),
+      inset 0 1px 0 rgba(255, 255, 255, 0.4);
+  }
+
+  .notification-content {
+    @apply flex-1;
+  }
+
+  .notification-title {
+    @apply font-semibold text-sm mb-1;
+  }
+
+  .notification-message {
+    @apply text-sm opacity-90;
+  }
+
+  .notification-close {
+    @apply ml-3 p-1 rounded-lg opacity-70 hover:opacity-100 transition-opacity;
+    background: rgba(255, 255, 255, 0.1);
+    backdrop-filter: blur(10px);
+    -webkit-backdrop-filter: blur(10px);
+    border: 1px solid rgba(255, 255, 255, 0.2);
+  }
+
+  .notification-close:hover {
+    background: rgba(255, 255, 255, 0.2);
+    transform: scale(1.1);
+  }
+
+  /* Multiple Notifications Container */
+  .notifications-container {
+    @apply fixed top-4 right-4 z-50 space-y-3 max-w-md;
+  }
+
+  .notifications-container-left {
+    @apply fixed top-4 left-4 z-50 space-y-3 max-w-sm;
+  }
+
+  /* Flash-Message-Verbesserungen - Vereinheitlicht */
+  .flash-message-light {
+    background: linear-gradient(135deg, 
+      rgba(255, 255, 255, 0.95) 0%, 
+      rgba(248, 250, 252, 0.9) 100%);
+    backdrop-filter: blur(32px) saturate(200%) brightness(120%);
+    -webkit-backdrop-filter: blur(32px) saturate(200%) brightness(120%);
+    border: 1px solid rgba(226, 232, 240, 0.6);
+    box-shadow: 
+      0 25px 50px rgba(0, 0, 0, 0.1),
+      0 12px 24px rgba(0, 115, 206, 0.05),
+      inset 0 1px 0 rgba(255, 255, 255, 0.8);
+    color: var(--color-text-primary);
+  }
+
+  .flash-message-light.success {
+    border-left: 4px solid #10b981;
+    background: linear-gradient(135deg, 
+      rgba(236, 253, 245, 0.95) 0%, 
+      rgba(209, 250, 229, 0.9) 100%);
+  }
+
+  .flash-message-light.error {
+    border-left: 4px solid #ef4444;
+    background: linear-gradient(135deg, 
+      rgba(254, 242, 242, 0.95) 0%, 
+      rgba(252, 165, 165, 0.9) 100%);
+  }
+
+  .flash-message-light.warning {
+    border-left: 4px solid #fbbf24;
+    background: linear-gradient(135deg, 
+      rgba(255, 251, 235, 0.95) 0%, 
+      rgba(254, 243, 199, 0.9) 100%);
+  }
+
+  .flash-message-light.info {
+    border-left: 4px solid #3b82f6;
+    background: linear-gradient(135deg, 
+      rgba(239, 246, 255, 0.95) 0%, 
+      rgba(219, 234, 254, 0.9) 100%);
+  }
+
+  /* Premium Table Styles */
+  .table-enhanced {
+    background: var(--gradient-card);
+    border: 1px solid var(--color-border-primary);
+    border-radius: var(--card-radius);
+    overflow: hidden;
+    box-shadow: 
+      0 4px 20px var(--color-shadow),
+      0 2px 8px rgba(0, 115, 206, 0.04),
+      inset 0 1px 0 rgba(255, 255, 255, 0.6);
+  }
+
+  .table-enhanced th {
+    background: linear-gradient(135deg, 
+      var(--color-bg-secondary) 0%, 
+      var(--color-bg-tertiary) 100%);
+    color: var(--color-text-primary);
+    font-weight: 600;
+    padding: 1rem 1.5rem;
+    border-bottom: 1px solid var(--color-border-primary);
+    position: relative;
+  }
+
+  .table-enhanced th::after {
+    content: '';
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    height: 1px;
+    background: linear-gradient(90deg, 
+      transparent 0%, 
+      var(--color-border-secondary) 50%, 
+      transparent 100%);
+  }
+
+  .table-enhanced td {
+    padding: 1rem 1.5rem;
+    border-bottom: 1px solid var(--color-border-primary);
+    color: var(--color-text-secondary);
+    transition: all 0.2s ease;
+  }
+
+  .table-enhanced tbody tr:hover {
+    background: var(--color-bg-secondary);
+    transform: scale(1.002);
+  }
+
+  .dark .table-enhanced {
+    background: rgba(10, 10, 10, 0.8);
+    border-color: var(--color-border-primary);
+  }
+
+  .dark .table-enhanced th {
+    background: rgba(26, 26, 26, 0.8);
+    color: var(--color-text-primary);
+  }
+
+  .dark .table-enhanced tbody tr:hover {
+    background: rgba(26, 26, 26, 0.6);
+  }
+
+  /* Premium Modal Styles */
+  .modal-enhanced {
+    background: linear-gradient(135deg, 
+      rgba(255, 255, 255, 0.98) 0%, 
+      rgba(248, 250, 252, 0.95) 50%, 
+      rgba(255, 255, 255, 0.98) 100%);
+    backdrop-filter: blur(32px) saturate(220%) brightness(120%);
+    -webkit-backdrop-filter: blur(32px) saturate(220%) brightness(120%);
+    border: 1px solid rgba(226, 232, 240, 0.7);
+    border-radius: 1.5rem;
+    box-shadow: 
+      0 50px 100px rgba(0, 0, 0, 0.15),
+      0 20px 40px rgba(0, 115, 206, 0.08),
+      inset 0 2px 0 rgba(255, 255, 255, 0.9);
+    position: relative;
+    overflow: hidden;
+  }
+
+  .modal-enhanced::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    height: 1px;
+    background: linear-gradient(90deg, 
+      transparent 0%, 
+      rgba(226, 232, 240, 0.8) 50%, 
+      transparent 100%);
+  }
+
+  .dark .modal-enhanced {
+    background: rgba(0, 0, 0, 0.95);
+    border-color: rgba(42, 42, 42, 0.7);
+    box-shadow: 
+      0 50px 100px rgba(0, 0, 0, 0.5),
+      inset 0 2px 0 rgba(255, 255, 255, 0.05);
+  }
+
+  /* Enhanced Status Badges */
+  .status-badge-enhanced {
+    display: inline-flex;
+    align-items: center;
+    padding: 0.5rem 1rem;
+    font-size: 0.75rem;
+    font-weight: 700;
+    border-radius: 9999px;
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+    border: 1px solid transparent;
+    transition: all 0.2s ease;
+    position: relative;
+    overflow: hidden;
+  }
+
+  .status-badge-enhanced::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: -100%;
+    width: 100%;
+    height: 100%;
+    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
+    transition: left 0.5s ease;
+  }
+
+  .status-badge-enhanced:hover::before {
+    left: 100%;
+  }
+
+  .status-online-enhanced {
+    background: linear-gradient(135deg, #ecfdf5 0%, #a7f3d0 100%);
+    color: #065f46;
+    border-color: rgba(16, 185, 129, 0.3);
+  }
+
+  .status-offline-enhanced {
+    background: linear-gradient(135deg, #fef2f2 0%, #fca5a5 100%);
+    color: #991b1b;
+    border-color: rgba(239, 68, 68, 0.3);
+  }
+
+  .status-printing-enhanced {
+    background: linear-gradient(135deg, #eff6ff 0%, #bfdbfe 100%);
+    color: #1e40af;
+    border-color: rgba(59, 130, 246, 0.3);
+  }
+
+  /* Dark Mode Toggle - Premium Design */
+  .dark-mode-toggle-new {
+    position: relative;
+    display: flex;
+    cursor: pointer;
+    align-items: center;
+    justify-content: center;
+    border-radius: 9999px;
+    padding: 0.625rem;
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    background: linear-gradient(135deg, 
+      rgba(248, 250, 252, 0.9) 0%, 
+      rgba(241, 245, 249, 0.8) 100%);
+    border: 1px solid rgba(226, 232, 240, 0.7);
+    box-shadow: 
+      0 4px 12px rgba(0, 0, 0, 0.06),
+      0 2px 4px rgba(0, 115, 206, 0.04),
+      inset 0 1px 0 rgba(255, 255, 255, 0.8);
+    color: var(--color-text-secondary);
+    z-index: 100;
+  }
+
+  .dark-mode-toggle-new:hover {
+    transform: translateY(-2px) scale(1.05);
+    background: linear-gradient(135deg, 
+      rgba(248, 250, 252, 0.95) 0%, 
+      rgba(241, 245, 249, 0.85) 100%);
+    box-shadow: 
+      0 8px 20px rgba(0, 0, 0, 0.1),
+      0 4px 8px rgba(0, 115, 206, 0.08),
+      inset 0 1px 0 rgba(255, 255, 255, 0.9);
+  }
+
+  .dark-mode-toggle-new:active {
+    transform: translateY(-1px) scale(0.98);
+    transition: transform 0.1s;
+  }
+
+  .dark .dark-mode-toggle-new {
+    background: rgba(10, 10, 10, 0.8);
+    border: 1px solid rgba(42, 42, 42, 0.6);
+    box-shadow: 
+      0 4px 12px rgba(0, 0, 0, 0.3),
+      inset 0 1px 0 rgba(255, 255, 255, 0.05);
+    color: var(--color-text-secondary);
+  }
+
+  .dark .dark-mode-toggle-new:hover {
+    background: rgba(10, 10, 10, 0.9);
+    box-shadow: 
+      0 8px 20px rgba(0, 0, 0, 0.4),
+      inset 0 1px 0 rgba(255, 255, 255, 0.08);
+  }
+
+  /* Icon-Animation für Dark Mode Toggle */
+  .dark-mode-toggle-new .sun-icon,
+  .dark-mode-toggle-new .moon-icon {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+  }
+
+  .dark-mode-toggle-new .sun-icon:not(.hidden) {
+    animation: icon-appear 0.5s cubic-bezier(0.25, 1, 0.5, 1) forwards;
+  }
+
+  .dark-mode-toggle-new .moon-icon:not(.hidden) {
+    animation: icon-appear 0.5s cubic-bezier(0.25, 1, 0.5, 1) forwards;
+  }
+
+  @keyframes icon-appear {
+    0% {
+      opacity: 0;
+      transform: translate(-50%, -50%) scale(0.5) rotate(-20deg);
+    }
+    100% {
+      opacity: 1;
+      transform: translate(-50%, -50%) scale(1) rotate(0);
+    }
+  }
+
+  .dark .sun-icon { display: none; }
+  .dark .moon-icon { display: block; }
+  .sun-icon { display: block; }
+  .moon-icon { display: none; }
+
+  /* User Menu Button - Premium Design */
+  .user-menu-button-new {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    border-radius: 0.75rem;
+    padding: 0.5rem;
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    background: linear-gradient(135deg, 
+      rgba(248, 250, 252, 0.8) 0%, 
+      rgba(241, 245, 249, 0.7) 100%);
+    border: 1px solid rgba(226, 232, 240, 0.6);
+    box-shadow: 
+      0 2px 8px rgba(0, 0, 0, 0.05),
+      inset 0 1px 0 rgba(255, 255, 255, 0.7);
+  }
+
+  .user-menu-button-new:hover {
+    transform: translateY(-1px);
+    background: linear-gradient(135deg, 
+      rgba(248, 250, 252, 0.9) 0%, 
+      rgba(241, 245, 249, 0.8) 100%);
+    box-shadow: 
+      0 4px 12px rgba(0, 0, 0, 0.08),
+      0 2px 4px rgba(0, 115, 206, 0.04),
+      inset 0 1px 0 rgba(255, 255, 255, 0.8);
+  }
+
+  .dark .user-menu-button-new {
+    background: rgba(10, 10, 10, 0.7);
+    border-color: rgba(42, 42, 42, 0.6);
+    box-shadow: 
+      0 2px 8px rgba(0, 0, 0, 0.2),
+      inset 0 1px 0 rgba(255, 255, 255, 0.03);
+  }
+
+  .dark .user-menu-button-new:hover {
+    background: rgba(10, 10, 10, 0.8);
+    box-shadow: 
+      0 4px 12px rgba(0, 0, 0, 0.3),
+      inset 0 1px 0 rgba(255, 255, 255, 0.05);
+  }
+
+  /* Enhanced Hover Effects */
+  .hover-lift-enhanced {
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+  }
+
+  .hover-lift-enhanced:hover {
+    transform: translateY(-3px) scale(1.01);
+    box-shadow: 
+      0 12px 30px var(--color-shadow-strong),
+      0 6px 15px var(--color-shadow-accent);
+  }
+
+  .dark .hover-lift-enhanced:hover {
+    box-shadow: 0 12px 30px var(--color-shadow);
+  }
+
+  /* Smooth Scrollbar for Light Mode */
+  ::-webkit-scrollbar {
+    width: 8px;
+    height: 8px;
+  }
+
+  ::-webkit-scrollbar-track {
+    background: var(--color-bg-secondary);
+    border-radius: 4px;
+  }
+
+  ::-webkit-scrollbar-thumb {
+    background: linear-gradient(180deg, 
+      var(--color-border-secondary) 0%, 
+      var(--color-border-primary) 100%);
+    border-radius: 4px;
+    transition: background 0.2s ease;
+  }
+
+  ::-webkit-scrollbar-thumb:hover {
+    background: linear-gradient(180deg, 
+      var(--color-accent) 0%, 
+      var(--color-accent-hover) 100%);
+  }
+
+  .dark ::-webkit-scrollbar-track {
+    background: var(--color-bg-secondary);
+  }
+
+  .dark ::-webkit-scrollbar-thumb {
+    background: var(--color-border-primary);
+  }
+
+  .dark ::-webkit-scrollbar-thumb:hover {
+    background: #60a5fa;
+  }
+
+  /* Loading States */
+  .loading-enhanced {
+    position: relative;
+    overflow: hidden;
+  }
+
+  .loading-enhanced::after {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: -100%;
+    width: 100%;
+    height: 100%;
+    background: linear-gradient(90deg, 
+      transparent, 
+      rgba(0, 115, 206, 0.1), 
+      transparent);
+    animation: loading-shimmer 2s infinite;
+  }
+
+  @keyframes loading-shimmer {
+    0% { left: -100%; }
+    100% { left: 100%; }
+  }
+
+  /* Focus States for Accessibility */
+  .focus-enhanced:focus {
+    outline: 2px solid var(--color-accent);
+    outline-offset: 2px;
+    box-shadow: 
+      0 0 0 4px rgba(0, 115, 206, 0.15),
+      0 4px 12px var(--color-shadow-accent);
+  }
+
+  .dark .focus-enhanced:focus {
+    outline-color: #60a5fa;
+    box-shadow: 
+      0 0 0 4px rgba(96, 165, 250, 0.15),
+      0 4px 12px rgba(96, 165, 250, 0.2);
+  }
+
+  /* Responsive Design Enhancements */
+  @media (max-width: 768px) {
+    .card-enhanced {
+      padding: 1rem;
+      border-radius: 0.75rem;
+    }
+    
+    .btn-enhanced {
+      padding: 0.75rem 1.5rem;
+      font-size: 0.8rem;
+    }
+    
+    .modal-enhanced {
+      border-radius: 1rem;
+      margin: 1rem;
+    }
+    
+    .dark-mode-toggle-new {
+      padding: 0.5rem;
+    }
+  }
+
+  /* Reduced Motion Support */
+  @media (prefers-reduced-motion: reduce) {
+    * {
+      transition: none !important;
+      animation: none !important;
+    }
+  }
+
+  /* High Contrast Mode Support */
+  @media (prefers-contrast: high) {
+    :root {
+      --color-shadow: rgba(0, 0, 0, 0.2);
+      --color-shadow-strong: rgba(0, 0, 0, 0.3);
+      --color-border-primary: #000000;
+    }
+    
+    .dark {
+      --color-border-primary: #ffffff;
+    }
+  }
+}
+
+/* Glassmorphism Flash Messages */
+.flash-message {
+  @apply fixed top-4 right-4 px-6 py-4 rounded-2xl text-sm font-medium shadow-2xl transform transition-all duration-500 z-50 border;
+  /* Verstärkter Glassmorphism-Effekt */
+  background: rgba(255, 255, 255, 0.08);
+  backdrop-filter: blur(40px) saturate(200%) brightness(130%) contrast(110%);
+  -webkit-backdrop-filter: blur(40px) saturate(200%) brightness(130%) contrast(110%);
+  border: 1px solid rgba(255, 255, 255, 0.25);
+  box-shadow: 
+    0 32px 64px rgba(0, 0, 0, 0.25),
+    0 12px 24px rgba(0, 0, 0, 0.15),
+    inset 0 1px 0 rgba(255, 255, 255, 0.4),
+    0 0 0 1px rgba(255, 255, 255, 0.1);
+  animation: flash-slide-in 0.5s cubic-bezier(0.4, 0, 0.2, 1);
+  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.dark .flash-message {
+  background: rgba(0, 0, 0, 0.2);
+  backdrop-filter: blur(40px) saturate(180%) brightness(120%) contrast(115%);
+  -webkit-backdrop-filter: blur(40px) saturate(180%) brightness(120%) contrast(115%);
+  border: 1px solid rgba(255, 255, 255, 0.15);
+  box-shadow: 
+    0 32px 64px rgba(0, 0, 0, 0.6),
+    0 12px 24px rgba(0, 0, 0, 0.4),
+    inset 0 1px 0 rgba(255, 255, 255, 0.2),
+    0 0 0 1px rgba(255, 255, 255, 0.05);
+}
+
+.flash-message:hover {
+  transform: translateY(-2px) scale(1.02);
+  box-shadow: 
+    0 40px 80px rgba(0, 0, 0, 0.3),
+    0 16px 32px rgba(0, 0, 0, 0.2),
+    inset 0 1px 0 rgba(255, 255, 255, 0.5),
+    0 0 0 1px rgba(255, 255, 255, 0.15);
+}
+
+.dark .flash-message:hover {
+  box-shadow: 
+    0 40px 80px rgba(0, 0, 0, 0.7),
+    0 16px 32px rgba(0, 0, 0, 0.5),
+    inset 0 1px 0 rgba(255, 255, 255, 0.3),
+    0 0 0 1px rgba(255, 255, 255, 0.1);
+}
+
+.flash-message.info {
+  @apply text-blue-100;
+  background: linear-gradient(135deg, 
+    rgba(59, 130, 246, 0.2) 0%, 
+    rgba(147, 197, 253, 0.15) 50%, 
+    rgba(59, 130, 246, 0.1) 100%);
+  border: 1px solid rgba(59, 130, 246, 0.3);
+}
+
+.flash-message.success {
+  @apply text-green-100;
+  background: linear-gradient(135deg, 
+    rgba(34, 197, 94, 0.2) 0%, 
+    rgba(134, 239, 172, 0.15) 50%, 
+    rgba(34, 197, 94, 0.1) 100%);
+  border: 1px solid rgba(34, 197, 94, 0.3);
+}
+
+.flash-message.warning {
+  @apply text-yellow-100;
+  background: linear-gradient(135deg, 
+    rgba(245, 158, 11, 0.2) 0%, 
+    rgba(252, 211, 77, 0.15) 50%, 
+    rgba(245, 158, 11, 0.1) 100%);
+  border: 1px solid rgba(245, 158, 11, 0.3);
+}
+
+.flash-message.error {
+  @apply text-red-100;
+  background: linear-gradient(135deg, 
+    rgba(239, 68, 68, 0.2) 0%, 
+    rgba(252, 165, 165, 0.15) 50%, 
+    rgba(239, 68, 68, 0.1) 100%);
+  border: 1px solid rgba(239, 68, 68, 0.3);
+}
+
+/* Flash Message Animation */
+@keyframes flash-slide-in {
+  0% {
+    opacity: 0;
+    transform: translateX(100%) translateY(-20px) scale(0.9);
+    backdrop-filter: blur(0px);
+  }
+  50% {
+    opacity: 0.8;
+    transform: translateX(20px) translateY(-10px) scale(1.05);
+    backdrop-filter: blur(20px);
+  }
+  100% {
+    opacity: 1;
+    transform: translateX(0) translateY(0) scale(1);
+    backdrop-filter: blur(40px);
+  }
+}
+
+@keyframes flash-slide-out {
+  0% {
+    opacity: 1;
+    transform: translateX(0) translateY(0) scale(1);
+  }
+  100% {
+    opacity: 0;
+    transform: translateX(100%) translateY(-20px) scale(0.9);
+  }
+}
+
+.flash-message.hiding {
+  animation: flash-slide-out 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
+}
+
+/* Do Not Disturb System Styles */
+.dnd-toggle {
+  @apply relative inline-flex items-center h-6 rounded-full w-11 transition-colors duration-300 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500;
+  background: rgba(156, 163, 175, 0.3);
+  backdrop-filter: blur(10px);
+  border: 1px solid rgba(156, 163, 175, 0.2);
+}
+
+.dnd-toggle.active {
+  background: rgba(239, 68, 68, 0.3);
+  border: 1px solid rgba(239, 68, 68, 0.4);
+}
+
+.dnd-toggle-slider {
+  @apply inline-block h-4 w-4 rounded-full shadow-lg transform transition-transform duration-300;
+  background: rgba(255, 255, 255, 0.9);
+  backdrop-filter: blur(10px);
+  border: 1px solid rgba(255, 255, 255, 0.3);
+  box-shadow: 
+    0 4px 8px rgba(0, 0, 0, 0.2),
+    0 2px 4px rgba(0, 0, 0, 0.1);
+  margin: 0.125rem;
+}
+
+.dnd-toggle.active .dnd-toggle-slider {
+  transform: translateX(1.25rem);
+  background: rgba(255, 255, 255, 1);
+  box-shadow: 
+    0 6px 12px rgba(239, 68, 68, 0.3),
+    0 3px 6px rgba(239, 68, 68, 0.2);
+}
+
+.dnd-indicator {
+  @apply fixed top-4 left-4 z-50 flex items-center px-3 py-2 rounded-lg text-sm font-medium transition-all duration-300;
+  background: rgba(239, 68, 68, 0.1);
+  backdrop-filter: blur(20px) saturate(150%);
+  -webkit-backdrop-filter: blur(20px) saturate(150%);
+  border: 1px solid rgba(239, 68, 68, 0.3);
+  color: rgb(239, 68, 68);
+  transform: translateY(-100%);
+  opacity: 0;
+}
+
+.dnd-indicator.active {
+  transform: translateY(0);
+  opacity: 1;
+}
+
+.dnd-modal {
+  @apply fixed inset-0 z-50 flex items-center justify-center p-4;
+  background: rgba(0, 0, 0, 0.3);
+  backdrop-filter: blur(20px);
+  -webkit-backdrop-filter: blur(20px);
+}
+
+.dnd-modal-content {
+  @apply w-full max-w-md rounded-2xl p-6 shadow-2xl transform transition-all;
+  background: rgba(255, 255, 255, 0.1);
+  backdrop-filter: blur(40px) saturate(200%) brightness(120%);
+  -webkit-backdrop-filter: blur(40px) saturate(200%) brightness(120%);
+  border: 1px solid rgba(255, 255, 255, 0.3);
+  box-shadow: 
+    0 25px 50px rgba(0, 0, 0, 0.25),
+    0 8px 16px rgba(0, 0, 0, 0.15),
+    inset 0 1px 0 rgba(255, 255, 255, 0.4);
+}
+
+.dark .dnd-modal-content {
+  background: rgba(0, 0, 0, 0.3);
+  backdrop-filter: blur(40px) saturate(180%) brightness(110%);
+  -webkit-backdrop-filter: blur(40px) saturate(180%) brightness(110%);
+  border: 1px solid rgba(255, 255, 255, 0.15);
+  box-shadow: 
+    0 25px 50px rgba(0, 0, 0, 0.6),
+    0 8px 16px rgba(0, 0, 0, 0.4),
+    inset 0 1px 0 rgba(255, 255, 255, 0.2);
+}
+
+/* DND Flash Message Override */
+.flash-message.dnd-suppressed {
+  animation: flash-fade-in 0.3s ease-out;
+  opacity: 0.3;
+  transform: scale(0.95);
+  pointer-events: none;
+}
+
+@keyframes flash-fade-in {
+  0% {
+    opacity: 0;
+    transform: scale(0.9);
+  }
+  100% {
+    opacity: 0.3;
+    transform: scale(0.95);
+  }
+}
+
+/* Notification Counter */
+.dnd-counter {
+  @apply absolute -top-2 -right-2 bg-red-500 text-white text-xs rounded-full h-5 w-5 flex items-center justify-center font-bold;
+  background: rgba(239, 68, 68, 0.9);
+  backdrop-filter: blur(10px);
+  border: 1px solid rgba(255, 255, 255, 0.2);
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
+  animation: dnd-counter-bounce 0.5s ease-out;
+}
+
+@keyframes dnd-counter-bounce {
+  0% {
+    transform: scale(0);
+  }
+  50% {
+    transform: scale(1.2);
+  }
+  100% {
+    transform: scale(1);
+  }
+}
+
+@keyframes slide-down {
+  0% {
+    opacity: 0;
+    transform: translateY(-20px);
+  }
+  100% {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+/* Mercedes Background Pattern */
+.mercedes-background::before {
+  content: '';
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: -1;
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80' width='80' height='80' opacity='0.03' fill='currentColor'%3E%3Cpath d='M58.6,4.5C53,1.6,46.7,0,40,0c-6.7,0-13,1.6-18.6,4.5v0C8.7,11.2,0,24.6,0,40c0,15.4,8.7,28.8,21.5,35.5C27,78.3,33.3,80,40,80c6.7,0,12.9-1.7,18.5-4.6C71.3,68.8,80,55.4,80,40C80,24.6,71.3,11.2,58.6,4.5z M4,40c0-13.1,7-24.5,17.5-30.9v0C26.6,6,32.5,4.2,39,4l-4.5,32.7L21.5,46.8v0L8.3,57.1C5.6,52,4,46.2,4,40z M58.6,70.8C53.1,74.1,46.8,76,40,76c-6.8,0-13.2-1.9-18.6-5.2c-4.9-2.9-8.9-6.9-11.9-11.7l11.9-4.9v0L40,46.6l18.6,7.5v0l12,4.9C67.6,63.9,63.4,67.9,58.6,70.8z M58.6,46.8L58.6,46.8l-12.9-10L41.1,4c6.3,0.2,12.3,2,17.4,5.1v0C69,15.4,76,26.9,76,40c0,6.2-1.5,12-4.3,17.1L58.6,46.8z'/%3E%3C/svg%3E");
+  background-position: center;
+  background-repeat: repeat;
+  background-size: 120px 120px;
+  pointer-events: none;
+  opacity: 0.03;
+  transition: opacity 0.3s ease;
+}
+
+.dark .mercedes-background::before {
+  opacity: 0.015; /* Sehr subtil für eleganten Dark Mode */
+  filter: invert(1) brightness(0.3);
+  background-size: 150px 150px; /* Größere Sterne für bessere Sichtbarkeit */
+}
+
+/* Monochrome Button Styles */
+@layer components {
+  /* Buttons mit verstärktem Glassmorphism */
+  .btn-primary {
+    @apply text-white dark:text-slate-900 px-4 py-2 rounded-lg transition-all duration-300 focus:outline-none focus:ring-2 focus:ring-gray-500 focus:ring-offset-2 shadow-2xl hover:-translate-y-0.5;
+    background: rgba(0, 0, 0, 0.7);
+    backdrop-filter: blur(20px) saturate(150%) brightness(110%);
+    -webkit-backdrop-filter: blur(20px) saturate(150%) brightness(110%);
+    border: 1px solid rgba(255, 255, 255, 0.2);
+    box-shadow: 
+      0 20px 40px rgba(0, 0, 0, 0.3),
+      0 8px 16px rgba(0, 0, 0, 0.2),
+      inset 0 1px 0 rgba(255, 255, 255, 0.2),
+      0 0 0 1px rgba(255, 255, 255, 0.1);
+  }
+
+  .btn-primary:hover {
+    background: rgba(0, 0, 0, 0.9);
+    backdrop-filter: blur(25px) saturate(180%) brightness(120%);
+    -webkit-backdrop-filter: blur(25px) saturate(180%) brightness(120%);
+    border: 1px solid rgba(255, 255, 255, 0.3);
+    box-shadow: 
+      0 25px 50px rgba(0, 0, 0, 0.4),
+      0 10px 20px rgba(0, 0, 0, 0.3),
+      inset 0 1px 0 rgba(255, 255, 255, 0.3);
+  }
+
+  .dark .btn-primary {
+    background: rgba(255, 255, 255, 0.7);
+    border: 1px solid rgba(0, 0, 0, 0.1);
+    box-shadow: 
+      0 20px 40px rgba(0, 0, 0, 0.2),
+      0 8px 16px rgba(0, 0, 0, 0.1),
+      inset 0 1px 0 rgba(255, 255, 255, 0.8),
+      0 0 0 1px rgba(0, 0, 0, 0.05);
+  }
+
+  .dark .btn-primary:hover {
+    background: rgba(255, 255, 255, 0.9);
+    border: 1px solid rgba(0, 0, 0, 0.15);
+    box-shadow: 
+      0 25px 50px rgba(0, 0, 0, 0.3),
+      0 10px 20px rgba(0, 0, 0, 0.2),
+      inset 0 1px 0 rgba(255, 255, 255, 0.9);
+  }
+  
+  .btn-secondary {
+    @apply text-slate-900 dark:text-white px-4 py-2 rounded-lg transition-all duration-300 focus:outline-none focus:ring-2 focus:ring-slate-500 focus:ring-offset-2 shadow-2xl hover:-translate-y-0.5;
+    background: rgba(255, 255, 255, 0.3);
+    backdrop-filter: blur(20px) saturate(150%) brightness(110%);
+    -webkit-backdrop-filter: blur(20px) saturate(150%) brightness(110%);
+    border: 1px solid rgba(255, 255, 255, 0.4);
+    box-shadow: 
+      0 20px 40px rgba(0, 0, 0, 0.15),
+      0 8px 16px rgba(0, 0, 0, 0.1),
+      inset 0 1px 0 rgba(255, 255, 255, 0.5),
+      0 0 0 1px rgba(255, 255, 255, 0.2);
+  }
+
+  .btn-secondary:hover {
+    background: rgba(255, 255, 255, 0.5);
+    backdrop-filter: blur(25px) saturate(180%) brightness(120%);
+    -webkit-backdrop-filter: blur(25px) saturate(180%) brightness(120%);
+    border: 1px solid rgba(255, 255, 255, 0.6);
+    box-shadow: 
+      0 25px 50px rgba(0, 0, 0, 0.2),
+      0 10px 20px rgba(0, 0, 0, 0.15),
+      inset 0 1px 0 rgba(255, 255, 255, 0.7);
+  }
+
+  .dark .btn-secondary {
+    background: rgba(0, 0, 0, 0.4);
+    border: 1px solid rgba(255, 255, 255, 0.2);
+    box-shadow: 
+      0 20px 40px rgba(0, 0, 0, 0.3),
+      0 8px 16px rgba(0, 0, 0, 0.2),
+      inset 0 1px 0 rgba(255, 255, 255, 0.2),
+      0 0 0 1px rgba(255, 255, 255, 0.1);
+  }
+
+  .dark .btn-secondary:hover {
+    background: rgba(0, 0, 0, 0.6);
+    border: 1px solid rgba(255, 255, 255, 0.3);
+    box-shadow: 
+      0 25px 50px rgba(0, 0, 0, 0.4),
+      0 10px 20px rgba(0, 0, 0, 0.3),
+      inset 0 1px 0 rgba(255, 255, 255, 0.3);
+  }
+  
+  .btn-outline {
+    @apply border-2 border-black/70 hover:bg-black/70 dark:border-white/70 dark:hover:bg-white/70 text-black hover:text-white dark:text-white dark:hover:text-slate-900 px-4 py-2 rounded-lg transition-all duration-300 focus:outline-none focus:ring-2 focus:ring-gray-500 focus:ring-offset-2 backdrop-blur-lg;
+    backdrop-filter: blur(16px) saturate(150%);
+    -webkit-backdrop-filter: blur(16px) saturate(150%);
+    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(255, 255, 255, 0.05);
+  }
+  
+  /* Glassmorphism Card mit abgerundeten Ecken - Verstärkt */
+  .glass-card {
+    @apply rounded-xl p-6 shadow-2xl transition-all duration-300;
+    background: rgba(255, 255, 255, 0.15);
+    backdrop-filter: blur(30px) saturate(200%) brightness(120%) contrast(110%);
+    -webkit-backdrop-filter: blur(30px) saturate(200%) brightness(120%) contrast(110%);
+    border: 1px solid rgba(255, 255, 255, 0.3);
+    box-shadow: 
+      0 25px 50px rgba(0, 0, 0, 0.15),
+      0 8px 16px rgba(0, 0, 0, 0.1),
+      inset 0 1px 0 rgba(255, 255, 255, 0.3),
+      0 0 0 1px rgba(255, 255, 255, 0.1);
+    border-radius: var(--card-radius);
+  }
+
+  .dark .glass-card {
+    background: rgba(0, 0, 0, 0.3);
+    backdrop-filter: blur(30px) saturate(180%) brightness(110%) contrast(120%);
+    -webkit-backdrop-filter: blur(30px) saturate(180%) brightness(110%) contrast(120%);
+    border: 1px solid rgba(255, 255, 255, 0.15);
+    box-shadow: 
+      0 25px 50px rgba(0, 0, 0, 0.4),
+      0 8px 16px rgba(0, 0, 0, 0.3),
+      inset 0 1px 0 rgba(255, 255, 255, 0.15),
+      0 0 0 1px rgba(255, 255, 255, 0.05);
+  }
+  
+  /* Dashboard Cards mit verstärktem Glassmorphism */
+  .dashboard-card {
+    @apply rounded-xl p-6 shadow-2xl transition-all duration-300 hover:-translate-y-1;
+    background: rgba(255, 255, 255, 0.12);
+    backdrop-filter: blur(35px) saturate(200%) brightness(125%) contrast(115%);
+    -webkit-backdrop-filter: blur(35px) saturate(200%) brightness(125%) contrast(115%);
+    border: 1px solid rgba(255, 255, 255, 0.25);
+    box-shadow: 
+      0 25px 50px rgba(0, 0, 0, 0.15),
+      0 8px 16px rgba(0, 0, 0, 0.08),
+      inset 0 1px 0 rgba(255, 255, 255, 0.25),
+      0 0 0 1px rgba(255, 255, 255, 0.1);
+    border-radius: var(--card-radius);
+  }
+
+  .dark .dashboard-card {
+    background: rgba(0, 0, 0, 0.35);
+    backdrop-filter: blur(35px) saturate(180%) brightness(115%) contrast(125%);
+    -webkit-backdrop-filter: blur(35px) saturate(180%) brightness(115%) contrast(125%);
+    border: 1px solid rgba(255, 255, 255, 0.12);
+    box-shadow: 
+      0 25px 50px rgba(0, 0, 0, 0.5),
+      0 8px 16px rgba(0, 0, 0, 0.3),
+      inset 0 1px 0 rgba(255, 255, 255, 0.12),
+      0 0 0 1px rgba(255, 255, 255, 0.05);
+  }
+  
+  /* Navigation Styles */
+  .nav-link {
+    @apply flex items-center px-4 py-2 rounded-lg text-sm font-medium transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-slate-500 focus:ring-offset-2 text-slate-700 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700/50 hover:shadow-md;
+  }
+  
+  .nav-link.active {
+    @apply text-slate-900 dark:text-white bg-slate-100 dark:bg-black shadow-sm;
+  }
+
+  /* Verbesserte Navbar Styles - Verstärktes Glassmorphism */
+  .navbar {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 0.5rem 1rem;
+    background: rgba(255, 255, 255, 0.1);
+    backdrop-filter: blur(10px);
+    border-radius: 10px;
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+    transition: all 0.3s ease;
+  }
+
+  .navbar-button {
+    padding: 0.25rem 0.5rem;
+    font-size: 0.875rem;
+    border-radius: 5px;
+    transition: background-color 0.3s ease;
+  }
+
+  .navbar-button:hover {
+    background-color: rgba(255, 255, 255, 0.2);
+  }
+
+  @media (max-width: 768px) {
+    .navbar {
+      flex-direction: column;
+      padding: 0.25rem;
+    }
+    .navbar-button {
+      margin: 0.25rem 0;
+    }
+  }
+
+  .dark .navbar {
+    background: rgba(0, 0, 0, 0.25);
+    backdrop-filter: blur(40px) saturate(180%) brightness(120%) contrast(120%);
+    -webkit-backdrop-filter: blur(40px) saturate(180%) brightness(120%) contrast(120%);
+    box-shadow: 
+      0 8px 32px rgba(0, 0, 0, 0.6),
+      0 2px 8px rgba(0, 0, 0, 0.4),
+      inset 0 1px 0 rgba(255, 255, 255, 0.1),
+      0 0 0 1px rgba(255, 255, 255, 0.05);
+    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+  }
+
+  .navbar-brand {
+    @apply flex items-center space-x-2 transition-transform duration-300 hover:scale-105;
+  }
+
+  .navbar-menu {
+    @apply flex items-center justify-center space-x-1 md:space-x-3 lg:space-x-6 p-3 mx-4 rounded-2xl border;
+    background: rgba(255, 255, 255, 0.25);
+    backdrop-filter: blur(20px) saturate(150%) brightness(110%);
+    -webkit-backdrop-filter: blur(20px) saturate(150%) brightness(110%);
+    border: 1px solid rgba(255, 255, 255, 0.3);
+    box-shadow: 
+      0 4px 16px rgba(0, 0, 0, 0.1),
+      inset 0 1px 0 rgba(255, 255, 255, 0.4),
+      0 0 0 1px rgba(255, 255, 255, 0.1);
+  }
+
+  .dark .navbar-menu {
+    background: rgba(0, 0, 0, 0.4);
+    backdrop-filter: blur(20px) saturate(150%) brightness(110%);
+    -webkit-backdrop-filter: blur(20px) saturate(150%) brightness(110%);
+    border: 1px solid rgba(255, 255, 255, 0.15);
+    box-shadow: 
+      0 4px 16px rgba(0, 0, 0, 0.3),
+      inset 0 1px 0 rgba(255, 255, 255, 0.2),
+      0 0 0 1px rgba(255, 255, 255, 0.05);
+  }
+
+  .navbar-button {
+    @apply p-2 rounded-full transition-colors duration-300 focus:outline-none focus:ring-2 focus:ring-offset-2;
+  }
+
+  /* User Menu Styles */
+  .user-menu-button {
+    @apply flex items-center space-x-2 rounded-lg p-1 transition-all duration-300 hover:bg-gray-100/80 dark:hover:bg-slate-700/60 focus:outline-none focus:ring-2 focus:ring-slate-500 focus:ring-offset-2;
+  }
+
+  .user-avatar {
+    @apply w-10 h-10 bg-black dark:bg-white text-white dark:text-slate-900 rounded-full flex items-center justify-center font-bold text-sm shadow-md transition-all duration-300 hover:shadow-lg;
+  }
+  
+  /* Avatar im Dropdown */
+  .avatar-large {
+    @apply w-14 h-14 bg-black dark:bg-white text-white dark:text-slate-900 rounded-full flex items-center justify-center font-bold text-lg shadow-md;
+  }
+
+  .user-dropdown-item {
+    @apply flex items-center px-4 py-3 text-sm text-slate-700 dark:text-slate-300 hover:bg-gray-100/80 dark:hover:bg-slate-700/60 hover:text-slate-900 dark:hover:text-white transition-all duration-300 focus:outline-none focus:bg-gray-100/80 dark:focus:bg-slate-700/60;
+  }
+
+  .user-dropdown-separator {
+    @apply border-t border-gray-200/80 dark:border-slate-700/30 my-1;
+  }
+
+  .menu-item {
+    @apply flex items-center space-x-2 px-4 py-2.5 text-slate-700 dark:text-slate-300 rounded-xl transition-all duration-300;
+    background: rgba(255, 255, 255, 0.1);
+    backdrop-filter: blur(10px);
+    -webkit-backdrop-filter: blur(10px);
+    border: 1px solid rgba(255, 255, 255, 0.2);
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
+  }
+
+  .menu-item:hover {
+    @apply text-slate-900 dark:text-white;
+    background: rgba(255, 255, 255, 0.3);
+    backdrop-filter: blur(15px) saturate(150%);
+    -webkit-backdrop-filter: blur(15px) saturate(150%);
+    border: 1px solid rgba(255, 255, 255, 0.4);
+    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
+    transform: translateY(-1px);
+  }
+
+  .dark .menu-item {
+    background: rgba(0, 0, 0, 0.2);
+    border: 1px solid rgba(255, 255, 255, 0.1);
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
+  }
+
+  .dark .menu-item:hover {
+    background: rgba(0, 0, 0, 0.4);
+    border: 1px solid rgba(255, 255, 255, 0.2);
+    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
+  }
+
+  .menu-item.active {
+    @apply text-slate-900 dark:text-white font-medium;
+    background: rgba(255, 255, 255, 0.5);
+    backdrop-filter: blur(20px) saturate(180%);
+    -webkit-backdrop-filter: blur(20px) saturate(180%);
+    border: 1px solid rgba(255, 255, 255, 0.6);
+    box-shadow: 
+      0 4px 16px rgba(0, 0, 0, 0.15),
+      inset 0 1px 0 rgba(255, 255, 255, 0.5);
+  }
+
+  .dark .menu-item.active {
+    background: rgba(0, 0, 0, 0.6);
+    border: 1px solid rgba(255, 255, 255, 0.3);
+    box-shadow: 
+      0 4px 16px rgba(0, 0, 0, 0.4),
+      inset 0 1px 0 rgba(255, 255, 255, 0.2);
+  }
+  
+  /* Dropdown Styles - Verstärktes Glassmorphism */
+  .user-dropdown {
+    @apply absolute right-0 mt-2 w-64 rounded-xl shadow-2xl z-50 overflow-hidden;
+    background: rgba(255, 255, 255, 0.1);
+    backdrop-filter: blur(40px) saturate(200%) brightness(130%) contrast(110%);
+    -webkit-backdrop-filter: blur(40px) saturate(200%) brightness(130%) contrast(110%);
+    border: 1px solid rgba(255, 255, 255, 0.3);
+    box-shadow: 
+      0 25px 50px rgba(0, 0, 0, 0.25),
+      0 8px 16px rgba(0, 0, 0, 0.15),
+      inset 0 1px 0 rgba(255, 255, 255, 0.4),
+      0 0 0 1px rgba(255, 255, 255, 0.1);
+    animation: fadeIn 0.2s ease-out forwards;
+  }
+
+  .dark .user-dropdown {
+    background: rgba(0, 0, 0, 0.4);
+    backdrop-filter: blur(40px) saturate(180%) brightness(120%) contrast(120%);
+    -webkit-backdrop-filter: blur(40px) saturate(180%) brightness(120%) contrast(120%);
+    border: 1px solid rgba(255, 255, 255, 0.15);
+    box-shadow: 
+      0 25px 50px rgba(0, 0, 0, 0.6),
+      0 8px 16px rgba(0, 0, 0, 0.4),
+      inset 0 1px 0 rgba(255, 255, 255, 0.2),
+      0 0 0 1px rgba(255, 255, 255, 0.05);
+  }
+  
+  .dropdown-header {
+    @apply flex items-center p-4 border-b border-gray-200/80 dark:border-slate-700/30;
+  }
+  
+  .dropdown-item {
+    @apply flex items-center gap-3 px-4 py-3 text-sm text-slate-700 dark:text-slate-300 hover:bg-gray-100/80 dark:hover:bg-slate-700/60 hover:text-slate-900 dark:hover:text-white transition-all duration-300;
+  }
+  
+  .dropdown-divider {
+    @apply border-t border-gray-200/80 dark:border-slate-700/30;
+  }
+  
+  /* Mercedes-Benz Logo Animation */
+  @keyframes mercedes-rotate {
+    0% { transform: rotate(0deg); }
+    25% { transform: rotate(90deg); }
+    50% { transform: rotate(180deg); }
+    75% { transform: rotate(270deg); }
+    100% { transform: rotate(360deg); }
+  }
+  
+  .navbar-brand:hover svg {
+    animation: mercedes-rotate 5s infinite linear;
+    transform-origin: center;
+  }
+}
+
+/* Navbar Sticky Fix - Außerhalb von @layer für höhere Priorität */
+.navbar {
+  position: -webkit-sticky !important;
+  position: sticky !important;
+  top: 0 !important;
+  z-index: 50 !important;
+  width: 100% !important;
+  left: 0 !important;
+  right: 0 !important;
+  /* Verstärktes Glassmorphism Design */
+  --navbar-blur: 40px;
+  --navbar-opacity: 0.15;
+  background: rgba(255, 255, 255, var(--navbar-opacity, 0.15)) !important;
+  backdrop-filter: blur(var(--navbar-blur, 40px)) saturate(200%) brightness(110%) contrast(105%) !important;
+  -webkit-backdrop-filter: blur(var(--navbar-blur, 40px)) saturate(200%) brightness(110%) contrast(105%) !important;
+  box-shadow: 
+    0 8px 32px rgba(0, 0, 0, 0.12),
+    0 2px 8px rgba(0, 0, 0, 0.08),
+    inset 0 1px 0 rgba(255, 255, 255, 0.3),
+    0 0 0 1px rgba(255, 255, 255, 0.15) !important;
+  border-bottom: 1px solid rgba(255, 255, 255, 0.2) !important;
+  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
+}
+
+.dark .navbar {
+  --navbar-dark-opacity: 0.25;
+  background: rgba(0, 0, 0, var(--navbar-dark-opacity, 0.25)) !important;
+  backdrop-filter: blur(calc(var(--navbar-blur, 40px) + 5px)) saturate(180%) brightness(120%) contrast(115%) !important;
+  -webkit-backdrop-filter: blur(calc(var(--navbar-blur, 40px) + 5px)) saturate(180%) brightness(120%) contrast(115%) !important;
+  box-shadow: 
+    0 8px 32px rgba(0, 0, 0, 0.4),
+    0 2px 8px rgba(0, 0, 0, 0.3),
+    inset 0 1px 0 rgba(255, 255, 255, 0.15),
+    0 0 0 1px rgba(255, 255, 255, 0.08) !important;
+  border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
+}
+
+/* Navbar Scroll-Effekt */
+.navbar.scrolled {
+  --navbar-blur: 50px;
+  --navbar-opacity: 0.25;
+  background: rgba(255, 255, 255, var(--navbar-opacity, 0.25)) !important;
+  backdrop-filter: blur(var(--navbar-blur, 50px)) saturate(220%) brightness(115%) contrast(110%) !important;
+  -webkit-backdrop-filter: blur(var(--navbar-blur, 50px)) saturate(220%) brightness(115%) contrast(110%) !important;
+  box-shadow: 
+    0 12px 40px rgba(0, 0, 0, 0.15),
+    0 4px 12px rgba(0, 0, 0, 0.1),
+    inset 0 1px 0 rgba(255, 255, 255, 0.4),
+    0 0 0 1px rgba(255, 255, 255, 0.2) !important;
+}
+
+.dark .navbar.scrolled {
+  --navbar-dark-opacity: 0.35;
+  background: rgba(0, 0, 0, var(--navbar-dark-opacity, 0.35)) !important;
+  backdrop-filter: blur(calc(var(--navbar-blur, 50px) + 5px)) saturate(200%) brightness(125%) contrast(120%) !important;
+  -webkit-backdrop-filter: blur(calc(var(--navbar-blur, 50px) + 5px)) saturate(200%) brightness(125%) contrast(120%) !important;
+  box-shadow: 
+    0 12px 40px rgba(0, 0, 0, 0.5),
+    0 4px 12px rgba(0, 0, 0, 0.4),
+    inset 0 1px 0 rgba(255, 255, 255, 0.2),
+    0 0 0 1px rgba(255, 255, 255, 0.1) !important;
+}
+
+/* Neue Navbar-Komponenten mit verbessertem Glassmorphism */
+.navbar-menu-new {
+  @apply flex items-center justify-center space-x-0.5 md:space-x-1;
+  max-width: 100%;
+  overflow-x: auto;
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+  /* Glassmorphism für das Menü */
+  background: rgba(255, 255, 255, 0.1);
+  backdrop-filter: blur(25px) saturate(170%) brightness(108%);
+  -webkit-backdrop-filter: blur(25px) saturate(170%) brightness(108%);
+  border-radius: 16px;
+  padding: 8px;
+  margin: 0 16px;
+  border: 1px solid rgba(255, 255, 255, 0.15);
+  box-shadow: 
+    0 6px 20px rgba(0, 0, 0, 0.1),
+    inset 0 1px 0 rgba(255, 255, 255, 0.2),
+    0 0 0 1px rgba(255, 255, 255, 0.05);
+  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.dark .navbar-menu-new {
+  background: rgba(0, 0, 0, 0.2);
+  backdrop-filter: blur(30px) saturate(150%) brightness(115%);
+  -webkit-backdrop-filter: blur(30px) saturate(150%) brightness(115%);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  box-shadow: 
+    0 6px 20px rgba(0, 0, 0, 0.3),
+    inset 0 1px 0 rgba(255, 255, 255, 0.1),
+    0 0 0 1px rgba(255, 255, 255, 0.03);
+}
+
+.navbar-menu-new::-webkit-scrollbar {
+  display: none;
+}
+
+/* Glassmorphism Hover-Animation für Navbar-Menu */
+.navbar-menu-new:hover {
+  backdrop-filter: blur(35px) saturate(190%) brightness(112%);
+  -webkit-backdrop-filter: blur(35px) saturate(190%) brightness(112%);
+  box-shadow: 
+    0 8px 25px rgba(0, 0, 0, 0.15),
+    inset 0 1px 0 rgba(255, 255, 255, 0.3),
+    0 0 0 1px rgba(255, 255, 255, 0.1);
+  transform: translateY(-1px);
+}
+
+.dark .navbar-menu-new:hover {
+  backdrop-filter: blur(40px) saturate(170%) brightness(120%);
+  -webkit-backdrop-filter: blur(40px) saturate(170%) brightness(120%);
+  box-shadow: 
+    0 8px 25px rgba(0, 0, 0, 0.4),
+    inset 0 1px 0 rgba(255, 255, 255, 0.15),
+    0 0 0 1px rgba(255, 255, 255, 0.05);
+}
+
+.nav-item {
+  @apply flex items-center space-x-1.5 px-3 py-2.5 rounded-xl text-sm font-medium transition-all duration-300;
+  color: rgba(15, 23, 42, 0.85);
+  /* Gläserner Nav-Item */
+  background: rgba(255, 255, 255, 0.08);
+  backdrop-filter: blur(15px) saturate(140%);
+  -webkit-backdrop-filter: blur(15px) saturate(140%);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  box-shadow: 
+    0 4px 12px rgba(0, 0, 0, 0.05),
+    inset 0 1px 0 rgba(255, 255, 255, 0.15);
+  position: relative;
+  overflow: hidden;
+  animation: nav-item-entrance 0.6s ease-out;
+}
+
+/* Glassmorphism Hover-Effekt */
+.nav-item::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: -100%;
+  width: 100%;
+  height: 100%;
+  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
+  transition: left 0.5s;
+}
+
+.nav-item:hover::before {
+  left: 100%;
+}
+
+/* Zusätzlicher Glitter-Effekt */
+.nav-item::after {
+  content: '';
+  position: absolute;
+  top: -50%;
+  left: -50%;
+  width: 200%;
+  height: 200%;
+  background: conic-gradient(from 0deg at 50% 50%, transparent 0deg, rgba(255, 255, 255, 0.1) 30deg, transparent 60deg);
+  opacity: 0;
+  transition: opacity 0.3s ease;
+  pointer-events: none;
+  animation: rotate 3s linear infinite;
+}
+
+.nav-item:hover::after {
+  opacity: 1;
+}
+
+.dark .nav-item {
+  color: rgba(255, 255, 255, 0.85);
+  background: rgba(0, 0, 0, 0.15);
+  backdrop-filter: blur(20px) saturate(130%);
+  -webkit-backdrop-filter: blur(20px) saturate(130%);
+  border: 1px solid rgba(255, 255, 255, 0.08);
+  box-shadow: 
+    0 4px 12px rgba(0, 0, 0, 0.2),
+    inset 0 1px 0 rgba(255, 255, 255, 0.08);
+}
+
+.nav-item:hover {
+  color: rgba(15, 23, 42, 1);
+  background: rgba(255, 255, 255, 0.2);
+  backdrop-filter: blur(25px) saturate(160%) brightness(110%);
+  -webkit-backdrop-filter: blur(25px) saturate(160%) brightness(110%);
+  border: 1px solid rgba(255, 255, 255, 0.25);
+  box-shadow: 
+    0 8px 20px rgba(0, 0, 0, 0.12),
+    inset 0 1px 0 rgba(255, 255, 255, 0.3),
+    0 0 0 1px rgba(255, 255, 255, 0.1);
+  transform: translateY(-2px) scale(1.02);
+}
+
+.dark .nav-item:hover {
+  color: rgba(255, 255, 255, 1);
+  background: rgba(0, 0, 0, 0.25);
+  backdrop-filter: blur(30px) saturate(150%) brightness(120%);
+  -webkit-backdrop-filter: blur(30px) saturate(150%) brightness(120%);
+  border: 1px solid rgba(255, 255, 255, 0.15);
+  box-shadow: 
+    0 8px 20px rgba(0, 0, 0, 0.3),
+    inset 0 1px 0 rgba(255, 255, 255, 0.15),
+    0 0 0 1px rgba(255, 255, 255, 0.05);
+}
+
+.nav-item.active {
+  color: rgba(15, 23, 42, 1);
+  background: rgba(255, 255, 255, 0.35);
+  backdrop-filter: blur(35px) saturate(180%) brightness(115%);
+  -webkit-backdrop-filter: blur(35px) saturate(180%) brightness(115%);
+  border: 1px solid rgba(255, 255, 255, 0.4);
+  box-shadow: 
+    0 12px 24px rgba(0, 0, 0, 0.15),
+    inset 0 1px 0 rgba(255, 255, 255, 0.5),
+    0 0 0 1px rgba(59, 130, 246, 0.3);
+  transform: translateY(-1px);
+  animation: nav-item-active-glow 2s ease-in-out infinite alternate;
+}
+
+.dark .nav-item.active {
+  color: rgba(255, 255, 255, 1);
+  background: rgba(0, 0, 0, 0.4);
+  backdrop-filter: blur(40px) saturate(160%) brightness(125%);
+  -webkit-backdrop-filter: blur(40px) saturate(160%) brightness(125%);
+  border: 1px solid rgba(255, 255, 255, 0.2);
+  box-shadow: 
+    0 12px 24px rgba(0, 0, 0, 0.4),
+    inset 0 1px 0 rgba(255, 255, 255, 0.2),
+    0 0 0 1px rgba(59, 130, 246, 0.2);
+}
+
+/* Animationen für Glassmorphism-Effekte */
+@keyframes nav-item-entrance {
+  0% {
+    opacity: 0;
+    transform: translateY(10px) scale(0.95);
+    backdrop-filter: blur(5px);
+  }
+  100% {
+    opacity: 1;
+    transform: translateY(0) scale(1);
+    backdrop-filter: blur(15px) saturate(140%);
+  }
+}
+
+@keyframes nav-item-active-glow {
+  0% {
+    box-shadow: 
+      0 12px 24px rgba(0, 0, 0, 0.15),
+      inset 0 1px 0 rgba(255, 255, 255, 0.5),
+      0 0 0 1px rgba(59, 130, 246, 0.3);
+  }
+  100% {
+    box-shadow: 
+      0 16px 32px rgba(0, 0, 0, 0.2),
+      inset 0 1px 0 rgba(255, 255, 255, 0.6),
+      0 0 0 2px rgba(59, 130, 246, 0.5);
+  }
+}
+
+@keyframes rotate {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}
+
+/* Glassmorphism-Partikel-Effekt */
+.navbar::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: 
+    radial-gradient(circle at 20% 50%, rgba(255, 255, 255, 0.1) 1px, transparent 1px),
+    radial-gradient(circle at 80% 50%, rgba(255, 255, 255, 0.1) 1px, transparent 1px),
+    radial-gradient(circle at 40% 20%, rgba(255, 255, 255, 0.05) 1px, transparent 1px),
+    radial-gradient(circle at 60% 80%, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
+  opacity: 0;
+  animation: glassmorphism-particles 8s ease-in-out infinite;
+  pointer-events: none;
+}
+
+.dark .navbar::before {
+  background: 
+    radial-gradient(circle at 20% 50%, rgba(255, 255, 255, 0.05) 1px, transparent 1px),
+    radial-gradient(circle at 80% 50%, rgba(255, 255, 255, 0.05) 1px, transparent 1px),
+    radial-gradient(circle at 40% 20%, rgba(255, 255, 255, 0.03) 1px, transparent 1px),
+    radial-gradient(circle at 60% 80%, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
+}
+
+@keyframes glassmorphism-particles {
+  0%, 100% {
+    opacity: 0;
+    transform: scale(1);
+  }
+  50% {
+    opacity: 1;
+    transform: scale(1.1);
+  }
+}
+
+/* Dark Mode Toggle - Kompakteres Design */
+.dark-mode-toggle-new {
+  @apply relative p-2 rounded-full flex items-center justify-center transition-all duration-300 cursor-pointer;
+  background: rgba(241, 245, 249, 0.8);
+  border: 1px solid rgba(255, 255, 255, 0.7);
+  box-shadow: 
+    0 2px 8px rgba(0, 0, 0, 0.05),
+    0 1px 2px rgba(0, 0, 0, 0.04);
+  color: #334155;
+  z-index: 100;
+}
+
+.dark-mode-toggle-new:hover {
+  @apply transform -translate-y-0.5;
+  background: rgba(241, 245, 249, 0.9);
+  box-shadow: 
+    0 8px 16px rgba(0, 0, 0, 0.08),
+    0 2px 4px rgba(0, 0, 0, 0.06);
+}
+
+.dark-mode-toggle-new:active {
+  @apply transform scale-95;
+  transition: transform 0.1s;
+}
+
+.dark .dark-mode-toggle-new {
+  background: rgba(30, 41, 59, 0.8);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  box-shadow: 
+    0 2px 8px rgba(0, 0, 0, 0.2),
+    0 1px 2px rgba(0, 0, 0, 0.1);
+  color: #e2e8f0;
+}
+
+.dark .dark-mode-toggle-new:hover {
+  background: rgba(30, 41, 59, 0.9);
+  box-shadow: 
+    0 8px 16px rgba(0, 0, 0, 0.2),
+    0 2px 4px rgba(0, 0, 0, 0.15);
+}
+
+/* Icon-Animation */
+.dark-mode-toggle-new .sun-icon,
+.dark-mode-toggle-new .moon-icon {
+  @apply absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 transition-all duration-300;
+}
+
+.dark-mode-toggle-new .sun-icon:not(.hidden) {
+  animation: spin-in 0.5s cubic-bezier(0.25, 1, 0.5, 1) forwards;
+}
+
+.dark-mode-toggle-new .moon-icon:not(.hidden) {
+  animation: spin-in 0.5s cubic-bezier(0.25, 1, 0.5, 1) forwards;
+}
+
+@keyframes spin-in {
+  0% {
+    opacity: 0;
+    transform: translateY(10px) scale(0.7) rotate(20deg);
+  }
+  100% {
+    opacity: 1;
+    transform: translateY(0) scale(1) rotate(0);
+  }
+}
+
+.dark .sun-icon {
+  display: none;
+}
+
+.dark .moon-icon {
+  display: block;
+}
+
+.sun-icon {
+  display: block;
+}
+
+.moon-icon {
+  display: none;
+}
+
+/* User Menu Button - Kompakteres Design */
+.user-menu-button-new {
+  @apply flex items-center space-x-1.5 rounded-lg p-1 transition-all duration-300;
+  background: rgba(241, 245, 249, 0.6);
+  border: 1px solid rgba(255, 255, 255, 0.6);
+  box-shadow: 
+    0 2px 8px rgba(0, 0, 0, 0.04),
+    0 1px 2px rgba(0, 0, 0, 0.02);
+}
+
+.user-menu-button-new:hover {
+  @apply transform -translate-y-0.5;
+  background: rgba(241, 245, 249, 0.8);
+  box-shadow: 
+    0 8px 16px rgba(0, 0, 0, 0.06),
+    0 2px 4px rgba(0, 0, 0, 0.04);
+}
+
+.dark .user-menu-button-new {
+  background: rgba(30, 41, 59, 0.6);
+  border: 1px solid rgba(255, 255, 255, 0.08);
+  box-shadow: 
+    0 2px 8px rgba(0, 0, 0, 0.15),
+    0 1px 2px rgba(0, 0, 0, 0.1);
+}
+
+.dark .user-menu-button-new:hover {
+  background: rgba(30, 41, 59, 0.8);
+  box-shadow: 
+    0 8px 16px rgba(0, 0, 0, 0.15),
+    0 2px 4px rgba(0, 0, 0, 0.1);
+}
+
+/* User Avatar - Kompakteres Design */
+.user-avatar-new {
+  @apply h-7 w-7 rounded-full flex items-center justify-center text-white font-semibold text-xs shadow-md transition-all duration-300;
+  background: linear-gradient(135deg, #000000, #333333);
+  box-shadow: 
+    0 2px 4px rgba(0, 0, 0, 0.2),
+    0 1px 2px rgba(0, 0, 0, 0.1);
+}
+
+.dark .user-avatar-new {
+  background: linear-gradient(135deg, #f8fafc, #e2e8f0);
+  color: #0f172a;
+  box-shadow: 
+    0 2px 4px rgba(0, 0, 0, 0.3),
+    0 1px 2px rgba(0, 0, 0, 0.2);
+}
+
+/* Login Button - Kompakteres Design */
+.login-button-new {
+  @apply flex items-center px-3 py-1.5 rounded-lg text-xs font-medium shadow-sm transition-all duration-300;
+  background: #000000;
+  color: #ffffff;
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  box-shadow: 
+    0 2px 8px rgba(0, 0, 0, 0.1),
+    0 1px 2px rgba(0, 0, 0, 0.08);
+}
+
+.login-button-new:hover {
+  @apply transform -translate-y-0.5;
+  background: #333333;
+  box-shadow: 
+    0 8px 16px rgba(0, 0, 0, 0.15),
+    0 3px 4px rgba(0, 0, 0, 0.1);
+}
+
+.dark .login-button-new {
+  background: #ffffff;
+  color: #000000;
+  border: 1px solid rgba(0, 0, 0, 0.1);
+  box-shadow: 
+    0 2px 8px rgba(0, 0, 0, 0.2),
+    0 1px 2px rgba(0, 0, 0, 0.15);
+}
+
+.dark .login-button-new:hover {
+  background: #f1f5f9;
+  box-shadow: 
+    0 8px 16px rgba(0, 0, 0, 0.25),
+    0 3px 4px rgba(0, 0, 0, 0.2);
+}
+
+/* Mobile Menu - Kompakteres Design */
+.mobile-menu-new {
+  @apply w-full overflow-hidden transition-all duration-300 z-40;
+  background: rgba(255, 255, 255, 0.8);
+  backdrop-filter: blur(24px);
+  -webkit-backdrop-filter: blur(24px);
+  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
+  border-bottom: 1px solid rgba(241, 245, 249, 0.8);
+  max-height: 0;
+  opacity: 0;
+}
+
+.mobile-menu-new.open {
+  max-height: 400px;
+  opacity: 1;
+  border-bottom: 1px solid rgba(241, 245, 249, 0.8);
+}
+
+.dark .mobile-menu-new {
+  background: rgba(15, 23, 42, 0.8);
+  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
+  border-bottom: 1px solid rgba(30, 41, 59, 0.8);
+}
+
+.mobile-nav-item {
+  @apply flex items-center space-x-2.5 px-3 py-2.5 rounded-lg text-sm text-slate-800 dark:text-slate-200 transition-all duration-300;
+}
+
+.mobile-nav-item:hover {
+  background: rgba(241, 245, 249, 0.8);
+}
+
+.dark .mobile-nav-item:hover {
+  background: rgba(30, 41, 59, 0.6);
+}
+
+.mobile-nav-item.active {
+  background: rgba(241, 245, 249, 0.9);
+  color: #000000;
+  font-weight: 500;
+}
+
+.dark .mobile-nav-item.active {
+  background: rgba(30, 41, 59, 0.8);
+  color: #ffffff;
+}
+
+/* Dashboard Stat Cards mit schwarzem Hintergrund im Dark Mode */
+.mb-stat-card {
+  background: linear-gradient(135deg, rgba(240, 249, 255, 0.6) 0%, rgba(230, 242, 255, 0.6) 100%);
+  color: #0f172a;
+  position: relative;
+  overflow: hidden;
+  border: none;
+  border-radius: var(--card-radius);
+  backdrop-filter: blur(20px) saturate(180%) brightness(110%);
+  -webkit-backdrop-filter: blur(20px) saturate(180%) brightness(110%);
+  box-shadow: 0 25px 50px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(255, 255, 255, 0.1);
+  padding: 1.5rem;
+  margin: 1rem;
+  transition: transform 0.3s ease, box-shadow 0.3s ease;
+}
+
+.dark .mb-stat-card {
+  background: linear-gradient(135deg, rgba(0, 0, 0, 0.7) 0%, rgba(10, 10, 10, 0.7) 100%);
+  color: var(--text-primary, #f8fafc);
+  box-shadow: 0 25px 50px rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(255, 255, 255, 0.05);
+}
+
+/* Stats und Jobs Page Card Styles */
+.stats-card, .job-card {
+  @apply bg-white/60 dark:bg-black/80 backdrop-blur-2xl border border-gray-200/70 dark:border-slate-700/20 rounded-xl shadow-2xl transition-all duration-300;
+  backdrop-filter: blur(24px) saturate(200%) brightness(120%);
+  -webkit-backdrop-filter: blur(24px) saturate(200%) brightness(120%);
+  box-shadow: 0 25px 50px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(255, 255, 255, 0.1);
+  border-radius: var(--card-radius);
+} 
+
+/* Footer Styling - Verstärktes Glassmorphism */
+footer {
+  @apply transition-all duration-300;
+  background: rgba(255, 255, 255, 0.1);
+  backdrop-filter: blur(30px) saturate(180%) brightness(120%);
+  -webkit-backdrop-filter: blur(30px) saturate(180%) brightness(120%);
+  border-top: 1px solid rgba(255, 255, 255, 0.2);
+  box-shadow: 
+    0 -8px 32px rgba(0, 0, 0, 0.1),
+    0 -2px 8px rgba(0, 0, 0, 0.05),
+    inset 0 1px 0 rgba(255, 255, 255, 0.2),
+    0 0 0 1px rgba(255, 255, 255, 0.05);
+}
+
+.dark footer {
+  background: rgba(0, 0, 0, 0.3);
+  backdrop-filter: blur(30px) saturate(160%) brightness(110%);
+  -webkit-backdrop-filter: blur(30px) saturate(160%) brightness(110%);
+  border-top: 1px solid rgba(255, 255, 255, 0.1);
+  box-shadow: 
+    0 -8px 32px rgba(0, 0, 0, 0.3),
+    0 -2px 8px rgba(0, 0, 0, 0.2),
+    inset 0 1px 0 rgba(255, 255, 255, 0.1),
+    0 0 0 1px rgba(255, 255, 255, 0.03);
+}
+
+/* Dropdown Pfeil Animation */
+.dropdown-arrow {
+  @apply transition-transform duration-300;
+}
+
+/* Mercedes-Benz Hintergrund mit Star-Pattern */
+.mercedes-star-bg {
+  position: relative;
+}
+
+.mercedes-star-bg::after {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80' width='80' height='80' opacity='0.05' fill='currentColor'%3E%3Cpath d='M58.6,4.5C53,1.6,46.7,0,40,0c-6.7,0-13,1.6-18.6,4.5v0C8.7,11.2,0,24.6,0,40c0,15.4,8.7,28.8,21.5,35.5C27,78.3,33.3,80,40,80c6.7,0,12.9-1.7,18.5-4.6C71.3,68.8,80,55.4,80,40C80,24.6,71.3,11.2,58.6,4.5z M4,40c0-13.1,7-24.5,17.5-30.9v0C26.6,6,32.5,4.2,39,4l-4.5,32.7L21.5,46.8v0L8.3,57.1C5.6,52,4,46.2,4,40z M58.6,70.8C53.1,74.1,46.8,76,40,76c-6.8,0-13.2-1.9-18.6-5.2c-4.9-2.9-8.9-6.9-11.9-11.7l11.9-4.9v0L40,46.6l18.6,7.5v0l12,4.9C67.6,63.9,63.4,67.9,58.6,70.8z M58.6,46.8L58.6,46.8l-12.9-10L41.1,4c6.3,0.2,12.3,2,17.4,5.1v0C69,15.4,76,26.9,76,40c0,6.2-1.5,12-4.3,17.1L58.6,46.8z'/%3E%3C/svg%3E");
+  background-position: center;
+  background-repeat: repeat;
+  background-size: 40px 40px;
+  z-index: -1;
+  opacity: 0.05;
+}
+
+.dark .mercedes-star-bg::after {
+  opacity: 0.02;
+  filter: invert(1) brightness(0.4);
+} 
+
+/* Zusätzliche Glassmorphism-Verbesserungen */
+.glass-effect {
+  backdrop-filter: blur(20px) saturate(180%) brightness(110%);
+  -webkit-backdrop-filter: blur(20px) saturate(180%) brightness(110%);
+  background: rgba(255, 255, 255, 0.1);
+  border: 1px solid rgba(255, 255, 255, 0.2);
+  box-shadow: 
+    0 8px 32px rgba(0, 0, 0, 0.1),
+    inset 0 1px 0 rgba(255, 255, 255, 0.3);
+}
+
+.dark .glass-effect {
+  background: rgba(0, 0, 0, 0.3);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  box-shadow: 
+    0 8px 32px rgba(0, 0, 0, 0.3),
+    inset 0 1px 0 rgba(255, 255, 255, 0.15);
+}
+
+/* Verbesserte Hover-Effekte für alle interaktiven Elemente */
+.glass-hover {
+  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.glass-hover:hover {
+  transform: translateY(-2px);
+  backdrop-filter: blur(25px) saturate(200%) brightness(120%);
+  -webkit-backdrop-filter: blur(25px) saturate(200%) brightness(120%);
+  box-shadow: 
+    0 20px 40px rgba(0, 0, 0, 0.15),
+    0 8px 16px rgba(0, 0, 0, 0.1),
+    inset 0 1px 0 rgba(255, 255, 255, 0.4);
+}
+
+.dark .glass-hover:hover {
+  box-shadow: 
+    0 20px 40px rgba(0, 0, 0, 0.4),
+    0 8px 16px rgba(0, 0, 0, 0.3),
+    inset 0 1px 0 rgba(255, 255, 255, 0.2);
+}
+
+/* Neue verbesserte Drucker-Karten für die Drucker-Ansicht */
+.printer-card-new {
+  @apply bg-gradient-to-br from-white/90 to-white/70 dark:from-slate-800/90 dark:to-slate-900/70 backdrop-blur-2xl rounded-xl border border-gray-200/70 dark:border-slate-700/30 p-5 shadow-2xl transition-all duration-300 hover:-translate-y-1 relative overflow-hidden;
+  box-shadow: 
+    0 20px 40px rgba(0, 0, 0, 0.08), 
+    0 10px 20px rgba(0, 0, 0, 0.06),
+    0 0 0 1px rgba(255, 255, 255, 0.1);
+  border-radius: var(--card-radius, 1rem);
+}
+
+.dark .printer-card-new {
+  box-shadow: 
+    0 20px 40px rgba(0, 0, 0, 0.4), 
+    0 10px 20px rgba(0, 0, 0, 0.3),
+    0 0 0 1px rgba(255, 255, 255, 0.05);
+}
+
+/* Online Drucker-Karten mit stärkerem visuellen Unterschied */
+.printer-card-new.online {
+  @apply bg-gradient-to-br from-green-50/90 to-emerald-50/80 dark:from-green-900/30 dark:to-emerald-900/20 border-green-200 dark:border-green-700/50;
+  box-shadow: 
+    0 20px 40px rgba(0, 122, 85, 0.08), 
+    0 10px 20px rgba(0, 122, 85, 0.06),
+    0 0 0 1px rgba(209, 250, 229, 0.4);
+}
+
+.dark .printer-card-new.online {
+  box-shadow: 
+    0 20px 40px rgba(0, 0, 0, 0.3), 
+    0 10px 20px rgba(0, 0, 0, 0.2),
+    0 0 0 1px rgba(16, 185, 129, 0.2);
+}
+
+/* Status-Badge mit verbesserten Styles */
+.status-badge-new {
+  @apply px-2.5 py-1 rounded-full text-xs font-medium inline-flex items-center space-x-1 shadow-sm;
+  background: rgba(255, 255, 255, 0.9);
+  backdrop-filter: blur(8px);
+  -webkit-backdrop-filter: blur(8px);
+  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
+}
+
+.dark .status-badge-new {
+  background: rgba(30, 41, 59, 0.7);
+  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
+}
+
+.status-badge-new.online {
+  @apply bg-green-100/90 text-green-800 dark:bg-green-900/60 dark:text-green-300;
+}
+
+.status-badge-new.offline {
+  @apply bg-red-100/90 text-red-800 dark:bg-red-900/60 dark:text-red-300;
+}
+
+/* Verbesserte Filterleiste */
+.filter-bar-new {
+  @apply bg-white/80 dark:bg-slate-800/80 backdrop-blur-xl rounded-lg p-1.5 border border-gray-200/60 dark:border-slate-700/30 shadow-xl;
+  box-shadow: 
+    0 10px 25px rgba(0, 0, 0, 0.05), 
+    0 5px 10px rgba(0, 0, 0, 0.03),
+    0 0 0 1px rgba(255, 255, 255, 0.2);
+}
+
+.dark .filter-bar-new {
+  box-shadow: 
+    0 10px 25px rgba(0, 0, 0, 0.2), 
+    0 5px 10px rgba(0, 0, 0, 0.15),
+    0 0 0 1px rgba(255, 255, 255, 0.05);
+}
+
+.filter-btn-new {
+  @apply px-3.5 py-2 text-sm rounded-md transition-all duration-300 font-medium;
+}
+
+.filter-btn-new.active {
+  @apply bg-black text-white dark:bg-white dark:text-slate-900 shadow-md;
+  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
+}
+
+.dark .filter-btn-new.active {
+  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
+}
+
+/* Verbesserte Aktionsschaltflächen */
+.action-btn-new {
+  @apply flex items-center justify-center gap-2 px-4 py-2.5 rounded-lg font-medium text-sm transition-all duration-300 shadow-md hover:-translate-y-0.5;
+  backdrop-filter: blur(8px);
+  -webkit-backdrop-filter: blur(8px);
+}
+
+.action-btn-new.primary {
+  @apply bg-indigo-600 hover:bg-indigo-700 text-white dark:bg-indigo-600 dark:hover:bg-indigo-500;
+  box-shadow: 0 5px 15px rgba(79, 70, 229, 0.2);
+}
+
+.dark .action-btn-new.primary {
+  box-shadow: 0 5px 15px rgba(79, 70, 229, 0.3);
+}
+
+.action-btn-new.success {
+  @apply bg-green-600 hover:bg-green-700 text-white dark:bg-green-600 dark:hover:bg-green-500;
+  box-shadow: 0 5px 15px rgba(16, 185, 129, 0.2);
+}
+
+.dark .action-btn-new.success {
+  box-shadow: 0 5px 15px rgba(16, 185, 129, 0.3);
+}
+
+.action-btn-new.danger {
+  @apply bg-red-600 hover:bg-red-700 text-white dark:bg-red-600 dark:hover:bg-red-500;
+  box-shadow: 0 5px 15px rgba(239, 68, 68, 0.2);
+}
+
+.dark .action-btn-new.danger {
+  box-shadow: 0 5px 15px rgba(239, 68, 68, 0.3);
+}
+
+/* Informationszeilen in Drucker-Karten */
+.printer-info-row {
+  @apply flex items-center gap-2 text-xs sm:text-sm text-slate-700 dark:text-slate-300 mb-1.5;
+}
+
+.printer-info-icon {
+  @apply w-3.5 h-3.5 sm:w-4 sm:h-4 text-slate-500 dark:text-slate-400 flex-shrink-0;
+}
+
+/* Online-Indikator mit Pulseffekt */
+.online-indicator {
+  @apply absolute top-2.5 right-2.5 w-3 h-3 bg-green-500 rounded-full shadow-lg;
+  box-shadow: 0 0 0 rgba(16, 185, 129, 0.6);
+  animation: pulse-ring 2s cubic-bezier(0.455, 0.03, 0.515, 0.955) infinite;
+}
+
+@keyframes pulse-ring {
+  0% {
+    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.6);
+  }
+  70% {
+    box-shadow: 0 0 0 6px rgba(16, 185, 129, 0);
+  }
+  100% {
+    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0);
+  }
+}
+
+/* Header mit verbesserten Status-Anzeigen */
+.status-overview-new {
+  @apply flex flex-wrap gap-3 text-xs sm:text-sm p-3 bg-white/60 dark:bg-slate-800/60 backdrop-blur-xl rounded-lg border border-gray-200/60 dark:border-slate-700/30 shadow-lg;
+  box-shadow: 
+    0 10px 25px rgba(0, 0, 0, 0.04), 
+    0 5px 10px rgba(0, 0, 0, 0.02),
+    0 0 0 1px rgba(255, 255, 255, 0.1);
+}
+
+.dark .status-overview-new {
+  box-shadow: 
+    0 10px 25px rgba(0, 0, 0, 0.15), 
+    0 5px 10px rgba(0, 0, 0, 0.1),
+    0 0 0 1px rgba(255, 255, 255, 0.03);
+}
+
+.status-dot {
+  @apply w-2.5 h-2.5 rounded-full;
+}
+
+.status-dot.online {
+  @apply bg-green-500;
+  animation: pulse-dot 2s cubic-bezier(0.455, 0.03, 0.515, 0.955) infinite;
+}
+
+.status-dot.offline {
+  @apply bg-red-500;
+}
+
+@keyframes pulse-dot {
+  0% {
+    transform: scale(0.95);
+    opacity: 1;
+  }
+  50% {
+    transform: scale(1.1);
+    opacity: 0.8;
+  }
+  100% {
+    transform: scale(0.95);
+    opacity: 1;
+  }
+}
+
+/* Verbesserte Modals mit Glassmorphism */
+.modal-new {
+  @apply fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/40 backdrop-blur-sm;
+}
+
+.modal-content-new {
+  @apply bg-white/90 dark:bg-slate-800/90 backdrop-blur-2xl rounded-2xl p-6 w-full max-w-md shadow-2xl border border-gray-200/60 dark:border-slate-700/30 transform transition-all duration-300;
+  box-shadow: 
+    0 25px 50px rgba(0, 0, 0, 0.15), 
+    0 15px 30px rgba(0, 0, 0, 0.1),
+    0 20px 25px -5px rgba(0, 0, 0, 0.5),
+    0 10px 10px -5px rgba(0, 0, 0, 0.3);
+}
+
+/* User Dropdown Items */
+.user-dropdown-item {
+  @apply flex items-center px-4 py-3 text-sm text-slate-700 dark:text-slate-200 hover:bg-slate-50 dark:hover:bg-slate-800 transition-all duration-200 cursor-pointer;
+}
+
+.user-dropdown-item:first-child {
+  @apply rounded-t-xl;
+}
+
+.user-dropdown-item:last-child {
+  @apply rounded-b-xl;
+}
+
+.user-dropdown-item:hover {
+  background: rgba(248, 250, 252, 0.8);
+  transform: translateX(2px);
+}
+
+.dark .user-dropdown-item:hover {
+  background: rgba(30, 41, 59, 0.8);
+}
+
+/* User Dropdown Icons */
+.user-dropdown-icon {
+  @apply w-4 h-4 mr-3 text-slate-500 dark:text-slate-400 transition-colors duration-200;
+}
+
+.user-dropdown-item:hover .user-dropdown-icon {
+  @apply text-slate-700 dark:text-slate-200;
+}
+
+/* Divider in User Dropdown */
+.user-dropdown-divider {
+  @apply border-t border-slate-200 dark:border-slate-700 my-1;
+}
+
+/* User Info Section in Dropdown */
+.user-info-section {
+  @apply px-4 py-3 border-b border-slate-200 dark:border-slate-700;
+  background: rgba(248, 250, 252, 0.5);
+}
+
+.dark .user-info-section {
+  background: rgba(30, 41, 59, 0.5);
+}
+
+.user-info-name {
+  @apply text-sm font-semibold text-slate-900 dark:text-white;
+}
+
+.user-info-role {
+  @apply text-xs text-slate-500 dark:text-slate-400 mt-1;
+}
diff --git a/backend/static/css/input.css.gz b/backend/static/css/input.css.gz
deleted file mode 100644
index 0f00d2a2..00000000
Binary files a/backend/static/css/input.css.gz and /dev/null differ
diff --git a/backend/static/css/input.min.css b/backend/static/css/input.min.css
deleted file mode 100644
index 18cd63b2..00000000
--- a/backend/static/css/input.min.css
+++ /dev/null
@@ -1 +0,0 @@
-@tailwind base;@tailwind components;@tailwind utilities;@layer base{:root{--color-bg-primary:#fff;--color-bg-secondary:#fafbfc;--color-bg-tertiary:#f3f5f7;--color-bg-accent:#fbfcfd;--color-text-primary:#111827;--color-text-secondary:#374151;--color-text-muted:#6b7280;--color-text-accent:#0073ce;--color-border-primary:#e5e7eb;--color-border-secondary:#d1d5db;--color-accent:#0073ce;--color-accent-hover:#005a9f;--color-accent-light:#eff6ff;--color-accent-text:#fff;--color-shadow:rgba(0,0,0,0.06);--color-shadow-strong:rgba(0,0,0,0.1);--color-shadow-accent:rgba(0,115,206,0.12);--card-radius:1rem;--gradient-primary:linear-gradient(135deg,#fff 0,#fafbfc 30%,#f8fafc 70%,#f3f5f7 100%);--gradient-card:linear-gradient(135deg,#fff 0,#fcfcfd 50%,#fafbfc 100%);--gradient-hero:linear-gradient(135deg,#fafbfc 0,#f3f5f7 40%,#eef2f5 80%,#f8fafc 100%);--gradient-accent:linear-gradient(135deg,#0073ce 0,#005a9f 100%);--gradient-surface:linear-gradient(135deg,#fff 0,#fbfcfd 50%,#f8fafc 100%);--glass-bg:rgba(255,255,255,0.92);--glass-border:rgba(255,255,255,0.3);--glass-shadow:0 8px 32px rgba(0,0,0,0.04);--glass-blur:blur(20px)}.dark{--color-bg-primary:#000;--color-bg-secondary:#0a0a0a;--color-bg-tertiary:#1a1a1a;--color-text-primary:#fff;--color-text-secondary:#e2e8f0;--color-text-muted:#94a3b8;--color-border-primary:#1a1a1a;--color-border-secondary:#2a2a2a;--color-accent:#fff;--color-accent-hover:#f0f0f0;--color-accent-light:#1e3a8a;--color-accent-text:#000;--color-shadow:rgba(0,0,0,0.8);--color-shadow-strong:rgba(0,0,0,0.9);--mb-black:#000}body{@apply bg-white dark:bg-black text-slate-900 dark:text-white transition-colors duration-300;position:relative;min-height:100vh;background:var(--gradient-primary);font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-feature-settings:'cv02','cv03','cv04','cv11';line-height:1.65;font-size:15px}.dark body{background:linear-gradient(135deg,#000 0,#0a0a0a 50%,#000 100%)}body::before{content:'';position:fixed;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 25% 25%,rgba(0,115,206,0.015) 0,transparent 50%),radial-gradient(circle at 75% 75%,rgba(0,115,206,0.01) 0,transparent 50%),radial-gradient(circle at 50% 10%,rgba(0,115,206,0.008) 0,transparent 50%);pointer-events:none;z-index:-1}.dark body::before{background:radial-gradient(circle at 20% 50%,rgba(59,130,246,0.03) 0,transparent 50%),radial-gradient(circle at 80% 20%,rgba(59,130,246,0.02) 0,transparent 50%)}nav{@apply backdrop-blur-xl border-b transition-all duration-300;background:linear-gradient(135deg,rgba(255,255,255,0.95) 0,rgba(250,251,252,0.92) 30%,rgba(248,250,252,0.9) 70%,rgba(255,255,255,0.95) 100%);border-bottom:1px solid rgba(229,231,235,0.7);backdrop-filter:blur(28px) saturate(200%) brightness(110%);-webkit-backdrop-filter:blur(28px) saturate(200%) brightness(110%);box-shadow:0 4px 20px rgba(0,0,0,0.04),0 2px 8px rgba(0,115,206,0.02),inset 0 1px 0 rgba(255,255,255,0.9)}.dark nav{background:rgba(0,0,0,0.85);border-bottom-color:rgba(255,255,255,0.1);box-shadow:0 8px 32px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.05)}.card-enhanced{background:var(--gradient-card);border:1px solid var(--color-border-primary);border-radius:var(--card-radius);box-shadow:0 2px 12px rgba(0,0,0,0.03),0 1px 4px rgba(0,115,206,0.02),inset 0 1px 0 rgba(255,255,255,0.8);transition:all .3s cubic-bezier(0.4,0,0.2,1);position:relative;overflow:hidden}.card-enhanced::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:var(--gradient-accent);opacity:0;transition:opacity .3s ease}.card-enhanced:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(0,0,0,0.06),0 4px 12px rgba(0,115,206,0.04),inset 0 1px 0 rgba(255,255,255,0.9)}.card-enhanced:hover::before{opacity:1}.dark .card-enhanced{background:rgba(10,10,10,0.8);border-color:var(--color-border-primary);box-shadow:0 4px 20px var(--color-shadow)}.btn-enhanced{background:var(--gradient-accent);color:var(--color-accent-text);border:0;border-radius:.5rem;padding:.75rem 1.75rem;font-weight:600;font-size:.875rem;text-transform:uppercase;letter-spacing:.05em;box-shadow:0 2px 8px rgba(0,115,206,0.2),0 1px 4px rgba(0,115,206,0.1);transition:all .2s cubic-bezier(0.4,0,0.2,1);position:relative;overflow:hidden}.btn-enhanced::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.2),transparent);transition:left .5s ease}.btn-enhanced:hover{transform:translateY(-1px);box-shadow:0 4px 15px rgba(0,115,206,0.3),0 2px 8px rgba(0,115,206,0.2)}.btn-enhanced:hover::before{left:100%}.btn-enhanced:active{transform:translateY(0)}.btn-secondary{background:var(--gradient-surface);color:var(--color-text-primary);border:1px solid var(--color-border-primary);box-shadow:0 1px 6px rgba(0,0,0,0.03),inset 0 1px 0 rgba(255,255,255,0.8)}.btn-secondary:hover{background:var(--color-bg-secondary);border-color:var(--color-accent);color:var(--color-accent);box-shadow:0 4px 12px rgba(0,115,206,0.08),inset 0 1px 0 rgba(255,255,255,0.9)}.input-enhanced{background:rgba(255,255,255,0.95);border:1px solid var(--color-border-primary);border-radius:.5rem;padding:.75rem 1rem;color:var(--color-text-primary);font-size:.9rem;box-shadow:0 1px 6px rgba(0,0,0,0.02),inset 0 1px 0 rgba(255,255,255,0.9);transition:all .2s ease;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.input-enhanced:focus{outline:0;border-color:var(--color-accent);box-shadow:0 4px 12px rgba(0,115,206,0.1),0 0 0 3px rgba(0,115,206,0.05),inset 0 1px 0 rgba(255,255,255,0.95);background:rgba(255,255,255,0.98)}.input-enhanced::placeholder{color:var(--color-text-muted);opacity:.8}.dark .input-enhanced{background:rgba(10,10,10,0.8);border-color:var(--color-border-primary);color:var(--color-text-primary);box-shadow:0 2px 8px var(--color-shadow),inset 0 1px 0 rgba(255,255,255,0.05)}.dark .input-enhanced:focus{border-color:#60a5fa;box-shadow:0 4px 15px rgba(96,165,250,0.2),0 0 0 3px rgba(96,165,250,0.1)}.alert-enhanced{border-radius:1rem;padding:1.25rem;border:1px solid transparent;position:relative;overflow:hidden;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.alert-enhanced::before{content:'';position:absolute;top:0;left:0;bottom:0;width:4px}.alert-info-enhanced{background:linear-gradient(135deg,rgba(239,246,255,0.95) 0,rgba(219,234,254,0.9) 100%);border-color:rgba(59,130,246,0.2);color:#1e40af}.alert-info-enhanced::before{background:var(--gradient-accent)}.alert-success-enhanced{background:linear-gradient(135deg,rgba(236,253,245,0.95) 0,rgba(167,243,208,0.9) 100%);border-color:rgba(16,185,129,0.2);color:#065f46}.alert-success-enhanced::before{background:linear-gradient(180deg,#10b981 0,#059669 100%)}.alert-warning-enhanced{background:linear-gradient(135deg,rgba(255,251,235,0.95) 0,rgba(254,243,199,0.9) 100%);border-color:rgba(251,191,36,0.2);color:#92400e}.alert-warning-enhanced::before{background:linear-gradient(180deg,#fbbf24 0,#f59e0b 100%)}.alert-error-enhanced{background:linear-gradient(135deg,rgba(254,242,242,0.95) 0,rgba(252,165,165,0.9) 100%);border-color:rgba(239,68,68,0.2);color:#991b1b}.alert-error-enhanced::before{background:linear-gradient(180deg,#ef4444 0,#dc2626 100%)}.flash-message-light{background:linear-gradient(135deg,rgba(255,255,255,0.95) 0,rgba(248,250,252,0.9) 100%);backdrop-filter:blur(32px) saturate(200%) brightness(120%);-webkit-backdrop-filter:blur(32px) saturate(200%) brightness(120%);border:1px solid rgba(226,232,240,0.6);box-shadow:0 25px 50px rgba(0,0,0,0.1),0 12px 24px rgba(0,115,206,0.05),inset 0 1px 0 rgba(255,255,255,0.8);color:var(--color-text-primary)}.flash-message-light.success{border-left:4px solid #10b981;background:linear-gradient(135deg,rgba(236,253,245,0.95) 0,rgba(209,250,229,0.9) 100%)}.flash-message-light.error{border-left:4px solid #ef4444;background:linear-gradient(135deg,rgba(254,242,242,0.95) 0,rgba(252,165,165,0.9) 100%)}.flash-message-light.warning{border-left:4px solid #fbbf24;background:linear-gradient(135deg,rgba(255,251,235,0.95) 0,rgba(254,243,199,0.9) 100%)}.flash-message-light.info{border-left:4px solid #3b82f6;background:linear-gradient(135deg,rgba(239,246,255,0.95) 0,rgba(219,234,254,0.9) 100%)}.table-enhanced{background:var(--gradient-card);border:1px solid var(--color-border-primary);border-radius:var(--card-radius);overflow:hidden;box-shadow:0 4px 20px var(--color-shadow),0 2px 8px rgba(0,115,206,0.04),inset 0 1px 0 rgba(255,255,255,0.6)}.table-enhanced th{background:linear-gradient(135deg,var(--color-bg-secondary) 0,var(--color-bg-tertiary) 100%);color:var(--color-text-primary);font-weight:600;padding:1rem 1.5rem;border-bottom:1px solid var(--color-border-primary);position:relative}.table-enhanced th::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0,var(--color-border-secondary) 50%,transparent 100%)}.table-enhanced td{padding:1rem 1.5rem;border-bottom:1px solid var(--color-border-primary);color:var(--color-text-secondary);transition:all .2s ease}.table-enhanced tbody tr:hover{background:var(--color-bg-secondary);transform:scale(1.002)}.dark .table-enhanced{background:rgba(10,10,10,0.8);border-color:var(--color-border-primary)}.dark .table-enhanced th{background:rgba(26,26,26,0.8);color:var(--color-text-primary)}.dark .table-enhanced tbody tr:hover{background:rgba(26,26,26,0.6)}.modal-enhanced{background:linear-gradient(135deg,rgba(255,255,255,0.98) 0,rgba(248,250,252,0.95) 50%,rgba(255,255,255,0.98) 100%);backdrop-filter:blur(32px) saturate(220%) brightness(120%);-webkit-backdrop-filter:blur(32px) saturate(220%) brightness(120%);border:1px solid rgba(226,232,240,0.7);border-radius:1.5rem;box-shadow:0 50px 100px rgba(0,0,0,0.15),0 20px 40px rgba(0,115,206,0.08),inset 0 2px 0 rgba(255,255,255,0.9);position:relative;overflow:hidden}.modal-enhanced::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0,rgba(226,232,240,0.8) 50%,transparent 100%)}.dark .modal-enhanced{background:rgba(0,0,0,0.95);border-color:rgba(42,42,42,0.7);box-shadow:0 50px 100px rgba(0,0,0,0.5),inset 0 2px 0 rgba(255,255,255,0.05)}.status-badge-enhanced{display:inline-flex;align-items:center;padding:.5rem 1rem;font-size:.75rem;font-weight:700;border-radius:9999px;text-transform:uppercase;letter-spacing:.05em;border:1px solid transparent;transition:all .2s ease;position:relative;overflow:hidden}.status-badge-enhanced::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.3),transparent);transition:left .5s ease}.status-badge-enhanced:hover::before{left:100%}.status-online-enhanced{background:linear-gradient(135deg,#ecfdf5 0,#a7f3d0 100%);color:#065f46;border-color:rgba(16,185,129,0.3)}.status-offline-enhanced{background:linear-gradient(135deg,#fef2f2 0,#fca5a5 100%);color:#991b1b;border-color:rgba(239,68,68,0.3)}.status-printing-enhanced{background:linear-gradient(135deg,#eff6ff 0,#bfdbfe 100%);color:#1e40af;border-color:rgba(59,130,246,0.3)}.dark-mode-toggle-new{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:9999px;padding:.625rem;transition:all .3s cubic-bezier(0.4,0,0.2,1);background:linear-gradient(135deg,rgba(248,250,252,0.9) 0,rgba(241,245,249,0.8) 100%);border:1px solid rgba(226,232,240,0.7);box-shadow:0 4px 12px rgba(0,0,0,0.06),0 2px 4px rgba(0,115,206,0.04),inset 0 1px 0 rgba(255,255,255,0.8);color:var(--color-text-secondary);z-index:100}.dark-mode-toggle-new:hover{transform:translateY(-2px) scale(1.05);background:linear-gradient(135deg,rgba(248,250,252,0.95) 0,rgba(241,245,249,0.85) 100%);box-shadow:0 8px 20px rgba(0,0,0,0.1),0 4px 8px rgba(0,115,206,0.08),inset 0 1px 0 rgba(255,255,255,0.9)}.dark-mode-toggle-new:active{transform:translateY(-1px) scale(0.98);transition:transform .1s}.dark .dark-mode-toggle-new{background:rgba(10,10,10,0.8);border:1px solid rgba(42,42,42,0.6);box-shadow:0 4px 12px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.05);color:var(--color-text-secondary)}.dark .dark-mode-toggle-new:hover{background:rgba(10,10,10,0.9);box-shadow:0 8px 20px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.08)}.dark-mode-toggle-new .sun-icon,.dark-mode-toggle-new .moon-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);transition:all .3s cubic-bezier(0.4,0,0.2,1)}.dark-mode-toggle-new .sun-icon:not(.hidden){animation:icon-appear .5s cubic-bezier(0.25,1,0.5,1) forwards}.dark-mode-toggle-new .moon-icon:not(.hidden){animation:icon-appear .5s cubic-bezier(0.25,1,0.5,1) forwards}@keyframes icon-appear{0%{opacity:0;transform:translate(-50%,-50%) scale(0.5) rotate(-20deg)}100%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(0)}}.dark .sun-icon{display:none}.dark .moon-icon{display:block}.sun-icon{display:block}.moon-icon{display:none}.user-menu-button-new{display:flex;align-items:center;gap:.5rem;border-radius:.75rem;padding:.5rem;transition:all .3s cubic-bezier(0.4,0,0.2,1);background:linear-gradient(135deg,rgba(248,250,252,0.8) 0,rgba(241,245,249,0.7) 100%);border:1px solid rgba(226,232,240,0.6);box-shadow:0 2px 8px rgba(0,0,0,0.05),inset 0 1px 0 rgba(255,255,255,0.7)}.user-menu-button-new:hover{transform:translateY(-1px);background:linear-gradient(135deg,rgba(248,250,252,0.9) 0,rgba(241,245,249,0.8) 100%);box-shadow:0 4px 12px rgba(0,0,0,0.08),0 2px 4px rgba(0,115,206,0.04),inset 0 1px 0 rgba(255,255,255,0.8)}.dark .user-menu-button-new{background:rgba(10,10,10,0.7);border-color:rgba(42,42,42,0.6);box-shadow:0 2px 8px rgba(0,0,0,0.2),inset 0 1px 0 rgba(255,255,255,0.03)}.dark .user-menu-button-new:hover{background:rgba(10,10,10,0.8);box-shadow:0 4px 12px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.05)}.hover-lift-enhanced{transition:all .3s cubic-bezier(0.4,0,0.2,1)}.hover-lift-enhanced:hover{transform:translateY(-3px) scale(1.01);box-shadow:0 12px 30px var(--color-shadow-strong),0 6px 15px var(--color-shadow-accent)}.dark .hover-lift-enhanced:hover{box-shadow:0 12px 30px var(--color-shadow)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--color-bg-secondary);border-radius:4px}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--color-border-secondary) 0,var(--color-border-primary) 100%);border-radius:4px;transition:background .2s ease}::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,var(--color-accent) 0,var(--color-accent-hover) 100%)}.dark ::-webkit-scrollbar-track{background:var(--color-bg-secondary)}.dark ::-webkit-scrollbar-thumb{background:var(--color-border-primary)}.dark ::-webkit-scrollbar-thumb:hover{background:#60a5fa}.loading-enhanced{position:relative;overflow:hidden}.loading-enhanced::after{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(0,115,206,0.1),transparent);animation:loading-shimmer 2s infinite}@keyframes loading-shimmer{0%{left:-100%}100%{left:100%}}.focus-enhanced:focus{outline:2px solid var(--color-accent);outline-offset:2px;box-shadow:0 0 0 4px rgba(0,115,206,0.15),0 4px 12px var(--color-shadow-accent)}.dark .focus-enhanced:focus{outline-color:#60a5fa;box-shadow:0 0 0 4px rgba(96,165,250,0.15),0 4px 12px rgba(96,165,250,0.2)}@media(max-width:768px){.card-enhanced{padding:1rem;border-radius:.75rem}.btn-enhanced{padding:.75rem 1.5rem;font-size:.8rem}.modal-enhanced{border-radius:1rem;margin:1rem}.dark-mode-toggle-new{padding:.5rem}}@media(prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important}}@media(prefers-contrast:high){:root{--color-shadow:rgba(0,0,0,0.2);--color-shadow-strong:rgba(0,0,0,0.3);--color-border-primary:#000}.dark{--color-border-primary:#fff}}}@layer components{.dark .bg-dark-card{@apply bg-dark-surface transition-colors}.bg-dark-surface{background-color:#1e293b}.transition-all-colors{@apply transition-colors duration-300}.admin-container{@apply max-w-7xl mx-auto p-4 md:p-8}.admin-stats{@apply grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 mb-8}.stat-card{@apply bg-white/60 dark:bg-black/70 rounded-xl border border-gray-200/60 dark:border-slate-700/30 p-5 relative overflow-hidden shadow-2xl hover:shadow-2xl transition-all duration-300 hover:-translate-y-1 backdrop-blur-xl;backdrop-filter:blur(20px) saturate(180%) brightness(110%);-webkit-backdrop-filter:blur(20px) saturate(180%) brightness(110%);box-shadow:0 25px 50px rgba(0,0,0,0.15),0 0 0 1px rgba(255,255,255,0.1)}.stat-icon{@apply absolute top-4 right-4 opacity-15 text-4xl}.stat-title{@apply text-sm text-slate-500 dark:text-slate-400 mb-2 font-medium uppercase}.stat-value{@apply text-2xl font-bold text-slate-900 dark:text-white mb-1}.stat-desc{@apply text-sm text-slate-500 dark:text-slate-400}.nav-tabs{@apply flex border-b border-gray-200 dark:border-slate-700/30 mb-4 overflow-x-auto}.nav-tab{@apply py-4 px-6 text-slate-600 dark:text-slate-300 border-b-2 border-transparent cursor-pointer transition-all duration-200 whitespace-nowrap hover:text-slate-900 dark:hover:text-white hover:bg-slate-50 dark:hover:bg-slate-800/50}.nav-tab.active{@apply text-slate-900 dark:text-white border-b-2 border-black dark:border-white font-medium}.tab-content{@apply mt-8}.tab-pane{@apply hidden}.tab-pane.active{@apply block}.form-group{@apply mb-4}.form-label{@apply block mb-2 text-sm font-medium text-slate-700 dark:text-slate-300}.form-input,.form-select,.form-textarea{@apply w-full px-3 py-2 bg-white/60 dark:bg-slate-800/60 border border-gray-300/60 dark:border-slate-600/60 rounded-lg text-slate-900 dark:text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-slate-500 focus:border-transparent transition-all duration-200 backdrop-blur-lg;backdrop-filter:blur(16px) saturate(150%);-webkit-backdrop-filter:blur(16px) saturate(150%);box-shadow:0 10px 20px rgba(0,0,0,0.1),0 0 0 1px rgba(255,255,255,0.05)}.admin-table{@apply min-w-full divide-y divide-gray-200 dark:divide-slate-700}.admin-table thead{@apply bg-slate-50 dark:bg-slate-800}.admin-table th{@apply px-6 py-3 text-left text-xs font-medium text-slate-500 dark:text-slate-400 uppercase tracking-wider}.admin-table tbody{@apply bg-white dark:bg-dark-surface divide-y divide-gray-200 dark:divide-slate-700}.admin-table tr{@apply hover:bg-slate-50 dark:hover:bg-slate-700/50 transition-colors}.admin-table td{@apply px-6 py-4 whitespace-nowrap text-sm text-slate-900 dark:text-white}.badge{@apply px-2 inline-flex text-xs leading-5 font-semibold rounded-full}.badge-success{@apply bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200}.badge-error{@apply bg-red-100 text-red-800 dark:bg-red-900 dark:text-red-200}.badge-warning{@apply bg-yellow-100 text-yellow-800 dark:bg-yellow-900 dark:text-yellow-200}.badge-info{@apply bg-blue-100 text-blue-800 dark:bg-blue-900 dark:text-blue-200}.printer-card{@apply bg-white/60 dark:bg-black/70 rounded-xl border border-gray-200/60 dark:border-slate-700/30 p-6 shadow-2xl hover:shadow-2xl transition-all duration-300 hover:-translate-y-1 backdrop-blur-xl;backdrop-filter:blur(20px) saturate(180%) brightness(110%);-webkit-backdrop-filter:blur(20px) saturate(180%) brightness(110%);box-shadow:0 25px 50px rgba(0,0,0,0.15),0 0 0 1px rgba(255,255,255,0.1)}.printer-header{@apply flex justify-between items-center mb-4}.printer-name{@apply text-xl font-bold text-slate-900 dark:text-white}.printer-actions{@apply flex space-x-2}.printer-info{@apply grid grid-cols-2 gap-4 mb-4}.printer-status{@apply flex items-center mt-4}.status-indicator{@apply w-3 h-3 rounded-full mr-2}.status-running{@apply bg-green-500;animation:pulse 2s infinite}.status-stopped{@apply bg-red-500}@keyframes pulse{0%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.1)}100%{opacity:1;transform:scale(1)}}.log-entry{@apply p-3 border-l-4 mb-2 rounded-r-lg bg-white dark:bg-slate-800 hover:bg-slate-50 dark:hover:bg-slate-700 transition-colors}.log-debug{@apply border-gray-400 dark:border-gray-500}.log-info{@apply border-blue-400 dark:border-blue-500}.log-warning{@apply border-yellow-400 dark:border-yellow-500}.log-error{@apply border-red-400 dark:border-red-500}.log-critical{@apply border-purple-400 dark:border-purple-500}.scheduler-status{@apply flex items-center p-4 bg-white dark:bg-slate-800 rounded-lg border border-gray-200 dark:border-slate-700 shadow-md}.progress-bar{@apply w-full h-2 bg-gray-200 dark:bg-slate-700 rounded-full overflow-hidden}.progress-bar-fill{@apply h-full transition-all duration-300}.progress-bar-fill-blue{@apply bg-blue-500 dark:bg-blue-600}.progress-bar-fill-green{@apply bg-green-500 dark:bg-green-600}.progress-bar-fill-purple{@apply bg-purple-500 dark:bg-purple-600}.notification{@apply fixed top-4 right-4 max-w-md p-4 rounded-2xl shadow-2xl transform translate-x-full opacity-0 transition-all duration-500 z-50;background:rgba(255,255,255,0.08);backdrop-filter:blur(40px) saturate(200%) brightness(130%) contrast(110%);-webkit-backdrop-filter:blur(40px) saturate(200%) brightness(130%) contrast(110%);border:1px solid rgba(255,255,255,0.25);box-shadow:0 32px 64px rgba(0,0,0,0.25),0 12px 24px rgba(0,0,0,0.15),inset 0 1px 0 rgba(255,255,255,0.4),0 0 0 1px rgba(255,255,255,0.1);animation:notification-slide-in .6s cubic-bezier(0.4,0,0.2,1)}.dark .notification{background:rgba(0,0,0,0.2);backdrop-filter:blur(40px) saturate(180%) brightness(120%) contrast(115%);-webkit-backdrop-filter:blur(40px) saturate(180%) brightness(120%) contrast(115%);border:1px solid rgba(255,255,255,0.15);box-shadow:0 32px 64px rgba(0,0,0,0.6),0 12px 24px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.2),0 0 0 1px rgba(255,255,255,0.05)}.notification.show{@apply translate-x-0 opacity-100}.notification:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 40px 80px rgba(0,0,0,0.3),0 16px 32px rgba(0,0,0,0.2),inset 0 1px 0 rgba(255,255,255,0.5),0 0 0 1px rgba(255,255,255,0.15)}.dark .notification:hover{box-shadow:0 40px 80px rgba(0,0,0,0.7),0 16px 32px rgba(0,0,0,0.5),inset 0 1px 0 rgba(255,255,255,0.3),0 0 0 1px rgba(255,255,255,0.1)}.notification-success{@apply text-green-100;background:linear-gradient(135deg,rgba(34,197,94,0.25) 0,rgba(134,239,172,0.18) 50%,rgba(34,197,94,0.12) 100%);border:1px solid rgba(34,197,94,0.4);box-shadow:0 32px 64px rgba(34,197,94,0.2),0 12px 24px rgba(34,197,94,0.1),inset 0 1px 0 rgba(255,255,255,0.4),0 0 0 1px rgba(34,197,94,0.3)}.notification-error{@apply text-red-100;background:linear-gradient(135deg,rgba(239,68,68,0.25) 0,rgba(252,165,165,0.18) 50%,rgba(239,68,68,0.12) 100%);border:1px solid rgba(239,68,68,0.4);box-shadow:0 32px 64px rgba(239,68,68,0.2),0 12px 24px rgba(239,68,68,0.1),inset 0 1px 0 rgba(255,255,255,0.4),0 0 0 1px rgba(239,68,68,0.3)}.notification-warning{@apply text-yellow-100;background:linear-gradient(135deg,rgba(245,158,11,0.25) 0,rgba(252,211,77,0.18) 50%,rgba(245,158,11,0.12) 100%);border:1px solid rgba(245,158,11,0.4);box-shadow:0 32px 64px rgba(245,158,11,0.2),0 12px 24px rgba(245,158,11,0.1),inset 0 1px 0 rgba(255,255,255,0.4),0 0 0 1px rgba(245,158,11,0.3)}.notification-info{@apply text-blue-100;background:linear-gradient(135deg,rgba(59,130,246,0.25) 0,rgba(147,197,253,0.18) 50%,rgba(59,130,246,0.12) 100%);border:1px solid rgba(59,130,246,0.4);box-shadow:0 32px 64px rgba(59,130,246,0.2),0 12px 24px rgba(59,130,246,0.1),inset 0 1px 0 rgba(255,255,255,0.4),0 0 0 1px rgba(59,130,246,0.3)}.toast-notification{@apply fixed z-50 p-4 rounded-2xl shadow-2xl transform transition-all duration-500 text-sm font-medium;background:rgba(255,255,255,0.08);backdrop-filter:blur(40px) saturate(200%) brightness(130%) contrast(110%);-webkit-backdrop-filter:blur(40px) saturate(200%) brightness(130%) contrast(110%);border:1px solid rgba(255,255,255,0.25);box-shadow:0 32px 64px rgba(0,0,0,0.25),0 12px 24px rgba(0,0,0,0.15),inset 0 1px 0 rgba(255,255,255,0.4),0 0 0 1px rgba(255,255,255,0.1)}.dark .toast-notification{background:rgba(0,0,0,0.2);backdrop-filter:blur(40px) saturate(180%) brightness(120%) contrast(115%);-webkit-backdrop-filter:blur(40px) saturate(180%) brightness(120%) contrast(115%);border:1px solid rgba(255,255,255,0.15);box-shadow:0 32px 64px rgba(0,0,0,0.6),0 12px 24px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.2),0 0 0 1px rgba(255,255,255,0.05)}.alert{@apply p-6 rounded-2xl border mb-6 shadow-2xl;background:rgba(255,255,255,0.12);backdrop-filter:blur(30px) saturate(200%) brightness(120%) contrast(110%);-webkit-backdrop-filter:blur(30px) saturate(200%) brightness(120%) contrast(110%);border:1px solid rgba(255,255,255,0.25);box-shadow:0 25px 50px rgba(0,0,0,0.15),0 8px 16px rgba(0,0,0,0.1),inset 0 1px 0 rgba(255,255,255,0.3),0 0 0 1px rgba(255,255,255,0.1);animation:alert-fade-in .5s ease-out}.dark .alert{background:rgba(0,0,0,0.3);backdrop-filter:blur(30px) saturate(180%) brightness(110%) contrast(120%);-webkit-backdrop-filter:blur(30px) saturate(180%) brightness(110%) contrast(120%);border:1px solid rgba(255,255,255,0.15);box-shadow:0 25px 50px rgba(0,0,0,0.4),0 8px 16px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.15),0 0 0 1px rgba(255,255,255,0.05)}.alert-success{@apply text-green-900 dark:text-green-100;background:linear-gradient(135deg,rgba(34,197,94,0.15) 0,rgba(134,239,172,0.1) 50%,rgba(34,197,94,0.08) 100%);border:1px solid rgba(34,197,94,0.3)}.alert-error{@apply text-red-900 dark:text-red-100;background:linear-gradient(135deg,rgba(239,68,68,0.15) 0,rgba(252,165,165,0.1) 50%,rgba(239,68,68,0.08) 100%);border:1px solid rgba(239,68,68,0.3)}.alert-warning{@apply text-yellow-900 dark:text-yellow-100;background:linear-gradient(135deg,rgba(245,158,11,0.15) 0,rgba(252,211,77,0.1) 50%,rgba(245,158,11,0.08) 100%);border:1px solid rgba(245,158,11,0.3)}.alert-info{@apply text-blue-900 dark:text-blue-100;background:linear-gradient(135deg,rgba(59,130,246,0.15) 0,rgba(147,197,253,0.1) 50%,rgba(59,130,246,0.08) 100%);border:1px solid rgba(59,130,246,0.3)}.browser-notification{@apply fixed top-4 left-4 max-w-sm p-4 rounded-2xl shadow-2xl z-50;background:rgba(255,255,255,0.08);backdrop-filter:blur(40px) saturate(200%) brightness(130%) contrast(110%);-webkit-backdrop-filter:blur(40px) saturate(200%) brightness(130%) contrast(110%);border:1px solid rgba(255,255,255,0.25);box-shadow:0 32px 64px rgba(0,0,0,0.25),0 12px 24px rgba(0,0,0,0.15),inset 0 1px 0 rgba(255,255,255,0.4),0 0 0 1px rgba(255,255,255,0.1);animation:notification-slide-left .6s cubic-bezier(0.4,0,0.2,1)}.dark .browser-notification{background:rgba(0,0,0,0.2);backdrop-filter:blur(40px) saturate(180%) brightness(120%) contrast(115%);-webkit-backdrop-filter:blur(40px) saturate(180%) brightness(120%) contrast(115%);border:1px solid rgba(255,255,255,0.15);box-shadow:0 32px 64px rgba(0,0,0,0.6),0 12px 24px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.2),0 0 0 1px rgba(255,255,255,0.05)}@keyframes notification-slide-in{0%{opacity:0;transform:translateX(100%) translateY(-20px) scale(0.9);backdrop-filter:blur(0)}50%{opacity:.8;transform:translateX(20px) translateY(-10px) scale(1.05);backdrop-filter:blur(20px)}100%{opacity:1;transform:translateX(0) translateY(0) scale(1);backdrop-filter:blur(40px)}}@keyframes notification-slide-out{0%{opacity:1;transform:translateX(0) translateY(0) scale(1)}100%{opacity:0;transform:translateX(100%) translateY(-20px) scale(0.9)}}@keyframes notification-slide-left{0%{opacity:0;transform:translateX(-100%) translateY(-20px) scale(0.9);backdrop-filter:blur(0)}50%{opacity:.8;transform:translateX(-20px) translateY(-10px) scale(1.05);backdrop-filter:blur(20px)}100%{opacity:1;transform:translateX(0) translateY(0) scale(1);backdrop-filter:blur(40px)}}@keyframes alert-fade-in{0%{opacity:0;transform:translateY(-20px) scale(0.95)}100%{opacity:1;transform:translateY(0) scale(1)}}.notification.hiding{animation:notification-slide-out .4s cubic-bezier(0.4,0,0.2,1) forwards}.notification-icon{@apply flex items-center justify-center w-8 h-8 rounded-full mr-3 flex-shrink-0;background:rgba(255,255,255,0.2);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,0.3);box-shadow:0 8px 16px rgba(0,0,0,0.1),inset 0 1px 0 rgba(255,255,255,0.4)}.notification-content{@apply flex-1}.notification-title{@apply font-semibold text-sm mb-1}.notification-message{@apply text-sm opacity-90}.notification-close{@apply ml-3 p-1 rounded-lg opacity-70 hover:opacity-100 transition-opacity;background:rgba(255,255,255,0.1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.2)}.notification-close:hover{background:rgba(255,255,255,0.2);transform:scale(1.1)}.notifications-container{@apply fixed top-4 right-4 z-50 space-y-3 max-w-md}.notifications-container-left{@apply fixed top-4 left-4 z-50 space-y-3 max-w-sm}.flash-message-light{background:linear-gradient(135deg,rgba(255,255,255,0.95) 0,rgba(248,250,252,0.9) 100%);backdrop-filter:blur(32px) saturate(200%) brightness(120%);-webkit-backdrop-filter:blur(32px) saturate(200%) brightness(120%);border:1px solid rgba(226,232,240,0.6);box-shadow:0 25px 50px rgba(0,0,0,0.1),0 12px 24px rgba(0,115,206,0.05),inset 0 1px 0 rgba(255,255,255,0.8);color:var(--color-text-primary)}.flash-message-light.success{border-left:4px solid #10b981;background:linear-gradient(135deg,rgba(236,253,245,0.95) 0,rgba(209,250,229,0.9) 100%)}.flash-message-light.error{border-left:4px solid #ef4444;background:linear-gradient(135deg,rgba(254,242,242,0.95) 0,rgba(252,165,165,0.9) 100%)}.flash-message-light.warning{border-left:4px solid #fbbf24;background:linear-gradient(135deg,rgba(255,251,235,0.95) 0,rgba(254,243,199,0.9) 100%)}.flash-message-light.info{border-left:4px solid #3b82f6;background:linear-gradient(135deg,rgba(239,246,255,0.95) 0,rgba(219,234,254,0.9) 100%)}.table-enhanced{background:var(--gradient-card);border:1px solid var(--color-border-primary);border-radius:var(--card-radius);overflow:hidden;box-shadow:0 4px 20px var(--color-shadow),0 2px 8px rgba(0,115,206,0.04),inset 0 1px 0 rgba(255,255,255,0.6)}.table-enhanced th{background:linear-gradient(135deg,var(--color-bg-secondary) 0,var(--color-bg-tertiary) 100%);color:var(--color-text-primary);font-weight:600;padding:1rem 1.5rem;border-bottom:1px solid var(--color-border-primary);position:relative}.table-enhanced th::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0,var(--color-border-secondary) 50%,transparent 100%)}.table-enhanced td{padding:1rem 1.5rem;border-bottom:1px solid var(--color-border-primary);color:var(--color-text-secondary);transition:all .2s ease}.table-enhanced tbody tr:hover{background:var(--color-bg-secondary);transform:scale(1.002)}.dark .table-enhanced{background:rgba(10,10,10,0.8);border-color:var(--color-border-primary)}.dark .table-enhanced th{background:rgba(26,26,26,0.8);color:var(--color-text-primary)}.dark .table-enhanced tbody tr:hover{background:rgba(26,26,26,0.6)}.modal-enhanced{background:linear-gradient(135deg,rgba(255,255,255,0.98) 0,rgba(248,250,252,0.95) 50%,rgba(255,255,255,0.98) 100%);backdrop-filter:blur(32px) saturate(220%) brightness(120%);-webkit-backdrop-filter:blur(32px) saturate(220%) brightness(120%);border:1px solid rgba(226,232,240,0.7);border-radius:1.5rem;box-shadow:0 50px 100px rgba(0,0,0,0.15),0 20px 40px rgba(0,115,206,0.08),inset 0 2px 0 rgba(255,255,255,0.9);position:relative;overflow:hidden}.modal-enhanced::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0,rgba(226,232,240,0.8) 50%,transparent 100%)}.dark .modal-enhanced{background:rgba(0,0,0,0.95);border-color:rgba(42,42,42,0.7);box-shadow:0 50px 100px rgba(0,0,0,0.5),inset 0 2px 0 rgba(255,255,255,0.05)}.status-badge-enhanced{display:inline-flex;align-items:center;padding:.5rem 1rem;font-size:.75rem;font-weight:700;border-radius:9999px;text-transform:uppercase;letter-spacing:.05em;border:1px solid transparent;transition:all .2s ease;position:relative;overflow:hidden}.status-badge-enhanced::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.3),transparent);transition:left .5s ease}.status-badge-enhanced:hover::before{left:100%}.status-online-enhanced{background:linear-gradient(135deg,#ecfdf5 0,#a7f3d0 100%);color:#065f46;border-color:rgba(16,185,129,0.3)}.status-offline-enhanced{background:linear-gradient(135deg,#fef2f2 0,#fca5a5 100%);color:#991b1b;border-color:rgba(239,68,68,0.3)}.status-printing-enhanced{background:linear-gradient(135deg,#eff6ff 0,#bfdbfe 100%);color:#1e40af;border-color:rgba(59,130,246,0.3)}.dark-mode-toggle-new{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:9999px;padding:.625rem;transition:all .3s cubic-bezier(0.4,0,0.2,1);background:linear-gradient(135deg,rgba(248,250,252,0.9) 0,rgba(241,245,249,0.8) 100%);border:1px solid rgba(226,232,240,0.7);box-shadow:0 4px 12px rgba(0,0,0,0.06),0 2px 4px rgba(0,115,206,0.04),inset 0 1px 0 rgba(255,255,255,0.8);color:var(--color-text-secondary);z-index:100}.dark-mode-toggle-new:hover{transform:translateY(-2px) scale(1.05);background:linear-gradient(135deg,rgba(248,250,252,0.95) 0,rgba(241,245,249,0.85) 100%);box-shadow:0 8px 20px rgba(0,0,0,0.1),0 4px 8px rgba(0,115,206,0.08),inset 0 1px 0 rgba(255,255,255,0.9)}.dark-mode-toggle-new:active{transform:translateY(-1px) scale(0.98);transition:transform .1s}.dark .dark-mode-toggle-new{background:rgba(10,10,10,0.8);border:1px solid rgba(42,42,42,0.6);box-shadow:0 4px 12px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.05);color:var(--color-text-secondary)}.dark .dark-mode-toggle-new:hover{background:rgba(10,10,10,0.9);box-shadow:0 8px 20px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.08)}.dark-mode-toggle-new .sun-icon,.dark-mode-toggle-new .moon-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);transition:all .3s cubic-bezier(0.4,0,0.2,1)}.dark-mode-toggle-new .sun-icon:not(.hidden){animation:icon-appear .5s cubic-bezier(0.25,1,0.5,1) forwards}.dark-mode-toggle-new .moon-icon:not(.hidden){animation:icon-appear .5s cubic-bezier(0.25,1,0.5,1) forwards}@keyframes icon-appear{0%{opacity:0;transform:translate(-50%,-50%) scale(0.5) rotate(-20deg)}100%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(0)}}.dark .sun-icon{display:none}.dark .moon-icon{display:block}.sun-icon{display:block}.moon-icon{display:none}.user-menu-button-new{display:flex;align-items:center;gap:.5rem;border-radius:.75rem;padding:.5rem;transition:all .3s cubic-bezier(0.4,0,0.2,1);background:linear-gradient(135deg,rgba(248,250,252,0.8) 0,rgba(241,245,249,0.7) 100%);border:1px solid rgba(226,232,240,0.6);box-shadow:0 2px 8px rgba(0,0,0,0.05),inset 0 1px 0 rgba(255,255,255,0.7)}.user-menu-button-new:hover{transform:translateY(-1px);background:linear-gradient(135deg,rgba(248,250,252,0.9) 0,rgba(241,245,249,0.8) 100%);box-shadow:0 4px 12px rgba(0,0,0,0.08),0 2px 4px rgba(0,115,206,0.04),inset 0 1px 0 rgba(255,255,255,0.8)}.dark .user-menu-button-new{background:rgba(10,10,10,0.7);border-color:rgba(42,42,42,0.6);box-shadow:0 2px 8px rgba(0,0,0,0.2),inset 0 1px 0 rgba(255,255,255,0.03)}.dark .user-menu-button-new:hover{background:rgba(10,10,10,0.8);box-shadow:0 4px 12px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.05)}.hover-lift-enhanced{transition:all .3s cubic-bezier(0.4,0,0.2,1)}.hover-lift-enhanced:hover{transform:translateY(-3px) scale(1.01);box-shadow:0 12px 30px var(--color-shadow-strong),0 6px 15px var(--color-shadow-accent)}.dark .hover-lift-enhanced:hover{box-shadow:0 12px 30px var(--color-shadow)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--color-bg-secondary);border-radius:4px}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--color-border-secondary) 0,var(--color-border-primary) 100%);border-radius:4px;transition:background .2s ease}::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,var(--color-accent) 0,var(--color-accent-hover) 100%)}.dark ::-webkit-scrollbar-track{background:var(--color-bg-secondary)}.dark ::-webkit-scrollbar-thumb{background:var(--color-border-primary)}.dark ::-webkit-scrollbar-thumb:hover{background:#60a5fa}.loading-enhanced{position:relative;overflow:hidden}.loading-enhanced::after{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(0,115,206,0.1),transparent);animation:loading-shimmer 2s infinite}@keyframes loading-shimmer{0%{left:-100%}100%{left:100%}}.focus-enhanced:focus{outline:2px solid var(--color-accent);outline-offset:2px;box-shadow:0 0 0 4px rgba(0,115,206,0.15),0 4px 12px var(--color-shadow-accent)}.dark .focus-enhanced:focus{outline-color:#60a5fa;box-shadow:0 0 0 4px rgba(96,165,250,0.15),0 4px 12px rgba(96,165,250,0.2)}@media(max-width:768px){.card-enhanced{padding:1rem;border-radius:.75rem}.btn-enhanced{padding:.75rem 1.5rem;font-size:.8rem}.modal-enhanced{border-radius:1rem;margin:1rem}.dark-mode-toggle-new{padding:.5rem}}@media(prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important}}@media(prefers-contrast:high){:root{--color-shadow:rgba(0,0,0,0.2);--color-shadow-strong:rgba(0,0,0,0.3);--color-border-primary:#000}.dark{--color-border-primary:#fff}}}.flash-message{@apply fixed top-4 right-4 px-6 py-4 rounded-2xl text-sm font-medium shadow-2xl transform transition-all duration-500 z-50 border;background:rgba(255,255,255,0.08);backdrop-filter:blur(40px) saturate(200%) brightness(130%) contrast(110%);-webkit-backdrop-filter:blur(40px) saturate(200%) brightness(130%) contrast(110%);border:1px solid rgba(255,255,255,0.25);box-shadow:0 32px 64px rgba(0,0,0,0.25),0 12px 24px rgba(0,0,0,0.15),inset 0 1px 0 rgba(255,255,255,0.4),0 0 0 1px rgba(255,255,255,0.1);animation:flash-slide-in .5s cubic-bezier(0.4,0,0.2,1);transition:all .5s cubic-bezier(0.4,0,0.2,1)}.dark .flash-message{background:rgba(0,0,0,0.2);backdrop-filter:blur(40px) saturate(180%) brightness(120%) contrast(115%);-webkit-backdrop-filter:blur(40px) saturate(180%) brightness(120%) contrast(115%);border:1px solid rgba(255,255,255,0.15);box-shadow:0 32px 64px rgba(0,0,0,0.6),0 12px 24px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.2),0 0 0 1px rgba(255,255,255,0.05)}.flash-message:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 40px 80px rgba(0,0,0,0.3),0 16px 32px rgba(0,0,0,0.2),inset 0 1px 0 rgba(255,255,255,0.5),0 0 0 1px rgba(255,255,255,0.15)}.dark .flash-message:hover{box-shadow:0 40px 80px rgba(0,0,0,0.7),0 16px 32px rgba(0,0,0,0.5),inset 0 1px 0 rgba(255,255,255,0.3),0 0 0 1px rgba(255,255,255,0.1)}.flash-message.info{@apply text-blue-100;background:linear-gradient(135deg,rgba(59,130,246,0.2) 0,rgba(147,197,253,0.15) 50%,rgba(59,130,246,0.1) 100%);border:1px solid rgba(59,130,246,0.3)}.flash-message.success{@apply text-green-100;background:linear-gradient(135deg,rgba(34,197,94,0.2) 0,rgba(134,239,172,0.15) 50%,rgba(34,197,94,0.1) 100%);border:1px solid rgba(34,197,94,0.3)}.flash-message.warning{@apply text-yellow-100;background:linear-gradient(135deg,rgba(245,158,11,0.2) 0,rgba(252,211,77,0.15) 50%,rgba(245,158,11,0.1) 100%);border:1px solid rgba(245,158,11,0.3)}.flash-message.error{@apply text-red-100;background:linear-gradient(135deg,rgba(239,68,68,0.2) 0,rgba(252,165,165,0.15) 50%,rgba(239,68,68,0.1) 100%);border:1px solid rgba(239,68,68,0.3)}@keyframes flash-slide-in{0%{opacity:0;transform:translateX(100%) translateY(-20px) scale(0.9);backdrop-filter:blur(0)}50%{opacity:.8;transform:translateX(20px) translateY(-10px) scale(1.05);backdrop-filter:blur(20px)}100%{opacity:1;transform:translateX(0) translateY(0) scale(1);backdrop-filter:blur(40px)}}@keyframes flash-slide-out{0%{opacity:1;transform:translateX(0) translateY(0) scale(1)}100%{opacity:0;transform:translateX(100%) translateY(-20px) scale(0.9)}}.flash-message.hiding{animation:flash-slide-out .4s cubic-bezier(0.4,0,0.2,1) forwards}.dnd-toggle{@apply relative inline-flex items-center h-6 rounded-full w-11 transition-colors duration-300 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500;background:rgba(156,163,175,0.3);backdrop-filter:blur(10px);border:1px solid rgba(156,163,175,0.2)}.dnd-toggle.active{background:rgba(239,68,68,0.3);border:1px solid rgba(239,68,68,0.4)}.dnd-toggle-slider{@apply inline-block h-4 w-4 rounded-full shadow-lg transform transition-transform duration-300;background:rgba(255,255,255,0.9);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.3);box-shadow:0 4px 8px rgba(0,0,0,0.2),0 2px 4px rgba(0,0,0,0.1);margin:.125rem}.dnd-toggle.active .dnd-toggle-slider{transform:translateX(1.25rem);background:rgba(255,255,255,1);box-shadow:0 6px 12px rgba(239,68,68,0.3),0 3px 6px rgba(239,68,68,0.2)}.dnd-indicator{@apply fixed top-4 left-4 z-50 flex items-center px-3 py-2 rounded-lg text-sm font-medium transition-all duration-300;background:rgba(239,68,68,0.1);backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%);border:1px solid rgba(239,68,68,0.3);color:#ef4444;transform:translateY(-100%);opacity:0}.dnd-indicator.active{transform:translateY(0);opacity:1}.dnd-modal{@apply fixed inset-0 z-50 flex items-center justify-center p-4;background:rgba(0,0,0,0.3);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.dnd-modal-content{@apply w-full max-w-md rounded-2xl p-6 shadow-2xl transform transition-all;background:rgba(255,255,255,0.1);backdrop-filter:blur(40px) saturate(200%) brightness(120%);-webkit-backdrop-filter:blur(40px) saturate(200%) brightness(120%);border:1px solid rgba(255,255,255,0.3);box-shadow:0 25px 50px rgba(0,0,0,0.25),0 8px 16px rgba(0,0,0,0.15),inset 0 1px 0 rgba(255,255,255,0.4)}.dark .dnd-modal-content{background:rgba(0,0,0,0.3);backdrop-filter:blur(40px) saturate(180%) brightness(110%);-webkit-backdrop-filter:blur(40px) saturate(180%) brightness(110%);border:1px solid rgba(255,255,255,0.15);box-shadow:0 25px 50px rgba(0,0,0,0.6),0 8px 16px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.2)}.flash-message.dnd-suppressed{animation:flash-fade-in .3s ease-out;opacity:.3;transform:scale(0.95);pointer-events:none}@keyframes flash-fade-in{0%{opacity:0;transform:scale(0.9)}100%{opacity:.3;transform:scale(0.95)}}.dnd-counter{@apply absolute -top-2 -right-2 bg-red-500 text-white text-xs rounded-full h-5 w-5 flex items-center justify-center font-bold;background:rgba(239,68,68,0.9);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.2);box-shadow:0 2px 4px rgba(0,0,0,0.2);animation:dnd-counter-bounce .5s ease-out}@keyframes dnd-counter-bounce{0%{transform:scale(0)}50%{transform:scale(1.2)}100%{transform:scale(1)}}@keyframes slide-down{0%{opacity:0;transform:translateY(-20px)}100%{opacity:1;transform:translateY(0)}}.mercedes-background::before{content:'';position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;background-image:url("data:image/svg+xml,%3Csvgxmlns='http://www.w3.org/2000/svg'viewBox='008080'width='80'height='80'opacity='0.03'fill='currentColor'%3E%3Cpathd='M58.6,4.5C53,1.6,46.7,0,40,0c-6.7,0-13,1.6-18.6,4.5v0C8.7,11.2,0,24.6,0,40c0,15.4,8.7,28.8,21.5,35.5C27,78.3,33.3,80,40,80c6.7,0,12.9-1.7,18.5-4.6C71.3,68.8,80,55.4,80,40C80,24.6,71.3,11.2,58.6,4.5zM4,40c0-13.1,7-24.5,17.5-30.9v0C26.6,6,32.5,4.2,39,4l-4.5,32.7L21.5,46.8v0L8.3,57.1C5.6,52,4,46.2,4,40zM58.6,70.8C53.1,74.1,46.8,76,40,76c-6.8,0-13.2-1.9-18.6-5.2c-4.9-2.9-8.9-6.9-11.9-11.7l11.9-4.9v0L40,46.6l18.6,7.5v0l12,4.9C67.6,63.9,63.4,67.9,58.6,70.8zM58.6,46.8L58.6,46.8l-12.9-10L41.1,4c6.3,0.2,12.3,2,17.4,5.1v0C69,15.4,76,26.9,76,40c0,6.2-1.5,12-4.3,17.1L58.6,46.8z'/%3E%3C/svg%3E");background-position:center;background-repeat:repeat;background-size:120px 120px;pointer-events:none;opacity:.03;transition:opacity .3s ease}.dark .mercedes-background::before{opacity:.015;filter:invert(1) brightness(0.3);background-size:150px 150px}@layer components{.btn-primary{@apply text-white dark:text-slate-900 px-4 py-2 rounded-lg transition-all duration-300 focus:outline-none focus:ring-2 focus:ring-gray-500 focus:ring-offset-2 shadow-2xl hover:-translate-y-0.5;background:rgba(0,0,0,0.7);backdrop-filter:blur(20px) saturate(150%) brightness(110%);-webkit-backdrop-filter:blur(20px) saturate(150%) brightness(110%);border:1px solid rgba(255,255,255,0.2);box-shadow:0 20px 40px rgba(0,0,0,0.3),0 8px 16px rgba(0,0,0,0.2),inset 0 1px 0 rgba(255,255,255,0.2),0 0 0 1px rgba(255,255,255,0.1)}.btn-primary:hover{background:rgba(0,0,0,0.9);backdrop-filter:blur(25px) saturate(180%) brightness(120%);-webkit-backdrop-filter:blur(25px) saturate(180%) brightness(120%);border:1px solid rgba(255,255,255,0.3);box-shadow:0 25px 50px rgba(0,0,0,0.4),0 10px 20px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.3)}.dark .btn-primary{background:rgba(255,255,255,0.7);border:1px solid rgba(0,0,0,0.1);box-shadow:0 20px 40px rgba(0,0,0,0.2),0 8px 16px rgba(0,0,0,0.1),inset 0 1px 0 rgba(255,255,255,0.8),0 0 0 1px rgba(0,0,0,0.05)}.dark .btn-primary:hover{background:rgba(255,255,255,0.9);border:1px solid rgba(0,0,0,0.15);box-shadow:0 25px 50px rgba(0,0,0,0.3),0 10px 20px rgba(0,0,0,0.2),inset 0 1px 0 rgba(255,255,255,0.9)}.btn-secondary{@apply text-slate-900 dark:text-white px-4 py-2 rounded-lg transition-all duration-300 focus:outline-none focus:ring-2 focus:ring-slate-500 focus:ring-offset-2 shadow-2xl hover:-translate-y-0.5;background:rgba(255,255,255,0.3);backdrop-filter:blur(20px) saturate(150%) brightness(110%);-webkit-backdrop-filter:blur(20px) saturate(150%) brightness(110%);border:1px solid rgba(255,255,255,0.4);box-shadow:0 20px 40px rgba(0,0,0,0.15),0 8px 16px rgba(0,0,0,0.1),inset 0 1px 0 rgba(255,255,255,0.5),0 0 0 1px rgba(255,255,255,0.2)}.btn-secondary:hover{background:rgba(255,255,255,0.5);backdrop-filter:blur(25px) saturate(180%) brightness(120%);-webkit-backdrop-filter:blur(25px) saturate(180%) brightness(120%);border:1px solid rgba(255,255,255,0.6);box-shadow:0 25px 50px rgba(0,0,0,0.2),0 10px 20px rgba(0,0,0,0.15),inset 0 1px 0 rgba(255,255,255,0.7)}.dark .btn-secondary{background:rgba(0,0,0,0.4);border:1px solid rgba(255,255,255,0.2);box-shadow:0 20px 40px rgba(0,0,0,0.3),0 8px 16px rgba(0,0,0,0.2),inset 0 1px 0 rgba(255,255,255,0.2),0 0 0 1px rgba(255,255,255,0.1)}.dark .btn-secondary:hover{background:rgba(0,0,0,0.6);border:1px solid rgba(255,255,255,0.3);box-shadow:0 25px 50px rgba(0,0,0,0.4),0 10px 20px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.3)}.btn-outline{@apply border-2 border-black/70 hover:bg-black/70 dark:border-white/70 dark:hover:bg-white/70 text-black hover:text-white dark:text-white dark:hover:text-slate-900 px-4 py-2 rounded-lg transition-all duration-300 focus:outline-none focus:ring-2 focus:ring-gray-500 focus:ring-offset-2 backdrop-blur-lg;backdrop-filter:blur(16px) saturate(150%);-webkit-backdrop-filter:blur(16px) saturate(150%);box-shadow:0 15px 30px rgba(0,0,0,0.1),0 0 0 1px rgba(255,255,255,0.05)}.glass-card{@apply rounded-xl p-6 shadow-2xl transition-all duration-300;background:rgba(255,255,255,0.15);backdrop-filter:blur(30px) saturate(200%) brightness(120%) contrast(110%);-webkit-backdrop-filter:blur(30px) saturate(200%) brightness(120%) contrast(110%);border:1px solid rgba(255,255,255,0.3);box-shadow:0 25px 50px rgba(0,0,0,0.15),0 8px 16px rgba(0,0,0,0.1),inset 0 1px 0 rgba(255,255,255,0.3),0 0 0 1px rgba(255,255,255,0.1);border-radius:var(--card-radius)}.dark .glass-card{background:rgba(0,0,0,0.3);backdrop-filter:blur(30px) saturate(180%) brightness(110%) contrast(120%);-webkit-backdrop-filter:blur(30px) saturate(180%) brightness(110%) contrast(120%);border:1px solid rgba(255,255,255,0.15);box-shadow:0 25px 50px rgba(0,0,0,0.4),0 8px 16px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.15),0 0 0 1px rgba(255,255,255,0.05)}.dashboard-card{@apply rounded-xl p-6 shadow-2xl transition-all duration-300 hover:-translate-y-1;background:rgba(255,255,255,0.12);backdrop-filter:blur(35px) saturate(200%) brightness(125%) contrast(115%);-webkit-backdrop-filter:blur(35px) saturate(200%) brightness(125%) contrast(115%);border:1px solid rgba(255,255,255,0.25);box-shadow:0 25px 50px rgba(0,0,0,0.15),0 8px 16px rgba(0,0,0,0.08),inset 0 1px 0 rgba(255,255,255,0.25),0 0 0 1px rgba(255,255,255,0.1);border-radius:var(--card-radius)}.dark .dashboard-card{background:rgba(0,0,0,0.35);backdrop-filter:blur(35px) saturate(180%) brightness(115%) contrast(125%);-webkit-backdrop-filter:blur(35px) saturate(180%) brightness(115%) contrast(125%);border:1px solid rgba(255,255,255,0.12);box-shadow:0 25px 50px rgba(0,0,0,0.5),0 8px 16px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.12),0 0 0 1px rgba(255,255,255,0.05)}.nav-link{@apply flex items-center px-4 py-2 rounded-lg text-sm font-medium transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-slate-500 focus:ring-offset-2 text-slate-700 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700/50 hover:shadow-md}.nav-link.active{@apply text-slate-900 dark:text-white bg-slate-100 dark:bg-black shadow-sm}.navbar{display:flex;justify-content:space-between;align-items:center;padding:.5rem 1rem;background:rgba(255,255,255,0.1);backdrop-filter:blur(10px);border-radius:10px;box-shadow:0 4px 6px rgba(0,0,0,0.1);transition:all .3s ease}.navbar-button{padding:.25rem .5rem;font-size:.875rem;border-radius:5px;transition:background-color .3s ease}.navbar-button:hover{background-color:rgba(255,255,255,0.2)}@media(max-width:768px){.navbar{flex-direction:column;padding:.25rem}.navbar-button{margin:.25rem 0}}.dark .navbar{background:rgba(0,0,0,0.25);backdrop-filter:blur(40px) saturate(180%) brightness(120%) contrast(120%);-webkit-backdrop-filter:blur(40px) saturate(180%) brightness(120%) contrast(120%);box-shadow:0 8px 32px rgba(0,0,0,0.6),0 2px 8px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.1),0 0 0 1px rgba(255,255,255,0.05);border-bottom:1px solid rgba(255,255,255,0.1)}.navbar-brand{@apply flex items-center space-x-2 transition-transform duration-300 hover:scale-105}.navbar-menu{@apply flex items-center justify-center space-x-1 md:space-x-3 lg:space-x-6 p-3 mx-4 rounded-2xl border;background:rgba(255,255,255,0.25);backdrop-filter:blur(20px) saturate(150%) brightness(110%);-webkit-backdrop-filter:blur(20px) saturate(150%) brightness(110%);border:1px solid rgba(255,255,255,0.3);box-shadow:0 4px 16px rgba(0,0,0,0.1),inset 0 1px 0 rgba(255,255,255,0.4),0 0 0 1px rgba(255,255,255,0.1)}.dark .navbar-menu{background:rgba(0,0,0,0.4);backdrop-filter:blur(20px) saturate(150%) brightness(110%);-webkit-backdrop-filter:blur(20px) saturate(150%) brightness(110%);border:1px solid rgba(255,255,255,0.15);box-shadow:0 4px 16px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.2),0 0 0 1px rgba(255,255,255,0.05)}.navbar-button{@apply p-2 rounded-full transition-colors duration-300 focus:outline-none focus:ring-2 focus:ring-offset-2}.user-menu-button{@apply flex items-center space-x-2 rounded-lg p-1 transition-all duration-300 hover:bg-gray-100/80 dark:hover:bg-slate-700/60 focus:outline-none focus:ring-2 focus:ring-slate-500 focus:ring-offset-2}.user-avatar{@apply w-10 h-10 bg-black dark:bg-white text-white dark:text-slate-900 rounded-full flex items-center justify-center font-bold text-sm shadow-md transition-all duration-300 hover:shadow-lg}.avatar-large{@apply w-14 h-14 bg-black dark:bg-white text-white dark:text-slate-900 rounded-full flex items-center justify-center font-bold text-lg shadow-md}.user-dropdown-item{@apply flex items-center px-4 py-3 text-sm text-slate-700 dark:text-slate-300 hover:bg-gray-100/80 dark:hover:bg-slate-700/60 hover:text-slate-900 dark:hover:text-white transition-all duration-300 focus:outline-none focus:bg-gray-100/80 dark:focus:bg-slate-700/60}.user-dropdown-separator{@apply border-t border-gray-200/80 dark:border-slate-700/30 my-1}.menu-item{@apply flex items-center space-x-2 px-4 py-2.5 text-slate-700 dark:text-slate-300 rounded-xl transition-all duration-300;background:rgba(255,255,255,0.1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.2);box-shadow:0 2px 8px rgba(0,0,0,0.05)}.menu-item:hover{@apply text-slate-900 dark:text-white;background:rgba(255,255,255,0.3);backdrop-filter:blur(15px) saturate(150%);-webkit-backdrop-filter:blur(15px) saturate(150%);border:1px solid rgba(255,255,255,0.4);box-shadow:0 4px 16px rgba(0,0,0,0.1);transform:translateY(-1px)}.dark .menu-item{background:rgba(0,0,0,0.2);border:1px solid rgba(255,255,255,0.1);box-shadow:0 2px 8px rgba(0,0,0,0.2)}.dark .menu-item:hover{background:rgba(0,0,0,0.4);border:1px solid rgba(255,255,255,0.2);box-shadow:0 4px 16px rgba(0,0,0,0.3)}.menu-item.active{@apply text-slate-900 dark:text-white font-medium;background:rgba(255,255,255,0.5);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid rgba(255,255,255,0.6);box-shadow:0 4px 16px rgba(0,0,0,0.15),inset 0 1px 0 rgba(255,255,255,0.5)}.dark .menu-item.active{background:rgba(0,0,0,0.6);border:1px solid rgba(255,255,255,0.3);box-shadow:0 4px 16px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.2)}.user-dropdown{@apply absolute right-0 mt-2 w-64 rounded-xl shadow-2xl z-50 overflow-hidden;background:rgba(255,255,255,0.1);backdrop-filter:blur(40px) saturate(200%) brightness(130%) contrast(110%);-webkit-backdrop-filter:blur(40px) saturate(200%) brightness(130%) contrast(110%);border:1px solid rgba(255,255,255,0.3);box-shadow:0 25px 50px rgba(0,0,0,0.25),0 8px 16px rgba(0,0,0,0.15),inset 0 1px 0 rgba(255,255,255,0.4),0 0 0 1px rgba(255,255,255,0.1);animation:fadeIn .2s ease-out forwards}.dark .user-dropdown{background:rgba(0,0,0,0.4);backdrop-filter:blur(40px) saturate(180%) brightness(120%) contrast(120%);-webkit-backdrop-filter:blur(40px) saturate(180%) brightness(120%) contrast(120%);border:1px solid rgba(255,255,255,0.15);box-shadow:0 25px 50px rgba(0,0,0,0.6),0 8px 16px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.2),0 0 0 1px rgba(255,255,255,0.05)}.dropdown-header{@apply flex items-center p-4 border-b border-gray-200/80 dark:border-slate-700/30}.dropdown-item{@apply flex items-center gap-3 px-4 py-3 text-sm text-slate-700 dark:text-slate-300 hover:bg-gray-100/80 dark:hover:bg-slate-700/60 hover:text-slate-900 dark:hover:text-white transition-all duration-300}.dropdown-divider{@apply border-t border-gray-200/80 dark:border-slate-700/30}@keyframes mercedes-rotate{0%{transform:rotate(0)}25%{transform:rotate(90deg)}50%{transform:rotate(180deg)}75%{transform:rotate(270deg)}100%{transform:rotate(360deg)}}.navbar-brand:hover svg{animation:mercedes-rotate 5s infinite linear;transform-origin:center}}.navbar{position:-webkit-sticky !important;position:sticky !important;top:0 !important;z-index:50 !important;width:100% !important;left:0 !important;right:0 !important;--navbar-blur:40px;--navbar-opacity:.15;background:rgba(255,255,255,var(--navbar-opacity,0.15)) !important;backdrop-filter:blur(var(--navbar-blur,40px)) saturate(200%) brightness(110%) contrast(105%) !important;-webkit-backdrop-filter:blur(var(--navbar-blur,40px)) saturate(200%) brightness(110%) contrast(105%) !important;box-shadow:0 8px 32px rgba(0,0,0,0.12),0 2px 8px rgba(0,0,0,0.08),inset 0 1px 0 rgba(255,255,255,0.3),0 0 0 1px rgba(255,255,255,0.15) !important;border-bottom:1px solid rgba(255,255,255,0.2) !important;transition:all .3s cubic-bezier(0.4,0,0.2,1) !important}.dark .navbar{--navbar-dark-opacity:.25;background:rgba(0,0,0,var(--navbar-dark-opacity,0.25)) !important;backdrop-filter:blur(calc(var(--navbar-blur, 40px) + 5px)) saturate(180%) brightness(120%) contrast(115%) !important;-webkit-backdrop-filter:blur(calc(var(--navbar-blur, 40px) + 5px)) saturate(180%) brightness(120%) contrast(115%) !important;box-shadow:0 8px 32px rgba(0,0,0,0.4),0 2px 8px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.15),0 0 0 1px rgba(255,255,255,0.08) !important;border-bottom:1px solid rgba(255,255,255,0.1) !important}.navbar.scrolled{--navbar-blur:50px;--navbar-opacity:.25;background:rgba(255,255,255,var(--navbar-opacity,0.25)) !important;backdrop-filter:blur(var(--navbar-blur,50px)) saturate(220%) brightness(115%) contrast(110%) !important;-webkit-backdrop-filter:blur(var(--navbar-blur,50px)) saturate(220%) brightness(115%) contrast(110%) !important;box-shadow:0 12px 40px rgba(0,0,0,0.15),0 4px 12px rgba(0,0,0,0.1),inset 0 1px 0 rgba(255,255,255,0.4),0 0 0 1px rgba(255,255,255,0.2) !important}.dark .navbar.scrolled{--navbar-dark-opacity:.35;background:rgba(0,0,0,var(--navbar-dark-opacity,0.35)) !important;backdrop-filter:blur(calc(var(--navbar-blur, 50px) + 5px)) saturate(200%) brightness(125%) contrast(120%) !important;-webkit-backdrop-filter:blur(calc(var(--navbar-blur, 50px) + 5px)) saturate(200%) brightness(125%) contrast(120%) !important;box-shadow:0 12px 40px rgba(0,0,0,0.5),0 4px 12px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.2),0 0 0 1px rgba(255,255,255,0.1) !important}.navbar-menu-new{@apply flex items-center justify-center space-x-0.5 md:space-x-1;max-width:100%;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;background:rgba(255,255,255,0.1);backdrop-filter:blur(25px) saturate(170%) brightness(108%);-webkit-backdrop-filter:blur(25px) saturate(170%) brightness(108%);border-radius:16px;padding:8px;margin:0 16px;border:1px solid rgba(255,255,255,0.15);box-shadow:0 6px 20px rgba(0,0,0,0.1),inset 0 1px 0 rgba(255,255,255,0.2),0 0 0 1px rgba(255,255,255,0.05);transition:all .3s cubic-bezier(0.4,0,0.2,1)}.dark .navbar-menu-new{background:rgba(0,0,0,0.2);backdrop-filter:blur(30px) saturate(150%) brightness(115%);-webkit-backdrop-filter:blur(30px) saturate(150%) brightness(115%);border:1px solid rgba(255,255,255,0.1);box-shadow:0 6px 20px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.1),0 0 0 1px rgba(255,255,255,0.03)}.navbar-menu-new::-webkit-scrollbar{display:none}.navbar-menu-new:hover{backdrop-filter:blur(35px) saturate(190%) brightness(112%);-webkit-backdrop-filter:blur(35px) saturate(190%) brightness(112%);box-shadow:0 8px 25px rgba(0,0,0,0.15),inset 0 1px 0 rgba(255,255,255,0.3),0 0 0 1px rgba(255,255,255,0.1);transform:translateY(-1px)}.dark .navbar-menu-new:hover{backdrop-filter:blur(40px) saturate(170%) brightness(120%);-webkit-backdrop-filter:blur(40px) saturate(170%) brightness(120%);box-shadow:0 8px 25px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.15),0 0 0 1px rgba(255,255,255,0.05)}.nav-item{@apply flex items-center space-x-1.5 px-3 py-2.5 rounded-xl text-sm font-medium transition-all duration-300;color:rgba(15,23,42,0.85);background:rgba(255,255,255,0.08);backdrop-filter:blur(15px) saturate(140%);-webkit-backdrop-filter:blur(15px) saturate(140%);border:1px solid rgba(255,255,255,0.1);box-shadow:0 4px 12px rgba(0,0,0,0.05),inset 0 1px 0 rgba(255,255,255,0.15);position:relative;overflow:hidden;animation:nav-item-entrance .6s ease-out}.nav-item::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.2),transparent);transition:left .5s}.nav-item:hover::before{left:100%}.nav-item::after{content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:conic-gradient(from 0 at 50% 50%,transparent 0,rgba(255,255,255,0.1) 30deg,transparent 60deg);opacity:0;transition:opacity .3s ease;pointer-events:none;animation:rotate 3s linear infinite}.nav-item:hover::after{opacity:1}.dark .nav-item{color:rgba(255,255,255,0.85);background:rgba(0,0,0,0.15);backdrop-filter:blur(20px) saturate(130%);-webkit-backdrop-filter:blur(20px) saturate(130%);border:1px solid rgba(255,255,255,0.08);box-shadow:0 4px 12px rgba(0,0,0,0.2),inset 0 1px 0 rgba(255,255,255,0.08)}.nav-item:hover{color:rgba(15,23,42,1);background:rgba(255,255,255,0.2);backdrop-filter:blur(25px) saturate(160%) brightness(110%);-webkit-backdrop-filter:blur(25px) saturate(160%) brightness(110%);border:1px solid rgba(255,255,255,0.25);box-shadow:0 8px 20px rgba(0,0,0,0.12),inset 0 1px 0 rgba(255,255,255,0.3),0 0 0 1px rgba(255,255,255,0.1);transform:translateY(-2px) scale(1.02)}.dark .nav-item:hover{color:rgba(255,255,255,1);background:rgba(0,0,0,0.25);backdrop-filter:blur(30px) saturate(150%) brightness(120%);-webkit-backdrop-filter:blur(30px) saturate(150%) brightness(120%);border:1px solid rgba(255,255,255,0.15);box-shadow:0 8px 20px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.15),0 0 0 1px rgba(255,255,255,0.05)}.nav-item.active{color:rgba(15,23,42,1);background:rgba(255,255,255,0.35);backdrop-filter:blur(35px) saturate(180%) brightness(115%);-webkit-backdrop-filter:blur(35px) saturate(180%) brightness(115%);border:1px solid rgba(255,255,255,0.4);box-shadow:0 12px 24px rgba(0,0,0,0.15),inset 0 1px 0 rgba(255,255,255,0.5),0 0 0 1px rgba(59,130,246,0.3);transform:translateY(-1px);animation:nav-item-active-glow 2s ease-in-out infinite alternate}.dark .nav-item.active{color:rgba(255,255,255,1);background:rgba(0,0,0,0.4);backdrop-filter:blur(40px) saturate(160%) brightness(125%);-webkit-backdrop-filter:blur(40px) saturate(160%) brightness(125%);border:1px solid rgba(255,255,255,0.2);box-shadow:0 12px 24px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.2),0 0 0 1px rgba(59,130,246,0.2)}@keyframes nav-item-entrance{0%{opacity:0;transform:translateY(10px) scale(0.95);backdrop-filter:blur(5px)}100%{opacity:1;transform:translateY(0) scale(1);backdrop-filter:blur(15px) saturate(140%)}}@keyframes nav-item-active-glow{0%{box-shadow:0 12px 24px rgba(0,0,0,0.15),inset 0 1px 0 rgba(255,255,255,0.5),0 0 0 1px rgba(59,130,246,0.3)}100%{box-shadow:0 16px 32px rgba(0,0,0,0.2),inset 0 1px 0 rgba(255,255,255,0.6),0 0 0 2px rgba(59,130,246,0.5)}}@keyframes rotate{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.navbar::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 20% 50%,rgba(255,255,255,0.1) 1px,transparent 1px),radial-gradient(circle at 80% 50%,rgba(255,255,255,0.1) 1px,transparent 1px),radial-gradient(circle at 40% 20%,rgba(255,255,255,0.05) 1px,transparent 1px),radial-gradient(circle at 60% 80%,rgba(255,255,255,0.05) 1px,transparent 1px);opacity:0;animation:glassmorphism-particles 8s ease-in-out infinite;pointer-events:none}.dark .navbar::before{background:radial-gradient(circle at 20% 50%,rgba(255,255,255,0.05) 1px,transparent 1px),radial-gradient(circle at 80% 50%,rgba(255,255,255,0.05) 1px,transparent 1px),radial-gradient(circle at 40% 20%,rgba(255,255,255,0.03) 1px,transparent 1px),radial-gradient(circle at 60% 80%,rgba(255,255,255,0.03) 1px,transparent 1px)}@keyframes glassmorphism-particles{0%,100%{opacity:0;transform:scale(1)}50%{opacity:1;transform:scale(1.1)}}.dark-mode-toggle-new{@apply relative p-2 rounded-full flex items-center justify-center transition-all duration-300 cursor-pointer;background:rgba(241,245,249,0.8);border:1px solid rgba(255,255,255,0.7);box-shadow:0 2px 8px rgba(0,0,0,0.05),0 1px 2px rgba(0,0,0,0.04);color:#334155;z-index:100}.dark-mode-toggle-new:hover{@apply transform -translate-y-0.5;background:rgba(241,245,249,0.9);box-shadow:0 8px 16px rgba(0,0,0,0.08),0 2px 4px rgba(0,0,0,0.06)}.dark-mode-toggle-new:active{@apply transform scale-95;transition:transform .1s}.dark .dark-mode-toggle-new{background:rgba(30,41,59,0.8);border:1px solid rgba(255,255,255,0.1);box-shadow:0 2px 8px rgba(0,0,0,0.2),0 1px 2px rgba(0,0,0,0.1);color:#e2e8f0}.dark .dark-mode-toggle-new:hover{background:rgba(30,41,59,0.9);box-shadow:0 8px 16px rgba(0,0,0,0.2),0 2px 4px rgba(0,0,0,0.15)}.dark-mode-toggle-new .sun-icon,.dark-mode-toggle-new .moon-icon{@apply absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 transition-all duration-300}.dark-mode-toggle-new .sun-icon:not(.hidden){animation:spin-in .5s cubic-bezier(0.25,1,0.5,1) forwards}.dark-mode-toggle-new .moon-icon:not(.hidden){animation:spin-in .5s cubic-bezier(0.25,1,0.5,1) forwards}@keyframes spin-in{0%{opacity:0;transform:translateY(10px) scale(0.7) rotate(20deg)}100%{opacity:1;transform:translateY(0) scale(1) rotate(0)}}.dark .sun-icon{display:none}.dark .moon-icon{display:block}.sun-icon{display:block}.moon-icon{display:none}.user-menu-button-new{@apply flex items-center space-x-1.5 rounded-lg p-1 transition-all duration-300;background:rgba(241,245,249,0.6);border:1px solid rgba(255,255,255,0.6);box-shadow:0 2px 8px rgba(0,0,0,0.04),0 1px 2px rgba(0,0,0,0.02)}.user-menu-button-new:hover{@apply transform -translate-y-0.5;background:rgba(241,245,249,0.8);box-shadow:0 8px 16px rgba(0,0,0,0.06),0 2px 4px rgba(0,0,0,0.04)}.dark .user-menu-button-new{background:rgba(30,41,59,0.6);border:1px solid rgba(255,255,255,0.08);box-shadow:0 2px 8px rgba(0,0,0,0.15),0 1px 2px rgba(0,0,0,0.1)}.dark .user-menu-button-new:hover{background:rgba(30,41,59,0.8);box-shadow:0 8px 16px rgba(0,0,0,0.15),0 2px 4px rgba(0,0,0,0.1)}.user-avatar-new{@apply h-7 w-7 rounded-full flex items-center justify-center text-white font-semibold text-xs shadow-md transition-all duration-300;background:linear-gradient(135deg,#000,#333);box-shadow:0 2px 4px rgba(0,0,0,0.2),0 1px 2px rgba(0,0,0,0.1)}.dark .user-avatar-new{background:linear-gradient(135deg,#f8fafc,#e2e8f0);color:#0f172a;box-shadow:0 2px 4px rgba(0,0,0,0.3),0 1px 2px rgba(0,0,0,0.2)}.login-button-new{@apply flex items-center px-3 py-1.5 rounded-lg text-xs font-medium shadow-sm transition-all duration-300;background:#000;color:#fff;border:1px solid rgba(255,255,255,0.1);box-shadow:0 2px 8px rgba(0,0,0,0.1),0 1px 2px rgba(0,0,0,0.08)}.login-button-new:hover{@apply transform -translate-y-0.5;background:#333;box-shadow:0 8px 16px rgba(0,0,0,0.15),0 3px 4px rgba(0,0,0,0.1)}.dark .login-button-new{background:#fff;color:#000;border:1px solid rgba(0,0,0,0.1);box-shadow:0 2px 8px rgba(0,0,0,0.2),0 1px 2px rgba(0,0,0,0.15)}.dark .login-button-new:hover{background:#f1f5f9;box-shadow:0 8px 16px rgba(0,0,0,0.25),0 3px 4px rgba(0,0,0,0.2)}.mobile-menu-new{@apply w-full overflow-hidden transition-all duration-300 z-40;background:rgba(255,255,255,0.8);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:0 4px 20px rgba(0,0,0,0.06);border-bottom:1px solid rgba(241,245,249,0.8);max-height:0;opacity:0}.mobile-menu-new.open{max-height:400px;opacity:1;border-bottom:1px solid rgba(241,245,249,0.8)}.dark .mobile-menu-new{background:rgba(15,23,42,0.8);box-shadow:0 4px 20px rgba(0,0,0,0.2);border-bottom:1px solid rgba(30,41,59,0.8)}.mobile-nav-item{@apply flex items-center space-x-2.5 px-3 py-2.5 rounded-lg text-sm text-slate-800 dark:text-slate-200 transition-all duration-300}.mobile-nav-item:hover{background:rgba(241,245,249,0.8)}.dark .mobile-nav-item:hover{background:rgba(30,41,59,0.6)}.mobile-nav-item.active{background:rgba(241,245,249,0.9);color:#000;font-weight:500}.dark .mobile-nav-item.active{background:rgba(30,41,59,0.8);color:#fff}.mb-stat-card{background:linear-gradient(135deg,rgba(240,249,255,0.6) 0,rgba(230,242,255,0.6) 100%);color:#0f172a;position:relative;overflow:hidden;border:0;border-radius:var(--card-radius);backdrop-filter:blur(20px) saturate(180%) brightness(110%);-webkit-backdrop-filter:blur(20px) saturate(180%) brightness(110%);box-shadow:0 25px 50px rgba(0,0,0,0.15),0 0 0 1px rgba(255,255,255,0.1);padding:1.5rem;margin:1rem;transition:transform .3s ease,box-shadow .3s ease}.dark .mb-stat-card{background:linear-gradient(135deg,rgba(0,0,0,0.7) 0,rgba(10,10,10,0.7) 100%);color:var(--text-primary,#f8fafc);box-shadow:0 25px 50px rgba(0,0,0,0.3),0 0 0 1px rgba(255,255,255,0.05)}.stats-card,.job-card{@apply bg-white/60 dark:bg-black/80 backdrop-blur-2xl border border-gray-200/70 dark:border-slate-700/20 rounded-xl shadow-2xl transition-all duration-300;backdrop-filter:blur(24px) saturate(200%) brightness(120%);-webkit-backdrop-filter:blur(24px) saturate(200%) brightness(120%);box-shadow:0 25px 50px rgba(0,0,0,0.2),0 0 0 1px rgba(255,255,255,0.1);border-radius:var(--card-radius)}footer{@apply transition-all duration-300;background:rgba(255,255,255,0.1);backdrop-filter:blur(30px) saturate(180%) brightness(120%);-webkit-backdrop-filter:blur(30px) saturate(180%) brightness(120%);border-top:1px solid rgba(255,255,255,0.2);box-shadow:0 -8px 32px rgba(0,0,0,0.1),0 -2px 8px rgba(0,0,0,0.05),inset 0 1px 0 rgba(255,255,255,0.2),0 0 0 1px rgba(255,255,255,0.05)}.dark footer{background:rgba(0,0,0,0.3);backdrop-filter:blur(30px) saturate(160%) brightness(110%);-webkit-backdrop-filter:blur(30px) saturate(160%) brightness(110%);border-top:1px solid rgba(255,255,255,0.1);box-shadow:0 -8px 32px rgba(0,0,0,0.3),0 -2px 8px rgba(0,0,0,0.2),inset 0 1px 0 rgba(255,255,255,0.1),0 0 0 1px rgba(255,255,255,0.03)}.dropdown-arrow{@apply transition-transform duration-300}.mercedes-star-bg{position:relative}.mercedes-star-bg::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background-image:url("data:image/svg+xml,%3Csvgxmlns='http://www.w3.org/2000/svg'viewBox='008080'width='80'height='80'opacity='0.05'fill='currentColor'%3E%3Cpathd='M58.6,4.5C53,1.6,46.7,0,40,0c-6.7,0-13,1.6-18.6,4.5v0C8.7,11.2,0,24.6,0,40c0,15.4,8.7,28.8,21.5,35.5C27,78.3,33.3,80,40,80c6.7,0,12.9-1.7,18.5-4.6C71.3,68.8,80,55.4,80,40C80,24.6,71.3,11.2,58.6,4.5zM4,40c0-13.1,7-24.5,17.5-30.9v0C26.6,6,32.5,4.2,39,4l-4.5,32.7L21.5,46.8v0L8.3,57.1C5.6,52,4,46.2,4,40zM58.6,70.8C53.1,74.1,46.8,76,40,76c-6.8,0-13.2-1.9-18.6-5.2c-4.9-2.9-8.9-6.9-11.9-11.7l11.9-4.9v0L40,46.6l18.6,7.5v0l12,4.9C67.6,63.9,63.4,67.9,58.6,70.8zM58.6,46.8L58.6,46.8l-12.9-10L41.1,4c6.3,0.2,12.3,2,17.4,5.1v0C69,15.4,76,26.9,76,40c0,6.2-1.5,12-4.3,17.1L58.6,46.8z'/%3E%3C/svg%3E");background-position:center;background-repeat:repeat;background-size:40px 40px;z-index:-1;opacity:.05}.dark .mercedes-star-bg::after{opacity:.02;filter:invert(1) brightness(0.4)}.glass-effect{backdrop-filter:blur(20px) saturate(180%) brightness(110%);-webkit-backdrop-filter:blur(20px) saturate(180%) brightness(110%);background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.2);box-shadow:0 8px 32px rgba(0,0,0,0.1),inset 0 1px 0 rgba(255,255,255,0.3)}.dark .glass-effect{background:rgba(0,0,0,0.3);border:1px solid rgba(255,255,255,0.1);box-shadow:0 8px 32px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.15)}.glass-hover{transition:all .3s cubic-bezier(0.4,0,0.2,1)}.glass-hover:hover{transform:translateY(-2px);backdrop-filter:blur(25px) saturate(200%) brightness(120%);-webkit-backdrop-filter:blur(25px) saturate(200%) brightness(120%);box-shadow:0 20px 40px rgba(0,0,0,0.15),0 8px 16px rgba(0,0,0,0.1),inset 0 1px 0 rgba(255,255,255,0.4)}.dark .glass-hover:hover{box-shadow:0 20px 40px rgba(0,0,0,0.4),0 8px 16px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.2)}.printer-card-new{@apply bg-gradient-to-br from-white/90 to-white/70 dark:from-slate-800/90 dark:to-slate-900/70 backdrop-blur-2xl rounded-xl border border-gray-200/70 dark:border-slate-700/30 p-5 shadow-2xl transition-all duration-300 hover:-translate-y-1 relative overflow-hidden;box-shadow:0 20px 40px rgba(0,0,0,0.08),0 10px 20px rgba(0,0,0,0.06),0 0 0 1px rgba(255,255,255,0.1);border-radius:var(--card-radius,1rem)}.dark .printer-card-new{box-shadow:0 20px 40px rgba(0,0,0,0.4),0 10px 20px rgba(0,0,0,0.3),0 0 0 1px rgba(255,255,255,0.05)}.printer-card-new.online{@apply bg-gradient-to-br from-green-50/90 to-emerald-50/80 dark:from-green-900/30 dark:to-emerald-900/20 border-green-200 dark:border-green-700/50;box-shadow:0 20px 40px rgba(0,122,85,0.08),0 10px 20px rgba(0,122,85,0.06),0 0 0 1px rgba(209,250,229,0.4)}.dark .printer-card-new.online{box-shadow:0 20px 40px rgba(0,0,0,0.3),0 10px 20px rgba(0,0,0,0.2),0 0 0 1px rgba(16,185,129,0.2)}.status-badge-new{@apply px-2.5 py-1 rounded-full text-xs font-medium inline-flex items-center space-x-1 shadow-sm;background:rgba(255,255,255,0.9);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 2px 5px rgba(0,0,0,0.05)}.dark .status-badge-new{background:rgba(30,41,59,0.7);box-shadow:0 2px 5px rgba(0,0,0,0.2)}.status-badge-new.online{@apply bg-green-100/90 text-green-800 dark:bg-green-900/60 dark:text-green-300}.status-badge-new.offline{@apply bg-red-100/90 text-red-800 dark:bg-red-900/60 dark:text-red-300}.filter-bar-new{@apply bg-white/80 dark:bg-slate-800/80 backdrop-blur-xl rounded-lg p-1.5 border border-gray-200/60 dark:border-slate-700/30 shadow-xl;box-shadow:0 10px 25px rgba(0,0,0,0.05),0 5px 10px rgba(0,0,0,0.03),0 0 0 1px rgba(255,255,255,0.2)}.dark .filter-bar-new{box-shadow:0 10px 25px rgba(0,0,0,0.2),0 5px 10px rgba(0,0,0,0.15),0 0 0 1px rgba(255,255,255,0.05)}.filter-btn-new{@apply px-3.5 py-2 text-sm rounded-md transition-all duration-300 font-medium}.filter-btn-new.active{@apply bg-black text-white dark:bg-white dark:text-slate-900 shadow-md;box-shadow:0 4px 10px rgba(0,0,0,0.1)}.dark .filter-btn-new.active{box-shadow:0 4px 10px rgba(0,0,0,0.3)}.action-btn-new{@apply flex items-center justify-center gap-2 px-4 py-2.5 rounded-lg font-medium text-sm transition-all duration-300 shadow-md hover:-translate-y-0.5;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.action-btn-new.primary{@apply bg-indigo-600 hover:bg-indigo-700 text-white dark:bg-indigo-600 dark:hover:bg-indigo-500;box-shadow:0 5px 15px rgba(79,70,229,0.2)}.dark .action-btn-new.primary{box-shadow:0 5px 15px rgba(79,70,229,0.3)}.action-btn-new.success{@apply bg-green-600 hover:bg-green-700 text-white dark:bg-green-600 dark:hover:bg-green-500;box-shadow:0 5px 15px rgba(16,185,129,0.2)}.dark .action-btn-new.success{box-shadow:0 5px 15px rgba(16,185,129,0.3)}.action-btn-new.danger{@apply bg-red-600 hover:bg-red-700 text-white dark:bg-red-600 dark:hover:bg-red-500;box-shadow:0 5px 15px rgba(239,68,68,0.2)}.dark .action-btn-new.danger{box-shadow:0 5px 15px rgba(239,68,68,0.3)}.printer-info-row{@apply flex items-center gap-2 text-xs sm:text-sm text-slate-700 dark:text-slate-300 mb-1.5}.printer-info-icon{@apply w-3.5 h-3.5 sm:w-4 sm:h-4 text-slate-500 dark:text-slate-400 flex-shrink-0}.online-indicator{@apply absolute top-2.5 right-2.5 w-3 h-3 bg-green-500 rounded-full shadow-lg;box-shadow:0 0 0 rgba(16,185,129,0.6);animation:pulse-ring 2s cubic-bezier(0.455,0.03,0.515,0.955) infinite}@keyframes pulse-ring{0%{box-shadow:0 0 0 0 rgba(16,185,129,0.6)}70%{box-shadow:0 0 0 6px rgba(16,185,129,0)}100%{box-shadow:0 0 0 0 rgba(16,185,129,0)}}.status-overview-new{@apply flex flex-wrap gap-3 text-xs sm:text-sm p-3 bg-white/60 dark:bg-slate-800/60 backdrop-blur-xl rounded-lg border border-gray-200/60 dark:border-slate-700/30 shadow-lg;box-shadow:0 10px 25px rgba(0,0,0,0.04),0 5px 10px rgba(0,0,0,0.02),0 0 0 1px rgba(255,255,255,0.1)}.dark .status-overview-new{box-shadow:0 10px 25px rgba(0,0,0,0.15),0 5px 10px rgba(0,0,0,0.1),0 0 0 1px rgba(255,255,255,0.03)}.status-dot{@apply w-2.5 h-2.5 rounded-full}.status-dot.online{@apply bg-green-500;animation:pulse-dot 2s cubic-bezier(0.455,0.03,0.515,0.955) infinite}.status-dot.offline{@apply bg-red-500}@keyframes pulse-dot{0%{transform:scale(0.95);opacity:1}50%{transform:scale(1.1);opacity:.8}100%{transform:scale(0.95);opacity:1}}.modal-new{@apply fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/40 backdrop-blur-sm}.modal-content-new{@apply bg-white/90 dark:bg-slate-800/90 backdrop-blur-2xl rounded-2xl p-6 w-full max-w-md shadow-2xl border border-gray-200/60 dark:border-slate-700/30 transform transition-all duration-300;box-shadow:0 25px 50px rgba(0,0,0,0.15),0 15px 30px rgba(0,0,0,0.1),0 20px 25px -5px rgba(0,0,0,0.5),0 10px 10px -5px rgba(0,0,0,0.3)}.user-dropdown-item{@apply flex items-center px-4 py-3 text-sm text-slate-700 dark:text-slate-200 hover:bg-slate-50 dark:hover:bg-slate-800 transition-all duration-200 cursor-pointer}.user-dropdown-item:first-child{@apply rounded-t-xl}.user-dropdown-item:last-child{@apply rounded-b-xl}.user-dropdown-item:hover{background:rgba(248,250,252,0.8);transform:translateX(2px)}.dark .user-dropdown-item:hover{background:rgba(30,41,59,0.8)}.user-dropdown-icon{@apply w-4 h-4 mr-3 text-slate-500 dark:text-slate-400 transition-colors duration-200}.user-dropdown-item:hover .user-dropdown-icon{@apply text-slate-700 dark:text-slate-200}.user-dropdown-divider{@apply border-t border-slate-200 dark:border-slate-700 my-1}.user-info-section{@apply px-4 py-3 border-b border-slate-200 dark:border-slate-700;background:rgba(248,250,252,0.5)}.dark .user-info-section{background:rgba(30,41,59,0.5)}.user-info-name{@apply text-sm font-semibold text-slate-900 dark:text-white}.user-info-role{@apply text-xs text-slate-500 dark:text-slate-400 mt-1}
\ No newline at end of file
diff --git a/backend/static/css/input.min.css.gz b/backend/static/css/input.min.css.gz
deleted file mode 100644
index 050b879f..00000000
Binary files a/backend/static/css/input.min.css.gz and /dev/null differ