/* inicioPaciente.css */ .dashboard-paciente-container { padding: 2rem; background-color: #f7f9fc; flex-grow: 1; min-height: 100vh; } /* Header - Paciente */ .dashboard-paciente-header { margin-bottom: 2rem; } .dashboard-paciente-header h1 { font-size: 2rem; font-weight: 600; color: #333; margin-bottom: 0.5rem; } .dashboard-paciente-header p { font-size: 1rem; color: #666; } /* Estatísticas - Paciente */ .stats-paciente-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.5rem; margin-bottom: 2.5rem; } .stat-paciente-card { background-color: #fff; border-radius: 12px; padding: 1.5rem; display: flex; justify-content: space-between; align-items: center; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05); transition: transform 0.2s ease, box-shadow 0.2s ease; } .stat-paciente-card:hover { transform: translateY(-3px); box-shadow: 0 6px 15px rgba(0, 0, 0, 0.1); } .stat-paciente-info { display: flex; flex-direction: column; } .stat-paciente-label { font-size: 0.75rem; font-weight: 600; color: #888; margin-bottom: 0.5rem; text-transform: uppercase; letter-spacing: 0.5px; } .stat-paciente-value { font-size: 2.2rem; font-weight: 700; color: #444; } .stat-paciente-icon-wrapper { width: 55px; height: 55px; border-radius: 50%; display: flex; justify-content: center; align-items: center; } .stat-paciente-icon { font-size: 1.4rem; color: #fff; } /* Cores dos ícones - Paciente */ .stat-paciente-icon-wrapper.blue { background-color: #5d5dff; } .stat-paciente-icon-wrapper.green { background-color: #30d158; } .stat-paciente-icon-wrapper.purple { background-color: #a272ff; } .stat-paciente-icon-wrapper.orange { background-color: #f1952e; } /* Ações Rápidas - Paciente */ .quick-actions-paciente h2 { font-size: 1.3rem; font-weight: 600; color: #333; margin-bottom: 1.5rem; } .actions-paciente-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; margin-bottom: 2.5rem; } .action-paciente-button { background-color: #fff; border-radius: 12px; padding: 1.5rem; display: flex; align-items: center; cursor: pointer; transition: all 0.2s ease-in-out; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05); } .action-paciente-button:hover { transform: translateY(-5px); box-shadow: 0 6px 15px rgba(0, 0, 0, 0.12); } .action-paciente-icon { font-size: 2.5rem; margin-right: 1.2rem; color: #5d5dff; } .action-paciente-info { display: flex; flex-direction: column; } .action-paciente-title { font-size: 1.05rem; font-weight: 600; color: #444; margin-bottom: 0.25rem; } .action-paciente-desc { font-size: 0.85rem; color: #888; } /* Próximas Consultas - Paciente */ .proximas-consultas-section { background-color: #fff; border-radius: 12px; padding: 2rem; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05); } .proximas-consultas-section h2 { font-size: 1.3rem; font-weight: 600; color: #333; margin-bottom: 1.5rem; } /* Lista de Consultas - Paciente */ .consultas-paciente-list { display: flex; flex-direction: column; gap: 1.2rem; } .consulta-paciente-item { background: linear-gradient(135deg, #f9fafb 0%, #ffffff 100%); border-left: 5px solid #5d5dff; border-radius: 10px; padding: 1.25rem 1.5rem; transition: all 0.3s ease; } .consulta-paciente-item:hover { background: linear-gradient(135deg, #f0f2f5 0%, #fafbfc 100%); transform: translateX(8px); box-shadow: 0 4px 12px rgba(93, 93, 255, 0.15); } .consulta-paciente-info { display: flex; align-items: center; gap: 2rem; flex-wrap: wrap; } .consulta-paciente-time-date { display: flex; flex-direction: column; align-items: center; min-width: 90px; padding: 0.5rem; background-color: #f0f2ff; border-radius: 8px; } .consulta-paciente-hora { font-size: 1.5rem; font-weight: 700; color: #5d5dff; margin: 0; line-height: 1.2; } .consulta-paciente-data { font-size: 0.8rem; font-weight: 500; color: #7777aa; margin: 0; margin-top: 0.25rem; text-transform: capitalize; } .consulta-paciente-detalhes { display: flex; flex-direction: column; gap: 0.5rem; flex: 1; min-width: 250px; } .consulta-paciente-medico { font-size: 1rem; color: #444; margin: 0; display: flex; align-items: center; gap: 0.5rem; } .consulta-icon { color: #5d5dff; font-size: 1.1rem; } .consulta-paciente-medico strong { font-weight: 600; color: #333; } .consulta-paciente-especialidade { font-size: 0.85rem; color: #666; margin: 0; margin-left: 1.6rem; font-style: italic; } .consulta-paciente-status { font-size: 0.75rem; font-weight: 600; padding: 0.5rem 1rem; border-radius: 20px; text-transform: uppercase; white-space: nowrap; } .consulta-paciente-status.status-scheduled { background-color: #e3f2fd; color: #1976d2; } .consulta-paciente-status.status-pending { background-color: #fff3e0; color: #f57c00; } .consulta-paciente-status.status-requested { background-color: #f3e5f5; color: #7b1fa2; } /* Sem Consultas */ .no-consultas-content { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 3rem 1rem; } .no-consultas-icon { font-size: 4rem; color: #bbb; margin-bottom: 1.5rem; } .no-consultas-content p { font-size: 1.1rem; color: #666; margin-bottom: 2rem; } .agendar-paciente-button, .view-all-paciente-button { background-color: #5d5dff; color: #fff; border: none; border-radius: 8px; padding: 0.875rem 2rem; font-size: 1rem; font-weight: 600; cursor: pointer; transition: all 0.2s ease; } .agendar-paciente-button:hover, .view-all-paciente-button:hover { background-color: #4444ff; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(93, 93, 255, 0.3); } .view-all-paciente-button { width: 100%; margin-top: 1rem; background-color: #f0f2f5; color: #5d5dff; border: 2px solid #5d5dff; } .view-all-paciente-button:hover { background-color: #5d5dff; color: #fff; } /* Dark Mode - Paciente */ html[data-bs-theme="dark"] .dashboard-paciente-container { background-color: #121212; color: #e0e0e0; } html[data-bs-theme="dark"] .dashboard-paciente-header h1, html[data-bs-theme="dark"] .dashboard-paciente-header p, html[data-bs-theme="dark"] .quick-actions-paciente h2, html[data-bs-theme="dark"] .proximas-consultas-section h2, html[data-bs-theme="dark"] .action-paciente-title, html[data-bs-theme="dark"] .stat-paciente-value { color: #e0e0e0; } html[data-bs-theme="dark"] .stat-paciente-card, html[data-bs-theme="dark"] .action-paciente-button, html[data-bs-theme="dark"] .proximas-consultas-section { background-color: #1e1e1e; box-shadow: 0 4px 10px rgba(0,0,0,0.3); } html[data-bs-theme="dark"] .stat-paciente-label, html[data-bs-theme="dark"] .action-paciente-desc, html[data-bs-theme="dark"] .no-consultas-content p { color: #b0b0b0; } html[data-bs-theme="dark"] .consulta-paciente-item { background: linear-gradient(135deg, #2a2a2a 0%, #1e1e1e 100%); border-left-color: #6c6cff; } html[data-bs-theme="dark"] .consulta-paciente-item:hover { background: linear-gradient(135deg, #333 0%, #252525 100%); box-shadow: 0 4px 12px rgba(108, 108, 255, 0.2); } html[data-bs-theme="dark"] .consulta-paciente-time-date { background-color: #2a2a3a; } html[data-bs-theme="dark"] .consulta-paciente-hora { color: #8888ff; } html[data-bs-theme="dark"] .consulta-paciente-data { color: #9999cc; } html[data-bs-theme="dark"] .consulta-paciente-medico, html[data-bs-theme="dark"] .consulta-paciente-especialidade { color: #d0d0d0; } html[data-bs-theme="dark"] .consulta-paciente-medico strong { color: #e0e0e0; } html[data-bs-theme="dark"] .consulta-icon, html[data-bs-theme="dark"] .action-paciente-icon { color: #8888ff; } html[data-bs-theme="dark"] .consulta-paciente-status.status-scheduled { background-color: #1a3a52; color: #64b5f6; } html[data-bs-theme="dark"] .consulta-paciente-status.status-pending { background-color: #3d2817; color: #ffb74d; } html[data-bs-theme="dark"] .consulta-paciente-status.status-requested { background-color: #2d1f3d; color: #ba68c8; } html[data-bs-theme="dark"] .no-consultas-icon { color: #666; } html[data-bs-theme="dark"] .agendar-paciente-button { background-color: #6c6cff; } html[data-bs-theme="dark"] .agendar-paciente-button:hover { background-color: #5555dd; } html[data-bs-theme="dark"] .view-all-paciente-button { background-color: #2a2a2a; color: #8888ff; border-color: #6c6cff; } html[data-bs-theme="dark"] .view-all-paciente-button:hover { background-color: #6c6cff; color: #fff; } /* Responsivo */ @media (max-width: 768px) { .dashboard-paciente-container { padding: 1rem; } .stats-paciente-grid { grid-template-columns: 1fr; } .actions-paciente-grid { grid-template-columns: 1fr; } .consulta-paciente-info { flex-direction: column; align-items: flex-start; gap: 1rem; } .consulta-paciente-time-date { width: 100%; flex-direction: row; justify-content: space-around; } }