.is-warning {
  border-color: #ffc107;
  padding-right: calc(1.5em + 0.75rem);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23D8AA06'%3E%3Ccircle cx='6' cy='6' r='4.5' /%3E%3Cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z' /%3E%3Ccircle cx='6' cy='8.2' r='.6' fill='%23D8AA06' stroke='none' /%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right calc(0.375em + 0.1875rem) center;
  background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

textarea.is-warning {
  padding-right: calc(1.5em + 0.75rem);
  background-position: top calc(0.375em + 0.1875rem) right
    calc(0.375em + 0.1875rem);
}

.is-warning:focus {
  border-color: #ffc107;
  box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.25);
}

.warning-feedback {
  display: none;
  width: 100%;
  margin-top: 0.25rem;
  font-size: 0.875em;
  color: #ffc107;
}

.is-warning ~ .warning-feedback {
  display: block;
}

.btn-switch {
  width: 2em;
  margin-left: -2.5em;
  border-radius: 2em;
  float: left;
  height: 1em;
  margin-top: 0.25em;
  vertical-align: top;
  background-repeat: no-repeat;
  background-size: contain;
  border: 1px solid rgba(0, 0, 0, 0.25);
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  -webkit-print-color-adjust: exact;
  color-adjust: exact;
}

.btn-switch.btn-switch-on {
  background-position: right center;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
  background-color: #198754;
  border-color: #198754;
}

.btn-switch.btn-switch-off {
  background-position: left center;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e");
  background-color: #fff;
}

/* Builder code */

.max-width-mobile {
  max-width: 576px;
}

.max-width-tablet {
  max-width: 768px;
}

.max-width-desktop {
  max-width: 1440px;
}

.border-dashed {
  border-style: dashed !important;
}

.text-vertical {
  writing-mode: vertical-lr;
  text-orientation: mixed;
}

.col-group-rounding > [class^="col"]:not(:last-child) > .rounded {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.col-group-rounding > [class^="col"]:not(:first-child) > .rounded {
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}

.p-editor-row {
  padding: 2.3rem 1rem 0 1rem !important;
}

.m-editor-col-group {
  margin: 1rem 0 1rem 0 !important;
}

.p-editor-col {
  padding: 2.3rem 1rem 0 1rem !important;
}

/* Builder code end */

.h-0 {
  height: 0;
}

.mt-minus25percent {
  margin-top: -25%;
}

/* Category tree */

.h-chrome-0-firefox-100percent {
  height: 0; /* HACK: Otherwise height:100% wouldn't work on cell content */
}

@supports (-moz-appearance: none) {
  .h-chrome-0-firefox-100percent {
    height: 100%;
  }
}

.w-32px {
  width: 32px;
}

.miw-32px {
  min-width: 32px;
}

[class*="category-tree-item-"] {
  background-size: 32px auto;
}

.category-tree-item-sibling {
  background-repeat: repeat;
  background-image: url("./design/curve-child.svg");
}

.category-tree-item-connect {
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position-y: 14px, top, top;
  background-image: url("./design/curve.svg"),
    linear-gradient(180deg, #ffffff00 14px, #ffffff 14px),
    url("./design/curve-child.svg");
}

.bg-warning .category-tree-item-connect {
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position-y: 14px, top, top;
  background-image: url("./design/curve.svg"),
    linear-gradient(180deg, #ffc10700 14px, #ffc107 14px),
    url("./design/curve-child.svg");
}

.bg-danger .category-tree-item-connect {
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position-y: 14px, top, top;
  background-image: url("./design/curve.svg"),
    linear-gradient(180deg, #dc354500 14px, #dc3545 14px),
    url("./design/curve-child.svg");
}

.category-tree-item-connect-and-sibling {
  background-repeat: no-repeat, repeat-y;
  background-position-y: 14px, top;
  background-image: url("./design/curve.svg"), url("./design/curve-child.svg");
}

.category-tree-item-root {
  background-repeat: no-repeat;
  background-position-y: 14px;
  background-image: url("./design/root.svg");
}

.category-tree-item-root-and-sibling {
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position-y: 14px, top, top;
  background-image: url("./design/root.svg"),
    linear-gradient(180deg, #ffffff 20px, #ffffff00 20px),
    url("./design/curve-child.svg");
}

.bg-warning .category-tree-item-root-and-sibling {
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position-y: 14px, top, top;
  background-image: url("./design/root.svg"),
    linear-gradient(180deg, #ffc107 20px, #ffc10700 20px),
    url("./design/curve-child.svg");
}

.bg-danger .category-tree-item-root-and-sibling {
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position-y: 14px, top, top;
  background-image: url("./design/root.svg"),
    linear-gradient(180deg, #dc3545 20px, #dc354500 20px),
    url("./design/curve-child.svg");
}
