.ks-template {
  width: 100%;
  position: relative;
  &__spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
  }
}
.ks-template__iframe {
  width: 1px;
  // Using min-width to set the width of the iFrame, works around an issue in iOS that can prevent the iFrame from sizing correctly
  min-width: 100%;
  overflow: auto;
  vertical-align: middle;
  border: none;
}

.ks-template__iframe-wrapper {
  width: 100%;
  max-width: 100%;
  position: relative;
}

.ks-template__resizable {
  border: 1px solid var(--c-frame);
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  position: relative;
  resize: horizontal;
  overflow: hidden;
  width: 100%;
  max-width: 100%;

  &__size-reading {
    font-size: var(--font-size-s);
    color: var(--c-text-subdued);
    position: absolute;
    bottom: 0;
    right: var(--space-m);
  }
}
