:root {
  --ba-copytoclipboard-transitionout: 300ms;
  --ba-copytoclipboard-transitionin: 300ms;
  --ba-copytoclipboard-translatex: 0;
  --ba-copytoclipboard-translatey: -10px;
  --ba-copytoclipboard-scale: 0.95;
  --ba-copytoclipboard-background: #efeeea;
  --ba-copytoclipboard-duration: 500ms;
}

.brxe-ba-copy-to-clipboard {
  position: relative;
  max-width: max-content;
  cursor: pointer;
}

.ba-copy-tooltip-content {
  position: absolute;
  visibility: hidden;
}

[data-tippy-root] + [data-tippy-root] {
  display: none;
}

.brxe-ba-copy-to-clipboard .tippy-box {
  color: inherit;
  background: transparent;
  transform: translateZ(0);
}

[data-tippy-content] {
  cursor: pointer;
}

.brxe-ba-copy-to-clipboard .tippy-content {
  padding: 1em;
  background: var(--ba-copytoclipboard-background);
  box-shadow: 0 10px 20px rgb(0 0 0 / 10%);
  border-radius: 5px;
  text-align: center;
  width: 10ch;
}

.brxe-ba-copy-to-clipboard .tippy-arrow {
  color: var(--ba-copytoclipboard-background);
  opacity: 1;
  visibility: visible;
}

.brxe-ba-copy-to-clipboard .tippy-arrow:before {
  color: var(--ba-copytoclipboard-background);
  transition: all var(--ba-copytoclipboard-duration) ease;
}

.brxe-ba-copy-to-clipboard:not([data-ba-tooltip]) [data-tippy-root] {
  display: none;
}

.ba-copy-to-clipboard_animated-icon {
  height: 100%;
}

/* custom animation */

.ba-copy-to-clipboard[aria-expanded="true"]
  + .ba-copy-tooltip-content
  .tippy-box[data-theme~="bricksable"] {
  visibility: visible;
  transition-duration: var(--ba-copytoclipboard-transitionin);
}

.ba-popover_button[aria-expanded="false"]
  + .ba-copy-tooltip-content
  .tippy-box[data-theme~="bricksable"] {
  opacity: 0;
  transform: translate(
      var(--ba-copytoclipboard-translatex),
      var(--ba-copytoclipboard-translatey)
    )
    scale(var(--ba-copytoclipboard-scale));
  transition-duration: var(--ba-copytoclipboard-transitionout);
  transition-property: opacity, transform;
}

.tippy-box[data-animation="bricksable"][data-state="hidden"] {
  opacity: 0;
  transform: translate(
      var(--ba-copytoclipboard-translatex),
      var(--ba-copytoclipboard-translatey)
    )
    scale(var(--ba-copytoclipboard-scale));
  transition-duration: var(--ba-copytoclipboard-transitionout);
  transition-property: opacity, transform;
}

.ba-copy-to-clipboard {
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: all var(--ba-copytoclipboard-duration) ease;
  /* padding: 1rem;*?
  /* gap: .5em; */
  overflow: hidden;
  position: relative;
}

.ba-copy-to-clipboard_icons {
  align-items: center;
  justify-content: center;
  position: relative;
}

.ba-copied-icon {
  position: absolute;
}

.ba-copy-to-clipboard_icon {
  width: 1em;
  height: 1em;
  font-size: 1em;
  align-items: center;
  justify-content: center;
  transition: transform var(--ba-copytoclipboard-duration) ease,
    opacity var(--ba-copytoclipboard-duration) ease,
    stroke-dashoffset var(--ba-copytoclipboard-duration) ease;
}

.brxe-ba-copy-to-clipboard
  .ba-copy-to-clipboard[aria-pressed="true"]
  .ba-copy-icon {
  opacity: 0;
}

.brxe-ba-copy-to-clipboard
  .ba-copy-to-clipboard[aria-pressed="true"]
  .ba-copied-icon {
  opacity: 1;
}

/* slideup */
.brxe-ba-copy-to-clipboard
  .ba-copy-to-clipboard[aria-pressed="true"][data-ba-animation*="slide_up"]
  .ba-copy-icon {
  transform: translateY(-100%);
}

.brxe-ba-copy-to-clipboard
  .ba-copy-to-clipboard[data-ba-animation*="slide_up"]
  .ba-copied-icon {
  transform: translateY(100%);
}

.brxe-ba-copy-to-clipboard
  .ba-copy-to-clipboard[aria-pressed="true"][data-ba-animation*="slide_up"]
  .ba-copied-icon {
  transform: translateY(0%);
}

/* slidedown */
.brxe-ba-copy-to-clipboard
  .ba-copy-to-clipboard[aria-pressed="true"][data-ba-animation*="slide_down"]
  .ba-copy-icon {
  transform: translateY(100%);
}

.brxe-ba-copy-to-clipboard
  .ba-copy-to-clipboard[data-ba-animation*="slide_down"]
  .ba-copied-icon {
  transform: translateY(-100%);
}

.brxe-ba-copy-to-clipboard
  .ba-copy-to-clipboard[aria-pressed="true"][data-ba-animation*="slide_down"]
  .ba-copied-icon {
  transform: translateY(0%);
}

/* slideleft */
.brxe-ba-copy-to-clipboard
  .ba-copy-to-clipboard[aria-pressed="true"][data-ba-animation*="slide_left"]
  .ba-copy-icon {
  transform: translateX(-100%);
}

.brxe-ba-copy-to-clipboard
  .ba-copy-to-clipboard[data-ba-animation*="slide_left"]
  .ba-copied-icon {
  transform: translateX(100%);
}

.brxe-ba-copy-to-clipboard
  .ba-copy-to-clipboard[aria-pressed="true"][data-ba-animation*="slide_left"]
  .ba-copied-icon {
  transform: translateX(0%);
}

/* slideright */
.brxe-ba-copy-to-clipboard
  .ba-copy-to-clipboard[aria-pressed="true"][data-ba-animation*="slide_right"]
  .ba-copy-icon {
  transform: translateX(100%);
}

.brxe-ba-copy-to-clipboard
  .ba-copy-to-clipboard[data-ba-animation*="slide_right"]
  .ba-copied-icon {
  transform: translateX(-100%);
}

.brxe-ba-copy-to-clipboard
  .ba-copy-to-clipboard[aria-pressed="true"][data-ba-animation*="slide_right"]
  .ba-copied-icon {
  transform: translateX(0%);
}

/* flipY */
.brxe-ba-copy-to-clipboard
  .ba-copy-to-clipboard[aria-pressed="true"][data-ba-animation*="flip_y"]
  .ba-copy-icon {
  transform: rotateY(180deg);
}

.brxe-ba-copy-to-clipboard
  .ba-copy-to-clipboard[data-ba-animation*="flip_y"]
  .ba-copied-icon {
  transform: rotateY(-180deg);
}

.brxe-ba-copy-to-clipboard
  .ba-copy-to-clipboard[aria-pressed="true"][data-ba-animation*="flip_y"]
  .ba-copied-icon {
  transform: rotateY(0deg);
}

/* flipX */
.brxe-ba-copy-to-clipboard
  .ba-copy-to-clipboard[aria-pressed="true"][data-ba-animation*="flip_x"]
  .ba-copy-icon {
  transform: rotateX(180deg);
}

.brxe-ba-copy-to-clipboard
  .ba-copy-to-clipboard[data-ba-animation*="flip_x"]
  .ba-copied-icon {
  transform: rotateX(-180deg);
}

.brxe-ba-copy-to-clipboard
  .ba-copy-to-clipboard[aria-pressed="true"][data-ba-animation*="flip_x"]
  .ba-copied-icon {
  transform: rotateX(0deg);
}

.ba-copied-icon {
  color: inherit;
  stroke-dasharray: 50;
  stroke-dashoffset: -50;
  opacity: 0;
}

.ba-copy-to-clipboard[aria-pressed="true"] {
  stroke-dashoffset: 0;
  opacity: 1;
  transform: none !important;
}

.ba-copy-tooltip-content {
  position: absolute;
  visibility: hidden;
}

.ba-copy-to-clipboard {
  position: relative;
}

.ba-copy-to-clipboard > .brxe-block:nth-child(2) {
  position: absolute;
  transform: translateY(100%);
  opacity: 0;
  transition: all 0.3s ease;
}

.ba-copy-to-clipboard[aria-pressed="true"]
  > .brxe-block:nth-child(1):not(:only-child) {
  transform: translateY(-100%);
  opacity: 0;
}

.ba-copy-to-clipboard[aria-pressed="true"] > .brxe-block:nth-child(2) {
  transform: translateY(0%);
  opacity: 1;
}

[data-ba-copy-to-clipboard*="hideEmpty"] {
  display: none;
}

.brx-body.iframe [data-ba-copy-to-clipboard*="hideEmpty"] {
  display: block;
}

/* Arrow Positioning */

.tippy-box[data-placement^="top"] > .tippy-arrow {
  left: 50% !important;
  transform: translateX(-50%) !important;
}

.tippy-box[data-placement^="bottom"] > .tippy-arrow {
  left: 50% !important;
  top: 0px !important;
  transform: translateX(-50%) !important;
}

.tippy-box[data-placement^="right"] > .tippy-arrow {
  top: 50% !important;
  left: 0px !important;
  transform: translateY(-50%) !important;
}

.tippy-box[data-placement^="left"] > .tippy-arrow {
  top: 50% !important;
  right: 0px !important;
  transform: translateY(-50%) !important;
}

.brxe-ba-copy-to-clipboard .tippy-arrow {
  z-index: 999;
}