@property --codex-input-height{syntax: "<length>"; inherits: true; initial-value: 64px;}@property --codex-input-background-color{syntax: "<color>"; inherits: true; initial-value: rgba(20,20,20,.6);}@property --codex-input-color{syntax: "<color>"; inherits: false; initial-value: white;}@property --codex-input-label-color{syntax: "<color>"; inherits: true; initial-value: rgb(123,123,123);}@property --codex-input-border-radius{syntax: "<length>"; inherits: false; initial-value: 10px;}@property --codex-input-border-color{syntax: "<color>"; inherits: false; initial-value: rgba(150,150,150,.2);}@property --codex-input-padding{syntax: "<length>"; inherits: true; initial-value: 16px;}.input.input--big{--codex-input-height: 64px;--codex-input-padding: 16px}.input.input--medium{--codex-input-height: 40px;--codex-input-padding: 10px}.input input{background-color:var( --codex-input-background-color, rgba(20, 20, 20, .6) );color:var(--codex-input-color, white);border-radius:var(--codex-input-border-radius, 10px);border:1px solid var(--codex-input-border-color, rgba(150, 150, 150, .2));padding:var(--codex-input-padding, 16px);outline:none;display:inline-block;box-sizing:border-box;font-weight:500;font-size:20px;height:var(--codex-input-height);position:relative;font-family:var(--codex-font-family);font-size:14px;font-weight:400;line-height:20px;letter-spacing:-.006em}.input input::placeholder{font-family:var(--codex-font-family);font-size:14px;font-weight:400;line-height:20px;letter-spacing:-.006em}.input.input--invalid input{--codex-input-color: rgb(251, 55, 72);--codex-input-border-color: rgb(251, 55, 72)}.input label{margin-bottom:.75rem;display:block;font-size:14px;font-weight:500;line-height:20px;letter-spacing:-.006em;text-align:left;color:var(--codex-input-label-color)}.input input:not(.input[disabled]):active,.input input:not(.input[disabled]):focus{box-shadow:0 0 0 1px var(--codex-input-border-color)}.input input[disabled]{--codex-input-background-color: rgba(70, 70, 70, .75);cursor:not-allowed}.input.input--icon input{padding-left:2.5rem}.input>div{position:relative}.input>div div{position:absolute;height:100%;padding:0 .75rem;display:flex;align-items:center;z-index:1}.input small{margin-top:.25rem;display:inline-block;font-size:.9rem;color:var(--codex-input-label-color)}.input.input--invalid{--codex-input-label-color: rgb(251, 55, 72)}
