:root { --app-blue-900: #1e3a8a; --app-blue-800: #1e40af; --app-blue-700: #1d4ed8; --app-blue-600: #2563eb; --app-gray-50: #f9fafb; --app-gray-100: #f3f4f6; --app-gray-200: #e5e7eb; --app-gray-700: #374151; --app-radius-lg: 0.75rem; } body.app-theme, body.legacy-html { background: var(--app-gray-100); color: #111827; } /* Overrides para páginas HTML legadas. Use nessas páginas para aplicar o tema sem afetar telas EJS/Tailwind. */ .legacy-html button, .legacy-html-soft button { background: var(--app-blue-600) !important; color: #fff !important; border: none !important; } .legacy-html button:hover, .legacy-html-soft button:hover { background: var(--app-blue-700) !important; } .legacy-html input, .legacy-html select, .legacy-html textarea, .legacy-html-soft input, .legacy-html-soft select, .legacy-html-soft textarea { border-radius: 0.5rem; } /* Bootstrap compat */ .legacy-html .navbar, .legacy-html .navbar.bg-primary, .legacy-html .bg-primary, .legacy-html-soft .navbar, .legacy-html-soft .navbar.bg-primary, .legacy-html-soft .bg-primary { background-color: var(--app-blue-800) !important; } .legacy-html .btn-primary, .legacy-html-soft .btn-primary { background-color: var(--app-blue-600) !important; border-color: var(--app-blue-600) !important; } .legacy-html .btn-primary:hover, .legacy-html-soft .btn-primary:hover { background-color: var(--app-blue-700) !important; border-color: var(--app-blue-700) !important; } .app-header { background: var(--app-blue-800); color: #fff; } .app-header-title { font-weight: 700; } .app-btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; border-radius: 0.5rem; padding: 0.5rem 1rem; font-weight: 600; text-decoration: none; } .app-btn-primary { background: var(--app-blue-600); color: #fff; } .app-btn-primary:hover { background: var(--app-blue-700); } .app-btn-danger { background: #dc2626; color: #fff; } .app-btn-danger:hover { background: #b91c1c; } .app-card { background: #fff; border-radius: var(--app-radius-lg); box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1); } .app-table { width: 100%; border-collapse: separate; border-spacing: 0; } .app-table thead { background: var(--app-blue-700); color: #fff; } .app-table th, .app-table td { padding: 0.75rem 1rem; border-bottom: 1px solid var(--app-gray-200); text-align: left; } .app-table tbody tr:hover { background: #f8fafc; } .app-footer { background: var(--app-blue-700); color: #fff; text-align: center; padding: 12px 0; font-weight: 500; box-shadow: 0 -2px 4px rgba(0,0,0,0.1); } .app-footer-fixed { position: fixed; bottom: 0; left: 0; width: 100%; z-index: 50; }