.integration-tabs { margin-bottom: 20px; max-width: 100%; overflow-x: auto; }
.integration-tabs button { white-space: nowrap; flex-shrink: 0; min-height: 36px; }
.integration-card { padding: 24px; }
.integration-card > .card-title { margin-bottom: 20px; }
.integration-row { border-bottom: 1px solid var(--border); }
.integration-row-info { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.integration-row-info p { margin: 4px 0 0; }
.integration-form { display: flex; flex-direction: column; gap: 16px; }
.integration-form[hidden] { display: none; }
.integration-field { display: flex; flex-direction: column; gap: 6px; }
.integration-field input, .integration-field textarea { width: 100%; min-width: 0; }
.integration-field textarea { min-height: 88px; resize: vertical; }
.integration-actions { display: flex; justify-content: flex-end; gap: 8px; }
.integration-checks { display: flex; flex-direction: column; gap: 13px; border-top: 1px solid var(--border); padding-top: 20px; }
.integration-checks > button { align-self: flex-start; }
.integration-message { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.5; }
.integration-message:empty { display: none; }
.integration-card > [data-control^="add-"] { margin-top: 16px; }
.integration-catalog p { margin: 4px 0; }
@media (max-width: 560px) {
  .integration-card { padding: 16px; }
  .integration-row-info { flex-basis: 100%; }
  .integration-actions { flex-wrap: wrap; }
  .integration-tabs { gap: 4px; }
}
.integration-form > p { margin: 0; }
.integration-form > button { align-self: flex-start; }
.integration-form > .status:empty { display: none; }

.integration-checks[hidden] { display: none; }
.integration-checks-wrap { border-top: 1px solid var(--border); padding-top: 16px; }
.integration-checks-wrap > .integration-checks { border-top: 0; }
.integration-field select { width: 100%; min-width: 0; }

.notification-recipient { width: 100%; display: flex; flex-direction: column; gap: 6px; }
.notification-recipient-menu { width: min(440px, calc(100vw - 16px)); z-index: 1100; }
.notification-recipient-menu[hidden] { display: none; }
.notification-recipient-menu .field-note { padding: 12px 14px; }
.notification-recipient-menu .dc-option { white-space: normal; overflow-wrap: anywhere; }

.integration-card { padding: 0; }
.integration-card > .empty, .integration-card > .status, .integration-card > [data-control="add-integration"] { margin: 16px 20px; }
.integration-card .empty { padding: 24px 20px; }
.integration-actions { flex-wrap: wrap; }

/* Действие добавления открывает отдельный попап и живёт в шапке справа. */
.integration-page-actions:not(:has(> :not([hidden]))) { display: none; }
.page-head:has(> .integration-page-actions > :not([hidden])) { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.page-head:has(> .integration-page-actions > :not([hidden])) > div:first-child { min-width: 0; }
.integration-page-actions { flex-shrink: 0; }
.integration-page-actions .btn { white-space: nowrap; }
@media (max-width: 560px) {
  .page-head:has(> .integration-page-actions > :not([hidden])) { flex-direction: column; align-items: stretch; gap: 12px; }
  .page-head:has(> .integration-page-actions > :not([hidden])) > div:first-child { width: 100%; }
  .integration-page-actions { align-self: flex-end; }
}

.integration-type-chooser { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.integration-type-chooser > .field-note { grid-column: 1 / -1; margin: 0 0 4px; }
.integration-type-option { min-height: 52px; white-space: normal; }
.integration-managed-list:empty { display: none; }
.integration-card .integration-row:last-child { border-bottom: 0; }
@media (max-width: 560px) {
  .integration-type-chooser { grid-template-columns: 1fr; }
  .integration-page-actions .btn { white-space: normal; }
}