diff --git a/src/components/LanguageSwitcher.astro b/src/components/LanguageSwitcher.astro
index ae14626..bb23d2a 100644
--- a/src/components/LanguageSwitcher.astro
+++ b/src/components/LanguageSwitcher.astro
@@ -34,7 +34,7 @@ const {
 
 const containerId = `ls-${Math.random().toString(36).slice(2)}`;
 const icon = "wr:size-4";
-const item = "wr:flex wr:items-center wr:gap-3 wr:w-full wr:px-3 wr:py-2.5 wr:rounded-lg wr:text-sm wr:hover:bg-muted/70 wr:transition wr:duration-150";
+const item =   "wr:flex wr:w-full wr:items-center wr:gap-x-3.5 wr:rounded-lg wr:px-3 wr:py-2 wr:text-sm wr:hover:bg-gray-100 wr:dark:hover:bg-neutral-900 wr:focus:bg-gray-100 focus:outline-hidden dark:hover:bg-neutral-700 dark:hover:text-neutral-300 dark:focus:bg-neutral-700"
 const checkBase = "wr:size-4 wr:opacity-0 wr:scale-90 wr:transition";
 ---
 
diff --git a/src/components/ThemeSwitcher.astro b/src/components/ThemeSwitcher.astro
index 8a57ac0..a09d0a6 100644
--- a/src/components/ThemeSwitcher.astro
+++ b/src/components/ThemeSwitcher.astro
@@ -30,7 +30,8 @@ const {
 const containerId = `ts-${Math.random().toString(36).slice(2)}`;
 const icon = "wr:size-4";
 const item =
-  "wr:flex wr:items-center wr:gap-3 wr:w-full wr:px-3 wr:py-2.5 wr:rounded-lg wr:text-sm wr:hover:bg-muted/70 wr:transition wr:duration-150";
+  "wr:flex wr:w-full wr:items-center wr:gap-x-3.5 wr:rounded-lg wr:px-3 wr:py-2 wr:text-sm wr:hover:bg-gray-100 wr:dark:hover:bg-neutral-900 wr:focus:bg-gray-100 focus:outline-hidden dark:hover:bg-neutral-700 dark:hover:text-neutral-300 dark:focus:bg-neutral-700"
+
 const checkBase = "wr:size-4 wr:opacity-0 wr:scale-90 wr:transition";
 ---