/* Wallet controls use the same type, pill buttons and surfaces as the Herd planner. */
.herd-wallet-tools {
  max-width: 1040px;
  margin: 0 auto 12px;
  padding: 8px 20px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 4px 16px;
  align-items: center;
  font: 400 13px/1.55 var(--ui, "Chivo", system-ui, sans-serif);
}
.herd-wallet-navigation {
  grid-column: 2;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
}
.herd-wallet-navigation a {
  color: var(--accent, #315c46);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.herd-wallet-navigation span,
#herd-wallet-budget {
  color: var(--text-dim, #546452);
  font-size: 12px;
}
#herd-wallet-budget,
#herd-wallet-pending { grid-column: 1 / -1; }
#herd-wallet-budget:empty,
#herd-wallet-pending:empty,
#herd-wallet-status:empty { display: none; }
#herd-wallet-status { grid-column: 1; grid-row: 1; color: var(--text-dim, #546452); }
#herd-wallet-pending {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}
:is(#herd-wallet-choice, #herd-wallet-review) {
  box-sizing: border-box;
  width: min(440px, calc(100vw - 32px));
  max-width: none;
  max-height: calc(100dvh - 32px);
  margin: auto;
  overflow-y: auto;
  padding: 28px;
  border: 1px solid var(--border, #d4dccb);
  border-radius: 20px;
  background: var(--bg-2, #fffefa);
  color: var(--text, #273d30);
  font: 400 14px/1.55 var(--ui, "Chivo", system-ui, sans-serif);
  box-shadow: 0 24px 80px #071b183d;
}
:is(#herd-wallet-choice, #herd-wallet-review)::backdrop {
  background: #10232280;
  backdrop-filter: blur(4px);
}
:is(#herd-wallet-choice, #herd-wallet-review) h2 {
  margin: 0 0 24px;
  font: 400 28px/1.15 var(--display, "Fraunces", Georgia, serif);
  letter-spacing: -.02em;
  color: var(--text);
}
.herd-wallet-button {
  box-sizing: border-box;
  display: block;
  width: 100%;
  min-height: 44px;
  margin: 10px 0 0;
  padding: 11px 22px;
  border: 1px solid var(--border, #d4dccb);
  border-radius: 999px;
  background: transparent;
  color: var(--text, #273d30);
  font: 500 14px/1.4 var(--ui, "Chivo", system-ui, sans-serif);
  cursor: pointer;
  transition: background .18s, border-color .18s, transform .18s;
}
.herd-wallet-button.primary {
  background: #315c46;
  border-color: #315c46;
  color: #fffefa;
}
.herd-wallet-button.primary:hover { background: #244c39; border-color: #244c39; }
.herd-wallet-button.secondary:hover {
  background: var(--accent-soft, #e6eddf);
  border-color: var(--accent, #315c46);
}
.herd-wallet-button.quiet {
  color: var(--text-dim, #546452);
  border-color: transparent;
}
.herd-wallet-button.quiet:hover { color: var(--text); background: var(--bg-3, #edf1e6); }
.herd-wallet-button:active { transform: translateY(1px); }
.herd-wallet-button:focus-visible {
  outline: 2px solid var(--accent, #315c46);
  outline-offset: 3px;
}
.herd-wallet-button:disabled { opacity: .45; cursor: not-allowed; transform: none; }
#herd-wallet-pending .herd-wallet-button {
  width: auto;
  margin: 0;
  padding: 8px 15px;
  font-size: 12px;
}
#herd-review-facts {
  display: grid;
  grid-template-columns: minmax(90px, .8fr) minmax(0, 1.2fr);
  gap: 12px 16px;
  margin: 0 0 20px;
  font-size: 13px;
}
#herd-review-facts dt { color: var(--text-dim, #546452); }
#herd-review-facts dd { margin: 0; text-align: right; overflow-wrap: anywhere; }
#herd-review-notice { margin: 0 0 22px; color: var(--text-dim, #546452); font-size: 13px; }
@media (max-width: 600px) {
  .herd-wallet-tools { grid-template-columns: minmax(0, 1fr) auto; gap: 8px 12px; }
  #herd-wallet-status { grid-column: 1 / -1; }
  .herd-wallet-navigation { grid-column: 1; grid-row: 2; align-items: flex-start; }
  .herd-wallet-navigation span { max-width: 28ch; }
  :is(#herd-wallet-choice, #herd-wallet-review) { padding: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .herd-wallet-button { transition: none; }
  .herd-wallet-button:active { transform: none; }
}

#herd-wallet-memory { grid-column: 3; grid-row: 1; }
#herd-wallet-memory[hidden] { display:none; }
#herd-wallet-forget { width:auto; margin:0; min-height:30px; padding:5px 12px; font-size:12px; white-space:nowrap; }
@media (max-width: 600px) { #herd-wallet-memory { grid-column: 2; grid-row: 2; } }

/* Keep the remembered wallet in one quiet row below the header. */
.herd-wallet-tools { width:calc(100% - 40px); padding:10px 14px; border:1px solid var(--border, #d4dccb); border-radius:14px; gap:8px 14px; }
.herd-wallet-navigation { flex-direction:row; align-items:center; white-space:nowrap; }
#herd-wallet-status { font-size:12px; }
#herd-wallet-forget { border-left:1px solid var(--border, #d4dccb); border-radius:0; padding-left:14px; }
@media (max-width:600px) {
 .herd-wallet-tools { width:calc(100% - 32px); gap:6px 12px; }
 .herd-wallet-navigation { align-items:center; }
 #herd-wallet-memory { justify-self:end; }
}

.herd-wallet-state { grid-column:1; grid-row:1; min-width:0; display:flex; flex-direction:column; align-items:flex-start; gap:7px; }
.herd-wallet-state .compact { width:auto; min-height:32px; margin:0; padding:5px 14px; font-size:12px; border-radius:9px; }
#herd-wallet-unlock[hidden],#connect-btn[hidden],#wallet-connect[hidden],#herd-wallet-tools:empty { display:none; }
@media(max-width:600px){.herd-wallet-state{grid-column:1/-1}.herd-wallet-tools .herd-wallet-navigation{grid-row:2}}

/* Wallet status stays left; the actions share one compact row. */
.herd-wallet-tools{grid-template-columns:minmax(0,1fr) auto;align-items:center;padding:8px 14px;gap:6px 14px}
.herd-wallet-state{gap:0}.herd-wallet-navigation{grid-column:2;grid-row:1;display:flex;gap:12px;justify-content:flex-end;align-items:center}
.herd-wallet-navigation .compact{width:auto;min-height:32px;padding:5px 12px;margin:0;border-radius:9px;font-size:12px}
.herd-wallet-navigation #herd-wallet-memory{display:flex;align-items:center}.herd-wallet-navigation #herd-wallet-memory[hidden]{display:none}
.herd-wallet-navigation #herd-wallet-forget{min-height:32px;font-size:12px;padding:5px 0 5px 12px}
@media(max-width:600px){.herd-wallet-tools{grid-template-columns:minmax(0,1fr);gap:6px;padding:8px 12px}.herd-wallet-state{grid-column:1}.herd-wallet-tools .herd-wallet-navigation{grid-column:1;grid-row:2;justify-content:flex-start;gap:10px;flex-wrap:wrap}.herd-wallet-navigation a{font-size:12px}.herd-wallet-navigation #herd-wallet-forget{padding-left:10px}}
