import { style } from '@vanilla-extract/css';
import { recipe } from '@vanilla-extract/recipes';

export const labelDisabled = style({
  opacity: 0.5,
});

export const input = recipe({
  base: {
    '::placeholder': {
      opacity: 0,
      transition: 'opacity 0.2s cubic-bezier(0, 0, 0.2, 1)',
    },
  },

  variants: {
    placeholderVisible: {
      true: {
        '::placeholder': {
          opacity: 1,
        },
      },
    },
  },
});