/*
 * Minimal app-wide utilities for gaps Bootstrap does not cover cleanly.
 * If a rule starts defining a component look, it does not belong here.
 */

.required::after {
  content: " *";
  color: var(--bs-danger);
}

.cursor-pointer {
  cursor: pointer !important;
}

.min-height-auto {
  min-height: auto !important;
}

.min-w-0 {
  min-width: 0 !important;
}

.mb-n2 {
  margin-bottom: -0.5rem !important;
}

.resize-none {
  resize: none !important;
}

.resize-vertical {
  resize: vertical !important;
}

.btn-transparent {
  --bs-btn-padding-x: 0.35rem;
  --bs-btn-padding-y: 0.2rem;
  --bs-btn-color: inherit;
  --bs-btn-bg: transparent;
  --bs-btn-border-color: transparent;
  --bs-btn-hover-color: inherit;
  --bs-btn-hover-bg: transparent;
  --bs-btn-hover-border-color: transparent;
  --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
  --bs-btn-active-color: inherit;
  --bs-btn-active-bg: transparent;
  --bs-btn-active-border-color: transparent;
  --bs-btn-disabled-color: inherit;
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: transparent;
}

.visible-scroll {
  opacity: 0;
  pointer-events: none;
  animation-name: visible-scroll-animation;
  animation-duration: 1ms;
  animation-fill-mode: both;
  animation-timeline: scroll(root);
  animation-range-start: 0px;
  animation-range-end: 1px;
}

@keyframes visible-scroll-animation {
  from {
    opacity: 0;
    pointer-events: none;
  }

  to {
    opacity: 0.5;
    pointer-events: auto;
  }
}