{"version":3,"sources":["password-input/password-input.scss","password-input/_variables.scss","password-input/password-input-feedback.scss"],"names":[],"mappings":"AAEA,wBAEE,4DAAA,CADA,iBAAA,CAEA,wBAAA,CAAA,qBAAA,CAAA,oBAAA,CAAA,gBAAA,CAEA,kCAIE,cAAA,CAHA,mBAAA,CAAA,oBAAA,CAAA,mBAAA,CAAA,YAAA,CAEA,yCCPoB,CDMpB,UAEA,CAEA,wCACE,sDCTyB,CDa7B,8BAGE,kBAAA,CACA,wBAAA,CAAA,qBAAA,CACA,uBAAA,CAAA,oBAAA,CADA,0BAAA,CAAA,kBAAA,CAKA,wECpBmC,CDanC,mBAAA,CAAA,oBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,cAAA,CAAA,UAAA,CAAA,MAAA,CAIA,mDCnB4B,CDkB5B,WAAA,CADA,8BAAA,CAAA,sBAAA,CAGA,eAAA,CAPA,iBCZmC,CDsBnC,oCAOE,6DCxBsB,CDyBtB,kBAAA,CAHA,6ECvBuB,CDwBvB,iBAAA,CAFA,2EAKA,CAIJ,oEAVI,QAAA,CAFA,iBAAA,CACA,OAAA,CAOA,sCAAA,CAAA,kCAAA,CAAA,8BAYF,CARF,gCAQE,oGAAA,CAAA,4FAAA,CAFA,qFClC0B,CDiC1B,8CC/B2B,CD8B3B,4CAIA,CAIJ,0CACE,GACE,SAAA,CAGF,IACE,SAAA,CAGF,GACE,SAAA,CAAA,CAVJ,kCACE,GACE,SAAA,CAGF,IACE,SAAA,CAGF,GACE,SAAA,CAAA,CE9DJ,kCAGE,gEDgB8B,CCjB9B,2EDgBkC,CCjBlC,2EDgBmC,CCbnC,iBAAA,CAEA,2CACE,2FDaoC,CCVtC,wCACE,qFDUiC,CCPnC,2CACE,4FDOoC,CCJtC,2CACE,6FDIoC,CCDtC,0CACE,wFDCmC","file":"index.css","sourcesContent":["@import \"./variables\";\n\n.#{$component-prefix}password-input {\n  position: relative;\n  margin: $password-input-margin;\n  user-select: none;\n\n  &__security {\n    display: flex;\n    width: 100%;\n    height: $password-input-height;\n    cursor: pointer;\n\n    &::after {\n      border-radius: $password-input-border-radius;\n    }\n  }\n\n  &__item {\n    position: relative;\n    display: flex;\n    flex: 1;\n    align-items: center;\n    justify-content: center;\n    height: 100%;\n    font-size: $password-input-item-font-size;\n    line-height: 1.2;\n    background: $password-input-item-background-color;\n\n    &--mask {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      width: $password-input-mask-width;\n      height: $password-input-mask-height;\n      visibility: hidden;\n      background: $password-input-mask-color;\n      border-radius: 100%;\n      transform: translate(-50%, -50%);\n    }\n  }\n\n  &__cursor {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    width: $password-input-cursor-width;\n    height: $password-input-cursor-height;\n    background: $password-input-cursor-color;\n    transform: translate(-50%, -50%);\n    animation: $password-input-cursor-animation-duration #{$component-prefix}cursor-flicker infinite;\n  }\n}\n\n@keyframes #{$component-prefix}cursor-flicker {\n  from {\n    opacity: 0;\n  }\n\n  50% {\n    opacity: 1;\n  }\n\n  100% {\n    opacity: 0;\n  }\n}\n","@import \"../styles/prefix\";\n@import \"../styles/variables\";\n\n$password-input-height: var(--password-input-height, 50px * $hd);\n$password-input-margin: var(--password-input-margin, 0 var(--padding-md, $padding-md));\n$password-input-border-radius: var(--password-input-border-radius, 6px * $hd);\n$password-input-item-font-size: var(--password-input-item-font-size, 20px * $hd);\n$password-input-item-background-color: var(--password-input-item-background-color, var(--white, $white));\n//\n$password-input-mask-size: var(--password-input-mask-size, 10px * $hd);\n$password-input-mask-width: var(--password-input-mask-width, $password-input-mask-size);\n$password-input-mask-height: var(--password-input-mask-height, $password-input-mask-size);\n$password-input-mask-color: var(--password-input-mask-color, var(--black, $black));\n//\n$password-input-cursor-color: var(--password-input-cursor-color, var(--text-color, $text-color));\n$password-input-cursor-width: var(--password-input-cursor-width, 1px * $hd);\n$password-input-cursor-height: var(--password-input-cursor-height, 40%);\n$password-input-cursor-animation-duration: var(--password-input-cursor-animation-duration, 1s);\n//\n$password-input-feedback-margin-top: var(--password-input-feedback-margin-top, var(--padding-md, $padding-md));\n$password-input-feedback-font-size: var(--password-input-feedback-font-size, var(--font-size-md, $font-size-md));\n$password-input-feedback-color: var(--password-input-feedback-color, var(--gray-6, $gray-6));\n$password-input-feedback-primary-color: var(--password-input-feedback-primary-color, var(--primary-color, $primary-color));\n$password-input-feedback-info-color: var(--password-input-feedback-info-color, var(--info-color, $info-color));\n$password-input-feedback-success-color: var(--password-input-feedback-success-color, var(--success-color, $success-color));\n$password-input-feedback-warning-color: var(--password-input-feedback-warning-color, var(--warning-color, $warning-color));\n$password-input-feedback-danger-color: var(--password-input-feedback-danger-color, var(--danger-color, $danger-color));\n","@import \"./variables\";\n\n.#{$component-prefix}password-input__feedback {\n  margin-top: $password-input-feedback-margin-top;\n  font-size: $password-input-feedback-font-size;\n  color: $password-input-feedback-color;\n  text-align: center;\n\n  &--primary {\n    color: $password-input-feedback-primary-color;\n  }\n\n  &--info {\n    color: $password-input-feedback-info-color;\n  }\n\n  &--success {\n    color: $password-input-feedback-success-color;\n  }\n\n  &--warning {\n    color: $password-input-feedback-warning-color;\n  }\n\n  &--danger {\n    color: $password-input-feedback-danger-color;\n  }\n}\n"]}