/* ===== EDNShop auth pages animations (login / register / admin login) ===== */
@keyframes authCardIn { from { opacity: 0; transform: translateY(30px) scale(.96); } to { opacity: 1; transform: none; } }
@keyframes authRise   { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes authOrb {
    0%,100% { transform: translate(0,0) scale(1); }
    50% { transform: translate(50px,-40px) scale(1.15); }
}
@keyframes authShimmer { from { background-position: 0% 0; } to { background-position: 200% 0; } }
@keyframes shake { 0%,100% { transform: translateX(0); } 20%,60% { transform: translateX(-8px); } 40%,80% { transform: translateX(8px); } }
@keyframes popCheck { 0% { transform: scale(.6); opacity: 0; } 60% { transform: scale(1.08); } 100% { transform: scale(1); opacity: 1; } }
@keyframes spin { to { transform: rotate(360deg); } }

/* background glow orbs */
body::before, body::after {
    content: ''; position: fixed; border-radius: 50%; filter: blur(90px);
    pointer-events: none; z-index: -1; opacity: .2;
}
body::before { width: 420px; height: 420px; background: #3b82f6; top: -120px; right: -100px; animation: authOrb 16s ease-in-out infinite; }
body::after  { width: 360px; height: 360px; background: #1d4ed8; bottom: -120px; left: -100px; animation: authOrb 20s ease-in-out infinite reverse; }

/* card entrance + staggered contents */
.auth-card, .login-box { animation: authCardIn .7s cubic-bezier(.2,.8,.2,1) both; }
.auth-card .auth-logo, .auth-card .auth-title, .auth-card .auth-subtitle,
.auth-card .form-group, .auth-card .form-options, .auth-card .btn-submit,
.auth-card .auth-footer, .login-box h2, .login-box .form-group, .login-box .btn {
    opacity: 0; animation: authRise .55s ease-out forwards;
}
.auth-card .auth-logo { animation-delay: .15s; }
.auth-card .auth-title, .login-box h2 { animation-delay: .22s; }
.auth-card .auth-subtitle { animation-delay: .28s; }
.auth-card .form-group:nth-of-type(1), .login-box .form-group:nth-of-type(1) { animation-delay: .34s; }
.auth-card .form-group:nth-of-type(2), .login-box .form-group:nth-of-type(2) { animation-delay: .42s; }
.auth-card .form-group:nth-of-type(3) { animation-delay: .50s; }
.auth-card .form-group:nth-of-type(4) { animation-delay: .58s; }
.auth-card .form-group:nth-of-type(n+5) { animation-delay: .64s; }
.auth-card .form-options { animation-delay: .6s; }
.auth-card .btn-submit, .login-box .btn { animation-delay: .7s; }
.auth-card .auth-footer { animation-delay: .8s; }
.back-home { opacity: 0; animation: authRise .55s ease-out .9s forwards; }

/* logo shimmer */
.auth-logo span {
    display: inline-block; padding: 0 .06em .08em; direction: ltr; color: var(--blue, #3b82f6);
    background-image: linear-gradient(90deg, #3b82f6 0%, #93c5fd 25%, #ffffff 50%, #93c5fd 75%, #3b82f6 100%);
    background-size: 200% 100%; background-repeat: repeat-x;
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: authShimmer 4s linear infinite;
}
.login-box h2 i { display: inline-block; animation: iconBeat 2.4s ease-in-out infinite; }
@keyframes iconBeat { 0%,100% { transform: scale(1); } 50% { transform: scale(1.18); } }

/* inputs */
.form-input { transition: border-color .25s, box-shadow .25s, transform .25s, background .25s; }
.form-input:focus { box-shadow: 0 0 0 4px rgba(59,130,246,.18); transform: translateY(-1px); outline: none; }
.form-input-icon i { transition: color .25s, transform .25s; }
.form-input-icon:focus-within > i { color: var(--blue-light, #60a5fa); transform: scale(1.15); }
.password-toggle { transition: transform .2s, color .2s; }
.password-toggle:hover { transform: scale(1.2); }

/* submit button */
.btn-submit, .login-box .btn { position: relative; overflow: hidden; }
.btn-submit::before, .login-box .btn::before {
    content: ''; position: absolute; top: 0; bottom: 0; width: 60%; left: -80%;
    background: linear-gradient(105deg, transparent, rgba(255,255,255,.3), transparent);
    transform: skewX(-20deg); transition: left .6s ease;
}
.btn-submit:hover::before, .login-box .btn:hover::before { left: 130%; }
.btn-submit.is-loading, .login-box .btn.is-loading { pointer-events: none; opacity: .85; }
.btn-submit.is-loading::after, .login-box .btn.is-loading::after {
    content: ''; display: inline-block; width: 16px; height: 16px; margin-right: 10px; vertical-align: -3px;
    border: 2px solid rgba(255,255,255,.4); border-top-color: #fff; border-radius: 50%; animation: spin .7s linear infinite;
}
.ripple { position: absolute; border-radius: 50%; background: rgba(255,255,255,.35); transform: scale(0); animation: rippleAnim .6s ease-out forwards; pointer-events: none; }
@keyframes rippleAnim { to { transform: scale(4); opacity: 0; } }

/* messages */
.form-error, .alert-error { animation: shake .5s ease both; }
.form-success { animation: popCheck .5s ease both; }

.back-home a i { transition: transform .25s; }
.back-home a:hover i { transform: translateX(5px); }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; }
    .auth-card *, .login-box *, .back-home { opacity: 1 !important; }
    .auth-logo span { -webkit-text-fill-color: #3b82f6; color: #3b82f6; background: none; }
}

/* keep "EDN" + "Shop" in the right order inside the RTL page */
.auth-logo a { display: inline-block; direction: ltr; unicode-bidi: isolate; }