$small-font-size: .750em !default;
$font-size-sm: 1rem * .750 !default;

$primary: #B5179E;
$dark: #560BAD;

@import "./bootstrap";

.nounderline {
  text-decoration: none !important
}

svg {
  color: rgba(0,0,0,0.250);
}

.legend {
    display: flex;
    align-items: center;
}

/* LiveView specific classes for your customizations */

.phx-no-feedback.invalid-feedback,
.phx-no-feedback .invalid-feedback {
  display: none;
}

.phx-click-loading {
  opacity: 0.5;
  transition: opacity 1s ease-out;
}

.phx-disconnected {
  cursor: wait;
}
.phx-disconnected * {
  pointer-events: none;
}

.submit-loader {
  position: relative;
  width: 100%;
  height: 2px;
  overflow: hidden;
  display: none;
}

.submit-loader::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 120px;
  background: $primary;
  animation: submit-loader 1s linear infinite;
}

@keyframes submit-loader {
  0% {
    left: 0;
    transform: translateX(-100%);
  }

  100% {
    left: 100%;
    transform: translateX(0);
  }
}

.phx-submit-loading .submit-loader {
  display: block;
}