@import url("./legacy.css");
@import url("./mobile-rework.css");
.agent-progress-card {
  position: relative;
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  overflow: hidden;
  padding: 1rem;
  border: 1px solid rgba(72, 226, 210, .38);
  border-radius: 1rem;
  background: linear-gradient(135deg, rgba(15, 57, 82, .96), rgba(9, 32, 52, .96));
  box-shadow: 0 0 28px rgba(52, 211, 203, .13), inset 0 1px 0 rgba(255, 255, 255, .05);
}

.agent-progress-card::after {
  content: "";
  position: absolute;
  inset: -60% -20%;
  pointer-events: none;
  background: linear-gradient(110deg, transparent 42%, rgba(83, 235, 219, .08) 50%, transparent 58%);
  animation: agent-progress-shine 2.8s linear infinite;
}

.agent-progress-glow {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  flex: 0 0 2.8rem;
  width: 2.8rem;
  height: 2.8rem;
  color: #52ead8;
  border-radius: 50%;
  background: rgba(43, 207, 194, .12);
  box-shadow: 0 0 0 .35rem rgba(43, 207, 194, .05), 0 0 22px rgba(43, 207, 194, .3);
  animation: agent-progress-pulse 1.8s ease-in-out infinite;
}

.agent-progress-glow .bi-stars {
  position: absolute;
  right: -.2rem;
  top: -.45rem;
  font-size: .9rem;
}

.agent-progress-card .progress {
  height: .65rem;
  background: rgba(1, 14, 26, .7);
}

.agent-progress-card .progress-bar {
  background-color: #35d9c6;
  box-shadow: 0 0 12px rgba(53, 217, 198, .55);
  transition: width .45s ease;
}

.agent-progress-indeterminate {
  animation: agent-progress-slide 1.35s ease-in-out infinite, progress-bar-stripes 1s linear infinite;
}

@keyframes agent-progress-slide {
  from { transform: translateX(-110%); }
  to { transform: translateX(320%); }
}

@keyframes agent-progress-pulse {
  50% { transform: scale(1.06); box-shadow: 0 0 0 .5rem rgba(43, 207, 194, .07), 0 0 30px rgba(43, 207, 194, .48); }
}

@keyframes agent-progress-shine {
  from { transform: translateX(-35%); }
  to { transform: translateX(35%); }
}

@media (prefers-reduced-motion: reduce) {
  .agent-progress-card::after,
  .agent-progress-glow,
  .agent-progress-indeterminate { animation: none; }
}
