body[data-ui="new"] #ordersView .order-create-panel {
  display: grid;
  gap: var(--ui-space-4);
  margin-bottom: var(--ui-space-4);
  padding: var(--ui-space-4);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-lg);
  background: var(--ui-surface-muted);
}

body[data-ui="new"] #ordersView .order-create-panel.hidden {
  display: none;
}

body[data-ui="new"] #ordersView .order-create-panel > .panel-heading {
  margin-bottom: 0;
  padding-bottom: var(--ui-space-3);
  border-bottom: var(--ui-border-width) solid var(--ui-border);
}

body[data-ui="new"] #ordersView .order-create-panel > .panel-heading h3 {
  color: var(--ui-text);
  font-size: var(--ui-font-size-section-title);
  line-height: var(--ui-line-height-tight);
}

body[data-ui="new"] #ordersView #orderForm {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
  gap: var(--ui-form-gap);
}

body[data-ui="new"] #ordersView #orderForm > label {
  min-width: 0;
}

body[data-ui="new"] #ordersView #orderForm > .full {
  grid-column: 1 / -1;
}

body[data-ui="new"] #ordersView #orderForm > .wide {
  grid-column: 1 / -1;
}

body[data-ui="new"] #ordersView .quick-client-box {
  display: grid;
  gap: var(--ui-space-3);
  padding: var(--ui-space-4);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-sm);
}

body[data-ui="new"] #ordersView .quick-client-box .panel-heading {
  margin-bottom: 0;
}

body[data-ui="new"] #ordersView .quick-client-box .panel-heading h3 {
  color: var(--ui-text);
  font-size: var(--ui-font-size-subtitle);
  line-height: var(--ui-line-height-tight);
}

body[data-ui="new"] #ordersView #quickClientForm {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr));
  gap: var(--ui-form-gap);
}

body[data-ui="new"] #ordersView #quickClientForm > label {
  min-width: 0;
}

body[data-ui="new"] #ordersView #quickClientForm > .wide {
  grid-column: 1 / -1;
}

body[data-ui="new"] #ordersView .ui-orders-item-form {
  display: grid;
  gap: var(--ui-space-4);
}

body[data-ui="new"] #ordersView .ui-orders-item-form #addItemForm {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr));
  gap: var(--ui-form-gap);
}

body[data-ui="new"] #ordersView .ui-orders-item-form #addItemForm > .full {
  grid-column: 1 / -1;
}

body[data-ui="new"] #ordersView .ui-orders-item-form #addItemForm > .wide {
  grid-column: 1 / -1;
}

body[data-ui="new"] #ordersView .ui-orders-item-form .quantity-field {
  min-width: 0;
}

body[data-ui="new"] #ordersView .ui-orders-item-form .quantity-stepper {
  display: grid;
  grid-template-columns: var(--ui-touch-target) minmax(72px, 1fr) var(--ui-touch-target);
  gap: var(--ui-space-2);
  align-items: center;
}

body[data-ui="new"] #ordersView .ui-orders-item-form .takeaway-control {
  display: flex;
  align-items: end;
}

body[data-ui="new"] #ordersView .ui-orders-item-form .takeaway-control[hidden] {
  display: none;
}

body[data-ui="new"] #ordersView .ui-orders-items {
  display: grid;
  gap: var(--ui-space-3);
}

body[data-ui="new"] #ordersView .ui-orders-item {
  display: grid;
  gap: var(--ui-space-3);
  padding: var(--ui-space-4);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-sm);
}

body[data-ui="new"] #ordersView .ui-orders-item__header {
  display: flex;
  gap: var(--ui-space-3);
  align-items: start;
  justify-content: space-between;
}

body[data-ui="new"] #ordersView .ui-orders-item__title {
  display: grid;
  gap: var(--ui-space-1);
  min-width: 0;
}

body[data-ui="new"] #ordersView .ui-orders-item__title > span {
  color: var(--ui-text-muted);
  font-size: var(--ui-font-size-body-small);
}

body[data-ui="new"] #ordersView .ui-orders-item__values {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ui-space-2) var(--ui-space-4);
  justify-content: space-between;
  color: var(--ui-text-muted);
  font-size: var(--ui-font-size-body-small);
}

body[data-ui="new"] #ordersView .ui-orders-item__values strong {
  color: var(--ui-text);
  font-family: var(--ui-font-family-numeric);
}

body[data-ui="new"] #ordersView .ui-orders-item__note {
  margin: 0;
  color: var(--ui-text-muted);
}

body[data-ui="new"] #ordersView .ui-orders-item__takeaway {
  width: fit-content;
  margin: 0;
  padding: var(--ui-space-1) var(--ui-space-2);
  border-radius: var(--ui-radius-sm);
  background: var(--ui-primary-light);
  color: var(--ui-primary-dark);
  font-size: var(--ui-font-size-caption);
  font-weight: var(--ui-font-weight-bold);
}

body[data-ui="new"] #ordersView .ui-orders-item__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ui-space-2);
  padding-top: var(--ui-space-3);
  border-top: var(--ui-border-width) solid var(--ui-border);
}

body[data-ui="new"] #ordersView .ui-orders-item__actions .danger {
  margin-inline-start: auto;
}

body[data-ui="new"] #ordersView .ui-orders-quantity {
  display: inline-grid;
  grid-template-columns: repeat(3, var(--ui-touch-target));
  gap: var(--ui-space-1);
  align-items: center;
  justify-items: center;
}

body[data-ui="new"] #ordersView .ui-orders-fish-toggle {
  display: grid;
  gap: var(--ui-space-3);
}

body[data-ui="new"] #ordersView .ui-orders-fish-form {
  display: grid;
  gap: var(--ui-space-4);
}

body[data-ui="new"] #ordersView .ui-orders-fish-form #addFishForm {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr));
  gap: var(--ui-form-gap);
}

body[data-ui="new"] #ordersView .ui-orders-fish-form #addFishForm > .wide {
  grid-column: 1 / -1;
}

body[data-ui="new"] #ordersView .ui-orders-fish-list {
  display: grid;
  gap: var(--ui-space-3);
  margin-top: var(--ui-space-3);
}

body[data-ui="new"] #ordersView .ui-orders-fish {
  display: grid;
  gap: var(--ui-space-3);
  padding: var(--ui-space-4);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-sm);
}

body[data-ui="new"] #ordersView .ui-orders-fish.is-cancelled {
  background: var(--ui-surface-muted);
}

body[data-ui="new"] #ordersView .ui-orders-fish__header {
  display: flex;
  gap: var(--ui-space-3);
  align-items: start;
  justify-content: space-between;
}

body[data-ui="new"] #ordersView .ui-orders-fish__title {
  display: grid;
  gap: var(--ui-space-1);
  min-width: 0;
}

body[data-ui="new"] #ordersView .ui-orders-fish__title > span {
  color: var(--ui-text-muted);
  font-size: var(--ui-font-size-body-small);
}

body[data-ui="new"] #ordersView .ui-orders-fish__values {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ui-space-2) var(--ui-space-4);
  justify-content: space-between;
  color: var(--ui-text-muted);
  font-size: var(--ui-font-size-body-small);
}

body[data-ui="new"] #ordersView .ui-orders-fish__values strong {
  color: var(--ui-text);
  font-family: var(--ui-font-family-numeric);
}

body[data-ui="new"] #ordersView .ui-orders-fish__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ui-space-2);
  justify-content: flex-end;
  padding-top: var(--ui-space-3);
  border-top: var(--ui-border-width) solid var(--ui-border);
}

body[data-ui="new"] #ordersView {
  min-width: 0;
  max-width: 100%;
}

body[data-ui="new"] #ordersView .orders-layout,
body[data-ui="new"] #ordersView .orders-layout > .panel,
body[data-ui="new"] #ordersView #ordersList,
body[data-ui="new"] #ordersView #orderDetail,
body[data-ui="new"] #ordersView .ui-orders-detail,
body[data-ui="new"] #ordersView .subpanel,
body[data-ui="new"] #ordersView .history-list,
body[data-ui="new"] #ordersView .history-line {
  min-width: 0;
  max-width: 100%;
}

body[data-ui="new"] #ordersView #ordersList,
body[data-ui="new"] #ordersView .ui-orders-detail {
  display: grid;
  gap: var(--ui-space-3);
}

body[data-ui="new"] #ordersView #ordersList > h3 {
  margin: 0;
  color: var(--ui-text);
  font-size: var(--ui-font-size-section-title);
  line-height: var(--ui-line-height-tight);
}

body[data-ui="new"] #ordersView .ui-orders-list {
  min-width: 0;
  display: grid;
  gap: var(--ui-space-3);
}

body[data-ui="new"] #ordersView .ui-orders-mobile-create {
  display: none;
}

body[data-ui="new"] #ordersView .ui-orders-list__item {
  min-width: 0;
}

body[data-ui="new"] #ordersView .filter-row {
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
}

body[data-ui="new"] #ordersView .ui-orders-card {
  width: 100%;
  min-width: 0;
  min-height: var(--ui-touch-target);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--ui-space-3);
  align-items: center;
  text-align: start;
}

body[data-ui="new"] #ordersView .ui-orders-card__content,
body[data-ui="new"] #ordersView .ui-orders-card__summary {
  min-width: 0;
  display: grid;
  gap: var(--ui-space-1);
}

body[data-ui="new"] #ordersView .ui-orders-card__content > *,
body[data-ui="new"] #ordersView .ui-orders-card__summary > *,
body[data-ui="new"] #ordersView .ui-orders-item__title > *,
body[data-ui="new"] #ordersView .ui-orders-fish__title > *,
body[data-ui="new"] #ordersView .history-line > * {
  min-width: 0;
  overflow-wrap: anywhere;
}

body[data-ui="new"] #ordersView .ui-orders-card__summary {
  justify-items: end;
  text-align: end;
}

body[data-ui="new"] #ordersView .order-detail-header,
body[data-ui="new"] #ordersView .detail-actions,
body[data-ui="new"] #ordersView .panel-heading {
  min-width: 0;
}

body[data-ui="new"] #ordersView .detail-actions {
  flex-wrap: wrap;
}

body[data-ui="new"] #ordersView .checkout-summary {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

body[data-ui="new"] #ordersView #orderForm input,
body[data-ui="new"] #ordersView #orderForm select,
body[data-ui="new"] #ordersView #quickClientForm input,
body[data-ui="new"] #ordersView #quickClientForm select,
body[data-ui="new"] #ordersView #addItemForm input,
body[data-ui="new"] #ordersView #addItemForm select,
body[data-ui="new"] #ordersView #addFishForm input,
body[data-ui="new"] #ordersView #addFishForm select {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

body[data-ui="new"] #ordersView .ui-orders-operational-status {
  display: block;
  margin-bottom: var(--ui-space-3);
  padding: var(--ui-space-3) var(--ui-space-4);
  border: var(--ui-border-width) solid var(--ui-info);
  border-radius: var(--ui-radius-md);
  background: var(--ui-surface-muted);
  color: var(--ui-text);
  font-weight: var(--ui-font-weight-semibold);
}

body[data-ui="new"] #ordersView .ui-orders-operational-status.is-offline {
  border-color: var(--ui-warning);
}

body[data-ui="new"] #ordersView .ui-orders-operational-status.is-error {
  border-color: var(--ui-danger);
}

@media (min-width: 1024px) {
  body[data-ui="new"] #ordersView .orders-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-ui="new"] #ordersView #orderForm,
  body[data-ui="new"] #ordersView #quickClientForm,
  body[data-ui="new"] #ordersView .ui-orders-item-form #addItemForm,
  body[data-ui="new"] #ordersView .ui-orders-fish-form #addFishForm {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body[data-ui="new"] #ordersView button,
  body[data-ui="new"] #ordersView input,
  body[data-ui="new"] #ordersView select {
    min-height: var(--ui-touch-target);
  }

  body[data-ui="new"] #ordersView .mini-btn {
    min-width: var(--ui-touch-target);
  }

}

@media (min-width: 1180px) {
  body[data-ui="new"] #ordersView .orders-layout {
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.6fr);
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  body[data-ui="new"] #ordersView .orders-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-ui="new"] #ordersView .orders-layout > .panel {
    width: 100%;
  }

  body[data-ui="new"] #ordersView #orderForm,
  body[data-ui="new"] #ordersView #quickClientForm,
  body[data-ui="new"] #ordersView .ui-orders-item-form #addItemForm,
  body[data-ui="new"] #ordersView .ui-orders-fish-form #addFishForm {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body[data-ui="new"] #ordersView button,
  body[data-ui="new"] #ordersView input,
  body[data-ui="new"] #ordersView select {
    min-height: var(--ui-touch-target);
  }

  body[data-ui="new"] #ordersView .mini-btn {
    min-width: var(--ui-touch-target);
  }
}

@media (min-width: 900px) and (max-width: 1023px) and (orientation: landscape) {
  body[data-ui="new"] #ordersView .orders-layout {
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.3fr);
  }
}

@media (max-width: 767px) {
  body[data-ui="new"] #ordersView {
    padding-bottom: calc(var(--ui-mobile-navigation-height) + var(--ui-safe-area-bottom) + var(--ui-space-4));
  }

  body[data-ui="new"] #ordersView .ui-orders-mobile-create {
    display: inline-flex;
    min-height: var(--ui-touch-target);
    width: 100%;
    margin-bottom: var(--ui-space-3);
  }

  body[data-ui="new"] #ordersView .orders-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-ui="new"] #ordersView .orders-layout > .panel,
  body[data-ui="new"] #ordersView .ui-orders-card,
  body[data-ui="new"] #ordersView .ui-orders-item,
  body[data-ui="new"] #ordersView .ui-orders-fish {
    width: 100%;
  }

  body[data-ui="new"] #ordersView #orderForm,
  body[data-ui="new"] #ordersView #quickClientForm,
  body[data-ui="new"] #ordersView .ui-orders-item-form #addItemForm,
  body[data-ui="new"] #ordersView .ui-orders-fish-form #addFishForm {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-ui="new"] #ordersView #orderForm > *,
  body[data-ui="new"] #ordersView #quickClientForm > *,
  body[data-ui="new"] #ordersView #addItemForm > *,
  body[data-ui="new"] #ordersView #addFishForm > * {
    min-width: 0;
    grid-column: 1;
  }

  body[data-ui="new"] #ordersView .filter-row {
    max-width: 100%;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    overflow-x: visible;
  }

  body[data-ui="new"] #ordersView .filter-row .segmented {
    min-width: 0;
    padding-inline: var(--ui-space-1);
    white-space: nowrap;
  }

  body[data-ui="new"] #ordersView .ui-orders-card {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
  }

  body[data-ui="new"] #ordersView .ui-orders-card__summary {
    grid-template-columns: minmax(0, 1fr) auto;
    justify-items: start;
    text-align: start;
  }

  body[data-ui="new"] #ordersView .order-detail-header {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-ui="new"] #ordersView .detail-actions,
  body[data-ui="new"] #ordersView .ui-orders-item__actions,
  body[data-ui="new"] #ordersView .ui-orders-fish__actions,
  body[data-ui="new"] #ordersView .panel-heading {
    flex-wrap: wrap;
  }

  body[data-ui="new"] #ordersView button,
  body[data-ui="new"] #ordersView .btn,
  body[data-ui="new"] #ordersView .mini-btn,
  body[data-ui="new"] #ordersView .segmented {
    min-height: var(--ui-touch-target);
  }

  body[data-ui="new"] #ordersView .mini-btn {
    min-width: var(--ui-touch-target);
  }

  body[data-ui="new"] #ordersView .checkout-summary {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-ui="new"] #ordersView .history-line {
    overflow-wrap: anywhere;
  }
}

@media (min-width: 320px) and (max-width: 359px) {
  body[data-ui="new"] #ordersView,
  body[data-ui="new"] #ordersView .orders-layout,
  body[data-ui="new"] #ordersView .orders-layout > .panel {
    min-width: 0;
  }

  body[data-ui="new"] #ordersView .ui-orders-item__header,
  body[data-ui="new"] #ordersView .ui-orders-fish__header {
    flex-direction: column;
    align-items: stretch;
  }

  body[data-ui="new"] #ordersView .detail-actions,
  body[data-ui="new"] #ordersView .ui-orders-item__actions,
  body[data-ui="new"] #ordersView .ui-orders-fish__actions {
    flex-direction: column;
    align-items: stretch;
  }

  body[data-ui="new"] #ordersView .detail-actions > *,
  body[data-ui="new"] #ordersView .ui-orders-item__actions > *,
  body[data-ui="new"] #ordersView .ui-orders-fish__actions > * {
    width: 100%;
    margin-inline-start: 0;
  }

  body[data-ui="new"] #ordersView .ui-orders-quantity {
    width: 100%;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  body[data-ui="new"] #ordersView .ui-orders-item-form .quantity-stepper {
    grid-template-columns: var(--ui-touch-target) minmax(0, 1fr) var(--ui-touch-target);
  }

}

@media (prefers-reduced-motion: reduce) {
  body[data-ui="new"] #ordersView .ui-orders-card,
  body[data-ui="new"] #ordersView .ui-orders-item,
  body[data-ui="new"] #ordersView .ui-orders-fish,
  body[data-ui="new"] #ordersView .segmented,
  body[data-ui="new"] #ordersView .ui-orders-operational-status {
    transition: none;
  }
}

@media (forced-colors: active) {
  body[data-ui="new"] #ordersView .ui-orders-card,
  body[data-ui="new"] #ordersView .ui-orders-item,
  body[data-ui="new"] #ordersView .ui-orders-fish,
  body[data-ui="new"] #ordersView .ui-orders-operational-status,
  body[data-ui="new"] #ordersView .segmented {
    border-color: CanvasText;
  }

  body[data-ui="new"] #ordersView .ui-orders-card.is-selected,
  body[data-ui="new"] #ordersView .segmented.active {
    outline: 2px solid CanvasText;
    outline-offset: 2px;
  }
}