/* Login do painel ValuNext: composição própria, mantendo o formulário e autenticação Filament. */
.vn-login {
    --vn-login-navy: #082a52;
    --vn-login-blue: #164f86;
    --vn-login-teal: #01d7a4;
    min-height: 100dvh;
    display: grid;
    grid-template-columns: minmax(24rem, 46%) minmax(32rem, 54%);
    background: #eef4fa;
    color: #10253d;
}
.vn-login * { box-sizing: border-box; }
.vn-login-brand {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: flex;
    min-height: 100dvh;
    padding: clamp(2rem, 5vw, 5rem);
    background:
        radial-gradient(circle at 18% 18%, rgb(1 215 164 / .2), transparent 27rem),
        linear-gradient(145deg, #071f3d 0%, #0a3564 56%, #126a7b 135%);
    color: #fff;
}
.vn-login-brand::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    opacity: .16;
    background-image: linear-gradient(rgb(255 255 255 / .15) 1px, transparent 1px), linear-gradient(90deg, rgb(255 255 255 / .15) 1px, transparent 1px);
    background-size: 3.5rem 3.5rem;
    mask-image: linear-gradient(to bottom right, #000, transparent 75%);
}
.vn-login-brand-inner { position: relative; z-index: 1; display: flex; flex-direction: column; width: min(34rem, 100%); margin: 0 auto; }
.vn-login-logo { display: inline-flex; width: fit-content; border-radius: .6rem; }
.vn-login-logo:focus-visible { outline: 3px solid #5eead4; outline-offset: 5px; }
.vn-login-logo img { width: 12rem; height: auto; filter: brightness(0) invert(1); opacity: .98; }
.vn-login-brand-copy { margin-block: auto; padding-block: 4rem 2.5rem; }
.vn-login-eyebrow, .vn-login-card-kicker { margin: 0 0 .8rem; font-size: .75rem; line-height: 1.2; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.vn-login-eyebrow { color: #6ee7d4; }
.vn-login-brand-copy h1 { max-width: 10ch; margin: 0; font-size: clamp(2.25rem, 4.5vw, 4.35rem); line-height: 1.02; letter-spacing: -.045em; font-weight: 800; }
.vn-login-brand-copy > p:last-child { max-width: 38rem; margin: 1.5rem 0 0; color: #c9dced; font-size: 1.05rem; line-height: 1.7; }
.vn-login-benefits { display: grid; gap: .85rem; margin: 0 0 2.5rem; padding: 0; list-style: none; }
.vn-login-benefits li { display: flex; align-items: center; gap: .8rem; color: #e6f1f8; font-size: .92rem; }
.vn-login-benefits svg { width: 1.25rem; height: 1.25rem; color: var(--vn-login-teal); flex: none; }
.vn-login-brand-foot { margin: 0; color: #96b5ce; font-size: .78rem; }
.vn-login-orb { position: absolute; z-index: -1; border-radius: 50%; filter: blur(1px); pointer-events: none; }
.vn-login-orb--one { width: 22rem; height: 22rem; right: -9rem; bottom: -7rem; background: rgb(1 215 164 / .12); }
.vn-login-orb--two { width: 11rem; height: 11rem; right: 10%; top: 12%; border: 1px solid rgb(255 255 255 / .13); }
.vn-login-access { min-width: 0; display: grid; place-items: center; padding: clamp(1.5rem, 6vw, 5rem); background: radial-gradient(circle at 78% 12%, #d8eaff, transparent 25rem), #eef4fa; }
.vn-login-access-inner { width: min(29rem, 100%); }
.vn-login-mobile-logo { display: none; }
.vn-login-card { position: relative; overflow: hidden; padding: clamp(1.5rem, 4vw, 2.6rem); border: 1px solid #d9e4ef; border-radius: 1.5rem; background: rgb(255 255 255 / .94); box-shadow: 0 30px 70px -35px rgb(8 42 82 / .42), 0 8px 24px -18px rgb(8 42 82 / .24); backdrop-filter: blur(12px); }
.vn-login-card-head { display: flex; align-items: flex-start; gap: 1rem; margin-bottom: 2rem; }
.vn-login-icon { display: grid; place-items: center; width: 3rem; height: 3rem; flex: none; border-radius: .95rem; background: #e4fbf5; color: #007a60; }
.vn-login-icon svg { width: 1.35rem; height: 1.35rem; }
.vn-login-card-kicker { margin-bottom: .35rem; color: #16816b; }
.vn-login-card-head h2 { margin: 0; color: var(--vn-login-navy); font-size: clamp(1.55rem, 3vw, 2rem); line-height: 1.15; letter-spacing: -.025em; font-weight: 800; }
.vn-login-card-head div > p:last-child { margin: .55rem 0 0; color: #60758c; font-size: .9rem; line-height: 1.55; }
.vn-login-form .fi-fo-field-label-content { color: #183653; font-weight: 700; }
.vn-login-form .fi-input-wrp { border-radius: .8rem; background: #f7fafc; box-shadow: inset 0 0 0 1px #cbd9e7; }
.vn-login-form .fi-input-wrp:focus-within { background: #fff; box-shadow: inset 0 0 0 2px #16816b, 0 0 0 3px rgb(1 215 164 / .12); }
.vn-login-form .fi-btn { min-height: 2.85rem; border-radius: .8rem; background: linear-gradient(135deg, #0d3e6e, #087966); color: #fff !important; box-shadow: 0 12px 22px -14px rgb(8 70 94 / .75); font-weight: 750; }
.vn-login-form .fi-btn:hover { filter: brightness(1.08); }
.vn-login-form a { color: #08725e; font-weight: 700; text-underline-offset: 3px; }
.vn-login-card-foot { display: flex; gap: .5rem; align-items: flex-start; margin-top: 1.65rem; padding-top: 1.25rem; border-top: 1px solid #e5edf5; color: #708399; font-size: .76rem; line-height: 1.45; }
.vn-login-card-foot svg { width: 1rem; height: 1rem; margin-top: .05rem; flex: none; color: #16816b; }
.vn-login-help { margin: 1.35rem 0 0; text-align: center; color: #60758c; font-size: .82rem; }
.vn-login-help a { color: #0b5b84; font-weight: 700; text-underline-offset: 3px; }

.dark .vn-login { color: #edf6ff; background: #10243b; }
.dark .vn-login-access { background: radial-gradient(circle at 77% 12%, rgb(38 111 168 / .32), transparent 26rem), linear-gradient(145deg, #10233a, #142b45); }
.dark .vn-login-card { border-color: #5b80a4; background: linear-gradient(155deg, rgb(32 61 93 / .98), rgb(25 49 77 / .98)); box-shadow: 0 34px 75px -30px rgb(1 9 20 / .78), 0 14px 35px -24px rgb(72 154 211 / .45); }
.dark .vn-login-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 3px; background: linear-gradient(90deg, #39dbc0, #3b91d5 60%, transparent); }
.dark .vn-login-icon { border: 1px solid rgb(94 234 212 / .2); background: #174c57; color: #74f0dc; box-shadow: 0 10px 24px -15px rgb(37 226 194 / .8); }
.dark .vn-login-card-kicker { color: #6ee7d4; }
.dark .vn-login-card-head h2 { color: #f6fbff; }
.dark .vn-login-card-head div > p:last-child, .dark .vn-login-help { color: #bed0e1; }
.dark .vn-login-form .fi-fo-field-label-content { color: #eff7ff; }
.dark .vn-login-form .fi-input-wrp { min-height: 2.85rem; overflow: hidden; border: 1px solid #6686a5; border-radius: .85rem; background: #183653; box-shadow: 0 5px 16px -14px rgb(0 0 0 / .9); transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease; }
.dark .vn-login-form .fi-input-wrp:hover { border-color: #83a3c1; background: #1c3d5c; box-shadow: 0 7px 18px -14px rgb(0 0 0 / .92); }
.dark .vn-login-form .fi-input-wrp:focus-within { border-color: #55e2ca; background: #1c3d5c; box-shadow: 0 0 0 3px rgb(85 226 202 / .16), 0 10px 22px -17px rgb(0 0 0 / .9); }
.dark .vn-login-form .fi-input { background-color: transparent; color: #fff; caret-color: #6ee7d4; }
.dark .vn-login-form .fi-input::placeholder { color: #b4c8da; opacity: 1; }
.dark .vn-login-form .fi-input-wrp-suffix { border-inline-start: 0; padding-inline: .35rem .45rem; background: transparent; color: #d4e2ee; }
.dark .vn-login-form .fi-icon-btn { width: 2rem; height: 2rem; border-radius: .55rem; background: rgb(255 255 255 / .06); color: #d4e2ee; }
.dark .vn-login-form .fi-icon-btn:hover { background: rgb(110 231 212 / .13); color: #7bf1de; }
.dark .vn-login-form .fi-checkbox-input { border-color: #7695b3; background: #294a6b; }
.dark .vn-login-form .fi-checkbox-input:checked { border-color: #45d9c0; background: #168a78; }
.dark .vn-login-form a, .dark .vn-login-help a { color: #7bf1de; }
.dark .vn-login-form .fi-btn { background: linear-gradient(135deg, #17659b, #0e9a82); box-shadow: 0 14px 28px -16px rgb(20 205 173 / .72); }
.dark .vn-login-card-foot { border-color: #486989; color: #adc2d6; }
.dark .vn-login-card-foot svg { color: #70dfca; }

@media (max-width: 900px) {
    .vn-login { grid-template-columns: 1fr; }
    .vn-login-brand { display: none; }
    .vn-login-access { min-height: 100dvh; padding: 1.2rem; }
    .vn-login-mobile-logo { display: block; width: 10rem; margin: 0 auto 1.25rem; }
    .vn-login-mobile-logo img { display: block; width: 100%; height: auto; }
    .dark .vn-login-mobile-logo img { filter: brightness(0) invert(1); }
}
@media (max-width: 420px) {
    .vn-login-card { padding: 1.25rem; border-radius: 1.15rem; }
    .vn-login-card-head { gap: .75rem; margin-bottom: 1.5rem; }
    .vn-login-icon { width: 2.6rem; height: 2.6rem; }
}
@media (prefers-reduced-motion: reduce) {
    .vn-login-form .fi-btn { transition: none; }
}