/**
 * Purple Lion - index/new-products card title wrapping fix
 *
 * Fixes long product names in homepage center boxes:
 * - New Products
 * - Featured Products
 * - Specials
 * - Also Purchased
 *
 * Especially useful for long SWS/Lenovo names containing slash-separated specs.
 */

#indexDefault .centerBoxWrapper,
#indexDefault .centerBoxContentsNew,
#indexDefault .centerBoxContentsFeatured,
#indexDefault .centerBoxContentsSpecials,
#indexDefault .centerBoxContentsAlsoPurch,
#indexDefault .centerBoxContentsProducts,
#indexDefault .specialsListBoxContents,
#indexBody .centerBoxWrapper,
#indexBody .centerBoxContentsNew,
#indexBody .centerBoxContentsFeatured,
#indexBody .centerBoxContentsSpecials,
#indexBody .centerBoxContentsAlsoPurch,
#indexBody .centerBoxContentsProducts,
#indexBody .specialsListBoxContents {
  box-sizing: border-box;
  max-width: 100%;
  overflow: hidden;
}

/* Product links in homepage boxes are often plain inline <a>, not .itemTitle */
#indexDefault .centerBoxContentsNew a,
#indexDefault .centerBoxContentsFeatured a,
#indexDefault .centerBoxContentsSpecials a,
#indexDefault .centerBoxContentsAlsoPurch a,
#indexDefault .centerBoxContentsProducts a,
#indexDefault .specialsListBoxContents a,
#indexBody .centerBoxContentsNew a,
#indexBody .centerBoxContentsFeatured a,
#indexBody .centerBoxContentsSpecials a,
#indexBody .centerBoxContentsAlsoPurch a,
#indexBody .centerBoxContentsProducts a,
#indexBody .specialsListBoxContents a {
  display: inline-block;
  max-width: 100%;
  white-space: normal !important;
  overflow-wrap: anywhere;
  word-wrap: break-word;
  word-break: break-word;
  hyphens: auto;
  line-height: 1.28;
}

/* Make product names look calmer and keep them inside the card */
#indexDefault .centerBoxContentsNew > a,
#indexDefault .centerBoxContentsFeatured > a,
#indexDefault .centerBoxContentsSpecials > a,
#indexDefault .centerBoxContentsAlsoPurch > a,
#indexDefault .centerBoxContentsProducts > a,
#indexDefault .specialsListBoxContents > a,
#indexBody .centerBoxContentsNew > a,
#indexBody .centerBoxContentsFeatured > a,
#indexBody .centerBoxContentsSpecials > a,
#indexBody .centerBoxContentsAlsoPurch > a,
#indexBody .centerBoxContentsProducts > a,
#indexBody .specialsListBoxContents > a {
  box-sizing: border-box;
  width: 100%;
  padding-left: 12px;
  padding-right: 12px;
}

/* Center-box product images should never force a wider card */
#indexDefault .centerBoxContentsNew img,
#indexDefault .centerBoxContentsFeatured img,
#indexDefault .centerBoxContentsSpecials img,
#indexDefault .centerBoxContentsAlsoPurch img,
#indexDefault .centerBoxContentsProducts img,
#indexDefault .specialsListBoxContents img,
#indexBody .centerBoxContentsNew img,
#indexBody .centerBoxContentsFeatured img,
#indexBody .centerBoxContentsSpecials img,
#indexBody .centerBoxContentsAlsoPurch img,
#indexBody .centerBoxContentsProducts img,
#indexBody .specialsListBoxContents img {
  max-width: 100%;
  height: auto;
}

/* Price lines should stay clean and centered */
#indexDefault .centerBoxContentsNew .productPriceDiscount,
#indexDefault .centerBoxContentsFeatured .productPriceDiscount,
#indexDefault .centerBoxContentsSpecials .productPriceDiscount,
#indexDefault .centerBoxContentsAlsoPurch .productPriceDiscount,
#indexDefault .centerBoxContentsProducts .productPriceDiscount,
#indexDefault .specialsListBoxContents .productPriceDiscount,
#indexBody .centerBoxContentsNew .productPriceDiscount,
#indexBody .centerBoxContentsFeatured .productPriceDiscount,
#indexBody .centerBoxContentsSpecials .productPriceDiscount,
#indexBody .centerBoxContentsAlsoPurch .productPriceDiscount,
#indexBody .centerBoxContentsProducts .productPriceDiscount,
#indexBody .specialsListBoxContents .productPriceDiscount {
  display: block;
  max-width: 100%;
  overflow-wrap: anywhere;
}

/* On very narrow screens, remove side padding so text has room */
@media only screen and (max-width: 767px) {
  #indexDefault .centerBoxContentsNew > a,
  #indexDefault .centerBoxContentsFeatured > a,
  #indexDefault .centerBoxContentsSpecials > a,
  #indexDefault .centerBoxContentsAlsoPurch > a,
  #indexDefault .centerBoxContentsProducts > a,
  #indexDefault .specialsListBoxContents > a,
  #indexBody .centerBoxContentsNew > a,
  #indexBody .centerBoxContentsFeatured > a,
  #indexBody .centerBoxContentsSpecials > a,
  #indexBody .centerBoxContentsAlsoPurch > a,
  #indexBody .centerBoxContentsProducts > a,
  #indexBody .specialsListBoxContents > a {
    padding-left: 6px;
    padding-right: 6px;
  }
}