/* era-styles.css - Updated with Comprehensive Guide Components */

/* Add any missing styles from the comprehensive guide */
.temp-connection {
  position: absolute;
  z-index: 5;
}

/* Animation for success states */
@keyframes successPulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.05); }
  100% { transform: scale(1); }
}

.success-pulse {
  animation: successPulse 0.5s ease;
}

/* Progress bar animation */
@keyframes progressFill {
  from { width: 0; }
  to { width: var(--target-width); }
}

.progress-fill {
  animation: progressFill 1s ease-out forwards;
}

/* Enhanced button styles for CTA */
.btn-large {
  padding: 1rem 2rem;
  font-size: 1.1rem;
  font-weight: 600;
}

.btn-block {
  display: block;
  width: 100%;
}

/* Additional responsive utilities */
@media (max-width: 768px) {
  .hide-on-mobile {
    display: none !important;
  }
  
  .text-center-mobile {
    text-align: center;
  }
}

/* Print styles for the guide */
@media print {
  .era-comprehensive-hero,
  .sidebar,
  .more-articles,
  .footer,
  .cta-actions,
  .ai-prompts,
  .share-buttons {
    display: none !important;
  }
  
  .article-content {
    padding-top: 0;
  }
  
  .content-wrapper {
    display: block;
  }
}