/*
Copyright (c) Uber Technologies, Inc.

This source code is licensed under the MIT license found in the
LICENSE file in the root directory of this source tree.
*/
import { styled } from '../styles/index';
export var StyledRoot = styled('div', function (_ref) {
  var $theme = _ref.$theme;
  return {
    boxSizing: 'border-box',
    display: 'flex',
    flexDirection: 'column',
    gap: $theme.sizing.scale300,
    width: '100%',
    paddingTop: $theme.sizing.scale600,
    paddingRight: $theme.sizing.scale600,
    paddingBottom: $theme.sizing.scale600,
    paddingLeft: $theme.sizing.scale600,
    backgroundColor: $theme.colors.backgroundPrimary,
    container: 'root / inline-size'
  };
});
StyledRoot.displayName = "StyledRoot";
StyledRoot.displayName = 'StyledRoot';
export var StyledActionContainer = styled('div', function (_ref2) {
  var $theme = _ref2.$theme;
  return {
    display: 'flex',
    flexDirection: 'column',
    gap: $theme.sizing.scale300,
    '@container root (min-width: 600px)': {
      flexDirection: 'row',
      justifyContent: 'space-between'
    }
  };
});
StyledActionContainer.displayName = "StyledActionContainer";
StyledActionContainer.displayName = 'StyledActionContainer';
export var StyledActionSubContainer = styled('div', function (_ref3) {
  var $reverseWhenWide = _ref3.$reverseWhenWide,
      $theme = _ref3.$theme;
  return {
    display: 'flex',
    flexDirection: 'column',
    gap: $theme.sizing.scale300,
    '@container root (min-width: 600px)': {
      flexDirection: $reverseWhenWide ? 'row-reverse' : 'row'
    }
  };
});
StyledActionSubContainer.displayName = "StyledActionSubContainer";
StyledActionSubContainer.displayName = 'StyledActionSubContainer';