/* Estilos para o painel administrativo */
.navbar {
    margin-bottom: 20px;
}

.card {
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    transition: all 0.3s;
}

.card:hover {
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

/* Estilos para os modais */
.modal-header {
    background-color: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
}

.modal-footer {
    background-color: #f8f9fa;
    border-top: 1px solid #dee2e6;
}

/* Estilos para os botu00f5es */
.btn-primary {
    background-color: #0d6efd;
    border-color: #0d6efd;
}

.btn-primary:hover {
    background-color: #0b5ed7;
    border-color: #0a58ca;
}

/* Estilos para tabelas */
.table th {
    background-color: #f8f9fa;
}

.table-hover tbody tr:hover {
    background-color: rgba(13, 110, 253, 0.05);
}

/* Estilos para badges */
.badge {
    font-weight: 500;
}

/* Correu00e7u00e3o para modais */
.modal {
    display: none;
}

.modal.show {
    display: block;
}

/* Estilos para o overlay do modal */
.modal-backdrop {
    background-color: rgba(0, 0, 0, 0.5);
}

.modal-backdrop.show {
    opacity: 0.5;
}

/* Estilos personalizados além do Tailwind CSS */

/* Transições suaves para elementos */
.transition-all {
    transition: all 0.3s ease;
}

/* Cores pastéis personalizadas */
.bg-pastel-blue {
    background-color: #d0e8ff;
}

.bg-pastel-purple {
    background-color: #e8dbff;
}

.bg-pastel-pink {
    background-color: #ffd0e8;
}

.bg-pastel-green {
    background-color: #d0ffe8;
}

.bg-pastel-yellow {
    background-color: #fff8d0;
}

/* Cores para tema escuro */
.bg-dark-blue {
    background-color: #172a45;
}

.bg-dark-purple {
    background-color: #2d2a45;
}

.bg-dark-pink {
    background-color: #452a3b;
}

.bg-dark-green {
    background-color: #1e3a2f;
}

.bg-dark-card {
    background-color: #1f2937;
    border: 1px solid #374151;
}

.bg-dark-input {
    background-color: #374151;
    border-color: #4b5563;
    color: #e5e7eb;
}

.text-dark-primary {
    color: #e5e7eb;
}

.text-dark-secondary {
    color: #9ca3af;
}

.text-dark-accent {
    color: #60a5fa;
}

/* Status para tema escuro */
.status-dark-active {
    background-color: rgba(52, 211, 153, 0.2);
    color: #34d399;
}

.status-dark-inactive {
    background-color: rgba(248, 113, 113, 0.2);
    color: #f87171;
}

.status-dark-info {
    background-color: rgba(96, 165, 250, 0.2);
    color: #60a5fa;
}

.status-dark-warning {
    background-color: rgba(251, 191, 36, 0.2);
    color: #fbbf24;
}

.status-dark-danger {
    background-color: rgba(239, 68, 68, 0.2);
    color: #ef4444;
}

/* Efeitos de hover para cards */
.card {
    border-radius: 1rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
}

.card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

/* Tema escuro para cards */
.dark-card {
    border-radius: 1rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    background-color: #1f2937;
    border: 1px solid #374151;
    transition: all 0.3s ease;
}

.dark-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
}

/* Estilos de gráfico circular */
.donut {
    width: 200px;
    height: 200px;
}

/* Gradientes */
.bg-gradient-pastel {
    background: linear-gradient(135deg, #d0e8ff 0%, #e8dbff 100%);
}

/* Gradientes para tema escuro */
.bg-gradient-dark {
    background: linear-gradient(135deg, #172a45 0%, #2d2a45 100%);
}

/* Efeitos para o menu lateral */
.sidebar {
    box-shadow: 2px 0 10px rgba(0, 0, 0, 0.05);
    min-height: 100vh;
}

/* Sidebar para tema escuro */
.dark-sidebar {
    box-shadow: 2px 0 10px rgba(0, 0, 0, 0.2);
    background-color: #111827;
    min-height: 100vh;
}

/* Estilos para tabelas */
.table-row-hover:hover {
    background-color: rgba(208, 232, 255, 0.2);
}

/* Tabelas para tema escuro */
.dark-table-row-hover:hover {
    background-color: rgba(55, 65, 81, 0.7);
}

/* Estados de elementos */
.active-nav-link {
    border-left: 4px solid #8b5cf6;
    background-color: rgba(208, 232, 255, 0.3);
}

.dark-active-nav-link {
    border-left: 4px solid #6366f1;
    background-color: rgba(55, 65, 81, 0.7);
}

/* Animações GSAP iniciais */
.fadeIn {
    opacity: 0;
}

.slideUp {
    opacity: 0;
    transform: translateY(20px);
}

.staggered {
    opacity: 0;
}

/* Estilo específico para o botão de login */
.login-button {
    opacity: 1 !important;
    visibility: visible !important;
}

/* Garantir que elementos da tabela sejam visíveis */
.data-table {
    width: 100%;
}

.data-table tbody tr {
    opacity: 1 !important;
    visibility: visible !important;
    display: table-row !important;
}

.data-table tbody td {
    opacity: 1 !important;
    visibility: visible !important;
}

/* Sobrescrever estilos de animação para elementos da tabela */
.staggered {
    opacity: 1 !important;
    visibility: visible !important;
}