﻿.password-analysis {
  position: relative;
}
.password-analysis-requirements {
  border-radius: 4px;
  color: #c6c9ce;
  font-size: 12px;
  max-height: 0;
  overflow: hidden;
  transition: max-height 400ms ease-out;
}
.password-analysis-requirements > strong {
  display: block;
  margin-bottom: 8px;
  margin-top: 8px;
}
.password-analysis-requirements-item {
  align-items: center;
  display: flex;
  margin-bottom: 4px;
}
.password-analysis-requirements-item > span {
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  display: block;
  height: 16px;
  margin-right: 8px;
  position: relative;
  width: 16px;
}
.password-analysis-requirements-item > span:before {
  content: "•";
  display: block;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
}
.password-analysis-requirements-item > span.rule-pass {
  background-image: url("data:image/svg+xml,%3Csvg width='13' height='9' viewBox='0 0 13 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.8673 1.38691L5.30557 8.9623L0.867188 4.51022L1.96308 3.41432L5.30557 6.75681L11.7714 0.291016L12.8673 1.38691Z' fill='%232DD267'/%3E%3C/svg%3E%0A");
}
.password-analysis-requirements-item > span.rule-pass:before {
  display: none;
}
.password-analysis-requirements-item > span.rule-pass + div {
  color: #2dd267;
}
.password-analysis-requirements-item > div {
  flex: 1;
}

.password-analysis--show-requirements .password-analysis-requirements {
  max-height: 140px;
}

.form .toggle-password .input-with-icon-content-icon {
  height: auto;
  padding-bottom: 0;
  top: calc(var(--input-height) / 2 - 12px);
}