/*!****************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./components/02-ecommerce/04-templates/cart/cart.scss ***!
  \****************************************************************************************************************************************************************************************/
/** ***************************************************************************
 * Ecommerce / Templates / Cart
 *************************************************************************** */
/** ***************************************************************************
 * Conchiglia SASS utilities
 *************************************************************************** */
/* Function for converting a px based font-size to rem. */
/** ***************************************************************************
 * Ecommerce / Templates / Cart
 *************************************************************************** */
/* This is useful to use variables in JS files */
:export {
  xs: 0;
  sm: 37.5rem;
  md: 48rem;
  lg: 64rem;
  xl: 80rem;
  xxl: 90rem;
  xxxl: 120rem;
}

body {
  --cn-c-cart--BackgroundColor: var(--cn-c-page--BackgroundColor);
  --cn-c-cart--Color: var(--cn-c-page--Color);
  --cn-c-cart--content--MaxWidth: 90rem;
}

main {
  flex: 1;
  display: grid;
  grid-template-columns: var(--cn-c-page--Grid-Template);
  grid-gap: 0 var(--cn-c-page--Grid-Gap);
  max-width: var(--cn-c-cart--content--MaxWidth);
  margin-inline: auto;
}
main > h1 {
  grid-column: 1/-1;
  padding-inline: var(--cn-global--content-grid--offsetsize);
  padding-block-start: 3.25rem;
  margin-block-end: 2.375rem;
}
@media screen and (min-width: 80rem) {
  main > h1 {
    padding-inline: unset;
    padding-block-start: 5rem;
    margin-block-end: 2.8125rem;
  }
}
@media screen and (min-width: 80rem) {
  main {
    padding-inline: var(--cn-global--content-grid--offsetsize);
    margin-block-end: 8.4375rem;
  }
}

.container {
  grid-column: 1/-1;
}

.no-elements-message {
  grid-column: 1/-1;
  padding-inline: var(--cn-global--content-grid--offsetsize);
  display: flex;
  flex-direction: column;
  height: 300px;
}
@media screen and (min-width: 80rem) {
  .no-elements-message {
    align-items: center;
    justify-content: center;
  }
}

/*# sourceMappingURL=cart.css.map*/
