:root {
  --ba-overlay-z-index: 100;
  --ba-tooltip-z-index: 110;
}

body.ba-modal-open {
  position: fixed;
  top: calc(-1 * var(--ba-scroll-y, 0px));
  left: calc(-1 * var(--ba-scroll-x, 0px));
  right: calc(var(--ba-scroll-x, 0px));
  bottom: calc(var(--ba-scroll-y, 0px));
}

body.ba-modal-open.ba-body-had-scroll-y {
  overflow-y: scroll;
}

body.ba-modal-open.ba-body-had-scroll-x {
  overflow-x: scroll;
}

.ba-component {
  box-sizing: border-box;
  --color-error-light: #f3d4d4;
  --color-error: #dd1212;
  --color-warning: #c95c02;
  --color-success: #0fa812;
}

.ba-button {
  border-radius: 0.25rem;
  border: 1px solid gray;
  transition: box-shadow 75ms, transform 75ms;
  background-color: white;
  padding: 0.5rem;
  position: relative;
  text-align: center;
}

.ba-button:hover {
  box-shadow: 4px 4px 10px 0px rgba(0, 0, 0, 0.3);
  transform: translate(-1px, -1px);
}

.ba-button:hover::before {
  content: "";
  position: absolute;
  top: 0px;
  left: 0px;
  bottom: -2px;
  right: -2px;
  border-radius: 0.25rem;
  opacity: 0;
}

.ba-button:active {
  transition: box-shadow 25ms, transform 25ms;
  box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.3);
  transform: translate(0px, 0px);
}

.ba-button:disabled {
  opacity: 0.5;
  transition: unset;
}

.ba-button:disabled:hover {
  box-shadow: unset;
  transform: unset;
}

.ba-button:disabled:active {
  box-shadow: unset;
  transform: unset;
}

.ba-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 1.5em;
  height: 1.5em;
}

.ba-c-warning {
  color: var(--color-warning);
}

.ba-c-error {
  color: var(--color-error);
}

.ba-c-error-light {
  color: var(--color-error-light);
}

.ba-c-success {
  color: var(--color-success);
}

.ba-label-button {
  user-select: none;
  display: block;
}

.ba-label-button:hover {
  cursor: pointer;
}

.ba-label-button.ba-disabled {
  opacity: 0.5;
  transition: unset;
  box-shadow: unset;
  transform: unset;
}

.ba-label-button.ba-disabled:hover {
  cursor: unset;
}

.ba-c-errors-container {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.ba-c-errors-container p {
  margin: 0;
}

.ba-c-errors-container .ba-c-error {
  font-weight: 600;
  font-size: 0.9rem;
  color: var(--color-error);
}

.ba-icon-button {
  width: 2rem;
  aspect-ratio: 1;
  position: relative;
}

.ba-icon-button svg {
  height: 1.4rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/*Component specific -------------*/
/*Tooltip*/
.ba-tooltip {
  --ba-overlay-z-index: var(--ba-tooltip-z-index);
}

/*# sourceMappingURL=styles.css.map */
