.tn-text-field[data-v-22bb4290]{--tn-text-field-padding-horizontal:var(--spacing-l);--tn-text-field-gap:var(--spacing-s);--min-height:48px}@media screen and (max-width:599px){.tn-text-field[data-v-22bb4290]{--min-height:40px}}.tn-text-field[data-v-22bb4290]{--icon-size:24px}@supports (width:1lh){.tn-text-field[data-v-22bb4290]{--icon-size:1lh}}.tn-text-field[data-v-22bb4290]{display:flex;flex-direction:column;gap:var(--tn-text-field-gap);width:100%}.tn-text-field.compact[data-v-22bb4290]{--tn-text-field-padding-horizontal:8px;--tn-text-field-gap:4px;--min-height:32px}@media screen and (max-width:599px){.tn-text-field.compact[data-v-22bb4290]{--min-height:28px}}.tn-text-field .input-wrapper[data-v-22bb4290]{align-items:center;background:var(--color-surface-input-resting);border-radius:8px;box-shadow:inset 0 0 0 1px var(--color-border-input-resting);box-sizing:border-box;color:var(--color-text-default);cursor:text;display:flex;flex-direction:row;flex-wrap:nowrap;position:relative;width:100%}.tn-text-field .input-wrapper input[data-v-22bb4290]{all:unset;box-sizing:border-box;min-height:var(--min-height);min-width:0;padding-inline:var(--tn-text-field-padding-horizontal);width:100%}.tn-text-field .input-wrapper input[type=number][data-v-22bb4290]::-webkit-inner-spin-button,.tn-text-field .input-wrapper input[type=number][data-v-22bb4290]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.tn-text-field .input-wrapper input[type=number][data-v-22bb4290]{-moz-appearance:textfield}.tn-text-field .input-wrapper:has(.icon-left) input[data-v-22bb4290]{padding-left:calc(1lh + var(--tn-text-field-gap) + var(--tn-text-field-padding-horizontal))}.tn-text-field .input-wrapper:has(.clear) input[data-v-22bb4290],.tn-text-field .input-wrapper:has(.icon-right) input[data-v-22bb4290]{padding-right:calc(1lh + var(--tn-text-field-gap) + var(--tn-text-field-padding-horizontal))}.tn-text-field .input-wrapper:has(.icon-right):has(.clear) input[data-v-22bb4290]{padding-right:calc(2lh + var(--tn-text-field-gap)*2 + var(--tn-text-field-padding-horizontal))}.tn-text-field .input-wrapper:has(.icon-right):has(.clear) .clear[data-v-22bb4290]{right:calc(var(--tn-text-field-padding-horizontal) + var(--tn-text-field-gap) + 1lh)}.tn-text-field .input-wrapper .clear[data-v-22bb4290],.tn-text-field .input-wrapper .icon-left[data-v-22bb4290],.tn-text-field .input-wrapper .icon-right[data-v-22bb4290]{align-items:center;color:inherit;display:inline-flex;flex-grow:0;flex-shrink:0;justify-content:center;position:absolute}.tn-text-field .input-wrapper .clear svg[data-v-22bb4290],.tn-text-field .input-wrapper .icon-left svg[data-v-22bb4290],.tn-text-field .input-wrapper .icon-right svg[data-v-22bb4290]{height:var(--icon-size);width:var(--icon-size)}.tn-text-field .input-wrapper .clear[data-v-22bb4290],.tn-text-field .input-wrapper .icon-right[data-v-22bb4290]{right:var(--tn-text-field-padding-horizontal)}.tn-text-field .input-wrapper .icon-left[data-v-22bb4290]{left:var(--tn-text-field-padding-horizontal)}.tn-text-field .input-wrapper button.clear[data-v-22bb4290]{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;border-radius:var(--radius-max);color:inherit;cursor:pointer;font:inherit;margin:0;padding:0}.tn-text-field .input-wrapper button.clear[data-v-22bb4290]:focus-visible{outline:2px solid var(--color-border-action-focus);outline-offset:-2px}.tn-text-field .input-wrapper[data-v-22bb4290]:hover{background:var(--color-surface-input-hover);box-shadow:inset 0 0 0 1px var(--color-border-input-hover);color:var(--color-text-default)}.tn-text-field .input-wrapper[data-v-22bb4290]:active{background:var(--color-surface-input-active);box-shadow:inset 0 0 0 2px var(--color-border-input-active);color:var(--color-text-default)}.tn-text-field .input-wrapper.error[data-v-22bb4290]{box-shadow:inset 0 0 0 1px var(--color-border-critical)}.tn-text-field .input-wrapper.error[data-v-22bb4290]:hover{box-shadow:inset 0 0 0 1px var(--color-border-input-critical-hover)}.tn-text-field .input-wrapper.error[data-v-22bb4290]:active{background:var(--color-surface-input-resting);box-shadow:inset 0 0 0 2px var(--color-border-input-critical-active)}.tn-text-field .input-wrapper[data-v-22bb4290]:focus-within{background:var(--color-surface-input-active);box-shadow:inset 0 0 0 2px var(--color-border-input-active)}.tn-text-field .input-wrapper:focus-within.error[data-v-22bb4290]{background:var(--color-surface-input-active);box-shadow:inset 0 0 0 2px var(--color-border-input-critical)}.tn-text-field .input-wrapper[data-v-22bb4290]:has(input[type=button]:active:not(:focus-within)){box-shadow:inset 0 0 0 2px var(--color-border-input-active)}.tn-text-field .input-wrapper.disabled[data-v-22bb4290]:not(.readonly){background:var(--color-surface-input-disabled);box-shadow:inset 0 0 0 2px var(--color-border-input-disabled);color:var(--color-text-action-disabled);cursor:not-allowed}.tn-text-field .input-wrapper.readonly[data-v-22bb4290]{background:var(--color-surface-input-read-only);box-shadow:none;color:var(--color-text-default);cursor:default}.tn-text-field .input-wrapper[data-v-22bb4290]:invalid,.tn-text-field .input-wrapper[data-v-22bb4290]:user-invalid{box-shadow:inset 0 0 0 2px var(--color-border-critical)}.tn-text-field .input-wrapper .ignore-pointer-events[data-v-22bb4290]{pointer-events:none}.tn-text-field .input-wrapper .animate-spin[data-v-22bb4290]{animation:spin-22bb4290 1s linear infinite;animation-direction:reverse}@keyframes spin-22bb4290{to{transform:rotate(1turn)}}