iframe {
  background-color: var(--pos-background-color);
  width: 100%;
  height: 100vh;
}

/* consolidate with styles from pos-image */
.error {
  display: flex;
  opacity: 0.8;
  background: repeating-linear-gradient(-45deg, rgba(150, 0, 0, 0.1), rgba(150, 0, 0, 0.1) 10px, #fff 5px, #fff 25px);
  flex-direction: column;
  border: 1px solid red;
  color: black;
  align-items: center;
  justify-content: center;
  word-break: break-all;
  padding: 1rem;
  box-sizing: border-box;
}

.error {
  color: #282828;
  font-size: calc(var(--width) / 2);
}

a {
  text-decoration: none;
  width: var(--width);
  height: var(--height);
}

.code {
  font-weight: bold;
  font-size: calc(var(--width) / 8);
}

.text {
  font-size: calc(var(--width) / 20);
}

.skeleton {
  display: flex;
  gap: var(--size-2);
  flex-direction: column;

  sl-skeleton {
    &:nth-child(2) {
      width: 95%;
    }

    &:nth-child(4) {
      width: 90%;
    }

    &:last-child {
      width: 50%;
    }
  }
}