@volverjs/style/dist/props/input.css

@volverjs/style is a lightweight responsive CSS utility library to accompany @volverjs/ui-* and static webpages as well.

:where(:host,:root,.theme){--input-background-color-focus:var(--color-surface-2);--input-background-color-hover:var(--color-surface-3);--input-background-color:var(--color-surface-1);--input-color:var(--color-word);--input-display:flex;--input-flex-direction:column;--input-flex:1;--input-font-size:var(--text-16);--input-gap:var(--spacing-md);--input-line-height:var(--leading-normal);--input-min-height:var(--spacing-52);--input-min-width:0;--input-spacing-top:var(--spacing-sm);--input-spacing-right:var(--spacing-sm);--input-spacing-bottom:var(--spacing-sm);--input-spacing-left:var(--spacing-sm);--input-text-overflow:ellipsis;--input-label-color:var(--color-word-2);--input-label-display:block;--input-label-font-size:var(--text-14);--input-label-font-weight:var(--font-normal);--input-label-gap:var(--spacing-xs);--input-label-max-width:100%;--input-label-overflow:hidden;--input-label-text-overflow:ellipsis;--input-label-white-space:nowrap;--input-icon-margin:0 var(--spacing-sm);--input-icon-pointer-events:none;--input-icon-position:absolute;--input-icon-width:1em;--input-hint-color:var(--color-word-2);--input-hint-display:block;--input-hint-font-size:var(--text-12);--input-hint-gap:var(--spacing-8);--input-hint-overflow:hidden;--input-hint-text-overflow:ellipsis;--input-hint-white-space:nowrap;--input-placeholder-color:var(--color-word-4);--input-valid-color:var(--color-success);--input-invalid-color:var(--color-danger);--input-floating-padding-top:calc(var(--input-spacing-top) + .55em);--input-floating-padding-bottom:calc(var(--input-spacing-bottom) - .55em);--input-floating-label-font-size:var(--text-12);--input-floating-label-translate:0 -.8em}