import { makeStyles } from '@mui/styles';
export var useStyles = makeStyles(function (theme) { return ({
    root: {},
    header: {
        display: 'flex',
        alignItems: 'center',
        height: '48px',
        paddingLeft: '16px',
        paddingRight: '8px'
    },
    headerInfo: {
        marginRight: 'auto',
        display: 'flex',
        alignItems: 'center'
    },
    title: {
        marginRight: '15px',
        color: theme.palette.text.primary,
        fontSize: '16px'
    },
    counter: {
        paddingLeft: '15px',
        borderLeft: '1px solid rgba(0,0,0,0.12)',
        color: theme.palette.text.secondary,
        fontSize: '14px',
        lineHeight: '24px'
    },
    resolveButton: {
        zIndex: 3000,
        '&:hover': {
            backgroundColor: 'transparent'
        }
    },
    popper: {
        width: '424px',
        borderRadius: '0 0 4px 4px'
    },
    collaborationItem: {
        padding: '0 0 10px 0'
    },
    comment: function (_a) {
        var hasScroll = _a.hasScroll;
        return ({
            marginLeft: '16px',
            marginRight: hasScroll ? '2px' : '8px'
        });
    },
    replies: function (_a) {
        var hasScroll = _a.hasScroll;
        return ({
            marginLeft: '8px',
            marginRight: hasScroll ? '2px' : '8px'
        });
    },
    sendMessageArea: function (_a) {
        var hasScroll = _a.hasScroll, scrollWidth = _a.scrollWidth;
        return ({
            marginLeft: '8px',
            marginRight: hasScroll ? scrollWidth + 2 : '8px'
        });
    },
    messages: {
        maxHeight: '400px',
        overflowY: 'auto'
    }
}); });
