import { makeStyles } from '@mui/styles';
var pointColor = '#d8d8d8';
var lineStyle = '2px solid rgba(0,0,0,0.06)';
var pointSize = 6;
var blockWidth = 56;
var linePadding = 10;
var pointPadding = 15;
export var useStyles = makeStyles({
    decorator: {
        display: 'flex',
        alignItems: 'stretch'
    },
    lineBlock: {
        width: "".concat(blockWidth, "px"),
        flexShrink: 0
    },
    withLinePadding: {
        '& $noLine': {
            height: "".concat(linePadding, "px")
        },
        '& $line': {
            height: "calc(100% - ".concat(linePadding, "px)")
        }
    },
    noLine: {
        height: '0'
    },
    line: {
        height: '100%',
        position: 'relative',
        marginLeft: '31px',
        borderLeft: lineStyle,
        '&:before': {
            position: 'absolute',
            height: pointSize,
            width: pointSize,
            borderRadius: '50%',
            left: -pointSize + 1,
            top: "".concat(pointPadding, "px"),
            background: pointColor,
            content: '""',
            display: 'block',
            border: '1px solid white'
        },
        '&$plain': {
            '&:before': {
                width: 0,
                border: 'none'
            }
        },
        '&$last': {
            height: "".concat(pointPadding, "px")
        }
    },
    content: {
        flex: 1,
        minWidth: 0
    },
    plain: {},
    last: {},
    rowDivider: {
        marginLeft: 0
    }
});
