/* TradeLead C — native business overlays
   These four workflows sit outside #workspaceShell, so they own their complete
   layout here instead of borrowing any retired ui-v4 component rules. */

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #emailCampaignEditorModal, #whatsappBroadcastModal, #billingCheckoutModal) {
  --cm-blue: #087cf0;
  --cm-sky: #35b8ff;
  --cm-deep: #10283f;
  --cm-copy: #36566d;
  --cm-muted: #647a90;
  --cm-line: #c2dceb;
  --cm-line-soft: #deedf5;
  --cm-ice: #eaf7ff;
  --cm-cloud: #f7fbfe;
  --cm-coral: #ff6b57;
  --cm-coral-deep: #b94d43;
  --cm-coral-soft: #fff3f0;
  color: var(--cm-deep);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #emailCampaignEditorModal, #whatsappBroadcastModal, #billingCheckoutModal)
  :where(*, *::before, *::after) {
  box-sizing: border-box;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #emailCampaignEditorModal, #whatsappBroadcastModal, #billingCheckoutModal)
  :where(h2, h3, h4, p, pre, dl, dt, dd) {
  margin: 0;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #emailCampaignEditorModal, #whatsappBroadcastModal, #billingCheckoutModal)
  :where(label) {
  min-width: 0;
  display: grid;
  gap: 7px;
  color: var(--cm-copy);
  font-size: 13px;
  font-weight: 720;
  line-height: 1.45;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #emailCampaignEditorModal, #whatsappBroadcastModal, #billingCheckoutModal)
  :where(.grid) {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #emailCampaignEditorModal, #whatsappBroadcastModal, #billingCheckoutModal)
  :where(.panel-kicker, .billing-eyebrow) {
  display: block;
  color: var(--cm-blue);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .14em;
  line-height: 1.4;
  text-transform: uppercase;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #emailCampaignEditorModal, #whatsappBroadcastModal, #billingCheckoutModal)
  .modal-head {
  flex: 0 0 auto;
  min-height: 92px;
  padding: 18px 22px;
  align-items: center;
  border-bottom-color: var(--cm-line);
  background: linear-gradient(90deg, #fff 0%, var(--cm-cloud) 100%);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #emailCampaignEditorModal, #whatsappBroadcastModal, #billingCheckoutModal)
  .modal-head > div {
  min-width: 0;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #emailCampaignEditorModal, #whatsappBroadcastModal, #billingCheckoutModal)
  .modal-head h2 {
  margin-top: 4px;
  color: var(--cm-deep);
  font-size: clamp(20px, 2vw, 24px);
  font-weight: 820;
  line-height: 1.2;
  letter-spacing: -.035em;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #emailCampaignEditorModal, #whatsappBroadcastModal, #billingCheckoutModal)
  .modal-head p {
  max-width: 820px;
  margin-top: 6px;
  color: var(--cm-muted);
  font-size: 12px;
  line-height: 1.55;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #emailCampaignEditorModal, #whatsappBroadcastModal, #billingCheckoutModal)
  .modal-head .icon-button {
  flex: 0 0 auto;
  border-color: var(--cm-line);
  color: var(--cm-copy);
  background: #fff;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #emailCampaignEditorModal, #whatsappBroadcastModal, #billingCheckoutModal)
  .modal-head .icon-button:hover {
  border-color: var(--cm-sky);
  color: var(--cm-blue);
  background: var(--cm-ice);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #emailCampaignEditorModal, #whatsappBroadcastModal, #billingCheckoutModal)
  .modal-foot {
  flex: 0 0 auto;
  min-height: 72px;
  padding: 14px 22px;
  border-top-color: var(--cm-line);
  background: var(--cm-cloud);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #emailCampaignEditorModal, #whatsappBroadcastModal, #billingCheckoutModal)
  :where(button:disabled, input:disabled, select:disabled, textarea:disabled) {
  cursor: not-allowed;
  opacity: .5;
}

/* Shared recipient and composition primitives. */
body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-section-heading {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 11px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-section-heading > span {
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: #fff;
  background: var(--cm-blue);
  font-size: 11px;
  font-weight: 850;
  box-shadow: 0 5px 0 #caeaff;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-section-heading > div {
  min-width: 0;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #batchEmailModal .batch-section-heading > button {
  min-height: 34px;
  margin-left: auto;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid #8bcaf1;
  border-radius: 8px;
  color: #075f9d;
  background: #edf8ff;
  font-size: 11px;
  font-weight: 780;
  white-space: nowrap;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #batchEmailModal .batch-section-heading > button svg {
  width: 14px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-section-heading :where(strong, small) {
  display: block;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-section-heading strong {
  color: var(--cm-deep);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.35;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-section-heading small {
  margin-top: 3px;
  overflow: hidden;
  color: var(--cm-muted);
  font-size: 11px;
  font-weight: 540;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-recipient-search {
  position: relative;
  margin-top: 16px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-recipient-search svg {
  position: absolute;
  top: 50%;
  left: 12px;
  z-index: 1;
  width: 16px;
  height: 16px;
  color: #7b95aa;
  pointer-events: none;
  transform: translateY(-50%);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-recipient-search input {
  padding-left: 38px;
  background: #fff;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-recipient-tools {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid var(--cm-line-soft);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-recipient-tools label {
  display: flex;
  grid-template-columns: none;
  align-items: center;
  gap: 8px;
  color: var(--cm-copy);
  font-size: 12px;
  cursor: pointer;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal)
  :where(.batch-recipient-tools, .batch-recipient-row, .batch-final-confirm, .broadcast-confirmation)
  input[type="checkbox"] {
  width: 17px;
  min-width: 17px;
  height: 17px;
  min-height: 17px;
  padding: 0;
  accent-color: var(--cm-blue);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-recipient-tools > strong {
  min-width: 32px;
  min-height: 26px;
  padding: 3px 8px;
  display: grid;
  place-items: center;
  border: 1px solid #a7d7f3;
  border-radius: 999px;
  color: var(--cm-blue);
  background: var(--cm-ice);
  font-size: 11px;
  font-weight: 850;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-recipient-list {
  min-height: 180px;
  overflow-y: auto;
  scrollbar-color: #a9cfdf transparent;
  scrollbar-width: thin;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-recipient-row {
  min-width: 0;
  min-height: 70px;
  padding: 10px 7px;
  display: grid;
  grid-template-columns: 18px 36px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid var(--cm-line-soft);
  color: var(--cm-copy);
  background: transparent;
  cursor: pointer;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-recipient-row:hover {
  background: #f3faff;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-recipient-row.selected {
  background: var(--cm-ice);
  box-shadow: inset 3px 0 0 var(--cm-blue);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-recipient-row.disabled {
  opacity: .48;
  cursor: not-allowed;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-recipient-avatar {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border: 1px solid #b8ddf1;
  border-radius: 9px;
  color: var(--cm-blue);
  background: #fff;
  font-size: 11px;
  font-weight: 850;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-recipient-row > span:last-of-type {
  min-width: 0;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-recipient-row :where(strong, small, em) {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-recipient-row strong {
  color: var(--cm-deep);
  font-size: 12px;
  line-height: 1.35;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-recipient-row :where(small, em) {
  margin-top: 4px;
  color: var(--cm-muted);
  font-size: 10px;
  font-style: normal;
  font-weight: 520;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #batchEmailModal .batch-recipient-row.fallback-name em {
  width: max-content;
  max-width: 100%;
  margin-top: 5px;
  padding: 2px 6px;
  border-radius: 999px;
  color: var(--cm-coral-deep);
  background: var(--cm-coral-soft);
  font-size: 9px;
  font-weight: 760;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-recipient-empty {
  padding: 42px 14px;
  display: grid;
  justify-items: center;
  gap: 7px;
  color: var(--cm-muted);
  font-size: 12px;
  line-height: 1.6;
  text-align: center;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-recipient-empty svg {
  width: 28px;
  height: 28px;
  color: var(--cm-sky);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-variable-row {
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 6px;
  overflow-x: auto;
  scrollbar-width: thin;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-variable-row > span {
  margin-right: 3px;
  color: var(--cm-muted);
  font-size: 11px;
  white-space: nowrap;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-variable-row button {
  min-height: 30px;
  padding: 0 10px;
  flex: 0 0 auto;
  border-color: #b8d9eb;
  color: #2e6588;
  background: #f5fbff;
  font-size: 11px;
  white-space: nowrap;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #whatsappBroadcastModal) .batch-email-preview {
  min-height: 132px;
  max-height: 250px;
  margin: 9px 0 0;
  padding: 14px 15px;
  overflow: auto;
  border: 1px solid var(--cm-line);
  border-radius: 9px;
  color: #29475d;
  background: #fbfdff;
  font: 12px/1.7 ui-monospace, SFMono-Regular, Consolas, monospace;
  white-space: pre-wrap;
  word-break: break-word;
}

/* Batch email composer. */
body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-email-dialog {
  width: min(1180px, calc(100vw - 32px));
  height: min(850px, calc(100dvh - 32px));
  max-height: calc(100dvh - 32px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-email-body {
  min-height: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 320px minmax(0, 1fr);
  overflow: hidden;
  background: #fff;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #batchEmailModal :is(.batch-recipient-panel, .batch-content-panel) {
  min-width: 0;
  min-height: 0;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-recipient-panel {
  padding: 20px 16px 16px;
  display: grid;
  grid-template-rows: auto auto auto minmax(0, 1fr);
  border-right: 1px solid var(--cm-line);
  background: var(--cm-cloud);
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-content-panel {
  padding: 22px 24px 28px;
  overflow-y: auto;
  scrollbar-color: #a9cfdf transparent;
  scrollbar-width: thin;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-personalization-note {
  margin: 17px 0 14px;
  padding: 12px 14px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  border: 1px solid #b7ddf1;
  border-radius: 9px;
  color: #285c7b;
  background: var(--cm-ice);
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-personalization-note svg {
  width: 19px;
  height: 19px;
  flex: 0 0 auto;
  color: var(--cm-blue);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #batchEmailModal .batch-personalization-note :where(strong, span) {
  display: block;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-personalization-note strong {
  color: var(--cm-deep);
  font-size: 12px;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-personalization-note span {
  margin-top: 4px;
  color: var(--cm-copy);
  font-size: 11px;
  line-height: 1.5;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-campaign-product small {
  display: block;
  margin-top: 4px;
  color: var(--cm-muted);
  font-size: 10px;
  font-weight: 520;
  line-height: 1.5;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-campaign-product code {
  padding: 2px 5px;
  border: 1px solid #b8d9eb;
  border-radius: 4px;
  color: var(--cm-blue);
  background: #f4fbff;
  font: 10px/1.4 ui-monospace, SFMono-Regular, Consolas, monospace;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal .batch-sequence-tabs, #emailCampaignEditorModal .campaign-edit-step-tabs) {
  margin-top: 16px;
  padding-bottom: 13px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  border-bottom: 1px solid var(--cm-line-soft);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal .batch-sequence-tabs, #emailCampaignEditorModal .campaign-edit-step-tabs) button {
  min-width: 0;
  min-height: 58px;
  padding: 8px 10px;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 9px;
  align-items: center;
  border-color: var(--cm-line);
  color: var(--cm-copy);
  background: var(--cm-cloud);
  text-align: left;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal .batch-sequence-tabs, #emailCampaignEditorModal .campaign-edit-step-tabs) button > span {
  grid-row: 1 / 3;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #507086;
  background: #e3eff6;
  font-size: 10px;
  font-weight: 850;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal .batch-sequence-tabs, #emailCampaignEditorModal .campaign-edit-step-tabs)
  button :where(strong, small) {
  min-width: 0;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal .batch-sequence-tabs, #emailCampaignEditorModal .campaign-edit-step-tabs) button strong {
  color: var(--cm-deep);
  font-size: 12px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal .batch-sequence-tabs, #emailCampaignEditorModal .campaign-edit-step-tabs) button small {
  color: var(--cm-muted);
  font-size: 10px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal .batch-sequence-tabs, #emailCampaignEditorModal .campaign-edit-step-tabs) button.active {
  border-color: var(--cm-sky);
  color: var(--cm-blue);
  background: var(--cm-ice);
  box-shadow: inset 0 -3px 0 var(--cm-blue);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal .batch-sequence-tabs, #emailCampaignEditorModal .campaign-edit-step-tabs) button.active > span {
  color: #fff;
  background: var(--cm-blue);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #emailCampaignEditorModal .campaign-edit-step-tabs button.sent {
  opacity: .52;
  cursor: not-allowed;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-step-context {
  margin-top: 11px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-step-context span {
  color: var(--cm-deep);
  font-size: 12px;
  font-weight: 780;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-step-context small {
  color: var(--cm-muted);
  font-size: 10px;
  line-height: 1.45;
  text-align: right;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-content-panel > label {
  margin-top: 12px;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal #batchEmailBody {
  min-height: 188px;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-signature-note {
  margin-top: 9px;
  padding: 10px 12px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  border-left: 3px solid var(--cm-sky);
  color: var(--cm-muted);
  background: var(--cm-cloud);
  font-size: 11px;
  line-height: 1.5;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-signature-note strong {
  min-width: 0;
  overflow: hidden;
  color: var(--cm-copy);
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-draft-row {
  min-height: 40px;
  margin-top: 4px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #batchEmailModal .batch-draft-row :where(span, button) {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--cm-muted);
  font-size: 11px;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-draft-row button {
  min-height: 30px;
  padding: 0 8px;
  border-color: transparent;
  color: var(--cm-coral-deep);
  background: transparent;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal .batch-preview-head, #whatsappBroadcastModal .broadcast-preview-head) {
  margin-top: 18px;
  padding-top: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-top: 1px solid var(--cm-line-soft);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal .batch-preview-head, #whatsappBroadcastModal .broadcast-preview-head) > div {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal .batch-preview-head, #whatsappBroadcastModal .broadcast-preview-head) span {
  color: var(--cm-muted);
  font-size: 11px;
  white-space: nowrap;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal .batch-preview-head, #whatsappBroadcastModal .broadcast-preview-head) strong {
  min-width: 0;
  overflow: hidden;
  color: var(--cm-deep);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal .batch-preview-head, #whatsappBroadcastModal .broadcast-preview-head) .icon-button {
  width: 32px;
  min-width: 32px;
  height: 32px;
  min-height: 32px;
  padding: 0;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-recipient-personalization {
  margin-top: 10px;
  padding: 14px;
  border: 1px solid #b8d9eb;
  border-radius: 9px;
  background: #f8fcff;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-recipient-personalization-head {
  margin-bottom: 11px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #batchEmailModal .batch-recipient-personalization-head :where(strong, span) {
  display: block;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #batchEmailModal .batch-recipient-personalization-head strong {
  color: var(--cm-deep);
  font-size: 12px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #batchEmailModal .batch-recipient-personalization-head span {
  margin-top: 3px;
  color: var(--cm-muted);
  font-size: 10px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #batchEmailModal .batch-recipient-personalization-head button {
  min-height: 32px;
  padding: 0 10px;
  font-size: 10px;
  white-space: nowrap;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #emailCampaignEditorModal) .batch-email-validation {
  min-height: 40px;
  margin-top: 9px;
  padding: 10px 12px;
  display: flex;
  align-items: center;
  border-left: 3px solid var(--cm-sky);
  color: var(--cm-copy);
  background: var(--cm-cloud);
  font-size: 11px;
  line-height: 1.55;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #emailCampaignEditorModal) .batch-email-validation.ready {
  border-left-color: var(--cm-blue);
  color: #245e84;
  background: var(--cm-ice);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal, #emailCampaignEditorModal) .batch-email-validation:is(.warning, .error) {
  border-left-color: var(--cm-coral);
  color: var(--cm-coral-deep);
  background: var(--cm-coral-soft);
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-send-settings {
  margin-top: 19px;
  padding-top: 17px;
  border-top: 1px solid var(--cm-line-soft);
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-send-settings > .grid {
  margin-top: 14px;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-mail-summary {
  margin-top: 13px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-mail-stat {
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--cm-line-soft);
  border-radius: 8px;
  background: var(--cm-cloud);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #batchEmailModal .batch-mail-stat :where(span, strong) {
  display: block;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-mail-stat span {
  color: var(--cm-muted);
  font-size: 10px;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-mail-stat strong {
  margin-top: 5px;
  color: var(--cm-deep);
  font-size: 17px;
  line-height: 1.25;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-email-capacity {
  margin-top: 11px;
  padding: 12px 13px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  border: 1px solid var(--cm-line);
  border-radius: 9px;
  color: var(--cm-copy);
  background: var(--cm-cloud);
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-email-capacity > svg {
  width: 19px;
  height: 19px;
  flex: 0 0 auto;
  color: var(--cm-blue);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #batchEmailModal .batch-email-capacity :where(strong, span) {
  display: block;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-email-capacity strong {
  color: var(--cm-deep);
  font-size: 12px;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-email-capacity span {
  margin-top: 3px;
  color: var(--cm-muted);
  font-size: 10px;
  line-height: 1.5;
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-email-capacity.ready {
  border-color: #a7d7f3;
  background: var(--cm-ice);
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-email-capacity.warning {
  border-color: #f0b4ac;
  background: var(--cm-coral-soft);
}

body:is([data-surface="workspace"], [data-surface="admin"]) #batchEmailModal .batch-email-capacity.warning > svg {
  color: var(--cm-coral);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal .batch-final-confirm, #whatsappBroadcastModal .broadcast-confirmation) {
  margin-top: 13px;
  padding: 12px 13px;
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: flex-start;
  gap: 10px;
  border: 1px solid var(--cm-line);
  border-radius: 9px;
  background: #fbfdff;
  cursor: pointer;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal .batch-final-confirm, #whatsappBroadcastModal .broadcast-confirmation):has(input:checked) {
  border-color: var(--cm-sky);
  background: var(--cm-ice);
  box-shadow: inset 3px 0 0 var(--cm-blue);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal .batch-final-confirm, #whatsappBroadcastModal .broadcast-confirmation)
  :where(strong, small) {
  display: block;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal .batch-final-confirm, #whatsappBroadcastModal .broadcast-confirmation) strong {
  color: var(--cm-deep);
  font-size: 12px;
  line-height: 1.45;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal .batch-final-confirm, #whatsappBroadcastModal .broadcast-confirmation) small {
  margin-top: 4px;
  color: var(--cm-muted);
  font-size: 10px;
  font-weight: 520;
  line-height: 1.5;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal .batch-email-foot, #whatsappBroadcastModal .whatsapp-broadcast-foot) > span {
  margin-right: auto;
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--cm-muted);
  font-size: 11px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  :is(#batchEmailModal .batch-email-foot, #whatsappBroadcastModal .whatsapp-broadcast-foot) > span svg {
  width: 16px;
  height: 16px;
  color: var(--cm-blue);
}

/* Existing email campaign editor. */
body:is([data-surface="workspace"], [data-surface="admin"])
  #emailCampaignEditorModal .email-campaign-editor-dialog {
  width: min(780px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #emailCampaignEditorModal .email-campaign-editor-body {
  min-height: 0;
  padding: 22px;
  display: grid;
  gap: 13px;
  overflow-y: auto;
  scrollbar-color: #a9cfdf transparent;
  scrollbar-width: thin;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #emailCampaignEditorModal .campaign-edit-step-tabs {
  margin-top: 0;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #emailCampaignEditorModal #campaignEditBody {
  min-height: 230px;
  line-height: 1.65;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #emailCampaignEditorModal .campaign-edit-schedule {
  margin-top: 2px;
}

/* WhatsApp broadcast composer and history. */
body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-dialog {
  width: min(1180px, calc(100vw - 32px));
  height: min(860px, calc(100dvh - 32px));
  max-height: calc(100dvh - 32px);
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  overflow: hidden;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-tabs {
  min-height: 50px;
  padding: 0 22px;
  display: flex;
  align-items: stretch;
  gap: 4px;
  border-bottom: 1px solid var(--cm-line);
  background: #fff;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-tabs button {
  position: relative;
  min-height: 49px;
  padding: 0 14px;
  border: 0;
  border-radius: 0;
  color: var(--cm-muted);
  background: transparent;
  font-size: 12px;
  box-shadow: none;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-tabs button::after {
  position: absolute;
  right: 12px;
  bottom: -1px;
  left: 12px;
  height: 3px;
  content: "";
  background: transparent;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-tabs button.active {
  color: var(--cm-blue);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-tabs button.active::after {
  background: var(--cm-blue);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-tabs svg {
  width: 16px;
  height: 16px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .tab-count {
  min-width: 20px;
  min-height: 20px;
  padding: 2px 6px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: #fff;
  background: var(--cm-coral);
  font-size: 10px;
  line-height: 1;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-modal-body {
  min-height: 0;
  padding: 0;
  overflow: hidden;
  background: var(--cm-cloud);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-pane {
  height: 100%;
  min-height: 0;
  overflow-y: auto;
  scrollbar-color: #a9cfdf transparent;
  scrollbar-width: thin;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-pane.hidden {
  display: none !important;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-risk {
  margin: 17px 20px 0;
  padding: 14px 15px;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 12px;
  border: 1px solid #f0b4ac;
  border-left: 4px solid var(--cm-coral);
  border-radius: 9px;
  color: var(--cm-coral-deep);
  background: var(--cm-coral-soft);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-risk > svg {
  width: 23px;
  height: 23px;
  color: var(--cm-coral);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-risk strong {
  display: block;
  color: var(--cm-coral-deep);
  font-size: 13px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-risk p {
  margin: 5px 0 7px;
  font-size: 11px;
  line-height: 1.65;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-risk a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--cm-coral-deep);
  font-size: 11px;
  font-weight: 780;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-risk a svg {
  width: 13px;
  height: 13px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-connection {
  min-height: 46px;
  margin: 11px 20px 0;
  padding: 10px 13px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--cm-line);
  border-radius: 9px;
  color: var(--cm-copy);
  background: #fff;
  font-size: 11px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-connection > svg {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  color: var(--cm-blue);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-connection span {
  min-width: 0;
  flex: 1 1 auto;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-connection strong {
  margin-right: 6px;
  color: var(--cm-deep);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-connection.warning {
  border-color: #f0b4ac;
  color: var(--cm-coral-deep);
  background: var(--cm-coral-soft);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-connection.warning > svg {
  color: var(--cm-coral);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-connection button {
  min-height: 30px;
  padding: 0 10px;
  font-size: 10px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-compose {
  min-height: 520px;
  margin-top: 11px;
  display: grid;
  grid-template-columns: 320px minmax(0, 1fr);
  border-top: 1px solid var(--cm-line);
  background: #fff;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-recipient-panel {
  min-width: 0;
  min-height: 0;
  padding: 19px 16px 16px;
  display: grid;
  grid-template-rows: auto auto auto minmax(0, 1fr);
  border-right: 1px solid var(--cm-line);
  background: var(--cm-cloud);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-recipient-list {
  max-height: 620px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-consent-badge {
  grid-column: 3;
  justify-self: start;
  margin-top: -5px;
  padding: 3px 6px;
  border: 1px solid #a7d7f3;
  border-radius: 999px;
  color: var(--cm-blue);
  background: var(--cm-ice);
  font-size: 9px;
  font-weight: 800;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-message-panel {
  min-width: 0;
  padding: 20px 24px 28px;
  overflow-y: auto;
  background: #fff;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-message-panel > label {
  margin-top: 13px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal #whatsappBroadcastBody {
  min-height: 160px;
  line-height: 1.65;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-message-preview {
  min-height: 112px;
  max-height: 210px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-controls {
  margin-top: 18px;
  padding-top: 17px;
  border-top: 1px solid var(--cm-line-soft);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-controls > :is(.grid, label) {
  margin-top: 13px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-confirmation.danger {
  border-color: #f0b4ac;
  background: var(--cm-coral-soft);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-confirmation.danger:has(input:checked) {
  border-color: var(--cm-coral);
  background: var(--cm-coral-soft);
  box-shadow: inset 3px 0 0 var(--cm-coral);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-foot > span svg {
  color: var(--cm-coral);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-history-head {
  padding: 21px 22px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-history-head h3 {
  margin-top: 4px;
  color: var(--cm-deep);
  font-size: 20px;
  line-height: 1.25;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-history-head p {
  max-width: 820px;
  margin-top: 5px;
  color: var(--cm-muted);
  font-size: 11px;
  line-height: 1.6;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-history-list {
  padding: 0 22px 24px;
  display: grid;
  gap: 12px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-campaign {
  padding: 15px 16px;
  border: 1px solid var(--cm-line);
  border-radius: 10px;
  background: #fff;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-campaign.attention {
  border-left: 4px solid var(--cm-coral);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-campaign > :is(header, footer) {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-campaign > header span:first-child {
  display: block;
  color: var(--cm-muted);
  font-size: 10px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-campaign h4 {
  margin-top: 4px;
  color: var(--cm-deep);
  font-size: 14px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-campaign .badge {
  min-height: 25px;
  padding: 4px 8px;
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--cm-line);
  border-radius: 999px;
  color: var(--cm-copy);
  background: #edf4f8;
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-campaign .badge.good {
  border-color: #a7d7f3;
  color: var(--cm-blue);
  background: var(--cm-ice);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-campaign .badge:is(.warn, .bad) {
  border-color: #f0b4ac;
  color: var(--cm-coral-deep);
  background: var(--cm-coral-soft);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-progress {
  height: 6px;
  margin-top: 13px;
  overflow: hidden;
  border-radius: 999px;
  background: #e2eef5;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-progress > span {
  display: block;
  height: 100%;
  background: var(--cm-blue);
  transition: width 220ms ease;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-campaign-stats {
  margin-top: 12px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--cm-line-soft);
  border-radius: 8px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-campaign-stats > div {
  padding: 10px 11px;
  border-right: 1px solid var(--cm-line-soft);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-campaign-stats > div:last-child {
  border-right: 0;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-campaign-stats :where(span, strong) {
  display: block;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-campaign-stats span {
  color: var(--cm-muted);
  font-size: 10px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-campaign-stats strong {
  margin-top: 4px;
  color: var(--cm-deep);
  font-size: 17px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-campaign-meta {
  margin-top: 11px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  color: var(--cm-muted);
  font-size: 10px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-campaign-meta span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-campaign-meta svg {
  width: 13px;
  height: 13px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal :is(.broadcast-campaign-error, .broadcast-unknown-list) {
  margin-top: 11px;
  padding: 10px 11px;
  border: 1px solid #f0b4ac;
  border-radius: 8px;
  color: var(--cm-coral-deep);
  background: var(--cm-coral-soft);
  font-size: 10px;
  line-height: 1.55;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-campaign-error {
  display: flex;
  align-items: flex-start;
  gap: 7px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-campaign-error svg {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-unknown-list > strong {
  color: var(--cm-coral-deep);
  font-size: 11px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-unknown-list > div {
  min-width: 0;
  margin-top: 9px;
  padding-top: 9px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-top: 1px solid #f2c7c1;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-unknown-list button {
  min-height: 30px;
  padding: 0 9px;
  font-size: 10px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-campaign > footer {
  margin-top: 12px;
  padding-top: 11px;
  align-items: center;
  border-top: 1px solid var(--cm-line-soft);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-campaign details {
  min-width: 0;
  flex: 1 1 auto;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .whatsapp-broadcast-campaign summary {
  color: #2e6588;
  font-size: 11px;
  font-weight: 780;
  cursor: pointer;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-recipient-status-list {
  max-height: 260px;
  margin-top: 9px;
  overflow-y: auto;
  border: 1px solid var(--cm-line-soft);
  border-radius: 8px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-recipient-status-list > div {
  padding: 9px 10px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 5px 12px;
  border-bottom: 1px solid var(--cm-line-soft);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-recipient-status-list > div:last-child {
  border-bottom: 0;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-recipient-status-list :where(strong, small, em) {
  display: block;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-recipient-status-list strong {
  color: var(--cm-deep);
  font-size: 11px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-recipient-status-list :where(small, em) {
  margin-top: 3px;
  color: var(--cm-muted);
  font-size: 9px;
  font-style: normal;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-recipient-status-list em {
  grid-column: 1 / -1;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-recipient-status {
  padding: 4px 7px;
  border-radius: 999px;
  color: var(--cm-copy);
  background: #edf4f8;
  font-size: 9px;
  font-weight: 800;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-recipient-status:is(.sent, .delivered, .read) {
  color: var(--cm-blue);
  background: var(--cm-ice);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-recipient-status:is(.failed, .unknown) {
  color: var(--cm-coral-deep);
  background: var(--cm-coral-soft);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-campaign-actions {
  display: flex;
  gap: 7px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #whatsappBroadcastModal .broadcast-campaign-actions button {
  min-height: 32px;
  padding: 0 10px;
  font-size: 10px;
}

/* Billing confirmation. */
body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-dialog {
  width: min(680px, calc(100vw - 32px));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .modal-body {
  padding: 22px;
  overflow-y: auto;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-summary {
  overflow: hidden;
  border: 1px solid var(--cm-line);
  border-radius: 10px;
  background: #fff;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-plan {
  padding: 17px;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: center;
  gap: 13px;
  border-bottom: 1px solid var(--cm-line-soft);
  background: linear-gradient(90deg, var(--cm-ice), #fff);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-plan .billing-plan-icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: 1px solid #a7d7f3;
  border-radius: 10px;
  color: var(--cm-blue);
  background: #fff;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-plan .billing-plan-icon svg {
  width: 21px;
  height: 21px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-plan :where(span, strong, small) {
  display: block;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-plan span {
  color: var(--cm-blue);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-plan strong {
  margin-top: 2px;
  color: var(--cm-deep);
  font-size: 16px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-plan small {
  margin-top: 4px;
  color: var(--cm-muted);
  font-size: 11px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-summary dl {
  padding: 9px 17px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-summary dl > div {
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border-bottom: 1px solid var(--cm-line-soft);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-summary dl > div:last-child {
  border-bottom: 0;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-summary dt {
  color: var(--cm-muted);
  font-size: 11px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-summary dd {
  color: var(--cm-deep);
  font-size: 12px;
  font-weight: 780;
  text-align: right;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-summary dd.saving {
  color: var(--cm-blue);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-summary .total dd {
  color: var(--cm-blue);
  font-size: 19px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-flow {
  margin-top: 17px;
  padding: 14px 15px;
  display: grid;
  grid-template-columns: 1fr 20px 1fr 20px 1fr;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--cm-line);
  border-radius: 10px;
  background: var(--cm-cloud);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-flow > div {
  min-width: 0;
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: center;
  gap: 2px 8px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-flow > div > span {
  grid-row: 1 / 3;
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: var(--cm-blue);
  font-size: 10px;
  font-weight: 850;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-flow :where(strong, small) {
  min-width: 0;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-flow strong {
  color: var(--cm-deep);
  font-size: 11px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-flow small {
  color: var(--cm-muted);
  font-size: 9px;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-checkout-flow > svg {
  width: 14px;
  height: 14px;
  justify-self: center;
  color: #83a9bf;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-terms {
  margin-top: 15px;
  padding: 13px 14px;
  display: grid;
  grid-template-columns: 17px minmax(0, 1fr);
  align-items: flex-start;
  gap: 10px;
  border: 1px solid var(--cm-line);
  border-radius: 9px;
  color: var(--cm-copy);
  background: #fff;
  font-size: 11px;
  font-weight: 540;
  cursor: pointer;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-terms:has(input:checked) {
  border-color: var(--cm-sky);
  background: var(--cm-ice);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-terms input {
  width: 17px;
  min-width: 17px;
  height: 17px;
  min-height: 17px;
  padding: 0;
  accent-color: var(--cm-blue);
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .billing-terms a {
  color: var(--cm-blue);
  font-weight: 760;
}

body:is([data-surface="workspace"], [data-surface="admin"])
  #billingCheckoutModal .feedback-status {
  min-height: 18px;
  margin-top: 12px;
  color: var(--cm-muted);
  font-size: 11px;
  line-height: 1.5;
}

/* Responsive ownership stays inside each C-native overlay. */
@media (max-width: 1040px) {
  body:is([data-surface="workspace"], [data-surface="admin"])
    :is(#batchEmailModal .batch-email-body, #whatsappBroadcastModal .whatsapp-broadcast-compose) {
    grid-template-columns: 285px minmax(0, 1fr);
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    :is(#batchEmailModal .batch-content-panel, #whatsappBroadcastModal .broadcast-message-panel) {
    padding-right: 19px;
    padding-left: 19px;
  }
}

@media (max-width: 820px) {
  body:is([data-surface="workspace"], [data-surface="admin"])
    :is(#batchEmailModal .batch-email-dialog, #whatsappBroadcastModal .whatsapp-broadcast-dialog) {
    width: 100%;
    height: calc(100dvh - 24px);
    max-height: calc(100dvh - 24px);
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    :is(#batchEmailModal .batch-email-body, #whatsappBroadcastModal .whatsapp-broadcast-compose) {
    display: block;
    overflow-y: auto;
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    :is(#batchEmailModal .batch-recipient-panel, #whatsappBroadcastModal .broadcast-recipient-panel) {
    max-height: 390px;
    border-right: 0;
    border-bottom: 1px solid var(--cm-line);
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    :is(#batchEmailModal .batch-recipient-list, #whatsappBroadcastModal .batch-recipient-list) {
    min-height: 150px;
    max-height: 230px;
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    :is(#batchEmailModal .batch-content-panel, #whatsappBroadcastModal .broadcast-message-panel) {
    overflow: visible;
  }
}

@media (max-width: 620px) {
  body:is([data-surface="workspace"], [data-surface="admin"])
    :is(#batchEmailModal, #emailCampaignEditorModal, #whatsappBroadcastModal, #billingCheckoutModal) {
    padding: 0;
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    :is(#batchEmailModal .batch-email-dialog,
        #emailCampaignEditorModal .email-campaign-editor-dialog,
        #whatsappBroadcastModal .whatsapp-broadcast-dialog,
        #billingCheckoutModal .billing-checkout-dialog) {
    width: 100%;
    height: 100dvh;
    max-height: 100dvh;
    border: 0;
    border-radius: 0;
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    :is(#batchEmailModal, #emailCampaignEditorModal, #whatsappBroadcastModal, #billingCheckoutModal)
    .modal-head {
    min-height: 82px;
    padding: 15px 14px;
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    :is(#batchEmailModal, #emailCampaignEditorModal, #whatsappBroadcastModal, #billingCheckoutModal)
    .modal-head p {
    display: none;
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    :is(#batchEmailModal, #emailCampaignEditorModal, #whatsappBroadcastModal, #billingCheckoutModal)
    .modal-foot {
    padding: 12px 14px 16px;
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    :is(#batchEmailModal .batch-email-foot, #whatsappBroadcastModal .whatsapp-broadcast-foot) > span {
    display: none;
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    :is(#batchEmailModal .batch-sequence-tabs, #emailCampaignEditorModal .campaign-edit-step-tabs) {
    grid-template-columns: 1fr;
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    :is(#batchEmailModal .batch-sequence-tabs, #emailCampaignEditorModal .campaign-edit-step-tabs) button {
    min-height: 50px;
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    :is(#batchEmailModal .batch-recipient-personalization-head,
        #batchEmailModal .batch-step-context,
        #batchEmailModal .batch-signature-note,
        #whatsappBroadcastModal .broadcast-preview-head) {
    align-items: flex-start;
    flex-direction: column;
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    :is(#batchEmailModal, #emailCampaignEditorModal, #whatsappBroadcastModal) .grid {
    grid-template-columns: 1fr;
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    #batchEmailModal .batch-mail-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    #whatsappBroadcastModal .whatsapp-broadcast-tabs {
    padding: 0 14px;
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    #whatsappBroadcastModal :is(.whatsapp-broadcast-risk, .whatsapp-broadcast-connection) {
    margin-right: 14px;
    margin-left: 14px;
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    #whatsappBroadcastModal :is(.broadcast-history-head, .whatsapp-broadcast-history-list) {
    padding-right: 14px;
    padding-left: 14px;
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    #whatsappBroadcastModal .broadcast-campaign-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    #whatsappBroadcastModal .broadcast-campaign-stats > div:nth-child(2) {
    border-right: 0;
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    #whatsappBroadcastModal .broadcast-campaign-stats > div:nth-child(-n + 2) {
    border-bottom: 1px solid var(--cm-line-soft);
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    #whatsappBroadcastModal .whatsapp-broadcast-campaign > footer {
    align-items: stretch;
    flex-direction: column;
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    #billingCheckoutModal .billing-checkout-flow {
    grid-template-columns: 1fr;
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    #billingCheckoutModal .billing-checkout-flow > svg {
    transform: rotate(90deg);
  }
}

@media (max-width: 390px) {
  body:is([data-surface="workspace"], [data-surface="admin"])
    :is(#batchEmailModal .batch-content-panel,
        #emailCampaignEditorModal .email-campaign-editor-body,
        #whatsappBroadcastModal .broadcast-message-panel,
        #billingCheckoutModal .modal-body) {
    padding-right: 14px;
    padding-left: 14px;
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    :is(#batchEmailModal .batch-email-foot, #whatsappBroadcastModal .whatsapp-broadcast-foot) {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  body:is([data-surface="workspace"], [data-surface="admin"])
    :is(#batchEmailModal .batch-email-foot, #whatsappBroadcastModal .whatsapp-broadcast-foot) button {
    width: 100%;
  }
}
