/* Keep the coupon field readable and put its action underneath at every width. */
#page-cart .cart-promo-box {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: 10px;
  row-gap: 10px;
  align-items: center;
}

#page-cart .cart-promo-box > .cart-promo-input {
  box-sizing: border-box;
  min-width: 0;
  width: 100%;
}

#page-cart .cart-promo-box > .cart-promo-btn {
  box-sizing: border-box;
  grid-column: 1 / -1;
  min-height: 44px;
  width: 100%;
}

/* Articles first; recap and checkout action last on phone and tablet. */
@media (max-width: 1024px) {
  #page-cart .cart-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  #page-cart .cart-items-col {
    box-sizing: border-box;
    min-width: 0;
    width: 100%;
    order: 1;
  }

  #page-cart .cart-summary-col {
    position: static;
    box-sizing: border-box;
    min-width: 0;
    width: 100%;
    order: 2;
  }
}