@ozen-ui/kit/__inner__/esm/components/Input/Input.css

React component library

.Input-Body {
    position: relative;
    display: flex;
    -moz-column-gap: var(--textfield-input-gap);
         column-gap: var(--textfield-input-gap);
    align-items: center;
    box-sizing: border-box;
    padding: 0 var(--textfield-gutter-x);
    background-color: var(--textfield-background-color);
    transition: background-color box-shadow var(--transition-slow);
    color: var(--textfield-color);
    border-radius: var(--textfield-border-radius);
  }
  .Input-FieldContainer {
    inline-size: 100%;
    position: relative;
    overflow: hidden;
  }
  .Input-Field {
    border: none;
    outline: none;
    font: inherit;
    display: block;
    background: none;
    inline-size: 100%;
    box-sizing: border-box;
    color: var(--textfield-color);
    padding: var(--textfield-input-padding);
    block-size: var(--textfield-input-height);
  }
  .Input-Field:-webkit-autofill,
    .Input-Field:-webkit-autofill:hover,
    .Input-Field:-webkit-autofill:focus {
      box-shadow: 0 0 0 1000px var(--textfield-background-color) inset !important;
      background-color: transparent !important;
      -webkit-text-fill-color: var(--textfield-color);
    }
  .Input-Field::-webkit-outer-spin-button,
    .Input-Field::-webkit-inner-spin-button {
      -webkit-appearance: none;
              appearance: none;
      margin: 0;
    }
  .Input-Field[type='number'] {
      -webkit-appearance: textfield;
         -moz-appearance: textfield;
              appearance: textfield;
    }