/* tela de entrada do sistema (arquivo próprio; o estilo.css antigo continua valendo para o resto) */
.login2 { grid-template-columns: 1.1fr 1fr; background: #0b0b0c; }
.login2 .arte { border-right: 1px solid #1f1f22; }
.login2 .arte::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 0 calc(100% - 1px), rgba(227, 6, 19, .35) 100%); pointer-events: none; }

.login2 .form {
  background:
    radial-gradient(700px 420px at 85% 0%, rgba(227, 6, 19, .10), transparent 60%),
    radial-gradient(600px 400px at 0% 100%, rgba(255, 255, 255, .03), transparent 60%),
    #0e0e10;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 22px; padding: 40px 24px;
}
.cartao-login {
  width: 100%; max-width: 410px; background: linear-gradient(180deg, #17171a, #131315); border: 1px solid #26262b; border-radius: 22px;
  padding: 38px 34px 30px; box-shadow: 0 30px 80px rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 255, 255, .04); position: relative; color: #f4f4f5;
}
.cartao-login::before { content: ""; position: absolute; left: 34px; right: 34px; top: 0; height: 3px; border-radius: 0 0 3px 3px; background: linear-gradient(90deg, transparent, var(--vermelho), transparent); }
.cartao-login .logo-mini { display: none; height: 46px; margin-bottom: 18px; }
.cartao-login .sobre { display: inline-flex; align-items: center; gap: 8px; color: #fca5a5; font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .14em; }
.cartao-login .sobre::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--vermelho); box-shadow: 0 0 0 4px rgba(227, 6, 19, .2); }
.cartao-login h1 { font-family: Oswald, sans-serif; text-transform: uppercase; letter-spacing: .03em; font-size: 32px; line-height: 1.1; margin: 12px 0 6px; color: #fff; }
.cartao-login .sub { color: #a1a1aa; font-size: 14px; margin: 0 0 26px; }

.campo-login { display: block; margin-bottom: 16px; }
.campo-login > span { display: block; font-size: 12.5px; font-weight: 600; color: #d4d4d8; margin-bottom: 7px; }
.campo-login .caixa { position: relative; display: flex; align-items: center; background: #0d0d0f; border: 1px solid #2c2c31; border-radius: 12px; transition: border-color .15s, box-shadow .15s; }
.campo-login .caixa:focus-within { border-color: var(--vermelho); box-shadow: 0 0 0 4px rgba(227, 6, 19, .16); }
.campo-login .caixa > svg { position: absolute; left: 14px; color: #71717a; width: 18px; height: 18px; }
.campo-login .caixa:focus-within > svg { color: #fca5a5; }
.campo-login input { width: 100%; background: transparent; border: 0; outline: 0; box-shadow: none; color: #fff; padding: 14px 44px 14px 44px; font-size: 15px; border-radius: 12px; }
.campo-login input::placeholder { color: #52525b; }
.campo-login input:-webkit-autofill { -webkit-text-fill-color: #fff; -webkit-box-shadow: 0 0 0 40px #0d0d0f inset; caret-color: #fff; }
.campo-login .olho { position: absolute; right: 8px; background: none; border: 0; color: #71717a; padding: 8px; border-radius: 8px; cursor: pointer; display: flex; }
.campo-login .olho:hover, .campo-login .olho.ativo { color: #fff; background: #1f1f23; }
.campo-login .olho svg { width: 18px; height: 18px; }

.login2 .lembrar { display: flex; align-items: center; gap: 9px; color: #a1a1aa; font-size: 13px; margin: 2px 0 18px; cursor: pointer; }
.login2 .lembrar input { width: 16px; height: 16px; accent-color: var(--vermelho); margin: 0; }
.login2 .msg-erro { color: #fca5a5; background: rgba(227, 6, 19, .1); border: 1px solid rgba(227, 6, 19, .35); border-radius: 10px; padding: 10px 12px; font-size: 13.5px; margin-bottom: 14px; }
.login2 .msg-erro:empty { display: none; }
.login2 .botao.entrar {
  width: 100%; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 15px; font-size: 15px; font-weight: 700; letter-spacing: .02em;
  border-radius: 12px; background: linear-gradient(180deg, #f0141f, #c80510); box-shadow: 0 10px 24px rgba(227, 6, 19, .3), inset 0 1px 0 rgba(255, 255, 255, .18); margin: 0;
}
.login2 .botao.entrar:hover { filter: brightness(1.07); }
.login2 .botao.entrar svg { width: 18px; height: 18px; transition: transform .15s; }
.login2 .botao.entrar:hover svg { transform: translateX(3px); }
.login2 .botao.entrar.carregando { opacity: .7; pointer-events: none; }
.cartao-login .ajuda { margin: 20px 0 0; padding-top: 18px; border-top: 1px solid #232327; color: #71717a; font-size: 12.5px; text-align: center; }
.login2 .rodape-login { color: #52525b; font-size: 12px; margin: 0; letter-spacing: .02em; }

@media (max-width: 900px) {
  .login2 { grid-template-columns: 1fr; }
  .login2 .arte { display: none; }
  .login2 .form { min-height: 100vh; padding: 28px 16px; }
  .cartao-login { padding: 30px 22px 24px; }
  .cartao-login .logo-mini { display: block; }
}