/* ===========================
   Login – Identidade do Home
   ===========================
   - Reaproveita variáveis e estilos do home-style.css
   - Ajustes visuais apenas para a página de login
*/

/* Garante altura mínima sem “película” cortando conteúdo */
html {
    height: auto;
}

body.login-theme {
    margin: 0;
    min-height: 100%;
    min-height: 100dvh;
    background:
        radial-gradient(1200px 600px at 10% -10%, #14397233, transparent),
        linear-gradient(180deg, var(--bg-0), var(--bg-1) 80%);
    color: var(--ink);
    font-family: Inter, system-ui, Segoe UI, Arial, sans-serif;
    display: grid;
    place-items: center;
    overflow-x: hidden;
    /* igual ao home */
}

/* Fundo decorativo bem sutil */
.login-bg {
    position: fixed;
    inset: 0;
    pointer-events: none;
    background:
        conic-gradient(from 0deg at 60% 40%, #1e76bd11 0deg, transparent 40deg, transparent 70deg, #42dca311 100deg);
    mix-blend-mode: screen;
    filter: blur(1px);
    animation: login-spin 60s linear infinite;
}

@keyframes login-spin {
    to {
        transform: rotate(360deg)
    }
}

/* Container principal */
.login-container {
    width: min(520px, 92%);
    margin-inline: auto;
}

/* Marca */
.login-brand {
    display: grid;
    place-items: center;
    margin-bottom: 16px;
}

.login-brand img {
    height: 80px;
    filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .35));
    /* dá destaque da logo azul no fundo escuro */
}

/* Card de login com o mesmo "glass" do home */
.login-card {
    border: 1px solid var(--stroke);
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .03));
    box-shadow: var(--shadow);
    backdrop-filter: blur(10px) saturate(120%);
}

/* Título */
.login-title {
    margin: 0 0 .6rem;
    font-size: clamp(1.4rem, 2.6vw, 1.8rem);
    text-align: center;
    color: #fff;
}

/* Form grid */
.login-form-grid {
    display: grid;
    gap: 12px;
    margin: 10px 0 6px;
}

/* Botão do home já cobre estilo; garantimos largura total */
.btn--full {
    width: 100%;
}

/* Links auxiliares */
.login-links {
    display: flex;
    justify-content: center;
    margin-top: 12px;
}

.login-links a {
    color: var(--ink);
    opacity: .85;
    text-decoration: none;
}

.login-links a:hover {
    text-decoration: underline;
}

/* Rodapé: centralizado e branco (como pedido) */
.login-footer {
    text-align: center;
    margin-top: 14px;
    color: #fff;
    font-size: .92rem;
}

.login-footer a {
    color: #fff;
    font-weight: 600;
    text-decoration: none;
}

.login-footer a:hover {
    text-decoration: underline;
}

/* Espaçamento interno do card, coerente com o home */
.card__body {
    padding: 18px;
}

/* Evita “aperto” visual em telas muito pequenas */
@media (max-width: 380px) {
    .login-brand img {
        height: 70px;
    }

    .card__body {
        padding: 16px;
    }
}

/* Labels dentro do login: cor clara para contraste */
.login-form-grid label {
    color: #eaf2ff;
    /* mesmo branco azulado usado em var(--ink) */
    font-weight: 600;
    /* dá mais legibilidade */
}

/* Campos de input */
.login-form-grid input {
    background: rgba(255, 255, 255, .05);
    border: 1px solid var(--stroke);
    color: #fff;
    /* texto branco */
}

.login-form-grid input::placeholder {
    color: #b8c6dd;
    /* cinza claro, mas legível */
    opacity: 0.9;
}

.login-form-grid .g-recaptcha {
    display: flex;
    justify-content: center;
}