/* BG GLOW */
.bg-glow{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.bg-glow::before{content:'';position:absolute;top:-200px;left:-200px;width:700px;height:700px;background:radial-gradient(ellipse,rgba(26,122,58,.07) 0%,transparent 70%)}
.bg-glow::after{content:'';position:absolute;bottom:-200px;right:-200px;width:500px;height:500px;background:radial-gradient(ellipse,rgba(26,122,58,.05) 0%,transparent 70%)}

.nav-back{font-family:'Rajdhani',sans-serif;font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:.5rem;transition:color .2s;cursor:pointer}
.nav-back:hover{color:var(--green3)}

/* PAGE LAYOUT */
.page-wrap{position:relative;z-index:1;min-height:calc(100vh - 68px);display:flex;align-items:center;justify-content:center;padding:3rem 5vw}

/* TABS */
.account-box{width:100%;max-width:480px}
.account-header{text-align:center;margin-bottom:2.5rem}
.account-header .sec-label{font-family:'Rajdhani',sans-serif;font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--green3);margin-bottom:.6rem;display:flex;align-items:center;justify-content:center;gap:.7rem}
.account-header .sec-label::before,.account-header .sec-label::after{content:'';width:1.4rem;height:1px;background:var(--green3)}
.account-header h1{font-family:'Bebas Neue',sans-serif;font-size:3rem;letter-spacing:.04em;line-height:1}

.tabs{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border);margin-bottom:0;border:1px solid var(--border)}
.tab-btn{background:var(--card);padding:1rem;font-family:'Rajdhani',sans-serif;font-size:.8rem;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);border:none;cursor:pointer;transition:all .25s;position:relative;text-align:center;display:flex;align-items:center;justify-content:center}
.tab-btn::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--green2);transform:scaleX(0);transition:transform .3s}
.tab-btn.active{background:var(--green-dim);color:var(--green3)}
.tab-btn.active::after{transform:scaleX(1)}
.tab-btn:hover:not(.active){background:var(--card2);color:var(--text)}

.tab-panel{background:var(--card);border:1px solid var(--border);border-top:none;padding:2.5rem;animation:fadeUp .4s ease}
.forgot-panel{background:var(--card);border:1px solid var(--border);padding:2.5rem;animation:fadeUp .4s ease}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}

/* FORM ELEMENTS */
.form-group{margin-bottom:1.4rem}
.form-group label{display:block;font-family:'Rajdhani',sans-serif;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:.5rem}
.form-group label span{color:var(--green3);margin-left:.2rem}
.form-input{width:100%;background:var(--dark);border:1px solid var(--border2);color:var(--white);padding:.8rem 1rem;font-size:.9rem;font-family:'DM Sans',sans-serif;outline:none;transition:all .25s;-webkit-appearance:none}
.form-input:focus{border-color:var(--green2);box-shadow:0 0 0 3px rgba(34,160,77,.1);background:var(--card2)}
.form-input::placeholder{color:rgba(237,245,239,.2)}
.form-input.error{border-color:var(--red)}

/* Password wrapper */
.pw-wrap{position:relative}
.pw-toggle{position:absolute;right:.8rem;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--muted);cursor:pointer;font-size:.9rem;padding:.2rem;transition:color .2s}
.pw-toggle:hover{color:var(--green3)}

/* Checkbox (native input + visual sibling, toggled via :checked) */
.check-row{display:flex;align-items:center;gap:.8rem;cursor:pointer;margin-bottom:1.4rem;position:relative}
.check-input{position:absolute;opacity:0;width:18px;height:18px;margin:0;cursor:pointer}
.custom-check{width:18px;height:18px;border:1px solid var(--border2);background:var(--dark);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s}
.check-input:checked + .custom-check{background:var(--green);border-color:var(--green)}
.check-input:checked + .custom-check::after{content:'✓';color:#fff;font-size:.7rem;font-weight:700}
.check-label{font-size:.82rem;color:var(--muted);font-weight:300}
.check-label a{color:var(--green3);border-bottom:1px solid rgba(34,160,77,.3)}

/* Submit button */
.btn-submit{width:100%;background:var(--green);color:#fff;font-family:'Rajdhani',sans-serif;font-size:.88rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;padding:1rem;border:1px solid var(--green);cursor:pointer;transition:all .3s;position:relative;overflow:hidden;margin-top:.5rem}
.btn-submit::before{content:'';position:absolute;inset:0;background:rgba(255,255,255,.1);transform:scaleX(0);transform-origin:left;transition:transform .35s}
.btn-submit:hover{background:var(--green2);border-color:var(--green2);box-shadow:0 0 25px var(--green-glow)}
.btn-submit:hover::before{transform:scaleX(1)}
.btn-submit:active{transform:scale(.99)}

/* Divider */
.divider{display:flex;align-items:center;gap:1rem;margin:1.5rem 0}
.divider::before,.divider::after{content:'';flex:1;height:1px;background:var(--border)}
.divider span{font-family:'Rajdhani',sans-serif;font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}

/* Forgot password */
.forgot-link{font-size:.78rem;color:var(--muted);text-align:right;display:block;margin-top:-.8rem;margin-bottom:1.4rem;transition:color .2s;cursor:pointer}
.forgot-link:hover{color:var(--green3)}

/* Success / error messages */
.alert{padding:.9rem 1.2rem;margin-bottom:1.4rem;font-size:.82rem;font-weight:300;display:flex;align-items:center;gap:.7rem}
.alert-success{background:rgba(39,174,96,.1);border:1px solid rgba(39,174,96,.3);color:#2ecc71}
.alert-error{background:rgba(192,57,43,.1);border:1px solid rgba(192,57,43,.3);color:#e74c3c}
.alert-icon{font-size:1rem;flex-shrink:0}

/* Strength meter */
.strength-bar{margin-top:.5rem;display:flex;gap:3px}
.strength-seg{flex:1;height:3px;background:var(--border);border-radius:2px;transition:background .3s}
.strength-label{font-family:'Rajdhani',sans-serif;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:.3rem}

/* ═══ DASHBOARD (logged in view) ═══ */
.dash-welcome{font-family:'Bebas Neue',sans-serif;font-size:2.2rem;letter-spacing:.04em;margin-bottom:.5rem}
.dash-welcome span{color:var(--green3)}
.dash-sub{font-size:.85rem;color:var(--muted);font-weight:300;margin-bottom:2rem}
.dash-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--border);margin-bottom:2rem}
.dash-card{background:var(--card);padding:1.5rem;cursor:pointer;transition:background .25s;position:relative;overflow:hidden;text-decoration:none;color:inherit;display:flex;flex-direction:column;gap:.5rem}
.dash-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--green2);transform:scaleY(0);transform-origin:bottom;transition:transform .35s}
.dash-card:hover{background:var(--card2)}
.dash-card:hover::before{transform:scaleY(1)}
.dash-icon{font-size:1.6rem}
.dash-title{font-family:'Rajdhani',sans-serif;font-size:.82rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--white)}
.dash-desc{font-size:.75rem;color:var(--muted);font-weight:300}
.dash-badge{position:absolute;top:.8rem;right:.8rem;background:var(--green);color:#fff;font-family:'Rajdhani',sans-serif;font-size:.55rem;letter-spacing:.1em;text-transform:uppercase;padding:.2rem .5rem;font-weight:700}
.btn-logout{width:100%;background:none;border:1px solid var(--border);color:var(--muted);font-family:'Rajdhani',sans-serif;font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;padding:.75rem;cursor:pointer;transition:all .25s;margin-top:1rem}
.btn-logout:hover{border-color:var(--red);color:#e74c3c}

/* Security info */
.security-info{background:var(--green-dim);border:1px solid rgba(34,160,77,.2);padding:1rem 1.2rem;margin-top:1.5rem;display:flex;align-items:flex-start;gap:.8rem}
.security-info p{font-size:.75rem;color:var(--text);font-weight:300;line-height:1.6}

/* Back button (forgot / reset password pages) */
.back-btn{font-family:'Rajdhani',sans-serif;font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);background:none;border:none;cursor:pointer;display:flex;align-items:center;gap:.4rem;margin-bottom:1.5rem;transition:color .2s;padding:0;text-decoration:none}
.back-btn:hover{color:var(--green3)}

/* ═══ MOBILE ═══ */
@media(max-width:500px){
  .tab-panel{padding:1.8rem 1.2rem}
  .dash-grid{grid-template-columns:1fr}
  .page-wrap{padding:2rem 1rem}
}
