feat: update to v2.0.3, premium redesign and fix navigation bugs

dental-server/public/admin-clinics.css

@@ -1,22 +1,23 @@
 :root {
-  --primary: #4361ee;
-  --primary-hover: #3a56d4;
-  --primary-light: rgba(67, 97, 238, 0.1);
-  --success: #2ec4b6;
-  --success-light: rgba(46, 196, 182, 0.15);
-  --danger: #ef476f;
-  --danger-light: rgba(239, 71, 111, 0.15);
-  --warning: #ff9f1c;
-  --dark: #0b132b;
-  --gray-900: #1c2541;
-  --gray-800: #2b3a67;
+  --primary: #4f46e5;
+  --primary-hover: #4338ca;
+  --primary-light: rgba(79, 70, 229, 0.1);
+  --success: #10b981;
+  --success-light: rgba(16, 185, 129, 0.15);
+  --danger: #ef4444;
+  --danger-light: rgba(239, 68, 68, 0.15);
+  --warning: #f59e0b;
+  
+  --dark: #0f172a;
+  --gray-900: #f8fafc;
+  --gray-800: #e2e8f0;
   --gray-200: #e2e8f0;
-  --light: #f8f9fa;
+  --light: #1e293b;
   --white: #ffffff;
   
-  --glass-bg: rgba(255, 255, 255, 0.05);
-  --glass-border: rgba(255, 255, 255, 0.1);
-  --glass-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.3);
+  --glass-bg: rgba(255, 255, 255, 0.7);
+  --glass-border: rgba(255, 255, 255, 0.5);
+  --glass-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
   
   --font-heading: 'Outfit', sans-serif;
   --font-body: 'Inter', sans-serif;
@@ -30,7 +31,7 @@
 
 body {
   font-family: var(--font-body);
-  background: linear-gradient(135deg, var(--dark) 0%, var(--gray-900) 100%);
+  background: linear-gradient(135deg, #f8fafc 0%, #eff6ff 100%);
   color: var(--light);
   min-height: 100vh;
   display: flex;
@@ -66,12 +67,15 @@ body {
 /* Sidebar */
 .sidebar {
   width: 260px;
-  background: rgba(11, 19, 43, 0.8);
+  background: var(--glass-bg);
+  backdrop-filter: blur(12px);
+  -webkit-backdrop-filter: blur(12px);
   border-right: 1px solid var(--glass-border);
   display: flex;
   flex-direction: column;
   padding: 24px 0;
   z-index: 10;
+  box-shadow: var(--glass-shadow);
 }
 
 .sidebar-header {
@@ -111,7 +115,8 @@ body {
 .nav-item {
   padding: 12px 16px;
   border-radius: 10px;
-  color: #a0aec0;
+  color: var(--dark);
+  opacity: 0.7;
   text-decoration: none;
   font-weight: 500;
   display: flex;
@@ -127,15 +132,19 @@ body {
 }
 
 .nav-item:hover {
-  background: var(--glass-bg);
-  color: var(--white);
+  background: var(--white);
+  color: var(--primary);
+  opacity: 1;
   transform: translateX(4px);
+  box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
 }
 
 .nav-item.active {
-  background: var(--primary-light);
-  color: #4cc9f0;
-  border-left: 3px solid #4cc9f0;
+  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-hover) 100%);
+  color: var(--white);
+  opacity: 1;
+  box-shadow: var(--glass-shadow);
+  font-weight: 600;
 }
 
 .sidebar-footer {
@@ -216,9 +225,9 @@ body {
 }
 
 .secondary-btn {
-  background: transparent;
-  color: var(--white);
-  border: 1px solid var(--glass-border);
+  background: var(--white);
+  color: var(--dark);
+  border: 1px solid var(--gray-800);
   padding: 12px 24px;
   border-radius: 10px;
   font-family: var(--font-body);
@@ -228,7 +237,7 @@ body {
 }
 
 .secondary-btn:hover {
-  background: var(--glass-bg);
+  background: var(--gray-900);
 }
 
 .icon-btn {