.input-field{--input-field-border:var(--color-border-subtle-dark);--input-field-background:var(--color-surface-primary);--input-field-color:inherit;--icon-start-color:var(--color-text-disabled);--icon-end-color:var(--color-text-disabled);--input-field-label-color:var(--color-text-primary-muted);--input-field-border-radius:2px;--input-field-gap:.5rem;display:inline-flex;flex-direction:column;gap:.5rem}.input-field.invalid{--input-field-color:var(--color-text-error);--input-field-underline:var(--color-surface-error);--input-field-label-color:var(--color-text-error);--input-field-status-color:var(--color-text-error)}.input-field.invalid .input-field-description{opacity:0;position:absolute}.input-field.focused .input-field-main{--input-field-border:var(--input-field-border--active)}.input-field.disabled .input-field-main{--input-field-background:var(--color-surface-disabled);--input-field-color:var(--color-text-disabled);--input-field-underline:transparent;--input-field-label-color:var(--color-text-disabled);--input-field-status-color:var(--color-text-disabled)}.input-field.size-md{--input-field-size:2.5rem;--input-field-font-size:.8125rem}.input-field.size-md.filled .input-field-label{opacity:0}.input-field.size-lg .input-field-main{--input-field-size:3rem;--input-field-font-size:.875rem}.input-field.size-lg.filled:not(.placeholder){--input-filed-label-offset:.8125rem;--input-filed-input-offset:.875rem}.input-field.size-xl .input-field-main{--input-field-size:3.5rem;--input-field-font-size:1rem}.input-field.size-xl.filled:not(.placeholder){--input-filed-label-offset:1.0625rem;--input-filed-input-offset:1rem}.input-field.size-lg .input-field-label,.input-field.size-xl .input-field-label{transition:font-size .3s ease,top .3s ease}.input-field.size-lg.filled:not(.placeholder) .input-field-label,.input-field.size-xl.filled:not(.placeholder) .input-field-label{font-size:.6875rem}.input-field.size-lg.autofilled .input-field-label,.input-field.size-xl.autofilled .input-field-label{transition:none}.input-field.placeholder .input-field-label{opacity:0}.input-field .input-field-icon-status{--icon-end-color:var(--input-field-status-color,var(--color-text-positive))}.input-field-main{align-items:center;background-color:var(--input-field-background);border:1px solid var(--input-field-border);border-radius:var(--input-field-border-radius);color:var(--input-field-color);display:inline-flex;font-size:var(--input-field-font-size);gap:var(--input-field-gap);height:var(--input-field-size);padding:0 .75rem;position:relative;transition:border-color .3s ease}.input-field-main>*{flex:0 0 auto}.input-field-main:after{background-color:var(--input-field-underline,transparent);border-radius:0 0 var(--input-field-border-radius) var(--input-field-border-radius);bottom:-1px;content:"";height:.125rem;left:-1px;position:absolute;transition:background-color .2s linear;width:calc(100% + 2px)}.input-field-main>.ui-icon:first-child{color:var(--icon-start-color)}.input-field-main>.ui-icon:last-child{color:var(--icon-end-color)}.input-field-main:hover{--input-field-border:var(--input-field-border--hover)}.input-field-main .control-button.v-enter-active,.input-field-main .control-button.v-leave-active{transition:opacity .2s linear}.input-field-main .control-button.v-enter-from,.input-field-main .control-button.v-leave-to{opacity:0}.input-field-main .control-button:not(:last-child){margin-right:var(--input-field-gap);position:relative}.input-field-main .control-button:not(:last-child):after{background-color:var(--color-border-subtle-dark);content:"";height:100%;position:absolute;right:calc(var(--input-field-gap)*-1);width:1px}.input-field-content{flex-grow:1;flex-shrink:1;font-size:var(--input-field-text-size-m);height:100%;position:relative}.input-field-content input{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;background-color:transparent;border-width:0;color:var(--input-field-color);font-weight:600;height:100%;padding:0;padding-top:var(--input-filed-input-offset,0);width:100%}.input-field-content input::-moz-placeholder{font-weight:400}.input-field-content input::placeholder{font-weight:400}.input-field-content input:-moz-placeholder{text-overflow:ellipsis}.input-field-content input:placeholder-shown{text-overflow:ellipsis}.input-field-content input::-ms-clear{display:none}.input-field-content input:-moz-submit-invalid,.input-field-content input:-moz-ui-invalid,.input-field-content input:invalid{box-shadow:none}.input-field-content input:-webkit-autofill{animation-name:autoFillStart;-webkit-transition:background-color 50000s ease-in-out 50000s;transition:background-color 50000s ease-in-out 50000s}.input-field-content input:not(:-webkit-autofill){animation-name:autoFillCancel}.input-field-content input[type=number]::-webkit-inner-spin-button,.input-field-content input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.input-field-content input[type=number]{-moz-appearance:textfield}.input-field-content input:focus-visible{outline:0}.input-field-label{color:var(--input-field-label-color);left:0;overflow:hidden;pointer-events:none;position:absolute;text-overflow:ellipsis;top:var(--input-filed-label-offset,50%);transform:translateY(-50%);white-space:nowrap;width:100%}.input-field-messages{color:var(--color-text-primary-muted);font-size:.75rem;position:relative}.input-field-messages .input-field-description,.input-field-messages .input-field-error{display:block;padding:var(--input-field-messages-spacing-v) var(--input-field-messages-spacing-h) 0}.input-field-error{color:var(--color-text-error)}