/* ====== Base (sin cambios funcionales) ====== */ html { font-size: 14px; } @media (min-width: 768px) { html { font-size: 16px; } } .btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus { box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb; } /* ====== Layout: evitar que header/footer tapen el contenido ====== */ :root { /* Altura aproximada de la barra superior (navbar) y del footer */ --header-h: 56px; /* ajusta si tu navbar es más alta */ --footer-h: 60px; /* coincide con la altura de .footer */ } html { position: relative; min-height: 100%; } /* Antes: margin-bottom: 60px; ahora usamos padding inferior para no tapar contenido */ body { /* Deja espacio para la barra superior fija */ padding-top: var(--header-h); /* Deja espacio para el footer fijo + un pequeño respiro */ padding-bottom: calc(var(--footer-h) + 16px); margin: 0; } /* ====== (Opcional) si tienes un header/nav fijo con clase .navbar, no toco su posición, solo aseguro jerarquía visual por si tu tema ya lo fija desde el layout */ .navbar { z-index: 1030; /* por encima del contenido */ } /* ====== Estilos de login: estaban aplicando a TODO el sitio. Los limito a una clase opcional en el body (p.ej. ) para no afectar las pantallas de la app como FacturaFormulario. */ .login-page { background-color: #f8f9fa; display: flex; justify-content: center; align-items: center; min-height: 100vh; } .card { border-radius: 1rem; }