/* l3-account.css — Profile Mini account page (Phase 1 read-only)
   gmad.net Indigo+Honey brand. Tokens defined in shell index.html (--gmad-*).
   Mobile-first / portrait per feedback_vertical_first_everywhere.md.
   Native redesign will replace; keep selectors stable. */

.account-root {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 20px 16px 32px;
  max-width: 640px;
  margin: 0 auto;
  background: transparent;
  min-height: 100%;
  color: var(--gmad-ink, #1A1A30);
  font-family: var(--gmad-stack, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
  box-sizing: border-box;
}

.account-loading,
.account-error,
.account-empty {
  padding: 16px;
  font-size: 14px;
  color: var(--gmad-muted, rgba(26,26,48,0.55));
  text-align: center;
}

.account-error {
  color: #8a1a1a;
  background: #fbeeee;
  border: 1px solid #f0caca;
  border-radius: 8px;
}

.account-section {
  background: var(--gmad-surface, #FFFFFF);
  border: 1px solid var(--gmad-border, rgba(26,26,48,0.08));
  border-radius: 10px;
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  box-shadow: 0 1px 2px var(--gmad-shadow, rgba(26,26,48,0.06));
}

.account-section-title {
  margin: 0 0 6px 0;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--gmad-primary, #2B2D5E);
}

.account-field {
  display: grid;
  grid-template-columns: 7.5em 1fr auto;
  align-items: baseline;
  column-gap: 12px;
  row-gap: 2px;
  font-size: 15px;
  line-height: 1.4;
  padding: 8px 0;
  border-bottom: 1px solid var(--gmad-border, rgba(26,26,48,0.08));
}

.account-field:last-child {
  border-bottom: none;
}

.account-field-label {
  color: var(--gmad-muted, rgba(26,26,48,0.55));
  font-size: 13px;
}

.account-field-value {
  color: var(--gmad-ink, #1A1A30);
  word-break: break-word;
}

.account-field-value.is-empty {
  color: var(--gmad-subtle, rgba(26,26,48,0.40));
  font-style: italic;
}

.account-field-prov,
.account-field-confirmed {
  font-size: 11px;
  color: var(--gmad-muted, rgba(26,26,48,0.55));
  background: var(--gmad-bg-alt, #F8F5EC);
  border: 1px solid var(--gmad-border, rgba(26,26,48,0.08));
  border-radius: 4px;
  padding: 2px 7px;
  text-transform: lowercase;
  white-space: nowrap;
  font-weight: 500;
}

/* Provenance kinds — Indigo+Honey palette */
.account-field-prov[data-prov-kind="self"] {
  background: rgba(74,78,138,0.10);
  color: var(--gmad-primary, #2B2D5E);
  border-color: rgba(74,78,138,0.20);
}
.account-field-prov[data-prov-kind="didit"] {
  background: rgba(74,78,138,0.14);
  color: var(--gmad-primary, #2B2D5E);
  border-color: rgba(74,78,138,0.25);
}
.account-field-prov[data-prov-kind="vouch"] {
  background: rgba(212,168,75,0.16);
  color: var(--gmad-accent-dark, #9A7830);
  border-color: var(--gmad-border-accent, rgba(212,168,75,0.30));
}
.account-field-prov[data-prov-kind="operator"] {
  background: rgba(212,168,75,0.20);
  color: var(--gmad-accent-dark, #9A7830);
  border-color: var(--gmad-border-accent, rgba(212,168,75,0.30));
}
.account-field-prov[data-prov-kind="system"] {
  background: var(--gmad-accent, #D4A84B);
  color: var(--gmad-ink, #1A1A30);
  border-color: var(--gmad-accent-dark, #9A7830);
}

.account-field-confirmed {
  background: rgba(74,78,138,0.10);
  color: var(--gmad-primary, #2B2D5E);
  border-color: rgba(74,78,138,0.20);
}

.account-emergency-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.account-emergency-row {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 10px;
  font-size: 14px;
  color: var(--gmad-ink, #1A1A30);
}

.account-security-blurb {
  margin: 0;
  font-size: 14px;
  color: var(--gmad-muted, rgba(26,26,48,0.55));
  line-height: 1.55;
}

.account-footer {
  text-align: center;
  font-size: 12px;
  color: var(--gmad-subtle, rgba(26,26,48,0.40));
  padding: 8px 0 16px;
}

@media (min-width: 720px) {
  .account-root { padding: 28px 24px 40px; gap: 20px; }
  .account-section { padding: 20px 22px; }
}
