.cal-query-builder .query-builder,
.cal-query-builder .qb-draggable,
.cal-query-builder .qb-drag-handler {
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* hide connectors */
.cal-query-builder .group-or-rule::before,
.cal-query-builder .group-or-rule::after {
  /* !important to ensure that styles added by react-query-awesome-builder are overriden */
  content: unset !important;
}

.cal-query-builder .group--children {
  /* !important to ensure that styles added by react-query-awesome-builder are overriden */
  padding-left: 0 !important;
}

/* Hide "and" for between numbers */
.cal-query-builder .widget--sep {
  /* !important to ensure that styles added by react-query-awesome-builder are overriden */
  display: none !important;
}

/* Layout of all fields-  Distance b/w them, positioning, width */
.cal-query-builder .rule--body--wrapper {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.cal-query-builder .rule--body {
  display: flex;
  align-items: center;
}

.cal-query-builder .rule--field,
.cal-query-builder .rule--operator,
.cal-query-builder .rule--value {
  display: flex;
  flex-grow: 1;
}

.cal-query-builder .rule--widget {
  display: "inline-block";
  width: 100%;
}

.cal-query-builder .widget--widget,
.cal-query-builder .widget--widget,
.cal-query-builder .widget--widget > * {
  width: 100%;
}

.cal-query-builder .rule--drag-handler,
.cal-query-builder .rule--header {
  display: flex;
  align-items: center;
  margin-right: 8px;
  /* !important to ensure that styles added by react-query-awesome-builder are overriden */
  opacity: 1 !important;
}

/* Disable Reordering of rules - It is not required with the current functionality plus it's not working correctly even if someone wants to re-order */
.cal-query-builder .rule--drag-handler {
  display: none;
}

.cal-query-builder .rule--func--wrapper,
.cal-query-builder .rule--func,
.cal-query-builder .rule--func--args,
.cal-query-builder .rule--func--arg,
.cal-query-builder .rule--func--arg-value,
.cal-query-builder .rule--func--bracket-before,
.cal-query-builder .rule--func--bracket-after,
.cal-query-builder .rule--func--arg-sep,
.cal-query-builder .rule--func--arg-label,
.cal-query-builder .rule--func--arg-label-sep {
  display: inline-block;
}

.cal-query-builder .rule--field,
.cal-query-builder .group--field,
.cal-query-builder .rule--operator,
.cal-query-builder .rule--value,
.cal-query-builder .rule--operator-options,
.cal-query-builder .widget--widget,
.cal-query-builder .widget--valuesrc,
.cal-query-builder .operator--options--sep,
.cal-query-builder .rule--before-widget,
.cal-query-builder .rule--after-widget {
  display: inline-block;
}

.cal-query-builder .rule--operator,
.cal-query-builder .widget--widget,
.cal-query-builder .widget--valuesrc,
.cal-query-builder .widget--sep {
  padding-left: 10px;
}

.cal-query-builder .widget--valuesrc {
  margin-right: -8px;
}

.cal-query-builder .group--header,
.cal-query-builder .group--footer {
  padding-left: 10px;
  padding-right: 10px;
  margin-top: 10px;
  margin-bottom: 10px;
}

.cal-query-builder .group-or-rule-container {
  margin-top: 10px;
  margin-bottom: 10px;
}

.cal-query-builder .rule {
  border: 1px solid transparent;
  padding: 10px;
  flex: 1;
  display: flex;
}

@media (max-width: 1024px) {
  .rule--body {
    flex-direction: column;
  }


  .cal-query-builder .rule--field,
  .cal-query-builder .rule--operator,
  .cal-query-builder .rule--value {
    width: 100%;
  }
}