/* FA-18 Settings, Appearance, Profile & security, Notifications (boards
   23-26). [data-look="v2"] only. Panes reuse help.css's .help-v2-pane/
   -header/-row/-body shell (frontend/css/look-v2/help.css) -- only new
   selectors below, same technique as FA-10's own help-v2 file. With the
   switch OFF this file has no effect and #scr-settings renders exactly as
   it does today. */

[data-look="v2"] .profile-v2-avatar-row {
  display: flex;
  align-items: center;
  gap: var(--field-space-3);
  padding-bottom: var(--field-space-4);
  border-bottom: 1px solid var(--field-border);
  margin-bottom: var(--field-space-2);
}
[data-look="v2"] .profile-v2-avatar-circle {
  width: 48px;
  height: 48px;
  border-radius: var(--field-radius-pill);
  background: var(--field-raised);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  flex: none;
}
[data-look="v2"] .profile-v2-name { font: var(--field-text-card-heading); }
[data-look="v2"] .profile-v2-role { font: var(--field-text-meta); color: var(--field-text-secondary); }

[data-look="v2"] .profile-v2-palette-grid { display: flex; flex-direction: column; gap: var(--field-space-3); margin-bottom: var(--field-space-4); }
[data-look="v2"] .profile-v2-palette-card {
  display: flex;
  align-items: center;
  gap: var(--field-space-3);
  padding: var(--field-space-3);
  border: 2px solid var(--field-border);
  border-radius: var(--field-radius-card);
  background: var(--field-surface);
  width: 100%;
  text-align: left;
  color: var(--field-text-primary);
}
[data-look="v2"] .profile-v2-palette-card.on { border-color: var(--field-action-fill); }
[data-look="v2"] .profile-v2-palette-swatch {
  width: 64px;
  height: 48px;
  border-radius: 8px;
  object-fit: cover;
  flex: none;
  background: var(--field-page);
}
[data-look="v2"] .profile-v2-palette-text { flex: 1; min-width: 0; }
[data-look="v2"] .profile-v2-palette-name { font: var(--field-text-card-heading); }
[data-look="v2"] .profile-v2-palette-sub { font: var(--field-text-meta); color: var(--field-text-secondary); }
[data-look="v2"] .profile-v2-palette-radio { width: 20px; height: 20px; flex: none; accent-color: var(--field-action-fill); }

/* .profile-v2-signout-sheet reuses .photo-review.pin-dialog-centered
   (style.css, z-index: 70) verbatim -- already above #profile-v2 (help-v2's
   z-index: 65) with no override needed. */
[data-look="v2"] .profile-v2-signout-sheet .mgr-pin-title { margin-bottom: var(--field-space-2); }
[data-look="v2"] .profile-v2-signout-body { font: var(--field-text-body); color: var(--field-text-secondary); margin-bottom: var(--field-space-4); }