/* ===== SHARED AUTH PAGE STYLES (signup, forgot, reset) ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

body{
  font-family:'Segoe UI',Arial,sans-serif;
  min-height:100vh;
  display:flex;
  background:#060c14;
}

/* ── LEFT PANEL ─── */
.auth-left{
  flex:1;
  min-height:100vh;
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:48px 52px;
  background:
    linear-gradient(135deg,rgba(6,12,20,.72) 0%,rgba(10,18,32,.6) 55%,rgba(15,24,40,.55) 100%),
    url('/assets/bg.jpg') center/cover no-repeat,
    url('/assets/bg.svg') center/cover no-repeat,
    #060c14;
}
.auth-left::before{
  content:'';position:absolute;bottom:120px;left:60px;
  width:280px;height:280px;
  background:radial-gradient(circle,rgba(249,115,22,.10) 0%,transparent 70%);
  pointer-events:none;
}
.brand-top{position:relative;z-index:2}
.brand-logo{
  display:flex;align-items:center;gap:14px;
  text-decoration:none;
}
.brand-logo img{width:52px;height:52px;filter:drop-shadow(0 2px 8px rgba(0,0,0,.5))}
.brand-name{font-size:26px;font-weight:800;color:#fff;letter-spacing:-.5px;line-height:1}
.brand-rc{font-size:11px;color:rgba(255,255,255,.4);margin-top:2px}
.brand-bottom{position:relative;z-index:2}
.brand-headline{font-size:34px;font-weight:800;color:#fff;line-height:1.2;margin-bottom:14px;text-shadow:0 2px 12px rgba(0,0,0,.4)}
.brand-headline span{color:#f97316}
.brand-desc{font-size:15px;color:rgba(255,255,255,.68);line-height:1.65;max-width:380px;margin-bottom:28px}
.brand-badges{display:flex;gap:8px;flex-wrap:wrap}
.brand-badge{
  display:inline-flex;align-items:center;gap:6px;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);
  border-radius:20px;padding:5px 14px;font-size:12px;color:rgba(255,255,255,.72);
  backdrop-filter:blur(4px)
}
.brand-badge .dot{width:6px;height:6px;border-radius:50%;background:#f97316}
.left-footer{font-size:12px;color:rgba(255,255,255,.3);position:relative;z-index:2;margin-top:24px}

/* ── RIGHT PANEL ─── */
.auth-right{
  width:480px;min-height:100vh;background:#0d1b3e;
  display:flex;flex-direction:column;align-items:center;
  justify-content:center;padding:36px 44px 60px;
  position:relative;flex-shrink:0;
}
.auth-right::before{
  content:'';position:absolute;top:0;left:0;width:3px;height:100%;
  background:linear-gradient(to bottom,transparent,#f97316 40%,#f97316 60%,transparent);
  opacity:.5
}
.form-container{width:100%;max-width:380px}
.form-header{margin-bottom:28px}
.form-title{font-size:24px;font-weight:700;color:#fff;margin-bottom:5px}
.form-subtitle{font-size:14px;color:rgba(255,255,255,.5)}

.alert{padding:12px 16px;border-radius:8px;margin-bottom:18px;font-size:14px;display:flex;align-items:flex-start;gap:10px}
.alert-error{background:rgba(220,38,38,.15);border:1px solid rgba(220,38,38,.3);color:#fca5a5}
.alert-success{background:rgba(22,163,74,.15);border:1px solid rgba(22,163,74,.3);color:#86efac}

.form-group{margin-bottom:18px}
.form-group label{display:block;font-size:14px;font-weight:500;color:rgba(255,255,255,.75);margin-bottom:7px}
.input-wrap{position:relative}

.form-control{
  width:100%;padding:11px 15px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);
  border-radius:8px;color:#fff;font-size:16px;font-family:inherit;
  outline:none;transition:border-color .2s,background .2s
}
.form-control:focus{border-color:#f97316;background:rgba(255,255,255,.10)}
.form-control::placeholder{color:rgba(255,255,255,.28);font-size:15px}
.form-control.has-icon{padding-right:46px}
.form-control option{background:#0d1b3e;color:#fff}

.input-icon{
  position:absolute;right:13px;top:50%;transform:translateY(-50%);
  color:rgba(255,255,255,.35);cursor:pointer;font-size:18px;
  background:none;border:none;padding:0;line-height:1;transition:color .15s
}
.input-icon:hover{color:#f97316}

.row-meta{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}
.check-label{display:flex;align-items:center;gap:8px;font-size:14px;color:rgba(255,255,255,.65);cursor:pointer;user-select:none}
.check-label input[type="checkbox"]{width:16px;height:16px;accent-color:#f97316;cursor:pointer}
.forgot-link{font-size:14px;color:#f97316;text-decoration:none}
.forgot-link:hover{color:#fb923c}

.btn-submit{
  width:100%;padding:13px;background:#f97316;color:#fff;
  border:none;border-radius:8px;font-size:16px;font-weight:600;
  font-family:inherit;cursor:pointer;transition:background .2s;
  display:flex;align-items:center;justify-content:center;gap:8px
}
.btn-submit:hover:not(:disabled){background:#ea6c0a}
.btn-submit:disabled{opacity:.6;cursor:not-allowed}

.signup-cta{margin-top:20px;text-align:center;font-size:14px;color:rgba(255,255,255,.5)}
.signup-cta a{color:#f97316;text-decoration:none;font-weight:500}
.signup-cta a:hover{color:#fb923c}

.back-link{display:inline-flex;align-items:center;gap:6px;font-size:14px;color:rgba(255,255,255,.5);text-decoration:none;margin-top:18px}
.back-link:hover{color:rgba(255,255,255,.8)}

.right-footer{
  position:absolute;bottom:18px;left:0;right:0;
  text-align:center;font-size:12px;color:rgba(255,255,255,.28)
}
.right-footer a{color:#f97316;text-decoration:none}
.right-footer a:hover{color:#fb923c}

.spinner{width:18px;height:18px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite;flex-shrink:0}
@keyframes spin{to{transform:rotate(360deg)}}

@media(max-width:900px){
  body{flex-direction:column}
  .auth-left{min-height:220px;padding:28px 24px;flex:none}
  .brand-headline{font-size:24px}
  .brand-desc,.brand-badges{display:none}
  .auth-right{width:100%;padding:32px 20px 56px}
  .auth-right::before{display:none}
  .form-container{max-width:420px}
}
@media(max-width:480px){
  .auth-left{padding:20px}
  .brand-logo img{width:38px;height:38px}
  .brand-name{font-size:20px}
  .auth-right{padding:24px 16px 52px}
  .form-title{font-size:21px}
}
