import { jsx as _jsx } from "react/jsx-runtime";
import styled, { css } from 'styled-components';
import { defaultThemeProp } from '../../theme';
import Flex from '../Flex';
import { StyledPopover } from '../Popover';
import { StyledCard } from './Card';
export const StyledCardFooter = styled.footer(({ theme }) => {
    return css `
    ${StyledPopover} &, &:not(${StyledCard} ${StyledCard} > &) {
      padding: calc(1.5 * ${theme.base.spacing}) calc(${theme.components.card.padding} * 2);

      @media (width < ${theme.base.breakpoints.sm}) {
        padding: ${theme.base.spacing} calc(${theme.components.card.padding} * 1.5);
      }
    }
  `;
});
StyledCardFooter.defaultProps = defaultThemeProp;
const CardFooter = (props) => {
    const { children, justify, ...restProps } = props;
    return (_jsx(Flex, { as: StyledCardFooter, container: {
            wrap: 'wrap',
            alignItems: 'center',
            justify
        }, ...restProps, children: children }));
};
export default CardFooter;
//# sourceMappingURL=CardFooter.js.map