/* Altura correta em mobile/tablet, considerando barra de endereço/teclado */
.login-section .min-vh-100 {
    min-height: 100dvh;
}

/* Cartão com largura fluida, confortável em todas as telas */
.login-card {
    width: 100%;
    max-width: clamp(340px, 88vw, 520px);
    margin: 0 auto;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(0,0,0,.08);
    padding: 24px;
    background: #fff;
}

    /* Inputs e botões com tamanho que evita zoom no iOS */
    .login-card .form-control {
        font-size: 16px; /* evita auto-zoom ao focar */
        padding: 12px 14px;
    }

    .login-card .btn-lg {
        font-size: 16px;
        padding: 12px 16px;
    }

/* Tablet retrato: deixa o card mais largo e tipografia um pouco maior */
@media (min-width:768px) and (max-width:991.98px) and (orientation: portrait) {
    .login-card {
        max-width: clamp(420px, 86vw, 640px);
        padding: 28px;
    }
}

/* Tablet paisagem */
@media (min-width: 900px) and (max-width: 1199.98px) and (orientation: landscape) {
    .login-card {
        max-width: 560px;
    }
}

/* Desktop largo */
@media (min-width: 1200px) {
    .login-card {
        max-width: 520px;
    }
}

/* Espaços seguros (notch) */
@supports (padding: max(0px)) {
    .login-section .px-3 {
        padding-left: max(1rem, env(safe-area-inset-left));
        padding-right: max(1rem, env(safe-area-inset-right));
    }
}