@import"https://fonts.googleapis.com/css2?family=Grand+Hotel&display=swap";@import"https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400..700&family=Martel+Sans:wght@200;300;400;600;700;800;900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";nav{box-shadow:0 4px 12px #0000001a;height:64px;line-height:64px;position:sticky;top:0;z-index:1000}nav .nav-wrapper{background:linear-gradient(to right,#3f51b5,#5c6bc0);padding:0 20px;display:flex;align-items:center;justify-content:space-between;height:100%}.brand-logo{font-family:Grand Hotel,cursive,Roboto,sans-serif;font-size:2.2rem!important;color:#fff!important;letter-spacing:1px;position:relative!important;left:0!important;transform:none!important;display:flex!important;align-items:center!important;text-decoration:none;height:100%;line-height:normal}.brand-img1{width:40px;height:40px;object-fit:cover;margin-right:10px;border-radius:50%;border:2px solid rgba(255,255,255,.3);transition:transform .2s ease}.brand-logo:hover .brand-img{transform:scale(1.05)}.brand-text{font-size:2.2rem;font-weight:400;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.2);margin:0;line-height:1}nav ul{display:flex;align-items:center;gap:10px;margin:0;height:100%}nav ul li{margin:0 5px;transition:transform .2s ease;display:flex;align-items:center}nav ul li:hover{transform:translateY(-2px)}nav ul li a{color:#fff!important;font-weight:500;padding:8px 15px;border-radius:20px;transition:background-color .2s ease;text-transform:capitalize;letter-spacing:.5px;text-decoration:none;display:flex;align-items:center;height:auto;line-height:normal}nav ul li a:hover{background-color:#ffffff1a}nav ul li a.active{background-color:#fff3}nav .btn.logout{background:linear-gradient(45deg,#4a90e2,#357ab7)!important;border:none;border-radius:30px;padding:8px 20px;color:#fff!important;font-size:1rem;font-weight:500;letter-spacing:.5px;box-shadow:0 4px 10px #00000040;transition:background .3s ease,transform .2s ease,box-shadow .2s ease;height:auto;line-height:normal;text-transform:capitalize}nav .btn.logout:hover{background:linear-gradient(45deg,#357ab7,#4a90e2)!important;transform:translateY(-2px);box-shadow:0 6px 12px #00000059}nav .btn.logout:focus{outline:none;background:linear-gradient(45deg,#357ab7,#4a90e2)!important}nav .btn{height:auto;line-height:normal;padding:8px 16px;border-radius:20px;background-color:#e10914!important;text-transform:capitalize;font-weight:500;letter-spacing:.5px;box-shadow:0 2px 5px #0003;transition:all .2s ease;border:none;cursor:pointer;color:#fff}nav .btn:hover{background-color:#c80914!important;box-shadow:0 4px 8px #0000004d;transform:translateY(-2px)}nav .btn:focus{background-color:#f50057!important}@media screen and (max-width: 768px){nav .nav-wrapper{padding:0 10px}.brand-logo{font-size:1.8rem!important}.brand-text{font-size:1.8rem}.brand-img{width:24px;height:24px;margin-right:8px}nav ul li a{padding:6px 12px;font-size:.9rem}nav .btn{padding:6px 12px;font-size:.9rem}}@media screen and (max-width: 480px){.brand-text{font-size:1.5rem}.brand-img{width:20px;height:20px;margin-right:6px}nav ul li a{padding:5px 10px;font-size:.8rem}}nav ul li a.profile-link{display:flex;align-items:center}nav ul li a.profile-link:before{content:"";display:inline-block;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white"><path d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/></svg>');width:18px;height:18px;margin-right:5px;flex-shrink:0}nav ul li a.create-post-link:before{content:"";display:inline-block;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>');width:18px;height:18px;margin-right:5px;flex-shrink:0}nav ul li a.following-link:before{content:"";display:inline-block;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white"><path d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z"/></svg>');width:18px;height:18px;margin-right:5px;flex-shrink:0}body{background-color:#fafafa}.home-container{max-width:600px;margin:70px auto;padding:20px 15px;background-color:transparent}.home-card{margin-bottom:40px;border-radius:8px!important;box-shadow:0 4px 12px #0000001a!important;overflow:hidden;background-color:#f7f9fc;border:1px solid #e6eaf0}.home-card h5{margin:0!important;padding:15px!important;border-bottom:1px solid #e6eaf0;display:flex;align-items:center;justify-content:space-between;background-color:#f0f4fa}.home-card h5 a{color:#3f51b5;text-decoration:none;font-weight:500;transition:color .2s ease}.home-card h5 a:hover{color:#5c6bc0;text-decoration:underline}.home-card h5 i.material-icons{color:red;cursor:pointer;float:right;font-size:30px;transition:transform .2s ease}.home-card h5 i.material-icons:hover{transform:scale(1.1)}.home-card .card-image{width:100%;height:auto;max-height:500px;overflow:hidden;position:relative;background-color:#f0f0f0}.home-card .card-image img{width:100%;height:auto;display:block;transition:transform .3s ease}.home-card .card-image img:hover{transform:scale(1.02)}.home-card .card-content{padding:15px 20px!important;background-color:#f7f9fc}.home-card .card-content i.material-icons{cursor:pointer;transition:transform .2s ease;vertical-align:middle}.home-card .card-content i.material-icons[style*="color:red"]{color:#e53935!important;margin-right:10px}.home-card .card-content i.material-icons[style*="color:blue"]{color:#3f51b5!important;margin-right:10px}.home-card .card-content i.material-icons:hover{transform:scale(1.2)}.home-card .card-content h6{margin:10px 0;font-size:1rem;color:#333;font-weight:500}.home-card .card-content p{margin:10px 0 15px;color:#555;line-height:1.5}.home-card .card-content h6[style*="fontWeight: '600'"]{font-weight:600!important;margin-top:20px;margin-bottom:10px;color:#3f51b5;border-top:1px solid #e6eaf0;padding-top:15px}.home-card .card-content div[style*='display: "flex"']{display:flex!important;align-items:center!important;justify-content:space-between!important;padding:8px 0!important;border-bottom:1px solid #e6eaf0!important}.home-card .card-content div[style*="flexGrow: 1"]{flex-grow:1!important}.home-card .card-content span[style*='fontWeight: "500"']{font-weight:500!important;margin-right:10px!important;color:#3f51b5}.home-card .card-content i.material-icons[style*='fontSize: "20px"']{color:red!important;cursor:pointer!important;font-size:20px!important;transition:transform .2s ease}.home-card .card-content i.material-icons[style*='fontSize: "20px"']:hover{transform:scale(1.1)}.home-card .card-content form{margin-top:15px;position:relative}.home-card .card-content form input{width:100%;padding:12px 15px;border:1px solid #e6eaf0;border-radius:30px;font-size:.9rem;background-color:#fff;transition:border-color .3s ease,box-shadow .3s ease}.home-card .card-content form input:focus{border-color:#3f51b5;box-shadow:0 0 0 2px #3f51b533;outline:none;background-color:#fff}.home-card .card-content form input::placeholder{color:#aaa}.home-container:empty:after{content:"No posts yet. Follow some friends to see their posts here!";display:block;text-align:center;color:#888;padding:50px 20px;font-size:1.1rem;background-color:#f7f9fc;border-radius:8px;box-shadow:0 4px 12px #0000001a}@keyframes likeAnimation{0%{transform:scale(1)}50%{transform:scale(1.3)}to{transform:scale(1)}}.like-animation{animation:likeAnimation .4s ease}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:#c5cae9;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#3f51b5}@media screen and (max-width: 600px){.home-container{margin:60px auto 20px;padding:0 10px}.home-card{margin-bottom:25px}.home-card h5{font-size:1.1rem}.home-card .card-content{padding:12px 15px!important}}.login-container{max-width:400px;margin:80px auto;background-color:#fff;border-radius:8px;box-shadow:0 4px 20px #00000026;padding:30px;text-align:center}.login-card{background:transparent!important;box-shadow:none!important;padding:0}.brand-img{width:80px;height:80px;border-radius:50%;object-fit:cover;margin-bottom:20px;border:3px solid #3f51b5;box-shadow:0 4px 12px #3f51b533;transition:transform .3s ease,box-shadow .3s ease}.brand-img:hover{transform:scale(1.05);box-shadow:0 6px 16px #3f51b54d}.login-card h2{font-family:Grand Hotel,cursive,Roboto,sans-serif!important;font-size:3rem;color:#3f51b5;margin-bottom:30px;display:inline-block}.login-card input{width:100%;padding:12px 15px;margin-bottom:20px;border:1px solid #ddd;border-radius:4px;font-size:1rem;transition:border-color .3s ease,box-shadow .3s ease}.login-card input:focus{border-color:#3f51b5;box-shadow:0 0 0 2px #3f51b533;outline:none}.login-card button.btn{background:linear-gradient(to right,#3f51b5,#5c6bc0)!important;width:100%;border:none;border-radius:30px;padding:12px 0;color:#fff;font-size:1.1rem;font-weight:500;letter-spacing:.5px;margin:15px 0;box-shadow:0 4px 10px #00000040;transition:all .3s ease;cursor:pointer;text-transform:none;height:auto;line-height:normal}.login-card button.btn:hover{background:linear-gradient(to right,#354497,#4a57a1)!important;transform:translateY(-2px);box-shadow:0 6px 12px #00000059}.login-card button.btn:focus{outline:none}.login-card h6{margin-top:25px;font-weight:400;font-size:.95rem}.login-card h6 a{color:#3f51b5;text-decoration:none;font-weight:500;transition:color .2s ease}.login-card h6 a:hover{color:#5c6bc0;text-decoration:underline}.forgot-password{display:block;text-align:right;margin-top:-15px;margin-bottom:20px;font-size:.85rem}.forgot-password a{color:#777;text-decoration:none;transition:color .2s ease}.forgot-password a:hover{color:#3f51b5;text-decoration:underline}.divider-text{position:relative;text-align:center;margin:25px 0;color:#777}.divider-text:before,.divider-text:after{content:"";position:absolute;top:50%;width:40%;height:1px;background-color:#ddd}.divider-text:before{left:0}.divider-text:after{right:0}.social-login{margin-top:10px}.btn-social{display:flex;align-items:center;justify-content:center;width:100%;padding:10px 0;margin-bottom:10px;border-radius:4px;font-weight:500;cursor:pointer;transition:all .2s ease;color:#555;background-color:transparent;border:1px solid #ddd}.btn-social:hover{background-color:#f5f5f5;transform:translateY(-2px);box-shadow:0 2px 5px #0000001a}.btn-social i{margin-right:10px}@media screen and (max-width: 480px){.login-container{margin:40px 15px;padding:20px 15px}.login-card h2{font-size:2.5rem}.login-card button.btn{font-size:1rem;padding:10px 0}.brand-img{width:70px;height:70px}}.login-card button.btn.loading{background:linear-gradient(to right,#bbb,#ddd)!important;cursor:not-allowed;position:relative}.login-card button.btn.loading:after{content:"";display:inline-block;width:20px;height:20px;margin-left:10px;border:2px solid rgba(255,255,255,.3);border-radius:50%;border-top-color:#fff;animation:spin 1s ease-in-out infinite;vertical-align:middle}.signup-container{max-width:450px;margin:80px auto;background-color:#fff;border-radius:8px;box-shadow:0 4px 20px #00000026;padding:30px;text-align:center}.signup-header{margin-bottom:30px}.signup-brand-img{width:80px;height:80px;border-radius:50%;object-fit:cover;margin-bottom:20px;border:3px solid #3f51b5;box-shadow:0 4px 12px #3f51b533;transition:transform .3s ease,box-shadow .3s ease}.signup-brand-img:hover{transform:scale(1.05);box-shadow:0 6px 16px #3f51b54d}.signup-logo{font-family:Grand Hotel,cursive,Roboto,sans-serif;font-size:3rem;color:#3f51b5;margin-bottom:10px;display:inline-block}.signup-subtitle{color:#666;font-size:1.1rem;margin-bottom:20px}.input-field{margin-bottom:25px;position:relative}.input-field input{width:100%;padding:12px 15px;border:1px solid #ddd;border-radius:4px;font-size:1rem;transition:border-color .3s ease,box-shadow .3s ease}.input-field input:focus{border-color:#3f51b5;box-shadow:0 0 0 2px #3f51b533;outline:none}.input-field label{position:absolute;top:-10px;left:10px;background:#fff;padding:0 5px;font-size:.85rem;color:#666;transition:color .3s ease}.input-field input:focus+label{color:#3f51b5}.error-text{color:#f44336;font-size:.85rem;text-align:left;margin-top:5px;display:block;opacity:0;transition:opacity .3s ease}.input-field.error input{border-color:#f44336}.input-field.error .error-text{opacity:1}.profile-upload-container{margin-bottom:25px;position:relative}.profile-preview{width:100px;height:100px;margin:0 auto 15px;border-radius:50%;overflow:hidden;border:3px solid #3f51b5;box-shadow:0 4px 8px #0003}.profile-preview img{width:100%;height:100%;object-fit:cover}.profile-upload .upload-btn{background:linear-gradient(to right,#3f51b5,#5c6bc0);border:none;border-radius:30px;color:#fff;font-weight:500;letter-spacing:.5px;box-shadow:0 4px 10px #00000040;transition:all .3s ease;cursor:pointer;height:auto;line-height:normal;padding:10px 20px;display:flex;align-items:center;justify-content:center}.profile-upload .upload-btn:hover{background:linear-gradient(to right,#354497,#4a57a1);transform:translateY(-2px);box-shadow:0 6px 12px #00000059}.profile-upload input[type=file]{cursor:pointer}.profile-upload .file-path-wrapper{margin-top:10px}.profile-upload .file-path{border:1px solid #ddd;border-radius:4px;padding:8px 10px;font-size:.9rem;width:100%}.btn.signup{background:linear-gradient(to right,#3f51b5,#5c6bc0);width:100%;border:none;border-radius:30px;padding:12px 0;color:#fff;font-size:1.1rem;font-weight:500;letter-spacing:.5px;margin-top:10px;box-shadow:0 4px 10px #00000040;transition:all .3s ease;cursor:pointer;height:auto;line-height:normal}.btn.signup:hover{background:linear-gradient(to right,#354497,#4a57a1);transform:translateY(-2px);box-shadow:0 6px 12px #00000059}.btn.signup:focus{outline:none}.login-link{margin-top:25px;color:#666;font-size:.95rem}.login-link a{color:#3f51b5;text-decoration:none;font-weight:500;transition:color .2s ease}.login-link a:hover{color:#5c6bc0;text-decoration:underline}#toast-container{top:35px!important;right:25px!important;left:auto!important}.social-signup{margin-top:30px;padding-top:20px;border-top:1px solid #eee}.social-signup p{color:#777;margin-bottom:15px}.social-buttons{display:flex;justify-content:center;gap:15px}.btn-social{display:flex;align-items:center;justify-content:center;padding:10px 15px;border-radius:4px;color:#fff;font-weight:500;cursor:pointer;transition:all .2s ease}.btn-social:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0003}.btn-social.facebook{background-color:#3b5998}.btn-social.google{background-color:#db4437}.btn-social i{margin-right:8px}.password-toggle{position:absolute;right:10px;top:12px;color:#999;cursor:pointer;transition:color .2s ease}.password-toggle:hover{color:#3f51b5}.btn.signup.loading{background:linear-gradient(to right,#bbb,#ddd);cursor:not-allowed}.btn.signup.loading:after{content:"";display:inline-block;width:20px;height:20px;margin-left:10px;border:2px solid rgba(255,255,255,.3);border-radius:50%;border-top-color:#fff;animation:spin 1s ease-in-out infinite;vertical-align:middle}@keyframes spin{to{transform:rotate(360deg)}}.input-field.valid:after{content:"✓";position:absolute;right:10px;top:12px;color:#4caf50;font-weight:700}@media screen and (max-width: 480px){.signup-container{margin:40px 15px;padding:20px 15px}.signup-logo{font-size:2.5rem}.social-buttons{flex-direction:column;gap:10px}.btn-social{width:100%}.signup-brand-img{width:70px;height:70px}}h2.signup-logo{font-family:Grand Hotel,cursive!important}.main-container{max-width:650x;margin:0 auto}.profile-container{display:flex;justify-content:space-around;margin:20px 0;border-bottom:1px solid grey}.details-section{width:300px}.followings{display:flex;justify-content:space-between}.posts{display:flex;flex-wrap:wrap;justify-content:space-around}.post{width:30%}.create-post-container{max-width:650px;margin:50px auto;padding:38px 40px;border-radius:16px;box-shadow:0 10px 40px #0000001a,0 2px 10px #0000000d;background:#fff;border:none;position:relative;overflow:hidden;transition:transform .4s ease,box-shadow .4s ease}.create-post-container:before{content:"";position:absolute;top:0;left:0;width:100%;height:5px;background:linear-gradient(90deg,#1976d2,#64b5f6,#42a5f5)}.create-post-container:hover{transform:translateY(-5px);box-shadow:0 15px 50px #0000001f,0 5px 15px #00000012}.create-post-container h4{color:#1976d2;font-weight:600;text-align:center;margin-top:0;margin-bottom:30px;font-size:28px;letter-spacing:-.5px}.create-post-container input[type=text]{width:100%;padding:16px 18px;margin-bottom:24px;border:2px solid #e0e0e0;border-radius:12px;font-size:16px;font-weight:400;color:#424242;transition:all .25s ease;background-color:#fafafa;box-sizing:border-box}.create-post-container input[type=text]:focus{border-color:#1976d2;background-color:#fff;box-shadow:0 0 0 4px #1976d21a;outline:none;transform:translateY(-2px)}.create-post-container input[type=text]::placeholder{color:#9e9e9e;opacity:.8;font-weight:400}.create-post-container .file-field{margin-bottom:30px}.create-post-container .file-field .btn{height:48px;line-height:48px;padding:0 22px;text-transform:none;font-weight:500;font-size:15px;border-radius:12px;box-shadow:0 4px 10px #1976d226;background-color:#1976d2;transition:all .25s ease;letter-spacing:.3px;display:flex;align-items:center;justify-content:center}.create-post-container .file-field .btn:hover{background-color:#1565c0;box-shadow:0 6px 14px #1976d240;transform:translateY(-2px)}.create-post-container .file-field .btn span:before{content:"📷";margin-right:8px;font-size:18px}.create-post-container .file-path-wrapper{padding-left:0;padding-top:5px;width:100%}.create-post-container .file-path{height:48px;margin-bottom:0;border-radius:12px;border:2px solid #e0e0e0;background-color:#fafafa;padding:0 15px;font-size:15px;transition:all .25s ease}.create-post-container .file-path:focus{border-color:#1976d2;box-shadow:0 0 0 4px #1976d21a;background-color:#fff}.create-post-container button.btn-large{width:100%;height:56px;font-size:17px;text-transform:none;font-weight:600;border-radius:12px;background-color:#1976d2;box-shadow:0 6px 12px #1976d233;transition:all .25s ease;letter-spacing:.5px;position:relative;overflow:hidden;z-index:1}.create-post-container button.btn-large:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,#fff0,#fff3,#fff0);transition:all .6s ease;z-index:-1}.create-post-container button.btn-large:hover{background-color:#1565c0;transform:translateY(-3px);box-shadow:0 8px 20px #1976d240}.create-post-container button.btn-large:hover:before{left:100%}.create-post-container button.btn-large:active{transform:translateY(-1px);box-shadow:0 4px 10px #1976d233}.create-post-container button.btn-large:after{content:"✓";margin-right:8px;font-size:18px;opacity:0;transform:scale(0);transition:all .3s ease}.create-post-container button.btn-large:hover:after{opacity:1;transform:scale(1)}.toast{border-radius:10px;font-weight:500;box-shadow:0 8px 20px #00000026;padding:12px 22px;font-size:15px}.create-post-container.uploading{position:relative}.create-post-container.uploading:after{content:"";position:absolute;top:0;left:0;width:100%;height:5px;background:linear-gradient(90deg,#64b5f6,#1976d2);animation:loadingBar 1.5s infinite ease-in-out;z-index:10}@keyframes loadingBar{0%{width:0;left:0}50%{width:100%;left:0}to{width:0;left:100%}}.create-post-container .image-preview{margin:20px 0 30px;border-radius:12px;overflow:hidden;background-color:#f5f5f5;position:relative;box-shadow:0 4px 12px #00000014;transition:all .3s ease}.create-post-container .image-preview:hover{transform:scale(1.02);box-shadow:0 6px 16px #0000001f}.create-post-container .image-preview img{max-width:100%;max-height:320px;display:block;margin:0 auto}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.create-post-container>*{animation:fadeInUp .5s ease forwards;opacity:0}.create-post-container>*:nth-child(1){animation-delay:.1s}.create-post-container>*:nth-child(2){animation-delay:.2s}.create-post-container>*:nth-child(3){animation-delay:.3s}.create-post-container>*:nth-child(4){animation-delay:.4s}@media only screen and (max-width: 700px){.create-post-container{margin:30px 15px;padding:30px 25px;border-radius:14px}.create-post-container h4{font-size:24px;margin-bottom:25px}.create-post-container input[type=text],.create-post-container .file-path{padding:14px 16px;font-size:15px}.create-post-container .file-field .btn{height:44px;line-height:44px;font-size:14px}.create-post-container button.btn-large{height:52px;font-size:16px}}@media only screen and (max-width: 480px){.create-post-container{padding:25px 20px;margin:20px 12px}.create-post-container input[type=text],.create-post-container .file-path{padding:12px 14px;font-size:14px;border-radius:10px}.create-post-container .file-field .btn{height:40px;line-height:40px;padding:0 15px;font-size:13px;border-radius:10px}.create-post-container button.btn-large{height:48px;font-size:15px;border-radius:10px}}a{color:#000!important}.brand-logo{font-family:Martel Sans,sans-serif;font-weight:500;font-style:normal}.login-container{margin-top:35px}.login-card{padding:22px;text-align:center;max-width:500px;margin:10px auto}.input-field input:focus{border-bottom:1px solid rgb(42,39,190)!important;box-shadow:0 1px #2a27be!important}
