* { margin:0; padding:0; box-sizing:border-box; transition: background-color .2s, border-color .2s, color .2s; }

body {
    font-family:'Sora',sans-serif;
    background:#eef1f7;
    min-height:100vh;
    display:flex; flex-direction:column;
    align-items:center; justify-content:center;
    padding:24px 16px;
    -webkit-font-smoothing:antialiased;
}

/* ─── THEME TOGGLE ─── */
.theme-toggle {
    position:fixed; top:16px; right:16px;
    width:36px; height:36px; border-radius:8px;
    background:#ffffff; border:1px solid #e2e8f0;
    display:flex; align-items:center; justify-content:center;
    font-size:16px; cursor:pointer; z-index:100;
    box-shadow:0 1px 4px rgba(14,27,46,.08);
}
.theme-toggle:hover { background:#f1f5f9; }

/* ─── CARD PRINCIPAL ─── */
.card {
    background:#ffffff; border:1.5px solid #e2e8f0; border-radius:16px;
    width:100%; max-width:400px; box-shadow:0 4px 24px rgba(14,27,46,.08);
    overflow:hidden;
}
.card-accent { height:4px; background: linear-gradient(90deg, #ea580c, #fb923c); }
.card-body { padding:36px 36px 32px; }

/* ─── HEADER ─── */
.card-header { text-align:center; margin-bottom:32px; }
.logo-wrap {
    width:52px; height:52px; border-radius:12px; background:#ea580c;
    display:flex; align-items:center; justify-content:center;
    margin:0 auto 14px; box-shadow:0 4px 12px rgba(234,88,12,.25);
}
.logo-wrap svg { width:24px; height:24px; }
.card-title { font-size:20px; font-weight:800; letter-spacing:2px; text-transform:uppercase; color:#0f172a; margin-bottom:4px; }
.card-sub { font-size:10.5px; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:#94a3b8; }

/* ─── MENSAGENS FLASK (ERRO E SUCESSO) ─── */
.error-box {
    background: #fef2f2; border: 1.5px solid #fecaca; color: #b91c1c;
    padding: 12px; border-radius: 9px; font-size: 13px; font-weight: 600;
    text-align: center; margin-bottom: 20px;
}
.success-box {
    background: #f0fdf4; border: 1.5px solid #bbf7d0; color: #15803d;
    padding: 12px; border-radius: 9px; font-size: 13px; font-weight: 600;
    text-align: center; margin-bottom: 20px;
}

/* ─── FORM FIELDS ─── */
.form-group { margin-bottom:16px; }
.form-group label {
    display:block; font-size:11px; font-weight:700; color:#64748b; 
    letter-spacing:1px; text-transform:uppercase; margin-bottom:6px;
}
.input-wrap { position:relative; }
.input-wrap input {
    width:100%; background:#f8fafc; border:1.5px solid #e2e8f0; border-radius:9px;
    padding:11px 40px 11px 14px; font-family:'Sora',sans-serif; font-size:14px;
    font-weight:500; color:#0f172a; outline:none;
}
.input-wrap input:focus { border-color:#fb923c; background:#fff; box-shadow:0 0 0 3px rgba(251,146,60,.12); }
.input-wrap input::placeholder { color:#cbd5e1; font-weight:400; }

.eye-btn {
    position:absolute; right:12px; top:50%; transform:translateY(-50%);
    background:none; border:none; cursor:pointer; color:#94a3b8; 
    padding:4px; display:flex; align-items:center;
}
.eye-btn:hover { color:#475569; }

/* BARRA DE FORÇA DA SENHA */
.pwd-strength { margin-top:8px; }
.pwd-bar-track { height:3px; background:#e2e8f0; border-radius:2px; overflow:hidden; margin-bottom:5px; }
.pwd-bar-fill { height:100%; border-radius:2px; width:0%; background:#e2e8f0; transition: width .3s, background .3s; }
.pwd-hint { font-size:11px; color:#94a3b8; }

.divider { height:1px; background:#e2e8f0; margin:22px 0; }

/* ─── BOTÕES AÇÕES ─── */
.btn-submit {
    width:100%; padding:14px; background:#ea580c; border:none; border-radius:9px;
    font-family:'Sora',sans-serif; font-size:14px; font-weight:700;
    letter-spacing:.5px; text-transform:uppercase; color:#fff; cursor:pointer; 
    margin-bottom:14px; box-shadow:0 3px 10px rgba(234,88,12,.25);
}
.btn-submit:hover { background:#c2410c; box-shadow:0 4px 14px rgba(234,88,12,.35); transform:translateY(-1px); }
.btn-submit:active { transform:scale(.99); }

/* ─── FOOTER ─── */
.card-footer { text-align:center; }
.link-back {
    font-size:12px; font-weight:600; color:#64748b; text-decoration:none; 
    cursor:pointer; display:inline-flex; align-items:center; gap:5px;
}
.link-back:hover { color:#0f172a; }
.page-footer { margin-top:24px; text-align:center; font-size:11px; color:#94a3b8; }

/* ══ DARK MODE ══ */
body.dark { background:#212121; }
body.dark .theme-toggle { background:#2f2f2f; border-color:#3a3a3a; color:#8e8ea0; }
body.dark .theme-toggle:hover { background:#3a3a3a; }
body.dark .card { background:#2f2f2f; border-color:#3a3a3a; box-shadow:0 4px 24px rgba(0,0,0,.25); }
body.dark .card-title { color:#ececec; }
body.dark .card-sub { color:#888; }
body.dark .logo-wrap { background:#c2410c; }
body.dark .error-box { background: rgba(185,28,28,0.1); border-color: #7f1d1d; color: #fca5a5; }
body.dark .success-box { background: rgba(21,128,61,0.1); border-color: #14532d; color: #86efac; }
body.dark .form-group label { color:#999; }
body.dark .input-wrap input { background:#3a3a3a; border-color:#444; color:#d1d1d1; }
body.dark .input-wrap input:focus { border-color:#fb923c; background:#444; box-shadow:0 0 0 3px rgba(251,146,60,.08); }
body.dark .input-wrap input::placeholder { color:#777; }
body.dark .eye-btn { color:#888; }
body.dark .eye-btn:hover { color:#aaa; }
body.dark .pwd-bar-track { background:#3a3a3a; }
body.dark .pwd-hint { color:#888; }
body.dark .divider { background:#3a3a3a; }
body.dark .btn-submit { background:#c2410c; box-shadow:0 3px 10px rgba(194,65,12,.2); }
body.dark .btn-submit:hover { background:#9a3412; }
body.dark .link-back { color:#999; }
body.dark .link-back:hover { color:#d1d1d1; }
body.dark .page-footer { color:#999; }
/* ── RESPONSIVO ── */
@media(max-width:480px) {
  body { padding:16px 12px; }
  .card-body { padding:24px 20px 20px; }
  .card-title { font-size:17px; }
}