/* * Dark mode para páginas externas do Checkaê. * Ativado pela classe .dark-mode no . */ /* ===== Variáveis do tema escuro ===== */ body.dark-mode { --background-color: #1a1a2e; --brand-color: #c2c7d0; --text-color: #e0e0e0; background-color: #1a1a2e !important; color: #e0e0e0; } /* ===== Navbar ===== */ body.dark-mode .navbar { background-color: #16213e !important; border-bottom: 1px solid #2a2a4a; } body.dark-mode .navbar-brand { color: #c2c7d0 !important; } body.dark-mode .navbar-nav .nav-link { color: #c2c7d0 !important; } body.dark-mode .navbar-nav .nav-link:hover { color: #00b0ff !important; } body.dark-mode .navbar-toggler { border-color: rgba(255, 255, 255, 0.2); } body.dark-mode .navbar-toggler-icon { filter: invert(1); } body.dark-mode .nav-item { border-bottom-color: #2a2a4a; } /* ===== Hero / Conteúdo principal ===== */ body.dark-mode .hero p, body.dark-mode .hero p[style] { color: #adb5bd !important; } body.dark-mode .title-container { background-color: #1a1a2e; } /* ===== Cards (genérico) ===== */ body.dark-mode .card { background-color: #1e2a45; border-color: #2a3a5a; color: #e0e0e0; } body.dark-mode .card .card-header { background-color: #1e2a45; border-bottom-color: #2a3a5a; } body.dark-mode .card .card-body { color: #c2c7d0; } body.dark-mode .card .card-footer { background-color: #1e2a45; border-top-color: #2a3a5a; } body.dark-mode .card .card-body p { color: #adb5bd; } /* ===== Cards de equipe (about/checkae) ===== */ body.dark-mode .card .card-body h5 { color: #e0e0e0; } body.dark-mode .card .card-body p { color: #8a9199; } /* ===== Section container (checkae) ===== */ body.dark-mode .section-container { color: #e0e0e0; } body.dark-mode .section-container p { color: #adb5bd; } /* ===== Footer ===== */ body.dark-mode .footer { background-color: #16213e !important; border-top: 1px solid #2a2a4a; } body.dark-mode .footer a { color: #6cb2eb; } body.dark-mode .footer-text p { color: #adb5bd; } /* ===== Formulários (checkin/checkout/register) ===== */ body.dark-mode .form { border-color: #2a3a5a; background-color: #1e2a45; } body.dark-mode .form-group input, body.dark-mode .form-group select { background-color: #243352; border-color: #2a3a5a; color: #e0e0e0; } body.dark-mode .form-group input::placeholder { color: #6c757d; } body.dark-mode .form-group label { color: #c2c7d0; } body.dark-mode .form-control { background-color: #243352; border-color: #2a3a5a; color: #e0e0e0; } body.dark-mode .form-control::placeholder { color: #6c757d; } body.dark-mode .form-control:focus { background-color: #243352; border-color: #00b0ff; color: #e0e0e0; box-shadow: 0 0 0 0.2rem rgba(0, 176, 255, 0.25); } body.dark-mode .form-check label { color: #c2c7d0; } /* ===== Alertas ===== */ body.dark-mode .alert-success { background-color: #0f3d1e; border-color: #155726; color: #5dd879; } body.dark-mode .alert-warning { background-color: #533f03; border-color: #6d5204; color: #ffc107; } body.dark-mode .alert-danger { background-color: #491217; border-color: #5c171d; color: #f77; } /* ===== CPDS page ===== */ body.dark-mode .card-room { background-color: #1e2a45 !important; color: #e0e0e0; } body.dark-mode .card-room h3 { color: #e0e0e0; } body.dark-mode .card-room p { color: #adb5bd !important; } body.dark-mode .container-icon { border-color: #4b5a7a; } body.dark-mode .container-icon img { background-color: transparent; } body.dark-mode .infraestrutura h2 { color: #00b0ff; } body.dark-mode .contact { color: #e0e0e0; } body.dark-mode .contact ul li { color: #c2c7d0; } /* ===== Login / Send Link / Reset Password ===== */ body.dark-mode.login-page { background: linear-gradient(135deg, #0a2a4a, #0d1b3e) !important; } body.dark-mode .login-container { background-color: #1e2a45 !important; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4); } body.dark-mode .login-container h2 { color: #e0e0e0; } body.dark-mode .login-container .form-control { background-color: #243352; border-color: #2a3a5a; color: #e0e0e0; } body.dark-mode .login-container a { color: #6cb2eb; } body.dark-mode .text-danger { color: #f77 !important; } /* ===== Modais (register terms) ===== */ body.dark-mode .modal-content { background-color: #1e2a45; color: #c2c7d0; } body.dark-mode .modal-header { border-bottom-color: #2a3a5a; } body.dark-mode .modal-footer { border-top-color: #2a3a5a; } body.dark-mode .modal-header .btn-close { filter: invert(1); } /* ===== Botão de toggle dark mode ===== */ .dark-mode-toggle { background: none; border: none; cursor: pointer; font-size: 1.2rem; padding: 0.5rem; color: var(--brand-color, #5e6c84); transition: color 0.3s ease; display: flex; align-items: center; justify-content: center; } .dark-mode-toggle:hover { color: var(--primary-color, #00b0ff); } body.dark-mode .dark-mode-toggle { color: #ffc107; } body.dark-mode .dark-mode-toggle:hover { color: #ffda47; } /* ===== Scrollbar ===== */ body.dark-mode ::-webkit-scrollbar { width: 8px; height: 8px; } body.dark-mode ::-webkit-scrollbar-track { background: #16213e; } body.dark-mode ::-webkit-scrollbar-thumb { background: #2a3a5a; border-radius: 4px; } body.dark-mode ::-webkit-scrollbar-thumb:hover { background: #4b5a7a; } /* ===== Transição suave ===== */ body, body .navbar, body .footer, body .card, body .form-control, body .form-group input, body .form-group select { transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease; }