.has-phone-input{z-index:3;position:relative}.has-phone-input .input-phone-wrapper{min-width:190px;min-height:48px;position:relative;margin-top:32px;transition:all .6s var(--ease-quick-release);outline:1px solid;outline-color:transparent;background-color:rgb(var(--color-field));border:1px solid rgb(var(--color-border));display:flex;align-items:center;justify-content:flex-start;gap:18px}@media screen and (min-width:1024px){.has-phone-input .input-phone-wrapper{font-size:16px}}.has-phone-input .input-phone-wrapper label{position:absolute;top:-24px;left:0;color:var(--dark-800);line-height:1;margin:0;font-family:var(--font-body-family);font-size:var(--font-body-size)}.has-phone-input .input-phone-wrapper .prefix-number-wrapper{width:max-content;display:flex;align-items:center;justify-content:center;position:relative;padding-right:24px;cursor:pointer}.has-phone-input .input-phone-wrapper .prefix-number-wrapper .span-of-selected-prefix{line-height:100%;text-transform:unset;font-variant-numeric:lining-nums;font-family:var(--font-body-family);font-size:var(--font-body-size)}.has-phone-input .input-phone-wrapper .prefix-number-wrapper .caret-icon{position:absolute;top:calc(50% + 2px);right:0;transform:translate3d(0,-50%,0);width:16px;transition:all .6s var(--ease-quick-release);transform-origin:center}.has-phone-input .input-phone-wrapper .prefix-number-wrapper .caret-icon svg{width:16px}.has-phone-input .input-phone-wrapper .prefix-name-wrapper{width:max-content;text-transform:unset;font-family:var(--font-body-family);font-size:var(--font-body-size)}.has-phone-input .input-phone-wrapper .main-number-wrapper{flex-grow:1;border:0;margin:0;text-transform:unset;line-height:100%;letter-spacing:0;color:var(--dark-800);min-height:unset;outline:1px solid;outline-color:transparent;min-width:unset;transition:all .6s var(--ease-quick-release);background-color:transparent;font-variant-numeric:lining-nums;font-family:var(--font-body-family);font-size:var(--font-body-size)}.has-phone-input .input-phone-wrapper .prefixes-list-wrapper{position:absolute;z-index:2;top:calc(100% + 8px);left:0;width:100%;border-radius:4px;overflow:hidden;background-color:transparent;height:240px;max-height:0;border:1px solid;border-color:transparent;transition:all .6s var(--ease-quick-release)}.has-phone-input .input-phone-wrapper .prefixes-list-wrapper .prefix-searchbar{width:100%;min-height:unset;margin:0;border:0;text-transform:unset;letter-spacing:0;padding:12px 18px;background-color:transparent;background-color:var(--neutral-10);border-bottom:1px solid var(--dark-500);border:1px solid;border-color:var(--dark-400);font-family:var(--font-body-family);font-size:var(--font-body-size)}.has-phone-input .input-phone-wrapper .prefixes-list-wrapper .main-list{width:100%;height:192px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;background-color:var(--neutral-10);border:1px solid;border-color:var(--dark-400)}.has-phone-input .input-phone-wrapper .prefixes-list-wrapper .main-list .scroller{width:100%;height:100%;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;overflow-y:auto;-webkit-overflow-scrolling:touch}.has-phone-input .input-phone-wrapper .prefixes-list-wrapper .main-list .list-item{width:100%;text-transform:unset;letter-spacing:0;padding:12px 18px;cursor:pointer;transition:all .6s var(--ease-quick-release)}.has-phone-input .input-phone-wrapper .prefixes-list-wrapper .main-list .list-item:not(:last-child){border-bottom:1px solid var(--neutral-50)}.has-phone-input .form-row.has-checkbox-input{width:100%;margin-top:16px}.has-phone-input .field-icon{position:absolute;bottom:var(--spacing-m);right:8px;width:20px;opacity:0;transition:opacity .4s var(--ease-quick-release)}.has-phone-input.open-prefixes-list .input-phone-wrapper .prefix-number-wrapper .caret-icon{transform:translate3d(0,calc(-50% - 4px),0) rotate(180deg)}.has-phone-input.open-prefixes-list .input-phone-wrapper .prefixes-list-wrapper{max-height:240px}.has-phone-input .has-checkbox-input .field-icon{bottom:-16px}.has-phone-input.padding .input-phone-wrapper{padding:0px 1.6rem}
/*# sourceMappingURL=/cdn/shop/t/3/assets/input-with-prefix.css.map */