/* Ads Arsenal — app-level bridge utilities on top of the design system tokens.
 * Small, page-agnostic classes the design system doesn't name as components
 * (flash messages, muted text) but every screen needs. */

.muted { color: var(--text-muted); font-size: var(--text-xs); }

.error, .notice {
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  border: 1px solid;
  margin: 0 0 var(--space-2);
}
.error { color: var(--danger-text); background: var(--danger-bg); border-color: var(--danger-border); }
.notice { color: var(--success-text); background: var(--success-bg); border-color: var(--success-border); }

form.stack { display: flex; flex-direction: column; gap: var(--space-4); }
form.stack label { font-size: var(--text-sm); font-weight: var(--weight-medium); color: var(--text-primary); }

/* Real tab controls: .aa-tab already strips button chrome (background/borders)
 * in the design CSS; buttons additionally need the font reset UA styles break. */
button.aa-tab { font: inherit; }

/* Link-as-button (href mode of components.ts button()): the aa-btn classes
 * carry all visual state; only the anchor's UA/base link styling needs
 * neutralizing so <a class="aa-btn"> renders identically to <button>. */
a.aa-btn, a.aa-btn:hover { text-decoration: none; }

/* Dismiss disclosure (UX-19, DP-4): the summary renders as the ghost button
 * it acts as — strip the UA disclosure marker; aa-btn carries the rest. */
details.aa-dismiss > summary { list-style: none; }
details.aa-dismiss > summary::-webkit-details-marker { display: none; }
details.aa-dismiss[open] { flex: 1; }
details.aa-dismiss > form { margin-top: var(--space-3); }