"use strict";

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

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

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

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

const Image_1 = require("@skava/ui/dist/components/atoms/Image");

const SalePrice = styleh_components_1.styled(Text_1.H4)`font-weight:600;font-size:1.125rem;margin:0;margin-right:0.5rem;color:var(--color-red);`;
exports.SalePrice = SalePrice;
const RegularPrice = styleh_components_1.styled(Text_1.H5)`text-decoration:line-through;font-size:1rem;font-weight:normal;margin:0;`;
exports.RegularPrice = RegularPrice;
const StyledProductPrice = styleh_components_1.styled.div`display:flex;align-items:center;`;
exports.StyledProductPrice = StyledProductPrice;
const Favorite = styleh_components_1.styled.div`display:flex;position:absolute;z-index:1;right:0;top:0;padding:0.625rem;`;
exports.Favorite = Favorite;
const StyledProductImage = styleh_components_1.styled(Image_1.Image)`display:flex;justify-content:center;align-items:center;`;
exports.StyledProductImage = StyledProductImage;
const StyledLink = styleh_components_1.styled(Link_1.Link)`text-decoration:none;color:var(--color-dark-grey);`;
exports.StyledLink = StyledLink;
const StyledProductDescription = styleh_components_1.styled.p`margin:0 0 1rem 0;`;
exports.StyledProductDescription = StyledProductDescription;
const StyledProductBrandName = styleh_components_1.styled(Text_1.H2)`margin:0 0 0.25rem 0;font-size:1.125rem;`;
exports.StyledProductBrandName = StyledProductBrandName;
const StyledProductName = styleh_components_1.styled(Text_1.H4)`margin:0 0 1rem 0;font-size:1rem;font-weight:normal;`;
exports.StyledProductName = StyledProductName;
const DetailsContainer = styleh_components_1.styled.div`opacity:0;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);transform-origin:center;width:0%;padding:1rem;background:#fff;transition:0.4s all ease-in-out;`;
exports.DetailsContainer = DetailsContainer;
const StyledWrapper = styleh_components_1.styled.div`position:relative;&:hover{${DetailsContainer}{opacity:1;width:50%;transition:0.4s;}}`;
exports.StyledWrapper = StyledWrapper;