import { jsxs, jsx } from 'react/jsx-runtime';
import { ThemeProvider } from '@wise/components-theming';
import PropTypes from 'prop-types';
import { s as styleInject } from './style-inject.es-1f59c1d0.js';

var css_248z = ".cc_tapestryWrapper_3805190947 {\n  position: relative;\n  z-index: 1;\n  margin: 0 auto;\n}\n.cc_tapestryWrapper_3805190947 > :first-child {\n  position: absolute;\n  z-index: -1;\n  bottom: -25px;\n  left: 0;\n  width: 100%;\n  height: 50%;\n  border-radius: var(--size-32);\n  background-color: var(--color-bright-orange);\n  background-repeat: no-repeat;\n  background-position: bottom;\n  background-size: 100%;\n}\n.cc_tapestryWrapper_3805190947 > :last-child {\n  background-color: var(--color-background-elevated);\n}\n@media (--screen-md) {\n  .cc_tapestryWrapper_3805190947 > :last-child {\n    padding: var(--padding-large);\n  }\n}\n@media (--screen-lg) {\n  .cc_tapestryWrapper_3805190947 > :last-child {\n    margin-top: -16px;\n  }\n}\n.cc_tapestryCardContent_3805190947 {\n  width: 100%;\n  margin: 0 auto;\n  overflow: hidden;\n  border-radius: 0 0 var(--size-40) var(--size-40);\n}\n.cc_bgTapestry_3805190947 {\n  background-image: url('https://wise.com/public-resources/assets/comparison/tapestry_3.png');\n}\n\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNyYy9jb21tb24vdGFwZXN0cnljYXJkL1RhcGVzdHJ5Q2FyZC5tb2R1bGUubGVzcyIsIlRhcGVzdHJ5Q2FyZC5tb2R1bGUubGVzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTtFQUNFLGtCQUFBO0VBQ0EsVUFBQTtFQUNBLGNBQUE7QUNDRjtBREVBO0VBQ0Usa0JBQUE7RUFDQSxXQUFBO0VBQ0EsYUFBQTtFQUNBLE9BQUE7RUFDQSxXQUFBO0VBQ0EsV0FBQTtFQUNBLDZCQUFBO0VBQ0EsNENBQUE7RUFDQSw0QkFBQTtFQUNBLDJCQUFBO0VBQ0EscUJBQUE7QUNBRjtBREdBO0VBQ0Usa0RBQUE7QUNERjtBREdFO0VBQUE7SUFDRSw2QkFBQTtFQ0FGO0FBQ0Y7QURFRTtFQUFBO0lBQ0UsaUJBQUE7RUNDRjtBQUNGO0FERUE7RUFDRSxXQUFBO0VBQ0EsY0FBQTtFQUNBLGdCQUFBO0VBQ0EsZ0RBQUE7QUNBRjtBREdBO0VBQ0UsMkZBQUE7QUNERiIsImZpbGUiOiJUYXBlc3RyeUNhcmQubW9kdWxlLmxlc3MifQ== */";
var componentStyles = {"tapestryWrapper":"cc_tapestryWrapper_3805190947","tapestryCardContent":"cc_tapestryCardContent_3805190947","bgTapestry":"cc_bgTapestry_3805190947"};
styleInject(css_248z);

const TapestryCard = ({ children, screenMode = 'light', }) => {
    const derivedStyles = Object.assign({}, componentStyles);
    return (jsxs("div", Object.assign({ className: derivedStyles.tapestryWrapper }, { children: [jsx("div", { className: derivedStyles.bgTapestry }), jsx(ThemeProvider, Object.assign({ theme: "personal", screenMode: screenMode, className: derivedStyles.tapestryCardContent }, { children: children }))] })));
};
TapestryCard.propTypes = {
    children: PropTypes.node.isRequired,
};

export { TapestryCard as T };
//# sourceMappingURL=TapestryCard-0917e400.js.map
