@utility input-outlined-error {
    @apply text-danger-600 border-danger-600;
    svg[class~=iconify]:not(.static-icon) path {
        @apply stroke-danger-600;
    }
}

@utility input-solid-error {
    @apply input-outlined-error bg-danger-50;
}

@utility input-outlined-disabled {
    @apply text-slate-300 border-slate-200;
    svg[class~=iconify]:not(.static-icon) path {
        @apply stroke-slate-300;
    }
}

@utility input-solid-disabled {
    @apply input-outlined-disabled bg-slate-50;
}

@utility input-effects {
    &:hover {
        @apply border-black;
    }

    &:focus-within {
        @apply border-black text-black;

        svg[class~=iconify]:not(.static-icon) path {
            @apply stroke-black;
        }
    }
}

@utility input-outlined {
    @apply text-slate-500 border-slate-200;

    svg[class~=iconify]:not(.static-icon) path {
        @apply stroke-slate-500;
    }
}

@utility input-solid {
    @apply bg-slate-50 input-outlined;
}