input.fi-input {
    /* A fully transparent white background color is used
         instead transparent to fix a Safari bug
         where the date/time input "placeholder" colors too dark.

         https://github.com/filamentphp/filament/issues/7087 */

    @apply block w-full appearance-none border-none bg-white/0 px-3 py-1.5 text-start text-base text-gray-950 transition duration-75 placeholder:text-gray-400 focus:ring-0 focus:outline-none disabled:text-gray-500 disabled:[-webkit-text-fill-color:var(--color-gray-500)] disabled:placeholder:[-webkit-text-fill-color:var(--color-gray-400)] sm:text-sm sm:leading-6 dark:text-white dark:placeholder:text-gray-500 dark:disabled:text-gray-400 dark:disabled:[-webkit-text-fill-color:var(--color-gray-400)] dark:disabled:placeholder:[-webkit-text-fill-color:var(--color-gray-500)];

    &.fi-input-has-inline-prefix {
        @apply ps-0;
    }

    &.fi-input-has-inline-suffix {
        @apply pe-0;
    }

    &.fi-align-center {
        @apply text-center;
    }

    &.fi-align-end {
        @apply text-end;
    }

    &.fi-align-left {
        @apply text-left;
    }

    &.fi-align-right {
        @apply text-end;
    }

    &.fi-align-justify,
    &.fi-align-between {
        @apply text-justify;
    }
}