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

import { vars, focusOutline } from '../css';

export const link = recipe({
  base: [
    focusOutline,
    {
      color: vars.components.link.colors.base,
      textDecoration: 'underline',
      cursor: 'pointer',
    },
  ],

  variants: {
    disabled: {
      true: {
        display: 'inline-block',
        pointerEvents: 'none',
        opacity: 0.5,
      },
    },
  },
});