export default { css: ` .p-float-label { display: block; position: relative; } .p-float-label label { position: absolute; pointer-events: none; top: 50%; margin-top: -.5rem; transition-property: all; transition-timing-function: ease; line-height: 1; left: 0.75rem; color: var(--p-float-label-text-color); transition-duration: var(--p-transition-duration); } .p-float-label:has(textarea) label { top: 1rem; } .p-float-label:has(input:focus) label, .p-float-label:has(input.p-filled) label, .p-float-label:has(input:-webkit-autofill) label, .p-float-label:has(textarea:focus) label, .p-float-label:has(textarea.p-filled) label, .p-float-label:has(.p-inputwrapper-focus) label, .p-float-label:has(.p-inputwrapper-filled) label { top: -.75rem; font-size: 12px; color: var(--p-float-label-text-color-focus); } .p-float-label .p-placeholder, .p-float-label input::placeholder, .p-float-label .p-inputtext::placeholder { opacity: 0; transition-property: all; transition-timing-function: ease; } .p-float-label .p-focus .p-placeholder, .p-float-label input:focus::placeholder, .p-float-label .p-inputtext:focus::placeholder { opacity: 1; transition-property: all; transition-timing-function: ease; } .p-float-label > .p-invalid + label { color: var(--p-float-label-text-color-invalid); } ` };