.oc-workspace { min-width: 0; width: 100%; max-width: 100%; container: outreach / inline-size; }
.oc-workspace > .oc-error, .oc-workspace td .oc-error { display: block; color: var(--red); padding: 6px 0; font-size: 12px; white-space: normal; overflow-wrap: anywhere; }
.oc-campaign { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); column-gap: 20px; min-width: 0; width: 100%; max-width: 1100px; color: var(--text); font-size: 13px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding-top: 8px; margin-bottom: 8px; }
.oc-campaign > * { grid-column: 1 / -1; min-width: 0; }
.oc-campaign > :is(.oc-templates, .oc-senders) { grid-column: 1 / -1; }
.oc-campaign[hidden] { display: none; }
.oc-create { display: inline-flex; align-items: center; gap: 6px; }
.oc-draft-status { display: block; color: var(--muted); font-size: 12px; white-space: normal; }
.oc-table-actions { white-space: nowrap; }
.oc-table-actions .outreach-mailing-expand { display: inline-flex; align-items: center; justify-content: center; vertical-align: middle; margin-right: 3px; }
.oc-table-actions .compact-button { min-height: 26px; padding: 3px 7px; font-size: 12px; margin-right: 4px; }
.oc-table-actions button:disabled { opacity: .45; cursor: not-allowed; }
.oc-campaign *, .oc-campaign *::before, .oc-campaign *::after { box-sizing: border-box; }
.oc-campaign [hidden] { display: none !important; }
.oc-campaign h3 { margin: 0 0 5px; font-size: 13px; font-weight: 600; line-height: 1.3; }
.oc-campaign .oc-step { display: inline-flex; align-items: center; min-height: 20px; margin-right: 4px; padding: 1px 6px; border-radius: 4px; background: var(--blue-soft); color: var(--blue-dark); font-size: 12px; font-weight: 600; white-space: nowrap; }
.oc-campaign .oc-head { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 8px; padding: 0 0 5px; }
.oc-campaign .oc-head > .oc-field { grid-template-columns: auto minmax(0, 1fr); align-items: center; width: 370px; max-width: 100%; gap: 8px; }
.oc-campaign .oc-head > .oc-back { display: inline-flex; align-items: center; gap: 5px; margin: 0 0 0 auto; white-space: nowrap; }
.oc-campaign .oc-back img { width: 14px; height: 14px; }
.oc-campaign .oc-state { align-self: center; color: var(--muted); }
.oc-campaign .oc-section { padding: 8px 0; border: 0; }
.oc-campaign .oc-section + .oc-section { border-top: 1px solid var(--line); }
.oc-campaign .oc-section-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 5px; }
.oc-campaign .oc-section-head h3 { margin: 0; }
.oc-campaign .oc-template-head { justify-content: flex-start; flex-wrap: wrap; }
.oc-campaign .oc-step-description { color: var(--muted); font-size: 12px; line-height: 1.3; }
.oc-campaign .oc-timezone { color: var(--muted); font-size: 12px; font-weight: 400; white-space: nowrap; font-variant-numeric: tabular-nums; }
.oc-campaign .oc-schedule-head { flex-wrap: wrap; }
.oc-campaign .oc-schedule-head h3 { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; }
.oc-campaign .oc-clock { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 4px; min-width: 0; }
.oc-campaign .oc-timezone[data-sync=unavailable] { color: var(--red); }
.oc-campaign .oc-section-head > .oc-field { width: 200px; }
.oc-campaign .oc-field { display: grid; align-content: start; gap: 3px; min-width: 0; margin: 0; color: var(--muted); font-size: 12px; }
.oc-campaign :is(input:not([type=checkbox]), select, summary) { width: 100%; min-width: 0; max-width: 100%; height: 30px; min-height: 30px; margin: 0; padding: 4px 7px; border: 1px solid var(--line); border-radius: 5px; background: var(--panel); color: var(--text); font-size: 13px; line-height: 20px; }
.oc-campaign :is(input, select, summary):focus-visible { outline: 2px solid var(--blue-dark); outline-offset: 2px; }
.oc-campaign input[aria-invalid=true], .oc-campaign select[aria-invalid=true] { border-color: var(--red); }
.oc-campaign :is(button, input, select):disabled { opacity: .55; cursor: not-allowed; }
#communicationPanel .oc-campaign .ghost-button { min-width: 0; max-width: 100%; height: auto; min-height: 30px; padding: 4px 8px; border-radius: 5px; font-size: 13px; line-height: 20px; white-space: normal; }
.oc-campaign .oc-primary { background: var(--blue-soft); color: var(--blue-dark); }
.oc-campaign .oc-stop { border-color: var(--red); color: var(--red); }
.oc-campaign .oc-filter-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, .8fr) minmax(0, 1fr); gap: 6px; }
.oc-campaign .oc-template-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 8px; }
.oc-campaign .oc-template-grid:has([data-oc-field=templateId]) { grid-template-columns: 1fr 1.2fr 1.2fr; }
.oc-campaign .oc-multi { position: relative; min-width: 0; }
.oc-campaign .oc-multi summary { cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-right: 34px; position: relative; list-style: none; }
.oc-campaign .oc-multi summary::-webkit-details-marker { display: none; }
.oc-campaign .oc-multi summary::after { content: ""; position: absolute; right: 12px; top: 50%; width: 14px; height: 14px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='M3.5 5.25 7 8.75l3.5-3.5' stroke='%23425555' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px 14px no-repeat; transform: translateY(-50%); }
.oc-campaign .oc-options { position: absolute; top: 34px; left: 0; width: 100%; min-width: 0; max-width: 100%; max-height: 220px; overflow: auto; z-index: 15; padding: 4px; border: 1px solid #dde3e6; border-radius: 4px; background: #fff; box-shadow: none; }
.oc-campaign .oc-options label { display: flex; align-items: flex-start; gap: 6px; padding: 5px; font-size: 13px; color: var(--text); overflow-wrap: anywhere; }
.oc-campaign input[type=checkbox] { appearance: auto; width: 14px; height: 14px; min-width: 14px; margin: 2px 0 0; accent-color: var(--blue-dark); }
.oc-campaign .oc-check { display: inline-flex; align-items: flex-start; gap: 6px; min-width: 0; font-size: 12px; color: var(--text); }
.oc-campaign .oc-recipient-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 6px; }
.oc-campaign .oc-add { display: inline-flex; align-items: center; gap: 8px; }
.oc-campaign .oc-add strong { font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; }
.oc-campaign .oc-recipient-count { color: var(--muted); font-size: 12px; white-space: nowrap; }
.oc-campaign .oc-recipient-count strong { color: var(--text); font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; }
.oc-campaign .oc-mailbox-head { justify-content: flex-start; flex-wrap: wrap; }
.oc-campaign .oc-mailboxes { display: grid; grid-template-columns: minmax(0, 360px); }
.oc-campaign .oc-mailbox-select { min-width: 0; }
.oc-campaign .oc-schedule { display: grid; grid-template-columns: minmax(150px, 1.3fr) minmax(140px, 1.2fr) repeat(4, minmax(92px, .8fr)); gap: 6px; }
.oc-campaign .oc-rules { display: flex; flex-wrap: wrap; gap: 6px 14px; }
.oc-campaign .oc-mail-rules { margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--line); }
.oc-campaign .oc-notice { margin: 0; padding: 0; font-size: 12px; color: var(--muted); }
.oc-campaign .oc-muted { color: var(--muted); font-size: 12px; }
.oc-campaign .oc-error { padding: 8px 0; color: var(--red); font-size: 12px; }
.oc-campaign .oc-error:empty { display: none; }
.oc-campaign .oc-summary > section { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.oc-campaign .oc-summary h3 { margin: 0; white-space: nowrap; }
.oc-campaign .oc-summary dl { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; margin: 0; min-width: 0; }
.oc-campaign .oc-summary dl > div { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px; min-width: 0; max-width: 100%; }
.oc-campaign .oc-summary dt { margin: 0; font-size: 12px; color: var(--muted); white-space: nowrap; }
.oc-campaign .oc-summary dd { margin: 0; font-weight: 500; font-size: 13px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.oc-campaign .oc-progress { display: flex; align-items: center; gap: 8px; min-height: 21px; }
.oc-campaign .oc-progress progress { width: 100%; min-width: 0; flex: 1; height: 6px; accent-color: var(--blue-dark); }
.oc-campaign .oc-progress strong { font-size: 13px; font-weight: 500; }
.oc-campaign .oc-calculation { display: grid; justify-items: start; gap: 6px; }
.oc-campaign .oc-calculation > [data-oc-summary] { width: 100%; }
.oc-campaign .oc-report-field { min-height: 48px; padding: 8px; border: 1px solid var(--line); border-radius: 5px; background: var(--panel); }
.oc-campaign .oc-report-empty { color: var(--muted); font-size: 12px; }
.oc-campaign .oc-report-field .oc-summary > section { padding: 0; border-bottom: 0; }
.oc-campaign .oc-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 6px; padding: 8px 0; }
.oc-campaign .oc-run-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; width: 100%; margin-left: auto; }
.outreach-tracking-table .outreach-mailing-expand-col { width: 34px; min-width: 34px; max-width: 34px; padding: 4px !important; }
.outreach-mailing-expand { width: 26px; height: 26px; padding: 0; border: 1px solid var(--line); border-radius: 4px; background: var(--panel); color: var(--blue-dark); cursor: pointer; }
.outreach-mailing-expand img { width: 14px; height: 14px; }
.outreach-tracking-table[data-table-key="outreach-tracking-batches"] { min-width: 1150px; }
#communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"] { min-width: 1260px !important; width: 100%; max-width: none; }
#communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"] th:first-child { width: 28px; }
#communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"] th:nth-child(2) { width: 160px; }
#communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"] th:nth-child(3) { width: 96px; }
#communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"] th:nth-child(4) { width: 150px; }
#communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"] th[data-mailing-sort]:nth-child(n+5) { width: 80px; }
#communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"] th[data-mailing-sort="delivered"]:nth-child(n+5) { width: 96px; }
#communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"] :is(.oc-campaign-status-col, .oc-campaign-status-cell) { text-align: left !important; white-space: nowrap; }
#communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"] :is(th:last-child, .oc-table-actions) { width: 174px !important; min-width: 174px !important; max-width: 174px !important; overflow: visible !important; text-overflow: clip !important; }
#communicationPanel .oc-workspace .oc-table-actions { text-align: left; }
#communicationPanel .oc-workspace .oc-draft-status { white-space: normal; }
#communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"] th:last-child,
#communicationPanel .oc-workspace .oc-table-actions { position: sticky; right: 0; z-index: 2; background: #fff !important; border-left: 1px solid var(--line); }
#communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"] th:last-child { z-index: 3; background: #f4f8f7; }

html body .app #communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"]:not(#table-control-standard-specificity) :is(.oc-table-actions, .outreach-mailing-expand-col) .outreach-mailing-expand {
  box-sizing: border-box !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body .app #communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"]:not(#table-control-standard-specificity) .outreach-mailing-expand:hover:not(:disabled) {
  background: var(--brand-hover) !important;
}

html body .app #communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"]:not(#table-control-standard-specificity) .outreach-mailing-expand:disabled {
  background: transparent !important;
  opacity: .45 !important;
  cursor: not-allowed;
}

html body .app #communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"]:not(#table-control-standard-specificity) .outreach-mailing-expand:focus-visible {
  outline: 2px solid var(--brand-primary) !important;
  outline-offset: -2px !important;
}

#communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"] :is(th:last-child, .oc-table-actions) {
  width: 174px !important;
  min-width: 174px !important;
  max-width: 174px !important;
}

html body .app #communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"]:not(#table-control-standard-specificity) > :is(thead, tbody) > tr > :is(th:first-child, .outreach-mailing-expand-col) {
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  padding-inline: 4px !important;
  text-align: center !important;
}

html body .app #communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"]:not(#table-control-standard-specificity) .outreach-mailing-expand-col .outreach-mailing-expand {
  margin: 0 !important;
}

#communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"] td.oc-table-actions {
  padding-inline: 2px !important;
}

#communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"] .oc-table-actions .outreach-mailing-expand {
  margin-right: 2px;
}

#communicationPanel .oc-workspace table[data-table-key="outreach-tracking-batches"] .oc-table-actions .outreach-mailing-expand:last-child {
  margin-right: 0;
}

/* Only a genuinely running, non-error campaign gets a quiet activity marker. */
.oc-campaign-label {
  display: block;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.oc-campaign-activity {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 6px;
  border-radius: 50%;
  background: var(--brand-primary);
  vertical-align: 1px;
  animation: oc-campaign-activity 2.8s ease-in-out infinite;
}

@keyframes oc-campaign-activity {
  0%, 100% { opacity: .55; }
  50% { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .oc-campaign-activity { animation: none; opacity: 1; }
}
.outreach-mailing-detail > td { padding: 0 12px 12px 34px !important; }
.outreach-mailing-detail .outreach-tracking-table { width: 100%; }
@container outreach (max-width: 919px) {
  .oc-campaign .oc-filter-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .oc-campaign .oc-schedule { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .oc-campaign .oc-template-grid:has([data-oc-field=templateId]) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container outreach (max-width: 619px) {
  .oc-campaign { grid-template-columns: minmax(0, 1fr); }
  .oc-campaign > :is(.oc-templates, .oc-senders) { grid-column: 1; }
  .oc-campaign .oc-filter-grid, .oc-campaign .oc-template-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .oc-campaign .oc-schedule { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .oc-campaign .oc-start { grid-column: 1 / -1; }
  .oc-campaign .oc-section-head { align-items: flex-start; flex-wrap: wrap; }
}
@container outreach (max-width: 359px) {
  .oc-campaign .oc-filter-grid { grid-template-columns: minmax(0, 1fr); }
}
