/* BY admin: compact persistent order queue and aligned production actions. */

#by-order-ops-v2 .by-ops-order-card {
  --by-order-accent: #7b8c88;
  margin-bottom: 6px !important;
  padding: 8px 10px !important;
  border-color: var(--by-order-accent) !important;
  border-radius: 12px !important;
}

#by-order-ops-v2 .by-ops-order-card--new {
  --by-order-accent: #78add8;
  background: #f2f8fd !important;
}

#by-order-ops-v2 .by-ops-order-card--processing {
  --by-order-accent: #dfbf54;
  background: #fff8e5 !important;
}

#by-order-ops-v2 .by-ops-order-card--completed {
  --by-order-accent: #7ebd96;
  background: #eff9f2 !important;
}

#by-order-ops-v2 .by-ops-order-card--cancelled {
  --by-order-accent: #b5c0bd;
  background: #f5f7f6 !important;
}

#by-order-ops-v2 .by-ops-order-card:is(:hover, .is-selected) {
  border-color: var(--by-order-accent) !important;
  box-shadow: inset 3px 0 0 var(--by-order-accent), 0 5px 14px rgba(31, 58, 52, .08) !important;
}

#by-order-ops-v2 .by-ops-order-top {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 7px !important;
}

#by-order-ops-v2 .by-ops-order-number {
  font-size: 16px;
  line-height: 1.15;
}

#by-order-ops-v2 .by-ops-time {
  font-size: 10px;
  line-height: 1.2;
}

#by-order-ops-v2 .by-ops-order-top .by-ops-price {
  min-width: 0;
  margin: 0;
  color: #173d38;
  font-size: 13px;
  line-height: 1.15;
  text-align: right;
}

#by-order-ops-v2 .by-ops-card-meta {
  gap: 4px !important;
  margin-top: 5px !important;
}

#by-order-ops-v2 .by-ops-card-meta .by-ops-badge {
  min-height: 20px;
  padding: 2px 6px;
  font-size: 10px;
}

#by-order-ops-v2 .by-ops-order-card--new .by-ops-badge--info {
  color: #145a91;
  background: #deedfa;
}

#by-order-ops-v2 .by-ops-order-card--processing .by-ops-badge--processing {
  color: #765000;
  background: #ffebb0;
}

#by-order-ops-v2 .by-ops-order-card--completed .by-ops-badge--success {
  color: #155f3a;
  background: #dcf2e4;
}

/* Buyer and delivery remain one compact group, with a deliberate break after production. */
#by-order-ops-v2 .by-ops-columns {
  margin-top: 14px !important;
}

/* QR copy uses the same visual language as the neighbouring label-print action. */
#by-order-ops-v2 .by-v10-qr-action > button {
  border: 1px solid #cbd9d6 !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: none !important;
}

#by-order-ops-v2 .by-v10-qr-action > button:hover {
  border-color: #0d6259 !important;
  background: #f5faf8 !important;
}

@media (min-width: 821px) {
  #by-order-ops-v2 {
    overflow: hidden !important;
  }

  #by-order-ops-v2 .by-ops-shell {
    display: flex !important;
    height: calc(100dvh - 69px) !important;
    min-height: 0 !important;
    flex-direction: column;
    overflow: hidden !important;
  }

  #by-order-ops-v2 .by-ops-topbar,
  #by-order-ops-v2 .by-ops-filters {
    flex: 0 0 auto;
  }

  #by-order-ops-v2 .by-ops-grid {
    height: auto !important;
    min-height: 0 !important;
    flex: 1 1 auto;
    overflow: hidden !important;
  }

  #by-order-ops-v2 .by-ops-queue {
    display: flex;
    min-height: 0;
    flex-direction: column;
    overflow: hidden;
  }

  #by-order-ops-v2 .by-ops-queue-head {
    flex: 0 0 auto;
  }

  #by-order-ops-v2 .by-ops-order-list {
    min-height: 0;
    max-height: none !important;
    flex: 1 1 auto;
    overflow-y: auto;
    scrollbar-gutter: stable;
  }

  #by-order-ops-v2 .by-ops-detail {
    min-height: 0;
    overflow-y: auto;
  }
}

@media (max-width: 420px) {
  #by-order-ops-v2 .by-ops-order-top {
    grid-template-columns: auto 1fr;
  }

  #by-order-ops-v2 .by-ops-time {
    grid-column: 1 / -1;
  }
}