@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

/* ===========================
   FORCE TRUE DARK THEME
   (Bootstrap 5.3 variables)
   =========================== */
html[data-bs-theme="dark"] {
  color-scheme: dark;

  /* Core */
  --bs-body-bg: #0b0f15;
  --bs-body-color: #d8e4f8;
  --bs-border-color: #222b38;

  /* Surfaces */
  --bs-tertiary-bg: #0f1520;
  --bs-secondary-bg: #121926;
  --bs-card-bg: #121926;
  --bs-card-border-color: #1a2230;

  /* Inputs */
  --bs-input-bg: #101622;
  --bs-input-color: #d8e4f8;
  --bs-input-border-color: #263243;
  --bs-input-focus-border-color: #6ea8fe;
  --bs-input-placeholder-color: #879bb6;
  --bs-form-label-color: #9ab0d3;

  /* Buttons / Links */
  --bs-primary: #6ea8fe;
  --bs-primary-rgb: 110,168,254;
  --bs-link-color: #a9c7ff;
  --bs-link-hover-color: #d9e5ff;

  /* Alerts */
  --bs-danger-bg-subtle: rgba(220,53,69,.15);
  --bs-danger-border-subtle: rgba(220,53,69,.35);
  --bs-danger-text: #ffd1d7;
  --bs-success-bg-subtle: rgba(25,135,84,.15);
  --bs-success-border-subtle: rgba(25,135,84,.35);
  --bs-success-text: #b9f6d0;
}

/* Hard background + text as final guard */
html, body {
  background-color: var(--bs-body-bg) !important;
  color: var(--bs-body-color) !important;
  font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ===== Ambience / background pattern for dark ===== */
.theme-dark .auth-wrap::before {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(900px 600px at 20% -10%, rgba(110,168,254,.12), transparent 60%),
    radial-gradient(900px 600px at 80% 110%, rgba(179,136,255,.10), transparent 55%),
    linear-gradient(transparent 24px, rgba(255,255,255,.03) 25px) 0 0 / 24px 24px,
    linear-gradient(90deg, transparent 24px, rgba(255,255,255,.03) 25px) 0 0 / 24px 24px,
    var(--bs-body-bg);
}

/* Layout spacing */
.auth-wrap .container { padding-top: 4vh; padding-bottom: 4vh; }

/* ===== Card / glassmorphism ===== */
.glass {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(12px) saturate(120%);
  -webkit-backdrop-filter: blur(12px) saturate(120%);
  border-radius: 20px;
}
.shadow-xxl { box-shadow: 0 20px 60px rgba(0,0,0,.45); }
.card { background-color: var(--bs-card-bg) !important; border-color: var(--bs-card-border-color) !important; }

/* ===== Brand bits ===== */
.brand-logo-sm {
  width: 144px;
  height: 144px;
  border-radius: 32px;
  object-fit: contain;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4);
}

.brand-badge { font-weight: 600; letter-spacing: .04em; font-size: .9rem; color: #96aacb; }
.text-gradient {
  background: linear-gradient(90deg, #6ea8fe, #b388ff);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* ===== Inputs (ghost + floating labels) ===== */
.form-control-ghost {
  background-color: rgba(255,255,255,.05);
  border: 1px solid transparent;
  color: var(--bs-input-color);
}
.form-control-ghost:focus {
  background-color: rgba(255,255,255,.08);
  border-color: rgba(var(--bs-primary-rgb), .45);
  box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb), .15);
  color: var(--bs-input-color);
}
.form-control, .form-select {
  background-color: var(--bs-input-bg) !important;
  color: var(--bs-input-color) !important;
  border-color: var(--bs-input-border-color) !important;
}
.form-control::placeholder { color: var(--bs-input-placeholder-color) !important; }
.form-control:focus, .form-select:focus {
  border-color: var(--bs-input-focus-border-color) !important;
  box-shadow: 0 0 0 .2rem rgba(var(--bs-primary-rgb), .15) !important;
}

/* ===== Buttons ===== */
.btn-cta {
  position: relative;
  border: 1px solid rgba(var(--bs-primary-rgb), .35);
  background: linear-gradient(180deg, rgba(var(--bs-primary-rgb), .25), rgba(var(--bs-primary-rgb), .12));
  color: #eaf2ff;
  border-radius: 14px;
  transition: transform .08s ease, box-shadow .2s ease;
}
.btn-cta:hover { transform: translateY(-1px); box-shadow: 0 10px 24px rgba(var(--bs-primary-rgb), .25); }
.btn-cta:active { transform: translateY(0); }
.btn-cta .btn-glow {
  content: ""; position: absolute; inset: -2px; z-index: -1; border-radius: 16px; filter: blur(12px);
  background: radial-gradient(120px 100px at 50% 0%, rgba(110,168,254,.35), rgba(179,136,255,.20));
}

/* Ghost icon button */
.btn-ghost {
  background: transparent; border: 1px solid rgba(255,255,255,.12);
  color: var(--bs-body-color); border-radius: 12px; padding: .45rem .6rem;
}
.btn-ghost:hover { background: rgba(255,255,255,.06); }

/* Theme toggle icons */
.btn-theme-toggle { display: inline-flex; align-items: center; gap: .25rem; }
.icon-moon, .icon-sun { display: none; }
body.theme-dark .icon-moon { display: inline; }
body.theme-light .icon-sun { display: inline; }

/* Links */
a, .link-faint { color: var(--bs-link-color); text-decoration: none; }
a:hover, .link-faint:hover { color: var(--bs-link-hover-color); text-decoration: underline; }

/* Alerts (soft dark) */
.alert-danger-subtle {
  background: var(--bs-danger-bg-subtle) !important;
  border: 1px solid var(--bs-danger-border-subtle) !important;
  color: var(--bs-danger-text) !important;
}
.alert-success-subtle {
  background: var(--bs-success-bg-subtle) !important;
  border: 1px solid var(--bs-success-border-subtle) !important;
  color: var(--bs-success-text) !important;
}

@media (max-width: 768px) {
  .brand-logo-sm {
    width: 96px;
    height: 96px;
    border-radius: 24px;
  }
}