/**
 * EmpirePsi — WP admin login (ultra mauve floral)
 */

body.eps-login {
  --eps-login-plum: #4e294b;
  --eps-login-plum-deep: #1a0c1f;
  --eps-login-rose: #c18da2;
  --eps-login-rose-hot: #e8a0bc;
  --eps-login-gold: #d7ae7a;
  --eps-login-cream: #fff8fb;
  min-height: 100vh;
  margin: 0;
  background: var(--eps-login-plum-deep) !important;
  color: var(--eps-login-cream);
  font-family: "Outfit", system-ui, sans-serif;
  overflow-x: hidden;
}

body.eps-login::before {
  content: none !important;
}

/* —— Animated floral stage —— */
.eps-login-stage {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  background:
    radial-gradient(46% 42% at 12% 18%, rgba(193, 141, 162, 0.38), transparent 70%),
    radial-gradient(40% 38% at 88% 78%, rgba(232, 160, 188, 0.28), transparent 68%),
    radial-gradient(36% 34% at 50% 50%, rgba(78, 41, 75, 0.35), transparent 72%),
    linear-gradient(165deg, #140a18 0%, #2a1430 42%, #1a0c1f 100%);
}

.eps-login-stage__mist {
  position: absolute;
  inset: -12%;
  background:
    radial-gradient(50% 40% at 30% 40%, rgba(241, 196, 214, 0.22), transparent 70%),
    radial-gradient(44% 38% at 70% 60%, rgba(193, 141, 162, 0.2), transparent 68%);
  animation: eps-login-mist 16s ease-in-out infinite;
}

.eps-login-stage__glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(48px);
  opacity: 0.55;
  animation: eps-login-glow 11s ease-in-out infinite;
}

.eps-login-stage__glow--a {
  width: min(420px, 55vw);
  height: min(420px, 55vw);
  top: -12%;
  right: -8%;
  background: rgba(232, 160, 188, 0.42);
}

.eps-login-stage__glow--b {
  width: min(360px, 48vw);
  height: min(360px, 48vw);
  bottom: -14%;
  left: -10%;
  background: rgba(193, 141, 162, 0.36);
  animation-delay: -4s;
}

.eps-login-stage__glow--c {
  width: min(280px, 40vw);
  height: min(280px, 40vw);
  top: 42%;
  left: 38%;
  background: rgba(215, 174, 122, 0.14);
  animation-delay: -7s;
}

.eps-login-stage__bloom {
  position: absolute;
  line-height: 0;
  opacity: 0.55;
  animation: eps-login-float 12s ease-in-out infinite;
  will-change: transform;
}

.eps-login-stage__bloom svg {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 10px 24px rgba(10, 2, 14, 0.35));
}

.eps-login-stage__bloom--1 {
  width: min(150px, 28vw);
  top: 10%;
  left: 6%;
}

.eps-login-stage__bloom--2 {
  width: min(110px, 22vw);
  right: 8%;
  bottom: 16%;
  opacity: 0.5;
  animation-name: eps-login-float-spin;
  animation-delay: -3s;
}

.eps-login-stage__bloom--3 {
  width: min(78px, 16vw);
  top: 58%;
  left: 18%;
  opacity: 0.42;
  animation-delay: -6s;
}

.eps-login-stage__petal {
  position: absolute;
  width: 14px;
  height: 22px;
  border-radius: 60% 60% 55% 55%;
  background: linear-gradient(160deg, #e8a0bc, #8e5f7c);
  opacity: 0.35;
  animation: eps-login-drift 18s linear infinite;
  will-change: transform;
}

.eps-login-stage__petal--a { left: 12%; top: -8%; animation-duration: 16s; }
.eps-login-stage__petal--b {
  left: 34%;
  top: -12%;
  width: 11px;
  height: 18px;
  background: linear-gradient(160deg, #d7ae7a, #c18da2);
  animation-duration: 21s;
  animation-delay: -4s;
}
.eps-login-stage__petal--c {
  left: 58%;
  top: -6%;
  width: 12px;
  height: 19px;
  animation-duration: 19s;
  animation-delay: -8s;
}
.eps-login-stage__petal--d {
  left: 74%;
  top: -10%;
  width: 10px;
  height: 16px;
  background: linear-gradient(160deg, #9b6b8a, #c9a0b0);
  animation-duration: 23s;
  animation-delay: -2s;
}
.eps-login-stage__petal--e {
  left: 88%;
  top: -4%;
  width: 13px;
  height: 20px;
  animation-duration: 17s;
  animation-delay: -11s;
}

.eps-login-stage__spark {
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #f3c4d6;
  box-shadow: 0 0 12px rgba(232, 160, 188, 0.8);
  opacity: 0.55;
  animation: eps-login-spark 4.5s ease-in-out infinite;
}

.eps-login-stage__spark--a { top: 22%; right: 24%; }
.eps-login-stage__spark--b { top: 68%; left: 28%; animation-delay: -1.4s; width: 5px; height: 5px; }
.eps-login-stage__spark--c { bottom: 24%; right: 18%; animation-delay: -2.6s; width: 4px; height: 4px; }

@keyframes eps-login-mist {
  0%, 100% { opacity: 0.85; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.05); }
}

@keyframes eps-login-glow {
  0%, 100% { transform: scale(1); opacity: 0.45; }
  50% { transform: scale(1.12); opacity: 0.7; }
}

@keyframes eps-login-float {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  50% { transform: translate3d(0, -12px, 0) rotate(6deg); }
}

@keyframes eps-login-float-spin {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(-8deg); }
  50% { transform: translate3d(0, 10px, 0) rotate(10deg); }
}

@keyframes eps-login-drift {
  0% { transform: translate3d(0, 0, 0) rotate(0deg); opacity: 0; }
  8% { opacity: 0.4; }
  92% { opacity: 0.25; }
  100% { transform: translate3d(-50px, 110vh, 0) rotate(240deg); opacity: 0; }
}

@keyframes eps-login-spark {
  0%, 100% { opacity: 0.25; transform: scale(0.85); }
  50% { opacity: 0.85; transform: scale(1.25); }
}

@keyframes eps-login-card-in {
  from { opacity: 0; transform: translateY(18px) scale(0.98); }
  to { opacity: 1; transform: none; }
}

/* —— Login shell —— */
body.eps-login #login {
  position: relative;
  z-index: 2;
  width: min(380px, calc(100% - 2rem));
  padding: 8vh 0 4vh;
  animation: eps-login-card-in 0.7s cubic-bezier(0.22, 1, 0.36, 1) both;
}

body.eps-login #login h1 {
  margin: 0 0 1.1rem;
}

body.eps-login #login h1 a {
  display: block !important;
  width: 248px !important;
  height: 96px !important;
  margin: 0 auto;
  padding: 1rem 1.35rem !important;
  box-sizing: border-box !important;
  background-color: #ffffff !important;
  background-size: calc(100% - 2.2rem) auto !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  border-radius: 20px !important;
  border: 1px solid rgba(255, 255, 255, 0.95) !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 1) inset,
    0 14px 32px rgba(8, 2, 12, 0.3) !important;
  filter: none !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

body.eps-login #login h1 a:hover,
body.eps-login #login h1 a:focus {
  transform: translateY(-2px);
  filter: none !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 1) inset,
    0 18px 38px rgba(8, 2, 12, 0.36) !important;
}

body.eps-login #loginform,
body.eps-login #registerform,
body.eps-login #lostpasswordform {
  margin-top: 0;
  padding: 1.35rem 1.35rem 1.2rem;
  border: 1px solid rgba(255, 248, 251, 0.22) !important;
  border-radius: 20px !important;
  background:
    linear-gradient(155deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0.05)) !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.18) inset,
    0 22px 50px rgba(8, 2, 12, 0.4) !important;
  backdrop-filter: blur(18px) saturate(1.12);
  -webkit-backdrop-filter: blur(18px) saturate(1.12);
}

body.eps-login #loginform label,
body.eps-login #registerform label,
body.eps-login #lostpasswordform label {
  color: rgba(255, 248, 251, 0.88);
  font-size: 0.82rem;
  font-weight: 550;
  letter-spacing: 0.02em;
}

body.eps-login .login form-input input,
body.eps-login input[type="text"],
body.eps-login input[type="password"],
body.eps-login input[type="email"] {
  background: rgba(20, 8, 24, 0.45) !important;
  border: 1px solid rgba(241, 196, 214, 0.28) !important;
  border-radius: 12px !important;
  color: var(--eps-login-cream) !important;
  box-shadow: none !important;
  font-size: 0.95rem !important;
  padding: 0.55rem 0.75rem !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

body.eps-login .login form-input input:focus,
body.eps-login input[type="text"]:focus,
body.eps-login input[type="password"]:focus,
body.eps-login input[type="email"]:focus {
  border-color: rgba(232, 160, 188, 0.7) !important;
  box-shadow: 0 0 0 3px rgba(232, 160, 188, 0.18) !important;
  background: rgba(26, 12, 31, 0.65) !important;
}

body.eps-login .forgetmenot label {
  color: rgba(233, 215, 228, 0.86) !important;
  font-size: 0.8rem !important;
}

body.eps-login .wp-core-ui .button-primary {
  background: linear-gradient(135deg, #c18da2, #8e5f7c) !important;
  border: 0 !important;
  border-radius: 999px !important;
  color: #fff8fb !important;
  text-shadow: none !important;
  box-shadow: 0 10px 24px rgba(120, 55, 95, 0.35) !important;
  font-family: "Outfit", system-ui, sans-serif !important;
  font-weight: 650 !important;
  letter-spacing: 0.02em;
  padding: 0 1.35rem !important;
  height: 40px !important;
  line-height: 40px !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease !important;
}

body.eps-login .wp-core-ui .button-primary:hover,
body.eps-login .wp-core-ui .button-primary:focus {
  background: linear-gradient(135deg, #e8a0bc, #c18da2) !important;
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(120, 55, 95, 0.42) !important;
  filter: brightness(1.04);
}

body.eps-login #nav,
body.eps-login #backtoblog {
  text-align: center;
  margin: 0.85rem 0 0;
  padding: 0;
}

body.eps-login #nav a,
body.eps-login #backtoblog a,
body.eps-login .privacy-policy-link {
  color: rgba(241, 196, 214, 0.92) !important;
  font-size: 0.84rem;
  text-decoration: none !important;
  border-bottom: 1px solid transparent;
  transition: color 0.2s ease, border-color 0.2s ease;
}

body.eps-login #nav a:hover,
body.eps-login #backtoblog a:hover,
body.eps-login .privacy-policy-link:hover {
  color: #fff8fb !important;
  border-bottom-color: rgba(215, 174, 122, 0.65);
}

body.eps-login #login_error,
body.eps-login .message,
body.eps-login .success {
  border-radius: 14px !important;
  border-left-width: 3px !important;
  background: rgba(255, 255, 255, 0.1) !important;
  color: var(--eps-login-cream) !important;
  box-shadow: 0 10px 24px rgba(8, 2, 12, 0.25);
  backdrop-filter: blur(10px);
}

body.eps-login #login_error {
  border-left-color: #e8a0bc !important;
}

body.eps-login .message,
body.eps-login .success {
  border-left-color: var(--eps-login-gold) !important;
}

body.eps-login .language-switcher {
  position: relative;
  z-index: 2;
}

body.eps-login .language-switcher label {
  color: rgba(233, 215, 228, 0.8);
}

body.eps-login #language-switcher-locales {
  background: rgba(26, 12, 31, 0.85);
  border: 1px solid rgba(193, 141, 162, 0.35);
  color: #fff8fb;
  border-radius: 10px;
}

@media (max-width: 480px) {
  body.eps-login #login {
    width: calc(100% - 1.25rem);
  }

  .eps-login-stage__bloom--1 {
    width: 96px;
    opacity: 0.4;
  }

  .eps-login-stage__bloom--3,
  .eps-login-stage__petal--d,
  .eps-login-stage__petal--e {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .eps-login-stage__mist,
  .eps-login-stage__glow,
  .eps-login-stage__bloom,
  .eps-login-stage__petal,
  .eps-login-stage__spark,
  body.eps-login #login {
    animation: none !important;
  }
}
