/* Table rules only. Everything else comes from app.css, which is linked first
   so the variables above are already defined. */

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}

th,
td {
  text-align: left;
  padding: 0.4rem 0.6rem;
  border-bottom: 1px solid var(--line);
}

th {
  color: var(--dim);
  font-weight: 600;
}

tbody tr:last-child td {
  border-bottom: none;
}

/* A deadline close enough to act on. */
td.close {
  color: var(--bad);
  font-weight: 600;
}

td.gone {
  color: var(--dim);
}

code {
  font-family: ui-monospace, "SF Mono", "Cascadia Mono", monospace;
  font-size: 0.85rem;
}

/* A note that carries a whole transaction id or preimage: it wraps rather than
   pushing the card wider. */
#node-note {
  overflow-wrap: anywhere;
}

/* The panel's own bits, on top of the page's stylesheet. */

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}

th,
td {
  text-align: left;
  padding: 0.35rem 0.5rem;
  border-bottom: 1px solid var(--line);
}

th {
  color: var(--dim);
  font-weight: 500;
}

td.gone {
  color: var(--dim);
}

td.close {
  color: var(--bad);
  font-weight: 600;
}

/* A channel is closed from its own row, and a force close is destructive enough
   to want a colour, and a second press before it happens. */
td.state {
  white-space: nowrap;
}

td.actions {
  white-space: nowrap;
}

td.actions button {
  padding: 0.25rem 0.5rem;
  font-size: 0.8rem;
}

button.danger {
  border-color: var(--bad);
  color: var(--bad);
}

button.danger.armed {
  background: var(--bad);
  border-color: var(--bad);
  color: #1a1205;
  font-weight: 600;
}

.row input[type="text"] {
  flex: 1;
}