style changes

src/app/components/header/header.component.scss

@@ -78,12 +78,12 @@
 
     &:hover {
       color: var(--primary-hover);
-      background: rgba(85, 104, 211, 0.05);
+      background: rgba(73, 118, 113, 0.05);
     }
 
     &.active {
       color: var(--primary-hover);
-      background: rgba(85, 104, 211, 0.1);
+      background: rgba(73, 118, 113, 0.1);
       font-weight: 600;
     }
   }
@@ -183,11 +183,11 @@
     }
 
     &:hover {
-      background: rgba(85, 104, 211, 0.05);
+      background: rgba(73, 118, 113, 0.05);
     }
 
     &.active {
-      background: rgba(85, 104, 211, 0.1);
+      background: rgba(73, 118, 113, 0.1);
     }
   }
 
@@ -458,6 +458,7 @@
   top: 0;
   z-index: 1000;
   backdrop-filter: blur(10px);
+  font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
 }
 
 .dexar-header-container {
@@ -585,14 +586,14 @@
 .dexar-actions {
   display: flex;
   align-items: center;
-  gap: 4px;
+  gap: 8px;
   flex-shrink: 0;
 }
 
 .dexar-cart-btn {
   position: relative;
-  width: 32px;
-  height: 24px;
+  width: 36px;
+  height: 28px;
   display: flex;
   align-items: center;
   justify-content: center;
@@ -601,8 +602,8 @@
   transition: opacity 0.3s ease;
   
   svg {
-    width: 32px;
-    height: 24px;
+    width: 36px;
+    height: 28px;
   }
   
   &:hover {
@@ -616,18 +617,21 @@
 
 .dexar-cart-badge {
   position: absolute;
-  top: -6px;
-  right: -6px;
-  background: linear-gradient(135deg, #ff4757 0%, #ff6b81 100%);
-  color: white;
+  top: -8px;
+  right: -10px;
+  background: #497671;
+  color: #ffffff;
+  font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
   font-weight: 700;
-  font-size: 0.75rem;
-  padding: 2px 6px;
-  border-radius: 10px;
-  min-width: 18px;
-  text-align: center;
-  box-shadow: 0 2px 6px rgba(255, 71, 87, 0.4);
-  border: 2px solid white;
+  font-size: 10px;
+  line-height: 1;
+  width: 18px;
+  height: 18px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 50%;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
 }
 
 .dexar-lang-selector {
@@ -667,6 +671,23 @@
   }
 }
 
+// Mobile Search Icon
+.dexar-search-mobile {
+  display: none;
+  align-items: center;
+  justify-content: center;
+  background: none;
+  border: none;
+  cursor: pointer;
+  padding: 6px;
+  margin-left: auto;
+  transition: opacity 0.2s ease;
+  
+  &:hover {
+    opacity: 0.7;
+  }
+}
+
 // Responsive Design
 @media (max-width: 1200px) {
   .dexar-header-container {
@@ -777,22 +798,11 @@
   }
   
   .dexar-search-wrapper {
-    flex: 1;
-    max-width: none;
-    margin-left: 0;
+    display: none;
   }
   
-  .dexar-search-box {
-    height: 40px;
-  }
-  
-  .dexar-search-icon {
-    width: 20px;
-    height: 20px;
-  }
-  
-  .dexar-search-input {
-    font-size: 16px;
+  .dexar-search-mobile {
+    display: flex;
   }
   
   .dexar-menu-toggle {