From 173c1c777e89f283ade8bd1b5059a27022cf0091 Mon Sep 17 00:00:00 2001
From: VPS 4 Builder <deploy@clube67.com>
Date: Thu, 14 May 2026 17:22:41 +0200
Subject: [PATCH] =?UTF-8?q?fix(ui):=20modais=20responsivos=20=E2=80=94=209?=
 =?UTF-8?q?6=C3=9798=20em=20desktop,=20tela=20cheia=20em=20mobile?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/components/AgendaSettingsModal.tsx |  6 ++--
 frontend/views/AdminViews.tsx               | 22 ++++++------
 frontend/views/AgendaView.tsx               |  8 ++---
 frontend/views/FinanceiroView.tsx           |  4 +--
 frontend/views/LeadsView.tsx                |  8 ++---
 frontend/views/OrthoView.tsx                |  4 +--
 frontend/views/PatientsView.tsx             | 40 ++++++++++-----------
 frontend/views/PedidoExameModal.tsx         |  8 ++---
 frontend/views/ReceitaModal.tsx             |  4 +--
 9 files changed, 52 insertions(+), 52 deletions(-)

diff --git a/frontend/components/AgendaSettingsModal.tsx b/frontend/components/AgendaSettingsModal.tsx
index c87b224..dc2b548 100644
--- a/frontend/components/AgendaSettingsModal.tsx
+++ b/frontend/components/AgendaSettingsModal.tsx
@@ -79,8 +79,8 @@ export const AgendaSettingsModal: React.FC<AgendaSettingsModalProps> = ({ isOpen
     const totalPages = 3;
 
     return (
-        <div className="fixed inset-0 bg-black/60 z-[60] flex items-center justify-center backdrop-blur-md p-4">
-            <div className="bg-white rounded-[2.5rem] shadow-2xl w-full max-w-2xl overflow-hidden animate-in fade-in zoom-in-95 duration-300 flex flex-col h-[550px] border border-gray-100">
+        <div className="fixed inset-0 bg-black/60 z-[60] flex items-center justify-center backdrop-blur-md p-0">
+            <div className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-[2.5rem] flex flex-col overflow-hidden border border-gray-100 animate-in fade-in zoom-in-95 duration-300">
 
                 {/* Header */}
                 <div className="px-10 py-8 border-b border-gray-50 flex justify-between items-center bg-gradient-to-br from-gray-50 to-white">
@@ -220,7 +220,7 @@ export const AgendaSettingsModal: React.FC<AgendaSettingsModalProps> = ({ isOpen
                                 </a>
                             </div>
 
-                            <div className="space-y-4 max-h-[250px] overflow-y-auto pr-4 custom-scrollbar">
+                            <div className="space-y-4 flex-1 overflow-y-auto pr-4 custom-scrollbar">
                                 <div className="bg-blue-50/50 p-4 rounded-2xl border border-blue-100 mb-2">
                                     <p className="text-[10px] text-blue-800 font-bold mb-1 uppercase tracking-wider">Nova Integração Inteligente (OAuth2)</p>
                                     <p className="text-[10px] text-blue-600 italic">Agora você pode conectar agendas sem precisar torná-las públicas ou usar API Keys.</p>
diff --git a/frontend/views/AdminViews.tsx b/frontend/views/AdminViews.tsx
index fc3ac43..7510024 100644
--- a/frontend/views/AdminViews.tsx
+++ b/frontend/views/AdminViews.tsx
@@ -44,8 +44,8 @@ const DentistHoursModal: React.FC<{ dentist: Dentista; clinicaId: string; onClos
     };
 
     return (
-        <div className="fixed inset-0 bg-black/60 z-[60] flex items-center justify-center backdrop-blur-sm p-4">
-            <div className="bg-white rounded-2xl shadow-2xl w-full max-w-2xl overflow-hidden animate-in zoom-in-95 duration-200">
+        <div className="fixed inset-0 bg-black/60 z-[60] flex items-center justify-center backdrop-blur-sm p-0">
+            <div className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-2xl flex flex-col overflow-hidden animate-in zoom-in-95 duration-200">
                 <div className="px-6 py-4 border-b border-gray-100 flex justify-between items-center bg-gray-50">
                     <div>
                         <h3 className="text-lg font-black text-gray-900 uppercase leading-tight">ESCALA DE ATENDIMENTO</h3>
@@ -65,7 +65,7 @@ const DentistHoursModal: React.FC<{ dentist: Dentista; clinicaId: string; onClos
                         </button>
                     </form>
 
-                    <div className="space-y-2 max-h-[40vh] overflow-y-auto pr-2">
+                    <div className="space-y-2 flex-1 overflow-y-auto pr-2">
                         {horarios?.map(h => (
                             <div key={h.id} className="flex items-center justify-between p-3 bg-gray-50 rounded-xl border border-gray-100 hover:border-blue-200 transition-all group">
                                 <div className="flex items-center gap-4">
@@ -225,8 +225,8 @@ export const DentistasView: React.FC = () => {
             </div>
 
             {isModalOpen && (
-                <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-2 lg:p-0">
-                    <div className="bg-white rounded-xl shadow-2xl w-full max-w-md lg:max-w-none lg:w-[90vw] lg:h-[98vh] animate-in fade-in zoom-in-50 duration-200 flex flex-col overflow-hidden">
+                <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-0">
+                    <div className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-xl flex flex-col overflow-hidden animate-in fade-in zoom-in-50 duration-200">
                         <div className="px-5 py-4 border-b border-gray-200 flex justify-between items-center flex-shrink-0 bg-gradient-to-r from-blue-50 to-white">
                             <h3 className="text-lg font-bold text-gray-800 uppercase">{editingDentista?.id ? 'EDITAR' : 'NOVO'} DENTISTA</h3>
                             <button onClick={() => setIsModalOpen(false)} className="text-gray-400 hover:text-gray-600 hover:bg-gray-100 rounded-lg p-1.5 transition-colors"><X size={22} /></button>
@@ -385,8 +385,8 @@ export const EspecialidadesView: React.FC = () => {
             </div>
 
             {isModalOpen && (
-                <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-2 lg:p-0">
-                    <div className="bg-white rounded-xl shadow-2xl w-full max-w-md lg:max-w-none lg:w-[90vw] lg:h-[98vh] animate-in fade-in zoom-in-50 duration-200 flex flex-col overflow-hidden">
+                <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-0">
+                    <div className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-xl flex flex-col overflow-hidden animate-in fade-in zoom-in-50 duration-200">
                         <div className="px-5 py-4 border-b border-gray-200 flex justify-between items-center flex-shrink-0 bg-gradient-to-r from-blue-50 to-white">
                             <h3 className="text-lg font-bold text-gray-800 uppercase">{editingEsp?.id ? 'EDITAR' : 'NOVA'} ESPECIALIDADE</h3>
                             <button onClick={() => setIsModalOpen(false)} className="text-gray-400 hover:text-gray-600 hover:bg-gray-100 rounded-lg p-1.5 transition-colors"><X size={22} /></button>
@@ -583,8 +583,8 @@ export const ProcedimentosView: React.FC = () => {
             </div>
 
             {isModalOpen && (
-                <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-2 lg:p-0">
-                    <div className="bg-white rounded-xl shadow-2xl w-full max-w-md lg:max-w-none lg:w-[90vw] lg:h-[98vh] animate-in fade-in zoom-in-50 duration-200 flex flex-col overflow-hidden">
+                <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-0">
+                    <div className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-xl flex flex-col overflow-hidden animate-in fade-in zoom-in-50 duration-200">
                         <div className="px-5 py-4 border-b border-gray-200 flex justify-between items-center flex-shrink-0 bg-gradient-to-r from-blue-50 to-white">
                             <h3 className="text-lg font-bold text-gray-800 uppercase">{editingProcedimento?.id ? 'EDITAR' : 'NOVO'} PROCEDIMENTO</h3>
                             <button onClick={() => setIsModalOpen(false)} className="text-gray-400 hover:text-gray-600 hover:bg-gray-100 rounded-lg p-1.5 transition-colors"><X size={22} /></button>
@@ -818,8 +818,8 @@ export const PlanosView: React.FC = () => {
             </div>
 
             {isModalOpen && (
-                <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-2 lg:p-0">
-                    <div className="bg-white rounded-xl shadow-2xl w-full max-w-md lg:max-w-none lg:w-[90vw] lg:h-[98vh] animate-in fade-in zoom-in-50 duration-200 flex flex-col overflow-hidden">
+                <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-0">
+                    <div className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-xl flex flex-col overflow-hidden animate-in fade-in zoom-in-50 duration-200">
                         <div className="px-5 py-4 border-b border-gray-200 flex justify-between items-center flex-shrink-0 bg-gradient-to-r from-blue-50 to-white">
                             <h3 className="text-lg font-bold text-gray-800 uppercase">{editingPlano?.id ? 'EDITAR' : 'NOVO'} PLANO</h3>
                             <button onClick={() => setIsModalOpen(false)} className="text-gray-400 hover:text-gray-600 hover:bg-gray-100 rounded-lg p-1.5 transition-colors"><X size={22} /></button>
diff --git a/frontend/views/AgendaView.tsx b/frontend/views/AgendaView.tsx
index 8b4046c..fcd6076 100644
--- a/frontend/views/AgendaView.tsx
+++ b/frontend/views/AgendaView.tsx
@@ -178,8 +178,8 @@ const AppointmentModal: React.FC<{
     if (!isOpen) return null;
 
     return (
-        <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-2 lg:p-0">
-            <form onSubmit={handleSubmit} className="bg-white rounded-xl shadow-2xl w-full max-w-md lg:max-w-none lg:w-[90vw] lg:h-[98vh] animate-in fade-in zoom-in-50 duration-200 flex flex-col overflow-hidden">
+        <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-0">
+            <form onSubmit={handleSubmit} className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-xl flex flex-col overflow-hidden animate-in fade-in zoom-in-50 duration-200">
                 <div className="px-5 py-4 border-b border-gray-200 flex justify-between items-center flex-shrink-0 bg-gradient-to-r from-orange-50 to-white">
                     <h2 className="text-lg font-bold text-gray-800 flex items-center gap-2 uppercase">
                         <CalendarIcon size={22} className="text-orange-500" /> AGENDAR CONSULTA
@@ -457,8 +457,8 @@ export const AgendaView: React.FC = () => {
 
             {/* Event Details "Popover" (Modal style for real estate) */}
             {showDetails && selectedAppointment && (
-                <div className="fixed inset-0 bg-black/40 z-[70] flex items-center justify-center backdrop-blur-sm p-4 animate-in fade-in duration-200">
-                    <div className="bg-white rounded-[2rem] shadow-2xl w-full max-w-lg overflow-hidden border border-gray-100">
+                <div className="fixed inset-0 bg-black/40 z-[70] flex items-center justify-center backdrop-blur-sm p-0 animate-in fade-in duration-200">
+                    <div className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-[2rem] flex flex-col overflow-hidden border border-gray-100">
                         {/* Header with quick actions */}
                         <div className="px-8 py-6 border-b border-gray-50 flex justify-between items-center bg-gray-50/30">
                             <div className="flex gap-2">
diff --git a/frontend/views/FinanceiroView.tsx b/frontend/views/FinanceiroView.tsx
index 56f243c..59f9d4e 100644
--- a/frontend/views/FinanceiroView.tsx
+++ b/frontend/views/FinanceiroView.tsx
@@ -79,8 +79,8 @@ const NovoLancamentoModal: React.FC<{
     };
 
     return (
-        <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-2 lg:p-0">
-            <form onSubmit={handleSubmit} className="bg-white rounded-xl shadow-2xl w-full max-w-md lg:max-w-3xl lg:w-[70vw] animate-in fade-in zoom-in-50 duration-200 flex flex-col overflow-hidden">
+        <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-0">
+            <form onSubmit={handleSubmit} className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-xl flex flex-col overflow-hidden animate-in fade-in zoom-in-50 duration-200">
                 {/* HEADER */}
                 <div className="px-5 py-4 border-b border-gray-200 flex justify-between items-center flex-shrink-0 bg-gradient-to-r from-green-50 to-white">
                     <h2 className="text-lg font-bold text-gray-800 flex items-center gap-2">
diff --git a/frontend/views/LeadsView.tsx b/frontend/views/LeadsView.tsx
index 6ee720f..77af193 100644
--- a/frontend/views/LeadsView.tsx
+++ b/frontend/views/LeadsView.tsx
@@ -48,8 +48,8 @@ const NovoLeadModal: React.FC<{ onClose: () => void; onSaved: () => void }> = ({
     };
 
     return (
-        <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-2 lg:p-0">
-            <div className="bg-white rounded-xl shadow-2xl w-full max-w-md lg:max-w-none lg:w-[90vw] lg:h-[98vh] animate-in fade-in zoom-in-50 duration-200 flex flex-col overflow-hidden">
+        <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-0">
+            <div className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-xl flex flex-col overflow-hidden animate-in fade-in zoom-in-50 duration-200">
                 <div className="px-5 py-4 border-b border-gray-200 flex justify-between items-center flex-shrink-0 bg-gradient-to-r from-green-50 to-white">
                     <h2 className="text-base font-bold text-gray-800 uppercase flex items-center gap-2">
                         <UserPlus size={18} className="text-green-500" /> CADASTRAR NOVO LEAD
@@ -251,8 +251,8 @@ export const LeadsView: React.FC = () => {
             </div>
 
             {isConvertModalOpen && selectedLead && (
-                <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-2 lg:p-0">
-                    <div className="bg-white rounded-xl shadow-2xl w-full max-w-md lg:max-w-none lg:w-[90vw] lg:h-[98vh] animate-in fade-in zoom-in-50 duration-200 flex flex-col overflow-hidden">
+                <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-0">
+                    <div className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-xl flex flex-col overflow-hidden animate-in fade-in zoom-in-50 duration-200">
                         <div className="px-5 py-4 border-b border-gray-200 flex justify-between items-center flex-shrink-0 bg-gradient-to-r from-blue-50 to-white">
                             <h3 className="text-lg font-bold text-gray-800 uppercase flex items-center gap-2">
                                 <UserPlus size={18} className="text-blue-500" /> CONVERTER LEAD
diff --git a/frontend/views/OrthoView.tsx b/frontend/views/OrthoView.tsx
index e1cf30c..5954410 100644
--- a/frontend/views/OrthoView.tsx
+++ b/frontend/views/OrthoView.tsx
@@ -829,8 +829,8 @@ const OrthoDetailPanel: React.FC<{ treatment: TratamentoOrto; onClose: () => voi
   }, [onClose]);
 
   return (
-    <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-2 lg:p-0">
-      <div className="bg-gray-50 rounded-xl shadow-2xl w-full max-w-md lg:max-w-none lg:w-[94vw] lg:h-[98vh] animate-in fade-in zoom-in-50 duration-200 flex flex-col overflow-hidden">
+    <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-0">
+      <div className="bg-gray-50 shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-xl flex flex-col overflow-hidden animate-in fade-in zoom-in-50 duration-200">
         {/* Top bar */}
         <div className="px-5 py-3 border-b border-gray-200 flex justify-between items-center flex-shrink-0 bg-white">
           <button onClick={onClose} className="flex items-center gap-2 text-gray-500 hover:text-gray-800 text-xs font-bold uppercase transition-colors">
diff --git a/frontend/views/PatientsView.tsx b/frontend/views/PatientsView.tsx
index 2dc48fe..bb7a009 100644
--- a/frontend/views/PatientsView.tsx
+++ b/frontend/views/PatientsView.tsx
@@ -99,8 +99,8 @@ const FamiliaModal: React.FC<{ paciente: Paciente; onClose: () => void }> = ({ p
     }, [onClose]);
 
     return (
-        <div className="fixed inset-0 bg-black/40 z-50 flex items-center justify-center backdrop-blur-sm p-4">
-            <div className="bg-white rounded-2xl shadow-2xl w-full max-w-sm animate-in fade-in zoom-in-50 duration-200">
+        <div className="fixed inset-0 bg-black/40 z-50 flex items-center justify-center backdrop-blur-sm p-0">
+            <div className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-2xl flex flex-col animate-in fade-in zoom-in-50 duration-200">
                 <div className="p-5 border-b border-gray-100 flex items-center justify-between">
                     <div className="flex items-center gap-2">
                         <div className="w-8 h-8 bg-indigo-100 rounded-lg flex items-center justify-center">
@@ -219,8 +219,8 @@ const AgendamentoModal: React.FC<{ patient: Paciente, onClose: () => void }> = (
     };
 
     return (
-        <div className="fixed inset-0 bg-black bg-opacity-40 z-50 flex items-center justify-center backdrop-blur-sm p-4">
-            <form onSubmit={handleSubmit} className="bg-white rounded-xl shadow-2xl w-full max-w-lg animate-in fade-in zoom-in-50 duration-200">
+        <div className="fixed inset-0 bg-black bg-opacity-40 z-50 flex items-center justify-center backdrop-blur-sm p-0">
+            <form onSubmit={handleSubmit} className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-xl flex flex-col animate-in fade-in zoom-in-50 duration-200">
                 <div className="p-5 border-b border-gray-200">
                     <div className="flex justify-between items-center">
                         <h2 className="text-lg font-bold text-gray-800 flex items-center gap-2">
@@ -229,7 +229,7 @@ const AgendamentoModal: React.FC<{ patient: Paciente, onClose: () => void }> = (
                         <button type="button" onClick={onClose} className="text-gray-400 hover:text-gray-600"><X size={20} /></button>
                     </div>
                 </div>
-                <div className="p-6 space-y-4">
+                <div className="flex-1 overflow-y-auto p-6 space-y-4">
                     <div>
                         <label className="text-xs font-bold text-gray-500 uppercase">PACIENTE</label>
                         <div className="w-full bg-gray-100 p-3 rounded-lg mt-1 font-bold text-gray-800 uppercase">{patient.nome}</div>
@@ -319,15 +319,15 @@ const NovoPacienteModal: React.FC<{ onClose: () => void; onSaved: () => void }>
     const input = "w-full border border-gray-200 rounded-lg p-2.5 text-sm focus:ring-2 focus:ring-blue-100 focus:border-blue-300 outline-none";
 
     return (
-        <div className="fixed inset-0 bg-black/40 z-50 flex items-center justify-center backdrop-blur-sm p-4">
-            <div className="bg-white rounded-2xl shadow-2xl w-full max-w-lg animate-in fade-in zoom-in-50 duration-200">
+        <div className="fixed inset-0 bg-black/40 z-50 flex items-center justify-center backdrop-blur-sm p-0">
+            <div className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-2xl flex flex-col animate-in fade-in zoom-in-50 duration-200">
                 <div className="p-5 border-b border-gray-100 flex justify-between items-center">
                     <h2 className="text-sm font-black text-gray-800 uppercase flex items-center gap-2">
                         <Plus size={16} className="text-green-500" /> Novo Paciente
                     </h2>
                     <button onClick={onClose} className="text-gray-400 hover:text-gray-600"><X size={18} /></button>
                 </div>
-                <form onSubmit={handleSubmit} className="p-5 space-y-4 max-h-[80vh] overflow-y-auto">
+                <form onSubmit={handleSubmit} className="flex-1 overflow-y-auto p-5 space-y-4">
                     <div>
                         <label className="block text-[10px] font-black text-gray-500 uppercase tracking-wider mb-1">Nome Completo *</label>
                         <input required value={form.nome} onChange={e => setForm(f => ({ ...f, nome: e.target.value.toUpperCase() }))} className={input} placeholder="NOME COMPLETO" />
@@ -435,13 +435,13 @@ const HistoricoModal: React.FC<{ patient: Paciente; onClose: () => void }> = ({
     }, [onClose]);
 
     return (
-        <div className="fixed inset-0 bg-black bg-opacity-40 z-50 flex items-center justify-center backdrop-blur-sm p-4">
-            <div className="bg-white rounded-xl shadow-2xl w-full max-w-lg animate-in fade-in zoom-in-50 duration-200">
+        <div className="fixed inset-0 bg-black bg-opacity-40 z-50 flex items-center justify-center backdrop-blur-sm p-0">
+            <div className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-xl flex flex-col animate-in fade-in zoom-in-50 duration-200">
                 <div className="p-5 border-b border-gray-200 flex justify-between items-center">
                     <h2 className="text-base font-bold text-gray-800 uppercase">HISTÓRICO — {patient.nome}</h2>
                     <button onClick={onClose} className="text-gray-400 hover:text-gray-600"><X size={20} /></button>
                 </div>
-                <div className="p-4 max-h-96 overflow-y-auto space-y-2">
+                <div className="flex-1 overflow-y-auto p-4 space-y-2">
                     {isLoading && <p className="text-center text-gray-400 text-sm">CARREGANDO...</p>}
                     {!isLoading && meus.length === 0 && <p className="text-center text-gray-400 text-sm py-6">NENHUM AGENDAMENTO ENCONTRADO.</p>}
                     {meus.map(a => (
@@ -507,8 +507,8 @@ const EditarPacienteModal: React.FC<{ patient: Paciente; onClose: () => void; on
     const inp = "w-full border border-gray-200 rounded-lg p-2.5 text-sm focus:ring-2 focus:ring-blue-100 focus:border-blue-300 outline-none";
 
     return (
-        <div className="fixed inset-0 bg-black/40 z-50 flex items-center justify-center backdrop-blur-sm p-4">
-            <div className="bg-white rounded-2xl shadow-2xl w-full max-w-2xl flex flex-col max-h-[90vh] animate-in fade-in zoom-in-50 duration-200">
+        <div className="fixed inset-0 bg-black/40 z-50 flex items-center justify-center backdrop-blur-sm p-0">
+            <div className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-2xl flex flex-col animate-in fade-in zoom-in-50 duration-200">
 
                 {/* Header */}
                 <div className="p-5 border-b border-gray-100 flex justify-between items-center flex-shrink-0">
@@ -944,8 +944,8 @@ export const PatientsView: React.FC = () => {
 
             {/* MODAL MENU CLÍNICO */}
             {modal.type === 'clinical' && modal.patient && (
-                <div className="fixed inset-0 bg-black bg-opacity-40 z-50 flex items-center justify-center backdrop-blur-sm">
-                    <div className="bg-white rounded-2xl shadow-2xl w-full max-w-lg p-6 animate-in fade-in zoom-in-50 duration-200">
+                <div className="fixed inset-0 bg-black bg-opacity-40 z-50 flex items-center justify-center backdrop-blur-sm p-0">
+                    <div className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-2xl flex flex-col p-6 animate-in fade-in zoom-in-50 duration-200">
                         <div className="flex justify-between items-center mb-2">
                             <div className="flex items-center gap-3 text-gray-700 font-bold text-xl"><FolderOpen size={28} className="text-gray-400" />Menu Clínico</div>
                             <button onClick={closeModal} className="text-gray-400 hover:text-gray-600"><X size={20} /></button>
@@ -979,8 +979,8 @@ export const PatientsView: React.FC = () => {
 
             {/* MODAL MENU FINANCEIRO */}
             {modal.type === 'financial' && modal.patient && (
-                <div className="fixed inset-0 bg-black bg-opacity-40 z-50 flex items-center justify-center backdrop-blur-sm">
-                    <div className="bg-white rounded-2xl shadow-2xl w-full max-w-lg p-6 animate-in fade-in zoom-in-50 duration-200">
+                <div className="fixed inset-0 bg-black bg-opacity-40 z-50 flex items-center justify-center backdrop-blur-sm p-0">
+                    <div className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-2xl flex flex-col p-6 animate-in fade-in zoom-in-50 duration-200">
                         <div className="flex justify-between items-center mb-2">
                             <div className="flex items-center gap-3 text-gray-700 font-bold text-xl"><Wallet size={28} className="text-gray-400" />Menu Financeiro</div>
                             <button onClick={closeModal} className="text-gray-400 hover:text-gray-600"><X size={20} /></button>
@@ -998,8 +998,8 @@ export const PatientsView: React.FC = () => {
 
             {/* ASAAS MODAL */}
             {modal.type === 'asaas' && modal.patient && (
-                <div className="fixed inset-0 bg-black bg-opacity-40 z-50 flex items-center justify-center backdrop-blur-sm overflow-y-auto p-4">
-                    <div className="bg-white rounded-xl shadow-2xl w-full max-w-2xl animate-in fade-in zoom-in-50 duration-200">
+                <div className="fixed inset-0 bg-black bg-opacity-40 z-50 flex items-center justify-center backdrop-blur-sm p-0">
+                    <div className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-xl flex flex-col animate-in fade-in zoom-in-50 duration-200">
                         <form onSubmit={handleAsaasSubmit}>
                             <div className="p-6 border-b border-gray-200">
                                 <div className="flex justify-between items-start">
@@ -1017,7 +1017,7 @@ export const PatientsView: React.FC = () => {
                                     <button type="button" onClick={closeModal} className="text-gray-400 hover:text-gray-600"><X size={20} /></button>
                                 </div>
                             </div>
-                            <div className="p-6 space-y-4">
+                            <div className="flex-1 overflow-y-auto p-6 space-y-4">
                                 <div>
                                     <label className="block text-xs font-bold text-gray-500 mb-1 uppercase">TRATAMENTO</label>
                                     <input type="text" name="tratamento" value={asaasForm.tratamento} onChange={handleAsaasFormChange} placeholder="EX: ORTODONTIA COMPLETA" className="w-full border border-gray-300 rounded-md p-2 text-sm uppercase-input" />
diff --git a/frontend/views/PedidoExameModal.tsx b/frontend/views/PedidoExameModal.tsx
index 1f873f9..2bc5f12 100644
--- a/frontend/views/PedidoExameModal.tsx
+++ b/frontend/views/PedidoExameModal.tsx
@@ -248,8 +248,8 @@ export const PedidoExameModal: React.FC<{ paciente: Paciente; onClose: () => voi
 
     if (view === 'print') {
         return (
-            <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-3">
-                <div className="bg-white rounded-2xl shadow-2xl w-full max-w-3xl h-[85vh] flex flex-col overflow-hidden">
+            <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-0">
+                <div className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-2xl flex flex-col overflow-hidden">
                     <PrintView pedido={pedidoParaImprimir} dentista={dentistaPrincipal} onClose={() => setView('editor')} />
                 </div>
             </div>
@@ -257,8 +257,8 @@ export const PedidoExameModal: React.FC<{ paciente: Paciente; onClose: () => voi
     }
 
     return (
-        <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-3">
-            <div className="bg-white rounded-2xl shadow-2xl w-full max-w-4xl h-[90vh] flex flex-col overflow-hidden animate-in fade-in zoom-in-95 duration-200">
+        <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-0">
+            <div className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-2xl flex flex-col overflow-hidden animate-in fade-in zoom-in-95 duration-200">
 
                 {/* Header */}
                 <div className="p-5 border-b border-gray-100 flex items-center justify-between flex-shrink-0">
diff --git a/frontend/views/ReceitaModal.tsx b/frontend/views/ReceitaModal.tsx
index a61b764..12c5bb3 100644
--- a/frontend/views/ReceitaModal.tsx
+++ b/frontend/views/ReceitaModal.tsx
@@ -320,8 +320,8 @@ export const ReceitaModal: React.FC<{ paciente: Paciente; onClose: () => void }>
     });
 
     return (
-        <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-3">
-            <div className="bg-white rounded-2xl shadow-2xl w-full max-w-3xl h-[85vh] flex flex-col overflow-hidden animate-in fade-in zoom-in-95 duration-200">
+        <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center backdrop-blur-sm p-0">
+            <div className="bg-white shadow-2xl w-full h-dvh md:w-[96vw] md:h-[98vh] rounded-none md:rounded-2xl flex flex-col overflow-hidden animate-in fade-in zoom-in-95 duration-200">
 
                 {view === 'lista' && (
                     <>