/* TR_FORGOT_PASSWORD_PREMIUM_V1_20260716 */

:root{
  --fp-navy:#071a3d;
  --fp-blue:#0b5cff;
  --fp-cyan:#06b6d4;
  --fp-green:#10b981;
  --fp-orange:#ff6b00;
  --fp-text:#0f172a;
  --fp-muted:#64748b;
  --fp-border:#dbe6f3;
}

html,
body{
  min-height:100%;
}

body.bg-dark{
  margin:0!important;
  min-height:100vh!important;
  font-family:'Nunito',Arial,sans-serif!important;
  background:
    radial-gradient(circle at 12% 14%,rgba(56,189,248,.18),transparent 28%),
    radial-gradient(circle at 88% 84%,rgba(14,165,233,.18),transparent 30%),
    linear-gradient(135deg,#06182f 0%,#0a2d61 48%,#0c5f87 100%)!important;
  background-attachment:fixed!important;
}

body.bg-dark > .container{
  max-width:1060px!important;
  min-height:100vh!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding-top:22px!important;
  padding-bottom:22px!important;
}

body.bg-dark > .container > .row{
  width:100%!important;
}

.card{
  width:100%!important;
  margin:0!important;
  border:1px solid rgba(255,255,255,.25)!important;
  border-radius:32px!important;
  overflow:hidden!important;
  background:#fff!important;
  box-shadow:
    0 35px 85px rgba(1,11,34,.38),
    inset 0 1px 0 rgba(255,255,255,.10)!important;
}

.card-body{
  padding:0!important;
}

.card-body > .row{
  margin:0!important;
  align-items:stretch!important;
}

/* LEFT PANEL */
.tr-fp-left{
  display:block!important;
  min-height:545px!important;
  padding:38px 34px!important;
  position:relative!important;
  overflow:hidden!important;
  color:#fff!important;
  text-align:left!important;
  background:
    radial-gradient(circle at 102% -2%,rgba(34,211,238,.25),transparent 36%),
    radial-gradient(circle at -5% 105%,rgba(59,130,246,.18),transparent 35%),
    linear-gradient(145deg,#061a3d 0%,#0a2d63 55%,#0b3f75 100%)!important;
}

.tr-fp-left:before{
  content:"";
  position:absolute;
  width:230px;
  height:230px;
  top:-112px;
  right:-88px;
  border-radius:50%;
  background:linear-gradient(
    135deg,
    rgba(255,255,255,.10),
    rgba(255,255,255,.025)
  );
  border:1px solid rgba(255,255,255,.10);
}

.tr-fp-left:after{
  content:"";
  position:absolute;
  width:190px;
  height:190px;
  left:-95px;
  bottom:-105px;
  border-radius:50%;
  background:rgba(6,182,212,.14);
}

.tr-fp-brand{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  gap:13px;
  margin-bottom:28px;
}

.tr-fp-logo{
  width:56px;
  height:56px;
  flex:0 0 56px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:18px;
  color:#fff;
  font-size:19px;
  font-weight:900;
  letter-spacing:-1px;
  border:1px solid rgba(255,255,255,.28);
  background:
    radial-gradient(circle at 75% 18%,rgba(255,255,255,.42),transparent 30%),
    linear-gradient(135deg,#ff9a00 0%,#ff5a00 55%,#ffb74d 100%);
  box-shadow:
    0 16px 34px rgba(255,105,0,.34),
    inset 0 1px 0 rgba(255,255,255,.34);
}

.tr-fp-brand-title{
  color:#fff;
  font-size:21px;
  line-height:1.05;
  font-weight:900;
  letter-spacing:-.55px;
}

.tr-fp-brand-title strong{
  color:#ffb56c;
}

.tr-fp-brand-sub{
  margin-top:6px;
  color:#bfeaff;
  font-size:8px;
  font-weight:900;
  letter-spacing:2px;
  text-transform:uppercase;
}

.tr-fp-support-title{
  position:relative;
  z-index:2;
  margin-bottom:10px;
  color:#fff;
  font-size:17px;
  font-weight:900;
}

.tr-fp-support-item{
  position:relative;
  z-index:2;
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:11px 0;
  border-bottom:1px solid rgba(255,255,255,.10);
}

.tr-fp-support-item:last-of-type{
  border-bottom:0;
}

.tr-fp-support-icon{
  width:38px;
  height:38px;
  flex:0 0 38px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  color:#79f4e8;
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.13),
      rgba(255,255,255,.07)
    );
  border:1px solid rgba(255,255,255,.10);
}

.tr-fp-support-label{
  color:#8edcf5;
  font-size:10px;
  font-weight:900;
  letter-spacing:.8px;
  text-transform:uppercase;
}

.tr-fp-support-value{
  margin-top:3px;
  color:#fff;
  font-size:13px;
  font-weight:700;
  line-height:1.45;
}

.tr-fp-note{
  position:relative;
  z-index:2;
  margin-top:18px;
  padding:13px 14px;
  border-radius:14px;
  color:#ddf9ff;
  font-size:12px;
  line-height:1.5;
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.11),
      rgba(255,255,255,.06)
    );
  border:1px solid rgba(255,255,255,.13);
}

/* RIGHT PANEL */
.tr-fp-right-column{
  min-height:545px!important;
  display:flex!important;
  align-items:center!important;
  background:
    radial-gradient(circle at 100% 0%,rgba(14,165,233,.065),transparent 34%),
    radial-gradient(circle at 0% 100%,rgba(59,130,246,.055),transparent 30%),
    #fff!important;
}

.tr-fp-right{
  width:100%!important;
  padding:44px 42px!important;
}

.tr-fp-icon{
  width:70px;
  height:70px;
  margin:0 auto 18px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:22px;
  color:#fff;
  font-size:25px;
  background:linear-gradient(135deg,#155dfc,#0b8de3,#0dc5ce);
  box-shadow:
    0 17px 34px rgba(11,92,255,.27),
    inset 0 1px 0 rgba(255,255,255,.28);
}

.tr-fp-heading{
  margin:0 0 8px!important;
  color:var(--fp-text)!important;
  font-size:29px!important;
  line-height:1.2!important;
  font-weight:900!important;
  letter-spacing:-.8px!important;
  text-align:center!important;
}

.tr-fp-description{
  max-width:360px;
  margin:0 auto 24px!important;
  color:var(--fp-muted)!important;
  font-size:14px!important;
  line-height:1.6!important;
  text-align:center!important;
}

form.user .form-group{
  margin-bottom:15px!important;
}

.tr-fp-field{
  position:relative;
}

.tr-fp-field-icon{
  position:absolute;
  z-index:3;
  left:17px;
  top:50%;
  transform:translateY(-50%);
  color:var(--fp-blue);
  font-size:15px;
  pointer-events:none;
  filter:drop-shadow(0 3px 6px rgba(11,92,255,.18));
}

form.user .form-control-user{
  width:100%!important;
  height:54px!important;
  padding:0 48px!important;
  border:1px solid #d7e3f2!important;
  border-radius:15px!important;
  color:#172033!important;
  background:
    linear-gradient(180deg,#f7faff 0%,#edf4ff 100%)!important;
  font-size:14px!important;
  font-weight:700!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.85),
    0 5px 14px rgba(15,23,42,.035)!important;
  transition:.2s ease!important;
}

form.user .form-control-user:focus{
  border-color:#4f83ff!important;
  background:#fff!important;
  box-shadow:
    0 0 0 4px rgba(11,92,255,.11),
    0 8px 18px rgba(11,92,255,.08)!important;
}

form.user .form-control-user::placeholder{
  color:#94a3b8!important;
  font-weight:600!important;
}

form.user .btn-user,
form.user input[type="submit"]{
  width:100%!important;
  height:52px!important;
  padding:0 20px!important;
  border:0!important;
  border-radius:15px!important;
  color:#fff!important;
  background:
    linear-gradient(135deg,#155dfc 0%,#0b8de3 52%,#0dc5ce 100%)!important;
  font-size:15px!important;
  font-weight:900!important;
  letter-spacing:.25px!important;
  box-shadow:
    0 15px 30px rgba(11,92,255,.27),
    inset 0 1px 0 rgba(255,255,255,.25)!important;
  transition:.2s ease!important;
}

form.user .btn-user:hover,
form.user input[type="submit"]:hover{
  transform:translateY(-2px)!important;
  box-shadow:
    0 19px 38px rgba(11,92,255,.33),
    inset 0 1px 0 rgba(255,255,255,.25)!important;
}

.tr-fp-actions{
  display:flex;
  gap:10px;
  margin-top:18px;
}

.tr-fp-action{
  flex:1;
  min-height:43px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:9px 12px;
  border-radius:13px;
  font-size:12px;
  font-weight:900;
  text-decoration:none!important;
  text-align:center;
}

.tr-fp-login{
  color:#075fbd!important;
  border:1px solid #bfd4ff;
  background:linear-gradient(180deg,#fff,#edf4ff);
}

.tr-fp-register{
  color:#6d28d9!important;
  border:1px solid #ddd0ff;
  background:linear-gradient(180deg,#fff,#f4efff);
}

.tr-fp-home{
  min-height:43px;
  margin-top:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:9px 12px;
  border:1px solid #bdebd7;
  border-radius:13px;
  color:#087858!important;
  background:linear-gradient(180deg,#effff8,#e3f9ee);
  font-size:12px;
  font-weight:900;
  text-decoration:none!important;
}

.alert{
  margin:14px 0 0!important;
  padding:12px 14px!important;
  border:0!important;
  border-radius:14px!important;
  font-size:13px!important;
  line-height:1.45!important;
  font-weight:800!important;
  box-shadow:0 10px 23px rgba(15,23,42,.08)!important;
}

.tr-fp-right hr{
  display:none!important;
}

/* MOBILE */
@media(max-width:991px){

  body.bg-dark{
    padding:13px 0!important;
  }

  body.bg-dark > .container{
    min-height:auto!important;
    padding:0 13px!important;
  }

  .card{
    border-radius:24px!important;
  }

  .tr-fp-left{
    min-height:auto!important;
    padding:23px 20px!important;
  }

  .tr-fp-brand{
    margin-bottom:17px;
  }

  .tr-fp-logo{
    width:47px;
    height:47px;
    flex-basis:47px;
    border-radius:15px;
    font-size:16px;
  }

  .tr-fp-brand-title{
    font-size:17px;
  }

  .tr-fp-brand-sub{
    font-size:6.5px;
    letter-spacing:1.35px;
  }

  .tr-fp-support-item{
    padding:8px 0;
  }

  .tr-fp-support-icon{
    width:34px;
    height:34px;
    flex-basis:34px;
  }

  .tr-fp-support-value{
    font-size:12.5px;
  }

  .tr-fp-note{
    margin-top:11px;
  }

  .tr-fp-right-column{
    min-height:auto!important;
  }

  .tr-fp-right{
    padding:28px 20px 24px!important;
  }

  .tr-fp-icon{
    width:60px;
    height:60px;
    margin-bottom:15px;
    border-radius:19px;
    font-size:21px;
  }

  .tr-fp-heading{
    font-size:24px!important;
  }

  .tr-fp-description{
    margin-bottom:19px!important;
    font-size:13px!important;
  }

  form.user .form-control-user{
    height:50px!important;
    font-size:13px!important;
  }

  form.user .btn-user,
  form.user input[type="submit"]{
    height:49px!important;
  }
}

@media(max-width:480px){

  .tr-fp-left{
    padding:19px 16px!important;
  }

  .tr-fp-right{
    padding:24px 16px 20px!important;
  }

  .tr-fp-actions{
    flex-direction:column;
  }

  .tr-fp-action{
    width:100%;
  }
}
