remocao das barras de persquisas

components/doctor-layout.tsx

@@ -11,8 +11,28 @@ import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Badge } from "@/components/ui/badge";
 import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
-import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from "@/components/ui/dialog";
-import { Search, Bell, Calendar, Clock, User, LogOut, Menu, X, Home, FileText, ChevronLeft, ChevronRight } from "lucide-react";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import {
+  Search,
+  Bell,
+  Calendar,
+  Clock,
+  User,
+  LogOut,
+  Menu,
+  X,
+  Home,
+  FileText,
+  ChevronLeft,
+  ChevronRight,
+} from "lucide-react";
 
 interface DoctorData {
   id: string;
@@ -152,7 +172,11 @@ export default function DoctorLayout({ children }: PatientLayoutProps) {
   return (
     // O restante do seu código JSX permanece exatamente o mesmo
     <div className="min-h-screen bg-background flex">
-            <div className={`bg-card border-r border transition-all duration-300 ${sidebarCollapsed ? "w-16" : "w-64"} fixed left-0 top-0 h-screen flex flex-col z-50`}>
+      <div
+        className={`bg-card border-r border transition-all duration-300 ${
+          sidebarCollapsed ? "w-16" : "w-64"
+        } fixed left-0 top-0 h-screen flex flex-col z-50`}
+      >
         <div className="p-4 border-b border">
           <div className="flex items-center justify-between">
             {!sidebarCollapsed && (
@@ -163,21 +187,40 @@ export default function DoctorLayout({ children }: PatientLayoutProps) {
                 <span className="font-semibold text-gray-900">MediConnect</span>
               </div>
             )}
-                        <Button variant="ghost" size="sm" onClick={() => setSidebarCollapsed(!sidebarCollapsed)} className="p-1">
-                            {sidebarCollapsed ? <ChevronRight className="w-4 h-4" /> : <ChevronLeft className="w-4 h-4" />}
+            <Button
+              variant="ghost"
+              size="sm"
+              onClick={() => setSidebarCollapsed(!sidebarCollapsed)}
+              className="p-1"
+            >
+              {sidebarCollapsed ? (
+                <ChevronRight className="w-4 h-4" />
+              ) : (
+                <ChevronLeft className="w-4 h-4" />
+              )}
             </Button>
           </div>
         </div>
         <nav className="flex-1 p-2 overflow-y-auto">
           {menuItems.map((item) => {
             const Icon = item.icon;
-                        const isActive = pathname === item.href || (item.href !== "/" && pathname.startsWith(item.href));
+            const isActive =
+              pathname === item.href ||
+              (item.href !== "/" && pathname.startsWith(item.href));
 
             return (
               <Link key={item.href} href={item.href}>
-                                <div className={`flex items-center gap-3 px-3 py-2 rounded-lg mb-1 transition-colors ${isActive ? "bg-blue-50 text-blue-600 border-r-2 border-blue-600" : "text-gray-600 hover:bg-gray-50"}`}>
+                <div
+                  className={`flex items-center gap-3 px-3 py-2 rounded-lg mb-1 transition-colors ${
+                    isActive
+                      ? "bg-blue-50 text-blue-600 border-r-2 border-blue-600"
+                      : "text-gray-600 hover:bg-gray-50"
+                  }`}
+                >
                   <Icon className="w-5 h-5 flex-shrink-0" />
-                                    {!sidebarCollapsed && <span className="font-medium">{item.label}</span>}
+                  {!sidebarCollapsed && (
+                    <span className="font-medium">{item.label}</span>
+                  )}
                 </div>
               </Link>
             );
@@ -185,7 +228,11 @@ export default function DoctorLayout({ children }: PatientLayoutProps) {
         </nav>
         // ... (seu código anterior)
         {/* Sidebar para desktop */}
-                <div className={`bg-white border-r border-gray-200 transition-all duration-300 ${sidebarCollapsed ? "w-16" : "w-64"} fixed left-0 top-0 h-screen flex flex-col z-50`}>
+        <div
+          className={`bg-white border-r border-gray-200 transition-all duration-300 ${
+            sidebarCollapsed ? "w-16" : "w-64"
+          } fixed left-0 top-0 h-screen flex flex-col z-50`}
+        >
           <div className="p-4 border-b border-gray-200">
             <div className="flex items-center justify-between">
               {!sidebarCollapsed && (
@@ -193,11 +240,22 @@ export default function DoctorLayout({ children }: PatientLayoutProps) {
                   <div className="w-8 h-8 bg-blue-600 rounded-lg flex items-center justify-center">
                     <div className="w-4 h-4 bg-white rounded-sm"></div>
                   </div>
-                                    <span className="font-semibold text-gray-900">MediConnect</span>
+                  <span className="font-semibold text-gray-900">
+                    MediConnect
+                  </span>
                 </div>
               )}
-                            <Button variant="ghost" size="sm" onClick={() => setSidebarCollapsed(!sidebarCollapsed)} className="p-1">
-                                {sidebarCollapsed ? <ChevronRight className="w-4 h-4" /> : <ChevronLeft className="w-4 h-4" />}
+              <Button
+                variant="ghost"
+                size="sm"
+                onClick={() => setSidebarCollapsed(!sidebarCollapsed)}
+                className="p-1"
+              >
+                {sidebarCollapsed ? (
+                  <ChevronRight className="w-4 h-4" />
+                ) : (
+                  <ChevronLeft className="w-4 h-4" />
+                )}
               </Button>
             </div>
           </div>
@@ -205,13 +263,23 @@ export default function DoctorLayout({ children }: PatientLayoutProps) {
           <nav className="flex-1 p-2 overflow-y-auto">
             {menuItems.map((item) => {
               const Icon = item.icon;
-                            const isActive = pathname === item.href || (item.href !== "/" && pathname.startsWith(item.href));
+              const isActive =
+                pathname === item.href ||
+                (item.href !== "/" && pathname.startsWith(item.href));
 
               return (
                 <Link key={item.href} href={item.href}>
-                                    <div className={`flex items-center gap-3 px-3 py-2 rounded-lg mb-1 transition-colors ${isActive ? "bg-blue-50 text-blue-600 border-r-2 border-blue-600" : "text-gray-600 hover:bg-gray-50"}`}>
+                  <div
+                    className={`flex items-center gap-3 px-3 py-2 rounded-lg mb-1 transition-colors ${
+                      isActive
+                        ? "bg-blue-50 text-blue-600 border-r-2 border-blue-600"
+                        : "text-gray-600 hover:bg-gray-50"
+                    }`}
+                  >
                     <Icon className="w-5 h-5 flex-shrink-0" />
-                                        {!sidebarCollapsed && <span className="font-medium">{item.label}</span>}
+                    {!sidebarCollapsed && (
+                      <span className="font-medium">{item.label}</span>
+                    )}
                   </div>
                 </Link>
               );
@@ -232,8 +300,12 @@ export default function DoctorLayout({ children }: PatientLayoutProps) {
                     </AvatarFallback>
                   </Avatar>
                   <div className="flex-1 min-w-0">
-                                        <p className="text-sm font-medium text-gray-900 truncate">{doctorData.name}</p>
-                                        <p className="text-xs text-gray-500 truncate">{doctorData.specialty}</p>
+                    <p className="text-sm font-medium text-gray-900 truncate">
+                      {doctorData.name}
+                    </p>
+                    <p className="text-xs text-gray-500 truncate">
+                      {doctorData.specialty}
+                    </p>
                   </div>
                 </>
               )}
@@ -250,15 +322,29 @@ export default function DoctorLayout({ children }: PatientLayoutProps) {
               )}
             </div>
 
-                        <div className={`flex items-center gap-3 px-3 py-2 rounded-lg mb-1 transition-colors text-muted-foreground hover:bg-accent cursor-pointer ${sidebarCollapsed ? "justify-center" : ""}`} onClick={handleLogout}>
+            <div
+              className={`flex items-center gap-3 px-3 py-2 rounded-lg mb-1 transition-colors text-muted-foreground hover:bg-accent cursor-pointer ${
+                sidebarCollapsed ? "justify-center" : ""
+              }`}
+              onClick={handleLogout}
+            >
               <LogOut className="w-5 h-5 flex-shrink-0" />
               {!sidebarCollapsed && <span className="font-medium">Sair</span>}
             </div>
           </div>
         </div>
       </div>
-            {isMobileMenuOpen && <div className="fixed inset-0 bg-black bg-opacity-50 z-40 md:hidden" onClick={toggleMobileMenu}></div>}
-            <div className={`bg-white border-r border-gray-200 fixed left-0 top-0 h-screen flex flex-col z-50 transition-transform duration-300 md:hidden ${isMobileMenuOpen ? "translate-x-0 w-64" : "-translate-x-full w-64"}`}>
+      {isMobileMenuOpen && (
+        <div
+          className="fixed inset-0 bg-black bg-opacity-50 z-40 md:hidden"
+          onClick={toggleMobileMenu}
+        ></div>
+      )}
+      <div
+        className={`bg-white border-r border-gray-200 fixed left-0 top-0 h-screen flex flex-col z-50 transition-transform duration-300 md:hidden ${
+          isMobileMenuOpen ? "translate-x-0 w-64" : "-translate-x-full w-64"
+        }`}
+      >
         <div className="p-4 border-b border-gray-200 flex items-center justify-between">
           <div className="flex items-center gap-2">
             <div className="w-8 h-8 bg-blue-600 rounded-lg flex items-center justify-center">
@@ -266,7 +352,12 @@ export default function DoctorLayout({ children }: PatientLayoutProps) {
             </div>
             <span className="font-semibold text-gray-900">Hospital System</span>
           </div>
-                    <Button variant="ghost" size="sm" onClick={toggleMobileMenu} className="p-1">
+          <Button
+            variant="ghost"
+            size="sm"
+            onClick={toggleMobileMenu}
+            className="p-1"
+          >
             <X className="w-4 h-4" />
           </Button>
         </div>
@@ -274,11 +365,19 @@ export default function DoctorLayout({ children }: PatientLayoutProps) {
         <nav className="flex-1 p-2 overflow-y-auto">
           {menuItems.map((item) => {
             const Icon = item.icon;
-                        const isActive = pathname === item.href || (item.href !== "/" && pathname.startsWith(item.href));
+            const isActive =
+              pathname === item.href ||
+              (item.href !== "/" && pathname.startsWith(item.href));
 
             return (
               <Link key={item.href} href={item.href} onClick={toggleMobileMenu}>
-                                <div className={`flex items-center gap-3 px-3 py-2 rounded-lg mb-1 transition-colors ${isActive ? "bg-accent text-accent-foreground border-r-2 border-primary" : "text-muted-foreground hover:bg-accent"}`}>
+                <div
+                  className={`flex items-center gap-3 px-3 py-2 rounded-lg mb-1 transition-colors ${
+                    isActive
+                      ? "bg-accent text-accent-foreground border-r-2 border-primary"
+                      : "text-muted-foreground hover:bg-accent"
+                  }`}
+                >
                   <Icon className="w-5 h-5 flex-shrink-0" />
                   <span className="font-medium">{item.label}</span>
                 </div>
@@ -299,8 +398,12 @@ export default function DoctorLayout({ children }: PatientLayoutProps) {
               </AvatarFallback>
             </Avatar>
             <div className="flex-1 min-w-0">
-                            <p className="text-sm font-medium text-gray-900 truncate">{doctorData.name}</p>
-                            <p className="text-xs text-gray-500 truncate">{doctorData.specialty}</p>
+              <p className="text-sm font-medium text-gray-900 truncate">
+                {doctorData.name}
+              </p>
+              <p className="text-xs text-gray-500 truncate">
+                {doctorData.specialty}
+              </p>
             </div>
           </div>
           <Button
@@ -318,20 +421,21 @@ export default function DoctorLayout({ children }: PatientLayoutProps) {
         </div>
       </div>
 
-            <div className={`flex-1 flex flex-col transition-all duration-300 ${sidebarCollapsed ? "ml-16" : "ml-64"}`}>
+      <div
+        className={`flex-1 flex flex-col transition-all duration-300 ${
+          sidebarCollapsed ? "ml-16" : "ml-64"
+        }`}
+      >
         <header className="bg-card border-b border px-6 py-4">
           <div className="flex items-center justify-between">
-                        <div className="flex items-center gap-4 flex-1">
-                            <div className="relative flex-1 max-w-md">
-                                <Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400 w-4 h-4" />
-                                <Input placeholder="Buscar paciente" className="pl-10 bg-background border" />
-                            </div>
-                        </div>
+            <div className="flex items-center gap-4 flex-1"></div>
 
             <div className="flex items-center gap-4">
               <Button variant="ghost" size="sm" className="relative">
                 <Bell className="w-5 h-5" />
-                                <Badge className="absolute -top-1 -right-1 w-5 h-5 p-0 flex items-center justify-center bg-red-500 text-white text-xs">1</Badge>
+                <Badge className="absolute -top-1 -right-1 w-5 h-5 p-0 flex items-center justify-center bg-red-500 text-white text-xs">
+                  1
+                </Badge>
               </Button>
             </div>
           </div>
@@ -344,7 +448,10 @@ export default function DoctorLayout({ children }: PatientLayoutProps) {
         <DialogContent className="sm:max-w-md">
           <DialogHeader>
             <DialogTitle>Confirmar Saída</DialogTitle>
-                        <DialogDescription>Deseja realmente sair do sistema? Você precisará fazer login novamente para acessar sua conta.</DialogDescription>
+            <DialogDescription>
+              Deseja realmente sair do sistema? Você precisará fazer login
+              novamente para acessar sua conta.
+            </DialogDescription>
           </DialogHeader>
           <DialogFooter className="flex gap-2">
             <Button variant="outline" onClick={cancelLogout}>

components/finance-layout.tsx

@@ -6,14 +6,34 @@ import type React from "react";
 import { useState, useEffect } from "react";
 import { useRouter, usePathname } from "next/navigation";
 import Link from "next/link";
-import { api } from '@/services/api.mjs';
+import { api } from "@/services/api.mjs";
 
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Badge } from "@/components/ui/badge";
 import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
-import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from "@/components/ui/dialog";
-import { Search, Bell, Calendar, Clock, User, LogOut, Menu, X, Home, FileText, ChevronLeft, ChevronRight } from "lucide-react";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import {
+  Search,
+  Bell,
+  Calendar,
+  Clock,
+  User,
+  LogOut,
+  Menu,
+  X,
+  Home,
+  FileText,
+  ChevronLeft,
+  ChevronRight,
+} from "lucide-react";
 
 interface FinancierData {
   id: string;
@@ -30,7 +50,9 @@ interface PatientLayoutProps {
 }
 
 export default function FinancierLayout({ children }: PatientLayoutProps) {
-  const [financierData, setFinancierData] = useState<FinancierData | null>(null);
+  const [financierData, setFinancierData] = useState<FinancierData | null>(
+    null
+  );
   const [sidebarCollapsed, setSidebarCollapsed] = useState(false);
   const [showLogoutDialog, setShowLogoutDialog] = useState(false);
   const router = useRouter();
@@ -48,7 +70,8 @@ export default function FinancierLayout({ children }: PatientLayoutProps) {
         id: userInfo.id || "",
         name: userInfo.user_metadata?.full_name || "Financeiro",
         email: userInfo.email || "",
-        department: userInfo.user_metadata?.department || "Departamento Financeiro",
+        department:
+          userInfo.user_metadata?.department || "Departamento Financeiro",
         phone: userInfo.phone || "",
         cpf: "",
         permissions: {},
@@ -106,7 +129,11 @@ export default function FinancierLayout({ children }: PatientLayoutProps) {
   ];
 
   if (!financierData) {
-    return <div className="flex h-screen w-full items-center justify-center">Carregando...</div>;
+    return (
+      <div className="flex h-screen w-full items-center justify-center">
+        Carregando...
+      </div>
+    );
   }
 
   return (
@@ -202,9 +229,7 @@ export default function FinancierLayout({ children }: PatientLayoutProps) {
             }
             onClick={handleLogout}
           >
-            <LogOut
-              className={sidebarCollapsed ? "h-5 w-5" : "mr-2 h-4 w-4"}
-            />
+            <LogOut className={sidebarCollapsed ? "h-5 w-5" : "mr-2 h-4 w-4"} />
             {!sidebarCollapsed && "Sair"}
           </Button>
         </div>
@@ -217,15 +242,7 @@ export default function FinancierLayout({ children }: PatientLayoutProps) {
       >
         <header className="bg-card border-b border-border px-6 py-4">
           <div className="flex items-center justify-between">
-            <div className="flex items-center gap-4 flex-1 max-w-md">
-              <div className="relative flex-1">
-                <Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-muted-foreground w-4 h-4" />
-                <Input
-                  placeholder="Buscar paciente"
-                  className="pl-10 bg-background border-border"
-                />
-              </div>
-            </div>
+            <div className="flex items-center gap-4 flex-1 max-w-md"></div>
 
             <div className="flex items-center gap-4">
               <Button variant="ghost" size="sm" className="relative">

components/manager-layout.tsx

@@ -6,14 +6,30 @@ import { useState, useEffect } from "react";
 import { useRouter, usePathname } from "next/navigation";
 import Link from "next/link";
 import Cookies from "js-cookie"; // Mantido apenas para a limpeza de segurança no logout
-import { api } from '@/services/api.mjs';
+import { api } from "@/services/api.mjs";
 
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Badge } from "@/components/ui/badge";
 import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
-import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from "@/components/ui/dialog";
-import { Search, Bell, Calendar, User, LogOut, ChevronLeft, ChevronRight, Home } from "lucide-react";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import {
+  Search,
+  Bell,
+  Calendar,
+  User,
+  LogOut,
+  ChevronLeft,
+  ChevronRight,
+  Home,
+} from "lucide-react";
 
 interface ManagerData {
   id: string;
@@ -103,13 +119,19 @@ export default function ManagerLayout({ children }: ManagerLayoutProps) {
   ];
 
   if (!managerData) {
-    return <div className="flex h-screen w-full items-center justify-center">Carregando...</div>;
+    return (
+      <div className="flex h-screen w-full items-center justify-center">
+        Carregando...
+      </div>
+    );
   }
 
   return (
     <div className="min-h-screen bg-gray-50 flex">
       <div
-        className={`bg-white border-r border-gray-200 transition-all duration-300 fixed top-0 h-screen flex flex-col z-30 ${sidebarCollapsed ? "w-16" : "w-64"}`}
+        className={`bg-white border-r border-gray-200 transition-all duration-300 fixed top-0 h-screen flex flex-col z-30 ${
+          sidebarCollapsed ? "w-16" : "w-64"
+        }`}
       >
         <div className="p-4 border-b border-gray-200 flex items-center justify-between">
           {!sidebarCollapsed && (
@@ -117,9 +139,7 @@ export default function ManagerLayout({ children }: ManagerLayoutProps) {
               <div className="w-8 h-8 bg-blue-600 rounded-lg flex items-center justify-center">
                 <div className="w-4 h-4 bg-white rounded-sm"></div>
               </div>
-              <span className="font-semibold text-gray-900">
-                MediConnect
-              </span>
+              <span className="font-semibold text-gray-900">MediConnect</span>
             </div>
           )}
           <Button
@@ -128,7 +148,11 @@ export default function ManagerLayout({ children }: ManagerLayoutProps) {
             onClick={() => setSidebarCollapsed(!sidebarCollapsed)}
             className="p-1"
           >
-            {sidebarCollapsed ? <ChevronRight className="w-4 h-4" /> : <ChevronLeft className="w-4 h-4" />}
+            {sidebarCollapsed ? (
+              <ChevronRight className="w-4 h-4" />
+            ) : (
+              <ChevronLeft className="w-4 h-4" />
+            )}
           </Button>
         </div>
 
@@ -139,10 +163,16 @@ export default function ManagerLayout({ children }: ManagerLayoutProps) {
             return (
               <Link key={item.label} href={item.href}>
                 <div
-                  className={`flex items-center gap-3 px-3 py-2 rounded-lg mb-1 transition-colors ${isActive ? "bg-blue-50 text-blue-600 border-r-2 border-blue-600" : "text-gray-600 hover:bg-gray-50"}`}
+                  className={`flex items-center gap-3 px-3 py-2 rounded-lg mb-1 transition-colors ${
+                    isActive
+                      ? "bg-blue-50 text-blue-600 border-r-2 border-blue-600"
+                      : "text-gray-600 hover:bg-gray-50"
+                  }`}
                 >
                   <Icon className="w-5 h-5 flex-shrink-0" />
-                  {!sidebarCollapsed && <span className="font-medium">{item.label}</span>}
+                  {!sidebarCollapsed && (
+                    <span className="font-medium">{item.label}</span>
+                  )}
                 </div>
               </Link>
             );
@@ -153,19 +183,32 @@ export default function ManagerLayout({ children }: ManagerLayoutProps) {
           <div className="flex items-center space-x-3 mb-4">
             <Avatar>
               <AvatarImage src="/placeholder.svg?height=40&width=40" />
-              <AvatarFallback>{managerData.name.split(" ").map((n) => n[0]).join("")}</AvatarFallback>
+              <AvatarFallback>
+                {managerData.name
+                  .split(" ")
+                  .map((n) => n[0])
+                  .join("")}
+              </AvatarFallback>
             </Avatar>
             {!sidebarCollapsed && (
               <div className="flex-1 min-w-0">
-                <p className="text-sm font-medium text-gray-900 truncate">{managerData.name}</p>
-                <p className="text-xs text-gray-500 truncate">{managerData.department}</p>
+                <p className="text-sm font-medium text-gray-900 truncate">
+                  {managerData.name}
+                </p>
+                <p className="text-xs text-gray-500 truncate">
+                  {managerData.department}
+                </p>
               </div>
             )}
           </div>
           <Button
             variant="outline"
             size="sm"
-            className={sidebarCollapsed ? "w-full bg-transparent flex justify-center items-center p-2" : "w-full bg-transparent"}
+            className={
+              sidebarCollapsed
+                ? "w-full bg-transparent flex justify-center items-center p-2"
+                : "w-full bg-transparent"
+            }
             onClick={handleLogout}
           >
             <LogOut className={sidebarCollapsed ? "h-5 w-5" : "mr-2 h-4 w-4"} />
@@ -174,18 +217,19 @@ export default function ManagerLayout({ children }: ManagerLayoutProps) {
         </div>
       </div>
 
-      <div className={`flex-1 flex flex-col transition-all duration-300 w-full ${sidebarCollapsed ? "ml-16" : "ml-64"}`}>
+      <div
+        className={`flex-1 flex flex-col transition-all duration-300 w-full ${
+          sidebarCollapsed ? "ml-16" : "ml-64"
+        }`}
+      >
         <header className="bg-white border-b border-gray-200 px-4 md:px-6 py-4 flex items-center justify-between">
-          <div className="flex items-center gap-4 flex-1 max-w-md">
-            <div className="relative flex-1">
-              <Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400 w-4 h-4" />
-              <Input placeholder="Buscar paciente" className="pl-10 bg-gray-50 border-gray-200" />
-            </div>
-          </div>
+          <div className="flex items-center gap-4 flex-1 max-w-md"></div>
           <div className="flex items-center gap-4 ml-auto">
             <Button variant="ghost" size="sm" className="relative">
               <Bell className="w-5 h-5" />
-              <Badge className="absolute -top-1 -right-1 w-5 h-5 p-0 flex items-center justify-center bg-red-500 text-white text-xs">1</Badge>
+              <Badge className="absolute -top-1 -right-1 w-5 h-5 p-0 flex items-center justify-center bg-red-500 text-white text-xs">
+                1
+              </Badge>
             </Button>
           </div>
         </header>
@@ -196,11 +240,19 @@ export default function ManagerLayout({ children }: ManagerLayoutProps) {
         <DialogContent className="sm:max-w-md">
           <DialogHeader>
             <DialogTitle>Confirmar Saída</DialogTitle>
-            <DialogDescription>Deseja realmente sair do sistema? Você precisará fazer login novamente para acessar sua conta.</DialogDescription>
+            <DialogDescription>
+              Deseja realmente sair do sistema? Você precisará fazer login
+              novamente para acessar sua conta.
+            </DialogDescription>
           </DialogHeader>
           <DialogFooter className="flex gap-2">
-            <Button variant="outline" onClick={cancelLogout}>Cancelar</Button>
-            <Button variant="destructive" onClick={confirmLogout}><LogOut className="mr-2 h-4 w-4" />Sair</Button>
+            <Button variant="outline" onClick={cancelLogout}>
+              Cancelar
+            </Button>
+            <Button variant="destructive" onClick={confirmLogout}>
+              <LogOut className="mr-2 h-4 w-4" />
+              Sair
+            </Button>
           </DialogFooter>
         </DialogContent>
       </Dialog>

components/patient-layout.tsx

@@ -1,52 +1,70 @@
-"use client"
+"use client";
 
 import Cookies from "js-cookie";
-import type React from "react"
-import { useState, useEffect } from "react"
-import Link from "next/link"
-import { useRouter, usePathname } from "next/navigation"
+import type React from "react";
+import { useState, useEffect } from "react";
+import Link from "next/link";
+import { useRouter, usePathname } from "next/navigation";
 import { api } from "@/services/api.mjs"; // Importando nosso cliente de API
 
-import { Button } from "@/components/ui/button"
-import { Input } from "@/components/ui/input"
-import { Badge } from "@/components/ui/badge"
-import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"
-import { Search, Bell, User, LogOut, FileText, Clock, Calendar, Home, ChevronLeft, ChevronRight } from "lucide-react"
-import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from "@/components/ui/dialog"
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { Badge } from "@/components/ui/badge";
+import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
+import {
+  Search,
+  Bell,
+  User,
+  LogOut,
+  FileText,
+  Clock,
+  Calendar,
+  Home,
+  ChevronLeft,
+  ChevronRight,
+} from "lucide-react";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
 
 interface PatientData {
-  name: string
-  email: string
-  phone: string
-  cpf: string
-  birthDate: string
-  address: string
+  name: string;
+  email: string;
+  phone: string;
+  cpf: string;
+  birthDate: string;
+  address: string;
 }
 
 interface PatientLayoutProps {
-  children: React.ReactNode
+  children: React.ReactNode;
 }
 
 // --- ALTERAÇÃO 1: Renomeando o componente para maior clareza ---
 export default function PatientLayout({ children }: PatientLayoutProps) {
-  const [patientData, setPatientData] = useState<PatientData | null>(null)
-  const [sidebarCollapsed, setSidebarCollapsed] = useState(false)
-  const [showLogoutDialog, setShowLogoutDialog] = useState(false)
-  const router = useRouter()
-  const pathname = usePathname()
+  const [patientData, setPatientData] = useState<PatientData | null>(null);
+  const [sidebarCollapsed, setSidebarCollapsed] = useState(false);
+  const [showLogoutDialog, setShowLogoutDialog] = useState(false);
+  const router = useRouter();
+  const pathname = usePathname();
 
   useEffect(() => {
     const handleResize = () => {
       if (window.innerWidth < 1024) {
-        setSidebarCollapsed(true)
+        setSidebarCollapsed(true);
       } else {
-        setSidebarCollapsed(false)
+        setSidebarCollapsed(false);
       }
-    }
-    handleResize()
-    window.addEventListener("resize", handleResize)
-    return () => window.removeEventListener("resize", handleResize)
-  }, [])
+    };
+    handleResize();
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, []);
 
   useEffect(() => {
     const userInfoString = localStorage.getItem("user_info");
@@ -70,7 +88,7 @@ export default function PatientLayout({ children }: PatientLayoutProps) {
     }
   }, [router]);
 
-  const handleLogout = () => setShowLogoutDialog(true)
+  const handleLogout = () => setShowLogoutDialog(true);
 
   // --- ALTERAÇÃO 4: Função de logout completa e padronizada ---
   const confirmLogout = async () => {
@@ -90,18 +108,26 @@ export default function PatientLayout({ children }: PatientLayoutProps) {
     }
   };
 
-  const cancelLogout = () => setShowLogoutDialog(false)
+  const cancelLogout = () => setShowLogoutDialog(false);
 
   const menuItems = [
     { href: "/patient/dashboard", icon: Home, label: "Dashboard" },
-    { href: "/patient/appointments", icon: Calendar, label: "Minhas Consultas" },
+    {
+      href: "/patient/appointments",
+      icon: Calendar,
+      label: "Minhas Consultas",
+    },
     { href: "/patient/schedule", icon: Clock, label: "Agendar Consulta" },
     { href: "/patient/reports", icon: FileText, label: "Meus Laudos" },
     { href: "/patient/profile", icon: User, label: "Meus Dados" },
-  ]
+  ];
 
   if (!patientData) {
-    return <div className="flex h-screen w-full items-center justify-center">Carregando...</div>;
+    return (
+      <div className="flex h-screen w-full items-center justify-center">
+        Carregando...
+      </div>
+    );
   }
 
   return (
@@ -120,7 +146,9 @@ export default function PatientLayout({ children }: PatientLayoutProps) {
                 <div className="w-8 h-8 bg-primary rounded-lg flex items-center justify-center">
                   <div className="w-4 h-4 bg-primary-foreground rounded-sm"></div>
                 </div>
-                <span className="font-semibold text-foreground">MediConnect</span>
+                <span className="font-semibold text-foreground">
+                  MediConnect
+                </span>
               </div>
             )}
             <Button
@@ -141,10 +169,10 @@ export default function PatientLayout({ children }: PatientLayoutProps) {
         {/* Menu */}
         <nav className="flex-1 p-2 overflow-y-auto">
           {menuItems.map((item) => {
-            const Icon = item.icon
+            const Icon = item.icon;
             const isActive =
               pathname === item.href ||
-              (item.href !== "/" && pathname.startsWith(item.href))
+              (item.href !== "/" && pathname.startsWith(item.href));
 
             return (
               <Link key={item.href} href={item.href}>
@@ -161,7 +189,7 @@ export default function PatientLayout({ children }: PatientLayoutProps) {
                   )}
                 </div>
               </Link>
-            )
+            );
           })}
         </nav>
 
@@ -199,9 +227,7 @@ export default function PatientLayout({ children }: PatientLayoutProps) {
             }
             onClick={handleLogout}
           >
-            <LogOut
-              className={sidebarCollapsed ? "h-5 w-5" : "mr-2 h-4 w-4"}
-            />{" "}
+            <LogOut className={sidebarCollapsed ? "h-5 w-5" : "mr-2 h-4 w-4"} />{" "}
             {/* Remove margem quando colapsado */}
             {!sidebarCollapsed && "Sair"}{" "}
             {/* Mostra o texto apenas quando não está colapsado */}
@@ -218,15 +244,7 @@ export default function PatientLayout({ children }: PatientLayoutProps) {
         {/* Header */}
         <header className="bg-card border-b border-border px-6 py-4">
           <div className="flex items-center justify-between">
-            <div className="flex items-center gap-4 flex-1 max-w-md">
-              <div className="relative flex-1">
-                <Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-muted-foreground w-4 h-4" />
-                <Input
-                  placeholder="Buscar paciente"
-                  className="pl-10 bg-background border-border"
-                />
-              </div>
-            </div>
+            <div className="flex items-center gap-4 flex-1 max-w-md"></div>
 
             <div className="flex items-center gap-4">
               <Button variant="ghost" size="sm" className="relative">
@@ -265,5 +283,5 @@ export default function PatientLayout({ children }: PatientLayoutProps) {
         </DialogContent>
       </Dialog>
     </div>
-  )
+  );
 }

components/secretary-layout.tsx

@@ -1,41 +1,60 @@
 // Caminho: app/(secretary)/layout.tsx (ou o caminho do seu arquivo)
-"use client"
+"use client";
 
-import type React from "react"
-import { useState, useEffect } from "react"
-import { useRouter, usePathname } from "next/navigation"
-import Link from "next/link"
+import type React from "react";
+import { useState, useEffect } from "react";
+import { useRouter, usePathname } from "next/navigation";
+import Link from "next/link";
 import Cookies from "js-cookie";
-import { api } from '@/services/api.mjs'; // Importando nosso cliente de API central
+import { api } from "@/services/api.mjs"; // Importando nosso cliente de API central
 
-import { Button } from "@/components/ui/button"
-import { Input } from "@/components/ui/input"
-import { Badge } from "@/components/ui/badge"
-import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"
-import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from "@/components/ui/dialog"
-import { Search, Bell, Calendar, Clock, User, LogOut, Home, ChevronLeft, ChevronRight } from "lucide-react"
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { Badge } from "@/components/ui/badge";
+import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import {
+  Search,
+  Bell,
+  Calendar,
+  Clock,
+  User,
+  LogOut,
+  Home,
+  ChevronLeft,
+  ChevronRight,
+} from "lucide-react";
 
 interface SecretaryData {
-  id: string
-  name: string
-  email: string
-  phone: string
-  cpf: string
-  employeeId: string
-  department: string
-  permissions: object
+  id: string;
+  name: string;
+  email: string;
+  phone: string;
+  cpf: string;
+  employeeId: string;
+  department: string;
+  permissions: object;
 }
 
 interface SecretaryLayoutProps {
-  children: React.ReactNode
+  children: React.ReactNode;
 }
 
 export default function SecretaryLayout({ children }: SecretaryLayoutProps) {
-  const [secretaryData, setSecretaryData] = useState<SecretaryData | null>(null);
-  const [sidebarCollapsed, setSidebarCollapsed] = useState(false)
-  const [showLogoutDialog, setShowLogoutDialog] = useState(false)
-  const router = useRouter()
-  const pathname = usePathname()
+  const [secretaryData, setSecretaryData] = useState<SecretaryData | null>(
+    null
+  );
+  const [sidebarCollapsed, setSidebarCollapsed] = useState(false);
+  const [showLogoutDialog, setShowLogoutDialog] = useState(false);
+  const router = useRouter();
+  const pathname = usePathname();
 
   useEffect(() => {
     const userInfoString = localStorage.getItem("user_info");
@@ -64,17 +83,17 @@ export default function SecretaryLayout({ children }: SecretaryLayoutProps) {
   useEffect(() => {
     const handleResize = () => {
       if (window.innerWidth < 1024) {
-        setSidebarCollapsed(true)
+        setSidebarCollapsed(true);
       } else {
-        setSidebarCollapsed(false)
+        setSidebarCollapsed(false);
       }
-    }
-    handleResize()
-    window.addEventListener("resize", handleResize)
-    return () => window.removeEventListener("resize", handleResize)
-  }, [])
+    };
+    handleResize();
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, []);
 
-  const handleLogout = () => setShowLogoutDialog(true)
+  const handleLogout = () => setShowLogoutDialog(true);
 
   // --- ALTERAÇÃO 3: Função de logout completa e padronizada ---
   const confirmLogout = async () => {
@@ -94,20 +113,23 @@ export default function SecretaryLayout({ children }: SecretaryLayoutProps) {
     }
   };
 
-  const cancelLogout = () => setShowLogoutDialog(false)
+  const cancelLogout = () => setShowLogoutDialog(false);
 
   const menuItems = [
     { href: "/secretary/dashboard", icon: Home, label: "Dashboard" },
     { href: "/secretary/appointments", icon: Calendar, label: "Consultas" },
     { href: "/secretary/schedule", icon: Clock, label: "Agendar Consulta" },
     { href: "/secretary/pacientes", icon: User, label: "Pacientes" },
-  ]
+  ];
 
   if (!secretaryData) {
-    return <div className="flex h-screen w-full items-center justify-center">Carregando...</div>;
+    return (
+      <div className="flex h-screen w-full items-center justify-center">
+        Carregando...
+      </div>
+    );
   }
 
-
   return (
     <div className="min-h-screen bg-background flex">
       {/* Sidebar */}
@@ -123,7 +145,9 @@ export default function SecretaryLayout({ children }: SecretaryLayoutProps) {
                 <div className="w-8 h-8 bg-primary rounded-lg flex items-center justify-center">
                   <div className="w-4 h-4 bg-primary-foreground rounded-sm"></div>
                 </div>
-                <span className="font-semibold text-foreground">MediConnect</span>
+                <span className="font-semibold text-foreground">
+                  MediConnect
+                </span>
               </div>
             )}
             <Button
@@ -143,23 +167,27 @@ export default function SecretaryLayout({ children }: SecretaryLayoutProps) {
 
         <nav className="flex-1 p-2 overflow-y-auto">
           {menuItems.map((item) => {
-            const Icon = item.icon
+            const Icon = item.icon;
             const isActive =
-              pathname === item.href || (item.href !== "/" && pathname.startsWith(item.href))
+              pathname === item.href ||
+              (item.href !== "/" && pathname.startsWith(item.href));
 
             return (
               <Link key={item.href} href={item.href}>
                 <div
-                  className={`flex items-center gap-3 px-3 py-2 rounded-lg mb-1 transition-colors ${isActive
+                  className={`flex items-center gap-3 px-3 py-2 rounded-lg mb-1 transition-colors ${
+                    isActive
                       ? "bg-accent text-accent-foreground"
                       : "text-muted-foreground hover:bg-accent hover:text-accent-foreground"
                   }`}
                 >
                   <Icon className="w-5 h-5 flex-shrink-0" />
-                  {!sidebarCollapsed && <span className="font-medium">{item.label}</span>}
+                  {!sidebarCollapsed && (
+                    <span className="font-medium">{item.label}</span>
+                  )}
                 </div>
               </Link>
-            )
+            );
           })}
         </nav>
 
@@ -179,7 +207,9 @@ export default function SecretaryLayout({ children }: SecretaryLayoutProps) {
                 <p className="text-sm font-medium text-foreground truncate">
                   {secretaryData.name}
                 </p>
-                <p className="text-xs text-muted-foreground truncate">{secretaryData.email}</p>
+                <p className="text-xs text-muted-foreground truncate">
+                  {secretaryData.email}
+                </p>
               </div>
             )}
           </div>
@@ -193,9 +223,7 @@ export default function SecretaryLayout({ children }: SecretaryLayoutProps) {
             }
             onClick={handleLogout}
           >
-            <LogOut
-              className={sidebarCollapsed ? "h-5 w-5" : "mr-2 h-4 w-4"}
-            />
+            <LogOut className={sidebarCollapsed ? "h-5 w-5" : "mr-2 h-4 w-4"} />
             {!sidebarCollapsed && "Sair"}
           </Button>
         </div>
@@ -203,20 +231,13 @@ export default function SecretaryLayout({ children }: SecretaryLayoutProps) {
 
       {/* Main Content */}
       <div
-        className={`flex-1 flex flex-col transition-all duration-300 ${sidebarCollapsed ? "ml-16" : "ml-64"
+        className={`flex-1 flex flex-col transition-all duration-300 ${
+          sidebarCollapsed ? "ml-16" : "ml-64"
         }`}
       >
         <header className="bg-card border-b border-border px-6 py-4">
           <div className="flex items-center justify-between">
-            <div className="flex items-center gap-4 flex-1 max-w-md">
-              <div className="relative flex-1">
-                <Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-muted-foreground w-4 h-4" />
-                <Input
-                  placeholder="Buscar paciente"
-                  className="pl-10 bg-background border-border"
-                />
-              </div>
-            </div>
+            <div className="flex items-center gap-4 flex-1 max-w-md"></div>
 
             <div className="flex items-center gap-4">
               <Button variant="ghost" size="sm" className="relative">
@@ -238,7 +259,8 @@ export default function SecretaryLayout({ children }: SecretaryLayoutProps) {
           <DialogHeader>
             <DialogTitle>Confirmar Saída</DialogTitle>
             <DialogDescription>
-              Deseja realmente sair do sistema? Você precisará fazer login novamente para acessar sua conta.
+              Deseja realmente sair do sistema? Você precisará fazer login
+              novamente para acessar sua conta.
             </DialogDescription>
           </DialogHeader>
           <DialogFooter className="flex gap-2">
@@ -253,5 +275,5 @@ export default function SecretaryLayout({ children }: SecretaryLayoutProps) {
         </DialogContent>
       </Dialog>
     </div>
-  )
+  );
 }