/**
 * OPUS UI V2 — skeleton loaders pour les écrans lents.
 */

body.opus-ui-v2 .opus-v2-skeleton-host {
  position: relative;
  min-height: 180px;
}

body.opus-ui-v2 .opus-v2-skeleton-overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: grid;
  gap: 12px;
  padding: 18px;
  background: rgba(247, 247, 250, .92);
  border-radius: 14px;
  pointer-events: none;
}

body.opus-ui-v2 .opus-v2-skeleton-line {
  height: 14px;
  border-radius: 999px;
  background: linear-gradient(90deg, #ececf1 0%, #f7f7fa 50%, #ececf1 100%);
  background-size: 200% 100%;
  animation: opus-v2-shimmer 1.2s ease-in-out infinite;
}

body.opus-ui-v2 .opus-v2-skeleton-line.is-wide { width: 88%; }
body.opus-ui-v2 .opus-v2-skeleton-line.is-medium { width: 62%; }
body.opus-ui-v2 .opus-v2-skeleton-line.is-short { width: 38%; }

body.opus-ui-v2 .opus-v2-skeleton-card {
  height: 120px;
  border-radius: 16px;
  background: linear-gradient(90deg, #ececf1 0%, #f7f7fa 50%, #ececf1 100%);
  background-size: 200% 100%;
  animation: opus-v2-shimmer 1.2s ease-in-out infinite;
}

body.opus-ui-v2 .spinner-center.opus-v2-skeleton-enhanced .spinner,
body.opus-ui-v2 .spinner-center.opus-v2-skeleton-enhanced .opus-logo-spinner,
body.opus-ui-v2 .spinner-center.opus-v2-skeleton-enhanced .opus-infinity-spinner {
  opacity: .35;
}

@keyframes opus-v2-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

@media (prefers-reduced-motion: reduce) {
  body.opus-ui-v2 .opus-v2-skeleton-line,
  body.opus-ui-v2 .opus-v2-skeleton-card {
    animation: none;
  }
}