@import"https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap";.app{height:100vh;width:100vw;overflow-x:hidden;overflow-y:auto;display:flex;flex-direction:column;justify-content:space-between;align-items:center;gap:50px;padding-top:100px}.navigation{width:100%;min-height:64px;background-color:tomato;display:flex;justify-content:space-between;align-items:center;padding-inline:5px;position:fixed;top:0;left:0;right:0;z-index:999;box-shadow:0 4px 8px #0000001a}.logo{height:80%;width:auto;padding:5px 20px 5px 10px;background-color:#fff;color:tomato;font-size:1.5rem;text-decoration:none;text-align:center;border-radius:0 50px 0 0;display:flex;justify-content:center;align-items:center}.nav-items{width:70%;height:80%;display:flex;justify-content:flex-end;align-items:center;padding-right:20px}.profile-logo{text-align:center;text-decoration:none;font-size:1rem;border-radius:10px;border:1px solid white;cursor:pointer;transition:background-color .3s ease-in-out;display:flex;justify-content:center;align-items:center;padding:8px;color:#fff;font-size:2rem}@media (max-width: 768px){.nav-items{width:100%;padding-right:6px}.logo{width:auto;padding:5px 20px 5px 10px}.profile-logo{font-size:1.5rem}}.signup{width:100%;max-width:400px;height:auto;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#fff;border-radius:10px;box-shadow:0 8px 16px #0000001a;padding:40px;margin:20px auto}.signup h2{color:tomato;font-size:2rem;margin-bottom:20px}.custom-file-input-label{display:inline-block;position:relative;cursor:pointer;padding:10px;border-radius:8px;background-color:#f5f5f5;transition:background-color .3s ease;color:gray}.photo{color:#333;height:40px;padding:10px;border:none;outline:none;width:100%}.signupBtn{width:100%;height:40px;background-color:tomato;color:#fff;padding:10px;border:none;font-size:1rem;border-radius:20px;cursor:pointer;font-weight:700;transition:background-color .3s ease}.signupBtn:hover{background-color:#ee5236}.go-to-login{text-align:center;width:30%;margin:20px auto;color:tomato;font-size:1rem;cursor:pointer;font-weight:700;text-decoration:none;padding-bottom:5px;border-bottom:1px solid tomato}.otp-container{width:100%;min-height:400px;display:flex;justify-content:center;align-items:center;gap:20px}.otp-form{width:60%;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#fff;padding:20px;border-radius:10px;box-shadow:0 0 10px #0000001a}input{padding:10px;border:1px solid #ccc;border-radius:5px;outline:none;width:100%;margin-bottom:15px}.verify-btn{width:100%;background-color:tomato;color:#fff;padding:10px;border:none;font-size:1rem;border-radius:5px;cursor:pointer;font-weight:700;transition:background-color .3s ease}.verify-btn:hover{background-color:tomato}.login{width:100%;max-width:400px;height:auto;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#fff;border-radius:10px;box-shadow:0 8px 16px #0000001a;padding:40px;margin:20px auto}.login h2{color:tomato;font-size:2rem;margin-bottom:20px}form{width:100%;height:auto;display:flex;flex-direction:column;gap:16px}input{height:40px;padding:10px;border:none;outline:none;width:100%;border-radius:8px;background-color:#f5f5f5;transition:background-color .3s ease}input:focus{background-color:#e0e0e0}.loginBtn{width:100%;height:40px;background-color:tomato;color:#fff;padding:10px;border:none;font-size:1rem;border-radius:20px;cursor:pointer;font-weight:700;transition:background-color .3s ease}.loginBtn:hover{background-color:#ee5236}.go-to-signup{text-align:center;width:30%;margin:20px auto;color:tomato;font-size:1rem;cursor:pointer;font-weight:700;text-decoration:none;padding-bottom:5px;border-bottom:1px solid tomato}.forgot-password{text-decoration:none;text-align:right;color:tomato}.forgotPassword{width:100%;max-width:400px;height:auto;display:flex;flex-direction:column;justify-content:center;gap:25px;align-items:center;background-color:#fff;border-radius:10px;box-shadow:0 8px 16px #0000001a;padding:40px;margin:20px auto}.forgotPassword h2{color:tomato;font-size:1.5rem;margin-bottom:20px}.forgotPassword form{width:100%;height:auto;display:flex;flex-direction:column;gap:25px}.forgotPassword form input{height:40px;padding:10px;border:none;outline:none;width:100%;border-radius:8px;background-color:#f5f5f5;transition:background-color .3s ease}.forgotPassword form input:focus{background-color:#e0e0e0}.sendOtpBtn,.verifyBtn,.confirmBtn{width:100%;height:40px;background-color:tomato;color:#fff;padding:10px;border:none;font-size:1rem;border-radius:20px;cursor:pointer;font-weight:700;transition:background-color .3s ease}.confirmBtn:hover{background-color:#ee5236}.home{width:100%;height:auto;background-color:#f5f5f5;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;gap:50px;background-color:#fff;position:relative}.top50{width:100%;display:grid;grid-template-columns:repeat(1,1fr);justify-items:center;align-items:center;row-gap:80px;column-gap:20px}.loader{margin:0 auto;width:50px;aspect-ratio:1;display:grid;border-radius:50%;background:linear-gradient(0deg,#0000007f 30%,#0000 0,#0000 70%,#000 0) 50%/8% 100%,linear-gradient(90deg,#00000040 30%,#0000 0,#0000 70%,#000000bf 0) 50%/100% 8%;background-repeat:no-repeat;animation:l23 1s infinite steps(12)}.loader:before,.loader:after{content:"";grid-area:1/1;border-radius:50%;background:inherit;opacity:.915;transform:rotate(30deg)}.loader:after{opacity:.83;transform:rotate(60deg)}@keyframes l23{to{transform:rotate(1turn)}}.global-post{width:95%;max-width:650px;height:auto;display:flex;flex-direction:column;justify-content:center;gap:20px;align-items:center;border-radius:10px;overflow:hidden;border:1px solid #ddd;background-color:#fff;box-shadow:0 2px 4px #0000001a;padding-bottom:20px;position:relative;border:1px solid tomato}.ud{width:100%;display:flex;justify-content:space-between;align-items:center;background-color:tomato;padding:10px;border-top-left-radius:10px;border-top-right-radius:10px}.g-photo-name{display:flex;gap:8px;align-items:center;width:50%;text-decoration:none}.g-photo{height:50px;width:50px;border-radius:50%;object-fit:cover}.g-username{font-weight:700;margin:0;font-size:.8rem;color:#fff;padding:5px;width:auto;cursor:pointer}.g-date{color:#fff;font-weight:700;margin:0;font-size:.8rem}.g-content{width:100%;color:#333;font-size:1rem;text-align:left;margin:0;padding:10px}.g-username{text-decoration:none}.g-likes,.g-like-btn{display:flex;justify-content:center;align-items:center;background-color:tomato;color:#fff;font-size:1rem;font-weight:700;height:30px;width:30px;border-radius:50%;position:absolute}.g-likes{bottom:70px;left:10px}.g-like-btn{bottom:30px;left:10px}.g-img{height:360px;width:auto;object-fit:cover;border-bottom-left-radius:10px;border-bottom-right-radius:10px;box-shadow:0 2px 4px #0000001a}.clicked{font-size:2rem;position:fixed;top:20px;left:150px;z-index:9000;color:#fff}.user-list{height:auto;width:auto;display:flex;flex-direction:column;align-items:flex-start;gap:20px;padding:40px 20px;background-color:tomato;position:fixed;left:10px;top:100px;border-radius:40px;z-index:999}.user-card{height:50px;width:50px;border-radius:50%;position:relative}.user-photo{width:100%;height:100%;border-radius:50%;object-fit:cover}.online-sign{position:absolute;top:-2px;right:-2px;background-color:#adff2f;height:15px;width:15px;border-radius:50%;border:2px solid #fff}.user-name{font-weight:700;color:#fff;text-align:center}@media screen and (max-width:600px){.user-list{height:100vh;width:100vw;border-radius:0;left:0;top:0;background-color:#fff}}.creator{width:100%;max-width:400px;background-color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:20px;border-radius:20px;box-shadow:0 0 10px #0000001a}form{width:100%;display:flex;flex-direction:column;gap:20px}.input-field{width:100%;padding:10px;border:none;border-radius:8px;outline:none}textarea{font-size:16px;resize:none;padding:10px;border:none;border-radius:8px;outline:none;min-height:50px;max-height:100px}.file-upload{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;font-size:16px}.input-file{display:none}.file-input-container{display:flex;align-items:center;gap:8px;cursor:pointer;padding:10px;background-color:#f1f1f1;border-radius:8px;width:100%}.file-text{font-size:16px;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.image-preview{margin-top:10px;width:100%;text-align:center}.image-preview img{max-width:100%;max-height:200px;border-radius:8px;margin-top:10px}.btn{width:100%;height:42px;background-color:tomato;color:#fff;padding:8px;border:none;font-size:1rem;border-radius:20px;cursor:pointer;font-weight:700;transition:all .2s ease-in-out}.btn:hover{background-color:tomato}.error-container{display:flex;align-items:center;justify-content:center;height:100vh}.error-content{text-align:center;padding:20px;border:2px solid tomato;border-radius:8px;background-color:#fff}.error-message{font-size:16px;color:tomato}.my-profile{width:100%;max-width:1200px;margin:0 auto;display:flex;flex-direction:column;justify-content:space-between;align-items:stretch;padding:20px;gap:20px;border-radius:15px}.photo-changer{display:flex;flex-direction:column;align-items:center;gap:20px;font-size:16px;width:100%;max-width:340px;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:99;background-color:tomato;padding:20px;border-radius:10px}.custom-file-input-label{display:inline-block;position:relative;cursor:pointer;padding:10px;border-radius:8px;background-color:#f5f5f5;transition:background-color .3s ease;color:gray;width:100%}.custom-file-input-label input{position:absolute;top:0;left:0;opacity:0}.selector{color:#333;height:40px;padding:10px;border:none;outline:none;width:100%}.close-btn-container{width:100%;text-align:right}.close-btn{font-size:1.8rem;color:tomato;background-color:#fff;font-weight:900;cursor:pointer}.change-button{width:AUTO;padding:10px;border:none;background-color:#fff;border-radius:8px;color:tomato;font-weight:700;font-size:1rem;cursor:pointer}.user{width:100%;max-width:1200px;height:auto;margin:0 auto;background-color:#fff;display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:25px;padding:20px 20px 80px;box-shadow:0 0 20px #0000004d;position:relative;border-radius:15px}.my-bio{width:100%;padding:15px;background-color:#161718;color:#fff;text-align:left;position:absolute;bottom:0;left:0;right:0;border-radius:0 0 15px 15px}.photo-box{width:120px;height:120px;border-radius:50%;position:relative}.change-photo{position:absolute;bottom:0;right:0;font-size:2rem;cursor:pointer;border-radius:50%;background-color:#000;color:#fff;padding:8px;transition:background-color .3s ease-in-out}.user-info{width:100%;max-width:400px;display:flex;flex-direction:column}.my-name,.total-post{font-size:1rem;color:tomato;display:flex;justify-content:center;align-items:center;gap:8px;padding:10px;border-radius:8px;border:1px solid tomato;text-decoration:none}.edit,.create-logo,.logout{font-size:1rem;color:#fff;display:flex;justify-content:center;align-items:center;gap:8px;padding:10px;border-radius:8px;text-decoration:none}.logout{cursor:pointer}.edit,.create-logo{background-color:tomato;cursor:pointer}.logout{background-color:#000}.logout:hover,.change-photo:hover{background-color:#1b1818}.my-posts{flex:2;width:100%;max-width:1200px;margin:20px auto;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));justify-items:center;gap:20px;border-radius:15px;padding:20px;background-color:#fff;box-shadow:0 0 20px #0000001a;border:1px solid tomato}.no-posts{text-decoration:none;color:gray}@media only screen and (max-width: 1200px){.my-profile{max-width:90%}}@media only screen and (max-width: 768px){.my-posts{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}}@media only screen and (max-width: 600px){.my-profile,.my-posts{padding:10px}.user-info{max-width:100%}.my-name,.total-post,.edit,.create-logo,.logout{width:auto}}.post{width:100%;max-width:350px;background-color:#fff;display:flex;flex-direction:column;justify-content:space-around;align-items:center;border-radius:10px;position:relative;padding:20px;box-shadow:0 0 8px #0000001a;transition:transform .2s ease-in-out}.remove-post{position:absolute;top:10px;right:10px;cursor:pointer;color:tomato;font-size:2rem}form{max-width:300px;margin:0 auto}h2{color:tomato;font-size:1.5rem;margin-bottom:20px;text-align:center}input{width:100%;padding:10px;margin:8px 0;box-sizing:border-box}.required-message{color:#708090;text-decoration:underline;font-size:.9rem;margin-top:8px;text-align:center}button{background-color:tomato;color:#fff;padding:10px 15px;border:none;border-radius:4px;cursor:pointer;width:100%}.update-btn:hover{background-color:tomato}.user-data{width:100%;height:auto;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;gap:50px;background-color:#fff}.profile{width:100%;max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:20px;align-items:center;padding:20px}.users{width:100%;max-width:1200px;height:auto;margin:0 auto;background-color:#fff;display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:15px;padding:20px 20px 80px;box-shadow:0 0 20px #0000004d;position:relative;border-radius:15px}.bio{width:100%;padding:15px;background-color:#0e0f16;color:#fff;text-align:left;position:absolute;bottom:0;left:0;right:0;border-radius:0 0 15px 15px}.photo-box{position:relative;width:100px;height:100px;border-radius:50%}.avatar{width:100%;height:100%;object-fit:cover;border-radius:50%}.user-info{flex:1;display:flex;flex-direction:column}.name,.posts-length{font-size:1rem;color:tomato;display:flex;justify-content:center;align-items:center;gap:8px;padding:10px;border-radius:8px;border:1px solid tomato;text-decoration:none}.posts{flex:2;width:100%;max-width:1200px;margin:20px auto;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));justify-items:center;gap:20px;border-radius:15px;padding:20px;background-color:#fff;box-shadow:0 0 20px #0000001a;border:1px solid tomato}.no-posts-found{width:100%;text-align:center;color:#000;font-size:1.2rem;text-decoration:underline}@media screen and (min-width:560px){.users{flex-direction:row;align-items:center}}.user-post{width:100%;max-width:300px;background-color:#fff;display:flex;flex-direction:column;justify-content:space-around;align-items:center;border-radius:10px;position:relative;padding:20px;box-shadow:0 0 8px #0000001a;transition:transform .2s ease-in-out}.user-post:hover{transform:scale(1.03)}.date,.username,.title,.content{width:100%;text-align:left;color:#333;font-size:1rem;margin-bottom:10px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.date{margin-top:5px}.username{font-weight:700}.img{width:100%;height:200px;object-fit:cover;border-radius:10px}.likes{display:flex;justify-content:center;align-items:center;background-color:#000;color:#fff;height:30px;width:30px;border-radius:50%;position:absolute;bottom:10px;right:10px}.footer{width:100%;background-color:#0e0f16;color:#fff;padding:20px;text-align:center}hr{height:1px;padding-block:2px;background-color:#fff;border:none}.footer-content{max-width:1200px;height:200px;margin:0 auto;display:flex;justify-content:space-between;align-items:center}.footer-section{width:40%;height:80%;display:flex;align-items:center;gap:10px}.email{justify-content:center}.links{justify-content:space-evenly}.link{font-size:1.5rem;color:#fff;transition:color .3s ease}.fb:hover{color:#1877f2}.wa:hover{color:#25d366}.it:hover{color:#e4405f}.tt:hover{color:#1da1f2}.ld:hover{color:#0077b5}.gh:hover{color:#171515}.lc:hover{color:#ffa116}.footer-section p{font-size:1rem;color:#aaa;display:flex;align-items:center}.social-icons{display:flex;gap:20px;margin-top:10px}.footer-bottom{margin-top:20px;font-size:.9rem;color:#aaa}@media (max-width: 840px){.footer-content{flex-direction:column}}*{margin:0;padding:0;box-sizing:border-box;font-family:Roboto Mono,monospace}.error{display:flex;justify-content:center;align-items:center;background-color:#1e1212;height:10%;width:30%;border-radius:20px}.error-title{color:#fff}.active{background-color:#333;color:#fff;border:none}