// Copyright (c) Microsoft Corporation.
// Licensed under the MIT License.
/**
 * @private
 */
export const controlBarStyles = {
    horizontal: {
        flexFlow: 'row nowrap'
    },
    vertical: {
        flexFlow: 'column nowrap',
        width: 'fit-content',
        maxWidth: '8rem'
    },
    dockedTop: {
        flexFlow: 'row nowrap',
        justifyContent: 'center',
        overflow: 'hidden',
        position: 'absolute',
        top: 0,
        left: 0,
        width: '100%',
        minWidth: 'fit-content'
    },
    dockedBottom: {
        flexFlow: 'row nowrap',
        justifyContent: 'center',
        overflow: 'hidden',
        position: 'absolute',
        bottom: 0,
        left: 0,
        width: '100%',
        minWidth: 'fit-content'
    },
    dockedLeft: {
        justifyContent: 'center',
        overflow: 'hidden',
        position: 'absolute',
        top: 0,
        left: 0,
        height: '100%'
    },
    dockedRight: {
        justifyContent: 'center',
        overflow: 'hidden',
        position: 'absolute',
        top: 0,
        right: 0,
        height: '100%'
    },
    floatingTop: {
        flexFlow: 'row nowrap',
        justifyContent: 'center',
        overflow: 'hidden',
        position: 'absolute',
        top: '1rem',
        left: '50%',
        transform: 'translateX(-50%)',
        minWidth: 'fit-content',
        zIndex: 10
    },
    floatingBottom: {
        flexFlow: 'row nowrap',
        justifyContent: 'center',
        overflow: 'hidden',
        position: 'absolute',
        bottom: '1rem',
        left: '50%',
        transform: 'translateX(-50%)',
        minWidth: 'fit-content',
        zIndex: 10
    },
    floatingLeft: {
        flexFlow: 'column nowrap',
        justifyContent: 'center',
        overflow: 'hidden',
        position: 'absolute',
        top: '50%',
        left: '1rem',
        transform: 'translateY(-50%)',
        zIndex: 10
    },
    floatingRight: {
        flexFlow: 'column nowrap',
        justifyContent: 'center',
        overflow: 'hidden',
        position: 'absolute',
        top: '50%',
        right: '1rem',
        transform: 'translateY(-50%)',
        zIndex: 10
    }
};
/**
 * @private
 */
export const controlButtonStyles = {
    root: {
        background: 'none',
        border: 'none',
        borderRadius: 0,
        minHeight: '3.5rem',
        minWidth: '3.5rem',
        width: '100%',
        maxWidth: '8rem',
        svg: {
            verticalAlign: 'text-top'
        }
    },
    splitButtonMenuButton: {
        border: 'none'
    },
    flexContainer: {
        display: 'unset'
    },
    label: {
        fontSize: '0.625rem',
        fontWeight: '400',
        lineHeight: '1rem',
        cursor: 'pointer',
        display: 'block',
        margin: '0rem 0.25rem',
        overflow: 'hidden',
        textOverflow: 'ellipsis',
        whiteSpace: 'nowrap'
    }
};
/**
 * making it Partial as IContextualMenuStyles has all its props non-optional and we only need title to be defined here.
 *
 * @private
 */
export const participantsButtonMenuPropsStyle = {
    title: {
        background: 'initial',
        paddingLeft: '.5rem',
        fontWeight: 600,
        fontSize: '.75rem'
    }
};
/**
 * Default styles for button flyout items
 *
 * @private
 */
export const buttonFlyoutItemStyles = {
    icon: {
        lineHeight: 0
    },
    checkmarkIcon: {
        lineHeight: 0
    }
};
//# sourceMappingURL=ControlBar.styles.js.map