fix(dashboard): appointment detail fields + sidebar hydration

- Appointment detail (DetailLg/DetailSm) read the real response shape:
  date/time from slot_start, specialty from doctor.specialties[0].name,
  phone from address.telephone.
- Sidebar Head reads userInfo (cookie) after mount to avoid an SSR/client
  hydration mismatch on the user's name.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

components/layout/sidebar/Head.js

@@ -1,9 +1,15 @@
-import { getParsedUserInfo } from "@/helper";
-import Image from "next/image";
-import { imageUrl } from "@/helper";
+"use client";
 
-function Head({ user }) {
-  const userInfo = getParsedUserInfo();
+import { useEffect, useState } from "react";
+import { getParsedUserInfo, imageUrl } from "@/helper";
+import Image from "next/image";
+
+function Head() {
+  const [userInfo, setUserInfo] = useState(null);
+
+  useEffect(() => {
+    setUserInfo(getParsedUserInfo());
+  }, []);
 
   return (
     <div className="w-full flex flex-row md:flex-col items-center justify-center md:justify-start gap-[12px] md:gap-[4px]">