/* Keep each flavor's action in a reserved column when its quantity changes. */
.co-landing .co-shelf .pd-series-row,
.co-landing .co-shelf .pd-series-row.selected,
.co-landing .co-shelf .pd-series-row.unavailable{
  grid-template-columns:56px minmax(0,1fr) 118px;
  grid-template-areas:'media copy quantity';
  grid-template-rows:auto;
  align-items:center;
  gap:10px;
  min-height:146px;
  padding:12px 10px;
}
.co-landing .co-shelf .pd-series-row.selected::after{
  display:grid;
  left:14px;
  top:14px;
  right:auto;
  width:19px;
  height:19px;
  pointer-events:none;
}
.co-landing .co-shelf .pd-series-media{align-self:center;height:94px}
.co-landing .co-shelf .pd-series-media img,
.co-landing .co-shelf .pd-series-row.unavailable .pd-series-media img{width:100%;height:94px;min-height:0;object-fit:contain;object-position:center}
.co-landing .co-shelf .pd-series-copy{align-self:center;min-width:0;gap:6px}
.co-landing .co-shelf .pd-series-heading button{overflow-wrap:normal;word-break:normal;hyphens:auto}
.co-landing .co-shelf .pd-series-quantity{align-self:center;justify-self:end;width:118px;gap:0;margin:0}
.co-landing .co-shelf .pd-series-quantity button{width:44px;height:44px;flex:0 0 44px}
.co-landing .co-shelf .pd-series-quantity input{width:30px;height:44px;flex:0 0 30px;font-size:16px}
.co-landing .co-shelf .pd-stock-alert{align-self:center;justify-self:end;width:118px;min-height:44px;padding:10px 8px;text-align:center}
.co-landing .co-shelf>a.co-family-link{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:8px;width:fit-content;max-width:100%;margin-top:14px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;text-align:left;text-decoration:underline;text-underline-offset:4px}
.co-landing .co-family-link>span{display:inline;flex:none;font-size:14px;white-space:nowrap}

/* The two shelves need room for the full quantity control and translated names. */
@media(min-width:1101px) and (max-width:1199px){
  .co-landing .co-shelves{grid-template-columns:minmax(0,1fr);gap:32px}
  .co-landing .co-shelf>p{min-height:0}
}
@media(min-width:768px) and (max-width:959px){
  .co-landing .co-order{grid-template-columns:minmax(0,1fr)}
  .co-landing .co-order-summary{position:static}
}
/* Reserve the same action row before and after selection on smaller phones. */
@media(max-width:460px){
  .co-landing .co-shelf .pd-series-row,
  .co-landing .co-shelf .pd-series-row.selected,
  .co-landing .co-shelf .pd-series-row.unavailable{
    grid-template-columns:56px minmax(0,1fr);
    grid-template-areas:'media copy' 'media quantity';
    grid-template-rows:minmax(0,1fr) 44px;
    gap:10px;
    min-height:178px;
    padding:12px 10px;
  }
  .co-landing .co-shelf .pd-series-copy{align-self:center}
  .co-landing .co-shelf .pd-series-quantity,
  .co-landing .co-shelf .pd-stock-alert{align-self:end}
  .co-landing .co-shelf .pd-stock-alert{width:100%;max-width:260px;padding:6px 10px}
  .co-landing .co-shelf .pd-stock-alert-long{display:inline}
  .co-landing .co-shelf .pd-stock-alert-short{display:none}
}