/* =========================================================
   RANOTEKA AUTH FINAL UI
   ========================================================= */

.auth-result-card{
  width:100%;
  max-width:540px;
  margin-inline:auto;
  position:relative;
  overflow:hidden;
  text-align:center;

  box-shadow:
    0 28px 80px rgba(0,0,0,.38),
    0 0 60px rgba(124,58,237,.08);
}

.auth-result-card::before{
  content:"";
  position:absolute;
  top:0;
  left:15%;
  right:15%;
  height:1px;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(139,92,246,.25),
      #a855f7,
      rgba(139,92,246,.25),
      transparent
    );
}

/* ---------- auth success/status icon ---------- */

.auth-result-icon{
  width:76px;
  height:76px;

  margin:2px auto 21px;

  display:grid;
  place-items:center;

  border-radius:23px;

  color:#c9adff;

  border:1px solid rgba(139,92,246,.34);

  background:
    radial-gradient(
      circle at 30% 22%,
      rgba(192,132,252,.22),
      transparent 53%
    ),
    rgba(124,58,237,.09);

  box-shadow:
    0 16px 45px rgba(84,39,160,.19);
}

.auth-result-icon.success{
  color:#76e1aa;
  border-color:rgba(68,215,142,.28);

  background:
    radial-gradient(
      circle at 30% 22%,
      rgba(68,215,142,.19),
      transparent 53%
    ),
    rgba(39,157,102,.08);
}

.auth-result-icon svg{
  width:35px;
  height:35px;

  fill:none;
  stroke:currentColor;

  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* ---------- typography ---------- */

.auth-result-card .eyebrow{
  margin-bottom:9px;

  font-size:11px;
  font-weight:850;

  letter-spacing:.09em;

  color:#a986ff;
}

.auth-result-card h1{
  margin-top:0;
  margin-bottom:11px;

  font-size:34px;
  letter-spacing:-.025em;
}

.auth-result-card > .muted{
  max-width:455px;
  margin-inline:auto;

  line-height:1.65;
}

/* ---------- info block ---------- */

.auth-result-card .notice{
  margin:23px 0 16px;
  padding:17px 18px;

  text-align:left;

  border-radius:15px;

  border:1px solid rgba(139,92,246,.19);

  background:
    linear-gradient(
      180deg,
      rgba(124,58,237,.075),
      rgba(124,58,237,.035)
    );

  color:#98a1b4;

  font-size:13px;
  line-height:1.55;
}

.auth-result-card .notice strong{
  display:block;

  margin-bottom:4px;

  color:#e3d9ff;

  font-size:14px;
}

/* ---------- buttons ---------- */

.auth-result-card .form{
  margin-top:23px;

  display:grid;
  gap:10px;
}

.auth-result-card .form .btn{
  width:100%;
  min-height:46px;
}

/* =========================================================
   PASSWORD EYE
   ========================================================= */

.auth-eye-wrap{
  position:relative;
}

.auth-eye-wrap > .input{
  padding-right:52px !important;
}

.auth-eye{
  position:absolute;

  right:8px;
  top:50%;

  transform:translateY(-50%);

  width:38px;
  height:38px;

  display:grid;
  place-items:center;

  padding:0;

  border:0;
  border-radius:10px;

  background:transparent;

  color:#8e97aa;

  cursor:pointer;

  transition:
    color .18s ease,
    background .18s ease;
}

.auth-eye:hover{
  color:#c9b4ff;
  background:rgba(139,92,246,.10);
}

.auth-eye:focus-visible{
  outline:2px solid rgba(139,92,246,.7);
  outline-offset:1px;
}

.auth-eye svg{
  width:20px;
  height:20px;

  fill:none;
  stroke:currentColor;

  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* =========================================================
   PASSWORD STRENGTH
   ========================================================= */

.auth-password-help{
  margin-top:8px;

  color:#838da2;

  font-size:12px;
  line-height:1.5;
}

.auth-strength{
  margin-top:13px;
}

.auth-strength-bars{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:5px;
}

.auth-strength-bars span{
  height:4px;

  border-radius:999px;

  background:#272d3c;

  transition:background .18s ease;
}

.auth-strength[data-level="1"] span:nth-child(-n+1),
.auth-strength[data-level="2"] span:nth-child(-n+2),
.auth-strength[data-level="3"] span:nth-child(-n+3),
.auth-strength[data-level="4"] span:nth-child(-n+4){
  background:
    linear-gradient(
      90deg,
      #7c3aed,
      #ad58ff
    );
}

.auth-strength-info{
  margin-top:7px;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;

  font-size:12px;

  color:#7f899e;
}

.auth-strength-info strong{
  color:#bca9ef;
}

.auth-password-match{
  min-height:18px;

  margin-top:7px;

  font-size:12px;
  font-weight:700;
}

.auth-password-match.ok{
  color:#6edda4;
}

.auth-password-match.error{
  color:#ff8498;
}

/* ---------- resend timer ---------- */

.auth-resend-disabled{
  opacity:.50;
  pointer-events:none;
  cursor:not-allowed;
}

/* ---------- mobile ---------- */

@media(max-width:640px){

  .auth-result-card h1{
    font-size:29px;
  }

  .auth-result-icon{
    width:66px;
    height:66px;

    border-radius:20px;
  }
}


/* RANOTEKA_AUTH_POLISH_V2_START */

/* ========================================================
   AUTH — FINAL PRODUCT POLISH
   ======================================================== */

.auth-shell .auth-panel{
  transition:
    border-color .2s ease,
    box-shadow .2s ease;
}

.auth-shell .muted,
.auth-shell .field-hint,
.auth-shell small{
  color:#9aa4b8;
}

/* ---------------- LOGIN BRAND ---------------- */

.auth-login-brand{
  margin-bottom:18px;
  display:flex;
  align-items:center;
  gap:11px;
}

.auth-login-icon{
  width:42px;
  height:42px;

  display:grid;
  place-items:center;

  flex:0 0 auto;

  border-radius:13px;

  color:#c4a6ff;

  border:1px solid rgba(139,92,246,.27);

  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(192,132,252,.22),
      transparent 56%
    ),
    rgba(124,58,237,.08);

  box-shadow:
    0 10px 30px rgba(80,37,156,.13);
}

.auth-login-icon svg{
  width:21px;
  height:21px;

  fill:none;
  stroke:currentColor;

  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.auth-login-brand-copy{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.auth-login-brand-copy strong{
  color:#ddd2ff;

  font-size:11px;
  font-weight:850;

  letter-spacing:.08em;
}

.auth-login-brand-copy span{
  color:#788299;

  font-size:11px;
}

/* ---------------- LOGIN LINKS ---------------- */

.auth-links.auth-links--polished{
  margin-top:17px;

  display:flex;
  flex-wrap:wrap;

  justify-content:center;
  align-items:center;

  gap:9px 16px;
}

.auth-links.auth-links--polished a{
  color:#a993d7;

  font-size:12px;

  text-decoration:none;

  transition:
    color .16s ease,
    opacity .16s ease;
}

.auth-links.auth-links--polished a:hover{
  color:#d8c9ff;
}

.auth-links.auth-links--polished a:first-child{
  flex-basis:100%;

  color:#c6b2f4;

  font-weight:750;

  text-align:center;
}

/* ---------------- REGISTER PASSWORD ---------------- */

.auth-register-strength{
  margin-top:12px;
}

/* ---------------- RESET ---------------- */

.auth-reset-clean .auth-panel > h1{
  margin-bottom:22px;
}

/* ---------------- RESEND DISABLED ---------------- */

/*
  Пока идёт таймер кнопка должна выглядеть
  действительно неактивной, а не почти доступной.
*/

.auth-result-card .auth-resend-disabled{
  opacity:1 !important;

  color:#697287 !important;

  background:#151927 !important;

  border-color:#252b3a !important;

  box-shadow:none !important;

  filter:none !important;

  cursor:not-allowed !important;

  pointer-events:none !important;
}

/* ---------------- RESULT SECONDARY ACTION ---------------- */

.auth-result-card .form .btn:not(.btn--primary){
  color:#afb6c8;

  background:#111625;

  border-color:#282f40;
}

.auth-result-card .form .btn:not(.btn--primary):hover{
  color:#e2e5ef;

  border-color:#414a60;

  background:#151b2b;
}

/* ---------------- FORM FOCUS ---------------- */

.auth-shell .input:focus{
  box-shadow:
    0 0 0 1px rgba(139,92,246,.55),
    0 0 28px rgba(124,58,237,.08);
}

/* ---------------- MOBILE ---------------- */

@media(max-width:640px){

  .auth-shell{
    padding-left:14px;
    padding-right:14px;
  }

  .auth-shell .auth-panel{
    width:100%;
  }

  .auth-login-brand{
    margin-bottom:15px;
  }

  .auth-links.auth-links--polished{
    gap:10px 14px;
  }

  .auth-result-card .notice{
    padding:15px;
  }

  .auth-result-card h1{
    font-size:28px;
  }
}

/* RANOTEKA_AUTH_POLISH_V2_END */


/* RANOTEKA_RESET_RESEND_V1 */

.auth-resend-form{
  width:100%;
  margin:0;
}

.auth-resend-form .btn{
  width:100%;
}

.auth-resend-honeypot{
  position:absolute !important;
  left:-10000px !important;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  pointer-events:none !important;
}

.auth-mail-delay,
.auth-mail-latest{
  display:block;
  margin-top:7px;
}

.auth-mail-delay{
  color:#828da3;
}

.auth-mail-latest{
  color:#9c8fbb;
  font-size:12px;
}



/* RANOTEKA_RESET_SECURITY_UI_V1_START */

.auth-reset-panel,
.auth-reset-result{
  text-align:left;
}

.auth-reset-panel{
  position:relative;
  overflow:hidden;
}

.auth-reset-panel::before{
  content:"";
  position:absolute;
  width:220px;
  height:220px;
  right:-100px;
  top:-120px;
  border-radius:50%;
  background:rgba(124,44,255,.12);
  filter:blur(30px);
  pointer-events:none;
}

.auth-reset-icon{
  width:58px;
  height:58px;
  margin:0 0 18px;
  display:grid;
  place-items:center;
  border-radius:18px;

  color:#c7a0ff;

  border:1px solid rgba(139,92,246,.38);

  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(192,132,252,.22),
      transparent 58%
    ),
    rgba(124,58,237,.10);

  box-shadow:
    0 12px 32px rgba(70,32,130,.14);
}

.auth-reset-icon svg{
  width:25px;
  height:25px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.auth-reset-icon--expired{
  color:#ff9ca8;
  border-color:rgba(244,63,94,.25);
  background:rgba(244,63,94,.08);
  font-size:27px;
  font-weight:600;
}

.auth-reset-panel .eyebrow,
.auth-reset-result .eyebrow{
  display:inline-flex;
  margin-bottom:12px;
}

.auth-reset-panel h1,
.auth-reset-result h1{
  margin-top:0;
  margin-bottom:9px;
}

.auth-reset-intro{
  margin-bottom:24px;
}

.password-field{
  position:relative;
}

.password-field .input{
  padding-right:52px;
}

.reset-password-toggle{
  position:absolute;
  right:7px;
  top:50%;
  transform:translateY(-50%);

  width:38px;
  height:38px;

  display:grid;
  place-items:center;

  padding:0;
  border:0;

  background:transparent;
  color:#818ba0;

  cursor:pointer;
  border-radius:9px;

  transition:
    color .15s ease,
    background .15s ease;
}

.reset-password-toggle:hover{
  color:#d2c1ff;
  background:rgba(124,58,237,.08);
}

.reset-password-toggle svg{
  width:19px;
  height:19px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
}

.auth-reset-strength{
  margin-top:13px;
}

.auth-reset-strength-bars{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:5px;
}

.auth-reset-strength-bars span{
  height:4px;
  border-radius:999px;
  background:#282f41;
  transition:
    background .18s ease,
    box-shadow .18s ease;
}

.auth-reset-strength[data-level="1"]
.auth-reset-strength-bars span:nth-child(-n+1),

.auth-reset-strength[data-level="2"]
.auth-reset-strength-bars span:nth-child(-n+2),

.auth-reset-strength[data-level="3"]
.auth-reset-strength-bars span:nth-child(-n+3),

.auth-reset-strength[data-level="4"]
.auth-reset-strength-bars span:nth-child(-n+4){
  background:#8b5cf6;
  box-shadow:0 0 10px rgba(139,92,246,.22);
}

.auth-reset-strength-info{
  margin-top:8px;

  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:12px;

  color:#7f899e;

  font-size:11px;
}

.auth-reset-strength-info strong{
  color:#c7a9f7;
  font-size:11px;
}

.auth-reset-match{
  min-height:19px;
  padding-top:7px;

  font-size:12px;
  font-weight:700;
}

.auth-reset-match.is-ok{
  color:#63d99b;
}

.auth-reset-match.is-error{
  color:#f18b9a;
}

.auth-reset-submit:disabled{
  opacity:.42;
  cursor:not-allowed;
  box-shadow:none;
  filter:saturate(.45);
}

.auth-reset-security-note{
  margin:17px 0 0;

  color:#778196;
  font-size:11px;
  line-height:1.55;

  text-align:center;
}

.auth-result-actions{
  margin-top:24px;
}

@media(max-width:640px){

  .auth-reset-icon{
    width:52px;
    height:52px;
    border-radius:16px;
  }

  .auth-reset-panel h1,
  .auth-reset-result h1{
    font-size:27px;
  }
}

/* RANOTEKA_RESET_SECURITY_UI_V1_END */


/* RANOTEKA_AUTH_POLISH_FINAL_V1_START */

.auth-recovery-panel{
  position:relative;
  overflow:hidden;
}

.auth-recovery-panel::before{
  content:"";
  position:absolute;
  width:260px;
  height:260px;
  right:-120px;
  top:-135px;
  border-radius:50%;
  background:rgba(124,58,237,.13);
  filter:blur(34px);
  pointer-events:none;
}

.auth-recovery-icon{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  margin:0 0 18px;
  border-radius:18px;

  color:#c8a6ff;

  border:1px solid rgba(139,92,246,.42);

  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(192,132,252,.22),
      transparent 58%
    ),
    rgba(124,58,237,.10);

  box-shadow:
    0 14px 36px rgba(67,35,120,.18);
}

.auth-recovery-icon svg{
  width:27px;
  height:27px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.auth-recovery-panel .eyebrow{
  display:inline-flex;
  margin-bottom:12px;
}

.auth-recovery-panel h1{
  margin-top:0;
  margin-bottom:10px;
}

.auth-recovery-intro{
  max-width:480px;
  margin-bottom:24px;
  line-height:1.6;
}

.auth-recovery-form{
  gap:15px;
}

.auth-recovery-form .input--large{
  min-height:48px;
}

.auth-recovery-bot{
  margin-top:2px;
}

.auth-recovery-bot .bot-field{
  margin:0;
  border-radius:14px;
}

.auth-recovery-submit,
.auth-recovery-back{
  width:100%;
  min-height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}

.auth-recovery-back{
  background:#111827;
  border:1px solid #293147;
  color:#f1f3fa;
  text-decoration:none;
}

.auth-recovery-back:hover{
  border-color:#44345f;
  background:#151d2d;
}

.auth-recovery-note{
  margin:2px 0 0;
  text-align:center;
  color:#778196;
  font-size:11px;
  line-height:1.5;
}

/* unify result pages */

.auth-reset-result{
  max-width:680px;
}

.auth-reset-result .auth-result-actions{
  display:grid;
  gap:10px;
}

.auth-reset-result .auth-result-actions .btn{
  width:100%;
  min-height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
}

/* reset form polish */

.auth-reset-panel{
  max-width:620px;
}

.auth-reset-submit{
  min-height:47px;
}

.auth-reset-panel .field{
  position:relative;
}

/*
  Old password helper UI may still be injected by previous JS.
  Anything explicitly marked legacy inside the reset form disappears.
*/
[data-reset-password-form]
[data-password-strength-legacy],

[data-reset-password-form]
.password-strength-legacy,

[data-reset-password-form]
.legacy-password-strength{
  display:none !important;
}

@media(max-width:640px){

  .auth-recovery-icon{
    width:52px;
    height:52px;
    border-radius:16px;
  }

  .auth-recovery-panel h1{
    font-size:27px;
  }

}

/* RANOTEKA_AUTH_POLISH_FINAL_V1_END */


/* RANOTEKA_AUTH_MICROPOLISH_V2_START */

/* ---------------------------------------------------------
   1. HONEYPOT MUST NEVER BE VISIBLE
   --------------------------------------------------------- */

.auth-recovery-form > .field.hidden,
.auth-recovery-form .field.hidden,
.auth-recovery-form input[name="website"]{
  display:none !important;
  visibility:hidden !important;
  position:absolute !important;
  width:0 !important;
  height:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  opacity:0 !important;
  pointer-events:none !important;
}

/* ---------------------------------------------------------
   2. RECOVERY CARD — BETTER BALANCE
   --------------------------------------------------------- */

.auth-shell .auth-recovery-panel{
  width:min(100%,620px);
  margin-inline:auto;
}

.auth-recovery-form{
  row-gap:14px;
}

.auth-recovery-bot{
  margin-bottom:1px;
}

.auth-recovery-submit{
  margin-top:0 !important;
}

/* ---------------------------------------------------------
   3. RESET PASSWORD — REMOVE EXCESS EMPTY SPACE
   --------------------------------------------------------- */

[data-reset-password-form]{
  row-gap:14px !important;
}

[data-reset-password-form] .auth-reset-submit,
.auth-reset-submit{
  margin-top:18px !important;
  min-height:48px;
}

/* ---------------------------------------------------------
   4. DISABLED CTA SHOULD LOOK INTENTIONALLY DISABLED
   --------------------------------------------------------- */

[data-reset-password-form] button[type="submit"]:disabled,
.auth-reset-submit:disabled{
  opacity:.72 !important;
  cursor:not-allowed !important;
  filter:saturate(.58);
  color:rgba(255,255,255,.58) !important;
  box-shadow:none !important;
}

/* ---------------------------------------------------------
   5. PASSWORD MATCH STATUS
   --------------------------------------------------------- */

.reset-password-match{
  min-height:19px;
  margin-top:-4px;
  font-size:12px;
  line-height:1.45;
  font-weight:700;
}

.reset-password-match.is-ok{
  color:#65e6aa;
}

.reset-password-match.is-error{
  color:#ff8097;
}

/* ---------------------------------------------------------
   6. SMALL POLISH
   --------------------------------------------------------- */

[data-reset-password-form] input[type="password"],
[data-reset-password-form] input[type="text"]{
  transition:
    border-color .18s ease,
    box-shadow .18s ease,
    background .18s ease;
}

[data-reset-password-form] input:focus{
  box-shadow:
    0 0 0 3px rgba(124,58,237,.12);
}

@media(max-width:640px){
  .auth-shell .auth-recovery-panel{
    width:100%;
  }

  [data-reset-password-form] .auth-reset-submit,
  .auth-reset-submit{
    margin-top:12px !important;
  }
}

/* RANOTEKA_AUTH_MICROPOLISH_V2_END */


/* RANOTEKA_PASSWORD_CHANGED_PAGE_V1_START */

.password-changed-shell{
  display:flex;
  justify-content:center;
  align-items:flex-start;
  min-height:620px;
  padding-top:52px;
}

.password-changed-page{
  width:min(100%,560px);
  text-align:center;
  padding:0 24px 64px;
}

.password-changed-icon{
  width:66px;
  height:66px;
  margin:0 auto 20px;
  border:1px solid rgba(110,231,183,.28);
  border-radius:20px;
  display:grid;
  place-items:center;
  color:#6ee7b7;
  background:
    radial-gradient(
      circle at 50% 20%,
      rgba(52,211,153,.18),
      transparent 68%
    ),
    rgba(15,23,42,.72);
  box-shadow:
    0 0 38px rgba(52,211,153,.08),
    inset 0 0 24px rgba(52,211,153,.04);
}

.password-changed-icon svg{
  width:31px;
  height:31px;
}

.password-changed-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:27px;
  padding:5px 13px;
  margin-bottom:17px;
  border-radius:7px;
  font-size:11px;
  line-height:1;
  font-weight:900;
  letter-spacing:.055em;
  color:#eadcff;
  background:
    linear-gradient(
      135deg,
      rgba(113,43,255,.95),
      rgba(151,48,255,.92)
    );
  box-shadow:0 7px 24px rgba(124,58,237,.20);
}

.password-changed-page h1{
  margin:0;
  color:#f7f7ff;
  font-size:34px;
  line-height:1.12;
  letter-spacing:-.035em;
}

.password-changed-lead{
  max-width:520px;
  margin:20px auto 0;
  color:#9ca6bb;
  font-size:16px;
  line-height:1.65;
}

.password-changed-actions{
  display:grid;
  gap:11px;
  margin-top:30px;
}

.password-changed-actions .btn{
  width:100%;
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
}

.password-changed-primary{
  box-shadow:
    0 12px 38px rgba(124,58,237,.20);
}

.password-changed-secondary{
  background:#111827;
  border:1px solid #293247;
  color:#f3f4f6;
}

.password-changed-secondary:hover{
  border-color:#6d4adf;
  background:#151d2d;
}

.password-changed-note{
  margin:18px auto 0;
  color:#68738a;
  font-size:12px;
  line-height:1.55;
}

@media (max-width:640px){
  .password-changed-shell{
    min-height:520px;
    padding-top:34px;
  }

  .password-changed-page{
    padding-left:18px;
    padding-right:18px;
  }

  .password-changed-page h1{
    font-size:30px;
  }

  .password-changed-lead{
    font-size:15px;
  }
}

/* RANOTEKA_PASSWORD_CHANGED_PAGE_V1_END */
