"use strict";

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

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

const Heading_1 = require("../../../atoms/Text/Heading");

const DetailedList_1 = require("../../../molecules/DetailedList");

const Button_1 = require("../../../atoms/Button");

const words_1 = require("../../../../words");

const StyledDetailedList = styleh_components_1.styled.withComponent(DetailedList_1.DetailedList)`
  display: flex;
  margin: 0;
  justify-content: center;
  flex-direction: column;
  flex: 1;

  ${Heading_1.H3} {
    display: none;
  }

  ${DetailedList_1.DetailedListItemPanel} {
    align-items: center;
    margin: 0;
    margin-bottom: rem(4);
    height: 24px;

    &.status-value {
      ${DetailedList_1.DetailedListValue} {
        color: #008A00;
      }
    }

    @media(max-width: 1023px) {
      height: 16px;
    }

    @media (max-width: 767px) {
      height: 20px;
    }

    ${DetailedList_1.DetailedListLabel} {
      white-space: nowrap;
      ${props => props.isSubscriptionItem && styleh_components_1.styled.css`
        font-weight: 400;
        font-size: 16px;
      `}
    }

    ${DetailedList_1.DetailedListValue} {
      text-overflow: ellipsis;
      overflow: hidden;
      width: 100%;
      white-space: nowrap;
      ${props => props.isSubscriptionItem && styleh_components_1.styled.css`
        font-size: 16px;
      `}
    }
  }

  @media (max-width: 767px) {
    ${DetailedList_1.DetailedListItemPanel} {
      flex: 0 0 100%;
      flex-direction: row;
    }
  }

  .successShipment {
    ${DetailedList_1.DetailedListValue} {
      color: #009944;
      }
  }
  ${DetailedList_1.DetailedListValue} {
    margin: 0 0 0 5px;
    white-space: nowrap;
  }
  ${DetailedList_1.DetailedListLabel}, ${DetailedList_1.DetailedListValue} {
    position: relative;
    font-weight: 700;
    text-transform: capitalize;
    color: #2c2c2c;
    font-size: 20px;

    @media (max-width: 1023px) {
      font-size: 14px;
      line-height: 20px;
    }
  }
  ${DetailedList_1.DetailedListItemPanel}:nth-child(2){
    ${DetailedList_1.DetailedListValue}:nth-child(2) {
      text-transform: none;
    }
  }
`;
exports.StyledDetailedList = StyledDetailedList;
const StyledButton = styleh_components_1.styled.withComponent(Button_1.Button)`
  border: none;
  background: transparent;
  padding: 0;
  align-self: flex-start;
  font-size: 16px;

  &:before {
    content: '${words_1.wording.orderExpansionLabelDesktop}';
    ${props => props.isSubscriptionItem && styleh_components_1.styled.css`
    content: '${words_1.wording.expansionLabelDesktop}';
    `}
  }

  @phone-or-smaller() {
    font-size: 16px;
    &:before {
        content: '${words_1.wording.orderExpansionLabelMobile}';
        ${props => props.isSubscriptionItem && styleh_components_1.styled.css`
          content: '${words_1.wording.expansionLabelMobile}';
        `}
      }
    }
  ${Button_1.ButtonIcon} {
    margin: 0;
  }

  ${Button_1.ButtonLabel} {
    text-transform: capitalize;
    font-size: 18px;
    font-weight: 700;
    color: #2c2c2c;
    margin: 0;
    margin-right: 8px;

    @media (max-width: 1023px) {
      font-size: 14px;
      margin-right: rem(4);
    }

    ${props => props.isSubscriptionItem && styleh_components_1.styled.css`
        font-weight: 400;
    `}
  }
`;
exports.StyledButton = StyledButton; //# sourceMappingURL=styled.js.map