.knx-ops-orders-history{
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:16px;
  padding:16px;
  box-shadow:0 10px 30px rgba(0,0,0,.04);
  max-width:1200px;
  margin:16px auto;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

.knx-oh-header{
  display:flex;
  flex-direction:column;
  gap:4px;
  margin-bottom:12px;
}

.knx-oh-title{
  font-size:18px;
  font-weight:800;
  letter-spacing:.2px;
}

.knx-oh-subtitle{
  font-size:13px;
  opacity:.7;
}

.knx-oh-toolbar{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:flex-end;
  padding:12px;
  border:1px solid rgba(0,0,0,.08);
  border-radius:14px;
  background:rgba(0,0,0,.02);
}

.knx-oh-field{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-width:180px;
}

.knx-oh-field label{
  font-size:12px;
  font-weight:700;
  opacity:.75;
}

.knx-oh-field input,
.knx-oh-field select{
  height:40px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,.12);
  padding:0 12px;
  outline:none;
  background:#fff;
}

.knx-oh-field input:focus,
.knx-oh-field select:focus{
  border-color: rgba(11,121,58,.55);
  box-shadow:0 0 0 3px rgba(11,121,58,.12);
}

.knx-oh-actions{
  display:flex;
  gap:8px;
  align-items:center;
}

.knx-btn{
  border:1px solid rgba(0,0,0,.12);
  background:#fff;
  border-radius:12px;
  height:40px;
  padding:0 12px;
  cursor:pointer;
  font-weight:700;
  font-size:13px;
}

.knx-btn:disabled{
  opacity:.45;
  cursor:not-allowed;
}

.knx-btn-ghost{
  background:transparent;
}

.knx-btn-primary{
  border-color: rgba(11,121,58,.35);
  background: rgba(11,121,58,.10);
}

.knx-oh-meta{
  margin-left:auto;
  display:flex;
  align-items:center;
}

.knx-oh-info{
  font-size:13px;
  opacity:.8;
}

.knx-oh-body{
  margin-top:12px;
}

.knx-oh-tableWrap{
  overflow:auto;
  border-radius:14px;
  border:1px solid rgba(0,0,0,.08);
}

.knx-oh-table{
  width:100%;
  border-collapse:collapse;
  min-width:900px;
}

.knx-oh-table thead th{
  text-align:left;
  font-size:12px;
  opacity:.75;
  padding:12px 12px;
  border-bottom:1px solid rgba(0,0,0,.08);
  background:rgba(0,0,0,.02);
  white-space:nowrap;
}

.knx-oh-table tbody td{
  padding:12px 12px;
  border-bottom:1px solid rgba(0,0,0,.06);
  font-size:13px;
  vertical-align:top;
}

.knx-oh-table tbody tr:nth-child(2n){
  background:rgba(0,0,0,.015);
}

.knx-oh-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  font-weight:800;
  font-size:12px;
  border:1px solid rgba(0,0,0,.12);
  background:#fff;
  white-space:nowrap;
}

.knx-oh-pill--delivered{ border-color:rgba(11,121,58,.35); background:rgba(11,121,58,.10); }
.knx-oh-pill--cancelled{ border-color:rgba(220,38,38,.30); background:rgba(220,38,38,.08); }
.knx-oh-pill--failed{ border-color:rgba(245,158,11,.35); background:rgba(245,158,11,.12); }

.knx-oh-muted{ opacity:.75; font-size:12px; }

.knx-oh-cards{
  display:none;
  margin-top:12px;
  gap:10px;
}

.knx-oh-card{
  border:1px solid rgba(0,0,0,.08);
  border-radius:14px;
  padding:12px;
  background:#fff;
  box-shadow:0 8px 24px rgba(0,0,0,.04);
}

.knx-oh-cardTop{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
  margin-bottom:10px;
}

.knx-oh-cardOrder{
  font-weight:900;
  font-size:14px;
}

.knx-oh-cardGrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px 12px;
}

.knx-oh-k{
  font-size:11px;
  font-weight:800;
  opacity:.65;
  margin-bottom:4px;
}

.knx-oh-v{
  font-size:13px;
  font-weight:700;
}

.knx-oh-foot{
  margin-top:10px;
}

.knx-oh-error{
  border:1px solid rgba(220,38,38,.25);
  background:rgba(220,38,38,.08);
  padding:10px 12px;
  border-radius:12px;
  font-size:13px;
  font-weight:700;
}

/* Mobile */
@media (max-width: 860px){
  .knx-oh-tableWrap{ display:none; }
  .knx-oh-cards{ display:grid; }
  .knx-oh-field{ min-width: 160px; }
  .knx-oh-meta{ width:100%; margin-left:0; }
}
