.table-container,
.task-table-wrap,
.order-related-wrap,
.customer-history-wrap {
  border: 1px solid var(--border-color);
  border-radius: var(--ui-radius-lg);
  background: var(--bg-card);
  box-shadow: var(--shadow-sm);
}

.table-container {
  overflow: auto;
}


table th {
  color: var(--text-muted);
  background: var(--table-th-bg);
  font-size: 0.69rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: normal;
  line-height: 1.25;
}

#mainContainerBox th.orders-col-order,
#mainContainerBox td.orders-col-order { width: 145px; min-width: 145px; max-width: 145px; }
#mainContainerBox th.orders-col-employee,
#mainContainerBox td.orders-col-employee { width: 110px; min-width: 110px; max-width: 110px; }
#mainContainerBox th.orders-col-customer,
#mainContainerBox td.orders-col-customer { width: 150px; min-width: 150px; max-width: 150px; }
#mainContainerBox th.orders-col-company,
#mainContainerBox td.orders-col-company { width: 185px; min-width: 185px; max-width: 185px; }
#mainContainerBox th.orders-col-product,
#mainContainerBox td.orders-col-product { width: 195px; min-width: 195px; max-width: 240px; }
#mainContainerBox th.orders-col-amount,
#mainContainerBox td.orders-col-amount { width: 110px; min-width: 110px; max-width: 110px; }
#mainContainerBox th.orders-col-final-cost,
#mainContainerBox td.orders-col-final-cost { width: 145px; min-width: 145px; max-width: 145px; }
#mainContainerBox th.orders-col-status,
#mainContainerBox td.orders-col-status { width: 165px; min-width: 165px; }
#mainContainerBox th.orders-col-invoice,
#mainContainerBox td.orders-col-invoice { width: 145px; min-width: 145px; }
#mainContainerBox th.orders-col-qr,
#mainContainerBox td.orders-col-qr { width: 78px; min-width: 78px; max-width: 78px; text-align: center; }
#mainContainerBox th.orders-col-actions,
#mainContainerBox td.orders-col-actions { width: 130px; min-width: 130px; }
#mainContainerBox td.orders-col-product .cell-sub { white-space: normal; line-height: 1.25; }

.qr-thumbnail-btn { display:inline-flex; width:42px; height:42px; align-items:center; justify-content:center; overflow:hidden; padding:2px; border:1px solid var(--border-color); border-radius:var(--radius-sm); background:#fff; cursor:pointer; }
.qr-thumbnail-btn img { display:block; width:100%; height:100%; object-fit:contain; image-rendering:pixelated; }
.qr-thumbnail-btn:hover { border-color:var(--brand-teal-500); box-shadow:0 0 0 2px rgba(20,184,166,.18); }

table td {
  border-bottom-color: var(--border-color);
}

tbody tr:hover td {
  background: var(--table-hover);
}

.product-ncc-name {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  color: var(--primary-2);
  font-family: var(--font-sans);
  font-size: 0.88rem;
  font-weight: 800;
  letter-spacing: 0.01em;
  line-height: 1.25;
  text-transform: uppercase;
}

.product-ncc-name i { color: var(--brand-teal-300); font-size: 0.78rem; }

.ncc-check-select { min-width: 118px; min-height: 34px; padding: 0.35rem 0.5rem; font-size: 0.7rem; }

.status-badge {
  border: 1px solid transparent;
  border-radius: 999px;
  font-weight: 750;
}

.pagination-section {
  margin-top: 0.85rem;
  padding: 0.8rem 1rem;
  border: 1px solid var(--border-color);
  border-radius: var(--ui-radius-md);
  background: var(--bg-card);
}

@media (max-width: 700px) {
  .table-container { margin-inline: -0.25rem; }
  .pagination-section { align-items: stretch; flex-direction: column; gap: 0.75rem; }
  .pagination-controls { flex-wrap: wrap; }
}