/*
 * Login e troca de senha do CRM Cerne. Fonte: interno/crm/cerne/publico/entrada.css
 * Só carrega no layout anonymous do Krayin (o do painel não usa este arquivo).
 * Topo da página clara levado pra tela inteira: azul Imperial com o céu (horizonte-so-ceu-4) e o grão,
 * a logo em off-white e o cartão branco de raio 24 por cima.
 */

/* html:not(.dark) body, porque o tema.css pinta o body de papel com essa especificidade */
html body,
html:not(.dark) body {
    min-height: 100vh;
    background: var(--cerne-azul) url("ceu.jpg") center 70% / cover no-repeat fixed;
    font-family: Inter, system-ui, sans-serif;
    color: var(--cerne-tinta);
}
body::after {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    opacity: .13;
    mix-blend-mode: overlay;
    background-image: var(--cerne-grao);
}
#app { position: relative; z-index: 1; }

/* a logo vem da configuração (lockup fundo azul) */
#app img.w-max { width: 180px; height: auto; }

/* cartão */
#app .box-shadow {
    border-radius: 24px;
    border: 1px solid rgba(2, 31, 148, .12);
    box-shadow: 0 24px 60px rgba(1, 21, 106, .35);
    min-width: 340px;
    overflow: hidden;
}
#app .box-shadow .border-y { border-color: rgba(2, 31, 148, .08); }
#app .box-shadow p.text-xl {
    font-family: var(--cerne-titulo);
    font-weight: 500;
    font-size: 24px;
    letter-spacing: -.02em;
    padding: 26px 24px 14px;
}
#app .box-shadow .p-4 { padding-left: 24px; padding-right: 24px; }

/* campos como na página clara: fundo papel, sem borda; no foco, borda azul e fundo branco. 16 px pro iPhone não dar zoom */
#app .box-shadow input[type=email],
#app .box-shadow input[type=password],
#app .box-shadow input[type=text] {
    background: var(--cerne-papel);
    border: 1.5px solid transparent;
    border-radius: 14px;
    font-size: 16px;
    padding: .7rem .9rem;
    width: 100%;
}
#app .box-shadow input:focus {
    background: #fff;
    border-color: var(--cerne-azul) !important;
}

#app .box-shadow .text-brandColor { color: var(--cerne-azul); }

/* "Desenvolvido por Krayin", embaixo do cartão, fica sobre o céu: off-white */
#app .box-shadow ~ .text-sm,
#app .text-sm.font-normal:not(.box-shadow *) { color: rgba(245, 242, 243, .78); text-align: center; padding: 0 16px; }
#app .text-sm.font-normal:not(.box-shadow *) a { color: var(--cerne-papel); text-decoration: underline; text-underline-offset: 2px; }
