/**
 * @file
 * Raw-transaction byte breakdown styling.
 */
.wl-edu-txb {
  margin: 1.5rem 0;
  padding: 1.1rem 1.2rem;
  border: 1px solid var(--color-border-subtle, rgba(255, 255, 255, 0.14));
  border-radius: 12px;
  background: var(--color-surface-raised, rgba(255, 255, 255, 0.03));
}
.wl-edu-txb__ctl {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.9rem;
  margin-bottom: 0.9rem;
  font-size: 0.82rem;
  color: var(--color-text-muted, rgba(255, 255, 255, 0.6));
}
.wl-edu-txb__ctl input {
  width: 9rem;
  padding: 0.3rem 0.45rem;
  border-radius: 6px;
  border: 1px solid var(--color-border-subtle, rgba(255, 255, 255, 0.18));
  background: rgba(0, 0, 0, 0.3);
  color: var(--color-text-primary, #fff);
  font-variant-numeric: tabular-nums;
}
.wl-edu-txb__size { margin-left: auto; font-variant-numeric: tabular-nums; }

.wl-edu-txb__hex {
  padding: 0.75rem 0.85rem;
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid var(--color-border-subtle, rgba(255, 255, 255, 0.1));
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  font-size: 0.8rem;
  line-height: 1.9;
  word-break: break-all;
}
.wl-edu-txb__f { padding: 0.1rem 0.15rem; border-radius: 3px; }
.wl-edu-txb__chip { display: inline-block; width: 0.9rem; height: 0.9rem; border-radius: 3px; flex: 0 0 auto; }

/* Field colours (shared by hex spans + legend chips). */
.wl-edu-txb__f--version   { background: rgba(96, 165, 250, 0.30); color: #dbeafe; }
.wl-edu-txb__f--count     { background: rgba(148, 163, 184, 0.30); color: #e2e8f0; }
.wl-edu-txb__f--txid      { background: rgba(167, 139, 250, 0.30); color: #ede9fe; }
.wl-edu-txb__f--vout      { background: rgba(45, 212, 191, 0.30); color: #ccfbf1; }
.wl-edu-txb__f--scriptlen { background: rgba(148, 163, 184, 0.22); color: #e2e8f0; }
.wl-edu-txb__f--script    { background: rgba(251, 191, 36, 0.26); color: #fef3c7; }
.wl-edu-txb__f--seq       { background: rgba(45, 212, 191, 0.18); color: #ccfbf1; }
.wl-edu-txb__f--value     { background: rgba(52, 211, 153, 0.32); color: #d1fae5; }
.wl-edu-txb__f--locktime  { background: rgba(96, 165, 250, 0.30); color: #dbeafe; }

.wl-edu-txb__legend { list-style: none; margin: 0.9rem 0 0; padding: 0; display: flex; flex-direction: column; gap: 0.3rem; }
.wl-edu-txb__row { display: grid; grid-template-columns: auto 12rem 1fr; align-items: center; gap: 0.55rem; font-size: 0.82rem; }
@media (max-width: 560px) { .wl-edu-txb__row { grid-template-columns: auto 1fr; } .wl-edu-txb__note { grid-column: 2; } }
.wl-edu-txb__name { font-weight: 600; }
.wl-edu-txb__note { color: var(--color-text-muted, rgba(255, 255, 255, 0.6)); }