/* AVS360 Custom Login Theme */
:root {
  --avs-bg: #0f0c29;
  --avs-card-bg: rgba(255, 255, 255, 0.06);
  --avs-card-border: rgba(139, 92, 246, 0.25);
  --avs-accent: #818cf8;
  --avs-accent-hover: #6366f1;
  --avs-text: #f9fafb;
  --avs-text-secondary: rgba(255, 255, 255, 0.65);
  --avs-input-bg: rgba(255, 255, 255, 0.07);
  --avs-input-border: rgba(139, 92, 246, 0.4);
  --avs-bg-image: none;
}

/* Full-page background */
body.login-pf {
  background: var(--avs-bg) !important;
  background-image: var(--avs-bg-image) !important;
  background-size: cover !important;
  background-position: center !important;
  min-height: 100vh;
}

body.login-pf::before {
  content: '';
  position: fixed;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(15, 12, 41, 0.85) 0%,
    rgba(48, 43, 99, 0.7) 50%,
    rgba(26, 16, 64, 0.85) 100%
  );
  z-index: 0;
  pointer-events: none;
}

/* Hide default Keycloak header */
#kc-header-wrapper {
  display: none !important;
}

/* Login card */
#kc-form-wrapper,
.login-pf-page .card-pf {
  background: var(--avs-card-bg) !important;
  backdrop-filter: blur(12px);
  border: 1px solid var(--avs-card-border) !important;
  border-radius: 16px !important;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.4) !important;
  padding: 2rem !important;
  max-width: 420px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

/* Custom logo area */
.avs360-logo {
  text-align: center;
  margin-bottom: 1.5rem;
}

.avs360-logo img {
  max-height: 48px;
  margin: 0 auto;
}

.avs360-logo-text {
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--avs-accent);
  letter-spacing: -0.03em;
}

.avs360-logo-text span {
  color: var(--avs-text);
}

.avs360-tagline {
  font-size: 0.85rem;
  color: var(--avs-text-secondary);
  margin-top: 0.25rem;
}

/* Form title */
#kc-page-title {
  color: var(--avs-text) !important;
  font-weight: 700 !important;
  font-size: 1.25rem !important;
  text-align: center !important;
  margin-bottom: 1.5rem !important;
}

/* Labels */
.login-pf label,
.login-pf-page label {
  color: var(--avs-text-secondary) !important;
  font-size: 0.85rem !important;
  font-weight: 500 !important;
}

/* Inputs */
.login-pf input[type='text'],
.login-pf input[type='password'],
.login-pf input[type='email'],
.login-pf-page .form-control {
  background: var(--avs-input-bg) !important;
  border: 1px solid var(--avs-input-border) !important;
  border-radius: 8px !important;
  color: var(--avs-text) !important;
  padding: 0.7rem 1rem !important;
  font-size: 0.95rem !important;
  transition: border-color 0.2s !important;
}

.login-pf input:focus,
.login-pf-page .form-control:focus {
  border-color: var(--avs-accent) !important;
  box-shadow: 0 0 0 3px rgba(129, 140, 248, 0.15) !important;
  outline: none !important;
}

/* Primary button */
.login-pf input[type='submit'],
.login-pf .btn-primary,
.login-pf-page .btn-primary {
  background: linear-gradient(135deg, #7c3aed, #4f46e5) !important;
  border: none !important;
  border-radius: 8px !important;
  color: white !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
  padding: 0.75rem 1.5rem !important;
  width: 100% !important;
  cursor: pointer !important;
  transition:
    opacity 0.2s,
    transform 0.15s !important;
}

.login-pf input[type='submit']:hover,
.login-pf .btn-primary:hover,
.login-pf-page .btn-primary:hover {
  opacity: 0.9 !important;
  transform: translateY(-1px) !important;
}

/* Links */
.login-pf a,
.login-pf-page a {
  color: var(--avs-accent) !important;
}

/* Error alerts */
.login-pf .alert-error,
.login-pf-page .alert-error {
  background: rgba(239, 68, 68, 0.15) !important;
  border: 1px solid rgba(239, 68, 68, 0.4) !important;
  border-radius: 8px !important;
  color: #fca5a5 !important;
}

/* Footer text */
.login-pf .kc-social-links,
.login-pf-page .kc-social-section {
  border-top: 1px solid var(--avs-card-border) !important;
  padding-top: 1rem !important;
  margin-top: 1rem !important;
}

/* Responsive */
@media (max-width: 640px) {
  #kc-form-wrapper,
  .login-pf-page .card-pf {
    margin: 1rem !important;
    padding: 1.5rem !important;
  }
}