/* The cart's operational messages get dedicated rows so barcodes, totals and
   stock warnings never paint over one another at intermediate widths. */
.pos-sale-main .cart-line{
  grid-template-columns:minmax(0,1fr) minmax(270px,auto);
  gap:12px;
  padding:8px 8px;
}
.pos-sale-main .cart-line>div:first-child{
  min-width:0;
}
.pos-sale-main .line-right{
  min-width:270px;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-rows:auto auto auto auto;
  column-gap:12px;
  row-gap:2px;
}
.pos-sale-main .line-discount{
  margin-top:4px;
}
.pos-sale-main .line-right>strong{
  grid-column:2;
  grid-row:1;
  align-self:start;
}
.pos-sale-main .line-right>.cart-barcode{
  grid-column:1;
  grid-row:1;
  align-self:center;
  justify-self:end;
  min-width:0;
}
.pos-sale-main .line-right>.discounted{
  grid-column:1/3;
  grid-row:2;
  justify-self:end;
}
.pos-sale-main .line-right>.cart-stock-warning{
  grid-column:1/3;
  grid-row:3;
  justify-self:end;
  width:max-content;
  max-width:100%;
  padding:2px 7px;
  border-radius:999px;
  background:#fff0ef;
  font-size:11px;
  line-height:1.25;
  white-space:normal;
}
.pos-sale-main .qty-right{
  grid-column:1/3;
  grid-row:4;
  margin-top:2px;
}
@media(max-width:980px){
  .pos-sale-main .cart-line{grid-template-columns:1fr}
  .pos-sale-main .line-right{width:100%;min-width:0}
}