/* ==========================================================================
   LOGIN / REGISTER TEMPLATE STYLES
   Extends css/style.css. Forms post nowhere yet (action="#") — wire up to
   PHP session handling later (login.php / register.php).
   ========================================================================== */

.auth-page{
  position:relative; min-height:100vh;
  display:flex; align-items:center; justify-content:center;
  padding:150px 20px 80px; overflow:hidden;
}
.auth-page-bg{
  position:absolute; top:-6%; left:-6%; right:-6%; bottom:-6%;
  background-image:url('../img/login-main.jpg');
  background-size:cover; background-position:center;
}
.auth-page-overlay{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(4,7,13,0.55) 0%, rgba(4,7,13,0.75) 60%, var(--bg) 100%),
    radial-gradient(ellipse at 50% 20%, rgba(111,216,255,0.12), transparent 60%);
}

.auth-card{
  position:relative; z-index:2; width:100%; max-width:440px;
  border:1px solid var(--border); border-radius:14px; overflow:hidden;
  background:linear-gradient(160deg, var(--panel), var(--bg-alt));
  box-shadow:0 30px 70px rgba(0,0,0,0.5);
}
.auth-card-head{padding:34px 36px 10px; text-align:center;}
.auth-card-head .logo-icon{width:34px; height:34px; margin:0 auto 14px;}
.auth-card-head h1{
  font-family:var(--font-display); font-size:1.5rem; letter-spacing:1px;
  text-transform:uppercase; color:var(--text);
}
.auth-card-head p{color:var(--text-dim); font-size:0.85rem; margin-top:8px;}

.auth-form{padding:26px 36px 34px;}
.form-group{margin-bottom:20px;}
.form-group label{
  display:block; font-size:0.76rem; letter-spacing:1.2px; text-transform:uppercase;
  color:var(--text-dim); margin-bottom:8px;
}
.form-group input{
  width:100%; padding:13px 16px; border-radius:6px; border:1px solid var(--border);
  background:var(--bg-alt); color:var(--text); font-family:var(--font-body); font-size:0.92rem;
  transition:border-color .2s;
}
.form-group input::placeholder{color:var(--text-dim);}
.form-group input:focus{outline:none; border-color:var(--frost-dim);}
.form-hint{color:var(--text-dim); font-size:0.76rem; margin-top:7px; line-height:1.6;}
.form-hint strong{color:var(--frost-glow); font-weight:600;}

.form-divider{
  display:flex; align-items:center; gap:12px; margin:26px 0 22px;
  color:var(--text-dim); font-size:0.7rem; letter-spacing:1.5px; text-transform:uppercase;
}
.form-divider::before, .form-divider::after{content:""; flex:1; height:1px; background:var(--border);}

.form-row-between{
  display:flex; justify-content:space-between; align-items:center; margin-bottom:22px;
  font-size:0.82rem;
}
.checkbox-row{display:flex; align-items:center; gap:8px; color:var(--text-dim);}
.checkbox-row input{width:auto; accent-color:var(--frost);}
.form-row-between a{color:var(--frost-glow); transition:color .2s;}
.form-row-between a:hover{color:var(--frost);}

.auth-submit{width:100%; text-align:center; border:none; cursor:pointer; font-family:var(--font-body);}

.auth-footer-note{
  text-align:center; margin-top:22px; font-size:0.85rem; color:var(--text-dim);
}
.auth-footer-note a{color:var(--frost-glow); transition:color .2s;}
.auth-footer-note a:hover{color:var(--frost);}

.auth-terms{
  font-size:0.78rem; color:var(--text-dim); line-height:1.6; margin-bottom:22px;
  display:flex; gap:9px; align-items:flex-start;
}
.auth-terms input{margin-top:3px; accent-color:var(--frost); flex-shrink:0;}
.auth-terms a{color:var(--frost-glow);}
