{"version":3,"sources":["file:///Users/jakubfreisler/Projects/vuestorefront/sfui2/packages/sfui/frameworks/sass/components/VsfProductCard.scss","../../sass/components/VsfProductCard.scss"],"names":[],"mappings":"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","file":"VsfProductCard.css","sourcesContent":[".vsf-product-card {\n  $self: &;\n  @apply relative overflow-hidden border border-gray-200 rounded-md hover:shadow-lg;\n\n/* stylelint-disable at-rule-no-unknown */\n  @mixin vertical-base {\n    #{$self}__details {\n      @apply p-4;\n  \n      &-title {\n        @apply text-base;\n      }\n  \n      &-description {\n        @apply text-sm;\n      }\n  \n      &-prices-main {\n        @apply leading-7 text-lg;\n      }\n  \n      &-add-to-cart {\n        @apply mb-0;\n      }\n    }\n  }\n\n  @mixin vertical-sm {\n    #{$self}__details {\n      @apply p-2;\n  \n      &-title {\n        @apply text-sm;\n      }\n  \n      &-description {\n        @apply text-xs;\n      }\n  \n      &-prices-main {\n        @apply leading-5 text-sm;\n      }\n  \n      &-add-to-cart {\n        @apply mb-2;\n      }\n    }\n  }\n\n  @mixin horizontal-base {\n    @apply max-w-[640px];\n\n    #{$self}__details {\n      &-in-cart {\n        @apply absolute top-4 right-4;\n\n        ~ a .vsf-product-card__details-title {\n          @apply mr-28;\n        }\n      }\n\n      &-title {\n        @apply text-lg;\n      }\n\n      &-description {\n        @apply text-sm;\n      }\n\n      &-wrapper {\n        @apply flex-row mt-[12%] items-center;\n      }\n\n      &-prices-main {\n        @apply leading-7 text-lg;\n      }\n\n      &-add-to-cart {\n        @apply ml-auto mr-0 mt-0;\n      }\n    }\n  }\n\n  @mixin horizontal-sm {\n    @apply max-w-[376px];\n\n    #{$self}__details {\n      @apply flex-col;\n  \n      &-in-cart {\n        @apply relative mb-2;\n      }\n  \n      &-title {\n        @apply text-sm;\n      }\n  \n      &-description {\n        @apply text-xs;\n      }\n  \n      &-prices-main {\n        @apply leading-5 text-sm;\n      }\n  \n      &-wrapper {\n        @apply flex-col mt-2;\n      }\n  \n      &-add-to-cart {\n        @apply mr-auto;\n      }\n    }\n  }\n\n  &__image {\n    @apply h-auto object-cover aspect-square;\n\n    &-top {\n      @apply absolute -top-px -left-px;\n    }\n\n    &-bottom {\n      @apply absolute bottom-0 left-0 right-0 flex items-end m-2 pointer-events-none;\n\n      #{$self}__image-bottom-button {\n        @apply ml-auto rounded-full pointer-events-auto;\n      }\n    }    \n\n    &--out-of-stock {\n      @apply opacity-50;\n    }\n  }\n\n  &__details {\n    @apply border-gray-200 border-t flex flex-col;\n\n    &-title {\n      @apply block font-normal font-body hover:text-primary-600 hover:underline active:text-primary-700 active:underline;\n    }\n\n    &-rating {\n      @apply flex pt-1;\n\n      #{$self}__details-rating-counter {\n        @apply ml-1 cursor-pointer;\n      }\n      #{$self}__details-rating-button {\n        @apply hover:shadow-transparent hover:bg-transparent active:bg-transparent;\n      }\n    }\n\n    &-description {\n      @apply block pt-2 font-normal leading-5 text-gray-700 font-body;\n    }\n\n    &-prices {\n      @apply flex items-baseline py-2;\n\n      &-main {\n        @apply font-bold text-gray-900 font-headings;\n\n        &--old-price {\n          @apply text-secondary-700;\n        }\n      }\n\n      &--old-price {\n        @apply ml-2 text-xs font-normal leading-4 text-gray-500 line-through;\n      }\n    }\n    \n    &-add-to-cart {\n      @apply border rounded-md cursor-pointer font-body uppercase disabled:cursor-not-allowed outline-violet disabled:text-gray-500 disabled:opacity-50 leading-5 text-sm bg-primary-500 text-white hover:shadow-medium hover:bg-primary-800 active:bg-primary-900;\n      \n      &--out-of-stock {\n        @apply bg-transparent group-hover:ring-primary-300 group-hover:bg-primary-100 group-active:ring-primary-400 group-active:bg-primary-200 group-active:text-primary-700 hover:shadow-medium;\n      }\n    }\n  }  \n\n  &--sm {\n    @apply max-w-[192px];\n\n    @include vertical-sm;\n  }\n\n  &--base {\n    @apply max-w-[320px];\n\n    @include vertical-base;\n  }\n\n  &--responsive {\n    @apply max-w-[192px];\n\n    @include vertical-sm;\n\n    @media (min-width: 769px) {\n      @apply max-w-[320px];\n\n      @include vertical-base;\n    }\n  }\n\n  &--horizontal {\n    @apply flex items-start;\n\n    #{$self}__image {\n      @apply max-w-none;\n    }\n\n    #{$self}__details {\n      @apply flex flex-grow p-4 border-none;      \n\n      &-rating {\n        @apply pt-2;\n      }\n\n      &-wrapper {\n        @apply flex justify-between;\n      }      \n\n      &-prices {\n        @apply py-0;\n      }\n\n      &-add-to-cart {\n        @apply m-0 mt-2;        \n      }\n    }    \n\n    &-base {\n      @include horizontal-base;      \n    }\n\n    &-sm {\n      @include horizontal-sm;\n    }\n\n    &-responsive {\n      @apply max-w-[376px];\n\n      #{$self}__image {\n        @apply w-[128px] h-[128px];\n      }\n\n      @include horizontal-sm;\n\n      @media (min-width: 641px) {\n        #{$self}__image {\n          @apply w-[192px] h-[192px];\n        }\n\n        @include horizontal-base;        \n      }\n    }\n  }\n}\n",".vsf-product-card {\n  @apply relative overflow-hidden border border-gray-200 rounded-md hover:shadow-lg;\n  /* stylelint-disable at-rule-no-unknown */\n}\n.vsf-product-card__image {\n  @apply h-auto object-cover aspect-square;\n}\n.vsf-product-card__image-top {\n  @apply absolute -top-px -left-px;\n}\n.vsf-product-card__image-bottom {\n  @apply absolute bottom-0 left-0 right-0 flex items-end m-2 pointer-events-none;\n}\n.vsf-product-card__image-bottom .vsf-product-card__image-bottom-button {\n  @apply ml-auto rounded-full pointer-events-auto;\n}\n.vsf-product-card__image--out-of-stock {\n  @apply opacity-50;\n}\n.vsf-product-card__details {\n  @apply border-gray-200 border-t flex flex-col;\n}\n.vsf-product-card__details-title {\n  @apply block font-normal font-body hover:text-primary-600 hover:underline active:text-primary-700 active:underline;\n}\n.vsf-product-card__details-rating {\n  @apply flex pt-1;\n}\n.vsf-product-card__details-rating .vsf-product-card__details-rating-counter {\n  @apply ml-1 cursor-pointer;\n}\n.vsf-product-card__details-rating .vsf-product-card__details-rating-button {\n  @apply hover:shadow-transparent hover:bg-transparent active:bg-transparent;\n}\n.vsf-product-card__details-description {\n  @apply block pt-2 font-normal leading-5 text-gray-700 font-body;\n}\n.vsf-product-card__details-prices {\n  @apply flex items-baseline py-2;\n}\n.vsf-product-card__details-prices-main {\n  @apply font-bold text-gray-900 font-headings;\n}\n.vsf-product-card__details-prices-main--old-price {\n  @apply text-secondary-700;\n}\n.vsf-product-card__details-prices--old-price {\n  @apply ml-2 text-xs font-normal leading-4 text-gray-500 line-through;\n}\n.vsf-product-card__details-add-to-cart {\n  @apply border rounded-md cursor-pointer font-body uppercase disabled:cursor-not-allowed outline-violet disabled:text-gray-500 disabled:opacity-50 leading-5 text-sm bg-primary-500 text-white hover:shadow-medium hover:bg-primary-800 active:bg-primary-900;\n}\n.vsf-product-card__details-add-to-cart--out-of-stock {\n  @apply bg-transparent group-hover:ring-primary-300 group-hover:bg-primary-100 group-active:ring-primary-400 group-active:bg-primary-200 group-active:text-primary-700 hover:shadow-medium;\n}\n.vsf-product-card--sm {\n  @apply max-w-[192px];\n}\n.vsf-product-card--sm .vsf-product-card__details {\n  @apply p-2;\n}\n.vsf-product-card--sm .vsf-product-card__details-title {\n  @apply text-sm;\n}\n.vsf-product-card--sm .vsf-product-card__details-description {\n  @apply text-xs;\n}\n.vsf-product-card--sm .vsf-product-card__details-prices-main {\n  @apply leading-5 text-sm;\n}\n.vsf-product-card--sm .vsf-product-card__details-add-to-cart {\n  @apply mb-2;\n}\n.vsf-product-card--base {\n  @apply max-w-[320px];\n}\n.vsf-product-card--base .vsf-product-card__details {\n  @apply p-4;\n}\n.vsf-product-card--base .vsf-product-card__details-title {\n  @apply text-base;\n}\n.vsf-product-card--base .vsf-product-card__details-description {\n  @apply text-sm;\n}\n.vsf-product-card--base .vsf-product-card__details-prices-main {\n  @apply leading-7 text-lg;\n}\n.vsf-product-card--base .vsf-product-card__details-add-to-cart {\n  @apply mb-0;\n}\n.vsf-product-card--responsive {\n  @apply max-w-[192px];\n}\n.vsf-product-card--responsive .vsf-product-card__details {\n  @apply p-2;\n}\n.vsf-product-card--responsive .vsf-product-card__details-title {\n  @apply text-sm;\n}\n.vsf-product-card--responsive .vsf-product-card__details-description {\n  @apply text-xs;\n}\n.vsf-product-card--responsive .vsf-product-card__details-prices-main {\n  @apply leading-5 text-sm;\n}\n.vsf-product-card--responsive .vsf-product-card__details-add-to-cart {\n  @apply mb-2;\n}\n@media (min-width: 769px) {\n  .vsf-product-card--responsive {\n    @apply max-w-[320px];\n  }\n  .vsf-product-card--responsive .vsf-product-card__details {\n    @apply p-4;\n  }\n  .vsf-product-card--responsive .vsf-product-card__details-title {\n    @apply text-base;\n  }\n  .vsf-product-card--responsive .vsf-product-card__details-description {\n    @apply text-sm;\n  }\n  .vsf-product-card--responsive .vsf-product-card__details-prices-main {\n    @apply leading-7 text-lg;\n  }\n  .vsf-product-card--responsive .vsf-product-card__details-add-to-cart {\n    @apply mb-0;\n  }\n}\n.vsf-product-card--horizontal {\n  @apply flex items-start;\n}\n.vsf-product-card--horizontal .vsf-product-card__image {\n  @apply max-w-none;\n}\n.vsf-product-card--horizontal .vsf-product-card__details {\n  @apply flex flex-grow p-4 border-none;\n}\n.vsf-product-card--horizontal .vsf-product-card__details-rating {\n  @apply pt-2;\n}\n.vsf-product-card--horizontal .vsf-product-card__details-wrapper {\n  @apply flex justify-between;\n}\n.vsf-product-card--horizontal .vsf-product-card__details-prices {\n  @apply py-0;\n}\n.vsf-product-card--horizontal .vsf-product-card__details-add-to-cart {\n  @apply m-0 mt-2;\n}\n.vsf-product-card--horizontal-base {\n  @apply max-w-[640px];\n}\n.vsf-product-card--horizontal-base .vsf-product-card__details-in-cart {\n  @apply absolute top-4 right-4;\n}\n.vsf-product-card--horizontal-base .vsf-product-card__details-in-cart ~ a .vsf-product-card__details-title {\n  @apply mr-28;\n}\n.vsf-product-card--horizontal-base .vsf-product-card__details-title {\n  @apply text-lg;\n}\n.vsf-product-card--horizontal-base .vsf-product-card__details-description {\n  @apply text-sm;\n}\n.vsf-product-card--horizontal-base .vsf-product-card__details-wrapper {\n  @apply flex-row mt-[12%] items-center;\n}\n.vsf-product-card--horizontal-base .vsf-product-card__details-prices-main {\n  @apply leading-7 text-lg;\n}\n.vsf-product-card--horizontal-base .vsf-product-card__details-add-to-cart {\n  @apply ml-auto mr-0 mt-0;\n}\n.vsf-product-card--horizontal-sm {\n  @apply max-w-[376px];\n}\n.vsf-product-card--horizontal-sm .vsf-product-card__details {\n  @apply flex-col;\n}\n.vsf-product-card--horizontal-sm .vsf-product-card__details-in-cart {\n  @apply relative mb-2;\n}\n.vsf-product-card--horizontal-sm .vsf-product-card__details-title {\n  @apply text-sm;\n}\n.vsf-product-card--horizontal-sm .vsf-product-card__details-description {\n  @apply text-xs;\n}\n.vsf-product-card--horizontal-sm .vsf-product-card__details-prices-main {\n  @apply leading-5 text-sm;\n}\n.vsf-product-card--horizontal-sm .vsf-product-card__details-wrapper {\n  @apply flex-col mt-2;\n}\n.vsf-product-card--horizontal-sm .vsf-product-card__details-add-to-cart {\n  @apply mr-auto;\n}\n.vsf-product-card--horizontal-responsive {\n  @apply max-w-[376px];\n  @apply max-w-[376px];\n}\n.vsf-product-card--horizontal-responsive .vsf-product-card__image {\n  @apply w-[128px] h-[128px];\n}\n.vsf-product-card--horizontal-responsive .vsf-product-card__details {\n  @apply flex-col;\n}\n.vsf-product-card--horizontal-responsive .vsf-product-card__details-in-cart {\n  @apply relative mb-2;\n}\n.vsf-product-card--horizontal-responsive .vsf-product-card__details-title {\n  @apply text-sm;\n}\n.vsf-product-card--horizontal-responsive .vsf-product-card__details-description {\n  @apply text-xs;\n}\n.vsf-product-card--horizontal-responsive .vsf-product-card__details-prices-main {\n  @apply leading-5 text-sm;\n}\n.vsf-product-card--horizontal-responsive .vsf-product-card__details-wrapper {\n  @apply flex-col mt-2;\n}\n.vsf-product-card--horizontal-responsive .vsf-product-card__details-add-to-cart {\n  @apply mr-auto;\n}\n@media (min-width: 641px) {\n  .vsf-product-card--horizontal-responsive {\n    @apply max-w-[640px];\n  }\n  .vsf-product-card--horizontal-responsive .vsf-product-card__image {\n    @apply w-[192px] h-[192px];\n  }\n  .vsf-product-card--horizontal-responsive .vsf-product-card__details-in-cart {\n    @apply absolute top-4 right-4;\n  }\n  .vsf-product-card--horizontal-responsive .vsf-product-card__details-in-cart ~ a .vsf-product-card__details-title {\n    @apply mr-28;\n  }\n  .vsf-product-card--horizontal-responsive .vsf-product-card__details-title {\n    @apply text-lg;\n  }\n  .vsf-product-card--horizontal-responsive .vsf-product-card__details-description {\n    @apply text-sm;\n  }\n  .vsf-product-card--horizontal-responsive .vsf-product-card__details-wrapper {\n    @apply flex-row mt-[12%] items-center;\n  }\n  .vsf-product-card--horizontal-responsive .vsf-product-card__details-prices-main {\n    @apply leading-7 text-lg;\n  }\n  .vsf-product-card--horizontal-responsive .vsf-product-card__details-add-to-cart {\n    @apply ml-auto mr-0 mt-0;\n  }\n}"]}