@tailwind base;
@tailwind components;
@tailwind utilities;

@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

.investigation-card {
  animation: fadeIn 0.4s ease-out both;
}

.investigation-card:nth-child(2) {
  animation-delay: 0.08s;
}

.investigation-card:nth-child(3) {
  animation-delay: 0.16s;
}

/* ── CU skeleton overlay during synthesis refresh ─────────────── */

.cu-skeleton-overlay {
  pointer-events: none;
}

.cu-skeleton-lines {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  margin-top: auto;
}

.cu-skeleton-line {
  height: 16px;
  border-radius: 8px;
  background-color: #e5e7eb;
  position: relative;
  overflow: hidden;
}

/* Striped shimmer that travels left → right through each bar */
.cu-skeleton-line::after {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    105deg,
    transparent 0%,
    transparent 8px,
    rgba(255, 255, 255, 0.45) 8px,
    rgba(255, 255, 255, 0.45) 16px,
    transparent 16px,
    transparent 24px
  );
  animation: cuSkeletonShimmer 1.6s linear infinite;
}

@keyframes cuSkeletonShimmer {
  0%   { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}

@media (prefers-reduced-motion: reduce) {
  [style*="animation:spin"] {
    animation: none !important;
  }

  .investigation-card {
    animation: none;
  }

  .cu-skeleton-line::after {
    animation: none !important;
  }
}