.input{flex-direction:column;gap:8px;width:200px;display:flex}.input .input-header .input-header-label{letter-spacing:.01px;font-size:14px;font-weight:400;line-height:20px}.input .input-content{background-color:#202736;border:1px solid #202736;border-radius:8px;align-items:center;gap:8px;width:100%;height:100%;transition:border-color .3s,background-color .3s;display:flex}.input .input-content .button-close-enter-active,.input .input-content .button-close-leave-active{transition:opacity .3s,transform .3s}.input .input-content .button-close-enter-from,.input .input-content .button-close-leave-to{opacity:0;transform:translate(100%)}.input .input-content .input-content-close{display:flex}.input .input-content .input-content-close .input-content-close-icon{width:20px;height:20px}.input .input-content .input-content-close .input-content-close-icon *{fill:#9ba7bf;transition:fill .3s}.input .input-content .input-content-close:hover{cursor:pointer}.input .input-content .input-content-close:hover .input-content-close-icon{width:20px;height:20px}.input .input-content .input-content-close:hover .input-content-close-icon *{fill:#fff}.input .input-content .input-content-icon{width:20px;min-width:20px;height:20px}.input .input-content .input-content-icon *{fill:#9ba7bf}.input .input-content .input-content-field{box-shadow:none;color:#fff;letter-spacing:.01px;background:0 0;border:none;outline:none;width:100%;height:100%;font-size:14px;font-weight:400;line-height:20px}.input .input-content .input-content-field:focus,.input .input-content .input-content-field:focus-visible{box-shadow:none;outline:none}.input .input-content .input-content-field::placeholder{color:#9ba7bf}.input .input-alert{align-items:center;gap:4px;display:flex}.input .input-alert .input-alert-icon{width:16px;min-width:16px;height:16px}.input .input-alert .input-alert-desc{letter-spacing:.02px;font-size:12px;font-weight:500;line-height:16px}.input:has(.input-content .input-content-field:hover) .input-content{background-color:#353a5a;border-color:#353a5a}.input:has(.input-content .input-content-field:focus):not(.--state-success):not(.--state-error) .input-content{background-color:#202736;border-color:#b055ff}.input.--state-success .input-content{background-color:#202736;border-color:#64eb49}.input.--state-success .input-alert .input-alert-icon *,.input.--state-success .input-content .input-content-icon *{fill:#64eb49}.input.--state-success .input-alert .input-alert-desc{color:#64eb49}.input.--state-error .input-content{background-color:#202736;border-color:#ff3d33}.input.--state-error .input-alert .input-alert-icon *,.input.--state-error .input-content .input-content-icon *{fill:#ff3d33}.input.--state-error .input-alert .input-alert-desc{color:#ff3d33}:is(.input:not(:has(.input-content .input-content-field:focus)).--state-error:hover .input-content,.input:not(:has(.input-content .input-content-field:focus)).--state-success:hover .input-content){background-color:#353a5a}.input.--size-md .input-content{height:44px;padding:10px 14px}.input.--size-lg .input-content{height:52px;padding:14px}
