/* Bootstrap */ @import './bootstrap-datetimepicker.min.css'; @import './bootstrap.min.css'; /* DataTables */ @import './dataTables.bootstrap4.min.css'; /* Font Awesome */ @import './font-awesome.min.css'; /* FullCalendar */ @import './fullcalendar.min.css'; /* Select2 */ @import './select2.min.css'; /* Tags Input */ @import './tagsinput.css'; /* Estilos próprios */ @import './style.css'; @import './tiptap.css'; @import './chatbot.css'; @import './Dashboard.css'; @import './DoctorDashboard.css'; /* Estilos para cards de eventos */ .event-card { padding: 6px 10px; border-radius: 8px; color: white; font-size: 0.9em; margin: 2px 0; display: flex; align-items: center; justify-content: space-between; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2); font-weight: 500; } .event-card .event-type { font-size: 0.75em; background: rgba(255, 255, 255, 0.2); padding: 2px 6px; border-radius: 12px; } .event-card .event-time { font-weight: bold; margin-right: 6px; } .event-card .event-title { flex-grow: 1; margin-left: 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } /* Estilos para dropdown menus */ .dropdown-menu.dropdown-menu-right.show { min-width: 120px; max-width: 220px; width: max-content; padding: 5px 0; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.15); background-color: #fff; border: 1px solid #ddd; position: absolute; right: 0; z-index: 100; } .dropdown-item-custom { display: flex; align-items: center; padding: 8px 12px; font-weight: 500; color: #007bff; text-decoration: none; width: 100%; cursor: pointer; transition: background 0.2s; } .dropdown-item-custom:hover { background-color: #f0f0f0; } .dropdown-item-delete { display: flex; align-items: center; padding: 8px 12px; font-weight: 500; color: #dc3545; width: 100%; border: none; background: none; cursor: pointer; transition: background 0.2s; } .dropdown-item-delete:hover { background-color: #f8d7da; } .dropdown-item-custom i, .dropdown-item-delete i { margin-right: 5px; } .action-icon { background: transparent; border: none; cursor: pointer; font-size: 18px; } .quick-filter { display: flex; gap: 0.25rem; } .btn-filter { padding: 0.15rem 0.3rem; font-size: 0.7rem; min-width: 35px; border-radius: 4px; border: 1px solid #ccc; cursor: pointer; } .btn-filter.active { background-color: #007bff; color: white; border-color: #007bff; } .date-filter { display: flex; align-items: center; gap: 0.25rem; } .date-filter label { font-size: 0.7rem; } .date-filter input[type="date"] { padding: 0.15rem 0.25rem; font-size: 0.7rem; min-width: 80px; } /* Linha separadora do dropdown */ .dropdown-divider { border: none; border-top: 1px solid #e5e5e5; margin: 8px 12px; height: 0; } /* Estilo específico para botão de upload */ .dropdown-item i { margin-right: 8px; width: 14px; text-align: center; } /* Botão de logout destacado */ .logout-btn { color: #e63946 !important; border: none; border-radius: 6px; padding: 8px 12px; font-weight: 600; width: 100%; text-align: left; margin-top: 6px; cursor: pointer; transition: background-color 0.3s ease, transform 0.2s ease; } .logout-btn:hover { background-color: #fef2f2 !important; color: #dc2626 !important; } /* Dropdown com leve sombra e padding */ .dropdown-menu { position: absolute; top: 100%; right: 0; left: auto; z-index: 1000; min-width: 160px; padding: 5px; margin: 5px 0 0 0; border-radius: 8px; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); background-color: #fff; border: 1px solid rgba(0, 0, 0, 0.1); display: none; } .dropdown-menu.show { display: block; } /* Estilo dos outros itens do dropdown */ .dropdown-item { background: none; border: none; width: 100%; text-align: left; padding: 8px 12px; border-radius: 4px; font-size: 14px; color: #333; cursor: pointer; transition: background 0.2s ease; } .dropdown-item:hover { background-color: #f1f1f1; } .dropdown-header { padding: 8px 12px; font-size: 14px; font-weight: 600; color: #666; border-bottom: 1px solid #eee; margin-bottom: 5px; } /* Estilo para o container do dropdown */ .dropdown { position: relative; } /* Estilo específico para o dropdown do perfil */ .nav-item.dropdown { position: relative; } /* Estilo específico para o user-menu dropdown */ .user-menu .nav-item.dropdown .dropdown-menu { position: absolute !important; top: 100% !important; right: 0 !important; left: auto !important; transform: translateX(0) !important; min-width: 180px; margin-top: 8px; } .dm-container { display: flex; align-items: center; margin-right: 12px; } .dm-button { background: none; border: none; padding: 0; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: transform 0.2s ease, filter 0.2s ease; font-size: 20px; } .dm-button:focus { outline: none; box-shadow: none; } .dm-button:hover { transform: scale(1.2); filter: brightness(1.2); } /* Cores */ .dm-button.light { color: #fff; } .dm-button.dark { color: #f1f1f1; } .action-buttons-container { display: flex; gap: 5px; justify-content: flex-end; align-items: center; } .action-btn { border: none; background: transparent; cursor: pointer; padding: 8px 10px; margin: 0 2px; border-radius: 6px; transition: all 0.3s ease; position: relative; overflow: hidden; display: inline-block; } .action-btn::before { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent); transition: left 0.5s; } .action-btn:hover::before { left: 100%; } .action-btn-view { color: #007bff; } .action-btn-view:hover { background-color: #007bff; color: white; transform: translateY(-2px); box-shadow: 0 4px 8px rgba(0,123,255,0.3); } .action-btn-edit { color: #28a745; } .action-btn-edit:hover { background-color: #28a745; color: white; transform: translateY(-2px); box-shadow: 0 4px 8px rgba(40,167,69,0.3); } .action-btn-delete { color: #dc3545; } .action-btn-delete:hover { background-color: #dc3545; color: white; transform: translateY(-2px); box-shadow: 0 4px 8px rgba(220,53,69,0.3); } .action-btn-print { color: #17a2b8; } .action-btn-print:hover { background-color: #17a2b8; color: white; transform: translateY(-2px); box-shadow: 0 4px 8px rgba(23,162,184,0.3); } /* Efeito de tooltip melhorado */ .action-btn { position: relative; } .action-btn::after { content: attr(data-tooltip); position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); background-color: #333; color: white; padding: 5px 10px; border-radius: 4px; font-size: 12px; white-space: nowrap; opacity: 0; visibility: hidden; transition: all 0.3s ease; z-index: 1000; } .action-btn:hover::after { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(-5px); } /* Container para os botões de ação */ .action-buttons-container { display: flex; gap: 5px; justify-content: flex-end; align-items: center; } /* Responsividade para os botões */ @media (max-width: 768px) { .action-btn { padding: 6px 8px; margin: 0 1px; } .action-buttons-container { gap: 3px; } } /* Efeito focus para acessibilidade */ .action-btn:focus { outline: 2px solid transparent; box-shadow: 0 0 0 2px rgba(0,123,255,0.25); } .action-btn-edit:focus { box-shadow: 0 0 0 2px rgba(40,167,69,0.25); } .action-btn-delete:focus { box-shadow: 0 0 0 2px rgba(220,53,69,0.25); }