@charset "utf-8";

:root {
  --auth-ink: #172019;
  --auth-muted: #657166;
  --auth-line: #d8e2d9;
  --auth-green: #176b32;
  --auth-green-dark: #0f5426;
  --auth-green-soft: #edf8ef;
  --auth-bg: #f5f8f5;
  --auth-danger: #8b2b20;
  --auth-danger-bg: #fff0ee;
  --auth-focus: #f4bd53;
}

* { box-sizing: border-box; }
html, body { min-height: 100%; }
body { margin: 0; min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 24px 16px; position: relative; overflow-x: hidden; background: linear-gradient(180deg, #245879 0%, #5d96ad 34%, #dcecf5 78%, #f5f9fc 100%); color: var(--auth-ink); font: 14px/1.4 Arial, Helvetica, sans-serif; }
body::before, body::after { position: fixed; z-index: 0; display: block; border-radius: 50%; content: ""; pointer-events: none; }
body::before { top: -180px; right: -120px; width: 440px; height: 440px; background: rgba(255,255,255,.08); }
body::after { bottom: -220px; left: -170px; width: 520px; height: 520px; background: rgba(255,255,255,.18); }
.login-boto { position: fixed; z-index: 0; top: 50%; left: max(18px, calc(50% - 900px)); width: min(42vw, 560px); height: auto; opacity: .96; pointer-events: none; transform: translateY(-50%); }
.login-onca { position: fixed; z-index: 0; top: 50%; right: max(-140px, calc(50% - 760px)); width: min(27vw, 350px); height: auto; opacity: .94; pointer-events: none; transform: translateY(-50%); }
.auth-code-boto { position: fixed; z-index: 0; top: 50%; right: max(18px, calc(50% - 900px)); width: min(42vw, 560px); height: auto; opacity: .96; pointer-events: none; transform: translateY(-50%) scaleX(-1); }
main { width: 100%; }
.auth-shell { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 570px) minmax(190px, 280px); align-items: center; gap: 34px; width: min(100%, 930px); margin: 0 auto; transform: none; }
.auth-shell.auth-shell-centered { grid-template-columns: minmax(0, 570px); justify-content: center; }
.auth-shell.auth-shell-code { width: min(100%, 980px); justify-content: start; margin-left: max(16px, calc(50% - 490px)); }
.auth-card, .box { width: 100%; max-width: 570px; margin: 0 auto; padding: 30px; background: rgba(255,255,255,.97); border: 1px solid rgba(216,226,217,.9); border-radius: 22px; box-shadow: 0 20px 48px rgba(25,72,92,.16); }
.auth-header { display: flex; align-items: flex-start; gap: 13px; margin-bottom: 21px; }
.brand-mark { width: 42px; height: 42px; flex: 0 0 42px; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; background: var(--auth-green-soft); border: 1px solid #b9dfc0; overflow: hidden; }
.brand-mark img { width: 100%; height: 100%; display: block; object-fit: contain; }
.auth-legacy-brand { display: flex; align-items: center; justify-content: center; gap: 9px; margin: 0 0 10px; }
.auth-legacy-brand .brand-mark { width: 34px; height: 34px; flex: 0 0 34px; border-radius: 9px; }
.auth-legacy-brand .titulo-sistema { margin: 0; color: var(--auth-green); font-size: 20px; font-weight: 800; }
.eyebrow { margin: 0 0 3px; color: var(--auth-green); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.auth-brand-name { margin: 0 0 22px; color: var(--auth-green); font-size: clamp(20px, 2.2vw, 25px); font-weight: 800; letter-spacing: .01em; line-height: 1.2; text-transform: none; }
.auth-brand-name em, .auth-legacy-brand .titulo-sistema em { font-style: italic; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.auth-title { margin: 0; color: var(--auth-ink); font-size: 23px; line-height: 1.15; }
.auth-subtitle { margin: 6px 0 0; color: var(--auth-muted); font-size: 13px; }
.login-slogan { max-width: 280px; margin: 0; padding: 0 8px; color: #101820; text-align: left; text-shadow: 0 1px 0 rgba(255,255,255,.45); font-size: clamp(17px, 2vw, 25px); font-weight: 800; line-height: 1.3; }
.login-slogan a { color: #101820; text-decoration: underline; text-underline-offset: 3px; }
.login-slogan a:hover { color: #0a273b; }
.auth-note { display: grid; gap: 2px; margin-bottom: 21px; padding: 11px 12px; border: 1px solid #b9dfc0; border-radius: 8px; background: var(--auth-green-soft); color: #315a3a; font-size: 12px; }
.auth-note strong { color: var(--auth-green); font-size: 13px; }
form { display: grid; gap: 7px; width: 100%; }
label { margin-top: 6px; color: #35533d; font-size: 12px; font-weight: 800; }
label:first-child { margin-top: 0; }
input, select { width: 100%; min-height: 42px; padding: 10px 12px; border: 1px solid #cbd8cd; border-radius: 7px; outline: 0; background: #fff; color: var(--auth-ink); font: inherit; }
input::placeholder { color: #829087; }
input:focus-visible, select:focus-visible, button:focus-visible, a:focus-visible { outline: 3px solid var(--auth-focus); outline-offset: 2px; }
select:disabled { background: #f2f5f2; color: #8a948c; cursor: not-allowed; }
.maestro-field-active { background: #effaf0 !important; border-color: #86bd91 !important; box-shadow: 0 0 0 2px rgba(62, 145, 76, .12); }
.field-help { margin: -2px 0 2px; color: var(--auth-muted); font-size: 11px; }
.password-field { position: relative; }
.password-field input { padding-right: 84px; }
.password-toggle { position: absolute; top: 5px; right: 5px; min-height: 32px; padding: 5px 8px; border: 1px solid transparent; border-radius: 5px; background: transparent; color: var(--auth-green); font-size: 11px; font-weight: 800; cursor: pointer; }
.password-toggle:hover { background: var(--auth-green-soft); }
.password-toggle:focus-visible, .captcha-refresh:focus-visible { outline: 0; box-shadow: none; }
.captcha-block { display: grid; gap: 7px; margin-top: 6px; }
.captcha-visual { display: flex; align-items: center; gap: 8px; }
.captcha-visual img { display: block; width: min(320px, calc(100% - 76px)); height: auto; border: 1px solid #cbd8cd; border-radius: 8px; background: #f7fafc; }
.captcha-refresh { flex: 0 0 auto; min-height: 38px; padding: 8px 10px; border: 1px solid var(--auth-line); border-radius: 7px; background: #fff; color: #1a4369; font: inherit; font-size: 11px; font-weight: 800; cursor: pointer; }
.captcha-refresh:hover { border-color: #91b8d4; background: #eef6fb; }
.captcha-input { text-transform: uppercase; letter-spacing: .16em; }
.legacy-captcha-trap { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }
.legacy-captcha-trap input { min-height: 1px; width: 1px; padding: 0; border: 0; }
button[type="submit"] { width: 100%; min-height: 44px; margin-top: 12px; padding: 10px 14px; border: 1px solid var(--auth-green); border-radius: 7px; background: var(--auth-green); color: #fff; font: inherit; font-weight: 800; cursor: pointer; }
button[type="submit"]:hover { background: var(--auth-green-dark); }
.auth-links { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin-top: 16px; font-size: 12px; }
.auth-link { display: grid; position: relative; gap: 3px; min-height: 65px; padding: 11px 34px 10px 12px; border: 1px solid var(--auth-line); border-radius: 9px; background: #fbfdfb; color: var(--auth-ink); text-decoration: none; transition: border-color .15s ease,background .15s ease,transform .15s ease; }
.auth-link:hover { border-color: #9ccaa5; background: var(--auth-green-soft); transform: translateY(-1px); }
.auth-link-title { color: var(--auth-green); font-weight: 800; }
.auth-link-desc { color: var(--auth-muted); font-size: 11px; line-height: 1.25; }
.auth-link-arrow { position: absolute; top: 50%; right: 12px; color: var(--auth-green); font-size: 17px; transform: translateY(-50%); }
.auth-links-single { grid-template-columns: minmax(0,1fr); }
.public-contact-link { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:12px; padding:11px 12px; border:1px solid #b9dfc0; border-radius:9px; background:var(--auth-green-soft); color:var(--auth-green); text-decoration:none; }
.public-contact-link:hover { border-color:#8fc39b; background:#e3f3e6; }
.public-contact-link strong, .public-contact-link small { display:block; }
.public-contact-link strong { font-size:12px; }
.public-contact-link small { margin-top:2px; color:var(--auth-muted); font-size:11px; }
.public-contact-link > span:last-child { font-size:18px; }
.auth-footer { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 20px; color: var(--auth-muted); font-size: 11px; text-align: center; }
.security-dot { width: 7px; height: 7px; border-radius: 50%; background: #5ba66a; }
.err { min-height: 0; margin-top: 14px; padding: 0; color: var(--auth-danger); font-size: 12px; }
.err:not(:empty) { padding: 10px 11px; border: 1px solid #e6a7a0; border-radius: 7px; background: var(--auth-danger-bg); }
.status-ok, .status-warning { margin-top: 14px; padding: 10px 11px; border-radius: 7px; font-size: 12px; }
.status-ok { border: 1px solid #b9dfc0; background: var(--auth-green-soft); color: #1f6330; }
.status-warning { border: 1px solid #edcd83; background: #fff4d7; color: #76500b; }
.box > h2.titulo-sistema, .box > h2.titulo-login { margin: 0 0 10px; text-align: center; }
.titulo-sistema { color: var(--auth-green); font-size: 20px; }
.titulo-login { color: var(--auth-ink); font-size: 18px; font-weight: 700; }
.box p { color: var(--auth-muted); }
.box form { margin-top: 14px; }
.trusted-device-option { display:flex; align-items:center; gap:8px; margin:2px 0 4px; color:var(--auth-muted); font-size:12px; font-weight:600; cursor:pointer; }
.trusted-device-option input { width:16px; min-height:16px; margin:0; accent-color:var(--auth-green); }
.trusted-location-note { margin:0 0 3px; color:var(--auth-muted); font-size:11px; line-height:1.3; }
.public-request-shell { max-width:700px; }
.public-request-form { gap:7px; }
.public-request-form fieldset { min-width:0; margin:0 0 4px; padding:0; border:0; }
.request-choice-group legend { margin:0 0 7px; color:#35533d; font-size:12px; font-weight:800; }
.request-choice { display:flex; align-items:flex-start; gap:9px; margin:0 0 7px; padding:10px 11px; border:1px solid var(--auth-line); border-radius:8px; background:#fbfdfb; cursor:pointer; }
.request-choice:has(input:checked) { border-color:#9ccaa5; background:var(--auth-green-soft); }
.request-choice input { width:auto; min-height:0; margin:2px 0 0; accent-color:var(--auth-green); }
.request-choice span { display:grid; gap:2px; }
.request-choice strong { color:var(--auth-green); font-size:12px; }
.request-choice small { color:var(--auth-muted); font-size:11px; line-height:1.25; }
.public-request-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.public-request-grid > div { min-width:0; }
.public-request-form textarea { width:100%; min-height:96px; resize:vertical; padding:10px 12px; border:1px solid #cbd8cd; border-radius:7px; outline:0; background:#fff; color:var(--auth-ink); font:inherit; }
.public-request-form textarea:focus-visible { outline:3px solid var(--auth-focus); outline-offset:2px; }
.optional { color:var(--auth-muted); font-size:10px; font-weight:400; }
.public-request-honeypot { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
@media (max-width: 1199px) {
  .auth-code-page { display: block; padding: 18px 12px 28px; }
  .auth-code-boto { position: relative; top: auto; right: auto; display: block; width: min(42vw, 360px); margin: 0 max(18px, calc(50% + 170px)) 12px auto; transform: scaleX(-1); }
  .auth-shell.auth-shell-code { width: min(100%, 570px); margin: 0 auto; justify-content: center; }
  .login-page { display: block; padding: 18px 12px 28px; }
  .login-page .login-boto { display: block; position: relative; top: auto; left: auto; width: min(62vw, 330px); margin: 0 auto 16px; transform: none; }
  .login-page .auth-shell { display: block; max-width: 570px; transform: none; }
  .login-page .auth-card { margin: 0 auto; }
  .login-page .login-slogan { max-width: 760px; margin: 20px auto 0; text-align: center; }
}
@media (max-width: 520px) { body { padding: 14px 10px; } .auth-card, .box { padding: 22px 18px; } .auth-title { font-size: 21px; } .auth-links { grid-template-columns: 1fr; } .public-request-grid { grid-template-columns:1fr; gap:0; } }
@media (max-width: 520px) {
  .login-page { padding: 10px 10px 22px; }
  .login-page .login-boto { width: min(70vw, 270px); margin-bottom: 12px; }
  .login-page .login-slogan { font-size: clamp(16px, 4.8vw, 20px); }
  .auth-code-page { padding: 10px 10px 22px; }
  .auth-code-boto { width: min(70vw, 270px); margin: 0 auto 12px; }
}
