/* Profile Info Section Styles */ .profile-info { margin-top: 1.2rem; display: flex; flex-direction: column; gap: 0.7rem; align-items: flex-start; } .profile-info-item { display: flex; align-items: center; gap: 0.6rem; font-size: 0.95rem; background: none; border-radius: 0; padding: 0; box-shadow: none; transition: none; } .profile-info-item i { font-size: 1.3rem; color: #4fc3f7; margin-right: 0.2rem; } .profile-info-label { font-weight: 600; color: #222; margin-right: 0.3rem; } .profile-info-value { color: rgba(255, 255, 255, 0.45); font-weight: 400; } .profile-info-value span { display: block; } /* profile.css - Styles for avatar and avatar-container */ .profile-container { position: relative; } .avatar { width: 160px; height: 160px; border-radius: 24px; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); display: flex; align-items: center; justify-content: center; color: white; position: relative; overflow: hidden; border: 2px solid rgba(255, 255, 255, 0.2); } .avatar::before { content: ''; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%; background: linear-gradient(45deg, transparent 30%, rgba(255, 255, 255, 0.1) 50%, transparent 70%); } .avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: 24px; }