"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});

const styleh_components_1 = require("styleh-components");

const Link_1 = require("@skava/ui/dist/components/atoms/Link");

const Placeholder_1 = require("@skava/ui/dist/components/atoms/Placeholder");

const Text_1 = require("@skava/ui/dist/components/atoms/Text");

const Toggle_1 = require("@skava/ui/dist/components/molecules/Toggle");

const Figure_1 = require("@skava/ui/dist/components/molecules/Figure");

const DetailedList_1 = require("@skava/ui/dist/components/molecules/DetailedList");

const Ratings_1 = require("../../Ratings");

const TotalText = styleh_components_1.styled.span`font-weight:bold;margin-bottom:5px;`;
exports.TotalText = TotalText;
const SaveText = styleh_components_1.styled.span`font-size:0.875rem;`;
exports.SaveText = SaveText;
const TotalWrapper = styleh_components_1.styled.div`display:flex;flex-direction:column;${props => props.type === 'checkout' && styleh_components_1.styled.css`@media (min-width:768px){flex:0 0 20%;align-items:flex-end;}`};`;
exports.TotalWrapper = TotalWrapper;
const StyledQuantityValue = styleh_components_1.styled.span``;
exports.StyledQuantityValue = StyledQuantityValue;
const StyledText = styleh_components_1.styled.span`margin-right:0.25rem;${props => props.type === 'checkout' && styleh_components_1.styled.css`@media (min-width:768px){display:none;}`};`;
exports.StyledText = StyledText;
const IncrementerWrapper = styleh_components_1.styled.div`display:flex;${props => props.type === 'checkout' && styleh_components_1.styled.css`@media (min-width:768px){flex:0 0 20%;justify-content:flex-end;}max-height:2.75rem;`};`;
exports.IncrementerWrapper = IncrementerWrapper;
const StyledPromoText = styleh_components_1.styled.span`font-size:0.875rem;color:var(--color-dark-green);cursor:pointer;`;
exports.StyledPromoText = StyledPromoText;
const StyledPromoWrapper = styleh_components_1.styled.div`display:flex;flex-direction:column;`;
exports.StyledPromoWrapper = StyledPromoWrapper;
const StyledDetailedList = styleh_components_1.styled(DetailedList_1.DetailedList)`${DetailedList_1.DetailedListItemPanel}{margin:0.25rem 0;flex-direction:row;align-items:center;}${DetailedList_1.DetailedListValue}{margin:0 0 0 0.25rem;}`;
exports.StyledDetailedList = StyledDetailedList;
const StyledRatings = styleh_components_1.styled(Ratings_1.Ratings)`margin:0.25rem 0;`;
exports.StyledRatings = StyledRatings;
const StyledBrandName = styleh_components_1.styled(Text_1.Heading)`margin:0 0 0.5rem;${props => props.type === 'vertical' && styleh_components_1.styled.css`margin:0.5rem 0;`};`;
exports.StyledBrandName = StyledBrandName;
const StyledProductName = styleh_components_1.styled(Text_1.Heading)`margin:0 0 0.5rem;color:var(--color-black);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;`;
exports.StyledProductName = StyledProductName;
const ProductDetailWrapper = styleh_components_1.styled.div`display:flex;flex-direction:column;flex:1;`;
exports.ProductDetailWrapper = ProductDetailWrapper;
const PriceWrapper = styleh_components_1.styled.div`display:flex;margin:0 -0.25rem;${props => props.type === 'checkout' && styleh_components_1.styled.css`@media (min-width:768px){flex-direction:column;flex:0 0 20%;align-items:flex-end;}`};`;
exports.PriceWrapper = PriceWrapper;
const SalePrice = styleh_components_1.styled.span`padding:0.25rem;color:var(--color-red);`;
exports.SalePrice = SalePrice;
const RegularPrice = styleh_components_1.styled.span`padding:0.25rem;${props => props.isOnlyPrice === true ? styleh_components_1.styled.css`color:var(--color-red);` : styleh_components_1.styled.css`text-decoration:line-through;color:var(--color-black);`};`;
exports.RegularPrice = RegularPrice;
const StyledImagePlaceholder = styleh_components_1.styled(Placeholder_1.ImagePlaceholder)`${props => props.type === 'horizontal' && styleh_components_1.styled.css`width:15.625rem;height:15.625rem;margin-right:2rem;`};`;
exports.StyledImagePlaceholder = StyledImagePlaceholder;
const StyledToggleFavorite = styleh_components_1.styled(Toggle_1.Toggle)`width:1.5rem;height:1.5rem;position:absolute;right:0;z-index:1;margin:0.5rem;`;
exports.StyledToggleFavorite = StyledToggleFavorite;
const StyledProductImage = styleh_components_1.styled(Figure_1.Figure)`display:flex;position:relative;height:12.5rem;${props => (props.type === 'horizontal' || props.type === 'checkout') && styleh_components_1.styled.css`width:12.5rem;@media (max-width:767px){width:9.375rem;}`};${Figure_1.StyledImage}{width:100%;height:12.5rem;background-color:var(--color-light-grey);${props => (props.type === 'horizontal' || props.type === 'checkout') && styleh_components_1.styled.css`width:12.5rem;@media (max-width:767px){width:9.375rem;}`};}${Figure_1.FigureCaption}{position:absolute;bottom:1.5625rem;${props => (props.type === 'horizontal' || props.type === 'checkout') && styleh_components_1.styled.css`bottom:0.9375rem;`};background-color:var(--color-dark-green);padding:0.25rem;color:var(--color-pure-white);}`;
exports.StyledProductImage = StyledProductImage;
const StyledLink = styleh_components_1.styled(Link_1.Link)`text-decoration:none;`;
exports.StyledLink = StyledLink;
const ImageWrapper = styleh_components_1.styled.div`position:relative;${props => (props.type === 'horizontal' || props.type === 'checkout') && styleh_components_1.styled.css`margin-right:1rem;@media (max-width:767px){margin-right:0.5rem;}`};`;
exports.ImageWrapper = ImageWrapper;
const ProductWrapper = styleh_components_1.styled.div`display:flex;flex-direction:column;${props => (props.type === 'horizontal' || props.type === 'checkout') && styleh_components_1.styled.css`flex:1;@media (min-width:768px){flex-direction:row;}`};`;
exports.ProductWrapper = ProductWrapper;
const Wrapper = styleh_components_1.styled.section`display:flex;${props => props.type === 'vertical' && styleh_components_1.styled.css`width:18.75rem;flex-direction:column;`};`;
exports.Wrapper = Wrapper;