/* ---------------------------------------------- Couleurs ajoutées via javascript

/* Sortable (jQuery UI) */

.sortable-area {
  border: 1px dashed currentColor;
  background-color: $main-menu-background;
}

div.ui-sortable-handle {
  border: 1px dashed currentColor !important;
  border-radius: .75em !important;
  & > .ui-sortable {
//    border-color: $main-menu-border !important;
  }
}

/* color-picker.js */

.color-color-picker {
	border: 1px solid $color-picker-border;
	width: 195px;
	background: $color-picker-background;
}

/* _media_item.js */

.color-div {
	border: 1px solid $color-div-border;
}

/* Badges (common.js) */

.badgeable {
  /* class to set to badge parent's, not mandatory for menu items */
  position: relative;
}

/* Badge design */
.badge {
  color: $badge-color;
  background-color: $badge-std-background;
  border: 1px solid $badge-border;
  vertical-align: top;
  border-radius: 1em;
  padding: 0 .6em;
}
.badge-icon {
  background-color: $badge-soft-background;
}

/* Badge background override */
.badge-std {
  background-color: $badge-std-background;
}
.badge-info {
  background-color: $badge-info-background;
}
.badge-soft {
  background-color: $badge-soft-background;
}

/* Badge position */
.badge-block {
  /* Dashboard module → badge on top right */
  position: absolute;
  top: -10px;
  right: -10px;
}
.badge-icon {
  /* Dashboard icon → badge on top right */
  right: 20px;
}
.badge-inline {
  /* Menu item */
  margin-left: .5em;
}
.badge-left {
  right: auto;
  left: -10px;
  &.badge-icon {
    left: 20px;
  }
}

/* Badge design option */
.badge-noborder {
  border: none;
}
.badge-small {
  font-size: smaller;
  &.badge-icon {
    right: 25px;
    &.badge-left {
      right: auto;
      left: 25px;
    }
  }
}
.badge-square {
  border-radius: 0;
}