/*-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------
    Floating labels styling
-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/* Tooltip */
.profile .about-tab .floating-label .tooltip,
.edit-doc .about-tab .floating-label .tooltip {
  bottom: 0;
  color: var(--copy);
  display: none;
  margin-left: 28px;
  margin-right: 3rem;
  position: absolute;
  right: 0;
}
.profile .about-tab .floating-label .tooltip:hover,
.edit-doc .about-tab .floating-label .tooltip:hover {
  display: block;
}

/* Floating labels */
/* Show password */
/*-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------

FFFFFFFFFFFFFFFFFFFFFF                                                                                tttt               PPPPPPPPPPPPPPPPP
F::::::::::::::::::::F                                                                             ttt:::t               P::::::::::::::::P
F::::::::::::::::::::F                                                                             t:::::t               P::::::PPPPPP:::::P
FF::::::FFFFFFFFF::::F                                                                             t:::::t               PP:::::P     P:::::P
  F:::::F       FFFFFFooooooooooo   rrrrr   rrrrrrrrr      ggggggggg   ggggg   ooooooooooo   ttttttt:::::ttttttt           P::::P     P:::::Paaaaaaaaaaaaa      ssssssssss       ssssssssss
  F:::::F           oo:::::::::::oo r::::rrr:::::::::r    g:::::::::ggg::::g oo:::::::::::oo t:::::::::::::::::t           P::::P     P:::::Pa::::::::::::a   ss::::::::::s    ss::::::::::s
  F::::::FFFFFFFFFFo:::::::::::::::or:::::::::::::::::r  g:::::::::::::::::go:::::::::::::::ot:::::::::::::::::t           P::::PPPPPP:::::P aaaaaaaaa:::::ass:::::::::::::s ss:::::::::::::s
  F:::::::::::::::Fo:::::ooooo:::::orr::::::rrrrr::::::rg::::::ggggg::::::ggo:::::ooooo:::::otttttt:::::::tttttt           P:::::::::::::PP           a::::as::::::ssss:::::ss::::::ssss:::::s
  F:::::::::::::::Fo::::o     o::::o r:::::r     r:::::rg:::::g     g:::::g o::::o     o::::o      t:::::t                 P::::PPPPPPPPP      aaaaaaa:::::a s:::::s  ssssss  s:::::s  ssssss
  F::::::FFFFFFFFFFo::::o     o::::o r:::::r     rrrrrrrg:::::g     g:::::g o::::o     o::::o      t:::::t                 P::::P            aa::::::::::::a   s::::::s         s::::::s
  F:::::F          o::::o     o::::o r:::::r            g:::::g     g:::::g o::::o     o::::o      t:::::t                 P::::P           a::::aaaa::::::a      s::::::s         s::::::s
  F:::::F          o::::o     o::::o r:::::r            g::::::g    g:::::g o::::o     o::::o      t:::::t    tttttt       P::::P          a::::a    a:::::assssss   s:::::s ssssss   s:::::s
FF:::::::FF        o:::::ooooo:::::o r:::::r            g:::::::ggggg:::::g o:::::ooooo:::::o      t::::::tttt:::::t     PP::::::PP        a::::a    a:::::as:::::ssss::::::ss:::::ssss::::::s
F::::::::FF        o:::::::::::::::o r:::::r             g::::::::::::::::g o:::::::::::::::o      tt::::::::::::::t     P::::::::P        a:::::aaaa::::::as::::::::::::::s s::::::::::::::s
F::::::::FF         oo:::::::::::oo  r:::::r              gg::::::::::::::g  oo:::::::::::oo         tt:::::::::::tt     P::::::::P         a::::::::::aa:::as:::::::::::ss   s:::::::::::ss
FFFFFFFFFFF           ooooooooooo    rrrrrrr                gggggggg::::::g    ooooooooooo             ttttttttttt       PPPPPPPPPP          aaaaaaaaaa  aaaa sssssssssss      sssssssssss
                                                                    g:::::g
                                                        gggggg      g:::::g
                                                        g:::::gg   gg:::::g
                                                         g::::::ggg:::::::g
                                                          gg:::::::::::::g
                                                            ggg::::::ggg
                                                               gggggg

-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.forgotPass .container {
  background-color: var(--foreground);
  border-radius: 1rem;
  box-shadow: 0 4px 16px rgba(24, 24, 24, 0.25);
  height: auto;
  padding: 2rem 2rem 0rem 2rem;
  width: 70%;
}
.forgotPass .container .session {
  background-repeat: no-repeat;
  background-size: cover;
  display: flex;
  flex-direction: column;
  height: 40rem;
  justify-content: center;
  margin-inline: auto;
  padding: 7rem 0;
  width: 80%;
}
.forgotPass .container .session h1 {
  margin-bottom: 2rem;
  text-align: center;
}
.forgotPass .container .session p {
  color: var(--copy);
  font-size: 14px;
  font-weight: 400;
  opacity: 0.65;
  text-align: center;
}
.forgotPass .container .session .form {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
}
.forgotPass .container .session .form .floating-label {
  align-items: center;
  display: flex;
  position: relative;
  width: 100%;
}
.forgotPass .container .session .form .floating-label label {
  font-weight: bold;
  left: 0;
  opacity: 0;
  padding-left: 2.5rem;
  pointer-events: none;
  position: absolute;
  top: 1rem;
}
.forgotPass .container .session .form .floating-label input {
  background: none;
  border: none;
  border-bottom: solid 1px rgba(0, 0, 0, 0.1);
  box-sizing: border-box;
  color: #000;
  font-size: 16px;
  font-weight: 400;
  height: 56px;
  margin-left: auto;
  outline: 1px solid transparent;
  padding: 20px 0px;
  width: calc(100% - 44px);
}
.forgotPass .container .session .form .floating-label input:not(:-moz-placeholder) {
  padding: 28px 0px 12px 0px;
}
.forgotPass .container .session .form .floating-label input:not(:placeholder-shown) {
  padding: 28px 0px 12px 0px;
}
.forgotPass .container .session .form .floating-label input:not(:-moz-placeholder) + label {
  opacity: 0.7;
  transform: translateY(-10px);
}
.forgotPass .container .session .form .floating-label input:not(:placeholder-shown) + label {
  opacity: 0.7;
  transform: translateY(-10px);
}
.forgotPass .container .session .form .floating-label input:not(:-moz-placeholder):valid + label {
  opacity: 1;
}
.forgotPass .container .session .form .floating-label input:not(:placeholder-shown):valid + label {
  opacity: 1;
}
.forgotPass .container .session .form .floating-label input:not(:-moz-placeholder):valid + .icon svg {
  opacity: 1;
}
.forgotPass .container .session .form .floating-label input:not(:placeholder-shown):valid + .icon svg {
  opacity: 1;
}
.forgotPass .container .session .form .floating-label input:not(:-moz-placeholder):valid + .icon svg path {
  fill: var(--primary-light);
}
.forgotPass .container .session .form .floating-label input:not(:placeholder-shown):valid + .icon svg path {
  fill: var(--primary-light);
}
.forgotPass .container .session .form .floating-label input:not(:-moz-placeholder):not(:valid):not(:focus) + label + .icon {
  animation-duration: 300ms;
  animation-name: shake-shake;
}
.forgotPass .container .session .form .floating-label input:not(:placeholder-shown):not(:valid):not(:focus) + label + .icon {
  animation-duration: 300ms;
  animation-name: shake-shake;
}
.forgotPass .container .session .form .floating-label input:focus {
  border-bottom: solid 1px var(--primary-light);
}
.forgotPass .container .session .form .floating-label .icon {
  height: -moz-fit-content;
  height: fit-content;
}
.forgotPass .container .session .form .floating-label .icon svg {
  fill: var(--primary-light);
  height: 30px;
  opacity: 0.5;
  width: 30px;
}
.forgotPass .container .session .form .floating-label #showPassword,
.forgotPass .container .session .form .floating-label #showPasswordConfirm {
  opacity: 0.4;
  position: absolute;
  right: 1rem;
  top: 1rem;
  width: 25px;
}
.forgotPass .container .session .form .floating-label #showPassword:hover,
.forgotPass .container .session .form .floating-label #showPasswordConfirm:hover {
  opacity: 1;
}
.forgotPass .container .session .form .floating-label #showPassword:active,
.forgotPass .container .session .form .floating-label #showPasswordConfirm:active {
  opacity: 1;
}
.forgotPass .container .session .form label {
  color: var(--copy);
  font-size: 12.5px;
  font-weight: 400;
}
.forgotPass .container .session .form .formBottom {
  align-items: center;
  display: flex;
  justify-content: space-between;
}
.forgotPass .container .session .form .formBottom button :hover {
  transform: translateY(-3px);
}
.forgotPass .container .session .form .formBottom button :hover :active {
  transform: scale(0.99);
}
.forgotPass .container .session .form input:focus {
  border-bottom: solid 1px var(--dpsa-cyan-light);
  outline: 0;
}

/* HTML: <div class="loader"></div> */
.loader {
  animation: l3 1s infinite linear;
  aspect-ratio: 1;
  background: var(--copy-light);
  border-radius: 50%;
  display: none;
  -webkit-mask: var(--_m);
  mask: var(--_m);
  -webkit-mask-composite: source-out;
  mask-composite: subtract;
  padding: 8px;
  width: 2.4rem;
  --_m: conic-gradient(#0000 10%, #000), linear-gradient(#000 0 0) content-box;
}

@keyframes l3 {
  to {
    transform: rotate(1turn);
  }
}/*# sourceMappingURL=forgotPass.css.map */