/*
 * embed-loading.css —— 交互组件 iframe 的加载占位
 *
 * 配合 static/js/embed-loading.js 使用：JS 在 iframe 上盖一层「下载文件中……」，
 * 等 iframe 的 load 事件触发后再撤掉。
 */

[data-interactive-embed] {
  position: relative;
}

.lr-embed-loading {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.6em;
  /* 与 iframe 内联的 background:#fff 对齐,避免占位层和 iframe 之间有缝 */
  background: #fff;
  color: #6b7280;
  font-size: 0.95rem;
  letter-spacing: 0.02em;
  user-select: none;
}

.lr-embed-loading__spinner {
  flex: none;
  width: 1.05em;
  height: 1.05em;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  opacity: 0.55;
  animation: lr-embed-loading-spin 0.9s linear infinite;
}

@keyframes lr-embed-loading-spin {
  to {
    transform: rotate(360deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .lr-embed-loading__spinner {
    animation: none;
  }
}