.progress-sentinel {
  height: 8px;
  border-radius: 4px;
  background-color: #e2efff;
}

.progress-bar-sentinel {
  background-color: var(--action-yellow) !important;
  border-radius: 4px;
  transition: width 0.2s ease-out !important;
  height: 100%;
}

.progress-bar-completed {
  background-color: var(--primary-color) !important;
  transition: width 0.2s ease-out !important;
  height: 100%;
}

#loading-overlay {
  z-index: 9999;
  backdrop-filter: blur(8px);
}

#modal-card {
  max-width: 500px;
  width: 100%;
}

.spinner-border-custom {
  width: 80px;
  height: 80px;
  border-color: #ecf4ff !important;
}

#spinner {
  border-top-color: #F59E0B !important;
  animation: spin 1.5s linear infinite;
}

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

.fade-out {
  opacity: 0;
  transform: scale(0.9);
  transition: opacity 0.5s ease, transform 0.5s ease;
}