/* Order entry only: flat groups, compact fields, and one totals strip. */
#orderForm { container-type: inline-size; }
#orderForm .order-form-head {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 20px;
}
#orderForm .order-form-head > div { min-width: 0; }
#orderForm .order-form-head h2 { font-size: 17px; line-height: 1.7; }
#orderForm .order-date-field { width: 150px; min-width: 0; margin: 0; }
#orderForm label > span {
  font-size: 12px;
  font-weight: 400;
  line-height: 1.65;
  color: #62626b;
}
#orderForm input, #orderForm select, #orderForm textarea { font-size: 13px; }
#orderForm .order-customer-grid { gap: 12px; }
#orderForm #distributorCard {
  min-height: 0;
  margin: 8px 0 18px;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.7;
}
#orderForm #distributorCard strong { font-weight: 500; }
#orderForm .items-head {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 12px;
  padding: 0;
  border: 0;
}
#orderForm .items-head h3 { font-size: 14px; }
#orderForm #addItemBtn {
  min-height: 40px;
  padding: 6px 10px;
  background: transparent;
  color: #2168cb;
  border: 0;
  box-shadow: none;
  font-size: 12px;
}
#orderForm #addItemBtn:hover { background: var(--ui-hover); }
#orderForm .items-list { gap: 16px; margin-bottom: 18px; }
#orderView #orderForm .item-row {
  position: relative;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.25fr) 40px;
  gap: 10px;
  min-width: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
#orderView #orderForm .item-row + .item-row { padding-top: 16px; border-top: 1px solid #e3e3e8; }
#orderView #orderForm .item-row > label:first-child { grid-column: 1 / -1; padding-right: 0; }
#orderForm .item-row > label { min-width: 0; margin: 0; }
#orderView #orderForm .item-row > .removeItemBtn {
  position: static;
  width: 40px;
  min-width: 40px;
  height: 44px;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 7px;
  color: #a24444;
  font-size: 22px;
}
#orderView #orderForm .item-row > .removeItemBtn:hover { background: #fff0ee; }
#orderView #orderForm .pos-item-row > .order-pos-quantities { grid-column: 1 / -1; }
#orderView #orderForm .pos-item-row > .order-price-field { grid-column: 1 / 3; }
#orderForm .order-pos-quantity-line { grid-template-columns: minmax(0, 1fr) minmax(72px, .55fr); }
#orderForm .order-note-field textarea { min-height: 56px; resize: vertical; }
#orderForm .order-optional { font-size: 10px; color: #85858e; font-weight: 400; }
#orderForm .order-form-footer { gap: 14px; margin-top: 18px; padding-top: 14px; }
#orderForm .order-form-footer .summary-strip { width: 100%; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 16px; }
#orderForm .order-form-footer .summary-strip > div {
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
#orderForm .summary-strip > div:last-child { text-align: right; }
#orderForm .summary-strip span { font-size: 11px; font-weight: 400; line-height: 1.7; }
#orderForm .summary-strip #totalQty { font-size: 17px; font-weight: 500; }
#orderForm .summary-strip #totalAmount { font-size: 21px; font-weight: 600; overflow-wrap: anywhere; }
#orderForm .order-form-footer .actions { width: 100%; gap: 10px; }
#orderForm #clearFormBtn { margin-right: auto; background: transparent; border-color: transparent; box-shadow: none; color: #62626b; }
#orderForm #clearFormBtn:hover { background: var(--ui-hover); }
#orderForm #saveOrderBtn { min-width: 112px; }
@container (max-width: 280px) {
  #orderForm .order-date-field { width: 100%; }
  #orderForm .order-form-head { align-items: stretch; }
}