.integration-catalog { display: grid; gap: 28px; }
.integration-category { display: grid; gap: 12px; }
.integration-category__header { display: grid; gap: 4px; }
.integration-category__header h2 { font-size: var(--font-lg); line-height: var(--line-lg); }
.integration-category__header p { color: var(--color-text-secondary); }
.integration-tiles { display: grid; width: 100%; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; }
.integration-tile { display: flex; min-width: 0; min-height: 138px; align-items: flex-start; flex-direction: column; gap: 10px; overflow: hidden; padding: 14px; }
.integration-tile:hover { border-color: var(--color-accent); }
.integration-tile--placeholder { cursor: default; }
.integration-tile--placeholder:hover { border-color: var(--color-border); box-shadow: var(--shadow-card); transform: none; }
.integration-tile__icon { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; border-radius: var(--radius-control); color: var(--color-text-inverse); font-size: var(--font-sm); line-height: var(--line-sm); font-weight: 700; }
.integration-tile__icon--dadata { background: #8b5cf6; }
.integration-tile__icon--moysklad { background: #249bd7; }
.integration-tile__icon--tilda { background: #111111; }
.integration-tile__icon--unisender-go { background: #009bd8; }
.integration-tile__icon--ozon { background: #005bff; }
.integration-tile__icon--wildberries { background: linear-gradient(135deg, #cb11ab, #481173); }
.integration-tile__icon--yandex-market { background: #ffcc00; color: var(--color-text-primary); }
.integration-tile__icon--alfa-bank { background: #ef3124; }
.integration-tile__icon--kontur { background: #ef4444; }
.integration-tile__icon--fns { background: #2563eb; }
.integration-tile__icon--rusprofile { background: #0f766e; }
.integration-tile__icon--bank { background: #64748b; }
.integration-tile__icon--one-c { background: #eab308; color: var(--color-text-primary); }
.integration-tile__icon--telegram { background: #229ed9; }
.integration-tile__icon--webhooks { background: #f97316; }
.integration-tile__icon--email { background: #7c3aed; }
.integration-tile__content { display: grid; width: 100%; min-width: 0; gap: 4px; }
.integration-tile__title { display: flex; min-width: 0; align-items: center; flex-wrap: wrap; gap: 6px; }
.integration-tile__title strong { color: var(--color-text-primary); font-size: var(--font-sm); line-height: var(--line-sm); }
.integration-tile__title small { padding: 2px 6px; border-radius: var(--radius-status); background: var(--color-surface-muted); color: var(--color-text-tertiary); font-size: 10px; line-height: 14px; }
.integration-tile__content > span:last-child { display: -webkit-box; overflow: hidden; color: var(--color-text-secondary); font-size: var(--font-xs); line-height: var(--line-xs); -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
.settings-section-heading { display: flex; align-items: flex-start; flex-direction: column; gap: 12px; margin: 20px 0 12px; }
.settings-section-heading p { margin-top: 2px; color: var(--color-text-secondary); }
.settings-integration { display: grid; max-width: 640px; gap: 16px; padding: 24px; }
.settings-integration > p { color: var(--color-text-secondary); }
.settings-integration form { display: grid; gap: 16px; }
.settings-integration form .button { justify-self: start; }
.integration-settings { max-width: 640px; }
.integration-settings form { display: grid; gap: 16px; }
.integration-settings .form-section { display: grid; gap: 16px; }
.integration-settings .form-section h2 { margin-bottom: 0; }
.integration-settings .form-section__description { margin-top: -10px; color: var(--color-text-secondary); }
.settings-placeholder h2 { color: var(--color-text-primary); }
.settings-placeholder p { margin-top: 6px; }
.role-form__fields { grid-template-columns: 1fr; }
.role-form-actions { display: flex; justify-content: flex-start; }
.role-permissions__groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.role-permissions__group { min-width: 0; padding: 16px; border: 1px solid var(--color-border); border-radius: var(--radius-surface); }
.role-permissions__group legend { padding: 0 6px; color: var(--color-text-primary); font-weight: 600; }
.role-permissions__options { display: grid; gap: 12px; }
.role-permissions__separator { display: block; height: 1px; margin: 2px 0; background: var(--color-border); }
.role-permissions__group--settings { grid-column: 1 / -1; }
.role-permissions__settings { display: grid; }
.role-permissions__subgroup { padding: 16px 0; border-bottom: 1px solid var(--color-border); }
.role-permissions__subgroup:first-child { padding-top: 0; }
.role-permissions__subgroup:last-child { padding-bottom: 0; border-bottom: 0; }
.role-permissions__subgroup h3 { margin: 0 0 12px; font-size: var(--font-sm); line-height: var(--line-sm); font-weight: 600; }
.role-permission { display: flex; align-items: flex-start; gap: 9px; color: var(--color-text-primary); cursor: pointer; }
.role-permission input { margin-top: 2px; }
.role-permission:has(input:disabled) { color: var(--color-text-secondary); cursor: not-allowed; }
.role-permission input:disabled { cursor: not-allowed; }

[data-role-modal] .admin-form-layout { display: block; }
[data-role-modal] .admin-form-layout > div { gap: 28px; }
[data-role-modal] .form-section,
[data-lead-status-modal] .form-section { padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
[data-role-modal] .form-section h2,
[data-lead-status-modal] .form-section h2 { font-size: var(--font-base); line-height: var(--line-base); }
[data-role-modal] .role-permissions__groups,
[data-lead-status-modal] .role-permissions__groups { grid-template-columns: 1fr; }
[data-integration-modal] .integration-settings { max-width: none; }
[data-integration-modal] .integration-settings form { gap: 28px; }
[data-integration-modal] .form-section { padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
[data-integration-modal] .form-section h2 { font-size: var(--font-base); line-height: var(--line-base); }
.finance-integration-connections-heading { display: flex; align-items: flex-start; flex-direction: column; gap: 12px; margin-bottom: 24px; }
.finance-integration-connections-heading h2,
.finance-integration-connections-heading p { margin: 0; }
.finance-integration-connections-heading p { margin-top: 5px; color: var(--color-text-secondary); }
.finance-integration-connections-heading .button { align-self: flex-start; }
.finance-integration-connections { display: grid; gap: 16px; }
.finance-integration-connections__empty { padding: 28px 20px; border: 1px dashed var(--color-border); border-radius: var(--radius-surface); color: var(--color-text-secondary); text-align: center; }
.finance-integration-connections__empty strong { display: block; color: var(--color-text-primary); font-weight: 500; }
.finance-integration-connections__empty p { max-width: 440px; margin: 6px auto 0; }
.finance-integration-connection { min-width: 0; margin: 0; padding: 0; overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-surface); background: var(--color-surface); transition: border-color .15s ease; }
.finance-integration-connection.is-expanded { border-color: var(--color-border-strong); }
.finance-integration-connection__heading { display: flex; align-items: stretch; justify-content: space-between; gap: 0; background: var(--color-surface-muted); }
.finance-integration-connection__toggle { display: flex; min-width: 0; flex: 1; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 16px; border: 0; background: transparent; text-align: left; cursor: pointer; }
.finance-integration-connection__identity { display: grid; min-width: 0; gap: 3px; }
.finance-integration-connection__identity > strong,
.finance-integration-connection__identity > small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.finance-integration-connection__identity > strong { color: var(--color-text-primary); font-weight: 500; }
.finance-integration-connection__identity > small { color: var(--color-text-secondary); }
.finance-integration-connection__badges { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.finance-integration-connection__badge { width: fit-content; padding: 2px 7px; border-radius: var(--radius-status); background: var(--color-accent-soft); color: var(--color-text-primary); font-size: var(--font-xs); line-height: var(--line-xs); }
.finance-integration-connection__arrow { width: 10px; height: 8px; flex: 0 0 auto; background: var(--color-text-secondary); -webkit-mask: var(--portal-chevron-image) center / contain no-repeat; mask: var(--portal-chevron-image) center / contain no-repeat; transition: transform .15s ease; }
.finance-integration-connection.is-expanded .finance-integration-connection__arrow { transform: rotate(180deg); }
.finance-integration-connection__heading .button-link { align-self: center; margin-right: 16px; border: 0; background: transparent; color: var(--color-danger); cursor: pointer; }
.finance-integration-connection__heading .button-link:disabled { cursor: not-allowed; opacity: .65; }
.finance-integration-connection__body { display: grid; gap: 20px; padding: 16px; border-top: 1px solid var(--color-border); }
.finance-integration-connection__sync { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 14px; border-radius: var(--radius-surface); background: var(--color-surface-muted); }
.finance-integration-connection__sync > div { display: grid; min-width: 0; gap: 3px; }
.finance-integration-connection__sync span { color: var(--color-text-secondary); font-size: var(--font-xs); line-height: var(--line-xs); }
.finance-integration-connection__sync strong { overflow-wrap: anywhere; font-weight: 500; }
.finance-integration-connection__sync p { grid-column: 1 / -1; overflow-wrap: anywhere; }
.finance-integration-connection__sync p.is-error { color: var(--color-danger); }
.finance-integration-connection__sync p.is-meta { color: var(--color-text-primary); }
.finance-integration-connection__sync .button { grid-column: 1 / -1; justify-self: start; }
.finance-integration-connection__accounts { display: grid; gap: 10px; }
.finance-integration-connection__accounts h3 { font-size: var(--font-sm); line-height: var(--line-sm); font-weight: 500; }
.finance-integration-connection__account { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 14px; border: 1px solid var(--color-border); border-radius: var(--radius-surface); }
.finance-integration-connection__account > span { display: grid; min-width: 0; gap: 3px; }
.finance-integration-connection__account > span strong,
.finance-integration-connection__account > span small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.finance-integration-connection__account > span strong,
.finance-integration-connection__account > strong { font-weight: 500; }
.finance-integration-connection__account small { color: var(--color-text-secondary); }
.finance-integration-connection__account > strong { flex: 0 0 auto; }

.pricing-settings { max-width: 640px; padding: 24px; }
.pricing-settings form { display: grid; gap: 24px; }
.pricing-settings form > .button { justify-self: start; }
.pricing-settings__intro { display: grid; width: min(280px, 100%); grid-template-columns: 1fr; gap: 20px; }
.pricing-settings__levels { min-width: 560px; table-layout: fixed; }
.pricing-settings__levels th:first-child { width: 22%; }
.pricing-settings__levels th:nth-child(2), .pricing-settings__levels th:nth-child(3) { width: 39%; }
.pricing-settings__levels th, .pricing-settings__levels td { padding-inline: 12px; }
.pricing-settings__levels tbody th { color: var(--color-text-primary); font-weight: 500; text-align: left; }
.pricing-settings__levels input {
  width: 100%;
  min-width: 0;
  height: 40px;
  padding: 0 12px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-control);
  background-color: var(--color-surface);
  color: var(--color-text-primary);
  font: inherit;
}
.pricing-settings__levels input:hover { border-color: var(--color-border-strong); }
.pricing-settings__levels input:focus { border-color: var(--color-accent); outline: none; }

.lead-status-directory { position: relative; }
.lead-status-table { min-width: 620px; }
.lead-status-table th:last-child, .lead-status-table td:last-child { width: 140px; }
.lead-status-group-row > td, .lead-status-group-row > th { background: var(--color-surface-muted); }
.lead-status-group-row th {
  color: var(--color-text-primary);
  font-weight: 600;
  text-align: left;
}
.lead-status-group-row th > span:last-child {
  margin-left: 6px;
  color: var(--color-text-secondary);
  font-size: var(--font-xs);
  font-weight: 400;
}
.lead-status-group-row th > .lead-status-group-count.saved-filter__count {
  color: var(--color-text-primary);
  font-size: var(--font-sm);
  line-height: 1;
}
.lead-status-group-mark { display: inline-block; width: 8px; height: 8px; margin-right: 8px; border-radius: var(--radius-round); background: var(--status-background, currentColor); }
.lead-status-system-label { color: var(--color-text-secondary); font-size: var(--font-xs); line-height: var(--line-xs); }
.lead-status-name-cell .status a { color: inherit; text-decoration: none; }
.lead-status-name-cell .status a:hover { text-decoration: underline; }
.lead-status-drag-handle { display: none; cursor: grab; }
.lead-status-drag-handle:active { cursor: grabbing; }
.lead-status-directory.is-reordering .lead-status-row[data-reorder-active] .lead-status-actions-trigger { display: none; }
.lead-status-directory.is-reordering .lead-status-row[data-reorder-active] .lead-status-drag-handle { display: inline-grid; }
.lead-status-directory.is-reordering .lead-status-row[data-reorder-active] .lead-status-name-cell > .status { animation: lead-status-jiggle .18s ease-in-out infinite alternate; will-change: transform; }
.lead-status-directory.is-reordering .lead-status-row[data-reorder-active]:nth-child(2n) .lead-status-name-cell > .status { animation-delay: -.06s; animation-direction: alternate-reverse; }
.lead-status-directory.is-reordering .lead-status-row[data-reorder-active]:nth-child(3n) .lead-status-name-cell > .status { animation-delay: -.12s; }
.lead-status-directory.is-reordering .lead-status-row.is-dragging .lead-status-name-cell > .status { animation: none; }
@keyframes lead-status-jiggle {
  from { transform: translateY(-.4px) rotate(-1deg); }
  to { transform: translateY(.4px) rotate(1deg); }
}
[data-lead-status-modal] .lead-status-transitions {
  display: grid;
  gap: 14px;
  margin-top: 24px;
}
[data-lead-status-modal] .lead-status-transitions h2 { margin: 0; }
[data-lead-status-modal] .lead-status-transitions .form-section__description {
  margin: 0;
  color: var(--color-text-secondary);
}
.lead-status-transitions .role-permission { align-items: center; }
.lead-status-transitions .role-permission input { margin-top: 0; }
.lead-status-duration { display: grid; gap: 10px; }
.lead-status-duration__toggle { width: max-content; align-items: center; }
.lead-status-duration__toggle input { margin-top: 0; }
.lead-status-duration__controls { display: flex; align-items: stretch; }
.lead-status-duration__controls[hidden] { display: none; }
.lead-status-duration__controls > input {
  width: 104px;
  min-width: 0;
  border-radius: var(--radius-control) 0 0 var(--radius-control);
}
.lead-status-duration__units { display: inline-flex; }
.lead-status-duration__unit { display: block; }
.lead-status-duration__unit input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.lead-status-duration__unit span {
  display: grid;
  min-width: 58px;
  height: 100%;
  place-items: center;
  padding: 0 12px;
  border: 1px solid var(--color-border);
  border-left: 0;
  background: var(--color-surface);
  cursor: pointer;
}
.lead-status-duration__unit:last-child span { border-radius: 0 var(--radius-control) var(--radius-control) 0; }
.lead-status-duration__unit input:checked + span {
  background: var(--color-surface-hover);
  color: var(--color-text-primary);
}
.lead-status-duration__unit input:focus-visible + span { outline: 2px solid var(--color-accent); outline-offset: -2px; }
.lead-status-duration__unit input:disabled + span { color: var(--color-text-secondary); cursor: not-allowed; }

@media (prefers-reduced-motion: reduce) {
  .lead-status-directory.is-reordering .lead-status-row[data-reorder-active] .lead-status-name-cell > .status { animation: none; }
}

.dds-directory-filters .search-field,
.dds-directory-filters .select-field,
.dds-directory-filters .select-field select { width: 255px; min-width: 0; }
.dds-directory-create-actions__desktop { display: flex; align-items: center; gap: 10px; }
.dds-directory-create-menu { display: none; }
.dds-directory-table { min-width: 720px; }
.dds-directory-form { display: grid; gap: 16px; }
.settings-directory-form { display: grid; gap: 16px; }

@media (max-width: 767px) {
  .integration-tile { min-height: 138px; }
  .settings-integration { padding: 20px; }
  .pricing-settings__intro { grid-template-columns: 1fr; }
  .role-permissions__groups { grid-template-columns: 1fr; }
  .finance-integration-connection__sync { grid-template-columns: 1fr; }
  .finance-integration-connection__sync p,
  .finance-integration-connection__sync .button { grid-column: 1; }
  .finance-integration-connection__account { align-items: flex-start; flex-direction: column; gap: 8px; }
  .dds-directory-filters .search-field,
  .dds-directory-filters .select-field,
  .dds-directory-filters .select-field select { width: 100%; }
  .dds-directory-create-actions__desktop { display: none; }
  .dds-directory-create-menu { display: inline-flex; }
}

@media (max-width: 560px) {
  .integration-tiles { grid-template-columns: 1fr; }
}
