/* auth-luxe.css — sign in, register and password pages (standalone; no app shell). */
:root {
  --lx-canvas: #faf7f1;
  --lx-card: #ffffff;
  --lx-navy: #0a1a30;
  --lx-navy-2: #10223d;
  --lx-ink: #0a1a30;
  --lx-ink-1: rgba(10, 26, 48, .82);
  --lx-ink-2: rgba(10, 26, 48, .62);
  --lx-ink-3: rgba(10, 26, 48, .42);
  --lx-gold: #8a5a12;
  --lx-gold-fill: #edc48b;
  --lx-gold-deep: #d9ab68;
  --lx-gold-line: rgba(138, 90, 18, .28);
  --lx-line: rgba(10, 26, 48, .10);
  --lx-line-2: rgba(10, 26, 48, .18);
  --lx-serif: 'Cormorant Garamond', Georgia, serif;
  --lx-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --lx-ease: cubic-bezier(.2, .7, .2, 1);
  --bs-primary: #edc48b;
  --bs-primary-rgb: 237, 196, 139;
}
html, body { background: var(--lx-canvas) !important; margin: 0; min-height: 100vh; }
body { font-family: var(--lx-sans) !important; color: var(--lx-ink-1) !important; -webkit-font-smoothing: antialiased; }
::selection { background: rgba(237, 196, 139, .45); color: var(--lx-ink); }

.lx-auth { display: grid; grid-template-columns: minmax(380px, 46%) 1fr; min-height: 100vh; }

/* brand panel */
.lx-auth-brand {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(640px 420px at 30% 18%, rgba(237, 196, 139, .16), transparent 70%),
    radial-gradient(520px 380px at 90% 100%, rgba(237, 196, 139, .08), transparent 70%),
    linear-gradient(160deg, var(--lx-navy-2), var(--lx-navy));
  color: rgba(255, 255, 255, .78);
  display: flex; flex-direction: column; justify-content: space-between;
  padding: 56px clamp(40px, 5vw, 80px);
}
.lx-auth-brand::after {
  content: ''; position: absolute; inset: 24px; border: 1px solid rgba(237, 196, 139, .12); border-radius: 22px; pointer-events: none;
}
.lx-auth-brand-top { display: flex; align-items: center; gap: 14px; position: relative; z-index: 1; }
.lx-auth-brand-top img { height: 40px; width: auto; }
.lx-auth-wordmark { font-family: var(--lx-serif); font-size: 1.35rem; font-weight: 600; color: #fbf6ec; letter-spacing: .01em; line-height: 1.1; }
.lx-auth-wordmark small { display: block; font: 600 .6rem/1 var(--lx-sans); letter-spacing: .22em; text-transform: uppercase; color: var(--lx-gold-fill); margin-top: 6px; }
.lx-auth-quote { position: relative; z-index: 1; max-width: 520px; }
.lx-auth-quote .lx-eyebrow { color: var(--lx-gold-fill); }
.lx-auth-quote h2 {
  font-family: var(--lx-serif); font-weight: 600; color: #fbf6ec;
  font-size: clamp(2.2rem, 3.4vw, 3.1rem); line-height: 1.08; margin: 18px 0 18px; text-wrap: balance;
}
.lx-auth-quote h2 em { color: var(--lx-gold-fill); font-style: italic; }
.lx-auth-quote p { font-size: 1rem; line-height: 1.7; color: rgba(255, 255, 255, .66); margin: 0; }
.lx-auth-trust { list-style: none; padding: 0; margin: 0; position: relative; z-index: 1; display: grid; gap: 12px; }
.lx-auth-trust li { display: flex; align-items: center; gap: 12px; font-size: .9rem; color: rgba(255, 255, 255, .74); }
.lx-auth-trust i { color: var(--lx-gold-fill); font-size: 1.05rem; }

/* form side */
.lx-auth-main { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 48px 24px; position: relative; }
.lx-auth-card { width: 100%; max-width: 420px; }
.lx-auth-mobile-crest { display: none; height: 46px; margin: 0 auto 22px; }
.lx-eyebrow { font: 600 .66rem/1 var(--lx-sans); letter-spacing: .22em; text-transform: uppercase; color: var(--lx-gold); display: inline-flex; align-items: center; gap: 12px; }
.lx-eyebrow::before { content: ''; width: 24px; height: 1px; background: var(--lx-gold-fill); }
.lx-auth-title { font-family: var(--lx-serif) !important; font-weight: 600 !important; font-size: 2.6rem !important; line-height: 1.05 !important; color: var(--lx-ink) !important; margin: 16px 0 10px !important; }
.lx-auth-sub { font-size: .98rem; line-height: 1.6; color: var(--lx-ink-2); margin: 0 0 32px; }
.lx-auth-links { margin-top: 26px; font-size: .9rem; color: var(--lx-ink-2); display: grid; gap: 10px; }
.lx-auth-links p { margin: 0; }
.lx-auth-links a, .lx-auth-card a { color: var(--lx-gold); font-weight: 600; text-decoration: none; }
.lx-auth-links a:hover, .lx-auth-card a:hover { text-decoration: underline; text-underline-offset: 3px; }
.lx-auth-legal { position: absolute; bottom: 22px; left: 0; right: 0; text-align: center; font-size: .75rem; color: var(--lx-ink-3); margin: 0; padding: 0 24px; }
.lx-auth-legal a { color: var(--lx-ink-2); }

/* fields: login's .field-group (input + floating label) and Bootstrap .form-floating */
.field-group, .form-floating { position: relative; margin-bottom: 18px !important; }
.field-group input, .form-floating > .form-control, .lx-auth-card input[type="text"], .lx-auth-card input[type="email"], .lx-auth-card input[type="tel"], .lx-auth-card input[type="password"] {
  width: 100%;
  height: 56px !important;
  box-sizing: border-box;
  background: var(--lx-card) !important;
  border: 1px solid var(--lx-line-2) !important;
  border-radius: 14px !important;
  padding: 22px 16px 8px !important;
  font: 500 1rem var(--lx-sans) !important;
  color: var(--lx-ink) !important;
  box-shadow: none !important;
  outline: none;
  transition: border-color .18s, box-shadow .18s;
}
.field-group input:focus, .form-floating > .form-control:focus, .lx-auth-card input:focus { border-color: var(--lx-gold) !important; box-shadow: 0 0 0 4px rgba(237, 196, 139, .28) !important; }
.field-group input::placeholder, .form-floating > .form-control::placeholder { color: transparent !important; }
.field-group label, .form-floating > label {
  position: absolute; left: 17px; top: 18px; margin: 0 !important; padding: 0 !important; height: auto !important; border: 0 !important;
  font: 500 .95rem var(--lx-sans) !important; color: var(--lx-ink-3) !important;
  pointer-events: none; transition: all .16s var(--lx-ease); transform-origin: left top; background: none !important;
}
.field-group input:focus + label, .field-group input:not(:placeholder-shown) + label,
.form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label {
  top: 9px !important; transform: none !important; font-size: .66rem !important; font-weight: 600 !important;
  letter-spacing: .14em; text-transform: uppercase; color: var(--lx-gold) !important; opacity: 1 !important;
}
.form-floating > label::after { display: none !important; }
.form-check { display: flex; align-items: flex-start; gap: 10px; padding-left: 0 !important; }
.form-check-input { margin: 2px 0 0 0 !important; width: 18px !important; height: 18px !important; border-radius: 5px !important; border: 1px solid var(--lx-line-2) !important; flex: 0 0 auto; }
.form-check-input:checked { background-color: var(--lx-navy) !important; border-color: var(--lx-navy) !important; }
.form-check-label { font-size: .88rem; color: var(--lx-ink-2) !important; line-height: 1.5; }

/* buttons */
.btn-sign-in, .lx-auth-card .btn-primary, .lx-auth-card button[type="submit"] {
  display: flex !important; align-items: center; justify-content: center; gap: 8px;
  width: 100%; height: 54px; border: 0 !important; border-radius: 999px !important;
  background: var(--lx-gold-fill) !important; color: var(--lx-ink) !important;
  font: 600 .98rem var(--lx-sans) !important; letter-spacing: .01em; cursor: pointer;
  box-shadow: 0 10px 26px rgba(217, 171, 104, .28) !important;
  transition: transform .18s var(--lx-ease), background .18s, box-shadow .18s;
}
.btn-sign-in:hover:not(:disabled), .lx-auth-card .btn-primary:hover:not(:disabled), .lx-auth-card button[type="submit"]:hover:not(:disabled) {
  background: var(--lx-gold-deep) !important; transform: translateY(-1px); box-shadow: 0 14px 30px rgba(217, 171, 104, .36) !important;
}
.btn-sign-in:disabled, .lx-auth-card .btn-primary:disabled { opacity: .55; cursor: not-allowed; transform: none; box-shadow: none !important; }
#resendOtpBtn { border-radius: 999px !important; border: 1px solid var(--lx-line-2) !important; color: var(--lx-gold) !important; height: 48px; }
.btn-google {
  display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; height: 52px; box-sizing: border-box;
  border: 1px solid var(--lx-line-2); border-radius: 999px; background: var(--lx-card);
  color: var(--lx-ink) !important; font: 600 .93rem var(--lx-sans); text-decoration: none !important;
  transition: border-color .18s, background .18s;
}
.btn-google:hover { border-color: var(--lx-gold-line); background: #fffdf8; }
.or-divider { display: flex; align-items: center; gap: 14px; margin: 22px 0; color: var(--lx-ink-3); font: 600 .66rem/1 var(--lx-sans); letter-spacing: .2em; text-transform: uppercase; }
.or-divider::before, .or-divider::after { content: ''; flex: 1; height: 1px; background: var(--lx-line); }
.or-divider span { background: none !important; padding: 0 !important; }

/* sweetalert / toastr harmony */
.swal2-popup { border-radius: 20px !important; font-family: var(--lx-sans) !important; }
.swal2-title { font-family: var(--lx-serif) !important; color: var(--lx-ink) !important; }
.swal2-confirm { background: var(--lx-gold-fill) !important; color: var(--lx-ink) !important; border-radius: 999px !important; box-shadow: none !important; }

@media (max-width: 991px) {
  .lx-auth { grid-template-columns: 1fr; }
  .lx-auth-brand { display: none; }
  .lx-auth-main { justify-content: flex-start; padding-top: 56px; padding-bottom: 80px; background: radial-gradient(520px 280px at 50% 0%, rgba(237, 196, 139, .18), transparent 70%), var(--lx-canvas); }
  .lx-auth-mobile-crest { display: block; }
  .lx-auth-card { text-align: left; }
  .lx-auth-title { font-size: 2.2rem !important; }
}