:root { --primary-color: #E8000C; --primary-dark: #B5000A; --primary-light: #FF1A1A; --secondary-color: #2D2D2D; --secondary-light: #404040; --secondary-dark: #1A1A1A; --background-color: #FFFFFF; --text-color: #2D2D2D; --text-light: #FFFFFF; --hover-color: #FF1A1A; --disabled-color: #999999; } body { background-color: var(--background-color); color: var(--text-color); font-family: 'Roboto', sans-serif; } .navbar { background: var(--secondary-color) !important; box-shadow: 0 2px 4px rgba(0,0,0,0.2); border-bottom: 3px solid var(--primary-color); padding: 0.5rem 1rem; } .navbar-brand { display: flex; align-items: center; gap: 10px; font-size: 1.4rem; font-weight: 600; color: var(--text-light) !important; } .navbar-brand img { height: 40px; margin-right: 10px; } .navbar-logo { height: 35px; width: 35px; } .login-logo { height: 80px; width: 80px; } .nav-link { font-weight: 500; transition: all 0.3s ease; color: var(--text-light) !important; } .nav-link:hover { color: var(--primary-color) !important; transform: translateY(-2px); } .card { border: none; border-radius: 10px; box-shadow: 0 2px 10px rgba(0,0,0,0.05); transition: transform 0.3s ease; } .card:hover { transform: translateY(-5px); box-shadow: 0 4px 15px rgba(0,0,0,0.1); } .btn-primary { background-color: var(--primary-color); border: none; padding: 0.5rem 1.5rem; border-radius: 5px; font-weight: 500; color: var(--text-light); } .btn-primary:hover { background-color: var(--hover-color); transform: translateY(-2px); box-shadow: 0 2px 5px rgba(232, 0, 12, 0.3); } .btn-primary:disabled { background-color: var(--disabled-color); } .table { background: white; border-radius: 10px; overflow: hidden; box-shadow: 0 2px 10px rgba(0,0,0,0.05); } .table thead th { background-color: var(--secondary-color); color: var(--text-light); font-weight: 500; border: none; } .table tbody tr:hover { background-color: rgba(232, 0, 12, 0.05); } .form-control { border-radius: 5px; border: 1px solid #e0e0e0; padding: 0.75rem; } .form-control:focus { border-color: var(--primary-color); box-shadow: 0 0 0 0.2rem rgba(232, 0, 12, 0.25); } /* Alert styles */ .alert { position: fixed; top: 1rem; left: 50%; transform: translateX(-50%); z-index: 1050; min-width: 300px; max-width: 90%; text-align: center; border: none; box-shadow: 0 4px 12px rgba(0,0,0,0.15); display: flex; align-items: center; justify-content: center; gap: 10px; padding: 1rem; } .alert i { font-size: 1.2rem; } .alert-success { background-color: #28a745; color: white; } .alert-danger { background-color: #dc3545; color: white; } .alert-warning { background-color: #ffc107; color: #333; } .alert-info { background-color: #17a2b8; color: white; } /* Animações para feedback */ @keyframes fadeIn { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } } .alert { animation: fadeIn 0.3s ease; } /* Responsividade */ @media (max-width: 768px) { .navbar-brand { font-size: 1.2rem; } .navbar-logo { height: 30px; } .container { padding: 1rem; } .card { margin-bottom: 1rem; } .alert { margin: 1rem; width: calc(100% - 2rem); max-width: none; } } .dropdown-menu { background-color: var(--secondary-color); border: 1px solid var(--secondary-light); box-shadow: 0 2px 10px rgba(0,0,0,0.2); } .dropdown-item { color: var(--text-light) !important; transition: all 0.2s ease; } .dropdown-item:hover { background-color: var(--primary-color); color: var(--text-light) !important; } .dropdown-divider { border-top: 1px solid var(--secondary-light); } /* Estilo para o menu mobile */ @media (max-width: 768px) { .navbar-collapse { background-color: var(--secondary-color); padding: 1rem; border-radius: 0 0 10px 10px; } .navbar-brand img { height: 30px; } }