Fix dropdown visibility and add missing translations

src/app/globals.css

@@ -150,23 +150,6 @@ body {
     background-color: var(--color-dropdown);
     border: 1px solid color-mix(in srgb, var(--color-text-muted) 14%, transparent);
     box-shadow: 0 8px 32px color-mix(in srgb, rgb(0, 0, 0) 20%, transparent);
-    transform-origin: top right;
-    transition: opacity 0.2s cubic-bezier(0.16, 1, 0.3, 1),
-                transform 0.2s cubic-bezier(0.16, 1, 0.3, 1);
-    opacity: 0;
-    transform: translateY(-8px) scale(0.95);
-    pointer-events: none;
-  }
-  details[open] > .dropdown-menu {
-    opacity: 1;
-    transform: translateY(0) scale(1);
-    pointer-events: auto;
-  }
-  @starting-style {
-    details[open] > .dropdown-menu {
-      opacity: 0;
-      transform: translateY(-8px) scale(0.95);
-    }
   }
 }
 

src/app/page.tsx

@@ -245,7 +245,7 @@ export default async function HomePage() {
                     boxShadow: "0 4px 24px color-mix(in srgb, var(--color-primary) 35%, transparent), inset 0 1px 0 rgba(255,255,255,0.2)",
                   }}
                 >
-                  Enter {hotelName}
+                  {t("enterHotel", { hotelName })}
                   <svg className="inline-block ml-2 w-4 h-4 transition-transform duration-300 group-hover:translate-x-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2.5} d="M9 5l7 7-7 7" /></svg>
                 </button>
               </Link>
@@ -265,12 +265,12 @@ export default async function HomePage() {
             className="relative flex items-center justify-center rounded p-2 text-sm font-semibold"
             style={{ backgroundColor: "#e9b124" }}
           >
-            <span className="relative text-white">Online Friends</span>
+            <span className="relative text-white">{t("onlineFriends")}</span>
           </div>
           <div className="flex items-center gap-3 px-3">
             {onlineFriends.length === 0 ? (
               <p className="mb-3 block w-full text-center text-xs font-medium text-gray-500 dark:text-white md:mb-0 md:text-left">
-                No friends online
+                {t("noFriendsOnline")}
               </p>
             ) : (
               onlineFriends.map((f) => (
@@ -310,7 +310,7 @@ export default async function HomePage() {
                   "linear-gradient(140deg, #1a3a5c 0%, #1e4a6e 20%, #2a5a80 40%, #3a6a90 60%, #4a7aa0 75%, #3a6a90 90%, #2a5a80 100%)",
               }}
             >
-              <h2 className="text-lg font-bold text-white">Latest Article</h2>
+              <h2 className="text-lg font-bold text-white">{t("latestArticle")}</h2>
             </div>
             <Link
               href={`/news/${latestArticle.slug}`}