fix-profissional-page-and-admin-page #38

Merged
M-Gabrielly merged 7 commits from feature/ajustes-visuais into develop 2025-10-04 01:44:51 +00:00
Showing only changes of commit 33e82f9462 - Show all commits

View File

@ -460,13 +460,13 @@ const ProfissionalPage = () => {
</div> </div>
{/* Navegação de Data */} {/* Navegação de Data */}
<div className="flex items-center justify-between mb-6 p-4 bg-muted rounded-lg"> <div className="flex items-center justify-between mb-6 p-4 bg-blue-50 rounded-lg dark:bg-muted">
<div className="flex items-center space-x-4"> <div className="flex items-center space-x-4">
<Button <Button
variant="outline" variant="outline"
size="sm" size="sm"
onClick={() => navigateDate('prev')} onClick={() => navigateDate('prev')}
className="p-2 hover:bg-primary hover:text-primary-foreground cursor-pointer" className="p-2 hover:bg-blue-50 cursor-pointer dark:hover:bg-primary dark:hover:text-primary-foreground"
> >
<ChevronLeft className="h-4 w-4" /> <ChevronLeft className="h-4 w-4" />
</Button> </Button>
@ -477,7 +477,7 @@ const ProfissionalPage = () => {
variant="outline" variant="outline"
size="sm" size="sm"
onClick={() => navigateDate('next')} onClick={() => navigateDate('next')}
className="p-2 hover:bg-primary hover:text-primary-foreground cursor-pointer" className="p-2 hover:bg-blue-50 cursor-pointer dark:hover:bg-primary dark:hover:text-primary-foreground"
> >
<ChevronRight className="h-4 w-4" /> <ChevronRight className="h-4 w-4" />
</Button> </Button>
@ -485,12 +485,12 @@ const ProfissionalPage = () => {
variant="outline" variant="outline"
size="sm" size="sm"
onClick={goToToday} onClick={goToToday}
className="ml-4 px-3 py-1 text-sm hover:bg-primary hover:text-primary-foreground cursor-pointer" className="ml-4 px-3 py-1 text-sm hover:bg-blue-50 cursor-pointer dark:hover:bg-primary dark:hover:text-primary-foreground"
> >
Hoje Hoje
</Button> </Button>
</div> </div>
<div className="text-sm text-muted-foreground"> <div className="text-sm text-gray-600 dark:text-muted-foreground">
{todayEvents.length} consulta{todayEvents.length !== 1 ? 's' : ''} agendada{todayEvents.length !== 1 ? 's' : ''} {todayEvents.length} consulta{todayEvents.length !== 1 ? 's' : ''} agendada{todayEvents.length !== 1 ? 's' : ''}
</div> </div>
</div> </div>
@ -498,8 +498,8 @@ const ProfissionalPage = () => {
{/* Lista de Pacientes do Dia */} {/* Lista de Pacientes do Dia */}
<div className="space-y-4"> <div className="space-y-4">
{todayEvents.length === 0 ? ( {todayEvents.length === 0 ? (
<div className="text-center py-8 text-muted-foreground"> <div className="text-center py-8 text-gray-600 dark:text-muted-foreground">
<CalendarIcon className="h-12 w-12 mx-auto mb-4 text-muted-foreground/50" /> <CalendarIcon className="h-12 w-12 mx-auto mb-4 text-gray-400 dark:text-muted-foreground/50" />
<p className="text-lg mb-2">Nenhuma consulta agendada para este dia</p> <p className="text-lg mb-2">Nenhuma consulta agendada para este dia</p>
<p className="text-sm">Agenda livre para este dia</p> <p className="text-sm">Agenda livre para este dia</p>
</div> </div>
@ -520,18 +520,18 @@ const ProfissionalPage = () => {
></div> ></div>
<div> <div>
<div className="font-medium flex items-center"> <div className="font-medium flex items-center">
<User className="h-4 w-4 mr-2 text-muted-foreground" /> <User className="h-4 w-4 mr-2 text-gray-500 dark:text-muted-foreground" />
{appointment.title} {appointment.title}
</div> </div>
{paciente && ( {paciente && (
<div className="text-sm text-muted-foreground"> <div className="text-sm text-gray-600 dark:text-muted-foreground">
CPF: {paciente.cpf} {paciente.idade} anos CPF: {paciente.cpf} {paciente.idade} anos
</div> </div>
)} )}
</div> </div>
</div> </div>
<div className="flex items-center"> <div className="flex items-center">
<Clock className="h-4 w-4 mr-2 text-muted-foreground" /> <Clock className="h-4 w-4 mr-2 text-gray-500 dark:text-muted-foreground" />
<span className="font-medium">{appointment.time}</span> <span className="font-medium">{appointment.time}</span>
</div> </div>
<div className="flex items-center"> <div className="flex items-center">
@ -547,7 +547,7 @@ const ProfissionalPage = () => {
<Button <Button
variant="outline" variant="outline"
size="sm" size="sm"
className="border-primary text-primary hover:bg-primary hover:text-white cursor-pointer" className="border-primary text-primary hover:bg-blue-50 cursor-pointer dark:hover:bg-primary dark:hover:text-white"
onClick={(e) => { onClick={(e) => {
e.stopPropagation(); e.stopPropagation();
if (paciente) { if (paciente) {
@ -615,7 +615,7 @@ const ProfissionalPage = () => {
<Button <Button
variant="outline" variant="outline"
size="sm" size="sm"
className="border-primary text-primary hover:bg-primary hover:text-white cursor-pointer mr-2" className="border-primary text-primary hover:bg-blue-50 cursor-pointer mr-2 dark:hover:bg-primary dark:hover:text-white"
onClick={() => { onClick={() => {
handleAbrirProntuario(paciente); handleAbrirProntuario(paciente);
setActiveSection('prontuario'); setActiveSection('prontuario');
@ -666,7 +666,7 @@ const ProfissionalPage = () => {
</SelectTrigger> </SelectTrigger>
<SelectContent> <SelectContent>
{pacientes.map((paciente) => ( {pacientes.map((paciente) => (
<SelectItem key={paciente.cpf} value={paciente.nome} className="hover:bg-primary hover:text-primary-foreground"> <SelectItem key={paciente.cpf} value={paciente.nome} className="hover:bg-blue-50 dark:hover:bg-primary dark:hover:text-primary-foreground">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<span className="font-medium">{paciente.nome}</span> <span className="font-medium">{paciente.nome}</span>
<span className="text-xs opacity-70">({paciente.idade} anos)</span> <span className="text-xs opacity-70">({paciente.idade} anos)</span>
@ -705,11 +705,11 @@ const ProfissionalPage = () => {
{/* Seletor de Paciente */} {/* Seletor de Paciente */}
{!pacienteSelecionado && ( {!pacienteSelecionado && (
<div className="space-y-6"> <div className="space-y-6">
<div className="bg-muted border rounded-lg p-6"> <div className="bg-gray-50 border rounded-lg p-6 dark:bg-muted">
<div className="text-center mb-6"> <div className="text-center mb-6">
<User className="h-12 w-12 mx-auto mb-4 text-muted-foreground/50" /> <User className="h-12 w-12 mx-auto mb-4 text-gray-400 dark:text-muted-foreground/50" />
<h3 className="text-lg font-medium text-foreground mb-2">Selecionar Paciente</h3> <h3 className="text-lg font-medium text-foreground mb-2">Selecionar Paciente</h3>
<p className="text-sm text-muted-foreground">Escolha um paciente para visualizar o prontuário completo</p> <p className="text-sm text-gray-600 dark:text-muted-foreground">Escolha um paciente para visualizar o prontuário completo</p>
</div> </div>
<div className="max-w-md mx-auto"> <div className="max-w-md mx-auto">
@ -729,7 +729,7 @@ const ProfissionalPage = () => {
</SelectTrigger> </SelectTrigger>
<SelectContent> <SelectContent>
{pacientes.map((paciente) => ( {pacientes.map((paciente) => (
<SelectItem key={paciente.cpf} value={paciente.nome} className="hover:bg-primary hover:text-primary-foreground cursor-pointer"> <SelectItem key={paciente.cpf} value={paciente.nome} className="hover:bg-blue-50 cursor-pointer dark:hover:bg-primary dark:hover:text-primary-foreground">
<div className="flex items-center gap-3 w-full"> <div className="flex items-center gap-3 w-full">
<div className="flex-1"> <div className="flex-1">
<p className="font-medium">{paciente.nome}</p> <p className="font-medium">{paciente.nome}</p>
@ -759,17 +759,17 @@ const ProfissionalPage = () => {
</div> </div>
<div className="flex-1 min-w-0"> <div className="flex-1 min-w-0">
<p className="font-medium text-foreground truncate">{paciente.nome}</p> <p className="font-medium text-foreground truncate">{paciente.nome}</p>
<p className="text-sm text-muted-foreground">CPF: {paciente.cpf}</p> <p className="text-sm text-gray-600 dark:text-muted-foreground">CPF: {paciente.cpf}</p>
<p className="text-sm text-muted-foreground">{paciente.idade} anos</p> <p className="text-sm text-gray-600 dark:text-muted-foreground">{paciente.idade} anos</p>
</div> </div>
</div> </div>
<div className="mt-3 flex items-center justify-between"> <div className="mt-3 flex items-center justify-between">
<span className={`px-2 py-1 text-xs rounded-full ${ <span className={`px-2 py-1 text-xs rounded-full font-medium ${
paciente.statusLaudo === 'Finalizado' paciente.statusLaudo === 'Finalizado'
? 'bg-green-100 dark:bg-green-900/30 text-green-800 dark:text-green-300' ? 'bg-green-700 text-white dark:bg-green-900/30 dark:text-green-300'
: paciente.statusLaudo === 'Pendente' : paciente.statusLaudo === 'Pendente'
? 'bg-yellow-100 dark:bg-yellow-900/30 text-yellow-800 dark:text-yellow-300' ? 'bg-amber-600 text-white dark:bg-yellow-900/30 dark:text-yellow-300'
: 'bg-muted text-muted-foreground' : 'bg-gray-200 text-gray-800 font-medium dark:bg-muted dark:text-muted-foreground'
}`}> }`}>
{paciente.statusLaudo} {paciente.statusLaudo}
</span> </span>
@ -810,7 +810,7 @@ const ProfissionalPage = () => {
className={`py-2 px-1 border-b-2 font-medium text-sm flex items-center gap-2 transition-colors cursor-pointer ${ className={`py-2 px-1 border-b-2 font-medium text-sm flex items-center gap-2 transition-colors cursor-pointer ${
abaProntuarioAtiva === aba.id abaProntuarioAtiva === aba.id
? 'border-primary text-primary' ? 'border-primary text-primary'
: 'border-transparent text-muted-foreground hover:text-foreground hover:border-border' : 'border-transparent text-gray-600 hover:text-foreground hover:border-border dark:text-muted-foreground'
}`} }`}
> >
<Icone className="h-4 w-4" /> <Icone className="h-4 w-4" />
@ -1093,9 +1093,9 @@ const ProfissionalPage = () => {
<div className="flex justify-between items-start mb-3"> <div className="flex justify-between items-start mb-3">
<div> <div>
<h4 className="font-medium">Consulta Cardiológica</h4> <h4 className="font-medium">Consulta Cardiológica</h4>
<p className="text-sm text-muted-foreground">27/09/2025 - 09:00</p> <p className="text-sm text-gray-600 dark:text-muted-foreground">27/09/2025 - 09:00</p>
</div> </div>
<span className="px-2 py-1 bg-green-100 dark:bg-green-900/30 text-green-800 dark:text-green-300 text-xs rounded-full">Finalizada</span> <span className="px-2 py-1 bg-green-700 text-white font-medium dark:bg-green-900/30 dark:text-green-300 text-xs rounded-full">Finalizada</span>
</div> </div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 text-sm"> <div className="grid grid-cols-1 md:grid-cols-2 gap-4 text-sm">
<div> <div>
@ -1214,7 +1214,7 @@ const ProfissionalPage = () => {
<p className="text-sm text-muted-foreground">1 comprimido pela manhã</p> <p className="text-sm text-muted-foreground">1 comprimido pela manhã</p>
<p className="text-sm text-muted-foreground">Duração: 30 dias</p> <p className="text-sm text-muted-foreground">Duração: 30 dias</p>
</div> </div>
<Button variant="outline" size="sm" className="cursor-pointer"> <Button variant="outline" size="sm" className="cursor-pointer hover:bg-blue-50 dark:hover:bg-accent dark:hover:text-accent-foreground">
<Eye className="h-4 w-4" /> <Eye className="h-4 w-4" />
</Button> </Button>
</div> </div>
@ -1226,7 +1226,7 @@ const ProfissionalPage = () => {
<p className="text-sm text-muted-foreground">1 comprimido após café e jantar</p> <p className="text-sm text-muted-foreground">1 comprimido após café e jantar</p>
<p className="text-sm text-muted-foreground">Duração: 60 dias</p> <p className="text-sm text-muted-foreground">Duração: 60 dias</p>
</div> </div>
<Button variant="outline" size="sm" className="cursor-pointer"> <Button variant="outline" size="sm" className="cursor-pointer hover:bg-blue-50 dark:hover:bg-accent dark:hover:text-accent-foreground">
<Eye className="h-4 w-4" /> <Eye className="h-4 w-4" />
</Button> </Button>
</div> </div>
@ -1309,10 +1309,10 @@ const ProfissionalPage = () => {
<p className="text-sm font-medium text-green-700 dark:text-green-400">Resultado: 95 mg/dL (Normal)</p> <p className="text-sm font-medium text-green-700 dark:text-green-400">Resultado: 95 mg/dL (Normal)</p>
</div> </div>
<div className="flex gap-2"> <div className="flex gap-2">
<Button variant="outline" size="sm" className="cursor-pointer"> <Button variant="outline" size="sm" className="cursor-pointer hover:bg-blue-50 dark:hover:bg-accent dark:hover:text-accent-foreground">
<Eye className="h-4 w-4" /> <Eye className="h-4 w-4" />
</Button> </Button>
<Button variant="outline" size="sm" className="cursor-pointer"> <Button variant="outline" size="sm" className="cursor-pointer hover:bg-blue-50 dark:hover:bg-accent dark:hover:text-accent-foreground">
<Download className="h-4 w-4" /> <Download className="h-4 w-4" />
</Button> </Button>
</div> </div>
@ -1445,7 +1445,7 @@ const ProfissionalPage = () => {
</div> </div>
<div> <div>
<p className="font-medium text-sm">Radiografia de Tórax</p> <p className="font-medium text-sm">Radiografia de Tórax</p>
<p className="text-xs text-muted-foreground">20/09/2025</p> <p className="text-xs text-gray-600 dark:text-muted-foreground">20/09/2025</p>
</div> </div>
</div> </div>
<div className="flex gap-2"> <div className="flex gap-2">
@ -1467,7 +1467,7 @@ const ProfissionalPage = () => {
</div> </div>
<div> <div>
<p className="font-medium text-sm">ECG</p> <p className="font-medium text-sm">ECG</p>
<p className="text-xs text-muted-foreground">15/09/2025</p> <p className="text-xs text-gray-600 dark:text-muted-foreground">15/09/2025</p>
</div> </div>
</div> </div>
<div className="flex gap-2"> <div className="flex gap-2">
@ -1494,14 +1494,14 @@ const ProfissionalPage = () => {
</div> </div>
<div> <div>
<p className="font-medium text-sm">Laudo de Ecocardiograma</p> <p className="font-medium text-sm">Laudo de Ecocardiograma</p>
<p className="text-xs text-muted-foreground">10/08/2025 - Dr. Carlos Andrade</p> <p className="text-xs text-gray-600 dark:text-muted-foreground">10/08/2025 - Dr. Carlos Andrade</p>
</div> </div>
</div> </div>
<div className="flex gap-2"> <div className="flex gap-2">
<Button variant="outline" size="sm" className="cursor-pointer"> <Button variant="outline" size="sm" className="cursor-pointer hover:bg-blue-50 dark:hover:bg-accent dark:hover:text-accent-foreground">
<Eye className="h-3 w-3" /> <Eye className="h-3 w-3" />
</Button> </Button>
<Button variant="outline" size="sm" className="cursor-pointer"> <Button variant="outline" size="sm" className="cursor-pointer hover:bg-blue-50 dark:hover:bg-accent dark:hover:text-accent-foreground">
<Download className="h-3 w-3" /> <Download className="h-3 w-3" />
</Button> </Button>
</div> </div>
@ -1518,10 +1518,10 @@ const ProfissionalPage = () => {
</div> </div>
</div> </div>
<div className="flex gap-2"> <div className="flex gap-2">
<Button variant="outline" size="sm" className="cursor-pointer"> <Button variant="outline" size="sm" className="cursor-pointer hover:bg-blue-50 dark:hover:bg-accent dark:hover:text-accent-foreground">
<Eye className="h-3 w-3" /> <Eye className="h-3 w-3" />
</Button> </Button>
<Button variant="outline" size="sm" className="cursor-pointer"> <Button variant="outline" size="sm" className="cursor-pointer hover:bg-blue-50 dark:hover:bg-accent dark:hover:text-accent-foreground">
<Download className="h-3 w-3" /> <Download className="h-3 w-3" />
</Button> </Button>
</div> </div>
@ -1840,7 +1840,7 @@ Nevo melanocítico benigno. Seguimento clínico recomendado.
setLaudoSelecionado(laudo); setLaudoSelecionado(laudo);
setIsViewing(true); setIsViewing(true);
}} }}
className="flex items-center gap-1" className="flex items-center gap-1 hover:bg-blue-50 dark:hover:bg-accent dark:hover:text-accent-foreground"
> >
<Eye className="w-4 h-4" /> <Eye className="w-4 h-4" />
Ver Laudo Ver Laudo
@ -2216,7 +2216,7 @@ Nevo melanocítico benigno. Seguimento clínico recomendado.
className={`px-4 py-2 text-sm font-medium border-b-2 transition-colors ${ className={`px-4 py-2 text-sm font-medium border-b-2 transition-colors ${
showPreview showPreview
? "border-green-500 text-green-600" ? "border-green-500 text-green-600"
: "border-transparent text-muted-foreground hover:text-foreground" : "border-transparent text-muted-foreground hover:text-foreground hover:bg-blue-50 dark:hover:bg-gray-700"
}`} }`}
> >
<Eye className="w-4 h-4 inline mr-1" /> <Eye className="w-4 h-4 inline mr-1" />
@ -2635,10 +2635,10 @@ Nevo melanocítico benigno. Seguimento clínico recomendado.
<SelectValue placeholder="Selecione o tipo" /> <SelectValue placeholder="Selecione o tipo" />
</SelectTrigger> </SelectTrigger>
<SelectContent className="bg-popover border"> <SelectContent className="bg-popover border">
<SelectItem value="lembrete" className="hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground cursor-pointer">Lembrete de Consulta</SelectItem> <SelectItem value="lembrete" className="hover:bg-blue-50 focus:bg-blue-50 cursor-pointer dark:hover:bg-primary dark:hover:text-primary-foreground dark:focus:bg-primary dark:focus:text-primary-foreground">Lembrete de Consulta</SelectItem>
<SelectItem value="resultado" className="hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground cursor-pointer">Resultado de Exame</SelectItem> <SelectItem value="resultado" className="hover:bg-blue-50 focus:bg-blue-50 cursor-pointer dark:hover:bg-primary dark:hover:text-primary-foreground dark:focus:bg-primary dark:focus:text-primary-foreground">Resultado de Exame</SelectItem>
<SelectItem value="instrucao" className="hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground cursor-pointer">Instruções Pós-Consulta</SelectItem> <SelectItem value="instrucao" className="hover:bg-blue-50 focus:bg-blue-50 cursor-pointer dark:hover:bg-primary dark:hover:text-primary-foreground dark:focus:bg-primary dark:focus:text-primary-foreground">Instruções Pós-Consulta</SelectItem>
<SelectItem value="outro" className="hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground cursor-pointer">Outro</SelectItem> <SelectItem value="outro" className="hover:bg-blue-50 focus:bg-blue-50 cursor-pointer dark:hover:bg-primary dark:hover:text-primary-foreground dark:focus:bg-primary dark:focus:text-primary-foreground">Outro</SelectItem>
</SelectContent> </SelectContent>
</Select> </Select>
</div> </div>
@ -3183,7 +3183,7 @@ Nevo melanocítico benigno. Seguimento clínico recomendado.
<Button <Button
variant="outline" variant="outline"
onClick={logout} onClick={logout}
className="text-red-600 border-red-600 hover:bg-red-600 hover:text-white cursor-pointer" className="text-red-600 border-red-600 hover:bg-red-50 cursor-pointer dark:hover:bg-red-600 dark:hover:text-white"
> >
Sair Sair
</Button> </Button>
@ -3195,7 +3195,11 @@ Nevo melanocítico benigno. Seguimento clínico recomendado.
<nav className="bg-card shadow-md rounded-lg p-3 space-y-1"> <nav className="bg-card shadow-md rounded-lg p-3 space-y-1">
<Button <Button
variant={activeSection === 'calendario' ? 'default' : 'ghost'} variant={activeSection === 'calendario' ? 'default' : 'ghost'}
className="w-full justify-start hover:bg-primary hover:text-primary-foreground cursor-pointer" className={`w-full justify-start cursor-pointer ${
activeSection === 'calendario'
? 'bg-blue-600 text-white hover:bg-blue-700 dark:bg-primary dark:text-primary-foreground dark:hover:bg-primary/90'
: 'hover:bg-blue-50 dark:hover:bg-primary dark:hover:text-primary-foreground'
}`}
onClick={() => setActiveSection('calendario')} onClick={() => setActiveSection('calendario')}
> >
<CalendarIcon className="mr-2 h-4 w-4" /> <CalendarIcon className="mr-2 h-4 w-4" />
@ -3203,7 +3207,11 @@ Nevo melanocítico benigno. Seguimento clínico recomendado.
</Button> </Button>
<Button <Button
variant={activeSection === 'pacientes' ? 'default' : 'ghost'} variant={activeSection === 'pacientes' ? 'default' : 'ghost'}
className="w-full justify-start hover:bg-primary hover:text-primary-foreground cursor-pointer" className={`w-full justify-start cursor-pointer ${
activeSection === 'pacientes'
? 'bg-blue-600 text-white hover:bg-blue-700 dark:bg-primary dark:text-primary-foreground dark:hover:bg-primary/90'
: 'hover:bg-blue-50 dark:hover:bg-primary dark:hover:text-primary-foreground'
}`}
onClick={() => setActiveSection('pacientes')} onClick={() => setActiveSection('pacientes')}
> >
<Users className="mr-2 h-4 w-4" /> <Users className="mr-2 h-4 w-4" />
@ -3211,7 +3219,11 @@ Nevo melanocítico benigno. Seguimento clínico recomendado.
</Button> </Button>
<Button <Button
variant={activeSection === 'prontuario' ? 'default' : 'ghost'} variant={activeSection === 'prontuario' ? 'default' : 'ghost'}
className="w-full justify-start hover:bg-primary hover:text-primary-foreground cursor-pointer" className={`w-full justify-start cursor-pointer ${
activeSection === 'prontuario'
? 'bg-blue-600 text-white hover:bg-blue-700 dark:bg-primary dark:text-primary-foreground dark:hover:bg-primary/90'
: 'hover:bg-blue-50 dark:hover:bg-primary dark:hover:text-primary-foreground'
}`}
onClick={() => setActiveSection('prontuario')} onClick={() => setActiveSection('prontuario')}
> >
<ClipboardList className="mr-2 h-4 w-4" /> <ClipboardList className="mr-2 h-4 w-4" />
@ -3219,7 +3231,11 @@ Nevo melanocítico benigno. Seguimento clínico recomendado.
</Button> </Button>
<Button <Button
variant={activeSection === 'laudos' ? 'default' : 'ghost'} variant={activeSection === 'laudos' ? 'default' : 'ghost'}
className="w-full justify-start hover:bg-primary hover:text-primary-foreground cursor-pointer" className={`w-full justify-start cursor-pointer ${
activeSection === 'laudos'
? 'bg-blue-600 text-white hover:bg-blue-700 dark:bg-primary dark:text-primary-foreground dark:hover:bg-primary/90'
: 'hover:bg-blue-50 dark:hover:bg-primary dark:hover:text-primary-foreground'
}`}
onClick={() => setActiveSection('laudos')} onClick={() => setActiveSection('laudos')}
> >
<FileText className="mr-2 h-4 w-4" /> <FileText className="mr-2 h-4 w-4" />
@ -3227,7 +3243,11 @@ Nevo melanocítico benigno. Seguimento clínico recomendado.
</Button> </Button>
<Button <Button
variant={activeSection === 'comunicacao' ? 'default' : 'ghost'} variant={activeSection === 'comunicacao' ? 'default' : 'ghost'}
className="w-full justify-start hover:bg-primary hover:text-primary-foreground cursor-pointer" className={`w-full justify-start cursor-pointer ${
activeSection === 'comunicacao'
? 'bg-blue-600 text-white hover:bg-blue-700 dark:bg-primary dark:text-primary-foreground dark:hover:bg-primary/90'
: 'hover:bg-blue-50 dark:hover:bg-primary dark:hover:text-primary-foreground'
}`}
onClick={() => setActiveSection('comunicacao')} onClick={() => setActiveSection('comunicacao')}
> >
<MessageSquare className="mr-2 h-4 w-4" /> <MessageSquare className="mr-2 h-4 w-4" />
@ -3235,7 +3255,11 @@ Nevo melanocítico benigno. Seguimento clínico recomendado.
</Button> </Button>
<Button <Button
variant={activeSection === 'relatorios-medicos' ? 'default' : 'ghost'} variant={activeSection === 'relatorios-medicos' ? 'default' : 'ghost'}
className="w-full justify-start hover:bg-primary hover:text-primary-foreground cursor-pointer" className={`w-full justify-start cursor-pointer ${
activeSection === 'relatorios-medicos'
? 'bg-blue-600 text-white hover:bg-blue-700 dark:bg-primary dark:text-primary-foreground dark:hover:bg-primary/90'
: 'hover:bg-blue-50 dark:hover:bg-primary dark:hover:text-primary-foreground'
}`}
onClick={() => setActiveSection('relatorios-medicos')} onClick={() => setActiveSection('relatorios-medicos')}
> >
<FileCheck className="mr-2 h-4 w-4" /> <FileCheck className="mr-2 h-4 w-4" />
@ -3243,7 +3267,11 @@ Nevo melanocítico benigno. Seguimento clínico recomendado.
</Button> </Button>
<Button <Button
variant={activeSection === 'perfil' ? 'default' : 'ghost'} variant={activeSection === 'perfil' ? 'default' : 'ghost'}
className="w-full justify-start cursor-pointer hover:bg-primary hover:text-primary-foreground cursor-pointer" className={`w-full justify-start cursor-pointer ${
activeSection === 'perfil'
? 'bg-blue-600 text-white hover:bg-blue-700 dark:bg-primary dark:text-primary-foreground dark:hover:bg-primary/90'
: 'hover:bg-blue-50 dark:hover:bg-primary dark:hover:text-primary-foreground'
}`}
onClick={() => setActiveSection('perfil')} onClick={() => setActiveSection('perfil')}
> >
<Settings className="mr-2 h-4 w-4" /> <Settings className="mr-2 h-4 w-4" />