/* AI Login — White Premium Theme (overrides login.css) */

:root {
  --login-text: #0f172a;
  --login-muted: #64748b;
  --login-card-bg: rgba(255, 255, 255, 0.94);
  --login-card-border: rgba(14, 165, 233, 0.18);
  --login-cyan: #06b6d4;
  --login-blue: #0ea5e9;
  --login-indigo: #6366f1;
  --login-violet: #8b5cf6;
  --login-teal: #14b8a6;
}

.ai-login {
  color: var(--login-text);
  background: #f8fafc;
}

.ai-login-bg {
  background:
    radial-gradient(ellipse 75% 55% at 12% 18%, rgba(6, 182, 212, 0.12), transparent 55%),
    radial-gradient(ellipse 65% 50% at 88% 78%, rgba(99, 102, 241, 0.1), transparent 52%),
    radial-gradient(ellipse 45% 35% at 50% 50%, rgba(139, 92, 246, 0.06), transparent 60%),
    linear-gradient(165deg, #ffffff 0%, #f8fafc 45%, #f1f5f9 100%);
}

.ai-login-bg__mesh {
  opacity: 0.55;
  filter: blur(48px);
}

.ai-login-bg__grid {
  background-image:
    linear-gradient(rgba(148, 163, 184, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148, 163, 184, 0.06) 1px, transparent 1px);
  background-size: 40px 40px;
  mask-image: radial-gradient(ellipse 90% 80% at 50% 45%, #000 15%, transparent 78%);
}

.ai-login-bg__scanline {
  opacity: 0.25;
  background: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 2px,
    rgba(14, 165, 233, 0.015) 2px,
    rgba(14, 165, 233, 0.015) 4px
  );
}

.ai-login-bg__orb--1 {
  background: rgba(6, 182, 212, 0.18);
  filter: blur(80px);
}

.ai-login-bg__orb--2 {
  background: rgba(99, 102, 241, 0.16);
  filter: blur(80px);
}

.ai-login-bg__orb--3 {
  background: rgba(139, 92, 246, 0.12);
  filter: blur(72px);
}

.ai-login-brand__badge {
  color: #0369a1;
  background: linear-gradient(135deg, rgba(14, 165, 233, 0.1), rgba(99, 102, 241, 0.08));
  border-color: rgba(14, 165, 233, 0.22);
}

.ai-login-brand__chips span {
  color: #475569;
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid rgba(14, 165, 233, 0.14);
  box-shadow: 0 2px 8px rgba(14, 165, 233, 0.06);
}

.ai-login-brand__desc {
  color: var(--login-muted);
}

.ai-login-brand__features li {
  color: #475569;
}

.ai-login-neural {
  filter: drop-shadow(0 8px 24px rgba(14, 165, 233, 0.12));
}

.ai-login-card {
  background: var(--login-card-bg);
  border: 1px solid var(--login-card-border);
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.8) inset,
    0 24px 64px rgba(15, 23, 42, 0.08),
    0 0 48px rgba(14, 165, 233, 0.06);
  backdrop-filter: blur(20px);
}

.ai-login-card::before {
  background: linear-gradient(90deg, transparent, rgba(14, 165, 233, 0.45), rgba(99, 102, 241, 0.45), transparent);
}

.ai-login-card__head h2 {
  color: #0f172a;
}

.ai-login-card__head p {
  color: var(--login-muted);
}

.ai-login-card__logo-text::after {
  content: "";
  display: block;
  width: 52px;
  height: 3px;
  margin: 2px auto 0;
  border-radius: 999px;
  background: linear-gradient(90deg, #06b6d4, #0ea5e9, #6366f1, #a855f7);
  opacity: 0.75;
}

.ai-login-field label {
  color: #64748b;
}

.ai-login-input {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}

.ai-login-input:focus-within {
  border-color: rgba(14, 165, 233, 0.45);
  box-shadow:
    0 0 0 4px rgba(14, 165, 233, 0.1),
    0 4px 16px rgba(14, 165, 233, 0.08);
  background: #fff;
}

.ai-login-input input {
  color: #0f172a;
}

.ai-login-input input::placeholder {
  color: #94a3b8;
}

.ai-login-input input:-webkit-autofill,
.ai-login-input input:-webkit-autofill:hover,
.ai-login-input input:-webkit-autofill:focus,
.ai-login-input input:-webkit-autofill:active {
  -webkit-text-fill-color: #0f172a !important;
  caret-color: #0f172a;
  -webkit-box-shadow: 0 0 0 1000px #f8fafc inset !important;
  box-shadow: 0 0 0 1000px #f8fafc inset !important;
}

.ai-login-input:focus-within input:-webkit-autofill,
.ai-login-input:focus-within input:-webkit-autofill:hover,
.ai-login-input:focus-within input:-webkit-autofill:focus,
.ai-login-input:focus-within input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
  box-shadow: 0 0 0 1000px #fff inset !important;
}

.ai-login-input input:autofill,
.ai-login-input input:autofill:hover,
.ai-login-input input:autofill:focus,
.ai-login-input input:autofill:active {
  box-shadow: 0 0 0 1000px #f8fafc inset !important;
  -webkit-text-fill-color: #0f172a !important;
  caret-color: #0f172a;
}

.ai-login-check {
  color: #64748b;
}

.ai-login-link {
  color: var(--login-blue);
}

.ai-login-link:hover {
  color: var(--login-indigo);
}

.ai-login-submit {
  background: linear-gradient(135deg, #06b6d4 0%, #0ea5e9 42%, #6366f1 100%);
  box-shadow: 0 8px 24px rgba(14, 165, 233, 0.32);
}

.ai-login-submit:hover {
  box-shadow: 0 12px 32px rgba(14, 165, 233, 0.4);
  filter: brightness(1.04);
}

.ai-login-copyright {
  color: #94a3b8;
}

.ai-login-foot a {
  color: #64748b;
}

.ai-login-foot a:hover {
  color: var(--login-blue);
}

.ai-login-foot--register {
  color: #64748b;
}

.ai-login-foot--register a {
  color: #0369a1;
  font-weight: 600;
}

.ai-login--company .ai-login-bg {
  background:
    radial-gradient(ellipse 75% 55% at 12% 18%, rgba(6, 182, 212, 0.12), transparent 55%),
    radial-gradient(ellipse 65% 50% at 88% 78%, rgba(99, 102, 241, 0.1), transparent 52%),
    radial-gradient(ellipse 45% 35% at 50% 50%, rgba(139, 92, 246, 0.06), transparent 60%),
    linear-gradient(165deg, #ffffff 0%, #f8fafc 45%, #f1f5f9 100%);
}

.ai-login--company .ai-login-bg__orb--1 {
  background: rgba(6, 182, 212, 0.18);
}

.ai-login--company .ai-login-input:focus-within {
  border-color: rgba(14, 165, 233, 0.45);
  box-shadow:
    0 0 0 4px rgba(14, 165, 233, 0.1),
    0 4px 16px rgba(14, 165, 233, 0.08);
  background: #fff;
}

.ai-login--company .ai-login-input:focus-within svg {
  color: var(--login-cyan);
}

.ai-login--company .ai-login-brand__badge {
  color: #0369a1;
  background: linear-gradient(135deg, rgba(14, 165, 233, 0.1), rgba(99, 102, 241, 0.08));
  border-color: rgba(14, 165, 233, 0.22);
}

.ai-login--company .ai-login-brand__title span {
  background: linear-gradient(135deg, var(--login-cyan) 0%, var(--login-blue) 45%, var(--login-violet) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.ai-login--company .ai-login-brand__features svg {
  color: var(--login-cyan);
}

.ai-login--company .ai-login-submit {
  background: linear-gradient(135deg, #06b6d4 0%, #0ea5e9 42%, #6366f1 100%);
  box-shadow: 0 8px 24px rgba(14, 165, 233, 0.32);
}

.ai-login--company .ai-login-link,
.ai-login--company .ai-login-foot a:hover {
  color: var(--login-blue);
}

.ai-login--company .ai-login-card__icon {
  background: linear-gradient(135deg, rgba(14, 165, 233, 0.12), rgba(99, 102, 241, 0.1));
  border-color: rgba(14, 165, 233, 0.2);
  color: var(--login-blue);
}

.ai-login-divider {
  color: #94a3b8;
}

.ai-login-divider::before,
.ai-login-divider::after {
  background: #e2e8f0;
}

.ai-login-alt {
  color: #64748b;
}

.ai-login-alt a {
  color: #0369a1;
  font-weight: 600;
}

.ai-login-shell {
  animation: loginShellIn 0.7s cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes loginShellIn {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .ai-login-shell,
  .ai-login-bg__mesh,
  .ai-login-bg__orb,
  .ai-login-brand__logo-core,
  .ai-login-brand__logo-ring,
  .ai-login-card__logo-main,
  .ai-login-card__logo-sub {
    animation: none !important;
  }
}