.text-field{width:100%;min-width:120px;max-width:640px;display:flex;flex-direction:column;gap:var(--spacing-4);font-size:var(--font-size-1);line-height:var(--font-size-1_5)}.text-field__field{gap:var(--spacing-8);display:flex;align-items:center;width:100%;background:var(--color-surface);border:1px solid var(--color-outline);border-radius:var(--border-radius-md);padding:0 var(--padding-sm);color:var(--color-on-surface)}.text-field__field:focus-within{border-color:var(--color-tertiary)}.text-field__label{display:flex;flex-direction:column;gap:var(--spacing-4)}.text-field__label-text{color:var(--color-on-surface-variant);background:rgba(0,0,0,0);font-size:var(--font-size-0_875);line-height:var(--font-size-1_375)}@container aura (max-width: 480px){.text-field__label-text{line-height:var(--font-size-1_25)}}.text-field__required-mark{color:var(--color-notification)}.text-field__icon{width:24px;height:24px}.text-field:has(.text-field__text:placeholder-shown) .text-field__icon:not(button){color:var(--color-on-surface-variant)}.text-field__icon:is(button){cursor:pointer;border:none;background:rgba(0,0,0,0)}.text-field:not(:has(.text-field__text:disabled)):not(.text-field--readonly) .text-field__icon:is(button):hover{opacity:.5}.text-field:not(:has(.text-field__text:disabled)):not(.text-field--readonly) .text-field__icon:is(button):active{opacity:.25}.text-field__text{padding:var(--spacing-12) 0;flex:1;border:none;outline:none;background:rgba(0,0,0,0);font-family:inherit;font-size:inherit;line-height:1.5;color:inherit}.text-field__text:focus{outline:none}.text-field__text::placeholder{color:var(--color-on-surface-variant)}.text-field:focus-within .text-field__field{border-color:var(--color-tertiary)}.text-field--error .text-field__field{border-color:var(--color-error)}.text-field--error .text-field__label-text{color:var(--color-error)}.text-field--error:focus-within .text-field__field{border-color:var(--color-error)}.text-field:has(.text-field__text:disabled){cursor:not-allowed}.text-field:has(.text-field__text:disabled) .text-field__field{background-color:var(--color-inactive-variant);border-color:var(--color-inactive);color:var(--color-on-inactive)}.text-field:has(.text-field__text:disabled) .text-field__text{cursor:not-allowed}.text-field:has(.text-field__text:disabled):hover .text-field__field{border-color:var(--color-inactive)}.text-field--readonly .text-field__field{color:var(--color-on-inactive);background-color:var(--color-inactive);border-color:var(--color-outline-variant)}.text-field--readonly .text-field__text{cursor:default}.text-field--readonly:focus-within .text-field__field{border-color:var(--color-outline-variant)}.text-field--readonly.text-field--error:focus-within .text-field__field{border-color:var(--color-outline-variant)}.text-field--readonly.text-field--error:hover .text-field__field{border-color:var(--color-outline-variant)}