/* TaskBlink Data, the Export popover and the phase A Send sheet (DESIGN-BRIEF 2.11, 2.21; BUILD-PLAN 4 A3).
   Tokens only (tb.css), so dark mode follows. Every control is a 44 px target. */

/* ------------------------------------------------------------------ *
 * Export (320 wide, sh-pop, padding 16)
 * ------------------------------------------------------------------ */
.tb-xp-pop { width: 320px; }
.tb-xp { display: flex; flex-direction: column; gap: 6px; }
.tb-xp__title { margin: 0; font: 600 14px/1.4 var(--font); color: var(--ink); }
.tb-xp__text { margin: 0; font: 400 13px/1.45 var(--font); color: var(--ink-2); }
.tb-xp__error { margin: 4px 0 0; }
.tb-xp__go { margin-top: 10px; width: 100%; }

/* ------------------------------------------------------------------ *
 * Send to GoHighLevel (the Sheet of 2.11: 640 wide, sticky footer)
 * ------------------------------------------------------------------ */
.tb-send__form, .tb-send__progress, .tb-send__result { display: flex; flex-direction: column; gap: 20px; margin: 0; }
.tb-send__scope { margin: -12px 0 0; font: 400 14px/1.5 var(--font); color: var(--ink-2); }
.tb-send__lead { margin: 0; font: 400 15px/1.55 var(--font); color: var(--ink-2); }
.tb-send__loading { margin: 0; display: flex; align-items: center; gap: 10px; font: 400 14px/1.5 var(--font); color: var(--ink-3); }

.tb-send__conn {
  display: flex; align-items: center; gap: 12px; min-height: 50px; padding: 6px 12px;
  border: 1px solid var(--line); border-radius: 12px;
}
.tb-send__conn-icon {
  flex: none; width: 36px; height: 36px; border-radius: var(--r-md); background: var(--bg-soft);
  display: inline-flex; align-items: center; justify-content: center; color: var(--ink-3);
}
.tb-send__conn-name { flex: 1; min-width: 0; font: 500 14px/1.4 var(--font); color: var(--ink); }
.tb-send__conn-id { flex: none; font: 400 13px/1.4 var(--font); color: var(--ink-3); }

.tb-send__code {
  display: inline-block; padding: 2px 7px; border-radius: var(--r-xs); background: var(--bg-soft); border: 1px solid var(--line);
  font: 500 12px/1.4 var(--font-mono); color: var(--ink); white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis;
  vertical-align: baseline;
}
.tb-send__note { margin: 0; font: 400 13px/1.6 var(--font); color: var(--ink-2); }
.tb-send__uses { margin: 0; display: flex; align-items: baseline; flex-wrap: wrap; gap: 0 8px; font: 400 13px/1.5 var(--font); color: var(--ink-2); }
.tb-send__uses-label { font: 500 12px/1.4 var(--font); color: var(--ink-3); }
.tb-send__uses .tb-mono { font: 600 12.5px/1 var(--font-mono); color: var(--ink); }
.tb-send__warn {
  margin: 0; display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px; border-radius: var(--r-md);
  background: var(--warn-tint); font: 400 13px/1.5 var(--font); color: var(--ink);
}
.tb-send__warn .tb-icon { flex: none; width: 16px; height: 16px; margin-top: 2px; color: var(--warn); }
.tb-send__warn .tb-link { position: relative; }

.tb-send .tb-sheet__foot { justify-content: space-between; }
.tb-send .tb-sheet__foot > :only-child { margin-left: auto; }
.tb-send__export {
  height: 44px; min-height: 44px; margin-right: auto; padding: 0 4px; border: 0; background: none; cursor: pointer;
  font: 500 14px/1 var(--font); color: var(--brand-text);
}
.tb-send__export:hover { color: var(--brand-ink); text-decoration: underline; }
.tb-send__export:focus-visible { outline: none; box-shadow: var(--ring-brand); border-radius: var(--r-sm); }

.tb-send__progress .tb-progress { height: 6px; border-radius: var(--pill); }
.tb-send__progress .tb-progress__fill { border-radius: var(--pill); }
.tb-send__status { margin: 0; font: 600 15px/22px var(--font); color: var(--ink); }
.tb-send__meta { margin: -8px 0 0; font: 400 13px/1.5 var(--font); color: var(--ink-2); }
.tb-send__meta .tb-mono { font-weight: 600; color: var(--ink); }
.tb-send__done, .tb-send__stopped { margin: 0; display: flex; align-items: center; gap: 10px; font: 600 15px/22px var(--font); color: var(--ink); }
.tb-send__done .tb-icon { flex: none; color: var(--good); }
.tb-send__stopped .tb-icon { flex: none; color: var(--ink-3); }

/* A link that stands alone on a help line still gets a 44 tall hit area */
.tb-send .tb-field__help > .tb-link:only-child { position: relative; display: inline-block; }
.tb-send .tb-field__help > .tb-link:only-child::after {
  content: ""; position: absolute; left: 50%; top: 50%;
  width: 100%; height: 100%; min-width: 44px; min-height: 44px; transform: translate(-50%, -50%);
}
