@import"https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;700&display=swap";.navbar{display:flex;justify-content:space-between;align-items:center;padding:.5rem 2rem;background-color:#fff;border-bottom:1px solid #e2e8f0;position:fixed;top:5px;left:18px;right:18px;border-radius:15px;height:60px;z-index:100;box-shadow:0 2px 5px #0000000d;border:1px solid blue}.navbar-left{display:flex;align-items:center}.navbar-center{flex-grow:1;display:flex;justify-content:center;margin:0 1rem;flex-basis:400px}.navbar-right{display:flex;align-items:center;gap:1rem}.navbar-logo{font-size:1.5rem;font-weight:700;color:#3b64ee;text-decoration:none;font-family:Arial,sans-serif}.nav-item{color:#3b64ee;text-decoration:none;font-size:.8rem;font-weight:500;padding:.5rem;display:flex;flex-direction:column;align-items:center;transition:all .3s ease}.nav-item:hover{color:#062899}.nav-item-icon{font-size:1.2rem;margin-bottom:.2rem}.button-like{padding:.6rem 1rem;background-color:#3b64ee;color:#fff;border:none;border-radius:20px;cursor:pointer;transition:background-color .3s ease;display:inline-block;text-align:center;text-decoration:none;font-size:.9rem;font-weight:500}.button-like:hover{background-color:#1346ed}.search-box{position:relative;width:100%}.search-box input{width:30%;padding:.5rem 1rem .5rem 2.5rem;border:1px solid #bcd5f6;border-radius:20px;background-color:#f0f2f5;font-size:.9rem;outline:none;transition:border-color .3s ease,box-shadow .3s ease}.search-icon{position:relative;left:1.5rem;top:40%;transform:translateY(-50%);color:#666}@media (max-width: 1024px){.navbar{left:10px;right:10px;padding:.5rem 1rem}.navbar-center{flex-basis:300px}.nav-item{font-size:.75rem}.nav-item-icon{font-size:1.1rem}.navbar-right{gap:.8rem}}@media (max-width: 768px){.navbar{flex-wrap:wrap;align-items:flex-start;height:auto;padding:1rem;position:static;left:0;right:0;top:0;border-radius:0}.navbar-left{width:100%;justify-content:space-between;margin-bottom:1rem}.navbar-center{order:3;width:100%;margin:0;flex-basis:auto}.navbar-right{order:2;width:100%;justify-content:space-around;gap:0}.navbar-logo{margin:0}.search-box{max-width:none}.button-like{padding:.5rem .8rem;font-size:.8rem}}@media (max-width: 480px){.navbar-right{flex-wrap:wrap;gap:.5rem;justify-content:center}.nav-item{font-size:.7rem}.nav-item span{display:none}.nav-item-icon{font-size:1.3rem}}.centered-form-container{display:flex;justify-content:center;align-items:center;min-height:100vh;padding:1.5rem;box-sizing:border-box}.login-form{width:100%;max-width:400px;background-color:#fff;padding:3rem 2.5rem;height:320px;border-radius:12px;box-shadow:0 10px 30px #0000001a;display:flex;flex-direction:column;gap:1.25rem}.login-form h2{font-size:2rem;font-weight:700;color:#1a202c;text-align:center;margin:0 0 1rem}.login-form input{width:92%;padding:1rem;font-size:1rem;border:1px solid #e2e8f0;border-radius:8px;background-color:#f7fafc;transition:border-color .3s,box-shadow .3s}.login-form input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f633}.login-form input::placeholder{color:#a0aec0}.login-form button{width:100%;padding:1rem;font-size:1.1rem;font-weight:600;color:#fff;background-color:#3b82f6;border:none;border-radius:8px;cursor:pointer;transition:background-color .3s,transform .2s}.login-form button:hover{background-color:#2563eb;transform:translateY(-2px)}.login-form button:active{transform:translateY(0)}.login-footer{text-align:center;font-size:.9rem;color:#718096}.login-footer a{color:#3b82f6;text-decoration:none;font-weight:600;transition:color .3s}.login-footer a:hover{color:#2563eb;text-decoration:underline}.form-container{display:flex;justify-content:center;align-items:center;min-height:100vh;padding:1.5rem;box-sizing:border-box}.form-container form{width:100%;max-width:400px;background-color:#fff;padding:3rem 2.5rem;border-radius:12px;box-shadow:0 10px 30px #0000001a;display:flex;flex-direction:column;gap:1.25rem}.form-container h2{font-size:2rem;font-weight:700;color:#1a202c;text-align:center;margin:0 0 1rem}.form-container input{width:90%;padding:1rem;font-size:1rem;border:1px solid #e2e8f0;border-radius:8px;background-color:#f7fafc;transition:border-color .3s,box-shadow .3s}.form-container input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f633}.form-container input::placeholder{color:#a0aec0}.form-container button{width:100%;padding:1rem;font-size:1.1rem;font-weight:600;color:#fff;background-color:#3b82f6;border:none;border-radius:8px;cursor:pointer;transition:background-color .3s,transform .2s}.form-container button:hover{background-color:#2563eb;transform:translateY(-2px)}.form-container button:active{transform:translateY(0)}.error-message{color:#e53e3e;background-color:#fff5f5;border:1px solid #fed7d7;padding:1rem;border-radius:8px;text-align:center;font-size:.9rem;margin:.5rem 0}.post-card{background-color:#fff;border-radius:12px;box-shadow:0 1px 3px #0000001f,0 1px 2px #0000003d;margin-bottom:1.5rem;overflow:hidden;transition:box-shadow .2s ease-in-out;border:1px solid #e0e0e0}.post-card:hover{box-shadow:0 4px 12px #00000026}.post-header-top{display:flex;align-items:center;gap:1rem;padding:1rem 1.5rem;background-color:#f0f2f5;border-bottom:1px solid #e0e0e0}.post-avatar{width:50px;height:50px;border-radius:50%;object-fit:cover;border:2px solid #ddd}.user-info{display:flex;flex-direction:row;align-items:center;flex-grow:1;gap:.75rem}.post-username{font-weight:600;color:#000;font-size:1.1rem;text-decoration:none;text-transform:capitalize;transition:color .2s}.post-username:hover{color:#0a66c2;text-decoration:underline}.post-timestamp{color:#65676b;font-size:.85rem;margin-left:auto}.follow-btn{background-color:#0077b5;color:#fff;border:none;border-radius:20px;padding:.5rem 1rem;font-weight:600;cursor:pointer;font-size:.9rem;transition:background-color .2s}.follow-btn:hover{background-color:#005582}.delete-post-btn{background-color:transparent;color:#65676b;border:none;border-radius:50%;padding:.5rem;cursor:pointer;font-size:1.2rem;transition:background-color .2s,color .2s}.delete-post-btn:hover{background-color:#fcebeb;color:#e0245e}.post-content{padding:1rem 1.5rem}.post-content p{margin-top:0;margin-bottom:1rem;line-height:1.6;font-size:1.2rem;color:#111214}.post-image,.post-video{max-height:500px;width:100%;object-fit:contain;border-radius:8px;margin-top:10px}.post-actions{display:flex;justify-content:space-around;align-items:center;border-top:1px solid #e0e0e0;border-bottom:1px solid #e0e0e0;margin:0 1.5rem;padding:.5rem 0}.like-button,.comment-button{background:transparent;border:none;cursor:pointer;font-weight:600;font-size:.9rem;color:#65676b;display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:6px;transition:background-color .2s,color .2s}.like-button:hover,.comment-button:hover{background-color:#e9ecef}.post-actions .liked{color:#0077b5}.comments-section{padding:1rem 1.5rem 1.5rem;background-color:#f8f9fa}.comments-list{margin-bottom:1rem;max-height:200px;overflow-y:auto}.comments-list::-webkit-scrollbar{width:8px}.comments-list::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}.comments-list::-webkit-scrollbar-thumb{background-color:#ccc;border-radius:10px;border:2px solid #f1f1f1}.comments-list::-webkit-scrollbar-thumb:hover{background-color:#999}.comment-item{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem;padding:.5rem .75rem;background-color:#dbe4f5;border-radius:18px;font-size:.85rem;position:relative;max-width:fit-content;min-width:30%}.comment-user{font-weight:700;color:#333;white-space:nowrap}.comment-text{line-height:1.4;color:#444}.delete-comment-btn{background:none;border:none;color:#e0245e;font-size:1rem;cursor:pointer;margin-left:auto;padding:0;transition:color .2s;opacity:.7}.delete-comment-btn:hover{opacity:1;color:#c00}.comment-form{display:flex;gap:.5rem;margin-top:1rem}.comment-form input{flex-grow:1;border:1px solid #ced4da;border-radius:20px;padding:.75rem 1rem;font-size:.9rem;background-color:#fff;transition:border-color .2s ease-in-out}.comment-form input:focus{outline:none;border-color:#0077b5}.comment-form button{background-color:#0077b5;color:#fff;border:none;border-radius:20px;padding:.75rem 1.25rem;font-weight:600;cursor:pointer;transition:background-color .2s}.comment-form button:hover{background-color:#005582}@media (max-width: 768px){.post-card{margin-bottom:1rem}.post-header-top,.post-content,.post-actions,.comments-section{padding:1rem}.post-content p{font-size:1rem}.comment-item{max-width:85%}}.delete-post-btn{background-color:#e96e6e;color:#fff}body{background-color:#f0f2f5}.posts-feed-container{max-width:680px;margin:0 auto;padding:2rem 0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif}.posts-feed-container h1{text-align:center;color:#333;margin-bottom:2rem;font-size:2rem}.posts-list{display:flex;flex-direction:column;gap:1.5rem}.loading-container{display:flex;justify-content:center;align-items:center;min-height:80vh;font-family:Arial,sans-serif;color:#555;font-size:1.5rem;font-weight:700}.profile-card,.profile-card-placeholder{background-color:#dfeaff;border-radius:12px;height:340px;box-shadow:0 1px 3px #0000001f;padding:.5rem;text-align:center}.profile-header{display:flex;flex-direction:column;align-items:center;gap:.5rem;margin-bottom:1rem}.profile-pic{width:76px;height:76px;border-radius:50%;object-fit:cover;border:2px solid #8c8b8b}.profile-name{font-weight:300;margin:0;color:#fff;font-size:x-small;text-transform:capitalize}.profile-bio{color:#fffdfd;font-size:.7rem}.profile-stats{display:flex;justify-content:space-around;gap:.5rem}.stat-item{display:flex;flex-direction:column}.stat-number{font-size:small;font-weight:400;color:#fff}.stat-label{font-size:.3rem;color:#fffbfb}.create-post-card{background-color:#4e83ff;border-radius:12px;box-shadow:0 1px 3px #0000001f;padding:1rem}.create-post-card h3{margin-top:0;margin-bottom:1.5rem;color:#333;text-align:center}.post-form textarea{width:90%;height:40px;padding:1rem;border:1px solid #ccc;border-radius:8px;resize:none;font-size:1rem;margin-bottom:1rem}.form-actions{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap}.file-upload-label{background-color:#429ffc;color:#333;padding:.75rem 1.5rem;border-radius:20px;cursor:pointer;font-weight:200;transition:background-color .2s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:60%}.file-upload-label:hover{background-color:#ced4da}.file-upload-label input{display:none}.post-form button{background-color:#0077b5;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:20px;font-weight:600;cursor:pointer;transition:background-color .2s}.post-form button:hover{background-color:#005582}.dashboard-container{display:grid;grid-template-columns:350px 1fr;gap:2rem;padding:1.5rem 2rem 0;max-width:1200px;margin:0 auto;height:calc(100vh - 60px);overflow-y:hidden}.left-column{position:relative;height:100%}.left-column-inner{position:sticky;top:1.5rem;display:flex;flex-direction:column;gap:1.5rem;padding-top:1.5rem}.right-column{overflow-y:auto;padding-bottom:2rem;height:100%}.right-column::-webkit-scrollbar{display:none;width:0}@media (max-width: 768px){.dashboard-container{grid-template-columns:1fr;padding:1rem;height:auto;overflow-y:visible}.left-column,.left-column-inner{position:static;padding-top:0}.right-column{overflow-y:visible;height:auto}}.profile-page-container{max-width:800px;margin:2rem auto;padding:2rem;background-color:#e3dddd;border-radius:10px;box-shadow:0 4px 8px #0000001a;font-family:Arial,sans-serif;border:1px solid gray}.profile-header{text-align:center;margin-bottom:2rem;background-color:#91c7f7;padding:20px;border-radius:18px}.profile-avatar-lg{width:150px;height:150px;border-radius:50%;object-fit:cover;border:3px solid #337ab7;box-shadow:0 0 10px #0000001a;margin-bottom:1rem}.profile-name{font-size:2.5rem;color:#333;margin:0}.profile-bio{font-size:1rem;color:#777;margin-top:.5rem;line-height:1.5;max-width:600px;margin-left:auto;margin-right:auto}.profile-stats{display:flex;justify-content:center;gap:3rem;margin-top:1rem;padding-top:1rem;border-top:1px solid #eee}.stat-item{text-align:center}.stat-number{font-size:1.8rem;font-weight:700;color:#337ab7;display:block}.stat-label{font-size:.9rem;color:#555;text-transform:uppercase;letter-spacing:1px}.loading,.error{text-align:center;font-size:1.2rem;color:#555;margin-top:2rem}.profile-posts{margin-top:3rem}.no-posts-message{text-align:center;color:#777;font-size:1.1rem;padding-top:2rem}.edit-profile-container{max-width:600px;margin:2rem auto;padding:2rem;background-color:#fff;border-radius:10px;box-shadow:0 4px 8px #0000001a;font-family:Arial,sans-serif}.edit-profile-form h2{text-align:center;margin-bottom:2rem;color:#333}.edit-profile-form .form-group{margin-bottom:1rem}.edit-profile-form label{display:block;font-weight:700;margin-bottom:.5rem;color:#555}.edit-profile-form input,.edit-profile-form textarea{width:100%;padding:10px;border:1px solid #ccc;border-radius:5px;box-sizing:border-box;font-size:1rem}.edit-profile-form textarea{resize:vertical;min-height:100px}.edit-profile-form .button-group{display:flex;gap:1rem;margin-top:1.5rem}.edit-profile-form button{width:100%;padding:12px;color:#fff;border:none;border-radius:5px;font-size:1.1rem;cursor:pointer;transition:background-color .3s ease}.edit-profile-form button[type=submit]{background-color:#337ab7}.edit-profile-form button[type=submit]:hover{background-color:#286090}.edit-profile-form button.cancel-btn{background-color:#888}.edit-profile-form button.cancel-btn:hover{background-color:#666}.edit-profile-form button:disabled{background-color:#ccc;cursor:not-allowed}.error-message{color:#d9534f;text-align:center;margin-bottom:1rem}.edit-profile-btn{color:#000;background-color:#0091ff;padding:7px;border-radius:6px}.search-page-container{padding:30px 20px;max-width:900px;margin:0 auto;font-family:Arial,sans-serif}.search-page-container .error-message{color:#d9534f;text-align:center;font-size:1.2rem;padding:20px;background-color:#f2dede;border:1px solid #ebccd1;border-radius:5px}.search-title{font-size:2.2rem;color:#333;border-bottom:2px solid #0077b5;padding-bottom:10px;margin-bottom:30px}.search-results-section{margin-bottom:40px}.search-results-section h2{font-size:1.8rem;color:#555;margin-bottom:20px}.users-list{display:flex;flex-wrap:wrap;gap:20px;justify-content:flex-start}.user-result-card-link{text-decoration:none;color:inherit}.user-result-card{display:flex;flex-direction:column;align-items:center;text-align:center;background-color:#f9f9f9;border-radius:8px;padding:20px 15px;box-shadow:0 1px 3px #0000001a;transition:transform .2s ease,box-shadow .2s ease;width:150px}.user-result-card:hover{transform:translateY(-5px);box-shadow:0 4px 10px #00000026}.user-card-avatar{width:80px;height:80px;border-radius:50%;object-fit:cover;border:2px solid #0077b5;margin-bottom:10px}.user-card-name{font-weight:700;font-size:1rem;color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.posts-list .post-card{margin-bottom:20px}.posts-list p{text-align:center;color:#777;font-style:italic;margin-top:20px}body{margin:0;font-family:Poppins,sans-serif;background:linear-gradient(135deg,#cbdef0,#578eec)}.App{padding-top:4.5rem;text-align:center}.main-loading-container{display:flex;justify-content:center;align-items:center;min-height:100vh;background-color:#f0f2f5}.main-loading-text{font-size:2.5rem;color:#0a66c2;font-weight:700;opacity:0;animation:fadeInOut 2s ease-in-out infinite}@keyframes fadeInOut{0%{opacity:0}50%{opacity:1}to{opacity:0}}