/*
 * Páginas públicas no visual do sistema (09/11/2026): link de agendamento da empresa e confirmação de presença.
 * Mesmas cores (paleta A, azul-turquesa da logo), fonte Nunito, logo oficial e arte da flor de lótus.
 */
:root {
    --vp-p1: #1594a8; --vp-p2: #0c7a92; --vp-claro: #e3f4f6; --vp-amarelo: #ffca05; --vp-lilas: #8a6bd8;
    --vp-texto: #0f3448; --vp-suave: #678190; --vp-borda: #e0ebed; --vp-fundo: #f4f8f9;
}
* { box-sizing: border-box; }
body.vp { margin: 0; min-height: 100vh; font-family: 'Nunito', 'Segoe UI', Roboto, Arial, sans-serif; color: var(--vp-texto);
    background: linear-gradient(180deg, #f6fbfb 0%, #f3f7f8 55%, #f5f2fb 100%); }
.vp-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1fr) minmax(380px, 520px); }
.vp-arte { position: relative; overflow: hidden; display: flex; align-items: flex-end; padding: 48px clamp(32px, 5vw, 80px);
    background: url(../img/dashboard/faixa-zen.jpg) 84% center / cover no-repeat; }
.vp-arte::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255,255,255,0) 35%, rgba(244,248,249,.92) 100%); }
.vp-arte__texto { position: relative; z-index: 1; max-width: 520px; }
.vp-selo { display: inline-block; padding: 6px 12px; border-radius: 999px; background: #fff; color: var(--vp-p2); font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; box-shadow: 0 6px 18px rgba(15,52,72,.08); }
.vp-arte h2 { margin: 14px 0 6px; font-size: clamp(26px, 3vw, 38px); line-height: 1.15; font-weight: 800; color: var(--vp-texto); }
.vp-arte p { margin: 0; color: var(--vp-suave); font-size: 16px; line-height: 1.5; }
.vp-lado { display: flex; align-items: center; justify-content: center; padding: 32px 24px; }
.vp-caixa { width: 100%; max-width: 440px; background: #fff; border: 1px solid var(--vp-borda); border-radius: 22px; padding: 26px 26px 28px;
    box-shadow: 0 24px 60px -28px rgba(15,52,72,.35); text-align: center; }
.vp-topo { display: flex; justify-content: flex-end; margin: -8px -8px 4px; }
.vp-logo { display: block; width: 118px; height: auto; margin: 0 auto 12px; }
.vp-caixa h1 { margin: 0 0 6px; font-size: 24px; font-weight: 800; color: var(--vp-texto); }
.vp-empresa { display: inline-block; margin: 0 0 18px; padding: 6px 14px; border-radius: 999px; background: var(--vp-claro); color: var(--vp-p2); font-weight: 800; }
.vp-caixa p { margin: 0 0 18px; color: var(--vp-suave); line-height: 1.55; }
.vp-passos { text-align: left; font-size: 14.5px; background: var(--vp-fundo); border: 1px solid var(--vp-borda); border-radius: 14px; padding: 12px 16px 12px 34px; margin: 0 0 18px; color: var(--vp-texto); }
.vp-passos li { margin: 5px 0; line-height: 1.45; }
.vp-passos li::marker { color: var(--vp-p1); font-weight: 800; }
.vp-btn { display: block; width: 100%; padding: 14px 16px; border: 0; border-radius: 14px; font-family: inherit; font-size: 16px; font-weight: 800; line-height: 1.2; text-decoration: none; margin-bottom: 10px; cursor: pointer; transition: transform .15s ease, box-shadow .15s ease; }
.vp-btn:hover { transform: translateY(-1px); }
.vp-btn:focus-visible { outline: 3px solid rgba(21,148,168,.35); outline-offset: 2px; }
.vp-btn--principal { background: linear-gradient(135deg, var(--vp-p1), var(--vp-p2)); color: #fff; box-shadow: 0 12px 24px -12px rgba(12,122,146,.7); }
.vp-btn--secundario { background: var(--vp-claro); color: var(--vp-p2); }
.vp-btn--perigo { background: #d64560; color: #fff; }
.vp-erro { color: #a3283c !important; }
.vp-ok h1 { color: #1f6b4d; }
.vp-rodape { margin-top: 14px; font-size: 12.5px; color: var(--vp-suave); }

@media (max-width: 860px) {
    .vp-shell { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
    .vp-arte { min-height: 180px; padding: 22px 20px; align-items: flex-end; background-position: 88% 40%; }
    .vp-arte h2 { font-size: 22px; margin-top: 8px; }
    .vp-arte p { display: none; }
    .vp-lado { align-items: flex-start; padding: 0 16px 28px; margin-top: -26px; position: relative; z-index: 2; }
    .vp-caixa { padding: 22px 18px 24px; }
}

/* formulários das páginas públicas (Esqueci minha senha e Criar senha nova). 10/11/2026 */
.vp-form { text-align: left; margin: 0 0 4px; }
.vp-campo { display: block; font-size: 13.5px; font-weight: 700; color: var(--vp-texto); margin: 0 0 12px; }
.vp-campo input { display: block; width: 100%; height: 48px; margin-top: 6px; padding: 0 14px; border: 1px solid var(--vp-borda); border-radius: 12px;
    background: var(--vp-fundo); color: var(--vp-texto); font: inherit; font-size: 16px; font-weight: 400; }
.vp-campo input:focus { outline: none; border-color: var(--vp-p1); box-shadow: 0 0 0 3px rgba(21,148,168,.18); background: #fff; }
.vp-ver { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--vp-suave); margin: -2px 0 14px; cursor: pointer; }
.vp-ver input { width: 17px; height: 17px; accent-color: var(--vp-p1); }