import { style } from '@vanilla-extract/css';
import { colors } from '#/styles/colors';
import { iconSize, space } from '#/styles/tokens.css';
export const outer = style({
padding: space.md,
paddingBottom: `calc(${space.md}px + env(safe-area-inset-bottom, 0px))`,
});
export const card = style({
display: 'flex',
flexDirection: 'column',
alignItems: 'center',
justifyContent: 'center',
padding: space.lg,
borderRadius: 40,
background: colors.contrast_50,
});
export const icon = style({
width: iconSize.xl,
height: iconSize.xl,
color: colors.text,
marginBottom: space.xs,
});
export const heading = style({
marginBottom: space.xs,
});
export const button = style({
width: '100%',
marginTop: space.lg,
});