import styled from '@emotion/styled';
import { rgba } from '~/lib/color';

const ModalWrapper = styled.div(({ theme }) => ({
	zIndex: 9999,
	position: 'absolute',
	top: 0,
	left: 0,
	height: '100%',
	width: '100%',
	background: rgba(theme.colors.black, 0.35),
	backdropFilter: 'blur(0.1em)',
	display: 'flex',
	alignItems: 'center',
	flexDirection: 'column',
	transition: theme.transition.delay,
}));

export default ModalWrapper;