.container {
  max-width: 100%;
  margin: 0 auto;
  padding: 30px 20px 0 20px;
}

html.page--pipeline-stages,
body.page--pipeline-stages {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
html.page--pipeline-stages::-webkit-scrollbar,
body.page--pipeline-stages::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

.pipeline-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
  border-bottom: 1px solid var(--border);
  padding: 0 0 10px 0;
}
.pipeline-header > .header-left {
  flex: 1 1 auto;
  min-width: 0;
}
.pipeline-header > .create-stage-button {
  flex: 0 0 auto;
}
.pipelines-container .pipeline-header {
  padding: 10px;
}

.pipeline-header h1 {
  font-size: 24px;
  margin: 0;
  color: var(--text);
}

.pipeline-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
  color: #6c757d;
}

.stages-header-wrapper {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.pipeline-stats {
  margin-left: 5px;
}

.stages-container {
  display: flex;
  flex-wrap: nowrap;
  gap: 20px;
  --hscroll-gap: 20px;
  margin-top: 15px;
  margin-bottom: 15px;
  width: 100%;
  overflow-x: auto;
  padding-bottom: 10px;
  scroll-snap-type: x proximity;
}

.stage-card {
  background: var(--bg-white);
  border-radius: 12px;
  padding: 15px;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
  transition: var(--crm-hover-transition);
  border: 1px solid var(--border);
  align-self: start;
  position: relative;
  min-width: 320px;
  max-width: 360px;
  flex-shrink: 0;
  scroll-snap-align: start;
}

@media (min-width: 1024px) {
  .stage-card,
  .add-stage-card {
    flex: 0 0 clamp(280px, calc((100% - (var(--hscroll-gap) * 3)) / 4), 380px);
    min-width: 0;
    max-width: none;
  }
}

@media (min-width: 1024px) {
  
  .crm-sidebar--pinned ~ .crm-public-main .stages-container .stage-card,
  .crm-sidebar--pinned ~ .crm-public-main .stages-container .add-stage-card,
  .crm-public-layout:has(> .crm-sidebar:hover) .crm-public-main .stages-container .stage-card,
  .crm-public-layout:has(> .crm-sidebar:hover) .crm-public-main .stages-container .add-stage-card,
  .crm-public-layout:has(> .crm-sidebar:focus-within) .crm-public-main .stages-container .stage-card,
  .crm-public-layout:has(> .crm-sidebar:focus-within) .crm-public-main .stages-container .add-stage-card {
    flex-basis: clamp(300px, calc((100% - (var(--hscroll-gap) * 2)) / 3), 420px);
  }
}


.push-translation-hint {
  margin-top: 6px;
  font-size: 12px;
  line-height: 1.35;
  color: rgba(107, 114, 128, 1);
}

.stage-card:hover {
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}

@media (min-width: 1024px) {
  .stage-card {
    min-height: 80vh;
  }
}

@media (max-width: 768px) {
  .stages-header-wrapper {
    flex-wrap: wrap;
    gap: 12px;
  }
  .stages-header-wrapper .search-stages-container {
    width: 100%;
    max-width: 100%;
    flex: 1 1 100%;
  }
  .pipeline-stats {
    margin-left: auto;
  }
  .stages-container {
    flex-wrap: wrap;
  }
  .stage-card {
    min-width: 100%;
    max-width: 100%;
  }
}

@media (max-width: 520px) {
  .pipeline-header {
    align-items: stretch;
    flex-wrap: wrap;
  }
  .pipeline-header > .header-left {
    flex-basis: 100%;
  }
  .pipeline-header > .create-stage-button {
    width: min(100%, 185px);
    margin-left: auto;
  }
  .pipeline-header .pipeline-name-inline {
    font-size: 20px;
  }
}

.stage-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 15px;
  padding-bottom: 15px;
  border-bottom: 1px solid var(--border);
}

.stage-header-left {
  display: flex;
  align-items: center;
  flex: 1 1 auto;
  min-width: 0;
  gap: 5px;
}

.stage-header-right {
  display: flex;
  align-items: center;
  flex-direction: row;
  flex: 0 0 auto;
  gap: 5px;
}





body.is-bulk-select-mode .lead-select {
  display: inline-flex;
}
.lead-select {
  display: none;
  align-items: center;
  justify-content: center;
  margin-right: 8px;
  flex: 0 0 auto;
  position: relative;
}
.lead-select-checkbox {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
}
.lead-select-box {
  position: relative;
  width: 16px;
  height: 16px;
  border-radius: 5px;
  border: 1px solid var(--border-strong);
  background: var(--bg-elevated);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}
.lead-select-checkbox:focus-visible + .lead-select-box {
  border-color: var(--primary-border);
  box-shadow: 0 0 0 3px var(--primary-light);
}
.lead-select-checkbox:checked + .lead-select-box {
  border-color: var(--primary);
  background: var(--primary);
}
.lead-select-checkbox:checked + .lead-select-box:after {
  content: "";
  position: absolute;
  
  left: 5px;
  top: 2px;
  width: 4px;
  height: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.lead-card.is-selected .lead-chip {
  border-color: var(--primary-border);
  background: var(--primary-light);
}

.bulk-menu {
  position: absolute;
  width: min(360px, calc(100vw - 24px));
  z-index: 1200;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.14);
  padding: 10px;
  max-height: calc(100vh - 24px);
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.bulk-menu::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

@media (max-width: 520px) {
  .bulk-menu.bulk-menu--mobile {
    position: fixed;
    left: 12px !important;
    right: 12px !important;
    bottom: 12px !important;
    top: auto !important;
    width: auto;
    max-height: calc(100vh - 24px);
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    z-index: 3000;
    box-shadow: 0 22px 60px rgba(15, 23, 42, 0.22);
  }
  .bulk-menu.bulk-menu--mobile .bulk-move-dd__panel {
    max-height: min(46vh, 360px);
    -webkit-overflow-scrolling: touch;
  }
}
.bulk-menu__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  padding: 4px 4px 10px 4px;
}
.bulk-menu__title {
  font-weight: 700;
  font-size: 13px;
  color: var(--text-strong);
}
.bulk-menu__meta {
  font-size: 12px;
  color: var(--text-light);
}
.bulk-menu__group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.bulk-menu__divider {
  height: 1px;
  background: var(--border);
  margin: 10px 0;
}
.bulk-menu__subhead {
  font-size: 12px;
  font-weight: 700;
  color: #334155;
  margin-bottom: 4px;
}
.bulk-menu__empty {
  font-size: 12px;
  color: #64748b;
  padding: 6px 4px;
}
.bulk-menu-item {
  width: 100%;
  text-align: left;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  color: #0f172a;
  border-radius: 10px;
  padding: 10px 10px;
  font-size: 13px;
  cursor: pointer;
  transition: var(--crm-hover-transition);
  display: flex;
  align-items: center;
  gap: 5px;
}
.bulk-menu-item::before {
  content: "";
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  display: none;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  opacity: 0.95;
}

.bulk-menu-item[data-bulk-action="done"] {
  background-color: var(--green-btn-bg);
  color: var(--green-btn-color);
  border-color: var(--green-btn-border);
  font-weight: 600;
}
.bulk-menu-item[data-bulk-action="done"]::before {
  display: inline-block;
  
  background-color: transparent;
  -webkit-mask-image: none;
  mask-image: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 128 128'><circle cx='64' cy='64' r='64' fill='%2339b54a'/><path fill='%23ffffff' d='M53.7 91.3 28.5 66.4l9.1-9.3L53.7 73l36.7-36.3 9.1 9.2z'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.bulk-menu-item[data-bulk-action="done"]:not(:disabled):hover {
  background-color: var(--green-btn-hover-bg);
  border-color: var(--green-btn-hover-border);
}


.bulk-menu-item[data-bulk-action="select-all-stage"] {
  background: var(--primary-light);
  color: var(--primary-dark);
  border-color: var(--primary-border);
}
.bulk-menu-item[data-bulk-action="select-all-stage"]::before {
  display: inline-block;
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g transform='matrix(1.16 0 0 1.16 -1.92 -1.92)'><path fill='black' d='M16.19 2H7.81C4.17 2 2 4.17 2 7.81v8.38C2 19.83 4.17 22 7.81 22h8.38c3.64 0 5.81-2.17 5.81-5.81V7.81C22 4.17 19.83 2 16.19 2zM9.97 14.9l-2.25 2.25c-.15.15-.34.22-.53.22s-.39-.07-.53-.22l-.75-.75c-.3-.29-.3-.77 0-1.06.29-.29.76-.29 1.06 0l.22.22 1.72-1.72c.29-.29.76-.29 1.06 0 .29.29.29.77 0 1.06zm0-7-2.25 2.25c-.15.15-.34.22-.53.22s-.39-.07-.53-.22l-.75-.75c-.3-.29-.3-.77 0-1.06.29-.29.76-.29 1.06 0l.22.22 1.72-1.72c.29-.29.76-.29 1.06 0 .29.29.29.77 0 1.06zm7.59 8.72h-5.25c-.41 0-.75-.34-.75-.75s.34-.75.75-.75h5.25a.749.749 0 1 1 0 1.5zm0-7h-5.25c-.41 0-.75-.34-.75-.75s.34-.75.75-.75h5.25a.749.749 0 1 1 0 1.5z'/></g></svg>");
  mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g transform='matrix(1.16 0 0 1.16 -1.92 -1.92)'><path fill='black' d='M16.19 2H7.81C4.17 2 2 4.17 2 7.81v8.38C2 19.83 4.17 22 7.81 22h8.38c3.64 0 5.81-2.17 5.81-5.81V7.81C22 4.17 19.83 2 16.19 2zM9.97 14.9l-2.25 2.25c-.15.15-.34.22-.53.22s-.39-.07-.53-.22l-.75-.75c-.3-.29-.3-.77 0-1.06.29-.29.76-.29 1.06 0l.22.22 1.72-1.72c.29-.29.76-.29 1.06 0 .29.29.29.77 0 1.06zm0-7-2.25 2.25c-.15.15-.34.22-.53.22s-.39-.07-.53-.22l-.75-.75c-.3-.29-.3-.77 0-1.06.29-.29.76-.29 1.06 0l.22.22 1.72-1.72c.29-.29.76-.29 1.06 0 .29.29.29.77 0 1.06zm7.59 8.72h-5.25c-.41 0-.75-.34-.75-.75s.34-.75.75-.75h5.25a.749.749 0 1 1 0 1.5zm0-7h-5.25c-.41 0-.75-.34-.75-.75s.34-.75.75-.75h5.25a.749.749 0 1 1 0 1.5z'/></g></svg>");
}


.bulk-menu-item[data-bulk-action="select-all-pipeline"] {
  background: var(--primary-light);
  color: var(--primary-dark);
  border-color: var(--primary-border);
}
.bulk-menu-item[data-bulk-action="select-all-pipeline"]::before {
  display: inline-block;
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g transform='matrix(1.17 0 0 1.17 -2.12925 -2.04007)'><path fill='black' d='M16.88 10c-2.62 0-4.75 2.13-4.75 4.75 0 .89.25 1.73.69 2.45.82 1.38 2.33 2.3 4.06 2.3s3.24-.93 4.06-2.3c.44-.71.69-1.56.69-2.45 0-2.62-2.12-4.75-4.75-4.75zm1.78 5.48h-1.03v1.07c0 .41-.34.75-.75.75s-.75-.34-.75-.75v-1.07h-1.02c-.41 0-.75-.34-.75-.75s.34-.75.75-.75h1.02V13c0-.41.34-.75.75-.75s.75.34.75.75v.98h1.03c.41 0 .75.34.75.75s-.34.75-.75.75z'/><path fill='black' d='M20.58 4.02v2.22c0 .81-.5 1.82-1 2.33l-.18.16c-.14.13-.35.16-.53.1-.2-.07-.4-.12-.6-.17-.44-.11-.91-.16-1.39-.16-3.45 0-6.25 2.8-6.25 6.25 0 1.14.31 2.26.9 3.22.5.84 1.2 1.54 1.96 2.01.23.15.32.47.12.65-.07.06-.14.11-.21.16l-1.4.91c-1.3.81-3.09-.1-3.09-1.72v-5.35c0-.71-.4-1.62-.8-2.12L4.32 8.47c-.5-.51-.9-1.42-.9-2.02V4.12c0-1.21.9-2.12 1.99-2.12h13.18c1.09 0 1.99.91 1.99 2.02z'/></g></svg>");
  mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g transform='matrix(1.17 0 0 1.17 -2.12925 -2.04007)'><path fill='black' d='M16.88 10c-2.62 0-4.75 2.13-4.75 4.75 0 .89.25 1.73.69 2.45.82 1.38 2.33 2.3 4.06 2.3s3.24-.93 4.06-2.3c.44-.71.69-1.56.69-2.45 0-2.62-2.12-4.75-4.75-4.75zm1.78 5.48h-1.03v1.07c0 .41-.34.75-.75.75s-.75-.34-.75-.75v-1.07h-1.02c-.41 0-.75-.34-.75-.75s.34-.75.75-.75h1.02V13c0-.41.34-.75.75-.75s.75.34.75.75v.98h1.03c.41 0 .75.34.75.75s-.34.75-.75.75z'/><path fill='black' d='M20.58 4.02v2.22c0 .81-.5 1.82-1 2.33l-.18.16c-.14.13-.35.16-.53.1-.2-.07-.4-.12-.6-.17-.44-.11-.91-.16-1.39-.16-3.45 0-6.25 2.8-6.25 6.25 0 1.14.31 2.26.9 3.22.5.84 1.2 1.54 1.96 2.01.23.15.32.47.12.65-.07.06-.14.11-.21.16l-1.4.91c-1.3.81-3.09-.1-3.09-1.72v-5.35c0-.71-.4-1.62-.8-2.12L4.32 8.47c-.5-.51-.9-1.42-.9-2.02V4.12c0-1.21.9-2.12 1.99-2.12h13.18c1.09 0 1.99.91 1.99 2.02z'/></g></svg>");
}


.bulk-menu-item[data-bulk-action="clear-all"],
.bulk-menu-item[data-bulk-action="clear-stage"] {
  background: rgba(245, 158, 11, 0.1);
  color: #b45309;
  border-color: rgba(245, 158, 11, 0.22);
}
.bulk-menu-item[data-bulk-action="clear-all"]::before,
.bulk-menu-item[data-bulk-action="clear-stage"]::before {
  display: inline-block;
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><path fill='black' d='M436.896 74.869c-99.84-99.819-262.208-99.819-362.048 0-99.797 99.819-99.797 262.229 0 362.048 49.92 49.899 115.477 74.837 181.035 74.837s131.093-24.939 181.013-74.837c99.819-99.818 99.819-262.229 0-362.048zm-75.435 256.448c8.341 8.341 8.341 21.824 0 30.165a21.275 21.275 0 0 1-15.083 6.251 21.277 21.277 0 0 1-15.083-6.251l-75.413-75.435-75.392 75.413a21.348 21.348 0 0 1-15.083 6.251 21.277 21.277 0 0 1-15.083-6.251c-8.341-8.341-8.341-21.845 0-30.165l75.392-75.413-75.413-75.413c-8.341-8.341-8.341-21.845 0-30.165 8.32-8.341 21.824-8.341 30.165 0l75.413 75.413 75.413-75.413c8.341-8.341 21.824-8.341 30.165 0 8.341 8.32 8.341 21.824 0 30.165l-75.413 75.413 75.415 75.435z'/></svg>");
  mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><path fill='black' d='M436.896 74.869c-99.84-99.819-262.208-99.819-362.048 0-99.797 99.819-99.797 262.229 0 362.048 49.92 49.899 115.477 74.837 181.035 74.837s131.093-24.939 181.013-74.837c99.819-99.818 99.819-262.229 0-362.048zm-75.435 256.448c8.341 8.341 8.341 21.824 0 30.165a21.275 21.275 0 0 1-15.083 6.251 21.277 21.277 0 0 1-15.083-6.251l-75.413-75.435-75.392 75.413a21.348 21.348 0 0 1-15.083 6.251 21.277 21.277 0 0 1-15.083-6.251c-8.341-8.341-8.341-21.845 0-30.165l75.392-75.413-75.413-75.413c-8.341-8.341-8.341-21.845 0-30.165 8.32-8.341 21.824-8.341 30.165 0l75.413 75.413 75.413-75.413c8.341-8.341 21.824-8.341 30.165 0 8.341 8.32 8.341 21.824 0 30.165l-75.413 75.413 75.415 75.435z'/></svg>");
}
.bulk-menu-item[data-bulk-action="clear-all"]:not(:disabled):hover,
.bulk-menu-item[data-bulk-action="clear-stage"]:not(:disabled):hover {
  background: rgba(245, 158, 11, 0.2);
  border-color: rgba(245, 158, 11, 0.32);
}


.bulk-menu-item[data-bulk-action="tag-chats"] {
  background: var(--primary-light);
  color: var(--primary-dark);
  border-color: var(--primary-border);
}
.bulk-menu-item[data-bulk-action="tag-chats"]::before {
  display: inline-block;
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'><g><g><path fill='black' d='M25.969 1.029h-10a1 1 0 0 0-.707.293L13.183 3.4A6.991 6.991 0 1 1 3.4 13.183l-1.381 1.382a3.488 3.488 0 0 0 0 4.928l6.486 6.486a3.484 3.484 0 0 0 4.928 0l13.243-13.243a1 1 0 0 0 .293-.707v-10a1 1 0 0 0-1-1zM22 8a2 2 0 1 1 2-2 2 2 0 0 1-2 2z'/><path fill='black' d='M9 14a5 5 0 1 0-5-5 5.006 5.006 0 0 0 5 5zM7 8h1V7a1 1 0 0 1 2 0v1h1a1 1 0 0 1 0 2h-1v1a1 1 0 0 1-2 0v-1H7a1 1 0 0 1 0-2z'/></g></g></svg>");
  mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'><g><g><path fill='black' d='M25.969 1.029h-10a1 1 0 0 0-.707.293L13.183 3.4A6.991 6.991 0 1 1 3.4 13.183l-1.381 1.382a3.488 3.488 0 0 0 0 4.928l6.486 6.486a3.484 3.484 0 0 0 4.928 0l13.243-13.243a1 1 0 0 0 .293-.707v-10a1 1 0 0 0-1-1zM22 8a2 2 0 1 1 2-2 2 2 0 0 1-2 2z'/><path fill='black' d='M9 14a5 5 0 1 0-5-5 5.006 5.006 0 0 0 5 5zM7 8h1V7a1 1 0 0 1 2 0v1h1a1 1 0 0 1 0 2h-1v1a1 1 0 0 1-2 0v-1H7a1 1 0 0 1 0-2z'/></g></g></svg>");
}


.bulk-menu-item[data-bulk-action="add-task"] {
  background: var(--primary-light);
  color: var(--primary-dark);
  border-color: var(--primary-border);
}
.bulk-menu-item[data-bulk-action="add-task"]::before {
  display: inline-block;
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><g transform='matrix(1.12 0 0 1.12 -1.92 -1.92)'><path fill='black' d='M20.68 2.96H8.78c-2.67 0-4.85 2.18-4.85 4.85v17.34c0 2.67 2.18 4.85 4.85 4.85h13.48c2.67 0 4.85-2.18 4.85-4.85V9.35a2.964 2.964 0 0 1-2.92 2.43c-1.63 0-2.94-1.29-2.99-2.9a3 3 0 0 1-2.9-2.99c0-1.44 1.02-2.64 2.38-2.93zM9.76 22.3c-.55 0-1-.45-1-1 0-.56.44-1 .99-1h.01c.55 0 1 .44 1 1 0 .55-.45 1-1 1zm0-4.82c-.55 0-1-.45-1-1s.44-1 .99-1h.01c.55 0 1 .45 1 1s-.45 1-1 1zm0-4.81c-.55 0-1-.45-1-1 0-.56.44-1 .99-1h.01c.55 0 1 .44 1 1 0 .55-.45 1-1 1zM21.3 22.3h-7.71c-.55 0-1-.45-1-1 0-.56.45-1 1-1h7.71c.55 0 1 .44 1 1 0 .55-.45 1-1 1zm0-4.82h-7.71c-.55 0-1-.45-1-1s.45-1 1-1h7.71c.55 0 1 .45 1 1s-.45 1-1 1zm0-6.81c.55 0 1 .44 1 1 0 .55-.45 1-1 1h-7.71c-.55 0-1-.45-1-1 0-.56.45-1 1-1z'/><path fill='black' d='M24.185 2a1 1 0 0 0-1 1v1.889h-1.889a1 1 0 1 0 0 2h1.89v1.888a1 1 0 1 0 2 0V6.89h1.888a1 1 0 1 0 0-2h-1.889V3a1 1 0 0 0-1-1z'/></g></svg>");
  mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><g transform='matrix(1.12 0 0 1.12 -1.92 -1.92)'><path fill='black' d='M20.68 2.96H8.78c-2.67 0-4.85 2.18-4.85 4.85v17.34c0 2.67 2.18 4.85 4.85 4.85h13.48c2.67 0 4.85-2.18 4.85-4.85V9.35a2.964 2.964 0 0 1-2.92 2.43c-1.63 0-2.94-1.29-2.99-2.9a3 3 0 0 1-2.9-2.99c0-1.44 1.02-2.64 2.38-2.93zM9.76 22.3c-.55 0-1-.45-1-1 0-.56.44-1 .99-1h.01c.55 0 1 .44 1 1 0 .55-.45 1-1 1zm0-4.82c-.55 0-1-.45-1-1s.44-1 .99-1h.01c.55 0 1 .45 1 1s-.45 1-1 1zm0-4.81c-.55 0-1-.45-1-1 0-.56.44-1 .99-1h.01c.55 0 1 .44 1 1 0 .55-.45 1-1 1zM21.3 22.3h-7.71c-.55 0-1-.45-1-1 0-.56.45-1 1-1h7.71c.55 0 1 .44 1 1 0 .55-.45 1-1 1zm0-4.82h-7.71c-.55 0-1-.45-1-1s.45-1 1-1h7.71c.55 0 1 .45 1 1s-.45 1-1 1zm0-6.81c.55 0 1 .44 1 1 0 .55-.45 1-1 1h-7.71c-.55 0-1-.45-1-1 0-.56.45-1 1-1z'/><path fill='black' d='M24.185 2a1 1 0 0 0-1 1v1.889h-1.889a1 1 0 1 0 0 2h1.89v1.888a1 1 0 1 0 2 0V6.89h1.888a1 1 0 1 0 0-2h-1.889V3a1 1 0 0 0-1-1z'/></g></svg>");
}


.bulk-menu-item[data-bulk-action="send-push"] {
  background: var(--info-btn-bg);
  color: var(--info-btn-color);
  border-color: var(--info-btn-border);
}
.bulk-menu-item[data-bulk-action="send-push"]::before {
  display: inline-block;
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 682.667 682.667'><g transform='matrix(1.33333 0 0 -1.33333 0 682.667)'><path d='m0 0-141.421-367.695a39.87 39.87 0 0 0-9.051-13.902c-15.621-15.621-40.947-15.621-56.569 0A39.81 39.81 0 0 0-217.39-363.7l-35.869 133.912a39.812 39.812 0 0 1-10.35 17.897 39.806 39.806 0 0 1-17.896 10.349l-133.913 35.87a39.801 39.801 0 0 0-17.896 10.349c-15.622 15.621-15.622 40.948 0 56.569a39.84 39.84 0 0 0 13.901 9.05L-51.718 51.718c14.303 5.502 31.132 2.485 42.668-9.051C2.485 31.132 5.502 14.303 0 0Z' transform='translate(489.325 437.607)' fill='none' stroke='black' stroke-width='40' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10'/><path d='m0 0-84.853-84.853' transform='translate(104.853 104.853)' fill='none' stroke='black' stroke-width='40' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10'/><path d='m0 0-56.568-56.568' transform='translate(189.706 76.568)' fill='none' stroke='black' stroke-width='40' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10'/><path d='m0 0-56.568-56.568' transform='translate(76.568 189.706)' fill='none' stroke='black' stroke-width='40' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10'/><path d='m0 0-84.853-84.853' transform='translate(367.137 367.137)' fill='none' stroke='black' stroke-width='40' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10'/></g></svg>");
  mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 682.667 682.667'><g transform='matrix(1.33333 0 0 -1.33333 0 682.667)'><path d='m0 0-141.421-367.695a39.87 39.87 0 0 0-9.051-13.902c-15.621-15.621-40.947-15.621-56.569 0A39.81 39.81 0 0 0-217.39-363.7l-35.869 133.912a39.812 39.812 0 0 1-10.35 17.897 39.806 39.806 0 0 1-17.896 10.349l-133.913 35.87a39.801 39.801 0 0 0-17.896 10.349c-15.622 15.621-15.622 40.948 0 56.569a39.84 39.84 0 0 0 13.901 9.05L-51.718 51.718c14.303 5.502 31.132 2.485 42.668-9.051C2.485 31.132 5.502 14.303 0 0Z' transform='translate(489.325 437.607)' fill='none' stroke='black' stroke-width='40' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10'/><path d='m0 0-84.853-84.853' transform='translate(104.853 104.853)' fill='none' stroke='black' stroke-width='40' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10'/><path d='m0 0-56.568-56.568' transform='translate(189.706 76.568)' fill='none' stroke='black' stroke-width='40' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10'/><path d='m0 0-56.568-56.568' transform='translate(76.568 189.706)' fill='none' stroke='black' stroke-width='40' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10'/><path d='m0 0-84.853-84.853' transform='translate(367.137 367.137)' fill='none' stroke='black' stroke-width='40' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10'/></g></svg>");
}

.bulk-menu-item:not(:disabled):not(.danger):not([data-bulk-action="done"]):not([data-bulk-action="select-all-stage"]):not([data-bulk-action="select-all-pipeline"]):not([data-bulk-action="clear-all"]):not([data-bulk-action="clear-stage"]):not([data-bulk-action="tag-chats"]):not([data-bulk-action="add-task"]):not([data-bulk-action="send-push"]):hover {
  background: #eef2f7;
  border-color: #d8dee9;
  color: #0f172a;
}

.bulk-menu-item:not(:disabled):hover {
  transform: translateY(-1px) scale(1.02);
}

.bulk-menu-item[data-bulk-action="select-all-stage"]:not(:disabled):hover,
.bulk-menu-item[data-bulk-action="select-all-pipeline"]:not(:disabled):hover,
.bulk-menu-item[data-bulk-action="tag-chats"]:not(:disabled):hover,
.bulk-menu-item[data-bulk-action="add-task"]:not(:disabled):hover {
  background: rgba(91, 33, 182, 0.2);
  border-color: rgba(91, 33, 182, 0.32);
}

.bulk-menu-item[data-bulk-action="send-push"]:not(:disabled):hover {
  background: var(--info-btn-hover-bg);
  border-color: var(--info-btn-hover-border);
}


.bulk-menu-item.danger[data-bulk-action="delete-selected"]::before {
  display: inline-block;
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='black' d='M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0V6z'/><path fill='black' fill-rule='evenodd' d='M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1v1zM4.118 4 4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4H4.118zM2.5 3V2h11v1h-11z'/></svg>");
  mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='black' d='M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0V6z'/><path fill='black' fill-rule='evenodd' d='M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1v1zM4.118 4 4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4H4.118zM2.5 3V2h11v1h-11z'/></svg>");
}
.bulk-menu-item:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  pointer-events: none;
  transform: none;
}

.bulk-menu-item.is-loading {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: progress;
}
.bulk-menu-item.is-loading:hover {
  background: #f8fafc;
  border-color: #e2e8f0;
}
.bulk-btn-spinner {
  position: relative;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
}
.bulk-btn-spinner::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 2px solid rgba(91, 33, 182, 0.22);
  border-top-color: rgba(91, 33, 182, 0.78);
  animation: crm-spin 0.9s linear infinite;
}
.bulk-btn-progress {
  position: relative;
  z-index: 1;
  font-size: 10px;
  font-weight: 700;
  color: #334155;
  line-height: 1;
}
.bulk-btn-label {
  flex: 1 1 auto;
  min-width: 0;
}
.bulk-menu-item.danger {
  background: var(--red-btn-bg);
  border-color: var(--red-btn-border);
  color: var(--red-btn-color);
}
.bulk-menu-item.danger:hover {
  background: var(--red-btn-hover-bg);
  border-color: var(--red-btn-hover-border);
}

.bulk-move-dd {
  width: 100%;
}
.bulk-move-dd__btn {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  color: #0f172a;
  border-radius: 10px;
  padding: 10px 10px;
  font-size: 13px;
  cursor: pointer;
  transition: var(--crm-hover-transition);
}
.bulk-move-dd__btn:not(:disabled):hover,
.bulk-move-pipeline__head:not(:disabled):hover,
.bulk-move-stage:not(:disabled):hover {
  color: var(--primary);
  background: var(--primary-light);
  border: 1px solid #5b21b680;
  transform: translateY(-1px) scale(1.02);
}
.bulk-move-pipeline__head:disabled,
.bulk-move-stage:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  transform: none;
}
.bulk-move-dd__chev {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  color: #64748b;
  transition: var(--crm-hover-transition);
  flex: 0 0 auto;
}
.bulk-move-dd.is-open .bulk-move-dd__chev {
  transform: rotate(180deg);
  color: #334155;
}
.bulk-move-dd__panel {
  margin-top: 8px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  border-radius: 12px;
  max-height: 340px;
  overflow: auto;
}
.bulk-move-dd__panel {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.bulk-move-dd__panel::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}
.bulk-move-dd__panel.is-hidden {
  display: none;
}

.bulk-move-dd__search {
  padding: 10px;
}

.bulk-move-dd__search input.form-control {
  width: 100%;
  height: 38px;
  padding: 6px 10px;
  font-size: 14px;
  box-sizing: border-box;
}
.bulk-move-pipeline {
  border: 1px solid #eef2f7;
  padding: 10px;
}
.bulk-move-pipeline:last-child {
  margin-bottom: 0;
}
.bulk-move-pipeline__head {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  border-radius: 10px;
  padding: 10px 10px;
  cursor: pointer;
  transition: var(--crm-hover-transition);
}

.bulk-move-pipeline.is-open .bulk-move-pipeline__head,
.bulk-move-pipeline__head[aria-expanded="true"] {
  background: rgba(91, 33, 182, 0.06);
  border-color: rgba(91, 33, 182, 0.28);
  box-shadow: 0 0 0 3px rgba(91, 33, 182, 0.1);
}
.bulk-move-pipeline__chev {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  color: #64748b;
  transition: var(--crm-hover-transition);
}
.bulk-move-pipeline.is-open .bulk-move-pipeline__chev {
  transform: rotate(180deg);
  color: #334155;
}
.bulk-move-pipeline__name {
  font-weight: 700;
  color: #334155;
  font-size: 13px;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bulk-move-stages {
  margin-top: 5px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.bulk-move-stages.is-hidden {
  display: none;
}
.bulk-move-stage {
  width: 100%;
  text-align: left;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  border-radius: 10px;
  padding: 9px 10px;
  font-size: 13px;
  cursor: pointer;
  transition: var(--crm-hover-transition);
}

.push-icon-btn:hover,
.stage-flow-card__copy:hover,
.stage-flow-card__drag:hover,
.bulk-actions-btn:hover {
  color: var(--primary);
  background: var(--primary-light);
  border: 1px solid #5b21b680;
  transform: translateY(-1px) scale(1.02);
}




.stage-header h3 {
  margin: 0;
  font-size: 14px;
  color: var(--text);
}

.stage-probability {
  background: var(--primary-light);
  color: var(--primary);
  padding: 4px 10px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 500;

  display: none;
}

.stage-stats {
  display: flex;
  gap: 20px;
  margin-bottom: 20px;
}

.stat-item {
  text-align: center;
}

.stat-value {
  display: block;
  font-size: 24px;
  font-weight: 600;
  color: var(--text);
}

.stat-label {
  font-size: 14px;
  color: #6c757d;
}

.stage-actions {
  display: flex;
  gap: 10px;
}



.add-stage-card,
.add-rule-card,
.add-push-card {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 224px;
  max-height: 224px;
  background: var(--bg-white);
  border: 2px dashed var(--border);
  border-radius: 12px;
  transition: var(--crm-hover-transition);
}

.add-stage-card {
  min-width: 320px;
  flex-shrink: 0;
}

.add-rule-card,
.add-push-card {
  width: 100%;
  min-height: 50px;
}

.add-stage-card:hover,
.add-rule-card:hover,
.add-push-card:hover {
  border-color: var(--primary);
  background: rgba(91, 33, 182, 0.05);
}

.add-rule-card:hover {
  transform: translateY(-1px) scale(1.02);
}

.add-stage-btn,
.add-rule-btn,
.add-push-btn {
  background: none;
  border: none;
  color: var(--primary);
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 20px;
  border-radius: 8px;
  width: 100%;
  transition: var(--crm-hover-transition);
}

@media (max-width: 768px) {
  .stages-container {
    grid-template-columns: 1fr;
  }

  .container {
    overflow-x: hidden;
  }
  .stage-card,
  .leads-container,
  .leads-list,
  .lead-chip {
    max-width: 100%;
  }
}

.settings-btn {
  background: none;
  border: none;
  color: #666;
  cursor: pointer;
  font-size: 16px;
  margin-left: 10px;
  padding: 5px;
}

.settings-btn:hover {
  color: #333;
}

@keyframes unfoldIn {
  0% {
    width: 40px;
    opacity: 0;
  }

  100% {
    width: 220px;
    opacity: 1;
  }
}

@keyframes foldOut {
  0% {
    width: 220px;
    opacity: 1;
  }

  100% {
    width: 40px;
    opacity: 0;
  }
}

.stage-footer {
  margin-top: 15px;
  border-top: 1px solid var(--border);
  padding-top: 10px;
}

.toggle-rules-btn {
  display: flex;
  align-items: center;
  cursor: pointer;
  font-size: 12px;
  gap: 5px;
  opacity: 0.7;
  font-weight: 500;
  transition: var(--crm-hover-transition);
  justify-content: center;
}

.toggle-rules-btn:hover {
  color: var(--primary-dark);
}

.toggle-icon {
  transition: var(--crm-hover-transition);
  width: 12px;
}

.toggle-rules-btn.active .toggle-icon {
  transform: rotate(180deg);
}

.rules-container {
  margin-top: 10px;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.stage-flows {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 10px;
  background: #f8fafc;
  gap: 10px;
  display: flex;
  flex-direction: column;
}

.stage-flows__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
  font-weight: 600;
}

.stage-flows__create {
  font-size: 12px;
  color: var(--primary);
  text-decoration: none;
}

.stage-flows__create:hover {
  text-decoration: underline;
}

.qs-flow-dropdown {
  
  display: flex !important; 
  flex-direction: column;
  position: absolute;
  z-index: 2500;
  background: #ffffff;
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.16);
  box-sizing: border-box;
  overflow: hidden;
  max-width: calc(100vw - 16px);
  
  max-height: min(420px, calc(100vh - 24px));
}
.qs-flow-dropdown.portal {
  position: fixed !important;
}


.qs-flow-dropdown .crm-dd-search {
  width: 100%;
  margin: 0;
  padding: 10px 12px;
  font-size: 13px;
  border: none;
  border-bottom: 1px solid var(--border);
  outline: none;
}
.qs-flow-dropdown .crm-dd-search:focus {
  box-shadow: 0 0 0 3px rgba(91, 33, 182, 0.12);
}

.qs-flow-dropdown__list,
.qs-flow-dropdown .crm-dd-options {
  flex: 1 1 auto;
  max-height: none;
  overflow: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.qs-flow-dropdown__list::-webkit-scrollbar,
.qs-flow-dropdown .crm-dd-options::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

.qs-flow-dropdown .crm-dd-footer {
  flex: 0 0 auto;
  
  position: sticky;
  bottom: 0;
}

.qs-flow-dropdown__item.crm-dd-option.mgmt-opt {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: none;
  background: transparent;
  text-align: left;
  font-size: 13px;
  border-radius: 8px;
}
.qs-flow-dropdown__item.crm-dd-option.mgmt-opt:hover {
  background: rgba(91, 33, 182, 0.06);
}

.action-btn.header-btn.create-stage-button,
.action-btn.header-btn.create-pipeline-btn {
  min-width: 120px;
}

.qs-flow-dropdown__name {
  font-weight: 600;
  color: #0f172a;
}
.qs-flow-dropdown__meta {
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.18);
  color: #334155;
  white-space: nowrap;
}
.qs-flow-dropdown__empty {
  padding: 14px 12px;
  color: #94a3b8;
  text-align: center;
  font-size: 12px;
}
.qs-flow-dropdown__footer,
.qs-flow-dropdown .crm-dd-footer {
  border-top: 1px solid #eef2f7;
  padding-top: 8px;
  margin-top: 0;
  background: #ffffff;
}
.qs-flow-dropdown__create.action-btn {
  width: 100%;
  display: inline-block;
  text-align: center;
  text-decoration: none;
  font-size: 12px;
  border-radius: 10px;
  padding: 10px 12px;
}


.stage-flows__list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.stage-flow-card {
  display: block;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 10px 12px;
  text-decoration: none;
  color: inherit;
  background: #fff;
  transition: var(--crm-hover-transition);
  font-size: 12px;
}

.stage-flow-card.is-just-added {
  border-color: rgba(16, 185, 129, 0.55);
  box-shadow: 0 10px 22px rgba(16, 185, 129, 0.14);
}

.stage-flow-card--draggable {
  cursor: pointer;
}

.stage-flow-card__header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
  min-width: 0;
}

.stage-flow-card__drag {
  width: 26px;
  height: 26px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: rgba(71, 85, 105, 0.95);
  background: rgba(91, 33, 182, 0.1);
  border: 1px solid rgba(91, 33, 182, 0.22);
  cursor: grab;
  user-select: none;
  font-size: 12px;
  line-height: 1;
  transition: var(--crm-hover-transition);
}
.stage-flow-card__drag:active {
  cursor: grabbing;
}

.stage-flow-card__drag svg {
  display: block;
  width: 14px;
  height: 14px;
}

.stage-flow-card__copy {
  width: 26px;
  height: 26px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: rgba(71, 85, 105, 0.95);
  background: rgba(148, 163, 184, 0.14);
  border: 1px solid rgba(148, 163, 184, 0.3);
  cursor: grab;
  user-select: none;
  padding: 0;
  transition: var(--crm-hover-transition);
}
.stage-flow-card__copy:active {
  cursor: grabbing;
}
.stage-flow-card__copy svg {
  display: block;
  width: 16px;
  height: 16px;
}


@media (max-width: 768px) {
  .stage-flow-card__drag,
  .stage-flow-card__copy {
    display: none !important;
  }
}

.stage-flow-card__unlink {
  width: 26px;
  height: 26px;
  border-radius: 10px;
  border: 1px solid var(--red-btn-border);
  background: var(--red-btn-bg);
  color: var(--red-btn-color);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  line-height: 1;
  flex: 0 0 auto;
  transition: var(--crm-hover-transition);
}
.stage-flow-card__unlink:hover {
  background: var(--red-btn-hover-bg);
  border-color: var(--red-btn-hover-border);
  transform: translateY(-1px) scale(1.02);
}

.stage-flow-card--ghost {
  opacity: 1;
  background: rgba(148, 163, 184, 0.08);
  border-style: dashed;
  border-color: rgba(91, 33, 182, 0.28);
  box-shadow: none;
}
.stage-flow-card--ghost * {
  visibility: hidden;
}
.stage-flow-card--ghost::after {
  content: "↕";
  visibility: visible;
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(91, 33, 182, 0.55);
  font-weight: 700;
}

.stage-flow-card--chosen {
  opacity: 0.35;
}

.stage-flow-card--dragging {
  opacity: 0.95;
  box-shadow: 0 18px 38px rgba(15, 23, 42, 0.18);
  border-color: rgba(91, 33, 182, 0.35);
  transform: rotate(0.2deg);
}

.stage-card.is-flow-drop-active .rules-container {
  display: flex !important;
  position: absolute;
  inset: 10px;
  z-index: 120;
  margin-top: 0;
}

.stage-card.is-flow-drop-active .stage-flows {
  width: 100%;
  height: 100%;
  border-color: rgba(91, 33, 182, 0.35);
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.12);
  background: rgba(248, 250, 252, 0.96);
  backdrop-filter: blur(6px);
  pointer-events: auto;
}

.stage-card.is-flow-drop-active .stage-flows__header,
.stage-card.is-flow-drop-active .bind-flow-card {
  display: none;
}

.stage-card.is-flow-drop-active .stage-flows__list {
  flex: 1;
  min-height: 120px;
  overflow: auto;
  padding-top: 0;
}

.stage-card.is-flow-drop-active {
  box-shadow: 0 16px 38px rgba(91, 33, 182, 0.18);
  border-color: rgba(91, 33, 182, 0.35);
}

body.is-lead-dragging .stage-card.is-lead-drop-target {
  border-color: rgba(148, 163, 184, 0.32);
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
}
body.is-lead-dragging .stage-card.is-lead-drop-target .leads-container {
  border-color: rgba(148, 163, 184, 0.28);
  background: rgba(248, 250, 252, 0.6);
}
body.is-lead-dragging .stage-card.is-lead-drop-over {
  border-color: rgba(148, 163, 184, 0.5);
  box-shadow: 0 16px 38px rgba(15, 23, 42, 0.1);
}
body.is-lead-dragging .stage-card.is-lead-drop-over .leads-container {
  border-color: rgba(148, 163, 184, 0.4);
  background: rgba(248, 250, 252, 0.96);
}

body.is-lead-dragging .stage-card.is-lead-drop-over .leads-container {
  display: flex !important;
  position: absolute;
  inset: 10px;
  z-index: 125;
  margin-top: 0;
  width: auto;
  height: auto;
  border-radius: 12px;
  backdrop-filter: blur(6px);
}
body.is-lead-dragging .stage-card.is-lead-drop-over .leads-list {
  flex: 1 1 auto;
  min-height: 120px;
  overflow: auto;
  gap: 8px;
  margin-top: 0;
}

body.is-lead-dragging .stage-card.is-lead-drop-over .rules-container {
  pointer-events: none;
  opacity: 0.25;
}

.stage-flow-card--empty {
  text-align: center;
  color: #94a3b8;
  border-style: dashed;
  background: rgba(148, 163, 184, 0.12);
  margin-bottom: 0;
}

.stage-flow-card__title {
  font-weight: 600;
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-bottom: 0;
}

.stage-flow-card__meta {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 4px;
}

.stage-flow-card__badge {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 2px 8px;
  border-radius: 999px;
  background: #e2e8f0;
  color: #475569;
}

.stage-flow-card__badge--status {
  background: rgba(16, 185, 129, 0.18);
  color: #047857;
}

.stage-flow-card__badge--status.stage-flow-card__badge--draft {
  background: rgba(251, 191, 36, 0.2);
  color: #92400e;
}

.stage-flow-card__desc {
  color: #64748b;
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  align-items: center;
}

.stage-flow-card__desc-prefix {
  color: #64748b;
}

.stage-flow-card__desc-badge {
  display: inline-flex;
  align-items: center;
  font-size: 10px;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(91, 33, 182, 0.12);
  color: #5b21b6;
  border: 1px solid rgba(91, 33, 182, 0.22);
  white-space: nowrap;
}

.rules-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 10px;
}

.rule-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 10px;
  background: white;
  border-radius: 6px;
  margin-bottom: 8px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.rule-name {
  font-size: 13px;
  color: var(--text);
}

.edit-rule-btn {
  background: none;
  border: none;
  color: #6c757d;
  cursor: pointer;
  padding: 2px;
  transition: var(--crm-hover-transition);
}

.stage-title {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1 1 auto;
  min-width: 0;
  margin-right: 5px;
}

.edit-name-input-wrapper {
  position: relative;
  width: 100%;
}

.pipeline-name-inline {
  font-size: 24px;
  font-weight: 600;
  color: var(--text);
  border: none;
  outline: none;
  background: transparent;
  padding: 6px 10px;
  border-radius: 10px;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-right: 10px;
}
.pipeline-name-inline:hover {
  background: rgba(15, 23, 42, 0.04);
}
.pipeline-name-inline:focus {
  background: rgba(91, 33, 182, 0.06);
  box-shadow: 0 0 0 4px rgba(91, 33, 182, 0.12);
  text-overflow: clip;
}
.pipeline-name-inline.is-saving {
  opacity: 0.7;
}

.stage-name-inline {
  width: 100%;
  max-width: 100%;
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
  border: none;
  outline: none;
  background: transparent;
  padding: 6px 10px;
  border-radius: 10px;
  min-width: 0;
}
.stage-name-inline:hover {
  background: rgba(15, 23, 42, 0.04);
}
.stage-name-inline:focus {
  background: rgba(91, 33, 182, 0.06);
  box-shadow: 0 0 0 4px rgba(91, 33, 182, 0.12);
}
.stage-name-inline.is-saving {
  opacity: 0.7;
}

.stage-name-input {
  width: 100%;
  padding: 8px 44px 8px 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  outline: none;
  transition: var(--crm-hover-transition);
}

.stage-name-input:focus {
  border-color: rgba(91, 33, 182, 0.35);
  box-shadow: 0 0 0 4px rgba(91, 33, 182, 0.12);
}

.save-name-btn {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  border: 1px solid var(--green-btn-border);
  background: var(--green-btn-bg);
  color: var(--green-btn-color);
  font-weight: 600;
  transition: var(--crm-hover-transition);
}

.save-name-btn:hover {
  background: var(--green-btn-hover-bg);
  border-color: var(--green-btn-hover-border);
}

.save-name-btn:active {
  transform: translateY(-50%) scale(0.98);
}

.save-name-btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px var(--green-btn-focus-ring, rgba(40, 167, 69, 0.25));
}

.save-name-btn svg {
  width: 16px;
  height: 16px;
  color: currentColor;
}

.save-name-btn[disabled],
.save-name-btn.disabled {
  opacity: 0.6;
  cursor: not-allowed;
  background: var(--green-btn-bg);
}

.create-auto-rule {
  display: flex;
  gap: 20px;
  flex-direction: column;
  margin-bottom: 50px;
}

.leads-container {
  width: 100%;
  overflow-x: hidden;
}
.leads-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 8px;
}

.lead-card {
  background: transparent;
  border: 0;
  padding: 0;
}

.lead-chip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  background: #f8fafc;
  color: #111827;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 8px 10px;
  font-size: 13px;
  line-height: 1.2;
  transition: var(--crm-hover-transition);
  box-sizing: border-box;
}
.lead-chip:hover {
  background: var(--primary-light);
  border: 1px solid var(--primary-border);
  transform: translateY(-1px);
}

.lead-chip .chip-left {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  flex: 1 1 auto;
}
.lead-chip .chip-left svg {
  color: var(--primary);
}
.lead-chip .lead-name {
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  flex: 1 1 auto;
}
.lead-chip .lead-username {
  color: #6b7280;
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 36%;
}

.lead-chip .lead-handle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  color: rgba(71, 85, 105, 0.95);
  background: rgba(91, 33, 182, 0.1);
  border: 1px solid rgba(91, 33, 182, 0.22);
  padding: 0;
  margin-left: 10px;
  border-radius: 8px;
  cursor: grab;
  flex: 0 0 auto;
  user-select: none;
  transition: var(--crm-hover-transition);
}
.lead-chip .lead-handle:hover {
  background: rgba(91, 33, 182, 0.14);
  border-color: rgba(91, 33, 182, 0.34);
  color: rgba(76, 29, 149, 0.98);
  transform: translateY(-1px);
}
.lead-chip .lead-handle:active {
  cursor: grabbing;
}
.lead-chip .lead-handle svg {
  display: block;
}

.stage-drag-handle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  margin: -4px 4px -4px -4px;
  padding: 0;
  border: none;
  border-radius: 6px;
  background: transparent;
  color: #94a3b8;
  cursor: grab;
  flex-shrink: 0;
  transition: color 0.15s ease, background 0.15s ease;
}
.stage-drag-handle:hover {
  color: #64748b;
  background: rgba(0, 0, 0, 0.05);
}
.stage-drag-handle:active,
.stage-drag-handle.grabbing {
  cursor: grabbing;
}
.stage-header .stage-header-left {
  flex: 1;
  min-width: 0;
}

.stage-ghost {
  opacity: 0.8;
  transform: scale(0.98);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12) !important;
}
.stage-chosen {
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.16) !important;
}
.stage-drag {
  cursor: grabbing !important;
}
.stage-drag .stage-drag-handle {
  cursor: grabbing;
}

.lead-ghost {
  opacity: 0.85;
  transform: scale(0.995);
}
.lead-chosen {
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.12);
}
.lead-drag {
  cursor: grabbing !important;
}

.modal-content .form-group label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: #475569;
}
.modal-content .form-group input[type="text"],
.modal-content .form-group input[type="number"],
.modal-content .form-group input[type="search"] {
  width: 100%;
  height: 44px;
  padding: 10px 12px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  box-sizing: border-box;
}
.modal-content .form-group input[type="text"]:focus,
.modal-content .form-group input[type="number"]:focus,
.modal-content .form-group input[type="search"]:focus {
  outline: none;
  border-color: #93c5fd;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
}

@media (min-width: 768px) {
  #baseModal .modal-content:has(#createStageForm) {
    width: clamp(360px, 60vw, 560px);
  }
}

/* Create stage modal: no nested card padding; space label from input */
#createStageForm .form-section {
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
  border-radius: 0;
}

#createStageForm .form-group label {
  margin-bottom: 8px;
}

html.dark-theme #createStageForm .form-section {
  background: transparent;
  border: none;
  box-shadow: none;
}


html.dark-theme .pipeline-stages-inline .stage-chip.stage-chip--add,
html.dark-theme .add-stage-card,
html.dark-theme .add-rule-card,
html.dark-theme .add-push-card {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-soft);
  border: 2px dashed var(--border);
  border-radius: 12px;
  transition: var(--crm-hover-transition);
  color: var(--primary);
}

html.dark-theme .pipeline-stages-inline .stage-chip.stage-chip--add:hover,
html.dark-theme .add-stage-card:hover,
html.dark-theme .add-rule-card:hover,
html.dark-theme .add-push-card:hover {
  border-color: var(--primary);
  background: rgba(167, 139, 250, 0.08);
}

html.dark-theme .add-stage-btn,
html.dark-theme .add-rule-btn,
html.dark-theme .add-push-btn {
  color: var(--primary-ink);
}

html.dark-theme .pipeline-stages-inline .stage-chip.stage-chip--add .chip-left svg,
html.dark-theme .pipeline-stages-inline .stage-chip .chip-left i,
html.dark-theme .add-rule-card .chip-left svg,
html.dark-theme .add-push-card .chip-left i,
html.dark-theme .add-push-card .chip-left svg,
html.dark-theme .add-rule-card .chip-left i,
html.dark-theme .add-stage-btn i {
  color: var(--primary-ink);
}

html.dark-theme .pipeline-meta {
  color: var(--text-light);
}

html.dark-theme .stat-label {
  color: var(--text-light);
}

html.dark-theme .lead-chip {
  background: var(--bg-soft);
  color: var(--text);
  border-color: var(--border);
}

html.dark-theme .lead-chip:hover {
  background: var(--primary-light);
  border-color: var(--primary-border);
}

html.dark-theme .lead-chip .lead-username {
  color: var(--text-light);
}

html.dark-theme .lead-chip .lead-handle {
  color: rgba(226, 232, 240, 0.92);
  background: rgba(91, 33, 182, 0.22);
  border-color: rgba(139, 92, 246, 0.35);
}

html.dark-theme .lead-chip .lead-handle:hover {
  background: rgba(91, 33, 182, 0.32);
  border-color: rgba(167, 139, 250, 0.45);
  color: rgba(248, 250, 252, 0.98);
}

html.dark-theme .stage-flows {
  background: var(--bg-soft);
  border-color: var(--border);
}

html.dark-theme .stage-flow-card__badge {
  background: var(--bg-soft-2);
  color: var(--text-light);
}

html.dark-theme .stage-flow-card__desc,
html.dark-theme .stage-flow-card__desc-prefix {
  color: var(--text-light);
}

html.dark-theme .stage-flow-card--empty {
  color: var(--text-light);
  background: rgba(148, 163, 184, 0.06);
}

html.dark-theme .qs-flow-dropdown {
  background: var(--bg-elevated);
  border-color: var(--border);
  box-shadow: var(--shadow-lg);
}

html.dark-theme .qs-flow-dropdown .crm-dd-search {
  border-bottom-color: var(--border);
  background: var(--bg-elevated);
  color: var(--text);
}

html.dark-theme .qs-flow-dropdown__name {
  color: var(--text);
}

html.dark-theme .qs-flow-dropdown__meta {
  background: var(--bg-soft-2);
  color: var(--text-light);
}

html.dark-theme .qs-flow-dropdown__empty {
  color: var(--text-light);
}

html.dark-theme .qs-flow-dropdown__footer,
html.dark-theme .qs-flow-dropdown .crm-dd-footer {
  background: var(--bg-elevated);
  border-top-color: var(--border);
}

html.dark-theme .bulk-menu {
  background: var(--bg-elevated);
  border-color: var(--border);
  box-shadow: var(--shadow-lg);
}

html.dark-theme .bulk-menu__subhead {
  color: var(--text-light);
}

html.dark-theme .bulk-menu__empty {
  color: var(--text-light);
}

html.dark-theme .bulk-menu-item {
  background: var(--bg-soft);
  border-color: var(--border);
  color: var(--text);
}

html.dark-theme .bulk-menu-item:not(:disabled):not(.danger):not([data-bulk-action="done"]):not([data-bulk-action="select-all-stage"]):not([data-bulk-action="select-all-pipeline"]):not([data-bulk-action="clear-all"]):not([data-bulk-action="clear-stage"]):not([data-bulk-action="tag-chats"]):not([data-bulk-action="add-task"]):not([data-bulk-action="send-push"]):hover {
  background: var(--bg-soft-2);
  border-color: var(--border-strong);
  color: var(--text);
}

html.dark-theme .bulk-move-dd__btn {
  background: var(--bg-elevated);
  border-color: var(--border);
  color: var(--text);
}

html.dark-theme .bulk-move-dd__panel {
  background: var(--bg-soft);
  border-color: var(--border);
}

html.dark-theme .bulk-move-pipeline {
  border-color: var(--border);
}

html.dark-theme .bulk-move-pipeline__head {
  background: var(--bg-elevated);
  border-color: var(--border);
}

html.dark-theme .bulk-move-pipeline__name {
  color: var(--text);
}

html.dark-theme .bulk-move-pipeline__chev,
html.dark-theme .bulk-move-dd__chev {
  color: var(--text-light);
}

html.dark-theme .bulk-move-stage {
  background: var(--bg-elevated);
  border-color: var(--border);
  color: var(--text);
}

html.dark-theme .bulk-move-dd__btn:not(:disabled):hover,
html.dark-theme .bulk-move-pipeline__head:not(:disabled):hover,
html.dark-theme .bulk-move-stage:not(:disabled):hover {
  color: var(--primary-ink);
  background: var(--primary-light);
  border-color: var(--primary-border);
}

html.dark-theme .stage-probability {
  color: var(--primary-ink);
}

html.dark-theme .bulk-menu-item[data-bulk-action="select-all-stage"],
html.dark-theme .bulk-menu-item[data-bulk-action="select-all-pipeline"],
html.dark-theme .bulk-menu-item[data-bulk-action="tag-chats"],
html.dark-theme .bulk-menu-item[data-bulk-action="add-task"] {
  color: var(--primary-ink);
}

html.dark-theme .toggle-rules-btn:hover {
  color: var(--primary-ink);
}

html.dark-theme .stage-flows__create {
  color: var(--primary-ink);
}

html.dark-theme .push-icon-btn:hover,
html.dark-theme .stage-flow-card__copy:hover,
html.dark-theme .stage-flow-card__drag:hover,
html.dark-theme .bulk-actions-btn:hover {
  color: var(--primary-ink);
}

html.dark-theme .push-translation-hint {
  color: var(--text-light);
}

html.dark-theme .settings-btn {
  color: var(--text-light);
}

html.dark-theme .settings-btn:hover {
  color: var(--text);
}

html.dark-theme .modal-content .form-group label {
  color: var(--text-light);
}

html.dark-theme .stage-drag-handle {
  color: var(--text-light);
}

html.dark-theme .stage-drag-handle:hover {
  color: var(--text);
  background: rgba(255, 255, 255, 0.06);
}

html.dark-theme .bulk-btn-progress {
  color: var(--text-light);
}

html.dark-theme .bulk-menu-item.is-loading:hover {
  background: var(--bg-soft);
  border-color: var(--border);
}