updated button interactions

package.json

@@ -1,5 +1,5 @@
 {
-    "name": "witelflix",
+    "name": "cinematales",
     "private": true,
     "scripts": {
         "dev": "next dev",

src/components/buttons/PrimaryButton.tsx

@@ -14,7 +14,7 @@ export default function PrimaryButton({ children, loading, className, onClick }:
         <button
             onClick={onClick}
             className={cn(
-                "bg-primary grid w-full place-items-center overflow-hidden rounded-xl px-4 py-2 text-white",
+                "bg-primary grid w-full place-items-center overflow-hidden rounded-xl px-4 py-2 text-white hover:scale-102 active:scale-98",
                 className
             )}
         >

src/styles/globals.css

@@ -24,19 +24,59 @@ body {
     margin: 0;
 }
 
-@theme {
-    --color-background: #cbd5e1;
-    --color-text: #273343;
+button {
+    cursor: pointer;
+}
 
-    /* constants */
-    --color-primary: #114455;
-    --color-warning: #eedd55;
-    --color-information: #0ea5e9;
-    --color-error: #ef4444;
-    --color-success: #22c55e;
+@theme {
+    /* Core */
+    --color-background: #f4f6f8;
+    --color-text: #1e242e;
+
+    /* Brand */
+    --color-primary: #2a7fff;
+    --color-secondary: #64748b;
+    --color-accent: #ff6b3d;
+
+    /* Feedback */
+    --color-warning: #f5c04f;
+    --color-information: #3abff8;
+    --color-error: #ef5350;
+    --color-success: #4ade80;
+
+    /* Surfaces */
+    --color-surface: #ffffff;
+    --color-surface-alt: #e9eef2;
+    --color-border: #d4d9df;
+    --color-muted-text: #6c7480;
+
+    /* Overlays */
+    --color-overlay-light: rgba(0, 0, 0, 0.05);
+    --color-overlay-medium: rgba(0, 0, 0, 0.15);
+    --color-overlay-strong: rgba(0, 0, 0, 0.35);
+
+    /* Gradients */
+    --gradient-primary: linear-gradient(135deg, #2a7fff, #1a5fd1);
+    --gradient-accent: linear-gradient(135deg, #ff6b3d, #ff784d);
 }
 
 [data-theme="dark"] {
-    --color-background: #273343;
-    --color-text: #cbd5e1;
+    --color-background: #1a1f27;
+    --color-text: #e5e9f0;
+
+    --color-primary: #63a6ff;
+    --color-secondary: #94a3b8;
+    --color-accent: #ff8a5c;
+
+    --color-surface: #232833;
+    --color-surface-alt: #2c323e;
+    --color-border: #3a404c;
+    --color-muted-text: #a6aebc;
+
+    --color-overlay-light: rgba(255, 255, 255, 0.05);
+    --color-overlay-medium: rgba(255, 255, 255, 0.12);
+    --color-overlay-strong: rgba(255, 255, 255, 0.25);
+
+    --gradient-primary: linear-gradient(135deg, #63a6ff, #3d7dce);
+    --gradient-accent: linear-gradient(135deg, #ff8a5c, #ff9c75);
 }