.outbound-settings, .outbound-operations { display: grid; gap: 22px; align-content: start; min-width: 0; }
.outbound-settings { padding-bottom: 28px; border-bottom: 1px solid var(--line); margin-bottom: 28px; }
.outbound-settings .form-grid > .field:not(.span-4) > span { min-height: 2.6em; }
.outbound-settings textarea[name="outbound_first_message"] { min-height: 68px; }
.outbound-settings h2, .outbound-section-head h3, .outbound-section-head h4 { margin: 0; }
.outbound-section-head { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 16px; }
.outbound-section-head > div { min-width: 0; }
.outbound-section-head p { margin: 8px 0 0; color: var(--muted); font-size: 13px; line-height: 1.6; max-width: 700px; }
.outbound-help { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.6; }
.outbound-switch { display: flex; gap: 10px; align-items: center; font-size: 14px; font-weight: 600; min-height: 42px; }
.outbound-switch input { width: 18px; height: 18px; flex: 0 0 18px; accent-color: var(--primary); margin: 0; }
.outbound-button-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.outbound-button-row .button { width: auto; flex: 0 0 auto; white-space: nowrap; }
.outbound-campaign-card, .outbound-api-card { border: 1px solid var(--line); border-radius: 16px; padding: 22px; background: var(--surface); display: grid; gap: 20px; }
.outbound-campaign-list { display: grid; gap: 16px; }
.outbound-status-select { width: 180px; flex: 0 0 180px; }
.outbound-metrics { display: grid; grid-template-columns: repeat(7,minmax(70px,1fr)); gap: 10px; }
.outbound-metrics > div { border-radius: 10px; padding: 12px; background: var(--bg); display: grid; gap: 6px; }
.outbound-metrics strong { font-size: 20px; }
.outbound-metrics span { font-size: 11px; color: var(--muted); }
.outbound-state { display: inline-flex; align-items: center; padding: 6px 10px; border-radius: 30px; font-size: 12px; font-weight: 600; background: var(--bg); color: var(--muted); white-space: nowrap; }
.outbound-state-active, .outbound-state-completed, .outbound-state-answered { background: #def7ee; color: #11775e; }
.outbound-state-dialing, .outbound-state-reserved, .outbound-state-retry_scheduled { background: #fff2d9; color: #9a6200; }
.outbound-state-failed, .outbound-state-unknown { background: #fde9ed; color: #bc3652; }
.outbound-empty { padding: 28px; border: 1px dashed var(--line); border-radius: 14px; color: var(--muted); font-size: 14px; }
.outbound-key-details, .outbound-key-once { display: grid; gap: 10px; }
.outbound-key-details small { color: var(--muted); }
.outbound-key-once { border: 1px solid var(--primary); border-radius: 12px; padding: 16px; }
.outbound-key-once p { color: var(--muted); font-size: 13px; margin: 0; }
.outbound-key-copy { display: flex; gap: 10px; }
.outbound-key-copy input { min-width: 0; flex: 1; font-family: monospace; }
.outbound-api-example { border: 1px solid var(--line); border-radius: 12px; padding: 18px; }
.outbound-api-example summary, .outbound-variable-editor summary { cursor: pointer; font-size: 14px; font-weight: 600; margin-bottom: 14px; }
.outbound-code { white-space: pre-wrap; overflow-wrap: anywhere; padding: 18px; background: var(--bg); border-radius: 10px; font-size: 12px; line-height: 1.65; }
.outbound-dialog > .form-grid { align-items: start; }
.outbound-dialog section { display: grid; gap: 16px; }
.outbound-dialog h3 { margin: 0; font-size: 16px; }
.outbound-dialog [data-outbound-error] { color: var(--danger); font-size: 14px; }
.outbound-dialog .modal-actions { position: sticky; bottom: -24px; background: var(--surface); padding: 18px 0; border-top: 1px solid var(--line); z-index: 2; }
.outbound-variable-row { display: grid; grid-template-columns: minmax(120px,1fr) minmax(120px,2fr) 40px; gap: 14px; align-items: end; margin-bottom: 12px; }
.outbound-window-row { display: grid; grid-template-columns: minmax(120px,2fr) minmax(90px,1fr) minmax(90px,1fr) 40px; gap: 14px; align-items: end; margin-bottom: 12px; }
.outbound-period-row { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr 1.5fr 40px; gap: 12px; align-items: end; margin-bottom: 12px; }
.outbound-period-row .field, .outbound-window-row .field, .outbound-variable-row .field { min-width: 0; }
.outbound-period-row input, .outbound-window-row input { min-width: 0; }
.outbound-variable-editor details textarea { width: 100%; }
.outbound-tool-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.outbound-context-editor { width: 100%; resize: vertical; }
.outbound-context-editor.expanded { min-height: 60vh; }
.outbound-items { display: grid; gap: 20px; }
.outbound-items table { min-width: 720px; }
.outbound-import { cursor: pointer; }
.outbound-pagination { display: flex; justify-content: space-between; align-items: center; gap: 14px; font-size: 13px; color: var(--muted); }
.outbound-reference { display: block; color: var(--muted); font-size: 12px; margin-top: 5px; }
.outbound-lead-search { max-width: 460px; }
@media(max-width: 1000px) { .outbound-metrics { grid-template-columns: repeat(4,minmax(60px,1fr)); } .outbound-period-row { grid-template-columns: repeat(3,minmax(0,1fr)); } .outbound-tool-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width: 600px) { .outbound-metrics { grid-template-columns: repeat(3,minmax(60px,1fr)); } .outbound-window-row { grid-template-columns: 1fr 1fr; } .outbound-variable-row { grid-template-columns: 1fr; } .outbound-tool-grid { grid-template-columns: 1fr; } .outbound-key-copy { flex-wrap: wrap; } .outbound-status-select { width: 100%; flex-basis: 100%; } }