/* Phase 51 — Adoption Tracker. All selectors scoped under .adoption-*
   classes so this file does not bleed into other pages. */

.adoption-main {
  max-width: 1200px;
  margin: 0 auto;
  padding: var(--space-5);
}

.adoption-h1 {
  font-size: var(--font-size-xxl);
  margin-bottom: var(--space-2);
}

.adoption-intro {
  margin-bottom: var(--space-4);
  max-width: 800px;
}

/* ------------------------------------------------------------ forecast */

.adoption-forecast {
  margin-bottom: var(--space-5);
}

.adoption-tile-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--space-3);
}

.adoption-tile {
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.adoption-tile-label {
  font-size: var(--font-size-sm);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.adoption-tile-value {
  font-size: var(--font-size-xl);
  font-weight: 600;
}

.adoption-tile-sub {
  font-size: var(--font-size-sm);
}

/* ------------------------------------------------------------ controls */

.adoption-controls {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4);
  margin-bottom: var(--space-4);
  flex-wrap: wrap;
}

/* The tab strip is a vertical stack of horizontal rows. Each row
   holds LANES_PER_ROW (5) tabs of equal width; the highest-TAM
   industries sit in row 1 and TAM descends toward the bottom. The
   rows wrap if the viewport is narrower than five chips wide. */
.adoption-tabs {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.adoption-tabs-row {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--space-2);
}

.adoption-tabs .btn {
  /* Tab labels can be long ("Aerospace & def.", "Recreation/parks");
     allow them to wrap inside the chip rather than overflow. */
  white-space: normal;
  text-align: center;
  line-height: 1.2;
}

.adoption-tabs .btn.is-active {
  background: var(--color-accent-soft);
  color: var(--color-accent-hover);
}

/* Greyed-out tabs — engaged when "Verified contacts only" is on and
   the lane has zero prospects with a verified email contact. The
   tab remains visible so the user understands the lane EXISTS, just
   with no outreach-ready data yet; click is rejected. */
.adoption-tabs .btn.is-disabled,
.adoption-tabs .btn:disabled {
  opacity: 0.35;
  cursor: not-allowed;
  pointer-events: auto; /* keep title tooltip on hover */
}

.adoption-tabs .btn.is-disabled:hover {
  background: transparent;
  color: var(--color-text-muted);
}

@media (max-width: 1100px) {
  .adoption-tabs-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .adoption-tabs-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Filter rail — region + sort dropdowns rendered below the tab strip. */
.adoption-filter-rail {
  display: flex;
  gap: var(--space-4);
  flex-wrap: wrap;
  align-items: flex-end;
  margin: var(--space-3) 0;
  padding: var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface-muted, var(--color-surface));
}

.adoption-filter-item {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  min-width: 200px;
}

.adoption-filter-label {
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
  font-weight: 500;
}

.form-input-sm {
  padding: 6px 10px;
  min-height: 32px;
}

/* Verified-only toggle row — checkbox + helper text inline. */
.adoption-filter-item-toggle {
  min-width: 280px;
}

.adoption-filter-toggle-row {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: 6px 0;
}

.adoption-filter-toggle-row input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin: 0;
  flex-shrink: 0;
  cursor: pointer;
  accent-color: var(--color-accent);
}

/* Sortable column headers in the per-lane account table. Click to
   sort by that column; click again to flip direction. The active
   column shows a coloured up/down arrow appended to the label. */
.adoption-table th.adoption-th-sortable {
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}

.adoption-table th.adoption-th-sortable:hover {
  background: var(--color-surface-muted, var(--color-surface));
  color: var(--color-accent-hover);
}

.adoption-table th.adoption-th-sortable.is-active {
  color: var(--color-accent-hover);
}

/* Rows whose prospect has a confirmed email (with required
   source_url provenance) get a thick green left border. The
   batch contact-lookup job promotes rows from "—" to "verified"
   over time; the border lights up when that happens. */
.adoption-row.adoption-row-verified > td:first-child {
  box-shadow: inset 4px 0 0 0 var(--color-success, #15803d);
}

.adoption-row.adoption-row-verified > td {
  background: var(--color-success-soft); /* theme-aware green tint */
}

/* Small badge after the org name showing how many contacts the row
   carries. Verified-email rows render the badge in green; rows that
   have *some* contacts but no email yet stay neutral. */
.adoption-contact-badge {
  display: inline-block;
  margin-left: var(--space-2);
  padding: 1px 6px;
  border-radius: 999px;
  background: var(--color-border);
  color: var(--color-text-muted);
  font-size: var(--font-size-xs, 11px);
  font-weight: 600;
  vertical-align: middle;
}

.adoption-contact-badge.is-verified {
  background: var(--color-success, #15803d);
  color: white;
}

/* Closed-lost reason block — appears below the status row inside the
   drawer when status='closed-lost' is selected. */
.adoption-lost-block {
  margin-top: var(--space-3);
  padding: var(--space-3);
  border: 1px solid var(--color-border);
  border-left: 3px solid var(--color-danger, #dc2626);
  border-radius: var(--radius-md);
  background: var(--color-danger-soft);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

/* Verified contacts panel inside the drawer. Each contact is a card
   showing kind + value + source URL + optional discovery trail. */
.adoption-contacts-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.adoption-contact-card {
  border: 1px solid var(--color-border);
  border-left: 3px solid var(--color-success, #15803d);
  border-radius: var(--radius-md);
  padding: var(--space-3);
  background: var(--color-success-soft);
}

.adoption-contact-head {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-wrap: wrap;
}

.adoption-contact-kind {
  font-size: var(--font-size-xs, 11px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  background: var(--color-border);
  color: var(--color-text-muted);
  padding: 2px 8px;
  border-radius: 999px;
}

.adoption-contact-value {
  font-weight: 600;
  font-size: var(--font-size-md, 15px);
  word-break: break-all;
  flex: 1;
}

.adoption-contact-del {
  margin-left: auto;
  padding: 2px 8px;
  font-size: var(--font-size-sm);
  color: var(--color-danger, #dc2626);
}

.adoption-contact-label {
  margin-top: var(--space-1);
  color: var(--color-text-muted);
  font-size: var(--font-size-sm);
}

.adoption-contact-source {
  margin-top: var(--space-2);
  font-size: var(--font-size-sm);
  word-break: break-all;
}

.adoption-contact-source a {
  color: var(--color-accent);
}

.adoption-contact-trail {
  margin-top: var(--space-2);
  font-size: var(--font-size-sm);
}

.adoption-contact-trail summary {
  cursor: pointer;
  color: var(--color-accent);
  user-select: none;
}

.adoption-contact-trail p {
  margin: var(--space-2) 0 0;
  padding: var(--space-2) var(--space-3);
  background: var(--color-surface-muted, var(--color-surface));
  border-radius: var(--radius-sm);
  white-space: pre-wrap;
}

.adoption-contact-verified {
  margin-top: var(--space-2);
  font-size: var(--font-size-xs, 11px);
}

.adoption-contact-add {
  margin-top: var(--space-4);
  padding-top: var(--space-3);
  border-top: 1px dashed var(--color-border);
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.adoption-contact-add-row {
  display: grid;
  grid-template-columns: 160px 1fr 1fr;
  gap: var(--space-2);
}

@media (max-width: 720px) {
  .adoption-contact-add-row {
    grid-template-columns: 1fr;
  }
}

.btn-xs {
  padding: 2px 6px;
  font-size: var(--font-size-xs, 11px);
  line-height: 1.2;
}

/* Logon-domains pill list. Primary domain shows a leading star. */
.adoption-domains-list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-bottom: var(--space-3);
}

.adoption-domain-pill {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  padding: 4px 8px 4px 10px;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: var(--color-surface);
  font-family: var(--font-family-mono, monospace);
  font-size: var(--font-size-sm);
}

.adoption-domain-primary {
  color: var(--color-warning);
  font-size: var(--font-size-md, 15px);
}

.adoption-domain-value {
  font-weight: 600;
}

.adoption-domain-add-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: var(--space-2);
  align-items: center;
}

.adoption-domain-primary-toggle {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
  white-space: nowrap;
}

.adoption-domain-add {
  margin-top: var(--space-3);
  padding-top: var(--space-3);
  border-top: 1px dashed var(--color-border);
}

/* Seat-utilization indicator. */
.adoption-utilization {
  margin-bottom: var(--space-3);
  padding: var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface-muted, var(--color-surface));
}

.adoption-utilization-stat {
  font-size: var(--font-size-md, 15px);
  margin-bottom: var(--space-2);
}

.adoption-utilization-num {
  font-size: var(--font-size-xl, 22px);
  font-weight: 700;
  color: var(--color-accent);
}

.adoption-utilization-denom {
  color: var(--color-text-muted);
}

.adoption-utilization-label {
  margin-left: var(--space-1);
  color: var(--color-text-muted);
  font-size: var(--font-size-sm);
}

.adoption-utilization-bar {
  width: 100%;
  height: 8px;
  border-radius: 4px;
  background: var(--color-border);
  overflow: hidden;
  margin-bottom: var(--space-1);
}

.adoption-utilization-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--color-accent) 0%, var(--color-success, #15803d) 100%);
  transition: width 0.4s ease-out;
}

.adoption-toolbar {
  display: flex;
  gap: var(--space-2);
  flex-wrap: wrap;
}

/* ------------------------------------------------------------ lane meta + table */

.adoption-lane-meta {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-3) var(--space-4);
  background: var(--color-surface-alt);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-3);
  flex-wrap: wrap;
}

.adoption-lane-title {
  font-size: var(--font-size-xl);
  margin: 0;
  margin-bottom: var(--space-1);
}

.adoption-lane-stats {
  display: flex;
  gap: var(--space-4);
  flex-wrap: wrap;
  align-items: center;
}

.adoption-table {
  width: 100%;
}

.adoption-row {
  cursor: pointer;
  transition: background-color 100ms ease;
}

.adoption-row:hover {
  background: var(--color-surface-alt);
}

/* ------------------------------------------------------------ drawer */

.adoption-drawer.modal {
  max-width: 760px;
}

.adoption-drawer-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-3);
  padding-bottom: var(--space-3);
  margin-bottom: var(--space-3);
  border-bottom: 1px solid var(--color-border);
}

.adoption-drawer-head h2 {
  margin: 0;
  margin-bottom: var(--space-1);
}

.adoption-section {
  margin-bottom: var(--space-5);
  padding-bottom: var(--space-4);
  border-bottom: 1px solid var(--color-border);
}

.adoption-section:last-of-type {
  border-bottom: none;
  margin-bottom: var(--space-3);
  padding-bottom: 0;
}

.adoption-section h3 {
  font-size: var(--font-size-lg);
  margin: 0 0 var(--space-3) 0;
}

.adoption-row-controls {
  display: flex;
  gap: var(--space-2);
  align-items: center;
  flex-wrap: wrap;
}

.adoption-row-controls .form-input {
  flex: 1 1 220px;
}

.adoption-close-section {
  background: var(--color-surface-alt);
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  border: 1px solid var(--color-border);
  margin-top: var(--space-2);
}

/* Form helpers — scoped to the adoption pages and the modals they
   spawn so they don't collide with anything else. The shapes mirror
   the existing .field styling in components.css but live alongside
   the JS that uses them.
   The .modal selector is included so the Add-account / close-deal
   modals (which render inside the global .modal container, NOT
   inside .adoption-main / .adoption-drawer) pick up the same
   grid + label-stacking layout. Without it the labels and inputs
   flow inline and overlap. */

.adoption-drawer .form-grid,
.adoption-main .form-grid,
.modal .form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--space-3);
  margin-bottom: var(--space-3);
}

.adoption-drawer .form-row,
.adoption-main .form-row,
.modal .form-row {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.adoption-drawer .form-label,
.adoption-main .form-label,
.modal .form-label {
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
  font-weight: 500;
}

.adoption-drawer .form-input,
.adoption-main .form-input,
.modal .form-input {
  width: 100%;
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  color: var(--color-text);
  min-height: 36px;
  font: inherit;
  box-sizing: border-box;
}

.adoption-drawer textarea.form-input,
.adoption-main textarea.form-input,
.modal textarea.form-input {
  min-height: 80px;
  resize: vertical;
}

.modal.modal-md { max-width: 580px; }
.modal.modal-lg { max-width: 820px; }

/* ------------------------------------------------------------ activity */

.adoption-timeline {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  max-height: 320px;
  overflow-y: auto;
}

.adoption-timeline li {
  padding: var(--space-2) var(--space-3);
  background: var(--color-surface-alt);
  border-radius: var(--radius-sm);
  border-left: 3px solid var(--color-accent);
  font-size: var(--font-size-sm);
}

.adoption-timeline-head {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
  align-items: baseline;
}

.adoption-timeline-note {
  margin-top: var(--space-1);
  font-size: var(--font-size-sm);
}

/* Phase 51A — needs-review queue. */
.admin-adoption-review { padding: var(--space-3); max-width: 1100px; margin: 0 auto; }
.admin-adoption-review .review-header { margin-bottom: var(--space-2); }
.admin-adoption-review .review-header .back-link {
  display: inline-block; margin-bottom: var(--space-1);
  font-size: var(--font-size-sm); color: var(--color-text-muted);
  text-decoration: none;
}
.admin-adoption-review .review-header .back-link:hover { text-decoration: underline; }
.admin-adoption-review .review-sub { color: var(--color-text-muted); font-size: var(--font-size-sm); }
.admin-adoption-review .review-filters {
  display: flex; gap: var(--space-2); align-items: center;
  padding: var(--space-2); background: var(--color-surface);
  border-radius: var(--radius); margin-bottom: var(--space-2);
}
.admin-adoption-review .review-filters input[type="number"] {
  width: 5rem;
}
.admin-adoption-review .review-queue .count {
  font-size: var(--font-size-sm); color: var(--color-text-muted);
  margin-bottom: var(--space-1);
}
.admin-adoption-review .review-row {
  background: var(--color-surface); border: 1px solid var(--color-border);
  border-radius: var(--radius); padding: var(--space-2);
  margin-bottom: var(--space-2);
  transition: opacity 0.5s;
}
.admin-adoption-review .review-row.resolved {
  opacity: 0.3; pointer-events: none;
}
.admin-adoption-review .row-head {
  display: flex; align-items: center; gap: var(--space-2);
  flex-wrap: wrap; margin-bottom: var(--space-1);
}
.admin-adoption-review .row-head h3 { margin: 0; font-size: 1.1rem; }
.admin-adoption-review .row-head .badge {
  font-size: 0.8rem; padding: 0.2em 0.5em;
  border-radius: 3px; background: var(--color-surface-alt); color: var(--color-text);
}
.admin-adoption-review .row-head .badge.phase-claude-deferred { background: var(--color-warning-soft); }
.admin-adoption-review .row-head .badge.phase-claude-failed { background: var(--color-danger-soft); }
.admin-adoption-review .row-head .badge.phase-human-review { background: var(--color-accent-soft); }
.admin-adoption-review .row-head .tam {
  font-family: var(--font-mono, monospace); color: var(--color-text-muted);
}
.admin-adoption-review .row-meta {
  display: flex; flex-wrap: wrap; gap: var(--space-2);
  font-size: var(--font-size-sm); color: var(--color-text-muted);
}
.admin-adoption-review .row-notes {
  margin-top: var(--space-1); padding: var(--space-1);
  background: var(--color-surface-alt); border-radius: var(--radius);
  font-size: var(--font-size-sm);
}
.admin-adoption-review .row-actions {
  margin-top: var(--space-1);
  border-top: 1px solid var(--color-border);
  padding-top: var(--space-1);
}
.admin-adoption-review .row-actions:not(.open) .row-actions-body { display: none; }
.admin-adoption-review .row-actions-body label {
  display: block; margin-bottom: var(--space-1);
}
.admin-adoption-review .row-actions-body textarea,
.admin-adoption-review .row-actions-body input,
.admin-adoption-review .row-actions-body select {
  width: 100%; padding: 0.4em; font-family: inherit; font-size: inherit;
  border: 1px solid var(--color-border); border-radius: var(--radius);
}
.admin-adoption-review .row-actions-body .contact-row {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: var(--space-1); padding: var(--space-1) 0;
  border-bottom: 1px dashed var(--color-border);
}
.admin-adoption-review .row-actions-body .contact-row label.wide {
  grid-column: 1 / -1;
}
.admin-adoption-review .row-actions-body .btn-link {
  background: none; border: 0; color: var(--color-link);
  cursor: pointer; padding: var(--space-1) 0;
}

/* ---- Phase 51A · attempt-log panel ---- */
.admin-adoption-review .row-button-bar {
  display: flex; gap: var(--space-1); margin-top: var(--space-1); flex-wrap: wrap;
}
.admin-adoption-review .row-attempts {
  margin-top: var(--space-1); border-top: 1px dashed var(--color-border);
  padding-top: var(--space-1);
}
.admin-adoption-review .row-attempts:not(.open) .attempts-body { display: none; }
.admin-adoption-review .attempts-summary {
  font-size: var(--font-size-sm); color: var(--color-text-muted);
  margin: 0 0 var(--space-1) 0;
}
.admin-adoption-review .attempts-list { display: flex; flex-direction: column; gap: var(--space-1); }
.admin-adoption-review .attempt-row {
  background: var(--color-surface-2, #fafafa);
  border: 1px solid var(--color-border);
  border-radius: 4px;
  padding: var(--space-1) var(--space-2);
}
.admin-adoption-review .attempt-row.outcome-inserted { border-left: 3px solid var(--color-success); }
.admin-adoption-review .attempt-row.outcome-rejected,
.admin-adoption-review .attempt-row.outcome-extract-failed { border-left: 3px solid var(--color-warning); }
.admin-adoption-review .attempt-row.outcome-fetch-failed { border-left: 3px solid var(--color-danger); }
.admin-adoption-review .attempt-row.outcome-no-signal,
.admin-adoption-review .attempt-row.outcome-no-content,
.admin-adoption-review .attempt-row.outcome-pdf-skipped { border-left: 3px solid var(--color-border-strong); }

.admin-adoption-review .attempt-head {
  display: flex; gap: var(--space-2); align-items: baseline; flex-wrap: wrap;
}
.admin-adoption-review .attempt-url {
  font-family: var(--font-family-mono, ui-monospace, monospace);
  font-size: var(--font-size-sm);
  word-break: break-all; flex: 1 1 320px;
}
.admin-adoption-review .attempt-chips {
  display: flex; gap: 4px; flex-wrap: wrap;
}
.admin-adoption-review .attempt-chips .chip {
  display: inline-block; padding: 1px 6px;
  border-radius: 9999px; font-size: 11px;
  background: var(--color-surface-alt); color: var(--color-text);
  white-space: nowrap;
}
.admin-adoption-review .attempt-chips .chip-outcome { background: var(--color-accent-soft); color: var(--color-accent); }
.admin-adoption-review .attempt-chips .chip-status { background: var(--color-success-soft); color: var(--color-success); }
.admin-adoption-review .attempt-chips .chip-status-bad { background: var(--color-danger-soft); color: var(--color-danger); }
.admin-adoption-review .attempt-chips .chip-inserts { background: var(--color-success-soft); color: var(--color-success); }
.admin-adoption-review .attempt-chips .chip-rejects { background: var(--color-warning-soft); color: var(--color-warning); }
.admin-adoption-review .attempt-chips .chip-warn { background: var(--color-warning-soft); color: var(--color-warning); font-weight: 600; }

.admin-adoption-review .attempt-sub {
  display: flex; gap: var(--space-2);
  font-size: 11px; color: var(--color-text-muted);
  margin-top: 4px;
}
.admin-adoption-review .attempt-notes {
  font-size: var(--font-size-sm); color: var(--color-text-muted);
  margin-top: 4px; line-height: 1.4;
  word-break: break-word;
}

/* ---- Phase 53A · outreach hub ---- */
.admin-outreach { padding: var(--space-3); max-width: 1180px; margin: 0 auto; }
.admin-outreach .outreach-header { margin-bottom: var(--space-2); }
.admin-outreach .outreach-header h1 { margin: var(--space-1) 0; }
.admin-outreach .outreach-sub { color: var(--color-text-muted); font-size: var(--font-size-sm); }
.admin-outreach .outreach-tabs {
  display: flex; gap: var(--space-1); border-bottom: 1px solid var(--color-border);
  margin-bottom: var(--space-2);
}
.admin-outreach .outreach-tab {
  padding: var(--space-1) var(--space-2);
  text-decoration: none; color: var(--color-text-muted);
  border-bottom: 2px solid transparent;
}
.admin-outreach .outreach-tab.active { color: var(--color-text); border-bottom-color: var(--color-accent, #2563eb); font-weight: 600; }
.admin-outreach .tab-toolbar { margin-bottom: var(--space-2); }

.admin-outreach .templates-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: var(--space-2); }
.admin-outreach .template-card {
  background: var(--color-surface-2, #fafafa);
  border: 1px solid var(--color-border); border-radius: 6px;
  padding: var(--space-2);
}
.admin-outreach .template-card.archived { opacity: 0.6; }
.admin-outreach .template-card h3 { margin: 0; font-size: 1rem; }
.admin-outreach .template-card .subj { color: var(--color-text-muted); font-size: var(--font-size-sm); margin: var(--space-1) 0; }
.admin-outreach .template-card .body-preview {
  background: var(--color-bg);
  font-family: var(--font-family-mono, ui-monospace, monospace);
  font-size: 12px; max-height: 120px; overflow: hidden;
  padding: 6px; border-radius: 3px; white-space: pre-wrap;
}
.admin-outreach .template-card .card-actions { margin-top: var(--space-1); display: flex; gap: 6px; }

.admin-outreach .sends-table, .admin-outreach .supp-table {
  width: 100%; border-collapse: collapse; font-size: var(--font-size-sm);
}
.admin-outreach .sends-table th, .admin-outreach .sends-table td,
.admin-outreach .supp-table th, .admin-outreach .supp-table td {
  text-align: left; padding: 6px 8px; border-bottom: 1px solid var(--color-border);
}
.admin-outreach .sends-table td.mono, .admin-outreach .supp-table td.mono { font-family: var(--font-family-mono, ui-monospace, monospace); }
.admin-outreach .sends-table td.subj { color: var(--color-text-muted); max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-outreach .status-chip {
  display: inline-block; padding: 1px 8px; border-radius: 9999px;
  font-size: 11px; background: var(--color-surface-alt);
}
.admin-outreach .status-chip.status-sent      { background: var(--color-accent-soft); color: var(--color-accent); }
.admin-outreach .status-chip.status-delivered { background: var(--color-success-soft); color: var(--color-success); }
.admin-outreach .status-chip.status-opened    { background: var(--color-success-soft); color: var(--color-success); }
.admin-outreach .status-chip.status-clicked   { background: var(--color-info-soft); color: var(--color-info); }
.admin-outreach .status-chip.status-replied   { background: var(--color-warning-soft); color: var(--color-warning); font-weight: 600; }
.admin-outreach .status-chip.status-bounced,
.admin-outreach .status-chip.status-spam,
.admin-outreach .status-chip.status-dropped,
.admin-outreach .status-chip.status-failed,
.admin-outreach .status-chip.status-unsubscribed { background: var(--color-danger-soft); color: var(--color-danger); }

.admin-outreach .suppress-add {
  display: grid; grid-template-columns: 2fr 1fr 2fr auto; gap: var(--space-1);
  align-items: end; margin-bottom: var(--space-2);
}

.admin-outreach .inbound-list { display: flex; flex-direction: column; gap: var(--space-2); }
.admin-outreach .inbound-row {
  background: var(--color-surface-2, #fafafa);
  border: 1px solid var(--color-border); border-radius: 6px;
  padding: var(--space-2);
}
.admin-outreach .inbound-row header { display: flex; gap: var(--space-2); align-items: baseline; }
.admin-outreach .inbound-row header .ts { color: var(--color-text-muted); font-size: var(--font-size-sm); margin-left: auto; }
.admin-outreach .inbound-row .body {
  background: var(--color-bg);
  font-family: var(--font-family-mono, ui-monospace, monospace);
  font-size: 12px; padding: 6px; border-radius: 3px;
  white-space: pre-wrap; max-height: 240px; overflow: auto;
}
.admin-outreach .inbound-row .meta { color: var(--color-text-muted); font-size: 11px; display: flex; gap: var(--space-2); }

.admin-outreach .compose-panel label { display: block; margin-bottom: var(--space-1); }
.admin-outreach .compose-panel .preview-box {
  background: var(--color-surface-2, #fafafa);
  border: 1px solid var(--color-border); border-radius: 6px;
  padding: var(--space-2); margin-top: var(--space-1);
}
.admin-outreach .compose-panel .preview-box .body {
  background: var(--color-bg);
  font-family: var(--font-family-mono, ui-monospace, monospace);
  font-size: 12px; padding: 8px; border-radius: 3px;
  white-space: pre-wrap; margin: var(--space-1) 0 0 0;
}
.admin-outreach .compose-panel .compose-actions { margin-top: var(--space-2); display: flex; gap: var(--space-2); align-items: center; }
.admin-outreach .compose-panel .send-result .ok { color: var(--color-success); font-weight: 600; }

.modal.modal-large { width: min(720px, 90vw); }
.modal.modal-large textarea, .modal.modal-large input { width: 100%; }
.modal.modal-large .hint { color: var(--color-text-muted); font-size: 11px; }