'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var styled = require('styled-components');
var index = require('../../../utils/index.js');
var utils = require('./utils.js');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);

const ToastWrapper = styled__default['default'].div `
  display: flex;
  font-family: ${(props) => props.theme.font.familyPrimary};
  flex-direction: column;
  margin-bottom: ${index.getSpacing('s01')};
  padding: ${index.getSpacing('s04')};
  border-radius: ${index.getSpacing('s02')};
  background-color: ${index.getColorAlias('containerInverse')};
  position: relative;
  overflow: hidden;
  min-width: 300px;
  max-width: 100%;
  pointer-events: auto;
  ${index.getFontSize('size14')};

  &::before {
    content: '';
    height: 100%;
    width: ${index.getSpacing('s01')};
    background-color: ${({ variant }) => variant && utils.getBorderColor(variant)};
    position: absolute;
    top: 0;
    left: 0;
  }

  svg {
    margin-right: ${index.getSpacing('s04')};
    height: calc(${index.getSpacing('s05')} - ${index.getSpacing('s01')});
    width: calc(${index.getSpacing('s05')} - ${index.getSpacing('s01')});
    fill: ${({ variant }) => variant ? utils.getIconFill(variant) : index.getColorAlias('containerDefault')};
  }
`;
const CompactWrapper = styled__default['default'].div `
  display: flex;
  align-items: center;
`;
const MessageWrapper = styled__default['default'].span `
  ${index.getFontSize('size14')};
  color: ${index.getColorAlias('contentInverse')};
`;
const ActionWrapper = styled__default['default'].div `
  display: flex;
  margin-top: ${index.getSpacing('s01')};
  justify-content: flex-end;
`;
const CompactActionWrapper = styled__default['default'].div `
  margin-left: auto;

  button {
    margin-left: ${index.getSpacing('s04')};
  }
`;
const ToastCompactWrapper = styled__default['default'](ToastWrapper) `
  padding: calc(${index.getSpacing('s04')} - 2px) ${index.getSpacing('s04')};
`;

exports.ActionWrapper = ActionWrapper;
exports.CompactActionWrapper = CompactActionWrapper;
exports.CompactWrapper = CompactWrapper;
exports.MessageWrapper = MessageWrapper;
exports.ToastCompactWrapper = ToastCompactWrapper;
exports.ToastWrapper = ToastWrapper;
