.profile-page{color:#1e293b;background:#f8fafc;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.profile-header{background:#fff;border-bottom:1px solid #e2e8f0;margin-bottom:40px;padding:40px 0 30px}.profile-header .container{max-width:1200px;margin:0 auto;padding:0 20px}.profile-header h1{color:#1e293b;margin-bottom:8px;font-size:2rem;font-weight:700}.header-subtitle{color:#64748b;margin:0;font-size:1rem}.container{max-width:1200px;margin:0 auto;padding:0 20px}.profile-layout{grid-template-columns:300px 1fr;gap:30px;margin-bottom:60px;display:grid}@media (max-width:992px){.profile-layout{grid-template-columns:1fr}}.profile-sidebar{flex-direction:column;gap:30px;display:flex}.profile-card{text-align:center;background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:24px}.avatar-section{margin-bottom:20px}.avatar-wrapper{cursor:pointer;border:3px solid #e2e8f0;border-radius:50%;width:120px;height:120px;margin:0 auto 15px;position:relative;overflow:hidden}.profile-avatar{object-fit:cover;width:100%;height:100%}.avatar-overlay{opacity:0;pointer-events:none;background:#00000059;justify-content:center;align-items:center;transition:opacity .2s;display:flex;position:absolute;inset:0}.avatar-wrapper:hover .avatar-overlay{opacity:1;pointer-events:auto}.avatar-overlay i{color:#fff;font-size:24px}.avatar-input{display:none}.edit-avatar-btn{color:#6b7280;cursor:pointer;background:#f3f4f6;border:none;border-radius:8px;padding:8px 16px;font-size:14px;font-weight:500;transition:all .2s}.edit-avatar-btn:hover{background:#e5e7eb}.profile-info{margin-bottom:25px}.profile-name{color:#1f2937;margin:0 0 5px;font-size:1.5rem;font-weight:700}.profile-email{color:#6b7280;margin:0 0 15px;font-size:.95rem}.role-badge{border-radius:20px;padding:6px 16px;font-size:.85rem;font-weight:600;display:inline-block}.role-badge.student{color:#1d4ed8;background:#dbeafe}.role-badge.instructor{color:#15803d;background:#dcfce7}.role-badge.admin{color:#92400e;background:#fef3c7}.profile-stats{border-top:1px solid #e5e7eb;border-bottom:1px solid #e5e7eb;justify-content:space-around;margin-bottom:25px;padding:20px 0;display:flex}.stat-item{text-align:center}.stat-number{color:#1f2937;margin-bottom:5px;font-size:1.5rem;font-weight:700}.profile-actions{flex-direction:column;gap:12px;display:flex}.action-btn{cursor:pointer;border:none;border-radius:10px;justify-content:center;align-items:center;gap:8px;padding:12px 20px;font-size:.95rem;font-weight:500;transition:all .2s;display:flex}.action-btn.edit{color:#fff;background:#3b82f6}.action-btn.edit:hover{background:#2563eb}.action-btn.cancel{color:#fff;background:#6b7280}.action-btn.cancel:hover{background:#4b5563}.action-btn.logout{color:#ef4444;background:#f3f4f6}.action-btn.logout:hover{color:#fff;background:#ef4444}.quick-stats{background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:24px}.quick-stats h3{color:#1e293b;margin-bottom:20px;font-size:1.2rem;font-weight:600}.stats-grid{grid-template-columns:repeat(3,1fr);gap:16px;display:grid}.stat-card{background:#f8fafc;border-radius:6px;align-items:center;gap:12px;padding:16px;display:flex}.stat-card i{color:#3b82f6;background:#fff;border-radius:4px;justify-content:center;align-items:center;width:32px;height:32px;font-size:20px;display:flex}.stat-value{color:#1e293b;font-size:1.1rem;font-weight:600}.stat-label{color:#64748b;font-size:.85rem}.profile-main{background:#fff;border:1px solid #e2e8f0;border-radius:8px;overflow:hidden}.profile-tabs{background:#f9fafb;border-bottom:1px solid #e5e7eb;display:flex}.tab-btn{color:#6b7280;cursor:pointer;background:0 0;border:none;flex:1;justify-content:center;align-items:center;gap:10px;padding:20px;font-size:1rem;font-weight:500;transition:all .3s;display:flex;position:relative}.tab-btn:hover{color:#4b5563;background:#e5e7eb}.tab-btn.active{color:#3b82f6;background:#fff}.tab-btn.active:after{content:"";background:#3b82f6;height:3px;position:absolute;bottom:-1px;left:0;right:0}.tab-btn i{font-size:18px}.tab-content{padding:30px}.overview-tab{flex-direction:column;gap:30px;display:flex}.edit-profile-form{background:#f8fafc;border-radius:8px;padding:24px}.edit-profile-form h2{color:#1e293b;margin-bottom:20px;font-size:1.5rem;font-weight:600}.form-group{margin-bottom:16px}.form-group label{color:#374151;margin-bottom:6px;font-size:.95rem;font-weight:500;display:block}.form-group input,.form-group textarea{border:1px solid #d1d5db;border-radius:6px;width:100%;padding:10px 12px;font-family:inherit;font-size:1rem;transition:border-color .2s}.form-group input:focus,.form-group textarea:focus{border-color:#3b82f6;outline:none;box-shadow:0 0 0 2px #3b82f61a}.form-actions{gap:12px;margin-top:24px;display:flex}.btn-primary,.btn-secondary{cursor:pointer;border:none;border-radius:6px;padding:10px 20px;font-size:1rem;font-weight:500;transition:background-color .2s}.btn-primary{color:#fff;background:#3b82f6}.btn-primary:hover{background:#2563eb}.btn-primary:disabled{opacity:.7;cursor:not-allowed}.btn-secondary{color:#4b5563;background:#f3f4f6}.btn-secondary:hover{background:#e5e7eb}.profile-details{flex-direction:column;gap:24px;display:flex}.detail-section h3{color:#1e293b;margin-bottom:12px;font-size:1.3rem;font-weight:600}.profile-bio{color:#4b5563;margin:0;font-size:1rem;line-height:1.6}.contact-info{flex-direction:column;gap:10px;display:flex}.contact-item{align-items:center;gap:12px;display:flex}.contact-item i{color:#6b7280;width:20px}.contact-item span,.contact-item a{color:#4b5563;font-size:1rem;text-decoration:none}.contact-item a:hover{color:#3b82f6;text-decoration:underline}.social-links{gap:12px;display:flex}.social-link{color:#4b5563;background:#f3f4f6;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:16px;text-decoration:none;transition:background-color .2s;display:flex}.social-link:hover{color:#fff;background:#3b82f6}.skills-list{flex-wrap:wrap;gap:8px;display:flex}.skill-tag{color:#1d4ed8;background:#dbeafe;border-radius:16px;padding:6px 12px;font-size:.9rem;font-weight:500}.recent-activity{background:#f8fafc;border-radius:8px;padding:24px}.activity-list{flex-direction:column;gap:20px;display:flex}.activity-item{border-bottom:1px solid #e5e7eb;align-items:flex-start;gap:15px;padding-bottom:20px;display:flex}.activity-item:last-child{border-bottom:none;padding-bottom:0}.activity-icon{color:#3b82f6;background:#fff;border-radius:10px;justify-content:center;align-items:center;width:40px;height:40px;font-size:18px;display:flex}.activity-content p{color:#4b5563;margin:0 0 5px;font-size:.95rem}.activity-content strong{color:#1f2937}.activity-time{color:#6b7280;font-size:.85rem}.courses-tab .courses-header{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.courses-header h2{color:#1e293b;margin:0;font-size:1.8rem;font-weight:600}.courses-stats{gap:24px;display:flex}.courses-stats .stat{text-align:center}.courses-stats .stat strong{color:#3b82f6;margin-bottom:4px;font-size:1.5rem;font-weight:600;display:block}.courses-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;display:grid}.course-card{background:#fff;border:1px solid #e2e8f0;border-radius:8px;overflow:hidden}.course-image{height:180px;position:relative;overflow:hidden}.course-image img{object-fit:cover;width:100%;height:100%}.course-progress{background:#000000b3;align-items:center;gap:15px;padding:12px 20px;display:flex;position:absolute;bottom:0;left:0;right:0}.progress-bar{background:#ffffff4d;border-radius:3px;flex:1;height:6px;overflow:hidden}.progress-fill{background:#10b981;border-radius:3px;height:100%}.progress-text{color:#fff;font-size:.9rem;font-weight:600}.course-info{padding:20px}.course-category{color:#6b7280;background:#f3f4f6;border-radius:12px;margin-bottom:10px;padding:4px 12px;font-size:.8rem;display:inline-block}.course-title{color:#1f2937;margin:0 0 15px;font-size:1.1rem;font-weight:600;line-height:1.4}.course-meta{margin-bottom:15px}.last-accessed{color:#6b7280;align-items:center;gap:5px;font-size:.85rem;display:flex}.course-actions{gap:10px;display:flex}.btn-continue{color:#fff;cursor:pointer;background:#3b82f6;border:none;border-radius:8px;flex:1;padding:10px 16px;font-size:.9rem;font-weight:500;transition:background .2s}.btn-continue:hover{background:#2563eb}.btn-outline{color:#6b7280;cursor:pointer;background:#fff;border:1px solid #d1d5db;border-radius:8px;width:40px;height:40px;transition:all .2s}.btn-outline:hover{color:#3b82f6;border-color:#3b82f6}.certificates-tab .certificates-header{margin-bottom:24px}.certificates-header h2{color:#1e293b;margin:0 0 8px;font-size:1.8rem;font-weight:600}.certificates-header p{color:#6b7280;margin:0;font-size:1rem}.certificates-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;display:grid}.certificate-card{background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:24px}.certificate-header{align-items:center;gap:15px;margin-bottom:20px;display:flex}.certificate-header i{color:#f59e0b;font-size:32px}.certificate-header h3{color:#1f2937;margin:0 0 5px;font-size:1.1rem;font-weight:600}.certificate-id{color:#6b7280;margin:0;font-size:.85rem}.certificate-details{margin-bottom:20px}.detail-item{border-bottom:1px solid #f3f4f6;justify-content:space-between;align-items:center;padding:12px 0;display:flex}.detail-item:last-child{border-bottom:none}.detail-item .label{color:#6b7280;font-size:.9rem}.detail-item .value{color:#1f2937;font-size:.9rem;font-weight:500}.verified{color:#10b981;align-items:center;gap:5px;display:flex}.certificate-actions{gap:10px;display:flex}.btn-download,.btn-share{cursor:pointer;border:none;border-radius:8px;flex:1;justify-content:center;align-items:center;gap:8px;padding:10px 16px;font-size:.9rem;font-weight:500;transition:all .2s;display:flex}.btn-download{color:#fff;background:#3b82f6}.btn-download:hover{background:#2563eb}.btn-share{color:#4b5563;background:#f3f4f6}.btn-share:hover{background:#e5e7eb}.settings-tab .settings-header{margin-bottom:24px}.settings-header h2{color:#1e293b;margin:0 0 8px;font-size:1.8rem;font-weight:600}.settings-header p{color:#6b7280;margin:0;font-size:1rem}.settings-sections{flex-direction:column;gap:24px;display:flex}.settings-section{background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:24px}.settings-section h3{color:#1f2937;margin-bottom:20px;font-size:1.3rem;font-weight:600}.setting-item{border-bottom:1px solid #e5e7eb;justify-content:space-between;align-items:center;padding:20px 0;display:flex}.setting-item:last-child{border-bottom:none;padding-bottom:0}.setting-info h4{color:#1f2937;margin:0 0 5px;font-size:1rem;font-weight:600}.setting-info p{color:#6b7280;max-width:500px;margin:0;font-size:.9rem}.setting-value{align-items:center;gap:20px;display:flex}.btn-change{color:#4b5563;cursor:pointer;background:#fff;border:1px solid #d1d5db;border-radius:6px;padding:8px 16px;font-size:.9rem;font-weight:500;transition:all .2s}.btn-change:hover{color:#3b82f6;border-color:#3b82f6}.toggle-switch{width:50px;height:26px;display:inline-block;position:relative}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{cursor:pointer;background-color:#d1d5db;border-radius:34px;transition:all .4s;position:absolute;inset:0}.toggle-slider:before{content:"";background-color:#fff;border-radius:50%;width:18px;height:18px;transition:all .4s;position:absolute;bottom:4px;left:4px}input:checked+.toggle-slider{background-color:#3b82f6}input:checked+.toggle-slider:before{transform:translate(24px)}.danger-zone{border:2px solid #fca5a5}.btn-danger{color:#fff;cursor:pointer;background:#ef4444;border:none;border-radius:8px;padding:10px 20px;font-size:.95rem;font-weight:500;transition:all .2s}.btn-danger:hover{background:#dc2626}.profile-auth-required,.loading-container{background:#f8fafc;justify-content:center;align-items:center;min-height:100vh;display:flex}.auth-message,.loader{text-align:center;background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:40px}.auth-message h2{color:#1f2937;margin-bottom:10px;font-size:1.8rem}.auth-message p{color:#6b7280;margin-bottom:20px}.login-btn{color:#fff;cursor:pointer;background:#3b82f6;border:none;border-radius:10px;padding:12px 30px;font-size:1rem;font-weight:500;transition:all .2s}.login-btn:hover{background:#2563eb;transform:translateY(-2px)}.loader .spinner{border:4px solid #f3f4f6;border-top-color:#3b82f6;border-radius:50%;width:50px;height:50px;margin:0 auto 20px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width:768px){.profile-header{padding:40px 0 30px}.profile-header h1{font-size:2rem}.courses-header,.settings-header,.certificates-header{flex-direction:column;gap:20px}.courses-stats{gap:20px}.courses-grid,.certificates-grid{grid-template-columns:1fr}.profile-tabs{flex-wrap:wrap}.tab-btn{flex:1 0 50%;padding:15px}.tab-content{padding:20px}}@media (max-width:480px){.profile-card{padding:20px}.avatar-wrapper{width:120px;height:120px}.stats-grid{grid-template-columns:1fr}.setting-item{flex-direction:column;align-items:flex-start;gap:15px}.setting-value{justify-content:flex-start;width:100%}}
