.containerSmartFilter {
  display: flex;
  height: 100%;
  flex-direction: column;
  justify-content: space-between;
  padding: 30px 20px;
  padding-top: 0;
  position: relative;
  overflow: scroll;
}

.sidebarTop {
  display: flex;
  flex-direction: column;
}

::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

#error-name {
  color: var(--ds-text-accent-red, #AE2A19);
  font-size: 14px;
}

#hidden-reload-smart-filter {
  visibility: hidden;
}

#jql-input {
  height: 150px !important;
}

.error-border,
.error-border:focus {
  border-color: var(--ds-border-danger, #de350b) !important;
}

div:has(> .error-name):focus-within {
  border-color: var(--ds-border-danger, #de350b) !important;
}

.tittle {
  font-size: 14px;
  color: var(--ds-text-subtle, #344563);
  text-align: center;
  font-weight: 600;
}

.table-header span {
  font-size: 14px;
  color: var(--ds-text-subtle, #344563);
  font-weight: 600;
}

.step1 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

#listSmartFilterGroup {
  max-height: calc(100vh - 290px);
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  width: 100%;
  color: var(--text-button, #757575);
  overflow: auto;
  margin-bottom: 5px;
}

.remove-button {
  width: 17px;
  height: 17px;
  background-color: var(--ds-icon-danger);
  transition: all 0.2s ease;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.remove-button>svg {
  fill: #ffffff;
  width: 50%;
}

.step1ShowForm {
  margin-top: 20px;
}

.step2 {
  display: flex;
  flex-direction: column;
}

.step2Top {
  margin-bottom: 20px;
}

.sidebarBottom {
  display: flex;
  justify-content: space-between;
}

.sidebarBottomLeft {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}

.sidebarBottomRight {
  display: flex;
  align-items: end;
  justify-content: flex-end;
}
.smartFilter {
  width: 70%;
  display: flex;
  margin: 0px;
  border-radius: 5px;
  align-items: center;
  padding-left: 15px;
  padding-top: 0px;
  padding-bottom: 0px;
  gap: 5px;
}

#line-graph {
  width: 87%;
  height: 1px;
  margin: 15px 0px;
  background-color: var(--ds-border-input,#dfe1e6);
}

html[data-color-mode="dark"] #btn-clearall {
  background-color: #9FADBC;
}

html[data-color-mode="dark"] #btn-clearall span {
  color: #e4e4e4;
}

#icon-chev span svg {
  color: var(--color-chev , #757575 );
}

.expandView {
  margin-bottom: 20px;
}
.collapseView {
  margin-bottom: 0px;
}

.countFilter {
  color: var(--label-color, #757575)
}


.smartFilter:hover {
  background-color: var(--icons-tool-bar-hover, #EAEAEA);
  align-items: center;
}

.smartFilterActive:hover {
  background-color: var(--ds-background-accent-green-subtler);
  color: var(--ds-text-success);
}

.display-none {
  /* display: none; */
  height: 5px;
  overflow: hidden;
  opacity: 0;
  margin-top: -5px;
  z-index: 1;
  position: relative;
}

.display-block {
  display: inline !important;
}

.add-filter {
  margin-top: 20px;
}

#taglabel {
  color: rgb(117, 117, 117)
}

#inputCreateGroup {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 1px;
  padding-left: 5px;
}

#action-createGroup {
  margin-left: 5px;
}



.block-name {
  color: var(--ds-text-subtle, #344563);

}

.prevent-select {
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
}

#filter-block-content {

  color: var(--ds-text-subtle, #344563);
  margin-left: 10px;
}


#btn-creategroup {
  color: var(--ds-text-subtle, #344563);
  cursor: pointer;
}

.mouse-cursor {
  cursor: pointer;
}

.inline-edit-button {
  box-sizing: border-box;
  width: 30px;
  height: 30px;
  z-index: 200;
  background-color: var(--ds-surface-overlay, #FFFFFF);
  border-radius: var(--ds-border-radius, 3px);
  font-size: 14px;
  box-shadow: var(--ds-shadow-overlay, 0 4px 8px -2px rgba(9, 30, 66, 0.25), 0 0 1px rgba(9, 30, 66, 0.31));
  display: flex;
  justify-content: center;
  align-items: center;
}

.inline-edit-button:hover {
  background-color: var(--ds-surface-overlay-hovered, rgba(9, 30, 66, 0.08));
}

.inline-edit-button span svg {
  color: var(--ds-text, #42526E) !important
}

.sidebarBottom-main {
  display: flex;
  justify-content: end;
}

.smartFilterActive {
  align-items: center;
  display: flex;
  background-color: var(--icons-tool-bar-active, #D8FBD9);
  color: var(--ds-text-success);
  border-radius: 5px;
  margin: 0px;
  padding-left: 15px;
  padding-top: 0px;
  padding-bottom: 0px;
  gap: 5px;
}

.containerSmartFilter .loading {
  position: absolute;
  top: -30px;
  left: 0;
  width: 100%;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #33363b0f;
  z-index: 1000;
}