/*
 * Accounts modules (auth, admin, privacy, legal): account tabs, filters, legal pages.
 * Uses only the tokens in brand.css. Registered by the auth module (Module(stylesheets=...)).
 */

/* Account sub-navigation */
.account-tabs { border-bottom: 1px solid var(--border); margin-bottom: 1.5rem; }
.account-tabs ul, .state-filter { list-style: none; margin: 0; padding: 0; }
.account-tabs a, .state-filter a {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 0.75rem;
  color: var(--ink); text-decoration: none; font-weight: 600; border-bottom: 3px solid transparent;
}
.account-tabs a:hover, .state-filter a:hover { color: var(--brand); }
.account-tabs a[aria-current="page"], .state-filter a[aria-current="page"] { color: var(--brand); border-bottom-color: var(--brand); }
.state-filter { margin-bottom: 1rem; }

/* Filter and search forms on admin pages */
.filter-form { display: flex; flex-wrap: wrap; gap: 0 1rem; align-items: flex-end; margin-bottom: 1rem; }
.filter-form .field { flex: 1 1 12rem; margin-bottom: 1rem; }
.filter-form .button { margin-bottom: 1rem; }

/* Long identifiers, emails and JSON details wrap instead of overflowing tables and panels */
code.wrap { white-space: pre-wrap; overflow-wrap: anywhere; }
.detail-list dt { overflow-wrap: anywhere; }
meter { width: 100%; min-width: 6rem; height: 1rem; }

/* Legal documents */
.prose { max-width: 46rem; }
.prose h2 { margin-top: 2rem; }
.prose li + li { margin-top: 0.4rem; }