@layer tx.components{.tx-field{box-sizing:border-box;border:var(--tx-input-border-width,var(--tx-border-width-thin)) solid var(--tx-input,var(--tx-border,CanvasText));border-radius:var(--tx-input-radius,var(--tx-shape-radius-lg));background-color:var(--tx-surface,Canvas);inline-size:100%;min-inline-size:0;color:var(--tx-foreground,CanvasText);box-shadow:var(--tx-input-elevation,var(--tx-elevation-1));font-family:var(--tx-font-sans,system-ui, sans-serif);font-size:var(--tx-input-font-size-touch,var(--tx-font-size-base));font-weight:var(--tx-input-font-weight,var(--tx-type-body-weight));transition:border-color var(--tx-motion-fast,.15s) var(--tx-motion-easing,ease), box-shadow var(--tx-motion-fast,.15s) var(--tx-motion-easing,ease);outline:none;margin:0;line-height:1.4}@media (width>=640px){.tx-field{font-size:var(--tx-input-font-size,var(--tx-font-size-sm))}}.tx-field::placeholder{color:var(--tx-input-placeholder-fg,var(--tx-muted-foreground,GrayText));opacity:1}.tx-field:focus-visible{border-color:var(--tx-ring,Highlight);box-shadow:0 0 0 var(--tx-focus-ring-width,2px) color-mix(in oklab, var(--tx-ring,Highlight) 30%, transparent)}.tx-field:disabled,.tx-field[aria-disabled=true]{cursor:not-allowed;opacity:var(--tx-input-disabled-opacity,var(--tx-opacity-disabled))}.tx-field[aria-invalid=true]{border-color:var(--tx-destructive,crimson)}.tx-field[aria-invalid=true]:focus-visible{box-shadow:0 0 0 var(--tx-focus-ring-width,2px) color-mix(in oklab, var(--tx-destructive,crimson) 30%, transparent)}.tx-input{block-size:var(--tx-input-height,var(--tx-size-control-md));min-block-size:var(--tx-input-height-touch,var(--tx-size-control-lg));padding-block:var(--tx-input-padding-block,var(--tx-space-1));padding-inline:var(--tx-input-padding-inline,var(--tx-space-3));display:flex}@media (width>=640px){.tx-input{min-block-size:0}}.tx-input[type=file]{padding-block:.35rem}.tx-input[type=file]::file-selector-button{color:var(--tx-foreground,CanvasText);font:inherit;font-weight:var(--tx-font-weight-medium,500);background:0 0;border:0;margin-inline-end:var(--tx-space-3)}.tx-textarea{min-block-size:5rem;padding-block:var(--tx-input-textarea-padding-block,var(--tx-space-2));padding-inline:var(--tx-input-padding-inline,var(--tx-space-3));resize:vertical;field-sizing:content;display:block}.tx-textarea[data-tx-autosize=true]{resize:none;overflow:hidden}.tx-input-group{border:var(--tx-input-border-width,var(--tx-border-width-thin)) solid var(--tx-input,var(--tx-border,CanvasText));border-radius:var(--tx-input-radius,var(--tx-shape-radius-lg));background-color:var(--tx-surface,Canvas);inline-size:100%;min-inline-size:0;color:var(--tx-foreground,CanvasText);box-shadow:var(--tx-input-elevation,var(--tx-elevation-1));transition:border-color var(--tx-motion-fast,.15s) var(--tx-motion-easing,ease), box-shadow var(--tx-motion-fast,.15s) var(--tx-motion-easing,ease);align-items:stretch;display:flex}.tx-input-group:focus-within{border-color:var(--tx-ring,Highlight);box-shadow:0 0 0 var(--tx-focus-ring-width,2px) color-mix(in oklab, var(--tx-ring,Highlight) 30%, transparent)}.tx-input-group[data-tx-invalid=true]{border-color:var(--tx-destructive,crimson)}.tx-input-group[data-tx-invalid=true]:focus-within{box-shadow:0 0 0 var(--tx-focus-ring-width,2px) color-mix(in oklab, var(--tx-destructive,crimson) 30%, transparent)}.tx-input-group[data-tx-disabled=true]{cursor:not-allowed;opacity:var(--tx-input-disabled-opacity,var(--tx-opacity-disabled))}.tx-input-group__adornment{align-items:center;gap:var(--tx-space-1);padding-inline:var(--tx-space-2);color:var(--tx-muted-foreground,GrayText);font-size:var(--tx-input-font-size,var(--tx-font-size-sm));white-space:nowrap;display:inline-flex}.tx-input-group__control{min-inline-size:0;box-shadow:none;color:inherit;font:inherit;font-size:var(--tx-input-font-size-touch,var(--tx-font-size-base));padding-block:var(--tx-input-padding-block,var(--tx-space-1));padding-inline:var(--tx-space-2);block-size:var(--tx-input-height,var(--tx-size-control-md));min-block-size:var(--tx-input-height-touch,var(--tx-size-control-lg));background:0 0;border:0;border-radius:0;outline:none;flex:auto;margin:0;line-height:1.4}@media (width>=640px){.tx-input-group__control{min-block-size:0;font-size:var(--tx-input-font-size,var(--tx-font-size-sm))}}.tx-input-group__control::placeholder{color:var(--tx-input-placeholder-fg,var(--tx-muted-foreground,GrayText));opacity:1}.tx-input-group__control:disabled{cursor:not-allowed}.tx-input-clear{border-radius:var(--tx-input-radius,var(--tx-shape-radius-lg));color:var(--tx-muted-foreground,GrayText);cursor:pointer;inline-size:var(--tx-size-control-xs);block-size:var(--tx-size-control-xs);font:inherit;background:0 0;border:0;justify-content:center;align-items:center;margin:0;padding:0;line-height:1;display:inline-flex}.tx-input-clear:hover{color:var(--tx-foreground,CanvasText)}.tx-input-clear:focus-visible{outline:var(--tx-focus-ring-width,2px) solid var(--tx-ring,Highlight);outline-offset:var(--tx-focus-ring-offset,2px)}.tx-input-shell{gap:calc(var(--tx-space-unit) * 1.5);display:grid}.tx-input-shell__label{color:var(--tx-foreground,CanvasText);font-size:var(--tx-type-label-size);font-weight:var(--tx-type-label-weight)}.tx-input-shell__control-wrap{position:relative}.tx-input-shell__count{color:var(--tx-muted-foreground,GrayText);font-size:var(--tx-type-caption-size);font-variant-numeric:tabular-nums;pointer-events:none;position:absolute;inset-inline-end:var(--tx-space-3)}.tx-input-shell__count[data-tx-placement=input]{inset-block-start:50%;transform:translateY(-50%)}.tx-input-shell__count[data-tx-placement=textarea]{inset-block-end:var(--tx-space-2)}.tx-input-shell__count[data-tx-visible=false]{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.tx-field.tx-field--with-count,.tx-input-group__control.tx-field--with-count{padding-inline-end:var(--tx-space-12)}.tx-sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (forced-colors:active){.tx-field:focus-visible,.tx-input-group:focus-within{outline:var(--tx-focus-ring-width,2px) solid Highlight;outline-offset:var(--tx-focus-ring-offset,2px)}}:where([data-tx-input-style=compact]){--tx-input-height:var(--tx-size-control-sm);--tx-input-padding-inline:var(--tx-space-2)}:where([data-tx-input-style=comfortable]){--tx-input-height:var(--tx-size-control-lg);--tx-input-padding-inline:var(--tx-space-4)}}
