dá o respiro */ } /* Modal de erro customizado */ .custom-modal { display: none; position: fixed; z-index: 1050; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background: rgba(0,0,0,.45); backdrop-filter: blur(2px); } .custom-modal-content { background: #fff; margin: 14% auto; padding: 26px 24px 20px; border: none; width: 90%; max-width: 420px; text-align: center; border-radius: 12px; box-shadow: 0 8px 28px rgba(0,0,0,.18); } .close-btn { color: #6b8096; float: right; font-size: 20px; font-weight: bold; cursor: pointer; line-height: 1; transition: color .15s; } .close-btn:hover { color: #2d3e4f; } /* Header da página de login */ #menuindex { background: linear-gradient(135deg, #2c4e70 0%, #4a84a5 100%) !important; box-shadow: 0 2px 10px rgba(0,0,0,.15); } /* Cards da página de login */ #boxinformacoes.card, #boxlogin.card { border: none; border-radius: 12px; box-shadow: 0 4px 20px rgba(44,78,112,.14); transition: box-shadow .2s; } #boxinformacoes.card:hover, #boxlogin.card:hover { box-shadow: 0 8px 28px rgba(44,78,112,.2); } /* Header dos cards */ #boxinformacoes .card-header, #boxlogin .card-header { border-radius: 12px 12px 0 0 !important; border-bottom: none; padding: 14px 18px; font-weight: 600; font-size: .92rem; } /* Botão de login */ #boxlogin .btn-success { width: 100%; padding: .55rem 1rem; font-size: .9rem; font-weight: 600; border-radius: 8px; letter-spacing: .02em; transition: all .2s; } #boxlogin .btn-success:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(26,140,94,.3); } /* Link esqueci senha */ #boxlogin a[href^="mailto"] { color: #4a84a5; font-size: .80rem; text-decoration: none; transition: color .15s; } #boxlogin a[href^="mailto"]:hover { color: #305272; text-decoration: underline; } /* Footer fixo da login */ footer.fixed-bottom { background: #446884; color: rgba(255,255,255,.88); font-size: .78rem; padding: 8px 16px; box-shadow: 0 -2px 8px rgba(0,0,0,.1); } /* ===== SMARTPHONE / JANELA BAIXA ===== O rodapé é `fixed-bottom`: fica colado na borda inferior POR CIMA do conteúdo, e em tela estreita empilha em duas linhas, ficando alto. O que ele cobria era justamente o card-footer do login — o botão Entrar — sem como rolar até lá, porque rolar a página não move um elemento fixo. Aqui ele volta para o fluxo (o do portal é flex column e o `main` tem flex:1, então o rodapé assenta naturalmente no fim) e os espaçadores decorativos saem, devolvendo ~200px de altura útil. */ @media (max-width: 767.98px), (max-height: 640px) { footer.fixed-bottom { position: static !important; margin-top: 10px; } body { padding-bottom: 0; } /* ux.css reserva --footer-h p/ o fixo */ /* o padding-top de 80px é inline no

, daí o !important */ main.container-fluid { padding-top: 72px !important; /* só o vão da navbar fixa */ padding-bottom: 0; } /*
decorativos: dentro do

e os cinco soltos antes do rodapé */ main.container-fluid > br, body > br { display: none; } /* empilhados, os dois cards precisam de respiro entre si */ #boxin, #boxlog { margin-bottom: 12px; } /* o botão Entrar nunca deve encostar na borda inferior da tela */ #boxlogin .card-footer { padding-bottom: 1rem !important; } } /* Tela muito baixa (celular deitado): apertar o vertical do card de login. */ @media (max-height: 520px) { main.container-fluid { padding-top: 64px !important; } #boxlogin .card-body { padding-top: .5rem !important; padding-bottom: .25rem !important; } #boxlogin .card-body .form-control { padding-top: .3rem; padding-bottom: .3rem; } #boxlogin .card-header { padding: 8px 14px; } #boxlogin .card-footer { padding-top: .5rem !important; padding-bottom: .5rem !important; } /* o box de informações é longo e empurra o login para fora da tela */ #boxinformacoes .card-body p { font-size: .8rem !important; line-height: 1.35 !important; } }