/* Fundo da Página: Gradiente (Design Tokens) */
body.login-page {
    background: linear-gradient(135deg, var(--netnic-body-bg) 0%, #dde2e8 100%);
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--netnic-font-sans);
}

/* Card de Login */
.login-card {
    background-color: var(--netnic-card-bg);
    border: none;
    border-radius: var(--netnic-border-radius-xl);
    box-shadow: var(--netnic-shadow-lg);
    width: 100%;
    max-width: 450px;
    padding: var(--netnic-spacing-xl);
    position: relative;
    overflow: hidden;
}

/* Detalhe colorido no topo (paleta Netnic) */
.login-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 6px;
    background: linear-gradient(90deg, var(--netnic-primary), var(--netnic-accent));
}

/* Cabeçalho e Logo */
.login-header {
    text-align: center;
    margin-bottom: 2.5rem;
}

.login-logo {
    /* max-height definido inline na view conforme configuração (small/medium/large/xl) */
    width: auto;
    margin-bottom: 1.5rem;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.login-title {
    font-size: var(--netnic-font-size-xl);
    font-weight: var(--netnic-font-weight-bold);
    color: var(--netnic-text);
    margin-bottom: var(--netnic-spacing-sm);
}

.login-subtitle {
    color: var(--netnic-text-muted);
    font-size: var(--netnic-font-size-sm);
}

/* Inputs Flutuantes */
.form-floating>.form-control {
    border: 1px solid var(--netnic-border-color-strong);
    border-radius: var(--netnic-border-radius);
    height: calc(3.5rem + 2px);
    line-height: 1.25;
}

.form-floating>.form-control:focus {
    border-color: var(--netnic-primary);
    box-shadow: 0 0 0 0.25rem var(--netnic-primary-light);
}

.form-floating>label {
    padding-left: 1rem;
    color: #999;
}

/* Botão de Login */
.btn-login {
    background: linear-gradient(90deg, var(--netnic-primary), var(--netnic-accent));
    border: none;
    border-radius: var(--netnic-border-radius);
    padding: 0.8rem;
    font-size: var(--netnic-font-size-lg);
    font-weight: var(--netnic-font-weight-semibold);
    letter-spacing: 0.5px;
    box-shadow: var(--netnic-shadow-primary);
    transition: all var(--netnic-transition-slow);
}

.btn-login:hover {
    background: linear-gradient(90deg, var(--netnic-primary-hover), var(--netnic-accent-hover));
    transform: translateY(-2px);
    box-shadow: var(--netnic-shadow-primary-hover);
}

/* Checkbox */
.form-check-input:checked {
    background-color: var(--netnic-primary);
    border-color: var(--netnic-primary);
}

/* Footer do Card */
.login-footer {
    text-align: center;
    margin-top: var(--netnic-spacing-xl);
    font-size: var(--netnic-font-size-sm);
}

.login-footer a {
    color: var(--netnic-primary);
    text-decoration: none;
    font-weight: 500;
}

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

/* Copyright externo */
.copyright-text {
    position: absolute;
    bottom: var(--netnic-spacing-xl);
    width: 100%;
    text-align: center;
    color: var(--netnic-text-muted);
    font-size: var(--netnic-font-size-sm);
    opacity: 0.8;
}