/* THE TEAM DELETE DIALOG — JS/features/team-delete-flow.js.
   ==========================================================================================

   Extracted out of the Admin Console so the Team page can offer the same flow to
   an Organization Owner. Every rule below MOVED from CSS/admin.css, byte for byte,
   removed there in the same change — two sheets defining `.okrc-warn` is the CSS
   spelling of the duplication the extraction was for. Both `admin.html` and
   `team_board.html` load this file.

   The classes are shared with two other admin.html dialogs (OKR Cleanup, organization
   delete) deliberately: one destructive-confirmation recipe, not three disagreeing
   ones. `.acct-delete-*` in CSS/components.css is the first copy of this recipe;
   consolidating the three is future work this file does not take on.

   Every colour is a token, so there is no `@media (prefers-color-scheme)` block
   below, and its absence is the design: the product owner's report on this exact
   gap, verbatim — "make sure every aspect of this view is styled based on the
   design system standards. The text up delete everything is not styled." —
   was an UNCLASSED container, not a wrong class; see `.okrc-cascade-offer` below.
   ========================================================================================== */

/* The warning box both dialogs open with — sys_design-system.md §"Wording in the
   Suite", the destructive-confirmation shape. */
.okrc-warn{
  font-size:13px; line-height:1.55; color:var(--text);
  padding:10px 12px; background:var(--red-soft);
  border:1px solid var(--red); border-radius:var(--radius-sm);
}
.okrc-warn p{ margin:0 0 8px; }
.okrc-warn p:last-child{ margin-bottom:0; }
.okrc-warn ul{ margin:0 0 8px; padding-left:18px; }
.okrc-warn li{ margin:2px 0; }
.okrc-warn b{ color:var(--red-text); }

/* The typed-confirmation label and chip, for dialogs that ask for a phrase rather
   than a click — the same distinction account.js draws for deleting your own account. */
.okrc-phrase-label{
  display:block; font-size:11px; color:var(--text-dim); text-transform:uppercase;
  letter-spacing:.4px; font-weight:600; margin:14px 0 5px;
}
/* `text-transform:none` overrides the uppercase inherited from `.okrc-phrase-label`
   — this chip holds a team's real name, so painting it uppercase would tell the
   reader to type a string the team does not have. Scoped to this class only. */
.okrc-phrase{
  font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size:13px; color:var(--red-text); background:var(--panel-2);
  border:1px solid var(--border-soft); border-radius:4px; padding:1px 5px;
  white-space:nowrap; text-transform:none;
}
.okrc-hint{ font-size:12px; line-height:1.45; color:var(--text-faint); margin-top:6px; }
.okrc-hint.err{ color:var(--red-text); }

/* The cascade offer — this was the unclassed container the owner's quote above
   describes: no `.okrc-warn` red box and no `.orgdel-keep` grey box, ordinary dialog
   body text spaced off from the box above it. The offer BUTTON carries the warning,
   via `.btn.danger` (CSS/components.css), reused rather than invented here. */
.okrc-cascade-offer{ margin-top:10px; }
.okrc-cascade-offer p{ font-size:13px; line-height:1.55; color:var(--text); margin:0 0 10px; }
.okrc-cascade-offer p:last-child{ margin-bottom:0; }

/* A checkbox and its sentence on one line, reusing `.okrc-phrase-label`'s spacing
   but not its uppercase — a class rather than an inline style, so 4d's grep finds it. */
.tdf-keep-choice{
  display:flex; align-items:center; gap:7px;
  text-transform:none; letter-spacing:normal; font-size:13px; font-weight:500;
  color:var(--text); cursor:pointer;
}
.tdf-keep-choice input{ margin:0; flex:0 0 auto; }

/* The consequence of that choice, carrying more weight than the offer paragraph —
   load-bearing text (4d's judgement clause), the line a reader most needs to land on. */
.tdf-keep-note{ font-weight:500; margin:0 0 10px; }
.tdf-keep-note:last-child{ margin-bottom:0; }

/* The refusal that stops the press: `.tdf-keep-note` already carries the shape, this
   adds only the colour — `--red-text`, no box, the same treatment `.okrc-hint.err`
   uses, so it does not compete with `.okrc-warn`'s own red box above it.

   Specificity: `.okrc-cascade-offer p` scores (0,1,1); a bare `.tdf-keep-block` at
   (0,1,0) loses. Matching the offer rule's own shape wins on the later rule rather
   than reaching for `!important`. */
.okrc-cascade-offer p.tdf-keep-block{ color:var(--red-text); }

/* What survives the delete — a separate box, deliberately not red (sys_design-
   system.md §"Wording in the Suite"). `--gray-soft` matches `.aea-verdict`'s own
   resting state; same shape as `.okrc-warn`, only the two colours differ. */
.orgdel-keep{
  font-size:13px; line-height:1.55; color:var(--text);
  padding:10px 12px; margin-top:10px; background:var(--gray-soft);
  border:1px solid var(--border-soft); border-radius:var(--radius-sm);
}
.orgdel-keep p{ margin:0 0 8px; }
.orgdel-keep p:last-child{ margin-bottom:0; }
.orgdel-keep ul{ margin:0; padding-left:18px; }
.orgdel-keep li{ margin:2px 0; }
/* The figure, in ordinary text colour — `.okrc-warn b` is red because that count is a loss. */
.orgdel-keep b{ color:var(--text); }

/* The footer stacks on a phone — a danger button and Cancel side by side below
   520px either overflow or shrink unreadable. CSS/admin.css carries the same rule
   for its own dialogs; this is `#teamDeleteOverlay`'s. */
@media (max-width: 520px){
  #teamDeleteOverlay .modal-footer{ flex-direction:column-reverse; align-items:stretch; }
  #teamDeleteOverlay .modal-footer .btn{ justify-content:center; }
}