.text-input{--input-bg:hsl(from var(--surface-default) h s 99%);height:38px;border-radius:2px;border:1px solid var(--border-default);box-shadow:0 0 0 1px var(--border-default);transition:.3s ease;background:var(--input-bg)}.text-input input{border:none;outline:none;background-color:rgba(0,0,0,0);color:var(--text-primary);font:var(--font-body-m);width:100%;height:100%;padding:8px}.text-input:hover{--input-bg:hsl(from var(--surface-default) h s 97%)}.text-input:has(input:focus){--input-bg:hsl(from var(--surface-default) h s 95%);border-color:var(--border-focus);box-shadow:0 0 0 1px var(--border-focus)}.text-input:has(input:disabled){opacity:var(--opacity-disabled)}.text-input.-error{border-color:var(--error-default)}