/* ================= PROFILE & ACCOUNT → ORGANIZATION — pane-local styling =================
   Everything shared (card, header band, row, button, select, input) comes from
   alt-settings-stride.css and alt-components.css. This file adds only the identity row (mark +
   name) and the blocked-state note; every color is a `--stg-*` token, nothing restates one. */

.org-profile-id{
  display:flex;
  align-items:center;
  gap:10px;
  padding:2px 0 12px;
}
.org-profile-mark{
  flex:0 0 auto;
  width:30px;
  height:30px;
  /* `--stg-r`, not a literal 8px — alt-org-settings.css's `.org-mark-preview` rounds the same
     concept the same way; the value isn't among the declared radii (6/9/14, 7/10) either. */
  border-radius:var(--stg-r);
  object-fit:contain;
  background:var(--stg-surface-2);
}
/* The placeholder — no mark yet — reuses org-settings.js's initials-avatar idiom
   (`.org-owner-av`), sized to match the image case so the row never jumps. Decorative only. */
.org-profile-mark-ph{
  flex:0 0 auto;
  width:30px;
  height:30px;
  /* Same `--stg-r` reasoning as `.org-profile-mark` above — not a literal 8px. */
  border-radius:var(--stg-r);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  font-weight:700;
  letter-spacing:.02em;
  color:#fff;
  /* `--accent-fill`, not `--accent` — white on `--accent` fails AA in dark (3.677:1); this role
     measures 4.518:1. Square by design (an org mark, not `.a-av`'s circle) — kept its own
     geometry rather than growing a "square sometimes" modifier onto a shared avatar. */
  background:var(--accent-fill);
}
.org-profile-name{
  font-size:15px;
  font-weight:650;
  color:var(--stg-text);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* "Transfer ownership before leaving" — warm, not red: this explains a refusal the server
   already made, so it borrows the Owners card's warning tone, not the Leave button's red. */
.org-profile-blocked{
  color:var(--stg-c-email, #ffc45d);
  font-weight:600;
}

.org-profile-invite-note{ margin-bottom:6px; }

/* ---------- THE FINAL-OWNER BLOCK'S RHYTHM, MEASURED RATHER THAN ADJUSTED ----------
   The "rule" under the transfer row is `.stg-row`'s own border-bottom, which only pads ABOVE
   itself — nothing spaces what comes after, which is why the controls read as touching. Given
   their own flex row with the filter rows' 8px gap instead of inline spacing. */
.org-profile-transfer{
  display:flex; align-items:center; flex-wrap:wrap; gap:8px; width:100%;
}
.org-profile-transfer > select{ min-width:160px; }

/* 14px below the rule against its own 13px above it — near-symmetry reads as a separator, not a lid. */
.org-profile-actions{ margin-top:14px; }

/* ---- Create an Organization: a name and a button, with room between them ----
   OWNER: "create some padding in the organization tab. The controls are too tight e.g. text box
   and button."
   Reuses `.org-profile-transfer`'s flex-row shape (8px gap, wraps) rather than a third spacing
   idiom; the warning gets `flex-basis:100%` so it never squeezes between field and button. */
.org-profile-create{
  display:flex; align-items:center; flex-wrap:wrap; gap:8px; width:100%;
}
.org-profile-create > .a-input{ flex:1 1 220px; min-width:0; }
.org-profile-create > .a-hint{ flex:1 1 100%; margin:0; }