/* ============================================================
   NEXORA — DARK LUXE · AUTH PAGES (login / register / verify)
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
    --gold:#C8A96E; --gold-light:#E2C98A; --gold-pale:#F0E0B8; --gold-dim:#8B6E3E;
    --black:#070706; --dark1:#0E0D0B; --dark2:#161512; --dark3:#1E1C18; --dark4:#27251F;
    --gray2:#5A5750; --gray3:#8A8780; --gray4:#B0ADA6; --white:#F5F2ED;
    --serif:'Cormorant Garamond',Georgia,serif; --sans:'DM Sans',system-ui,sans-serif;
    --tr:0.32s cubic-bezier(0.25,0.46,0.45,0.94);
}
html { scroll-behavior:smooth; min-height:100%; }
body {
    background:var(--black); color:var(--white); font-family:var(--sans); font-size:15px; line-height:1.7;
    overflow-x:hidden; min-height:100vh;
    background-image:
        radial-gradient(ellipse 70% 55% at 50% 55%, rgba(200,169,110,0.05) 0%, transparent 65%),
        linear-gradient(var(--dark1) 1px, transparent 1px),
        linear-gradient(90deg, var(--dark1) 1px, transparent 1px);
    background-size:auto, 60px 60px, 60px 60px;
}
::-webkit-scrollbar { width:4px; }
::-webkit-scrollbar-track { background:var(--dark1); }
::-webkit-scrollbar-thumb { background:var(--gold-dim); border-radius:2px; }

.account { min-height:100vh; display:flex; align-items:center; padding:60px 0; }
.account__shape { display:none; }

.account-form__logo {
    display:flex; align-items:center; gap:10px; font-family:var(--serif); font-size:26px; font-weight:600;
    letter-spacing:0.2em; color:var(--gold); text-decoration:none; margin-bottom:48px;
}
.account-form__logo img { display:none; }
.account-form__logo::before { content:''; display:inline-block; width:28px; height:28px; border:1.5px solid var(--gold); transform:rotate(45deg); flex-shrink:0; }
.account-form__logo::after { content:'NEXORA'; }
.account-thumb img { max-width:100%; filter:brightness(0.8) contrast(1.05); mix-blend-mode:luminosity; opacity:0.7; }

.account-form { background:var(--dark2); border:1px solid rgba(200,169,110,0.12); padding:48px 44px; position:relative; overflow:hidden; }
.account-form::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:linear-gradient(90deg, transparent, var(--gold), transparent); }
.account-form__shape { display:none; }
.account-form__subtitle { font-size:10px; letter-spacing:0.32em; text-transform:uppercase; color:var(--gold); display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.account-form__subtitle::before { content:''; width:24px; height:1px; background:var(--gold); }
.account-form__title { font-family:var(--serif); font-size:34px; font-weight:300; color:var(--white); margin-bottom:28px; line-height:1.2; }
.account-form__desc { font-size:14px; color:var(--gray3); margin-bottom:28px; }

/* Social */
.social-login-wrapper { margin-bottom:28px; }
.social-login-list { list-style:none; padding:0; margin:0; display:flex; gap:12px; flex-wrap:wrap; }
.social-login-list__item { flex:1; }
.social-login-btn { display:flex; align-items:center; justify-content:center; gap:10px; padding:11px 20px; background:var(--dark3); border:1px solid rgba(200,169,110,0.18) !important; color:var(--gray4) !important; font-size:13px; text-decoration:none; transition:var(--tr); width:100%; }
.social-login-btn:hover { border-color:rgba(200,169,110,0.4) !important; background:var(--dark4); color:var(--gold-light) !important; }
.others-login-image { width:18px; height:18px; }
.another-login { display:flex; align-items:center; gap:12px; margin-top:20px; color:var(--gray2); font-size:12px; letter-spacing:0.12em; }
.another-login::before, .another-login::after { content:''; flex:1; height:1px; background:rgba(200,169,110,0.1); }
.another-login .text { white-space:nowrap; }

/* Fields */
.form--label { font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:var(--gray3); margin-bottom:8px; display:block; }
.form--control, input.form--control, select.form--control, input.form--control.form-two {
    background:var(--dark3) !important; border:1px solid rgba(200,169,110,0.15) !important; color:var(--white) !important;
    border-radius:0 !important; font-family:var(--sans); font-size:14px; padding:12px 16px !important; transition:border-color 0.25s; width:100%; display:block;
}
select.form--control { appearance:none; -webkit-appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%238B6E3E' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E") !important; background-repeat:no-repeat !important; background-position:right 16px center !important; padding-right:38px !important; }
select.form--control option { background:var(--dark2); color:var(--white); }
.form--control::placeholder, input.form--control::placeholder { color:var(--gray2) !important; }
.form--control:focus, input.form--control:focus, select.form--control:focus { border-color:var(--gold) !important; box-shadow:none !important; outline:none; background:var(--dark4) !important; }
.position-relative { position:relative; }
.password-show-hide { position:absolute; right:14px; top:50%; transform:translateY(-50%); color:var(--gray2); cursor:pointer; font-size:14px; transition:color 0.2s; }
.password-show-hide:hover { color:var(--gold); }

/* Phone row */
.phone-row { display:flex; gap:0; }
.phone-row .cc { flex:0 0 110px; border-right:none !important; }
.phone-row .num { border-left:none !important; }

/* Checkbox */
.form--check { display:flex; align-items:flex-start; gap:10px; }
.flex-nowrap { flex-wrap:nowrap; }
.form--check .form-check-input { background-color:var(--dark3) !important; border:1px solid rgba(200,169,110,0.2) !important; border-radius:0 !important; width:16px; height:16px; flex-shrink:0; cursor:pointer; margin-top:3px; }
.form--check .form-check-input:checked { background-color:var(--gold) !important; border-color:var(--gold) !important; }
.form--check .form-check-input:focus { box-shadow:none !important; }
.form-check-label { font-size:13px; color:var(--gray3); cursor:pointer; line-height:1.5; }
.form-check-label a { color:var(--gold-dim); text-decoration:none; transition:color 0.2s; }
.form-check-label a:hover { color:var(--gold-light); }

/* Buttons */
.btn.btn--base { background:transparent !important; border:1px solid rgba(200,169,110,0.35) !important; color:var(--gold-light) !important; font-family:var(--sans); font-size:11px; letter-spacing:0.16em; text-transform:uppercase; padding:8px 20px !important; border-radius:0 !important; transition:var(--tr) !important; text-decoration:none; cursor:pointer; }
.btn.btn--base:hover { background:rgba(200,169,110,0.08) !important; border-color:var(--gold) !important; }
.btn.btn--base.btn--lg { padding:14px 20px !important; font-size:12px !important; background:var(--gold) !important; border-color:var(--gold) !important; color:var(--black) !important; font-weight:500; }
.btn.btn--base.btn--lg:hover { background:var(--gold-light) !important; border-color:var(--gold-light) !important; }

.account-form__text { margin-top:24px; font-size:13px; color:var(--gray3); text-align:center; }
.account-form__text .forgot { float:right; }
.text--base { color:var(--gold) !important; text-decoration:none; transition:color 0.2s; }
.text--base:hover { color:var(--gold-light) !important; }

/* Alerts */
.auth-alert { padding:12px 16px; margin-bottom:22px; font-size:13px; border-radius:0; }
.auth-alert ul { margin:0; padding-left:18px; }
.auth-alert--danger { background:rgba(192,88,79,0.12); border:1px solid rgba(192,88,79,0.3); color:#E08C84; }
.auth-alert--success { background:rgba(126,184,160,0.12); border:1px solid rgba(126,184,160,0.3); color:#7EB8A0; }
.auth-alert--info { background:rgba(200,169,110,0.08); border:1px solid rgba(200,169,110,0.25); color:var(--gold-light); }

/* OTP */
.otp-input {
    text-align:center; letter-spacing:0.7em; font-family:var(--serif); font-size:32px !important;
    padding:16px !important; font-weight:300;
}
.otp-note { font-size:12px; color:var(--gray2); margin-top:10px; text-align:center; }
.otp-dev { margin-top:14px; padding:10px; background:var(--dark3); border:1px dashed rgba(200,169,110,0.3); font-size:12px; color:var(--gold-dim); text-align:center; }

@media (max-width:992px) {
    .account-form { padding:32px 24px; }
    .account { padding:40px 0; }
}