"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const Quantity_1 = require("presets/Quantity");
const CheckoutCartBundle_1 = require("abstractions/BundleProduct/CheckoutCartBundle");
const ProductItem_1 = require("abstractions/BundleProduct/CheckoutCartBundle/ProductItem");
const ProductPieces_1 = require("presets/ProductPieces");
const DetailedList_1 = require("molecules/DetailedList");
const Figure_1 = require("molecules/Figure");
const Incrementer_1 = require("inputs/Incrementer");
const TotalPrice = styled.span `
  font-weight: 600;
  font-size: rem(16);
  margin-bottom: rem(8);
`;
exports.TotalPrice = TotalPrice;
const SavePrice = styled.span `
  color: #64718c;
  font-size: rem(14);
`;
exports.SavePrice = SavePrice;
const StyledTotalPrice = styled.withComponent(ProductItem_1.TotalPriceBox) ``;
exports.StyledTotalPrice = StyledTotalPrice;
const StyledItemPrice = styled.withComponent(ProductPieces_1.ProductPrice) `
  display: flex;
  flex-direction: column;
  flex: 0 0 20%;
  align-items: flex-end;

  @phone-or-smaller() {
    padding-left: rem(120);
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    flex: 0 0 100%;
  }
  ${ProductPieces_1.SalePrice} {
    color: #EA2227;
    font-size: 16px;
    font-weight: 700;
    margin: 0;
    margin-bottom: rem(8);
    @phone-or-smaller() {
      margin-right: rem(16);
      margin-bottom: 0;
    }
  }
  ${ProductPieces_1.RegularPrice} {
    font-size: 16px;
    font-weight: 500;
    color: #2c2c2c;
  }
`;
exports.StyledItemPrice = StyledItemPrice;
const StyledQuantity = styled.withComponent(Quantity_1.Quantity) `
  display: flex;
  flex: 0 0 20%;
  justify-content: flex-end;
  align-items: baseline;

  ${Incrementer_1.IncrementerWrapper} {
    width: rem(110);
    height: rem(44);
    border: solid #A6AFC1 1px;
    border-radius: rem(2);
    align-items: center;
    padding: 0 rem(14);

    @media screen and (min-width: 768px) and (max-width: 1023px) {
      width: rem(80);
      border-radius: rem(4);
    }

    @phone-or-smaller() {
      margin-bottom: rem(8);
      border-radius: rem(4);
    }
  }
  ${Incrementer_1.StyledInput} {
    font-size: rem(16);
  }
  ${Incrementer_1.ArrowWrapper} {
    ${Incrementer_1.StyledButton}:first-child {
      margin-bottom: rem(2);
    }
  }
  @phone-or-smaller() {
    padding-left: rem(120);
    justify-content: flex-start;
    flex: 0 0 100%;
  }
`;
exports.StyledQuantity = StyledQuantity;
const StyledDetailedList = styled.withComponent(DetailedList_1.DetailedList) `
  h3 {
    display: none;
  }
  ${DetailedList_1.DetailedListItemPanel} {
    margin: 0;
  }
  @phone-or-smaller() {
    ${DetailedList_1.DetailedListItemPanel} {
      flex-direction: row;
    }
    ${DetailedList_1.DetailedListValue} {
      margin: 0;
      margin-left: 5px;
    }
  }
  ${DetailedList_1.DetailedListLabel}, ${DetailedList_1.DetailedListValue} {
    color: #5F6C88;
    text-transform: capitalize;

    @tablet-or-smaller() {
      font-size: rem(12);
    }
  }
  ${DetailedList_1.DetailedListValue} {
    margin-left: 5px;
  }
`;
exports.StyledDetailedList = StyledDetailedList;
const StyledProductName = styled.withComponent(ProductPieces_1.ProductName).attrs({
    'data-qa': 'qa-product-name',
}) `
  margin: 0;
  margin-bottom: rem(8);
  font-weight: 400;
  text-transform: capitalize;
  @tablet-or-smaller() {
    font-size: rem(12);
  }
`;
exports.StyledProductName = StyledProductName;
const StyledBrandName = styled.withComponent(ProductPieces_1.ProductName) `
  margin: 0;
  margin-bottom: rem(8);
  text-transform: capitalize;
  @tablet-or-smaller() {
    font-size: rem(14);
  }
`;
exports.StyledBrandName = StyledBrandName;
const StyledProductDetails = styled.div `
  margin-left: rem(30);
  @tablet-or-smaller() {
    margin-left: rem(8);
  }
`;
exports.StyledProductDetails = StyledProductDetails;
const StyledImageWithCaption = styled.withComponent(ProductPieces_1.ProductImageWithCaption) `
  width: 100%;
  height: 127px;
  flex: 0 0 158px;
  @tablet-or-smaller() {
    flex: 0 0 118px;
    height: 95px;
  }
  @phone-or-smaller() {
    flex: 0 0 112px;
    height: 90px;
  }
  ${Figure_1.StyledImage} {
    height: 100%;
  }
  ${Figure_1.FigureCaption} {
    bottom: 8px;
    &:first-letter {
      text-transform: capitalize;
    }
  }
`;
exports.StyledImageWithCaption = StyledImageWithCaption;
const StyledProduct = styled.withComponent(ProductItem_1.ProductBox) ``;
exports.StyledProduct = StyledProduct;
const ProductItemPlaceholder = styled.withComponent(CheckoutCartBundle_1.ProductItem) `
  @phone-or-smaller() {
    justify-content: flex-start;
  }
`;
exports.ProductItemPlaceholder = ProductItemPlaceholder;
exports.default = StyledProductDetails;
//# sourceMappingURL=styled.js.map