.zima-auth {
  --zima-primary: #0f766e;
  --zima-secondary: #134e4a;
  --zima-accent: #f59e0b;
  --zima-bg: #f8fafc;
  --zima-text: #0f172a;
  --zima-radius: 16px;
  font-family: 'Vazirmatn', Tahoma, sans-serif;
  direction: rtl;
  position: relative;
  max-width: 440px;
  margin: 2rem auto;
  color: var(--zima-text);
}

.zima-auth__glow {
  position: absolute;
  inset: -20% -10% auto;
  height: 220px;
  background:
    radial-gradient(circle at 30% 40%, color-mix(in srgb, var(--zima-primary) 35%, transparent), transparent 55%),
    radial-gradient(circle at 80% 20%, color-mix(in srgb, var(--zima-accent) 28%, transparent), transparent 50%);
  filter: blur(8px);
  pointer-events: none;
  z-index: 0;
  animation: zimaFloat 8s ease-in-out infinite;
}

@keyframes zimaFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(12px); }
}

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

@keyframes zimaPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.04); }
}

.zima-auth__card {
  position: relative;
  z-index: 1;
  background: linear-gradient(160deg, #fff 0%, var(--zima-bg) 100%);
  border: 1px solid color-mix(in srgb, var(--zima-primary) 18%, #e2e8f0);
  border-radius: calc(var(--zima-radius) + 4px);
  padding: 2rem 1.5rem 1.75rem;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.08);
  backdrop-filter: blur(6px);
  animation: zimaIn .5s ease both;
}

.zima-auth__brand { text-align: center; margin-bottom: 1.5rem; }
.zima-auth__logo {
  width: 56px; height: 56px; margin: 0 auto .85rem;
  border-radius: 18px;
  display: grid; place-items: center;
  color: #fff;
  background: linear-gradient(135deg, var(--zima-primary), var(--zima-secondary));
  box-shadow: 0 12px 24px color-mix(in srgb, var(--zima-primary) 35%, transparent);
  animation: zimaPulse 2.8s ease-in-out infinite;
}
.zima-auth__logo .zima-icon { color: #fff; display: block; }
.zima-auth__title { margin: 0; font-size: 1.45rem; font-weight: 700; }
.zima-auth__sub { margin: .4rem 0 0; color: #64748b; font-size: .92rem; }

.zima-label {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-size: .85rem;
  font-weight: 600;
  margin: 0 0 .45rem;
}
.zima-label .zima-icon { opacity: .85; color: var(--zima-secondary); }

.zima-input-wrap { display: flex; align-items: stretch; gap: 0; margin-bottom: 1rem; }
.zima-input-prefix {
  display: grid; place-items: center;
  padding: 0 .75rem;
  background: color-mix(in srgb, var(--zima-primary) 10%, #fff);
  border: 1px solid #e2e8f0;
  border-left: 0;
  border-radius: 0 var(--zima-radius) var(--zima-radius) 0;
  color: var(--zima-secondary);
  font-size: .85rem;
  font-weight: 600;
}
.zima-input {
  width: 100%;
  border: 1px solid #e2e8f0;
  border-radius: var(--zima-radius);
  padding: .85rem 1rem;
  font: inherit;
  background: #fff;
  transition: border-color .2s, box-shadow .2s;
  margin-bottom: 1rem;
}
.zima-input-wrap .zima-input {
  margin-bottom: 0;
  border-radius: var(--zima-radius) 0 0 var(--zima-radius);
}
.zima-input:focus {
  outline: none;
  border-color: var(--zima-primary);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--zima-primary) 18%, transparent);
}
.zima-input--otp {
  letter-spacing: .35em;
  text-align: center;
  font-size: 1.35rem;
  font-weight: 700;
}

.zima-btn {
  display: inline-flex; align-items: center; justify-content: center;
  gap: .5rem;
  border: 0;
  border-radius: var(--zima-radius);
  padding: .9rem 1.2rem;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition: transform .15s ease, box-shadow .2s, opacity .2s;
}
.zima-btn .zima-icon { color: currentColor; }
.zima-btn--primary {
  color: #fff;
  background: linear-gradient(135deg, var(--zima-primary), var(--zima-secondary));
  box-shadow: 0 10px 24px color-mix(in srgb, var(--zima-primary) 28%, transparent);
}
.zima-btn--primary:hover { transform: translateY(-1px); color: #fff; }
.zima-btn--block { width: 100%; }
.zima-btn:disabled { opacity: .65; cursor: wait; transform: none; }

.zima-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  width: 100%;
  margin-top: .85rem;
  background: none;
  border: 0;
  color: var(--zima-secondary);
  font: inherit;
  font-size: .88rem;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.zima-link .zima-icon { color: currentColor; }

.zima-step { display: none; }
.zima-step.is-active { display: block; animation: zimaIn .35s ease both; }

.zima-auth__alert {
  border-radius: var(--zima-radius);
  padding: .75rem 1rem;
  margin-bottom: 1rem;
  font-size: .9rem;
  background: #fef2f2;
  color: #991b1b;
  border: 1px solid #fecaca;
}
.zima-auth__alert.is-ok {
  background: #ecfdf5;
  color: #065f46;
  border-color: #a7f3d0;
}

.zima-tiers { display: grid; gap: .65rem; margin-bottom: 1rem; }
.zima-tier {
  border: 1px solid #e2e8f0;
  border-radius: var(--zima-radius);
  padding: .85rem 1rem;
  cursor: pointer;
  transition: border-color .2s, background .2s;
  background: #fff;
}
.zima-tier.is-selected {
  border-color: var(--zima-primary);
  background: color-mix(in srgb, var(--zima-primary) 8%, #fff);
}
.zima-tier strong { display: block; }
.zima-tier span { color: #64748b; font-size: .82rem; }

.zima-wizard-fields { display: grid; gap: .75rem; margin-bottom: 1rem; }

.zima-success { text-align: center; padding: .5rem 0 0; }
.zima-success__icon {
  width: 64px; height: 64px; margin: 0 auto 1rem;
  border-radius: 50%;
  display: grid; place-items: center;
  background: color-mix(in srgb, var(--zima-primary) 15%, #fff);
  color: var(--zima-primary);
  animation: zimaPulse 2s ease-in-out infinite;
}
.zima-success__icon .zima-icon { color: var(--zima-primary); display: block; }
.zima-success h3 { margin: 0 0 .4rem; }
.zima-success p { color: #64748b; margin: 0 0 1.2rem; }

.zima-icon {
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0;
}

@media (max-width: 480px) {
  .zima-auth { margin: 1rem; }
  .zima-auth__card { padding: 1.5rem 1.1rem; }
}

.zima-auth__hint{margin:.35rem 0 .85rem;color:#94a3b8;font-size:.8rem;}
