.mds-textfield{box-sizing:border-box;border-radius:var(--radius-s);border:1px solid var(--color-neutral-500);background:var(--color-neutral-0);width:100%;padding:var(--spacing-xs) var(--spacing-s);flex-direction:row;justify-content:space-between;align-items:center;display:flex}.mds-textfield__title+.mds-textfield{margin-top:var(--spacing-xxs)}:is(.mds-textfield:has(~.mds-textfield__error-text),.mds-textfield:has(~.mds-textfield__supporting-text)){margin-bottom:var(--spacing-xs)}.mds-textfield__input{box-sizing:border-box;font-family:var(--font-family-default);font-size:var(--font-size-m);appearance:none;color:var(--color-text-1000);background:0 0;border:none;outline:none;flex:1;margin:0;padding:0}.mds-textfield__input::placeholder,.mds-textfield__input[data-placeholder=true],.mds-textfield[data-placeholder]>span:first-of-type{color:var(--color-text-tertiary)}.mds-textfield-container[data-size=large] .mds-textfield{height:60px;padding:var(--spacing-s)}.mds-textfield-container[data-size=medium] .mds-textfield{height:50px}.mds-textfield-container[data-size=small] .mds-textfield{border-radius:var(--radius-s);height:45px}.mds-textfield[data-phone-number=true]{background:var(--color-surface-form-default);border:1px solid var(--color-border-form-default);border-radius:var(--radius-s);flex-direction:row;align-items:stretch;overflow:visible;padding:0!important}:is(.mds-textfield[data-phone-number=true]:has(.form-control:focus),.mds-textfield[data-phone-number=true]:has(.flag-dropdown.open)){border:1px solid var(--color-brand-900);border-radius:6px}:is(.mds-textfield[data-phone-number=true]:has(.form-control:focus) .flag-dropdown,.mds-textfield[data-phone-number=true]:has(.flag-dropdown.open) .flag-dropdown){border-radius:6px 0 0 6px}.mds-textfield[data-phone-number=true][data-error=true]{border:1px solid var(--color-accent-error-200);border-radius:6px}.mds-textfield[data-phone-number=true][data-readonly=true]{background:var(--color-surface-form-disabled);border:1px solid var(--color-border-form-default);cursor:not-allowed;pointer-events:none}.mds-textfield[data-phone-number=true][data-readonly=true] .mds-textfield__input,.mds-textfield[data-phone-number=true][data-readonly=true] .mds-textfield__input::placeholder,.mds-textfield[data-phone-number=true][data-readonly=true] .form-control{color:var(--color-text-600);cursor:not-allowed!important}.mds-textfield:hover{border-radius:6px;box-shadow:1px 1px 10px #0000000d}.mds-textfield:has(.mds-textfield__input:focus){border:1px solid var(--color-brand-900);border-radius:6px}.mds-textfield[data-filled=true]{border-radius:6px}.mds-textfield[data-readonly=true]{background:var(--color-neutral-200);cursor:not-allowed;pointer-events:none}.mds-textfield[data-readonly=true] .mds-textfield__input,.mds-textfield[data-readonly=true] .mds-textfield__input::placeholder{color:var(--color-text-600);cursor:not-allowed}.mds-textfield[data-error=true]{border:1px solid var(--color-accent-error-200);border-radius:6px}.mds-textfield__left-icon{flex-shrink:0;justify-content:center;align-items:center;display:flex}.mds-textfield__right-icon{flex-shrink:0;justify-content:center;align-items:center;margin-left:auto;display:flex}.mds-textfield[data-left-icon=true],.mds-textfield[data-right-icon=true]{gap:var(--spacing-xxs)}.mds-textfield[data-left-icon=true] .mds-textfield__input{padding-left:6px}.mds-textfield[data-right-icon=true] .mds-textfield__input{padding-right:6px}.mds-textfield__password-toggle{box-sizing:border-box;font-family:var(--font-family-default);font-size:var(--font-size-m);appearance:none;cursor:pointer;background:0 0;border:none;outline:none;justify-content:center;align-items:center;margin:0;padding:0;display:flex}.mds-textfield__password-toggle:focus-visible{outline:2px solid var(--color-brand-900);outline-offset:2px;border-radius:var(--radius-xs)}.mds-textfield-container{box-sizing:border-box;border-radius:var(--radius-s);flex-direction:column;display:flex}.mds-textfield__title{font-family:var(--font-family-default);font-size:var(--font-size-m);font-weight:var(--font-weight-bold);line-height:var(--line-height-l);color:var(--color-brand-1000)}.mds-textfield-container[data-size=small] .mds-textfield__title{font-size:var(--font-size-s);line-height:var(--line-height-m)}.mds-textfield__supporting-text{font-family:var(--font-family-default);font-size:var(--font-size-s);line-height:var(--line-height-m);color:var(--color-text-secondary)}.mds-textfield__error-text{font-family:var(--font-family-default);font-size:var(--font-size-s);line-height:var(--line-height-m);color:var(--color-text-error)}.mds-textfield__error-text+.mds-textfield__supporting-text{margin-top:var(--spacing-xs)}.mds-textfield[data-phone-number=true] .react-tel-input{font-family:var(--font-family-default);font-size:var(--font-size-m);flex-direction:row-reverse;display:flex}.mds-textfield[data-phone-number=true] .flag-dropdown{background:var(--color-neutral-100);padding:var(--spacing-s);border-radius:var(--radius-s) 0 0 var(--radius-s);border:none;min-width:80px!important;max-width:120px!important;position:static!important}.mds-textfield[data-phone-number=true] .flag-dropdown:hover{background:var(--color-neutral-200)}.mds-textfield[data-phone-number=true] .selected-flag,.mds-textfield[data-phone-number=true] .selected-flag.open{background:0 0;justify-content:center;align-items:center;display:flex;border-radius:0!important;width:100%!important;padding:0!important}.mds-textfield[data-phone-number=true] .form-control{width:100%;height:100%;padding:var(--spacing-s);font-family:var(--font-family-default);font-size:var(--font-size-m);border:none}.mds-textfield[data-phone-number=true] .form-control::placeholder{color:var(--color-text-tertiary)!important}.mds-textfield[data-phone-number=true] .form-control:focus{box-shadow:none!important;border:none!important;outline:none!important}.mds-textfield[data-phone-number=true] .arrow{color:var(--color-neutral-800);border:none;border-left:3px solid #0000;border-right:3px solid #0000;border-top:4px solid var(--color-neutral-800);width:0;height:0;margin:0;position:relative;transform:none}.mds-textfield[data-phone-number=true] .arrow.up{border-top:none;border-bottom:4px solid var(--color-neutral-800)}.mds-textfield[data-phone-number=true] .country-list{top:100%;left:0;right:0;overflow-y:auto;background:var(--color-neutral-0)!important;border-radius:var(--radius-s)!important;z-index:1000!important;max-height:min(216px,50vh)!important;margin:0!important;margin-top:var(--spacing-xs)!important;width:100%!important;overflow-x:hidden!important;box-shadow:2px 2px 10px #00000040!important}.mds-textfield[data-phone-number=true] .country{-webkit-user-select:none;user-select:none;outline:none;cursor:pointer!important;background:var(--color-neutral-0)!important;width:100%!important;color:var(--color-text-1000)!important;border-radius:var(--radius-s) var(--radius-s) 0 0!important;border:none!important;align-items:center!important;padding:10px 18px!important;display:flex!important;position:static!important;overflow:visible!important}.mds-textfield[data-phone-number=true] .country .flag{margin-top:0!important;position:static!important;top:auto!important;transform:translateY(-2px)!important}.mds-textfield[data-phone-number=true] .country .country-name{text-align:left!important;margin-left:var(--spacing-xs)!important;white-space:nowrap!important;text-overflow:ellipsis!important;flex:1!important;overflow:hidden!important}.mds-textfield[data-phone-number=true] .country .dial-code{margin-left:auto!important}.mds-textfield[data-phone-number=true] .country:hover{background:var(--color-neutral-200)!important}.mds-textfield[data-phone-number=true] .country.highlight{background:var(--color-brand-50)!important}.mds-textfield[data-phone-number=true][data-readonly=true] .flag-dropdown{cursor:not-allowed;pointer-events:none;background:var(--color-neutral-300)!important}.mds-textfield[data-phone-number=true][data-readonly=true] .form-control{cursor:not-allowed;pointer-events:none;background:var(--color-surface-form-disabled)!important;color:var(--color-text-600)!important}.mds-textfield[data-phone-number=true][data-readonly=true] .form-control::placeholder{color:var(--color-text-600)!important}
