"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.wrapperStyle = exports.widerLayoutClassName = exports.overflowWrapperStyles = exports.header = exports.contentWrapper = exports.content = void 0;
var _react = require("@emotion/react");
var _colors = require("@atlaskit/theme/colors");
var _styles = require("../styles");
var widerLayoutClassName = exports.widerLayoutClassName = 'wider-layout';
var wrapperStyle = exports.wrapperStyle = (0, _react.css)(_styles.wrapperDefault, {
  '&.without-frame': {
    background: 'transparent'
  },
  cursor: 'pointer',
  width: '100%',
  '.extension-overflow-wrapper:not(.with-body)': {
    overflowX: 'auto'
  },
  '&.with-border': {
    border: "1px solid transparent" // adding this so macro doesn't jump when hover border is shown
  },
  '&.with-hover-border': {
    border: "1px solid ".concat("var(--ds-border-bold, ".concat(_colors.N100, ")")),
    opacity: '86%'
  },
  '&.with-margin-styles': {
    margin: "0 ".concat("var(--ds-space-negative-150, -12px)"),
    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
    padding: '0 10px' // need exact number here to match editor elements' width
  }
});
var header = exports.header = (0, _react.css)({
  padding: "var(--ds-space-050, 4px)".concat(" ", "var(--ds-space-050, 4px)", " 0px"),
  verticalAlign: 'middle',
  '&.with-children:not(.without-frame)': {
    padding: "var(--ds-space-050, 4px)".concat(" ", "var(--ds-space-100, 8px)", " ", "var(--ds-space-100, 8px)")
  },
  '&.without-frame': {
    padding: 0
  }
});
var content = exports.content = (0, _react.css)({
  padding: "var(--ds-space-100, 8px)",
  background: "var(--ds-surface, white)",
  border: "1px solid ".concat("var(--ds-border, ".concat(_colors.N30, ")")),
  borderRadius: "var(--ds-border-radius, 3px)",
  cursor: 'initial',
  width: '100%',
  '&.remove-border': {
    border: 'none'
  }
});
var contentWrapper = exports.contentWrapper = (0, _react.css)({
  padding: "0 ".concat("var(--ds-space-100, 8px)", " ", "var(--ds-space-100, 8px)"),
  display: 'flex',
  justifyContent: 'center',
  '&.remove-padding': {
    padding: 0
  }
});
var overflowWrapperStyles = exports.overflowWrapperStyles = (0, _react.css)({
  '&.with-margin-styles': {
    // eslint-disable-next-line @atlaskit/design-system/use-tokens-space
    margin: "0 -10px" // need exact number here to match editor elements' width
  }
});