added css on select box on indic page

Author: recursivezero

.vscode/dictionaries/project-words.txt

@@ -14,6 +14,7 @@ Bhadrapada
 bincount
 BODYPART
 Chaitra
+checkmark
 clsx
 cmdk
 controlslist

src/assets/styles/indic.css

@@ -68,6 +68,7 @@
     margin-bottom: 0.8rem;
     font-size: 1.1rem;
     background-image: linear-gradient(135deg, #69ff97 10%, #00e4ff 100%);
+    background-clip: border-box;
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     text-transform: uppercase;
@@ -96,7 +97,7 @@
     background: linear-gradient(145deg, #1d4ed8, #123085);
     color: light-dark (black, white);
     cursor: pointer;
-    appearance: none;
+    appearance: base-select;
     transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
     box-shadow:
       0 4px 6px -1px rgba(0, 0, 0, 0.1),
@@ -106,6 +107,15 @@
     background-position: right 1rem center;
     background-size: 1.5em;
 
+    &::picker-icon {
+      color: #806df9;
+      transition: 0.4s rotate;
+    }
+
+    &:open::picker-icon {
+      rotate: 180deg;
+    }
+
     &:hover {
       border-color: #7dd3fc;
       transform: translateY(-1px);
@@ -126,17 +136,33 @@
       text-transform: capitalize;
       letter-spacing: 2px;
       background: light-dark(white, #1e293b);
-      color: light-dark (black, white);
+      color: light-dark(black, white);
       border-bottom: 1px solid rgba(125, 211, 252, 0.1);
 
       &:checked {
         background: rgba(29, 78, 216, 0.5);
         font-weight: 600;
       }
+
+      &:nth-of-type(odd) {
+        background-color: #b7c4dc80;
+      }
+
+      &::checkmark {
+        order: 1;
+        margin-left: auto;
+        content: '✔';
+        color: #806df9;
+      }
     }
   }
 }
 
+::picker(select) {
+  appearance: base-select;
+  border: none;
+}
+
 .toggle-button {
   background: light-dark (var(--navy-blue), var(--text-primary));
   border: 1px solid rgba(125, 211, 252, 0.3);
@@ -496,4 +522,4 @@
   100% {
     --gradient-angle: 360deg;
   }
-}
+}