@bulmil/core/dist/collection/core/elements/badge/badge.css


/* Bulma Utilities */
.badge {
  background-color: #5851ff;
  border: 2px solid transparent;
  border-radius: 14px;
  box-shadow: 0 0 0 2px hsl(0, 0%, 100%);
  color: hsl(0, 0%, 100%);
  font-size: 0.65rem;
  height: 14px;
  line-height: calc(7px + 1px);
  min-width: 14px;
  overflow: hidden;
  padding: 0.05rem 0.15rem;
  position: absolute;
  right: 0;
  text-overflow: ellipsis;
  top: 0;
  -webkit-transform: translate(50%, -50%);
      -ms-transform: translate(50%, -50%);
          transform: translate(50%, -50%);
  white-space: nowrap;
}
.badge.is-outlined {
  background-color: hsl(0, 0%, 100%);
  border-color: #5851ff;
  color: #5851ff;
}
.badge.is-left {
  bottom: 0;
  left: 0;
  right: auto;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.badge.is-right {
  bottom: auto;
  left: auto;
  right: 0;
  top: 50%;
  -webkit-transform: translate(50%, -50%);
      -ms-transform: translate(50%, -50%);
          transform: translate(50%, -50%);
}
.badge.is-top {
  bottom: auto;
  left: 50%;
  right: auto;
  top: 0;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.badge.is-top-left {
  bottom: auto;
  left: 0;
  right: auto;
  top: 0;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.badge.is-top-right {
  bottom: auto;
  left: auto;
  right: 0;
  top: 0;
  -webkit-transform: translate(50%, -50%);
      -ms-transform: translate(50%, -50%);
          transform: translate(50%, -50%);
}
.badge.is-bottom {
  bottom: 0;
  left: 50%;
  right: auto;
  top: auto;
  -webkit-transform: translate(-50%, 50%);
      -ms-transform: translate(-50%, 50%);
          transform: translate(-50%, 50%);
}
.badge.is-bottom-left {
  bottom: 0;
  left: 0;
  right: auto;
  top: auto;
  -webkit-transform: translate(-50%, 50%);
      -ms-transform: translate(-50%, 50%);
          transform: translate(-50%, 50%);
}
.badge.is-bottom-right {
  bottom: 0;
  left: auto;
  right: 0;
  top: auto;
  -webkit-transform: translate(50%, 50%);
      -ms-transform: translate(50%, 50%);
          transform: translate(50%, 50%);
}
.badge.is-white:not(.is-outlined) {
  background-color: hsl(0, 0%, 100%);
  color: hsl(0, 0%, 4%);
}
.badge.is-white.is-outlined {
  border-color: hsl(0, 0%, 100%);
  color: hsl(0, 0%, 100%);
}
.badge.is-black:not(.is-outlined) {
  background-color: hsl(0, 0%, 4%);
  color: hsl(0, 0%, 100%);
}
.badge.is-black.is-outlined {
  border-color: hsl(0, 0%, 4%);
  color: hsl(0, 0%, 4%);
}
.badge.is-light:not(.is-outlined) {
  background-color: hsl(0, 0%, 96%);
  color: rgba(0, 0, 0, 0.7);
}
.badge.is-light.is-outlined {
  border-color: hsl(0, 0%, 96%);
  color: hsl(0, 0%, 96%);
}
.badge.is-dark:not(.is-outlined) {
  background-color: hsl(0, 0%, 21%);
  color: #fff;
}
.badge.is-dark.is-outlined {
  border-color: hsl(0, 0%, 21%);
  color: hsl(0, 0%, 21%);
}
.badge.is-primary:not(.is-outlined) {
  background-color: #5851ff;
  color: #fff;
}
.badge.is-primary.is-outlined {
  border-color: #5851ff;
  color: #5851ff;
}
.badge.is-primary.is-light {
  color: #0a00f0;
}
.badge.is-primary.is-light:not(.is-outlined) {
  background-color: #ebebff;
}
.badge.is-primary.is-light.is-outlined {
  border-color: #5851ff;
}
.badge.is-link:not(.is-outlined) {
  background-color: #5851ff;
  color: #fff;
}
.badge.is-link.is-outlined {
  border-color: #5851ff;
  color: #5851ff;
}
.badge.is-link.is-light {
  color: #0a00f0;
}
.badge.is-link.is-light:not(.is-outlined) {
  background-color: #ebebff;
}
.badge.is-link.is-light.is-outlined {
  border-color: #5851ff;
}
.badge.is-info:not(.is-outlined) {
  background-color: hsl(207, 61%, 53%);
  color: #fff;
}
.badge.is-info.is-outlined {
  border-color: hsl(207, 61%, 53%);
  color: hsl(207, 61%, 53%);
}
.badge.is-info.is-light {
  color: #296fa8;
}
.badge.is-info.is-light:not(.is-outlined) {
  background-color: #eff5fb;
}
.badge.is-info.is-light.is-outlined {
  border-color: hsl(207, 61%, 53%);
}
.badge.is-success:not(.is-outlined) {
  background-color: hsl(153, 53%, 53%);
  color: #fff;
}
.badge.is-success.is-outlined {
  border-color: hsl(153, 53%, 53%);
  color: hsl(153, 53%, 53%);
}
.badge.is-success.is-light {
  color: #257953;
}
.badge.is-success.is-light:not(.is-outlined) {
  background-color: #effaf5;
}
.badge.is-success.is-light.is-outlined {
  border-color: hsl(153, 53%, 53%);
}
.badge.is-warning:not(.is-outlined) {
  background-color: hsl(44, 100%, 77%);
  color: rgba(0, 0, 0, 0.7);
}
.badge.is-warning.is-outlined {
  border-color: hsl(44, 100%, 77%);
  color: hsl(44, 100%, 77%);
}
.badge.is-warning.is-light {
  color: #946c00;
}
.badge.is-warning.is-light:not(.is-outlined) {
  background-color: #fffaeb;
}
.badge.is-warning.is-light.is-outlined {
  border-color: hsl(44, 100%, 77%);
}
.badge.is-danger:not(.is-outlined) {
  background-color: hsl(348, 86%, 61%);
  color: #fff;
}
.badge.is-danger.is-outlined {
  border-color: hsl(348, 86%, 61%);
  color: hsl(348, 86%, 61%);
}
.badge.is-danger.is-light {
  color: #cc0f35;
}
.badge.is-danger.is-light:not(.is-outlined) {
  background-color: #feecf0;
}
.badge.is-danger.is-light.is-outlined {
  border-color: hsl(348, 86%, 61%);
}

.tabs li {
  position: relative;
}