import { createGlobalStyle, css } from 'styled-components';
const alertStyle = css `
  .ant-alert {
    background-color: ${({ theme }) => theme.select.dropdown};
    border: none;
    color: ${({ theme }) => theme.text.primary};
    border-top: 2px solid;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.2);

    .ant-alert-message {
      color: ${({ theme }) => theme.text.primary};
    }

    .ant-alert-close-icon .anticon.anticon-close {
      color: ${({ theme }) => theme.text.secondary};
    }

    &.ant-alert-info {
      border-color: ${({ theme }) => theme.main};
    }

    &.ant-alert-warning {
      border-color: ${({ theme }) => theme.warning};
    }

    &.ant-alert-error {
      border-color: ${({ theme }) => theme.danger};
    }

    &.ant-alert-success {
      border-color: ${({ theme }) => theme.success};
    }
  }
`;
const AlertStyle = createGlobalStyle `${alertStyle}`;
export default AlertStyle;
