/* v201: compact tabbed body editor with a stable left/right preview. */

.mailbox-api-page-v196 .mailbox-body-full-v201 {
  grid-column: 1 / -1 !important;
  width: 100%;
}

.mailbox-api-page-v196 .mailbox-body-controls-v200 {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 10px;
}

.mailbox-api-page-v196 .mailbox-body-controls-v200 > * {
  flex: 0 1 210px;
  min-width: 150px;
  max-width: 240px;
  grid-column: auto !important;
}

.mailbox-api-page-v196 .mailbox-body-controls-v200 input,
.mailbox-api-page-v196 .mailbox-body-controls-v200 select {
  min-height: 38px;
}

.mailbox-api-page-v196 .mailbox-body-tabs-v201 {
  display: flex;
  gap: 7px;
  overflow-x: auto;
  padding: 2px 1px 8px;
}

.mailbox-api-page-v196 .mailbox-body-tab-v201 {
  flex: 0 0 auto;
  border: 1px solid rgb(148 163 184 / 22%);
  border-radius: 9px;
  background: transparent;
  padding: 7px 11px;
  color: #6b7280;
  font-size: 10px;
  font-weight: 900;
}

.mailbox-api-page-v196 .mailbox-body-tab-v201.is-active {
  border-color: rgb(6 182 212 / 60%);
  background: rgb(6 182 212 / 10%);
  color: #0891b2;
}

.mailbox-api-page-v196 .mailbox-body-editor-preview-v201 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 14px;
  min-width: 0;
}

.mailbox-api-page-v196 .mailbox-body-editor-preview-v201 > * {
  min-width: 0;
  width: 100%;
}

.mailbox-api-page-v196 .mailbox-body-editor-preview-v201 textarea,
.mailbox-api-page-v196 .mailbox-body-editor-preview-v201 iframe {
  min-height: 380px !important;
  height: 100%;
}

@media (max-width: 900px) {
  .mailbox-api-page-v196 .mailbox-body-editor-preview-v201 {
    grid-template-columns: minmax(0, 1fr);
  }
}