/* assets/css/userProfile.css */

.user-profile {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 40px 20px;
  }
  
  .user-card {
    background: var(--surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);
    padding: 30px;
    max-width: 500px;
    width: 100%;
    text-align: center;
  }
  
  .user-card h1 {
    font-size: 1.4rem;
    font-family: var(--font-title);
    margin-bottom: 6px;
    color: var(--text);
  }
  
  .user-card p {
    font-size: 0.95rem;
    color: var(--muted);
    margin-bottom: 20px;
  }
  
  .progress-wrap {
    margin: 20px 0;
    text-align: left;
  }
  
  .progress-bar {
    height: 10px;
    background: var(--surface-alt);
    border-radius: var(--radius);
    overflow: hidden;
  }
  
  .progress-fill {
    height: 100%;
    background: var(--gold);
    border-radius: var(--radius);
    transition: width 0.4s ease;
  }
  
  .progress-text {
    margin-top: 6px;
    font-size: 0.85rem;
    color: var(--muted);
  }
  
  .user-card .profile-actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 20px;
  }
  
  .user-card .btn-auth {
    width: 100%;
  }
  
  .onboarding-profile {
    display: flex;
    justify-content: center;
    align-items: center; /* antes era flex-start */
    padding: 40px 16px;
    min-height: 100vh;
    background: var(--background);
  }