Improved language picker

src/styles/components/LanguagePicker.module.scss

@@ -1,27 +1,45 @@
 @use '../variables' as *;
 
 .picker {
+  display: flex;
+  gap: 0.25rem;
   background: transparent;
   border: 1px solid var(--text-secondary);
   border-radius: 4px;
-  padding: 0.4rem 0.8rem;
-  color: var(--text-primary);
+  padding: 0.2rem;
+
+  @media (max-width: 768px) {
+    padding: 0.15rem;
+    gap: 0.15rem;
+  }
+}
+
+.flag {
+  background: transparent;
+  border: none;
   cursor: pointer;
-  font-size: 0.85rem;
-  font-weight: 500;
+  padding: 0.2rem;
+  border-radius: 2px;
   transition: all 0.2s ease;
 
+  &[aria-pressed='false'] {
+    opacity: 0.6;
+  }
+
   &:hover {
-    border-color: var(--accent);
-    color: var(--accent);
+    opacity: 1;
   }
 
   @media (max-width: 768px) {
-    padding: 0.35rem 0.6rem;
-    font-size: 0.8rem;
+    padding: 0.15rem;
   }
 }
 
-.label {
+.flagIcon {
+  font-size: 1.1rem;
   display: inline-block;
+
+  @media (max-width: 768px) {
+    font-size: 1rem;
+  }
 }