some ui changes and docs

resources/views/dashboard.blade.php

@@ -33,7 +33,7 @@
     }
 
     .stat-card.primary {
-        --card-accent: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        --card-accent: linear-gradient(135deg, #06b6d4 0%, #0891b2 100%);
     }
 
     .stat-card.success {
@@ -82,8 +82,8 @@
     }
 
     .stat-icon.primary {
-        --icon-gradient: linear-gradient(135deg, #667eea, #764ba2);
-        color: #667eea;
+        --icon-gradient: linear-gradient(135deg, #06b6d4, #0891b2);
+        color: #06b6d4;
     }
 
     .stat-icon.success {
@@ -168,7 +168,7 @@
     }
 
     .chart-card .card-title i {
-        color: var(--indigo-600);
+        color: #0ea5e9;
     }
 
     /* Modern Table */
@@ -227,7 +227,7 @@
         width: 48px;
         height: 48px;
         border-radius: 12px;
-        background: linear-gradient(135deg, #667eea, #764ba2);
+        background: linear-gradient(135deg, #06b6d4, #0891b2);
         display: flex;
         align-items: center;
         justify-content: center;
@@ -332,13 +332,13 @@
 
     .btn-action:hover {
         transform: translateY(-2px);
-        box-shadow: 0 8px 20px rgba(79, 70, 229, 0.25);
+        box-shadow: 0 8px 20px rgba(14, 165, 233, 0.25);
     }
 
     .btn-action.btn-outline-primary:hover {
-        background: var(--indigo-600);
+        background: #0ea5e9;
         color: white;
-        border-color: var(--indigo-600);
+        border-color: #0ea5e9;
     }
 
     /* Empty State */
@@ -351,7 +351,7 @@
         font-size: 5rem;
         opacity: 0.15;
         margin-bottom: 2rem;
-        background: linear-gradient(135deg, #667eea, #764ba2);
+        background: linear-gradient(135deg, #06b6d4, #0891b2);
         -webkit-background-clip: text;
         -webkit-text-fill-color: transparent;
         background-clip: text;
@@ -701,11 +701,11 @@ document.addEventListener('DOMContentLoaded', function() {
             labels: chartData.labels,
             datasets: chartData.datasets.map((dataset, index) => {
                 const colors = [
-                    { border: '#667eea', bg: 'rgba(102, 126, 234, 0.1)' },
+                    { border: '#06b6d4', bg: 'rgba(6, 182, 212, 0.1)' },
                     { border: '#10b981', bg: 'rgba(16, 185, 129, 0.1)' },
                     { border: '#f59e0b', bg: 'rgba(245, 158, 11, 0.1)' },
                     { border: '#ef4444', bg: 'rgba(239, 68, 68, 0.1)' },
-                    { border: '#3b82f6', bg: 'rgba(59, 130, 246, 0.1)' },
+                    { border: '#0ea5e9', bg: 'rgba(14, 165, 233, 0.1)' },
                 ];
                 const color = colors[index % colors.length];