import { makeStyles } from '@mui/styles';
export var useStyles = makeStyles({
    '@keyframes keyframes-wave': {
        '0%': {
            transform: 'translateX(-100%)'
        },
        '60%': {
            transform: 'translateX(100%)'
        },
        '100%': {
            transform: 'translateX(100%)'
        }
    },
    wave: {
        overflow: 'hidden',
        position: 'relative',
        '&:after': {
            top: '0',
            left: '0',
            right: '0',
            bottom: '0',
            content: '""',
            position: 'absolute',
            animation: '$keyframes-wave 1.6s linear 0.5s infinite',
            transform: 'translateX(-100%)',
            background: 'linear-gradient(90deg, transparent, rgba(0, 0, 0, 0.04), transparent);'
        }
    },
    avatar: {
        flex: 'none',
        width: '40px',
        height: '40px',
        borderRadius: '50%',
        backgroundColor: 'rgba(0, 0, 0, 0.11)'
    },
    info: {
        marginLeft: '12px',
        flex: 'auto'
    },
    label: {
        width: '40%',
        height: '15px',
        borderRadius: '2px',
        backgroundColor: 'rgba(0, 0, 0, 0.11)'
    },
    secondaryLabel: {
        marginTop: '4px',
        width: '100%',
        height: '12px',
        borderRadius: '2px',
        backgroundColor: 'rgba(0, 0, 0, 0.11)'
    },
    thirdRow: {
        marginTop: '4px',
        width: '60%',
        height: '24px',
        borderRadius: '2px',
        backgroundColor: 'rgba(0, 0, 0, 0.11)'
    }
});
