.pro-iframe {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-height: 200px;
  box-sizing: border-box;
  background: var(--el-bg-color, #fff);
}
.pro-iframe--full {
  flex: 1;
  height: 100%;
  min-height: 0;
}
.pro-iframe__toolbar {
  flex-shrink: 0;
  padding: 6px 12px;
  background: var(--el-fill-color-blank, #fff);
  border-bottom: 1px solid var(--el-border-color-lighter, #ebeef5);
}
.pro-iframe__body {
  position: relative;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}
.pro-iframe__frame {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: #fff;
}
.pro-iframe__empty,
.pro-iframe__error {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-height: 240px;
}
.pro-iframe__loading {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.72);
  pointer-events: none;
}
.pro-iframe__loading-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.pro-iframe__loading-spinner {
  width: 28px;
  height: 28px;
  border: 2px solid var(--el-border-color, #dcdfe6);
  border-top-color: var(--el-color-primary, #409eff);
  border-radius: 50%;
  animation: pro-iframe-spin 0.8s linear infinite;
}
.pro-iframe__loading-text {
  font-size: 13px;
  color: var(--el-text-color-secondary, #909399);
}
.pro-iframe__error {
  position: absolute;
  inset: 0;
  z-index: 3;
  background: var(--el-bg-color, #fff);
}
@keyframes pro-iframe-spin {
  to {
    transform: rotate(360deg);
  }
}