.lux-form-element{appearance:none;-webkit-appearance:none;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;margin:0;position:relative;box-sizing:border-box;border:var(--lux-form-element__border-width, 1px) solid var(--lux-form-element__border-color, currentColor);border-radius:var(--lux-form-element__border-radius, var(--lux-radius-s));padding:var(--lux-form-element__padding-top, 0) var(--lux-form-element__padding-right, 8px) var(--lux-form-element__padding-bottom, 0) var(--lux-form-element__padding-left, 8px);color:var(--lux-form-element__text-color, currentColor);font-size:var(--lux-form-element__text-size, var(--lux-typography-body-1__font-size, 14px));font-family:var(--lux-form-element__text-family, var(--lux-typography__font-family, Verdana), Verdana, sans-serif);background-color:var(--lux-form-element__bg-color, #fff);line-height:calc(var(--lux-form-element__height, 32px) - var(--lux-form-element__border-width, 1px)*2)}.lux-form-element:hover{--lux-form-element__border-color: var(--lux-form-element__border-color-hover, currentColor)}.lux-form-element:focus{outline:none;box-shadow:0 0 1px 1px var(--lux-form-element__border-color-focus)}.lux-form-element:disabled{--lux-form-element__border-color: var(--lux-color-c-l70);--lux-form-element__bg-color: var(--lux-color-c-l94);--lux-form-element__text-color: var(--lux-color-c-l40);pointer-events:none}.lux-form-element:invalid{--lux-form-element__border-color: var(--lux-form-element__border-color-invalid, currentColor);--lux-form-element__border-color-focus: var(--lux-form-element__border-color-invalid, currentColor)}.lux-form-element::placeholder{--lux-form-element__text-color: $placeholder-color}.lux-form-element[type=radio]{min-height:auto;border-radius:50%;width:var(--lux-form-element__radio-size, 20px);height:var(--lux-form-element__radio-size, 20px);margin:calc((var(--lux-form-element__radio-touch-size, 24px) - var(--lux-form-element__radio-size, 20px))/2);padding:0}.lux-form-element[type=radio]:invalid:before{--lux-form-element__radio-bullet-color: var(--lux-form-element__border-color-invalid, currentColor)}.lux-form-element[type=radio]:checked:before{content:"";width:var(--lux-form-element__radio-bullet-size, 10px);height:var(--lux-form-element__radio-bullet-size, 10px);background-color:var(--lux-form-element__radio-bullet-color, currentColor);border-radius:inherit}.lux-form-element[type=radio]:after{content:"";position:absolute;width:var(--lux-form-element__radio-touch-size, 24px);height:var(--lux-form-element__radio-touch-size, 24px)}.lux-form-element[type=checkbox]{border-radius:var(--lux-form-element__checkbox-radius, var(--lux-radius-xs));width:var(--lux-form-element__checkbox-size, 18px);height:var(--lux-form-element__checkbox-size, 18px);min-height:auto;padding:0;margin:calc((var(--lux-form-element__checkbox-touch-size, var(--lux-form-element__checkbox-size, 24px)) - var(--lux-form-element__checkbox-size, 18px))/2)}.lux-form-element[type=checkbox]:checked:before{content:"";position:absolute;top:var(--lux-form-element__checkbox-icon-margin, 2px);left:var(--lux-form-element__checkbox-icon-margin, 2px);bottom:var(--lux-form-element__checkbox-icon-margin, 2px);right:var(--lux-form-element__checkbox-icon-margin, 2px);background-color:var(--lux-form-element__checkbox-icon-color, currentColor);mask-image:var(--lux-form-element__checkbox-icon-url, url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHdpZHRoPSIyNCI+PHBhdGggZD0iTTguNTQ4IDIxLjQ0OCAwIDEyLjgyOWwzLjI4Ni0zLjMxNSA1LjI2MiA1LjMwNUwyMC43MTQgMi41NTIgMjQgNS44NjVaIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=));-webkit-mask-image:var(--lux-form-element__checkbox-icon-url, url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHdpZHRoPSIyNCI+PHBhdGggZD0iTTguNTQ4IDIxLjQ0OCAwIDEyLjgyOWwzLjI4Ni0zLjMxNSA1LjI2MiA1LjMwNUwyMC43MTQgMi41NTIgMjQgNS44NjVaIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=));mask-size:cover;-webkit-mask-size:cover}.lux-form-element[type=checkbox]:invalid:before{--lux-form-element__checkbox-icon-color: var(--lux-form-element__border-color-invalid, currentColor)}.lux-form-element[type=checkbox]:after{content:"";position:absolute;width:var(--lux-form-element__checkbox-touch-size, var(--lux-form-element__checkbox-size, 24px));height:var(--lux-form-element__checkbox-touch-size, var(--lux-form-element__checkbox-size, 24px))}.lux-form-element--switch[type=checkbox]{appearance:none;-webkit-appearance:none;width:var(--lux-form-element__switch-width, 45px);height:var(--lux-form-element__switch-height, 24px);background-color:var(--lux-color-c-l50);border-radius:var(--lux-radius-round);min-width:var(--lux-form-element__switch-height, 24px);display:inline-flex;align-items:center;padding:var(--lux-form-element__switch-padding, 2px);margin:0;cursor:pointer}.lux-form-element--switch[type=checkbox]:hover{background-color:var(--lux-color-c-l40)}.lux-form-element--switch[type=checkbox]:checked{background-color:var(--lux-color-b)}.lux-form-element--switch[type=checkbox]:checked:hover{background-color:var(--lux-color-b-d10)}.lux-form-element--switch[type=checkbox]:focus{outline:var(--lux-color-b) solid 2px;outline-offset:1px}.lux-form-element--switch[type=checkbox]:invalid,.lux-form-element--switch[type=checkbox]:checked:invalid{outline-color:var(--lux-color-h2);background-color:var(--lux-color-h2)}.lux-form-element--switch[type=checkbox]:disabled{pointer-events:none;background-color:var(--lux-color-c-l82);border-color:var(--lux-color-c-l82)}.lux-form-element--switch[type=checkbox]:before{--bullet-size: calc(var(--lux-form-element__switch-height, 24px) - var(--lux-form-element__switch-padding, 2px) * 2);content:"";width:var(--bullet-size);height:var(--bullet-size);background-color:var(--lux-color-d);border-radius:50%;transition:margin .3s ease}.lux-form-element--switch[type=checkbox]:checked:before{margin-left:calc(100% - var(--bullet-size))}.lux-form-element:is(select){background-image:var(--lux-form-element__select-icon-url, url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTYgOS41N2MwLS4yNy4xLS41NS4zMS0uNzYuNDItLjQyIDEuMS0uNDIgMS41MiAwTDEyIDEyLjk4bDQuMTctNC4xN2ExLjA3NCAxLjA3NCAwIDEgMSAxLjUyIDEuNTJMMTIgMTYuMDJsLTUuNjktNS42OUM2LjEgMTAuMTIgNiA5Ljg1IDYgOS41N1oiIGZpbGw9IiM5OTkiLz48L3N2Zz4=));background-position:right var(--lux-form-element__select-icon-margin, 4px) center;background-repeat:no-repeat;background-size:var(--lux-form-element__select-icon-size, 24px);padding-right:calc(var(--lux-form-element__select-icon-size, 24px) + var(--lux-form-element__select-icon-margin, 4px)*2);text-overflow:ellipsis}.lux-form-element:is(textarea){min-height:var(--lux-form-element__textarea-min-height, 78px);line-height:var(--lux-form-element__textarea-line-height, 20px);padding:var(--lux-form-element__textarea-padding, 8px)}.lux-floating-label{border:0;padding:0;margin:0}@supports selector(:has(*)) and selector(:placeholder-shown){.lux-floating-label{--label-height: 16px;--input-height: 20px;--padding-h: 8px;--padding-v: 4px;--lux-form-element__height: var(--input-height);--lux-form-element__padding-top: calc(var(--label-height) + var(--padding-v));--lux-form-element__padding-bottom: var(--padding-v);--lux-form-element__padding-left: var(--padding-h);--lux-form-element__padding-right: var(--padding-h);--lux-form-element__select-icon-margin: 4px;font-family:var(--lux-typography__font-family, Verdana),Verdana,sans-serif;position:relative;display:inline-flex;align-items:center}.lux-floating-label .lux-form-element{flex-grow:1}.lux-floating-label label{user-select:none;pointer-events:none;display:inline-block;line-height:calc(var(--label-height) + var(--input-height));position:absolute;top:var(--padding-v);left:var(--padding-h);right:var(--padding-h);font-size:16px;color:var(--lux-color-c-l30);transition:all .1s ease-in-out;cursor:text;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;z-index:1}.lux-floating-label ::placeholder{color:rgba(0,0,0,0)}.lux-floating-label:has(select) label,.lux-floating-label:has(input:not(:placeholder-shown),input:focus) label{line-height:var(--label-height);font-size:var(--lux-typography-body-2__font-size, 12px)}.lux-floating-label:has(select) label{right:calc(var(--padding-h) + var(--lux-form-element__select-icon-size, 24px))}.lux-floating-label:not(:has(label)):after{content:"missing label element";color:red}.lux-floating-label:has(label:empty):after{content:"missing label text";color:red}.lux-floating-label:has(input):not(:has(input[placeholder])):after{content:"missing placeholder";color:red}}@supports not selector(:has(*) or :placeholder-shown){.lux-floating-label{display:flex;flex-direction:column;gap:4px}.lux-floating-label label{font-size:var(--lux-typography-body-2__font-size, 12px);font-weight:var(--lux-typography-body-2__font-weight, 400);line-height:var(--lux-typography-body-2__line-height, 18px)}}
