.orders-readable-table {
  --orders-text: #1a1a1a;
  --orders-header: #ffffff;
  --orders-accent: #855209;
  --orders-success: #047857;
  --orders-info: #1d4ed8;
  --orders-warning: #9a3412;
  --orders-danger: #be123c;
  font-size: 18px;
  line-height: 1.5;
}

.dark .orders-readable-table {
  --orders-text: #ffffff;
  --orders-header: #1b1b20;
  --orders-accent: #efb65f;
  --orders-success: #34d399;
  --orders-info: #60a5fa;
  --orders-warning: #fb923c;
  --orders-danger: #fb7185;
}

.orders-readable-table :is(table, th, td, p, span, a, button) {
  letter-spacing: 0;
}

.orders-readable-table :is(table, td, p, td a),
.orders-readable-table :is(.text-vs-muted, .text-vs-hint, .text-vs-faint) {
  color: var(--orders-text);
}

.orders-readable-table :is(th, th button, .text-vs-accent),
.orders-readable-table td a:hover {
  color: var(--orders-accent);
}

.orders-readable-table :is(.text-vs-success, [class~="text-[#34D399]"]) {
  color: var(--orders-success);
}

.orders-readable-table :is(.text-vs-info, [class~="text-[#60A5FA]"]) {
  color: var(--orders-info);
}

.orders-readable-table [class~="text-[#FB923C]"] {
  color: var(--orders-warning);
}

.orders-readable-table table,
.orders-readable-table td,
.orders-readable-table td a {
  font-size: 18px;
  line-height: 1.5;
}

.orders-readable-table :is(th, p, span, button) {
  font-size: 16px;
  line-height: 1.5;
}

.orders-readable-table th {
  padding: 16px;
  text-transform: none;
}

.orders-readable-table thead {
  background: var(--orders-header);
}

.orders-readable-table td {
  padding: 18px 16px;
}

.orders-readable-table td:first-child {
  min-width: 300px;
}

.orders-readable-table td:first-child > div {
  flex-wrap: wrap;
}

.orders-readable-table td:first-child a {
  white-space: normal;
  overflow-wrap: anywhere;
}

.orders-readable-table td p {
  margin-top: 4px;
}

.orders-readable-table td.tabular-nums > span {
  font-size: inherit;
}

.orders-readable-table td button {
  min-width: 44px;
  min-height: 44px;
}

.orders-readable-table td button svg {
  width: 20px;
  height: 20px;
}

.orders-readable-table :is(a, button):focus-visible {
  outline: 2px solid var(--vs-accent);
  outline-offset: 3px;
}

/* Keep actual warnings and destructive actions distinct from ordinary text. */
.orders-readable-table [class*="text-vs-danger"],
.orders-readable-table [class*="text-[#FB7185]"],
.orders-readable-table button[aria-label="Delete order"]:hover {
  color: var(--orders-danger);
}

.orders-readable-table > div:last-child:not(:first-child) {
  gap: 12px;
  flex-wrap: wrap;
}

.orders-readable-table > div:last-child:not(:first-child) button {
  min-height: 44px;
}

.orders-readable-table button:disabled {
  opacity: 1;
  cursor: not-allowed;
}
