buefy/dist/css/versions/buefy-standalone.css

Lightweight UI components for Vue.js (v3) based on Bulma

/*! Buefy v3.0.2 | MIT License | github.com/buefy/buefy */
@charset "UTF-8";
:root {
  --bulma-speed-slow: 150ms;
  --bulma-speed-slower: 250ms;
  --bulma-label-weight: weight-semibold;
}

.is-noscroll {
  position: fixed;
  overflow-y: hidden;
  width: 100%;
  bottom: 0;
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
.fadeOut {
  animation-name: fadeOut;
}

@keyframes fadeOutDown {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
  }
}
.fadeOutDown {
  animation-name: fadeOutDown;
}

@keyframes fadeOutUp {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: translate3d(0, -100%, 0);
  }
}
.fadeOutUp {
  animation-name: fadeOutUp;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.fadeIn {
  animation-name: fadeIn;
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    transform: translate3d(0, -100%, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.fadeInDown {
  animation-name: fadeInDown;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.fadeInUp {
  animation-name: fadeInUp;
}

/**
 * Vue Transitions
 */
.fade-enter-active,
.fade-leave-active {
  transition: opacity var(--bulma-speed-slow) var(--bulma-easing);
}

.fade-enter-from,
.fade-leave-to {
  opacity: 0;
}

.zoom-in-enter-active,
.zoom-in-leave-active {
  transition: opacity var(--bulma-speed-slow) var(--bulma-easing);
}
.zoom-in-enter-active .animation-content,
.zoom-in-enter-active .animation-content,
.zoom-in-leave-active .animation-content,
.zoom-in-leave-active .animation-content {
  transition: transform var(--bulma-speed-slow) var(--bulma-easing);
}

.zoom-in-enter-from,
.zoom-in-leave-active {
  opacity: 0;
}
.zoom-in-enter-from .animation-content,
.zoom-in-enter-from .animation-content,
.zoom-in-leave-active .animation-content,
.zoom-in-leave-active .animation-content {
  transform: scale(0.95);
}

.zoom-out-enter-active,
.zoom-out-leave-active {
  transition: opacity var(--bulma-speed-slow) var(--bulma-easing);
}
.zoom-out-enter-active .animation-content,
.zoom-out-enter-active .animation-content,
.zoom-out-leave-active .animation-content,
.zoom-out-leave-active .animation-content {
  transition: transform var(--bulma-speed-slow) var(--bulma-easing);
}

.zoom-out-enter-from,
.zoom-out-leave-active {
  opacity: 0;
}
.zoom-out-enter-from .animation-content,
.zoom-out-enter-from .animation-content,
.zoom-out-leave-active .animation-content,
.zoom-out-leave-active .animation-content {
  transform: scale(1.05);
}

.slide-next-enter-active,
.slide-next-leave-active,
.slide-prev-enter-active,
.slide-prev-leave-active {
  transition: transform var(--bulma-speed-slower) cubic-bezier(0.785, 0.135, 0.15, 0.86);
}

.slide-prev-leave-to, .slide-next-enter-from {
  transform: translate3d(-100%, 0, 0);
  position: absolute;
  width: 100%;
}

.slide-prev-enter-from, .slide-next-leave-to {
  transform: translate3d(100%, 0, 0);
  position: absolute;
  width: 100%;
}

.slide-down-enter-active,
.slide-down-leave-active,
.slide-up-enter-active,
.slide-up-leave-active {
  transition: transform var(--bulma-speed-slower) cubic-bezier(0.785, 0.135, 0.15, 0.86);
}

.slide-up-leave-to, .slide-down-enter-from {
  transform: translate3d(0, -100%, 0);
  position: absolute;
  height: 100%;
}

.slide-up-enter-from, .slide-down-leave-to {
  transform: translate3d(0, 100%, 0);
  position: absolute;
  height: 100%;
}

.slide-enter-active {
  transition: var(--bulma-speed-slow) var(--bulma-easing);
}

.slide-leave-active {
  transition: var(--bulma-speed-slow) var(--bulma-easing);
  transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
}

.slide-enter-to, .slide-leave-from {
  max-height: 100px;
  overflow: hidden;
}

.slide-enter-from, .slide-leave-to {
  overflow: hidden;
  max-height: 0;
}

:root {
  --bulma-control-radius: var(--bulma-radius);
  --bulma-control-radius-small: var(--bulma-radius-small);
  --bulma-control-border-width: 1px;
  --bulma-control-height: 2.5em;
  --bulma-control-line-height: 1.5;
  --bulma-control-padding-vertical: calc(0.5em - 1px);
  --bulma-control-padding-horizontal: calc(0.75em - 1px);
  --bulma-control-size: var(--bulma-size-normal);
  --bulma-control-focus-shadow-l: 50%;
}

.autocomplete {
  --bulma-dropdown-content-max-height: 200px;
}

.autocomplete {
  position: relative;
}
.autocomplete .dropdown-menu {
  display: block;
  width: 100%;
}
.autocomplete .dropdown-menu.is-opened-top {
  top: auto;
  bottom: 100%;
}
.autocomplete .dropdown-content {
  overflow: auto;
  max-height: var(--bulma-dropdown-content-max-height);
}
.autocomplete .dropdown-item {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.autocomplete .dropdown-item.is-hovered {
  --bulma-dropdown-item-background-l-delta: var(--bulma-dropdown-item-hover-background-l-delta);
  --bulma-dropdown-item-border-l-delta: var(--bulma-dropdown-item-hover-border-l-delta);
}
.autocomplete .dropdown-item.is-disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.autocomplete.is-small {
  border-radius: var(--bulma-radius-small);
  font-size: var(--bulma-size-small);
}
.autocomplete.is-medium {
  font-size: var(--bulma-size-medium);
}
.autocomplete.is-large {
  font-size: var(--bulma-size-large);
}

.carousel {
  --bulma-carousel-min-height: 120px;
  --bulma-carousel-arrow-background: var(--bulma-scheme-main);
  --bulma-carousel-arrow-color: var(--bulma-primary);
  --bulma-carousel-arrow-icon-spaced: 1.5rem;
  --bulma-carousel-arrow-top: 50%;
  --bulma-carousel-indicator-background: rgba(var(--bulma-scheme-invert), 0.5);
  --bulma-carousel-indicator-border: var(--bulma-scheme-main);
  --bulma-carousel-indicator-color: var(--bulma-primary);
  --bulma-carousel-indicator-spaced: 0.5rem;
  --bulma-carousel-overlay-background: rgba(var(--bulma-scheme-invert), 0.86);
  --bulma-carousel-overlay-z: 40;
}

.carousel {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  min-height: var(--bulma-carousel-min-height);
  position: relative;
}
.carousel.is-overlay {
  background-color: var(--bulma-carousel-overlay-background);
  align-items: center;
  flex-direction: column;
  justify-content: center;
  display: flex;
  max-height: 100vh;
  position: fixed;
  z-index: var(--bulma-carousel-overlay-z);
}
.carousel.is-overlay .carousel-item img {
  cursor: default;
}
.carousel.is-overlay .carousel-indicator.has-background {
  background: transparent;
}
.carousel .progress {
  border-radius: var(--bulma-radius-small);
  height: 0.25rem;
  margin-bottom: 0;
}
.carousel .carousel-items {
  position: relative;
  display: flex;
  overflow: hidden;
  width: 100%;
}
@media screen and (min-width: 769px), print {
  .carousel .carousel-items:hover .carousel-arrow.is-hovered {
    opacity: 1;
  }
}
.carousel .carousel-items .carousel-item {
  flex-shrink: 0;
  width: 100%;
}
.carousel .carousel-pause {
  pointer-events: none;
  position: absolute;
  top: 0;
  right: 0.15rem;
  z-index: 1;
}
.carousel .carousel-indicator {
  width: 100%;
  padding: var(--bulma-carousel-indicator-spaced);
  display: flex;
  align-items: center;
  justify-content: center;
}
.carousel .carousel-indicator.has-background {
  background: var(--bulma-carousel-indicator-background);
}
.carousel .carousel-indicator.has-custom {
  flex-wrap: nowrap;
  justify-content: flex-start;
  -webkit-overflow-scrolling: touch;
  overflow: hidden;
  overflow-x: auto;
}
.carousel .carousel-indicator.has-custom.is-small .indicator-item {
  flex: 1 0 10%;
}
.carousel .carousel-indicator.has-custom.is-medium .indicator-item {
  flex: 1 0 16.66667%;
}
.carousel .carousel-indicator.is-inside {
  position: absolute;
}
.carousel .carousel-indicator.is-inside.is-bottom {
  bottom: 0;
}
.carousel .carousel-indicator.is-inside.is-top {
  top: 0;
}
.carousel .carousel-indicator .indicator-item:not(:last-child) {
  margin-right: var(--bulma-carousel-indicator-spaced);
}
.carousel .carousel-indicator .indicator-item.is-active .indicator-style,
.carousel .carousel-indicator .indicator-item .indicator-style:hover {
  background: var(--bulma-carousel-indicator-color);
  border: 1px solid var(--bulma-carousel-indicator-border);
}
.carousel .carousel-indicator .indicator-item .indicator-style {
  display: block;
  border: 1px solid var(--bulma-carousel-indicator-color);
  background: var(--bulma-carousel-indicator-border);
  outline: none;
  transition: var(--bulma-speed-slow) var(--bulma-easing);
}
.carousel .carousel-indicator .indicator-item .indicator-style.is-boxes {
  height: 10px;
  width: 10px;
}
.carousel .carousel-indicator .indicator-item .indicator-style.is-dots {
  border-radius: var(--bulma-radius-rounded);
  height: 10px;
  width: 10px;
}
.carousel .carousel-indicator .indicator-item .indicator-style.is-lines {
  height: 5px;
  width: 25px;
}

.carousel-list {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  position: relative;
  overflow: hidden;
  width: 100%;
}
.carousel-list.has-shadow {
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25);
}
@media screen and (min-width: 769px), print {
  .carousel-list:hover .carousel-arrow.is-hovered {
    opacity: 1;
  }
}
.carousel-list .carousel-slides {
  position: relative;
  display: flex;
  width: 100%;
}
.carousel-list .carousel-slides:not(.is-dragging) {
  transition: all var(--bulma-speed-slower) ease-out 0s;
}
.carousel-list .carousel-slides.has-grayscale .carousel-slide img {
  filter: grayscale(100%);
}
.carousel-list .carousel-slides.has-grayscale .carousel-slide.is-active img {
  filter: grayscale(0%);
}
.carousel-list .carousel-slides.has-opacity .carousel-slide img {
  opacity: 0.25;
}
.carousel-list .carousel-slides.has-opacity .carousel-slide.is-active img {
  opacity: 1;
}
.carousel-list .carousel-slides .carousel-slide {
  border: 2px solid transparent;
  flex-shrink: 0;
}

.carousel-arrow {
  transition: var(--bulma-speed-slow) var(--bulma-easing);
}
.carousel-arrow.is-hovered {
  opacity: 0;
}
.carousel-arrow .icon {
  background: var(--bulma-carousel-arrow-background);
  color: var(--bulma-carousel-arrow-color);
  cursor: pointer;
  border: 1px solid var(--bulma-carousel-arrow-background);
  border-radius: var(--bulma-radius-rounded);
  outline: 0;
}
.carousel-arrow .icon:hover {
  border: 1px solid var(--bulma-carousel-arrow-color);
  opacity: 1;
}
.carousel-arrow .icon.has-icons-left, .carousel-arrow .icon.has-icons-right {
  position: absolute;
  top: var(--bulma-carousel-arrow-top);
  transform: translateY(-50%);
  z-index: 1;
}
.carousel-arrow .icon.has-icons-left {
  left: var(--bulma-carousel-arrow-icon-spaced);
}
.carousel-arrow .icon.has-icons-right {
  right: var(--bulma-carousel-arrow-icon-spaced);
}

.navbar-link:not(.is-arrowless)::after {
  border: 0.125em solid var(--bulma-arrow-color);
  border-right: 0;
  border-top: 0;
  content: " ";
  display: block;
  height: 0.625em;
  margin-top: -0.4375em;
  pointer-events: none;
  position: absolute;
  top: 50%;
  transform: rotate(-45deg);
  transform-origin: center;
  transition-duration: var(--bulma-duration);
  transition-property: border-color;
  width: 0.625em;
}

.skeleton-block:not(:last-child), .progress:not(:last-child), .progress-wrapper.is-not-native:not(:last-child) {
  margin-bottom: var(--bulma-block-spacing);
}

.input, .textarea, .taginput .taginput-container.is-focusable, .taginput .taginput-container {
  align-items: center;
  appearance: none;
  border-color: transparent;
  border-style: solid;
  border-width: var(--bulma-control-border-width);
  border-radius: var(--bulma-control-radius);
  box-shadow: none;
  display: inline-flex;
  font-size: var(--bulma-control-size);
  height: var(--bulma-control-height);
  justify-content: flex-start;
  line-height: var(--bulma-control-line-height);
  padding-bottom: var(--bulma-control-padding-vertical);
  padding-left: var(--bulma-control-padding-horizontal);
  padding-right: var(--bulma-control-padding-horizontal);
  padding-top: var(--bulma-control-padding-vertical);
  position: relative;
  transition-duration: var(--bulma-duration);
  transition-property: background-color, border-color, box-shadow, color;
  vertical-align: top;
}
.input:focus, .textarea:focus, .taginput .taginput-container:focus, .input:focus-visible, .textarea:focus-visible, .taginput .taginput-container:focus-visible, .input:focus-within, .textarea:focus-within, .taginput .taginput-container:focus-within, .is-focused.input, .is-focused.textarea, .taginput .is-focused.taginput-container, .input:active, .textarea:active, .taginput .taginput-container:active, .is-active.input, .is-active.textarea, .taginput .is-active.taginput-container {
  outline: none;
}
[disabled].input, [disabled].textarea, .taginput [disabled].taginput-container, fieldset[disabled] .input, fieldset[disabled] .textarea, fieldset[disabled] .taginput .taginput-container, .taginput fieldset[disabled] .taginput-container {
  cursor: not-allowed;
}

.modal-close {
  --bulma-delete-dimensions: 1.25rem;
  --bulma-delete-background-l: 0%;
  --bulma-delete-background-alpha: 0.5;
  --bulma-delete-color: var(--bulma-white);
  appearance: none;
  background-color: hsla(var(--bulma-scheme-h), var(--bulma-scheme-s), var(--bulma-delete-background-l), var(--bulma-delete-background-alpha));
  border: none;
  border-radius: var(--bulma-radius-rounded);
  cursor: pointer;
  pointer-events: auto;
  display: inline-flex;
  flex-grow: 0;
  flex-shrink: 0;
  font-size: 1em;
  height: var(--bulma-delete-dimensions);
  max-height: var(--bulma-delete-dimensions);
  max-width: var(--bulma-delete-dimensions);
  min-height: var(--bulma-delete-dimensions);
  min-width: var(--bulma-delete-dimensions);
  outline: none;
  position: relative;
  vertical-align: top;
  width: var(--bulma-delete-dimensions);
}
.modal-close::before, .modal-close::after {
  background-color: var(--bulma-delete-color);
  content: "";
  display: block;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translateX(-50%) translateY(-50%) rotate(45deg);
  transform-origin: center center;
}
.modal-close::before {
  height: 2px;
  width: 50%;
}
.modal-close::after {
  height: 50%;
  width: 2px;
}
.modal-close:hover, .modal-close:focus {
  --bulma-delete-background-alpha: 0.4;
}
.modal-close:active {
  --bulma-delete-background-alpha: 0.5;
}
.is-small.modal-close {
  --bulma-delete-dimensions: 1rem;
}
.is-medium.modal-close {
  --bulma-delete-dimensions: 1.5rem;
}
.is-large.modal-close {
  --bulma-delete-dimensions: 2rem;
}

.modal, .modal-background, .b-sidebar .sidebar-background, .b-image-wrapper > img.has-ratio, .b-image-wrapper > img.placeholder, .dropdown .background {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.navbar-burger {
  appearance: none;
  background: none;
  border: none;
  color: inherit;
  font-family: inherit;
  font-size: 1em;
  margin: 0;
  padding: 0;
}

.b-checkbox.checkbox {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.control,
.input,
.textarea,
.select {
  --bulma-input-h: var(--bulma-scheme-h);
  --bulma-input-s: var(--bulma-scheme-s);
  --bulma-input-l: var(--bulma-scheme-main-l);
  --bulma-input-border-style: solid;
  --bulma-input-border-width: var(--bulma-control-border-width);
  --bulma-input-border-l: var(--bulma-border-l);
  --bulma-input-border-l-delta: 0%;
  --bulma-input-border-color: hsl(var(--bulma-input-h), var(--bulma-input-s), calc(var(--bulma-input-border-l) + var(--bulma-input-border-l-delta)));
  --bulma-input-hover-border-l-delta: var(--bulma-hover-border-l-delta);
  --bulma-input-active-border-l-delta: var(--bulma-active-border-l-delta);
  --bulma-input-focus-h: var(--bulma-focus-h);
  --bulma-input-focus-s: var(--bulma-focus-s);
  --bulma-input-focus-l: var(--bulma-focus-l);
  --bulma-input-focus-shadow-size: var(--bulma-focus-shadow-size);
  --bulma-input-focus-shadow-alpha: var(--bulma-focus-shadow-alpha);
  --bulma-input-color-l: var(--bulma-text-strong-l);
  --bulma-input-background-l: var(--bulma-scheme-main-l);
  --bulma-input-background-l-delta: 0%;
  --bulma-input-height: var(--bulma-control-height);
  --bulma-input-shadow: inset 0 0.0625em 0.125em hsla(var(--bulma-scheme-h), var(--bulma-scheme-s), var(--bulma-scheme-invert-l), 0.05);
  --bulma-input-placeholder-color: hsla(var(--bulma-text-h), var(--bulma-text-s), var(--bulma-text-strong-l), 0.3);
  --bulma-input-disabled-color: var(--bulma-text-weak);
  --bulma-input-disabled-background-color: var(--bulma-background);
  --bulma-input-disabled-border-color: var(--bulma-background);
  --bulma-input-disabled-placeholder-color: hsla(var(--bulma-text-h), var(--bulma-text-s), var(--bulma-text-weak-l), 0.3);
  --bulma-input-arrow: var(--bulma-link);
  --bulma-input-icon-color: var(--bulma-text-light);
  --bulma-input-icon-hover-color: var(--bulma-text-weak);
  --bulma-input-icon-focus-color: var(--bulma-link);
  --bulma-input-radius: var(--bulma-radius);
}

.input, .textarea, .taginput .taginput-container.is-focusable, .taginput .taginput-container {
  background-color: hsl(var(--bulma-input-h), var(--bulma-input-s), calc(var(--bulma-input-background-l) + var(--bulma-input-background-l-delta)));
  border-color: var(--bulma-input-border-color);
  border-radius: var(--bulma-input-radius);
  color: hsl(var(--bulma-input-h), var(--bulma-input-s), var(--bulma-input-color-l));
}
.input::-moz-placeholder, .textarea::-moz-placeholder, .taginput .taginput-container.is-focusable::-moz-placeholder, .taginput .taginput-container::-moz-placeholder {
  color: var(--bulma-input-placeholder-color);
}
.input::-webkit-input-placeholder, .textarea::-webkit-input-placeholder, .taginput .taginput-container.is-focusable::-webkit-input-placeholder, .taginput .taginput-container::-webkit-input-placeholder {
  color: var(--bulma-input-placeholder-color);
}
.input:-moz-placeholder, .textarea:-moz-placeholder, .taginput .taginput-container:-moz-placeholder {
  color: var(--bulma-input-placeholder-color);
}
.input:-ms-input-placeholder, .textarea:-ms-input-placeholder, .taginput .taginput-container:-ms-input-placeholder {
  color: var(--bulma-input-placeholder-color);
}
.input:hover, .textarea:hover, .taginput .taginput-container:hover, .is-hovered.input, .is-hovered.textarea, .taginput .is-hovered.taginput-container {
  --bulma-input-border-l-delta: var(--bulma-input-hover-border-l-delta);
}
.input:active, .textarea:active, .taginput .taginput-container:active, .is-active.input, .is-active.textarea, .taginput .is-active.taginput-container {
  --bulma-input-border-l-delta: var(--bulma-input-active-border-l-delta);
}
.input:focus, .textarea:focus, .taginput .taginput-container:focus, .input:focus-within, .textarea:focus-within, .taginput .taginput-container:focus-within, .is-focused.input, .is-focused.textarea, .taginput .is-focused.taginput-container {
  border-color: hsl(var(--bulma-input-focus-h), var(--bulma-input-focus-s), var(--bulma-input-focus-l));
  box-shadow: var(--bulma-input-focus-shadow-size) hsla(var(--bulma-input-focus-h), var(--bulma-input-focus-s), var(--bulma-input-focus-l), var(--bulma-input-focus-shadow-alpha));
}
[disabled].input, [disabled].textarea, .taginput [disabled].taginput-container, fieldset[disabled] .input, fieldset[disabled] .textarea, fieldset[disabled] .taginput .taginput-container, .taginput fieldset[disabled] .taginput-container {
  background-color: var(--bulma-input-disabled-background-color);
  border-color: var(--bulma-input-disabled-border-color);
  box-shadow: none;
  color: var(--bulma-input-disabled-color);
}
[disabled].input::-moz-placeholder, [disabled].textarea::-moz-placeholder, .taginput [disabled].taginput-container::-moz-placeholder, fieldset[disabled] .input::-moz-placeholder, fieldset[disabled] .textarea::-moz-placeholder, fieldset[disabled] .taginput .taginput-container::-moz-placeholder, .taginput fieldset[disabled] .taginput-container::-moz-placeholder {
  color: var(--bulma-input-disabled-placeholder-color);
}
[disabled].input::-webkit-input-placeholder, [disabled].textarea::-webkit-input-placeholder, .taginput [disabled].taginput-container::-webkit-input-placeholder, fieldset[disabled] .input::-webkit-input-placeholder, fieldset[disabled] .textarea::-webkit-input-placeholder, fieldset[disabled] .taginput .taginput-container::-webkit-input-placeholder, .taginput fieldset[disabled] .taginput-container::-webkit-input-placeholder {
  color: var(--bulma-input-disabled-placeholder-color);
}
[disabled].input:-moz-placeholder, [disabled].textarea:-moz-placeholder, .taginput [disabled].taginput-container:-moz-placeholder, fieldset[disabled] .input:-moz-placeholder, fieldset[disabled] .textarea:-moz-placeholder, fieldset[disabled] .taginput .taginput-container:-moz-placeholder, .taginput fieldset[disabled] .taginput-container:-moz-placeholder {
  color: var(--bulma-input-disabled-placeholder-color);
}
[disabled].input:-ms-input-placeholder, [disabled].textarea:-ms-input-placeholder, .taginput [disabled].taginput-container:-ms-input-placeholder, fieldset[disabled] .input:-ms-input-placeholder, fieldset[disabled] .textarea:-ms-input-placeholder, fieldset[disabled] .taginput .taginput-container:-ms-input-placeholder, .taginput fieldset[disabled] .taginput-container:-ms-input-placeholder {
  color: var(--bulma-input-disabled-placeholder-color);
}

.b-checkbox {
  --bulma-checkbox-active-background-color: var(--bulma-primary);
  --bulma-checkbox-shadow: inset 0 0.0625em 0.125em hsla(var(--bulma-scheme-h), var(--bulma-scheme-s), var(--bulma-scheme-invert-l), 0.05);
  --bulma-checkbox-background-color: var(--bulma-scheme-main);
  --bulma-checkbox-border-color: var(--bulma-primary);
  --bulma-checkbox-border-radius: var(--bulma-radius);
  --bulma-checkbox-border-width: 2px;
  --bulma-checkbox-checkmark-color: var(--bulma-primary-invert);
  --bulma-checkbox-size: 1.25em;
  --bulma-checkbox-checkmark-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath style='fill:var(--bulma-checkbox-checkmark-color)' d='M 0.04038059,0.6267767 0.14644661,0.52071068 0.42928932,0.80355339 0.3232233,0.90961941 z M 0.21715729,0.80355339 0.85355339,0.16715729 0.95961941,0.2732233 0.3232233,0.90961941 z'%3E%3C/path%3E%3C/svg%3E");
  --bulma-checkbox-indeterminate-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Crect style='fill:var(--bulma-checkbox-checkmark-color)' width='0.7' height='0.2' x='.15' y='.4'%3E%3C/rect%3E%3C/svg%3E");
}
.b-checkbox.checkbox input[type=checkbox] + .check.is-white {
  --bulma-checkbox-active-background-color: var(--bulma-white);
  --bulma-checkbox-border-color: var(--bulma-white);
  --bulma-checkbox-checkmark-color: var(--bulma-white-invert);
  --bulma-checkbox-checkmark-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath style='fill:var(--bulma-white-invert)' d='M 0.04038059,0.6267767 0.14644661,0.52071068 0.42928932,0.80355339 0.3232233,0.90961941 z M 0.21715729,0.80355339 0.85355339,0.16715729 0.95961941,0.2732233 0.3232233,0.90961941 z'%3E%3C/path%3E%3C/svg%3E");
  --bulma-checkbox-indeterminate-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Crect style='fill:var(--bulma-white-invert)' width='0.7' height='0.2' x='.15' y='.4'%3E%3C/rect%3E%3C/svg%3E");
}
.b-checkbox.checkbox input[type=checkbox] + .check.is-black {
  --bulma-checkbox-active-background-color: var(--bulma-black);
  --bulma-checkbox-border-color: var(--bulma-black);
  --bulma-checkbox-checkmark-color: var(--bulma-black-invert);
  --bulma-checkbox-checkmark-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath style='fill:var(--bulma-black-invert)' d='M 0.04038059,0.6267767 0.14644661,0.52071068 0.42928932,0.80355339 0.3232233,0.90961941 z M 0.21715729,0.80355339 0.85355339,0.16715729 0.95961941,0.2732233 0.3232233,0.90961941 z'%3E%3C/path%3E%3C/svg%3E");
  --bulma-checkbox-indeterminate-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Crect style='fill:var(--bulma-black-invert)' width='0.7' height='0.2' x='.15' y='.4'%3E%3C/rect%3E%3C/svg%3E");
}
.b-checkbox.checkbox input[type=checkbox] + .check.is-light {
  --bulma-checkbox-active-background-color: var(--bulma-light);
  --bulma-checkbox-border-color: var(--bulma-light);
  --bulma-checkbox-checkmark-color: var(--bulma-light-invert);
  --bulma-checkbox-checkmark-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath style='fill:var(--bulma-light-invert)' d='M 0.04038059,0.6267767 0.14644661,0.52071068 0.42928932,0.80355339 0.3232233,0.90961941 z M 0.21715729,0.80355339 0.85355339,0.16715729 0.95961941,0.2732233 0.3232233,0.90961941 z'%3E%3C/path%3E%3C/svg%3E");
  --bulma-checkbox-indeterminate-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Crect style='fill:var(--bulma-light-invert)' width='0.7' height='0.2' x='.15' y='.4'%3E%3C/rect%3E%3C/svg%3E");
}
.b-checkbox.checkbox input[type=checkbox] + .check.is-dark {
  --bulma-checkbox-active-background-color: var(--bulma-dark);
  --bulma-checkbox-border-color: var(--bulma-dark);
  --bulma-checkbox-checkmark-color: var(--bulma-dark-invert);
  --bulma-checkbox-checkmark-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath style='fill:var(--bulma-dark-invert)' d='M 0.04038059,0.6267767 0.14644661,0.52071068 0.42928932,0.80355339 0.3232233,0.90961941 z M 0.21715729,0.80355339 0.85355339,0.16715729 0.95961941,0.2732233 0.3232233,0.90961941 z'%3E%3C/path%3E%3C/svg%3E");
  --bulma-checkbox-indeterminate-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Crect style='fill:var(--bulma-dark-invert)' width='0.7' height='0.2' x='.15' y='.4'%3E%3C/rect%3E%3C/svg%3E");
}
.b-checkbox.checkbox input[type=checkbox] + .check.is-text {
  --bulma-checkbox-active-background-color: var(--bulma-text);
  --bulma-checkbox-border-color: var(--bulma-text);
  --bulma-checkbox-checkmark-color: var(--bulma-text-invert);
  --bulma-checkbox-checkmark-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath style='fill:var(--bulma-text-invert)' d='M 0.04038059,0.6267767 0.14644661,0.52071068 0.42928932,0.80355339 0.3232233,0.90961941 z M 0.21715729,0.80355339 0.85355339,0.16715729 0.95961941,0.2732233 0.3232233,0.90961941 z'%3E%3C/path%3E%3C/svg%3E");
  --bulma-checkbox-indeterminate-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Crect style='fill:var(--bulma-text-invert)' width='0.7' height='0.2' x='.15' y='.4'%3E%3C/rect%3E%3C/svg%3E");
}
.b-checkbox.checkbox input[type=checkbox] + .check.is-primary {
  --bulma-checkbox-active-background-color: var(--bulma-primary);
  --bulma-checkbox-border-color: var(--bulma-primary);
  --bulma-checkbox-checkmark-color: var(--bulma-primary-invert);
  --bulma-checkbox-checkmark-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath style='fill:var(--bulma-primary-invert)' d='M 0.04038059,0.6267767 0.14644661,0.52071068 0.42928932,0.80355339 0.3232233,0.90961941 z M 0.21715729,0.80355339 0.85355339,0.16715729 0.95961941,0.2732233 0.3232233,0.90961941 z'%3E%3C/path%3E%3C/svg%3E");
  --bulma-checkbox-indeterminate-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Crect style='fill:var(--bulma-primary-invert)' width='0.7' height='0.2' x='.15' y='.4'%3E%3C/rect%3E%3C/svg%3E");
}
.b-checkbox.checkbox input[type=checkbox] + .check.is-link {
  --bulma-checkbox-active-background-color: var(--bulma-link);
  --bulma-checkbox-border-color: var(--bulma-link);
  --bulma-checkbox-checkmark-color: var(--bulma-link-invert);
  --bulma-checkbox-checkmark-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath style='fill:var(--bulma-link-invert)' d='M 0.04038059,0.6267767 0.14644661,0.52071068 0.42928932,0.80355339 0.3232233,0.90961941 z M 0.21715729,0.80355339 0.85355339,0.16715729 0.95961941,0.2732233 0.3232233,0.90961941 z'%3E%3C/path%3E%3C/svg%3E");
  --bulma-checkbox-indeterminate-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Crect style='fill:var(--bulma-link-invert)' width='0.7' height='0.2' x='.15' y='.4'%3E%3C/rect%3E%3C/svg%3E");
}
.b-checkbox.checkbox input[type=checkbox] + .check.is-info {
  --bulma-checkbox-active-background-color: var(--bulma-info);
  --bulma-checkbox-border-color: var(--bulma-info);
  --bulma-checkbox-checkmark-color: var(--bulma-info-invert);
  --bulma-checkbox-checkmark-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath style='fill:var(--bulma-info-invert)' d='M 0.04038059,0.6267767 0.14644661,0.52071068 0.42928932,0.80355339 0.3232233,0.90961941 z M 0.21715729,0.80355339 0.85355339,0.16715729 0.95961941,0.2732233 0.3232233,0.90961941 z'%3E%3C/path%3E%3C/svg%3E");
  --bulma-checkbox-indeterminate-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Crect style='fill:var(--bulma-info-invert)' width='0.7' height='0.2' x='.15' y='.4'%3E%3C/rect%3E%3C/svg%3E");
}
.b-checkbox.checkbox input[type=checkbox] + .check.is-success {
  --bulma-checkbox-active-background-color: var(--bulma-success);
  --bulma-checkbox-border-color: var(--bulma-success);
  --bulma-checkbox-checkmark-color: var(--bulma-success-invert);
  --bulma-checkbox-checkmark-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath style='fill:var(--bulma-success-invert)' d='M 0.04038059,0.6267767 0.14644661,0.52071068 0.42928932,0.80355339 0.3232233,0.90961941 z M 0.21715729,0.80355339 0.85355339,0.16715729 0.95961941,0.2732233 0.3232233,0.90961941 z'%3E%3C/path%3E%3C/svg%3E");
  --bulma-checkbox-indeterminate-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Crect style='fill:var(--bulma-success-invert)' width='0.7' height='0.2' x='.15' y='.4'%3E%3C/rect%3E%3C/svg%3E");
}
.b-checkbox.checkbox input[type=checkbox] + .check.is-warning {
  --bulma-checkbox-active-background-color: var(--bulma-warning);
  --bulma-checkbox-border-color: var(--bulma-warning);
  --bulma-checkbox-checkmark-color: var(--bulma-warning-invert);
  --bulma-checkbox-checkmark-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath style='fill:var(--bulma-warning-invert)' d='M 0.04038059,0.6267767 0.14644661,0.52071068 0.42928932,0.80355339 0.3232233,0.90961941 z M 0.21715729,0.80355339 0.85355339,0.16715729 0.95961941,0.2732233 0.3232233,0.90961941 z'%3E%3C/path%3E%3C/svg%3E");
  --bulma-checkbox-indeterminate-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Crect style='fill:var(--bulma-warning-invert)' width='0.7' height='0.2' x='.15' y='.4'%3E%3C/rect%3E%3C/svg%3E");
}
.b-checkbox.checkbox input[type=checkbox] + .check.is-danger {
  --bulma-checkbox-active-background-color: var(--bulma-danger);
  --bulma-checkbox-border-color: var(--bulma-danger);
  --bulma-checkbox-checkmark-color: var(--bulma-danger-invert);
  --bulma-checkbox-checkmark-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath style='fill:var(--bulma-danger-invert)' d='M 0.04038059,0.6267767 0.14644661,0.52071068 0.42928932,0.80355339 0.3232233,0.90961941 z M 0.21715729,0.80355339 0.85355339,0.16715729 0.95961941,0.2732233 0.3232233,0.90961941 z'%3E%3C/path%3E%3C/svg%3E");
  --bulma-checkbox-indeterminate-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Crect style='fill:var(--bulma-danger-invert)' width='0.7' height='0.2' x='.15' y='.4'%3E%3C/rect%3E%3C/svg%3E");
}

.b-checkbox {
  line-height: var(--bulma-control-line-height);
}
.b-checkbox.checkbox {
  outline: none;
  display: inline-flex;
  align-items: center;
}
.b-checkbox.checkbox:not(.button) {
  margin-right: 0.5em;
}
.b-checkbox.checkbox:not(.button) + .checkbox:last-child {
  margin-right: 0;
}
.b-checkbox.checkbox input[type=checkbox] {
  position: absolute;
  left: 0;
  opacity: 0;
  outline: none;
  z-index: -1;
}
.b-checkbox.checkbox input[type=checkbox] + .check {
  padding: 0;
  background: var(--bulma-checkbox-background-color);
  border-style: solid;
  border-width: var(--bulma-checkbox-border-width);
  box-shadow: var(--bulma-checkbox-shadow);
  width: var(--bulma-checkbox-size);
  height: var(--bulma-checkbox-size);
  flex-shrink: 0;
  border-radius: var(--bulma-checkbox-border-radius);
  transition: background var(--bulma-speed-slow) var(--bulma-easing);
}
.b-checkbox.checkbox input[type=checkbox]:checked + .check {
  background: var(--bulma-checkbox-active-background-color) var(--bulma-checkbox-checkmark-image) no-repeat center center;
  border-color: var(--bulma-checkbox-border-color);
}
.b-checkbox.checkbox input[type=checkbox]:indeterminate + .check {
  background: var(--bulma-checkbox-active-background-color) var(--bulma-checkbox-indeterminate-image) no-repeat center center;
  border-color: var(--bulma-checkbox-border-color);
}
.b-checkbox.checkbox input[type=checkbox]:focus + .check {
  box-shadow: var(--bulma-checkbox-shadow);
}
.b-checkbox.checkbox input[type=checkbox]:focus:checked + .check {
  box-shadow: var(--bulma-checkbox-shadow);
}
.b-checkbox.checkbox .control-label {
  padding-left: var(--bulma-control-padding-horizontal);
}
.b-checkbox.checkbox.button {
  display: flex;
}
.b-checkbox.checkbox[disabled] {
  opacity: 0.5;
}
.b-checkbox.checkbox:hover input[type=checkbox]:not(:disabled) + .check {
  border-color: var(--bulma-checkbox-border-color);
}
.b-checkbox.checkbox.is-small {
  border-radius: var(--bulma-radius-small);
  font-size: var(--bulma-size-small);
}
.b-checkbox.checkbox.is-medium {
  font-size: var(--bulma-size-medium);
}
.b-checkbox.checkbox.is-large {
  font-size: var(--bulma-size-large);
}

.b-clockpicker {
  --bulma-transition-swing: cubic-bezier(0.25, 0.8, 0.5, 1);
  --bulma-time-font-size: 60px;
  --bulma-period-font-size: 16px;
  --bulma-number-font-size: 18px;
  --bulma-indicator-size: 40px;
  --bulma-hand-endpoint-size: 12px;
  --bulma-padding-outer: 12px;
  --bulma-padding-inner: 5px;
}
.b-clockpicker.is-white {
  --bulma-clockpicker-background-color: var(--bulma-white);
  --bulma-clockpicker-color: var(--bulma-white-invert);
}
.b-clockpicker.is-black {
  --bulma-clockpicker-background-color: var(--bulma-black);
  --bulma-clockpicker-color: var(--bulma-black-invert);
}
.b-clockpicker.is-light {
  --bulma-clockpicker-background-color: var(--bulma-light);
  --bulma-clockpicker-color: var(--bulma-light-invert);
}
.b-clockpicker.is-dark {
  --bulma-clockpicker-background-color: var(--bulma-dark);
  --bulma-clockpicker-color: var(--bulma-dark-invert);
}
.b-clockpicker.is-text {
  --bulma-clockpicker-background-color: var(--bulma-text);
  --bulma-clockpicker-color: var(--bulma-text-invert);
}
.b-clockpicker.is-primary {
  --bulma-clockpicker-background-color: var(--bulma-primary);
  --bulma-clockpicker-color: var(--bulma-primary-invert);
}
.b-clockpicker.is-link {
  --bulma-clockpicker-background-color: var(--bulma-link);
  --bulma-clockpicker-color: var(--bulma-link-invert);
}
.b-clockpicker.is-info {
  --bulma-clockpicker-background-color: var(--bulma-info);
  --bulma-clockpicker-color: var(--bulma-info-invert);
}
.b-clockpicker.is-success {
  --bulma-clockpicker-background-color: var(--bulma-success);
  --bulma-clockpicker-color: var(--bulma-success-invert);
}
.b-clockpicker.is-warning {
  --bulma-clockpicker-background-color: var(--bulma-warning);
  --bulma-clockpicker-color: var(--bulma-warning-invert);
}
.b-clockpicker.is-danger {
  --bulma-clockpicker-background-color: var(--bulma-danger);
  --bulma-clockpicker-color: var(--bulma-danger-invert);
}

.b-clockpicker .dropdown-menu {
  min-width: 0;
}
.b-clockpicker .dropdown,
.b-clockpicker .dropdown-trigger {
  width: 100%;
}
.b-clockpicker .dropdown .input[readonly],
.b-clockpicker .dropdown-trigger .input[readonly] {
  cursor: pointer;
  box-shadow: var(--bulma-input-shadow);
}
.b-clockpicker .dropdown .input[readonly]:focus, .b-clockpicker .dropdown .input[readonly].is-focused, .b-clockpicker .dropdown .input[readonly]:active, .b-clockpicker .dropdown .input[readonly].is-active,
.b-clockpicker .dropdown-trigger .input[readonly]:focus,
.b-clockpicker .dropdown-trigger .input[readonly].is-focused,
.b-clockpicker .dropdown-trigger .input[readonly]:active,
.b-clockpicker .dropdown-trigger .input[readonly].is-active {
  box-shadow: var(--bulma-input-focus-box-shadow-size) var(--bulma-input-focus-box-shadow-color);
}
.b-clockpicker .dropdown-item {
  font-size: inherit;
  padding: 0;
}
.b-clockpicker .dropdown-content {
  padding-top: 0;
  padding-bottom: 0;
}
.b-clockpicker .card {
  border-radius: var(--bulma-card-radius);
}
.b-clockpicker .card-header {
  background-color: var(--bulma-clockpicker-background-color);
  color: var(--bulma-clockpicker-color);
  border-top-left-radius: var(--bulma-card-radius);
  border-top-right-radius: var(--bulma-card-radius);
}
.b-clockpicker .card-content {
  padding: var(--bulma-padding-outer);
}
.b-clockpicker-btn {
  cursor: pointer;
  opacity: 0.6;
}
.b-clockpicker-btn:hover, .b-clockpicker-btn.active {
  opacity: 1;
}
.b-clockpicker-period .b-clockpicker-btn {
  font-size: var(--bulma-period-font-size);
}
.b-clockpicker-time span {
  align-items: center;
  display: inline-flex;
  justify-content: center;
}
.b-clockpicker-header {
  display: flex;
  line-height: 1;
  justify-content: flex-end;
  color: inherit;
}
.b-clockpicker-header .b-clockpicker-time {
  white-space: nowrap;
}
.b-clockpicker-header .b-clockpicker-time span {
  height: var(--bulma-time-font-size);
  font-size: var(--bulma-time-font-size);
}
.b-clockpicker-header .b-clockpicker-period {
  align-self: flex-end;
  display: flex;
  flex-direction: column;
  margin: 8px 0 6px 8px;
}
.b-clockpicker-body {
  transition: 0.9s var(--bulma-transition-swing);
}
.b-clockpicker-body .b-clockpicker-btn {
  padding: 0 8px;
  border-radius: var(--bulma-radius-rounded);
  margin-bottom: 2px;
}
.b-clockpicker-body .b-clockpicker-btn:hover, .b-clockpicker-body .b-clockpicker-btn.active {
  background-color: var(--bulma-primary);
  color: var(--bulma-text);
}
.b-clockpicker-body .b-clockpicker-period {
  position: absolute;
  top: 5px;
  right: 5px;
}
.b-clockpicker-body .b-clockpicker-time {
  position: absolute;
  top: 5px;
  left: 5px;
  font-size: var(--bulma-period-font-size);
}
.b-clockpicker-body .b-clockpicker-face {
  border-radius: 50%;
  position: relative;
  background-color: var(--bulma-grey-lighter);
  width: 100%;
  height: 100%;
  align-items: center;
  display: flex;
  justify-content: center;
}
.b-clockpicker-body .b-clockpicker-face:after {
  background-color: var(--bulma-clockpicker-background-color);
  border-radius: 50%;
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: var(--bulma-hand-endpoint-size);
  height: var(--bulma-hand-endpoint-size);
  z-index: 10;
}
.b-clockpicker-body .b-clockpicker-face-outer-ring {
  user-select: none;
  height: calc(100% - var(--bulma-indicator-size) + var(--bulma-padding-inner) * 2);
  width: calc(100% - var(--bulma-indicator-size) + var(--bulma-padding-inner) * 2);
  position: relative;
  border-radius: 50%;
}
.b-clockpicker-body .b-clockpicker-face-number {
  align-items: center;
  border-radius: 100%;
  cursor: default;
  display: flex;
  font-size: var(--bulma-number-font-size);
  text-align: center;
  justify-content: center;
  position: absolute;
  width: var(--bulma-indicator-size);
  height: var(--bulma-indicator-size);
  left: calc(50% - var(--bulma-indicator-size) * 0.5);
  top: calc(50% - var(--bulma-indicator-size) * 0.5);
  user-select: none;
}
.b-clockpicker-body .b-clockpicker-face-number > span {
  z-index: 1;
}
.b-clockpicker-body .b-clockpicker-face-number:before, .b-clockpicker-body .b-clockpicker-face-number:after {
  content: "";
  height: var(--bulma-indicator-size);
  width: var(--bulma-indicator-size);
  border-radius: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.b-clockpicker-body .b-clockpicker-face-number.active {
  cursor: default;
  z-index: 2;
  background-color: var(--bulma-clockpicker-background-color);
  color: var(--bulma-clockpicker-color);
}
.b-clockpicker-body .b-clockpicker-face-number.disabled {
  pointer-events: none;
  opacity: 0.25;
}
.b-clockpicker-body .b-clockpicker-face-hand {
  height: calc(50% - var(--bulma-hand-endpoint-size) * 0.5);
  width: 2px;
  bottom: 50%;
  left: calc(50% - 1px);
  background-color: var(--bulma-clockpicker-background-color);
  border-color: var(--bulma-clockpicker-background-color);
  transform-origin: center bottom;
  position: absolute;
  will-change: transform;
  z-index: 1;
}
.b-clockpicker-body .b-clockpicker-face-hand:before {
  background: transparent;
  border-width: 2px;
  border-style: solid;
  border-color: inherit;
  border-radius: 100%;
  width: var(--bulma-hand-endpoint-size);
  height: var(--bulma-hand-endpoint-size);
  content: "";
  position: absolute;
  top: calc(-1 * var(--bulma-hand-endpoint-size) * 0.5);
  left: 50%;
  transform: translate(-50%, -50%);
}
.b-clockpicker-footer {
  display: block;
  padding: var(--bulma-padding-outer);
}
.b-clockpicker.is-small {
  border-radius: var(--bulma-radius-small);
  font-size: var(--bulma-size-small);
}
.b-clockpicker.is-medium {
  font-size: var(--bulma-size-medium);
}
.b-clockpicker.is-large {
  font-size: var(--bulma-size-large);
}

.collapse .collapse-trigger {
  display: inline;
  cursor: pointer;
}
.collapse .collapse-content {
  display: inherit;
}

.colorpicker {
  --bulma-colorpicker-radius: var(--bulma-radius);
  --bulma-colorpicker-hue-selected-stroke: var(--bulma-primary);
}

.colorpicker .color-name {
  font-family: var(--bulma-family-monospace);
  text-transform: uppercase;
}
.colorpicker .colorpicker-footer {
  margin-top: 0.875rem;
  padding-top: 0.875rem;
  border: 1px solid var(--bulma-border);
  border-width: 1px 0 0 0;
}
.colorpicker .colorpicker-footer .colorpicker-fields {
  margin-bottom: 0.875rem;
}
.colorpicker .colorpicker-footer .colorpicker-fields .field {
  flex-grow: 1;
}
.colorpicker .colorpicker-footer .colorpicker-fields .field .field-label {
  margin-right: 0.5rem;
}
.colorpicker .colorpicker-footer .colorpicker-fields .field .control {
  display: flex;
}
.colorpicker .colorpicker-footer .colorpicker-fields .field .control .input {
  -webkit-appearance: none;
  -moz-appearance: textfield;
  appearance: textfield;
  flex-grow: 1;
  width: 0;
  min-width: 42px;
  text-align: right;
}
.colorpicker .colorpicker-footer .colorpicker-fields .field .control .input::-webkit-outer-spin-button, .colorpicker .colorpicker-footer .colorpicker-fields .field .control .input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.colorpicker .dropdown.is-expanded .dropdown-menu,
.colorpicker .dropdown.is-expanded.is-mobile-modal .dropdown-menu {
  width: unset;
}
.colorpicker .dropdown-horizontal-colorpicker {
  display: flex;
  flex-direction: row;
}
.colorpicker .dropdown-horizontal-colorpicker .colorpicker-footer {
  border-width: 0 0 0 1px;
  margin-top: 0;
  padding-top: 0;
  margin-left: 0.875rem;
  padding-left: 0.875rem;
}

svg.b-colorpicker-triangle {
  width: 200px;
  height: 200px;
  user-select: none;
}
@media (max-width: 769px) {
  svg.b-colorpicker-triangle {
    width: 100%;
    height: auto;
  }
}
svg.b-colorpicker-triangle .colorpicker-triangle-hue {
  width: 100%;
  height: 100%;
  background: conic-gradient(#f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00);
}
svg.b-colorpicker-triangle .colorpicker-triangle-slider-hue, svg.b-colorpicker-triangle .colorpicker-triangle-slider-hue foreignObject, svg.b-colorpicker-triangle .colorpicker-triangle-slider-hue g, svg.b-colorpicker-triangle .colorpicker-triangle-slider-sl, svg.b-colorpicker-triangle .colorpicker-triangle-slider-sl foreignObject, svg.b-colorpicker-triangle .colorpicker-triangle-slider-sl g {
  transform-origin: 50% 50%;
}
svg.b-colorpicker-triangle .hue-range-thumb,
svg.b-colorpicker-triangle .sl-range-thumb {
  background: transparent;
  border-radius: var(--bulma-colorpicker-radius);
  box-shadow: inset 0 0 0 1px #fff, 0 0 0 1px #dbdbdb;
  cursor: grab;
  height: calc(100% - 0.25em);
  width: calc(100% - 0.25em);
  margin: 0.125em;
}
svg.b-colorpicker-triangle .hue-range-thumb:hover,
svg.b-colorpicker-triangle .sl-range-thumb:hover {
  box-shadow: inset 0 0 0 1px #fff, 0 0 0 1px #b5b5b5;
}
svg.b-colorpicker-triangle .hue-range-thumb:focus,
svg.b-colorpicker-triangle .sl-range-thumb:focus {
  box-shadow: inset 0 0 0 1px #fff, 0 0 0 1px var(--bulma-colorpicker-hue-selected-stroke), 0 0 0 0.125em rgba(var(--bulma-colorpicker-hue-selected-stroke), 0.25);
}
svg.b-colorpicker-triangle .hue-range-thumb:active,
svg.b-colorpicker-triangle .sl-range-thumb:active {
  cursor: grabbing;
}

div.b-colorpicker-square {
  position: relative;
  aspect-ratio: 1/1;
  user-select: none;
}
div.b-colorpicker-square .colorpicker-square-slider-hue {
  background: conic-gradient(#f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00);
  border-radius: var(--bulma-colorpicker-radius);
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
div.b-colorpicker-square .colorpicker-square-slider-hue .hue-range-thumb {
  border-radius: calc(var(--bulma-colorpicker-radius) / 1.75);
  position: absolute;
  aspect-ratio: 1/1;
  transform: translate(-50%, -50%);
  box-shadow: inset 0 0 0 1px #fff, 0 0 0 1px #dbdbdb;
  cursor: grab;
}
div.b-colorpicker-square .colorpicker-square-slider-hue .hue-range-thumb:hover {
  box-shadow: inset 0 0 0 1px #fff, inset 0 0 0 2px #b5b5b5, 0 0 0 1px #b5b5b5;
}
div.b-colorpicker-square .colorpicker-square-slider-hue .hue-range-thumb:focus {
  box-shadow: inset 0 0 0 1px #fff, 0 0 0 1px var(--bulma-colorpicker-hue-selected-stroke), 0 0 0 0.125em rgba(var(--bulma-colorpicker-hue-selected-stroke), 0.25);
}
div.b-colorpicker-square .colorpicker-square-slider-hue .hue-range-thumb:active {
  cursor: grabbing;
}
div.b-colorpicker-square .colorpicker-square-slider-sl {
  background: #fff;
  border-radius: calc(var(--bulma-colorpicker-radius) * 0.5);
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
div.b-colorpicker-square .colorpicker-square-slider-sl::before {
  content: "";
  background: linear-gradient(0deg, #000, #fff);
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  mix-blend-mode: hard-light;
}
div.b-colorpicker-square .colorpicker-square-slider-sl .sl-range-thumb {
  display: block;
  border-radius: var(--bulma-colorpicker-radius);
  position: absolute;
  width: 8px;
  height: 8px;
  transform: translate(-50%, -50%);
  box-shadow: inset 0 0 0 1px #fff, 0 0 0 1px #dbdbdb;
  cursor: grab;
}
div.b-colorpicker-square .colorpicker-square-slider-sl .sl-range-thumb:hover {
  box-shadow: inset 0 0 0 1px #fff, inset 0 0 0 2px #b5b5b5, 0 0 0 1px #b5b5b5;
}
div.b-colorpicker-square .colorpicker-square-slider-sl .sl-range-thumb:focus {
  box-shadow: inset 0 0 0 1px #fff, 0 0 0 1px var(--bulma-colorpicker-hue-selected-stroke), 0 0 0 0.125em rgba(var(--bulma-colorpicker-hue-selected-stroke), 0.25);
}
div.b-colorpicker-square .colorpicker-square-slider-sl .sl-range-thumb:active {
  cursor: grabbing;
}

.b-colorpicker-alpha-slider {
  height: 1em;
  background-image: linear-gradient(45deg, #c7c7c7 25%, transparent 25%, transparent 75%, #c7c7c7 75%, #c7c7c7), linear-gradient(45deg, #c7c7c7 25%, transparent 25%, transparent 75%, #c7c7c7 75%, #c7c7c7);
  background-size: 1em 1em;
  background-position: 0.5em 0.5em, 0 0;
  border-radius: var(--bulma-colorpicker-radius);
  margin-top: 0.125em;
  margin-bottom: 0.875rem;
  position: relative;
}
.b-colorpicker-alpha-slider .alpha-range-thumb {
  width: 0.4em;
  height: 1.25em;
  border-radius: var(--bulma-colorpicker-radius);
  box-shadow: inset 0 0 0 1px #fff, inset 0 0 0 2px #dbdbdb, 0 0 0 1px #dbdbdb;
  cursor: grab;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(-50%, -50%);
}
.b-colorpicker-alpha-slider .alpha-range-thumb:hover {
  box-shadow: inset 0 0 0 1px #fff, inset 0 0 0 2px #b5b5b5, 0 0 0 1px #b5b5b5;
}
.b-colorpicker-alpha-slider .alpha-range-thumb:focus {
  box-shadow: inset 0 0 0 1px #fff, 0 0 0 1px var(--bulma-colorpicker-hue-selected-stroke), 0 0 0 0.125em rgba(var(--bulma-colorpicker-hue-selected-stroke), 0.25);
}
.b-colorpicker-alpha-slider .alpha-range-thumb:active {
  cursor: grabbing;
}
.b-colorpicker-alpha-slider .alpha-range-thumb > .b-tooltip, .b-colorpicker-alpha-slider .alpha-range-thumb > .b-tooltip > .tooltip-trigger {
  position: absolute;
  display: block;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.datepicker {
  --bulma-datepicker-background-color: var(--bulma-scheme-main);
  --bulma-datepicker-radius: var(--bulma-radius);
  --bulma-datepicker-shadow: var(--bulma-shadow);
  --bulma-datepicker-header-color: var(--bulma-grey);
  --bulma-datepicker-today-border: solid 1px rgba(var(--bulma-primary), 0.5);
  --bulma-datepicker-item-color: var(--bulma-text);
  --bulma-datepicker-item-disabled-color: var(--bulma-text-weak);
  --bulma-datepicker-item-hover-color: var(--bulma-primary-light-invert);
  --bulma-datepicker-item-hover-background-co