/* fix6160 — Related products width + footer newsletter alignment (6.14.15b)
   Related: match the Pairs well with (section.cbp) content width and stop
   half-cards being clipped on both edges. Newsletter: one baseline for
   labels/inputs/Subscribe on desktop; stacked full-width on phone.
   Form fields, action and Mailchimp/BC wiring are unchanged. */

/* ---- 1. Related products (and Customers also viewed) ---- */
html body.dtc-c .pdp-suggest:not(#a),
html body.dtc-c .pdp-suggest-block:not(#a),
html body.dtc-c section.pdp-suggest-block:not(#a){
  max-width:none!important;
  width:100%!important;
  box-sizing:border-box!important;
  margin-left:0!important;
  margin-right:0!important;
  padding-left:0!important;
  padding-right:0!important;
}
html body.dtc-c .pdp-suggest-block > ul.productGrid:not(#a),
html body.dtc-c .pdp-suggest-block .related-products-slider:not(#a){
  width:100%!important;
  max-width:none!important;
  box-sizing:border-box!important;
  margin-left:0!important;
  margin-right:0!important;
}
html body.dtc-c .pdp-suggest-block .slick-list:not(#a){
  overflow:hidden!important;
  padding:0!important;
  width:100%!important;
  box-sizing:border-box!important;
}
html body.dtc-c .pdp-suggest-block .slick-track:not(#a){
  display:flex!important;
}
/* Do not force % widths on slick slides (those were % of the track and
   clipped cards on both edges). Let slick's pixel widths stand. */
/* .productGrid .product { max-width:270px } was locking each slide at 270px
   so a now-wider row still showed clipped half-cards on both edges. */
html body.dtc-c .pdp-suggest-block .related-products.slick-initialized .slick-slide:not(#a),
html body.dtc-c .pdp-suggest-block .related-products .product:not(#a),
html body.dtc-c .pdp-suggest-block .related-products .productCarousel-slide:not(#a){
  float:none;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
  box-sizing:border-box!important;
}
html body.dtc-c .pdp-suggest-block .slick-slide > div,
html body.dtc-c .pdp-suggest-block .slick-slide .card{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
}
/* Phone/tablet grid (related-products1): full cards, no clipped half-cards */
@media (max-width:991px){
  html body.dtc-c .pdp-suggest-block > ul.related-products1:not(#a){
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
    width:100%!important;
    overflow:visible!important;
  }
  html body.dtc-c .pdp-suggest-block > ul.related-products1 > li.product:not(#a){
    width:auto!important;
    max-width:none!important;
    margin:0!important;
    float:none!important;
    display:block!important;
  }
}
@media (max-width:520px){
  html body.dtc-c .pdp-suggest-block > ul.related-products1:not(#a){
    grid-template-columns:minmax(0,1fr);
  }
}

/* ---- 2. Footer newsletter ("Be the First to Hear…") ---- */
html body.dtc-c .newsletter-section .form-fieldset:not(#a){
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto!important;
  align-items:end!important;
  gap:8px 16px!important;
  border:0!important;
  margin:0!important;
  padding:0!important;
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}
html body.dtc-c .newsletter-section .form-fieldset > input[type=hidden]{
  display:none!important;
}
html body.dtc-c .newsletter-section .form-field:not(#a){
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-end!important;
  gap:6px!important;
  margin:0!important;
  padding:0!important;
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
  float:none!important;
  position:static!important;
}
html body.dtc-c .newsletter-section .c10-nl-label:not(#a),
html body.dtc-c .newsletter-section .form-label:not(#a){
  display:block!important;
  position:static!important;
  clip:auto!important;
  width:auto!important;
  height:auto!important;
  overflow:visible!important;
  margin:0!important;
  padding:0!important;
  font:500 14px/20px Jost,var(--f-body),sans-serif!important;
  color:#241A2B!important;
  text-align:left;
  text-transform:none;
  letter-spacing:0;
}
html body.dtc-c .newsletter-section .form-input:not(#a),
html body.dtc-c .newsletter-section input.form-input:not(#a){
  height:48px!important;
  min-height:48px!important;
  max-height:48px!important;
  min-width:0!important;
  max-width:100%!important;
  width:100%!important;
  margin:0!important;
  padding:0 14px!important;
  box-sizing:border-box!important;
  border:1.5px solid #C9B8A8!important;
  border-radius:8px!important;
  background:#fff!important;
  color:#241A2B!important;
  font:400 16px/1 Jost,var(--f-body),sans-serif!important;
}
html body.dtc-c .newsletter-section button[type=submit]:not(#a),
html body.dtc-c .newsletter-section .button[type=submit]:not(#a){
  height:48px!important;
  min-height:48px!important;
  max-height:48px!important;
  margin:0!important;
  min-width:44px;
  width:auto!important;
  max-width:none;
  padding:0 28px!important;
  box-sizing:border-box!important;
  white-space:nowrap;
  align-self:end;
  position:static!important;
  top:auto!important;
  right:auto!important;
}
@media (max-width:800px){
  html body.dtc-c .newsletter-section .form-fieldset:not(#a){
    grid-template-columns:minmax(0,1fr)!important;
    gap:16px!important;
  }
  html body.dtc-c .newsletter-section .form-field:not(#a),
  html body.dtc-c .newsletter-section .form-input:not(#a),
  html body.dtc-c .newsletter-section button[type=submit]:not(#a){
    width:100%!important;
    max-width:100%!important;
  }
}