.notifications-page{background-color:var(--bg-color);min-height:100vh;padding:20px 20px 80px}.notifications-page h2{color:var(--text-color);text-align:center;margin-bottom:25px;font-size:28px;font-weight:700}.notifications-loading{flex-direction:column;justify-content:center;align-items:center;gap:20px;min-height:60vh;display:flex}.loading-spinner{border:4px solid var(--border-color);border-top-color:var(--accent-color);border-radius:50%;width:50px;height:50px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.notifications-loading p{color:var(--text-color);opacity:.7;font-size:16px}.notifications-login-required{text-align:center;flex-direction:column;justify-content:center;align-items:center;max-width:400px;min-height:70vh;margin:0 auto;padding:30px 20px;display:flex}.login-required-icon{margin-bottom:30px;position:relative}.bell-icon{font-size:80px;animation:2s ease-in-out infinite bellShake;display:block}@keyframes bellShake{0%,to{transform:rotate(0)}10%,30%{transform:rotate(-10deg)}20%,40%{transform:rotate(10deg)}50%{transform:rotate(0)}}.lock-icon{background:var(--card-bg-color);border-radius:50%;padding:8px;font-size:30px;position:absolute;bottom:-5px;right:-5px;box-shadow:0 4px 12px #00000026}.notifications-login-required h2{color:var(--text-color);background:linear-gradient(135deg,var(--accent-color),#ff6b6b);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:12px;font-size:28px;font-weight:700}.login-subtitle{color:var(--text-color);opacity:.7;max-width:300px;margin-bottom:30px;font-size:16px;line-height:1.6}.login-features{flex-direction:column;gap:16px;width:100%;max-width:280px;margin-bottom:35px;display:flex}.feature-item{background:var(--card-bg-color);border-radius:12px;align-items:center;gap:14px;padding:14px 18px;transition:transform .2s,box-shadow .2s;display:flex;box-shadow:0 2px 8px #00000014}.feature-item:hover{transform:translateY(-2px);box-shadow:0 4px 15px #0000001f}.feature-icon{font-size:24px}.feature-item span:last-child{color:var(--text-color);font-size:15px;font-weight:500}.login-cta-btn{color:#fff;background:linear-gradient(135deg,var(--accent-color),#ff6b6b);cursor:pointer;border:none;border-radius:14px;width:100%;max-width:280px;padding:16px 32px;font-size:17px;font-weight:600;transition:all .3s;box-shadow:0 4px 15px #ff6b6b66}.login-cta-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #ff6b6b80}.login-cta-btn:active{transform:translateY(0)}.signup-prompt{color:var(--text-color);opacity:.6;margin-top:20px;font-size:14px}.signup-link{color:var(--accent-color);cursor:pointer;font-weight:600;transition:opacity .2s}.signup-link:hover{opacity:.8;text-decoration:underline}.notifications-error{text-align:center;flex-direction:column;justify-content:center;align-items:center;max-width:400px;min-height:60vh;margin:0 auto;padding:30px 20px;display:flex}.error-icon{margin-bottom:20px;font-size:60px}.notifications-error h3{color:var(--text-color);margin-bottom:10px;font-size:22px}.notifications-error p{color:var(--text-color);opacity:.7;margin-bottom:25px;font-size:15px}.retry-btn{color:#fff;background:var(--accent-color);cursor:pointer;border:none;border-radius:10px;padding:12px 30px;font-size:15px;font-weight:600;transition:all .2s}.retry-btn:hover{opacity:.9;transform:translateY(-1px)}.notifications-empty{text-align:center;flex-direction:column;justify-content:center;align-items:center;max-width:350px;margin:0 auto;padding:60px 20px;display:flex}.empty-icon{opacity:.5;margin-bottom:20px;font-size:70px}.notifications-empty h3{color:var(--text-color);margin-bottom:10px;font-size:22px}.notifications-empty p{color:var(--text-color);opacity:.6;font-size:15px;line-height:1.5}.notifications-list{background-color:var(--card-bg-color);border-radius:16px;max-width:600px;margin:0 auto;padding:0;list-style:none;overflow:hidden;box-shadow:0 4px 20px #0000001a}.notification-item{border-bottom:1px solid var(--border-color);cursor:pointer;align-items:center;padding:16px 20px;transition:background-color .2s;display:flex;position:relative}.notification-item:last-child{border-bottom:none}.notification-item.unread{background:linear-gradient(90deg,rgba(var(--accent-color-rgb,255,107,107),.08)0%,transparent 100%)}.notification-item:hover{background-color:var(--border-color)}.notification-icon-wrapper{flex-shrink:0;margin-right:15px;position:relative}.notification-avatar{object-fit:cover;border:2px solid var(--border-color);border-radius:50%;width:50px;height:50px}.notification-avatar-placeholder{background:linear-gradient(135deg,var(--card-bg-color),var(--border-color));border:2px solid var(--border-color);border-radius:50%;justify-content:center;align-items:center;width:50px;height:50px;font-size:24px;display:flex}.notification-type-badge{background:var(--card-bg-color);border-radius:50%;padding:4px;font-size:14px;line-height:1;position:absolute;bottom:-2px;right:-2px;box-shadow:0 2px 6px #00000026}.notification-content{flex-grow:1;min-width:0}.notification-content p{color:var(--text-color);margin:0 0 4px;font-size:15px;line-height:1.4}.notification-content strong{color:var(--accent-color);font-weight:600}.notification-time{color:var(--text-color);opacity:.5;font-size:12px}.unread-dot{background:var(--accent-color);border-radius:50%;flex-shrink:0;width:10px;height:10px;margin-left:10px;animation:2s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.9)}}@media (max-width:600px){.notifications-page{padding:15px 15px 80px}.notifications-page h2{margin-bottom:20px;font-size:24px}.notifications-login-required h2{font-size:24px}.bell-icon{font-size:60px}.lock-icon{padding:6px;font-size:24px}.login-subtitle{font-size:14px}.feature-item{padding:12px 14px}.feature-icon{font-size:20px}.feature-item span:last-child{font-size:14px}.login-cta-btn{padding:14px 28px;font-size:16px}.notification-item{padding:14px 16px}.notification-avatar,.notification-avatar-placeholder{width:44px;height:44px}.notification-content p{font-size:14px}.notification-time{font-size:11px}}