Migrate from old project

app/(root)/globals.css

@@ -0,0 +1,38 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@layer utilities {
+    .nav__link {
+        @apply relative text-base font-medium w-fit block after:block after:content-[''] after:absolute after:h-[3px] after:bg-pink-600 after:w-full after:scale-x-0 after:hover:scale-x-100 after:transition after:duration-300 after:origin-right;
+    }
+}
+
+/* Global theme transition */
+.transition-theme {
+    transition: background-color 0.7s ease, color 0.7s ease;
+}
+
+/* Light mode */
+/* Light mode */
+[data-theme="light"] {
+    --primary-bg: #FAFAFA;       /* Soft off-white background */
+    --secondary-bg: #F5F5F7;      /* Gentle off-white for subtle separation */
+    --primary-text: #2E2E2E;      /* Dark grey text for clear readability */
+    --secondary-text: #595959;    /* Medium grey for less prominent text */
+    --nav-bg: #F8F8F8;            /* Light grey navigation background */
+    --footer-bg: #E0E0E0;         /* Slightly darker grey for footer contrast */
+}
+
+/* Dark mode */
+[data-theme="dark"] {
+    --primary-bg: #2C2C2C;       /* Modern dark grey background */
+    --secondary-bg: #333333;      /* A touch lighter grey for section differentiation */
+    --primary-text: #E0E0E0;      /* Light grey text for optimal readability */
+    --secondary-text: #B0B0B0;    /* Medium grey for secondary text elements */
+    --nav-bg: #272727;           /* Subtle variation for the navigation area */
+    --footer-bg: #242424;        /* Deep grey footer to add visual depth */
+}
+
+
+