.auth-body {
    min-height: 100vh;
    margin: 0;
    overflow-x: hidden;
    background: var(--surface-soft);
    color: var(--text-dark);
    font-family: 'Inter', sans-serif;
}

.auth-body *, .auth-body *::before, .auth-body *::after { box-sizing: border-box; }

.login-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: minmax(600px, 1.05fr) minmax(520px, .95fr);
    background: var(--surface);
}

.login-presentation {
    position: relative;
    min-height: 100vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    padding: 54px 58px 40px 70px;
    background:
        radial-gradient(circle at 70% 15%, rgba(255,255,255,.86), transparent 24%),
        radial-gradient(circle at 12% 60%, rgba(132,204,22,.12), transparent 32%),
        linear-gradient(140deg, #fbfcf8 0%, #f7faf3 48%, #eef6ef 100%);
}

.login-decorations { position: absolute; inset: 0; pointer-events: none; color: #6aa475; opacity: .055; }
.login-decorations svg { position: absolute; width: 58px; height: 58px; }
.login-decorations svg:nth-child(1) { right: 13%; top: 11%; transform: rotate(8deg); }
.login-decorations svg:nth-child(2) { left: 9%; top: 15%; transform: rotate(-12deg); }
.login-decorations svg:nth-child(3) { right: 19%; top: 27%; transform: rotate(14deg); }
.login-decorations svg:nth-child(4) { right: 7%; top: 34%; transform: rotate(-8deg); }
.login-decorations svg:nth-child(5) { left: 34%; top: 7%; }

.login-brand, .login-message, .login-benefits { position: relative; z-index: 3; }
.login-brand { display: flex; align-items: center; gap: 15px; }
.login-brand-logo {
    width: 92px;
    height: 92px;
    object-fit: contain;
    border-radius: 20px;
    background: rgba(255,255,255,.72);
    padding: 5px;
}
.login-brand strong { display: block; font-size: clamp(32px, 2.6vw, 46px); line-height: 1; letter-spacing: -.035em; color: #176a37; }
.login-brand strong b { color: #f28a13; }
.login-brand small { display: block; margin-top: 7px; font-size: 17px; color: #3f4752; }

.login-message { max-width: 590px; margin: 54px 0 0 52px; }
.login-message h1 { margin: 0; color: #151b24; font-size: clamp(40px, 4.2vw, 63px); line-height: 1.12; letter-spacing: -.04em; }
.login-accent { display: block; width: 82px; height: 6px; margin: 23px 0 18px; border-radius: 999px; background: #25853f; }
.login-message p { max-width: 560px; margin: 0; color: #515966; font-size: clamp(16px, 1.3vw, 20px); line-height: 1.6; }

.login-photo {
    position: absolute;
    z-index: 1;
    left: 0;
    right: 0;
    bottom: 112px;
    height: 43%;
    min-height: 310px;
    background-image: linear-gradient(to bottom, rgba(247,250,243,0) 0%, rgba(247,250,243,.05) 68%, rgba(247,250,243,.18) 100%), url('../../images/login-school-hero.jpg');
    background-size: cover;
    background-position: center 58%;
}
.login-photo::before {
    content: '';
    position: absolute;
    inset: -1px 0 auto;
    height: 95px;
    background: linear-gradient(to bottom, #f4f8f1 0%, rgba(244,248,241,.68) 42%, transparent 100%);
}
.login-wave { position: absolute; left: -8%; width: 118%; border-radius: 50%; }
.login-wave-green { bottom: -74px; height: 150px; background: linear-gradient(100deg, #1f7f38, #7ebc43); transform: rotate(2deg); }
.login-wave-light { bottom: -114px; height: 145px; background: #fff; transform: rotate(-2deg); }

.login-benefits {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 30px;
    margin-top: auto;
    padding-top: 52px;
}
.login-benefits article { display: flex; align-items: flex-start; gap: 13px; min-width: 0; }
.login-benefits article > span { width: 54px; height: 54px; flex: 0 0 54px; display: grid; place-items: center; border: 1px solid #91bf8e; border-radius: 12px; background: rgba(255,255,255,.92); color: #287a39; }
.login-benefits svg { width: 27px; height: 27px; }
.login-benefits p { margin: 0; }
.login-benefits strong { display: block; margin: 2px 0 4px; color: #227635; font-size: 16px; }
.login-benefits small { display: block; color: #68717d; font-size: 13px; line-height: 1.45; }

.login-access {
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 34px clamp(34px, 5vw, 74px);
    background: var(--surface);
}
.login-theme-toggle {
    position: absolute;
    top: 22px;
    right: 24px;
    z-index: 5;
    width: 45px;
    height: 45px;
    display: grid;
    place-items: center;
    border: 1px solid var(--border);
    border-radius: 13px;
    background: var(--surface);
    color: var(--text-dark);
    box-shadow: var(--shadow-sm);
    cursor: pointer;
    transition: .2s ease;
}
.login-theme-toggle:hover { color: #fff; border-color: var(--primary); background: var(--primary); transform: translateY(-2px); }
.login-theme-toggle svg { width: 20px; height: 20px; }

.login-card {
    width: min(100%, 660px);
    padding: 52px 66px 42px;
    border: 1px solid var(--border);
    border-radius: 25px;
    background: var(--surface);
    box-shadow: 0 20px 55px rgba(15,23,42,.12);
}
.login-card-icon { width: 100px; height: 100px; display: grid; place-items: center; margin: 0 auto 22px; border-radius: 50%; color: #26743b; background: radial-gradient(circle, #f7fbf4 0%, #edf6e8 72%); }
.login-card-icon svg { width: 56px; height: 56px; }
.login-heading { text-align: center; margin-bottom: 34px; }
.login-heading h2 { margin: 0 0 7px; color: var(--text-dark); font-size: clamp(34px, 3.8vw, 44px); letter-spacing: -.035em; }
.login-heading p { margin: 0; color: var(--text-light); font-size: 17px; }

.auth-error { display: flex; align-items: center; gap: 10px; margin-bottom: 22px; padding: 14px 16px; border: 1px solid #fecaca; border-radius: 13px; background: var(--red-soft); color: #b91c1c; font-size: 14px; font-weight: 700; }
.auth-error svg { width: 19px; height: 19px; }
.auth-form { display: flex; flex-direction: column; gap: 20px; }
.form-group { display: flex; flex-direction: column; }
.form-group label { margin-bottom: 9px; color: var(--text-dark); font-size: 14px; font-weight: 700; }
.input-icon { min-height: 58px; display: flex; align-items: center; gap: 13px; padding: 0 15px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface); transition: border-color .2s, box-shadow .2s, background .2s; }
.input-icon:focus-within { border-color: var(--primary); box-shadow: 0 0 0 4px rgba(22,163,74,.11); }
.input-icon > svg { width: 20px; height: 20px; flex: 0 0 auto; color: var(--text-light); }
.input-icon input { min-width: 0; flex: 1; border: 0; outline: 0; background: transparent; color: var(--text-dark); font: inherit; font-size: 15px; }
.input-icon input::placeholder { color: #8b95a5; }
.password-toggle { width: 38px; height: 38px; display: grid; place-items: center; border: 0; border-radius: 9px; background: transparent; color: var(--text-light); cursor: pointer; }
.password-toggle:hover { color: var(--primary); background: var(--green-soft); }
.password-toggle svg { width: 20px; height: 20px; }

.login-form-options { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: -3px; }
.remember-option { display: inline-flex; align-items: center; gap: 10px; color: var(--text); font-size: 14px; cursor: pointer; }
.remember-option input { width: 20px; height: 20px; accent-color: var(--primary); }
.login-link-button { border: 0; padding: 0; background: transparent; color: #23823d; font: inherit; font-size: 14px; cursor: pointer; }
.login-link-button:hover { text-decoration: underline; }

.btn-login { min-height: 58px; display: inline-flex; align-items: center; justify-content: center; gap: 11px; margin-top: 2px; border: 0; border-radius: 8px; background: linear-gradient(105deg, #188039, #2f9348); box-shadow: 0 12px 24px rgba(22,163,74,.20); color: #fff; font-size: 16px; font-weight: 800; cursor: pointer; transition: .2s ease; }
.btn-login:hover { transform: translateY(-2px); box-shadow: 0 16px 30px rgba(22,163,74,.28); filter: brightness(1.03); }
.btn-login svg { width: 21px; height: 21px; }

.login-divider { display: flex; align-items: center; gap: 20px; margin: 34px 0 24px; color: var(--text-light); font-size: 13px; }
.login-divider::before, .login-divider::after { content: ''; height: 1px; flex: 1; background: var(--border); }
.login-divider span { white-space: nowrap; }
.login-social-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.social-login-button { min-height: 58px; display: flex; align-items: center; justify-content: center; gap: 12px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface); color: var(--text); font: inherit; font-size: 15px; cursor: pointer; transition: .2s ease; }
.social-login-button:hover { border-color: var(--primary); background: var(--green-soft); transform: translateY(-1px); }
.google-mark { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: conic-gradient(#4285f4 0 25%, #34a853 25% 50%, #fbbc05 50% 75%, #ea4335 75%); color: #fff; font-weight: 800; border: 3px solid #fff; box-shadow: 0 0 0 1px #ddd; }
.microsoft-mark { width: 24px; height: 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 2px; }
.microsoft-mark i:nth-child(1) { background: #f25022; } .microsoft-mark i:nth-child(2) { background: #7fba00; } .microsoft-mark i:nth-child(3) { background: #00a4ef; } .microsoft-mark i:nth-child(4) { background: #ffb900; }
.login-feedback { min-height: 0; margin-top: 0; overflow: hidden; opacity: 0; color: #8a6414; background: var(--yellow-soft); border-radius: 10px; text-align: center; font-size: 13px; transition: .2s ease; }
.login-feedback.is-visible { min-height: 40px; margin-top: 18px; padding: 11px 14px; opacity: 1; }
.login-footer { margin-top: 38px; color: var(--text-light); font-size: 12px; text-align: center; }
.login-footer strong { color: #29793d; }

/* Tema escuro completo do login */
html[data-theme="dark"] .auth-body { background: #0f151b; }
html[data-theme="dark"] .login-shell { background: #0f151b; }
html[data-theme="dark"] .login-presentation {
    background:
        radial-gradient(circle at 70% 15%, rgba(255,255,255,.035), transparent 24%),
        radial-gradient(circle at 12% 60%, rgba(34,197,94,.08), transparent 32%),
        linear-gradient(140deg, #121916 0%, #15211a 48%, #102017 100%);
}
html[data-theme="dark"] .login-brand-logo { background: rgba(255,255,255,.92); }
html[data-theme="dark"] .login-brand small,
html[data-theme="dark"] .login-message p,
html[data-theme="dark"] .login-benefits small { color: #a9b5b0; }
html[data-theme="dark"] .login-message h1 { color: #f8fafc; }
html[data-theme="dark"] .login-photo { filter: brightness(.52) saturate(.76); }
html[data-theme="dark"] .login-photo::before { background: linear-gradient(to bottom, #142019 0%, rgba(20,32,25,.74) 42%, transparent 100%); }
html[data-theme="dark"] .login-wave-light { background: #111820; }
html[data-theme="dark"] .login-benefits article > span { background: rgba(20,31,25,.9); border-color: #315d3d; }
html[data-theme="dark"] .login-benefits strong { color: #86efac; }
html[data-theme="dark"] .login-access { background: #0f151b; }
html[data-theme="dark"] .login-card { background: #18212a; border-color: #33404d; box-shadow: 0 22px 60px rgba(0,0,0,.42); }
html[data-theme="dark"] .login-card-icon { background: radial-gradient(circle, #203c2b, #172c22); color: #86efac; }
html[data-theme="dark"] .input-icon,
html[data-theme="dark"] .social-login-button,
html[data-theme="dark"] .login-theme-toggle { background: #202b35; border-color: #3a4856; color: #e6edf3; }
html[data-theme="dark"] .input-icon input { color: #f8fafc; }
html[data-theme="dark"] .login-link-button { color: #86efac; }
html[data-theme="dark"] .social-login-button:hover { background: #173127; }
html[data-theme="dark"] .google-mark { border-color: #202b35; }

@media (max-width: 1180px) {
    .login-shell { grid-template-columns: minmax(510px, .9fr) minmax(500px, 1.1fr); }
    .login-presentation { padding-left: 42px; padding-right: 38px; }
    .login-message { margin-left: 20px; }
    .login-benefits { gap: 14px; }
}
@media (max-width: 930px) {
    .login-shell { display: block; }
    .login-presentation { min-height: 520px; padding: 30px 28px 30px; }
    .login-message { margin: 35px 0 0; }
    .login-message h1 { font-size: clamp(34px, 7vw, 50px); }
    .login-photo { bottom: 0; height: 50%; min-height: 240px; opacity: .72; }
    .login-benefits { display: none; }
    .login-access { min-height: auto; padding: 62px 24px 42px; }
}
@media (max-width: 620px) {
    .login-presentation { min-height: 420px; padding: 22px 20px; }
    .login-brand-logo { width: 64px; height: 64px; }
    .login-brand strong { font-size: 28px; }
    .login-brand small { font-size: 12px; }
    .login-message { margin-top: 26px; }
    .login-message h1 { font-size: 34px; }
    .login-message p { font-size: 14px; }
    .login-card { padding: 40px 22px 30px; border-radius: 20px; }
    .login-form-options { align-items: flex-start; }
    .login-social-actions { grid-template-columns: 1fr; gap: 12px; }
    .login-theme-toggle { top: 14px; right: 14px; }
}

/* ==========================================================
   LOGIN 2.1 — CENÁRIO DA ESCOLA E ESTUDANTES
========================================================== */
.login-photo {
    bottom: 104px;
    height: 51%;
    min-height: 390px;
    background-image:
        linear-gradient(to bottom, rgba(247,250,243,0) 0%, rgba(247,250,243,.015) 66%, rgba(247,250,243,.08) 100%),
        url('../../images/login-school-students.jpg');
    background-size: cover;
    background-position: center bottom;
    background-repeat: no-repeat;
}

.login-photo::before {
    height: 82px;
    background: linear-gradient(to bottom, #f4f8f1 0%, rgba(244,248,241,.54) 38%, transparent 100%);
}

.login-wave-green {
    bottom: -80px;
    height: 158px;
}

.login-wave-light {
    bottom: -122px;
    height: 152px;
}

html[data-theme="dark"] .login-photo {
    filter: brightness(.62) saturate(.78) contrast(1.04);
}

html[data-theme="dark"] .login-photo::before {
    background: linear-gradient(to bottom, #142019 0%, rgba(20,32,25,.58) 38%, transparent 100%);
}

html[data-theme="dark"] .login-heading h2,
html[data-theme="dark"] .form-group label,
html[data-theme="dark"] .remember-option,
html[data-theme="dark"] .social-login-button,
html[data-theme="dark"] .login-footer {
    color: #eef4f8 !important;
}

html[data-theme="dark"] .login-heading p,
html[data-theme="dark"] .login-divider {
    color: #9eacba !important;
}

html[data-theme="dark"] .login-divider::before,
html[data-theme="dark"] .login-divider::after {
    background: #3a4856 !important;
}

@media (max-width: 930px) {
    .login-photo {
        height: 58%;
        min-height: 280px;
        background-position: center bottom;
    }
}


/* ==========================================================
   LOGIN 2.2 — CORREÇÃO DO CENÁRIO FOTOGRÁFICO
   O CSS está em assets/css/pages; imagens estão em assets/images.
========================================================== */
.login-photo {
    isolation: isolate;
    opacity: 1 !important;
    visibility: visible !important;
    background-image:
        linear-gradient(to bottom, rgba(247,250,243,0) 0%, rgba(247,250,243,.01) 70%, rgba(247,250,243,.06) 100%),
        url('../../images/login-school-students.jpg') !important;
    background-size: cover !important;
    background-position: center bottom !important;
    background-repeat: no-repeat !important;
}

.login-photo::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: transparent;
}

html[data-theme="dark"] .login-photo {
    opacity: 1 !important;
    filter: brightness(.68) saturate(.82) contrast(1.08) !important;
}

/* ==========================================================
   LOGIN 2.3 — ONDAS INFERIORES REFORMULADAS
   Mantém a curva decorativa abaixo da fotografia sem cobrir
   os estudantes ou criar uma faixa verde sobre o cenário.
========================================================== */
.login-photo {
    overflow: hidden;
}

.login-wave {
    left: -6%;
    width: 112%;
    pointer-events: none;
    transform-origin: center bottom;
}

.login-wave-green {
    bottom: -46px;
    height: 82px;
    border-radius: 52% 48% 0 0 / 86% 86% 0 0;
    background: linear-gradient(96deg, #176f34 0%, #2d8a3f 42%, #82bd43 100%);
    transform: rotate(1.1deg);
}

.login-wave-light {
    bottom: -69px;
    height: 74px;
    border-radius: 50% 50% 0 0 / 90% 90% 0 0;
    background: var(--surface, #fff);
    transform: rotate(-1deg);
}

html[data-theme="dark"] .login-wave-light {
    background: #121820;
}

@media (max-width: 930px) {
    .login-wave-green { bottom: -42px; height: 72px; }
    .login-wave-light { bottom: -62px; height: 66px; }
}

.login-tv-link{display:flex;align-items:center;justify-content:center;gap:.55rem;margin-top:1rem;padding:.72rem 1rem;border:1px solid var(--border-color,#dce5df);border-radius:12px;color:#087a36;text-decoration:none;font-weight:800;background:rgba(8,122,54,.05)}.login-tv-link:hover{background:rgba(8,122,54,.1)}