.root {
  position: absolute;
  z-index: var(--z-modal-confirm);
  top: 0;
  left: 0;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  width: 100%;
  height: 100%;

  background-color: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(2rem);

  transition: opacity 0.3s ease;
  animation: fade-in-opacity 0.3s ease;

  &.closing {
    opacity: 0;
  }
}

.voice {
  padding: 0.6875rem;
  border-radius: 1rem;
  background-color: var(--color-background);
}

.video {
  background: transparent;
}

.footer {
  position: absolute;
  bottom: 0;
  left: 0;

  width: 100%;
  margin-bottom: 2rem;
}

.closeBtn {
  width: auto;
  margin: 0 auto;
}

@keyframes fade-in-opacity {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
