
i.fa.rulesmenuopen {
  color: #29A9FF;
}

span.block {
  font-size: 1.5rem;
  line-height: 2.2em;
  border-style: none;
  z-index: 10;
  cursor: pointer;
  border: 2px solid transparent;
  padding: 8px 0;
}

input {
  line-height: normal;
}

.block-viewselected > input {
  font-size: 1.5rem;
  height: 2.5rem;
}

span.block-selected {
  padding: 8px 0;
  position: relative;
  border-bottom-color: var(--babble-blue);
  border-radius: 0;
  cursor: default;
}

i.block-action-icon {
  padding-left: 3px;
  padding-right: 3px;
  color: #333;
  padding: 5px;
  border-radius: 5px;
  margin: 0 3px;
}

i.block-action-icon:hover {
  background-color: #e6e6e6;
  border-color: #adadad;
}

span:not( .block-selected ) > span.block-viewunselected {
  display: inline-block;
}

span.block-selected > span.block-viewunselected {
  display: none;
}

span.block-selected > span.block-viewselected {
  display: inline-block;
}

span:not( .block-selected ) > span.block-viewselected {
  display: none;
}

.anchordiv {
  position: fixed;
  display: none;
  background-color: #fff;
  padding: 4px;
  box-shadow: 0 6px 12px rgba(0,0,0,.175);
  border: 1px solid rgba(0,0,0,.15);
  border-radius: 4px;
}

.block-viewselected:focus-within > .anchordiv {
  display: block;
}

.anchordiv::before, .anchordiv::after {
  content: '';
  display: inline-block;
  position: absolute;
}

.anchordiv::before {
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-bottom: 7px solid #ccc;
  border-bottom-color: rgb(204, 204, 204);
  border-bottom-color: rgba(0,0,0,0.2);
  top: -7px;
  left: 7px;
}

.anchordiv::after {
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid white;
  top: -6px;
  left: 8px;
} 

#rule_edit > div > div > div.modal-footer {
  justify-content: space-between;
}

#rule_edit_colour_option > .btn-check:checked+.btn {
  color: var(--bs-btn-active-color);
  background-color: var(--bs-btn-active-bg);
  border-color: var(--bs-btn-active-border-color);
  outline: 2px solid black;
}

#rule_edit_colour_option > label.btn {
  border-width: 2px;
}
#rule > tbody > tr.clickable-row > td {
  background-color: transparent;
}

.block-viewselected .form-select {
  font-size: 1.5rem;
  height: 2.5rem;
  line-height: 1;
}

#rule_edit div.checkbox-menu .form-check {
  line-height: 2.2rem;
  font-size: 1.5rem;
}

#rule_edit div.checkbox-menu .form-check > .form-check-input {
  margin-top: 0.4rem;
  height: 1.3rem;
  width: 1.3rem;
}


#rule_edit div.checkbox-menu .form-check-input:checked {
  background-color: var(--babble-blue);
  border-color: var(--babble-blue);
}
