diff --git a/src/style.css b/src/style.css
index 17b993b..a2948c0 100644
--- a/src/style.css
+++ b/src/style.css
@@ -67,7 +67,7 @@ ul {
     /* IE9+, News */
 }
 
-@theme inline {
+/* @theme inline {
     --radius-sm: calc(var(--radius) - 4px);
     --radius-md: calc(var(--radius) - 2px);
     --radius-lg: var(--radius);
@@ -103,9 +103,9 @@ ul {
     --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
     --color-sidebar-border: var(--sidebar-border);
     --color-sidebar-ring: var(--sidebar-ring);
-}
+} */
 
-:root {
+/* :root {
     --radius: 0.625rem;
     --background: oklch(1 0 0);
     --foreground: oklch(0.145 0 0);
@@ -173,8 +173,9 @@ ul {
     --sidebar-border: oklch(1 0 0 / 10%);
     --sidebar-ring: oklch(0.556 0 0);
 }
+    */
 
-@layer base {
+/* @layer base {
     * {
         @apply border-border outline-ring/50;
     }
@@ -182,4 +183,4 @@ ul {
     body {
         @apply bg-background text-foreground;
     }
-}
\ No newline at end of file
+} */
\ No newline at end of file
diff --git a/src/views/Config/Global/FaceConfig/components/SelectFont.vue b/src/views/Config/Global/FaceConfig/components/SelectFont.vue
index 35cdc30..f4fc132 100644
--- a/src/views/Config/Global/FaceConfig/components/SelectFont.vue
+++ b/src/views/Config/Global/FaceConfig/components/SelectFont.vue
@@ -57,13 +57,13 @@ const disabledStyle = computed(() => {
 
 <template>
   <div class="w-full h-full flex justify-center items-center max-w-xs" :style="disabledStyle">
-    <Popover v-model:open="open">
+    <Popover v-model:open="open" class="w-full">
       <PopoverTrigger as-child :disabled="browserDisabled || disabled">
         <Button
           variant="outline"
           role="combobox"
           :aria-expanded="open"
-          class="w-full justify-between truncate bg-transparent hover:bg-transparent hover:text-inherit"
+          class="w-full justify-between truncate hover:bg-transparent hover:text-inherit"
           @click="getFonts"
         >
           <span class="w-7/8 text-left truncate" :style="{ fontFamily: `${selectedFont}` }">
@@ -72,7 +72,7 @@ const disabledStyle = computed(() => {
           <ChevronsUpDownIcon class="opacity-50" />
         </Button>
       </PopoverTrigger>
-      <PopoverContent class="w-full p-0">
+      <PopoverContent class="w-full p-0 bg-base-100">
         <Command>
           <CommandInput class="h-9" placeholder="Search framework..." />
           <CommandList @scroll="handleScroll">
@@ -82,7 +82,7 @@ const disabledStyle = computed(() => {
                 v-for="[key, value] in fonts"
                 :key="key"
                 :value="key"
-                class="w-full hover:bg-gray-200/50"
+                class="w-full hover:bg-gray-200/60"
                 @select="selectFont(key)"
               >
                 <Popover :open="debouncedActiveKey === key" class="w-full">
@@ -96,7 +96,7 @@ const disabledStyle = computed(() => {
                       />
                     </div>
                   </PopoverTrigger>
-                  <PopoverContent class="p-2" side="right" @mouseleave="handelActiveKey('')" @mouseenter="handelActiveKey(key)">
+                  <PopoverContent class="p-2 bg-base-100" side="right" @mouseleave="handelActiveKey('')" @mouseenter="handelActiveKey(key)">
                     <PopoverArrow />
                     <Command>
                       <CommandGroup>
@@ -104,7 +104,7 @@ const disabledStyle = computed(() => {
                           v-for="child in value"
                           :key="child.value"
                           :value="child.value"
-                          class="w-full hover:bg-gray-200/50"
+                          class="w-full hover:bg-gray-200/60"
                           :style="{ fontFamily: `${key}` }"
                           @select="selectFont(child.value)"
                         >