import { style } from '@vanilla-extract/css';
import { DefaultReset, toRem } from 'folds';

export const Image = style([
  DefaultReset,
  {
    display: 'block',
    width: '100%',
    height: '100%',
    maxWidth: '100%',
    maxHeight: '100%',
    objectFit: 'cover',
    borderRadius: 'inherit',
    imageRendering: 'auto',
    backfaceVisibility: 'hidden',
    transform: 'translateZ(0)',
  },
]);

export const Video = style([
  DefaultReset,
  {
    display: 'block',
    width: '100%',
    height: '100%',
    maxWidth: '100%',
    maxHeight: '100%',
    objectFit: 'cover',
  },
]);