Various style updates

src/components/ResumeSettingsModal.tsx

@@ -1,6 +1,6 @@
 import { useState } from "preact/hooks";
 import { useSignal } from "@preact/signals";
-import { Settings } from "lucide-preact";
+import { Settings, X } from "lucide-preact";
 
 interface ResumeSettingsModalProps {
   className?: string;
@@ -162,7 +162,7 @@ export default function ResumeSettingsModal({
       {/* Floating Settings Button */}
       <button
         onClick={openModal}
-        class={`fixed top-4 right-4 z-20 btn btn-square btn-secondary hover:bg-primary opacity-100 translate-y-0 min-h-[44px] min-w-[44px] ${className}`}
+        class={`fixed top-4 right-4 z-20 bg-secondary hover:bg-primary btn btn-circle ${className}`}
         aria-label="Resume Settings"
       >
         <Settings class="text-lg" />
@@ -175,9 +175,9 @@ export default function ResumeSettingsModal({
             <h3 class="font-bold text-lg">Resume Generator</h3>
             <button
               onClick={closeModal}
-              class="btn btn-sm btn-circle btn-ghost"
+              class="btn btn-circle bg-secondary hover:bg-primary"
             >
-              ✕
+              <X className="text-lg" />
             </button>
           </div>
 
@@ -189,10 +189,10 @@ export default function ResumeSettingsModal({
 
             {/* Action Buttons */}
             <div class="flex flex-wrap gap-2 mb-6">
-              <button onClick={downloadTemplate} class="btn btn-primary btn-sm">
+              <button onClick={downloadTemplate} class="btn bg-primary btn-sm">
                 Download Template
               </button>
-              <button onClick={loadTemplate} class="btn btn-secondary btn-sm">
+              <button onClick={loadTemplate} class="btn bg-secondary btn-sm">
                 Load Template in Editor
               </button>
             </div>