:root{--yellow:#f5c32c;--orange:#fca61f;--black:#242d49;--gray:#242d49a6;--profileShadow:0px 4px 17px 2px #00000040;--hrColor:#cfcdcd;--cardColor:#ffffffa3;--buttonBg:linear-gradient(98.63deg,#f9a225,#f95f35);--inputColor:#28343e12;--photo:#4cb256;--video:#4a4eb7;--location:#ef5757;--shedule:#e1ae4a}.App{background:#f3f3f3;color:var(--black);padding:1rem}.blur{background:#a6ddf0;border-radius:50%;filter:blur(72px);height:14rem;position:absolute;width:22rem}.button{align-items:center;background:var(--buttonBg);border:none;border-radius:.5rem;color:#fff;display:flex;justify-content:center;transition:all .1s ease-out}.button:hover{background:#0000;border:2px solid var(--orange);color:var(--orange);cursor:pointer}.button:disabled{background:silver;pointer-events:none}::-webkit-scrollbar{display:none}.infoForm{align-items:center;display:flex;flex-direction:column;gap:2rem;justify-content:center}.infoInput{background-color:var(--inputColor);border:none;border-radius:8px;flex:1 1;outline:none;padding:20px}.infoForm>div{display:flex;gap:1rem;height:2rem;width:90%}.infoButton{align-self:flex-end;height:2rem;width:6rem}.Post{background-color:var(--cardColor);border-radius:1rem;display:flex;flex-direction:column;gap:1rem;padding:1rem}.Post>img{border-radius:.5rem;max-height:35rem;object-fit:cover;width:100%}.postReact{align-items:flex-start;display:flex;gap:1.5rem}.Posts{flex-direction:column}.PostShare,.Posts{display:flex;gap:1rem}.PostShare{background-color:var(--cardColor);border-radius:1rem;padding:1rem}.PostShare>img{border-radius:50%;height:3rem;width:3rem}.PostShare>div{display:flex;flex-direction:column;gap:1rem;width:90%}.PostShare>div>input{background-color:var(--inputColor);border:none;border-radius:10px;font-size:17px;outline:none;padding:10px}.postOptions{display:flex;justify-content:space-around}.option{align-items:center;border-radius:10px;display:flex;font-size:12px;justify-content:center;padding:5px 10px}.option:hover{cursor:pointer}.ps-button{font-size:12px;padding:5px 20px}.previewImage{position:relative}.previewImage>svg{cursor:pointer;position:absolute;right:1rem;top:.5rem}.previewImage>img{border-radius:.5rem;max-height:20rem;object-fit:cover;width:100%}@media screen and (max-width:768px){.PostShare>img{border-radius:50%;height:3rem;width:3.5rem}}.PostSide{display:flex;flex-direction:column;gap:1rem;height:95.5vh;overflow:auto}.mobile-only{display:none}@media screen and (max-width:768px){.mobile-only{display:block}}.FollowersCard{border-radius:.7rem;display:flex;flex-direction:column;font-size:12px;gap:.65rem;height:auto;width:100%}.FollowersCard>span{align-self:center;color:#0096ff;cursor:pointer;font-weight:700}.followers-modal .mantine-Modal-modal{background-color:#fff;border-radius:12px;box-shadow:0 4px 10px #0000001a;display:flex;flex-direction:column;height:80vh;padding:20px;width:45vw}.followers-modal .mantine-Modal-close{right:20px!important;top:30px!important}.followers-list{display:flex;flex-direction:column;gap:15px;max-height:58vh;overflow-y:auto;padding-right:10px}.followers-list::-webkit-scrollbar{width:6px}.followers-list::-webkit-scrollbar-thumb{background:#ccc;border-radius:10px}.followers-list::-webkit-scrollbar-track{background:#0000}@media screen and (max-width:768px){.followers-modal .mantine-Modal-modal{border-radius:0;display:flex;flex-direction:column;height:100vh;overflow-y:hidden;padding:20px;position:fixed;width:100vw}.modal-title{font-size:1.5rem;margin-bottom:15px;text-align:center}.followers-list{gap:10px;max-height:75vh;overflow-y:auto;padding-right:5px;width:90vw}}.LogoSearch{display:flex;gap:.75rem}.Search{background-color:var(--inputColor);border-radius:10px;display:flex;padding:5px}.Search>input{background-color:initial;border:none;outline:none}.s-icon{align-items:center;background:linear-gradient(106.23deg,#0096ff,#0096ff);border-radius:5px;color:#fff;display:flex;justify-content:center;padding:4px}.ProfileCard{background-color:var(--cardColor);border-radius:1.5rem;gap:1rem;overflow-x:clip}.ProfileCard,.ProfileImages{display:flex;flex-direction:column;position:relative}.ProfileImages{align-items:center;justify-content:center}.ProfileImages>img:first-of-type{width:90%}.ProfileImages>img:nth-of-type(2){border-radius:50%;bottom:-3rem;box-shadow:var(--profileShadow);height:9rem;position:absolute;width:7rem}.ProfileName{align-items:center;display:flex;flex-direction:column;gap:2px;margin-top:2.5rem}.ProfileName>span:first-of-type{font-weight:700}.followStatus{align-items:center;display:flex;flex-direction:column;justify-content:center}.followStatus>hr{border:1px solid var(--hrColor);width:85%}.followStatus>div{gap:1rem;justify-content:space-around;width:80%}.follow,.followStatus>div{align-items:center;display:flex}.follow{flex-direction:column;gap:.4rem;justify-content:center}.follow>span:first-of-type{font-weight:700}.follow>span:nth-of-type(2){color:var(--gray);font-size:13px}.vl{border-left:2px solid var(--hrColor);height:150%}.ProfileCard>span{align-self:center;color:#0096ff;cursor:pointer;font-weight:700;margin-bottom:1rem}.ProfileSide{align-items:center;gap:1rem;overflow:auto}.ProfileSide,.RightSide{display:flex;flex-direction:column}.RightSide{gap:2rem}.navIcons{display:flex;justify-content:space-between;margin-top:1rem}.navIcons>a>img,.navIcons>img{height:1.5rem;width:1.5rem}.navIcons>img:hover{cursor:pointer}.r-button{align-self:center;height:3rem;width:80%}@media screen and (max-width:768px){.hide-in-mobile{display:none}.RightSide{gap:0;margin:0;padding:0}}.TrendCard{background-color:var(--cardColor);border-radius:1rem;gap:1rem;padding:1rem 1rem 1rem 2rem}.TrendCard,.trend{display:flex;flex-direction:column}.trend{gap:.5rem}.trend>span:first-of-type{font-weight:700}.trend>span:nth-of-type(2){font-size:13px}@media screen and (max-width:768px){.navIcons{height:25px;margin:0}}.settings-icon{color:#000;display:inline-flex;text-decoration:none}.Home{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:18rem auto 20rem;min-height:100vh;overflow-y:auto;position:relative;width:100%}.ProfileSide{display:block}.ProfileSideContainer{background:#fff;display:none;height:100vh;left:0;overflow-y:auto;padding:1rem;position:fixed;top:0;width:100%;z-index:100}.ProfileSideContainer.show{display:block}.close-btn{background:red;border:none;border-radius:50%;padding:.5rem 1rem;right:10px}.close-btn,.profile-btn{color:#fff;cursor:pointer;font-size:1rem;position:absolute;top:10px}.profile-btn{background:#007bff;border:none;border-radius:25px;box-shadow:0 4px 6px #0000001a;display:none;font-weight:700;left:50%;padding:.75rem 1.5rem;transform:translateX(-50%)}@media screen and (max-width:768px){.Home{display:flex;flex-direction:column;gap:1rem;min-height:100vh;overflow-y:auto}.profile-btn{display:block}.ProfileSide{display:none}.RightSide{order:1;width:100%}.PostSide{order:2;width:100%}.PostSide,.RightSide{min-height:auto}.ProfileSideContainer{align-items:center;display:flex;flex-direction:column;height:auto;justify-content:center;overflow-y:auto}}.Auth{gap:4rem;height:100vh;margin-top:10%;position:relative}.Auth,.Auth>div{align-items:center;justify-content:center}.Auth>div{display:flex}.a-left{gap:2rem}.a-left>img{height:4rem;width:4rem}.Webname>h1{-webkit-text-fill-color:#0000;-moz-text-fill-color:#0000;-webkit-background-clip:text;-moz-background-clip:text;background-color:red;background-image:var(--buttonBg);background-repeat:repeat;background-size:100%;font-size:3rem}.Webname>h6{font-size:.85rem}.infoInput1{background-color:var(--inputColor);border:none;border-radius:8px;flex:1 1;outline:none;padding:20px}.infoButton1{align-self:flex-end;height:2rem;width:6rem}.authForm{background-color:var(--cardColor);border-radius:1rem;padding:1rem}.authForm>div{align-items:center;justify-content:center;width:100%}@media (max-width:768px){.authForm{max-width:320px;padding:.8rem;width:90%}.authForm>div{align-items:left;justify-content:left}.infoInput1{width:73%}.infoForm{align-items:center;display:flex;flex-direction:column;gap:2rem;justify-content:center}.infoInput1{background-color:var(--inputColor);border:none;border-radius:8px;flex:1 1;outline:none;padding:20px}.infoForm>div{display:flex;gap:1rem;height:2rem;width:90%}.infoButton1{align-self:flex-end;height:2rem;width:6rem}}.InfoCard{background-color:var(--cardColor);border-radius:1rem;display:flex;flex-direction:column;gap:.75rem;padding:1rem;width:90%}.infoHead{align-items:center;display:flex;justify-content:space-between}.infoHead>div:hover{cursor:pointer}.logout-button{align-self:flex-end;height:2rem;margin-top:6rem;width:7rem}@media screen and (max-width:768px){.mantine-Modal-modal{border-radius:0!important;height:100vh!important;justify-content:flex-start;max-height:100%;max-width:100%;overflow-y:auto;padding:5px;width:100vw!important}.infoForm,.mantine-Modal-modal{align-items:center;display:flex;flex-direction:column}.infoForm{margin:0 auto;max-width:400px;width:90%}.infoForm h3{font-size:1.4rem;margin-bottom:10px;text-align:center}.infoInput{font-size:1rem;width:100%}.fx{align-items:flex-start;display:flex;flex-direction:column}.fx,.fx input{width:100%}.infoButton{font-size:1rem;margin:auto;padding:12px;position:relative;top:50px;width:60%}}.Profile{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:18rem auto 20rem;height:100vh;position:relative}.Profile-center{display:flex;flex-direction:column;gap:.5rem;min-height:100vh;overflow-y:auto;padding-right:10px}.Profile-center::-webkit-scrollbar{width:6px}.Profile-center::-webkit-scrollbar-thumb{background:#ccc;border-radius:10px}@media screen and (max-width:768px){.Profile{bottom:20px;display:flex;flex-direction:column;position:relative}.hide-in-mobile{display:none}.ProfileLeft{display:flex!important;flex-direction:column;order:2;width:100%}.RightSide{order:1;width:100%}.Profile-center{order:3;width:100%}}.FollowersCard1{border-radius:.7rem;display:flex;flex-direction:column;font-size:12px;gap:1rem;height:auto;width:100%}.follower{align-items:center;display:flex;justify-content:space-between}.follower>div{display:flex;gap:10px}.followerImage{border-radius:50%;height:3rem;width:3rem}.name{align-items:flex-start;display:flex;flex-direction:column;justify-content:center}.name>span:first-of-type{font-weight:700}.fc-button{height:2rem;padding-left:20px;padding-right:20px}.UnfollowButton{background:#0000;border:2px solid #0096ff;cursor:pointer}.FollowersCard1>span{align-self:center;color:#0096ff;cursor:pointer;font-weight:700}.Profile1{grid-gap:3rem;display:grid;gap:3rem;grid-template-columns:20rem auto 25rem;height:100vh;position:relative}.desktop-visible{display:block}@media screen and (max-width:768px){.Profile1{display:flex;flex-direction:column;height:100vh;overflow-y:auto;width:100%}.desktop-visible{display:none}.mobile-only{display:flex;flex-direction:column;width:100%}.mobile-only>.RightSide{order:1}.mobile-only>.InfoCard{order:2}.mobile-only>.FollowersCard{order:3}}.ChatBox-container{background:var(--cardColor);border-radius:1rem;display:grid;grid-template-rows:14vh 60vh 13vh}.chat-header{display:flex;flex-direction:column;padding:1rem 1rem 0}.chat-body{overflow:scroll;padding:1.5rem}.chat-body,.message{display:flex;flex-direction:column;gap:.5rem}.message{background:var(--buttonBg);border-radius:1rem 1rem 1rem 0;color:#fff;max-width:28rem;padding:.7rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.message>span:nth-child(2){align-self:end;color:var(--textColor);font-size:.7rem}.own{align-self:flex-end;background:linear-gradient(98.63deg,#24e4f0,#358ff9);border-radius:1rem 1rem 0 1rem}.chat-sender{align-items:center;align-self:end;background:#fff;border-radius:1rem;display:flex;gap:1rem;height:3.5rem;justify-content:space-between;padding:.8rem}.chat-sender>input{background-color:#ececec;border:none;border-radius:.5rem;flex:1 1;font-size:14px;height:70%;outline:none;padding:0 15px}.chat-sender>div:first-of-type{align-items:center;background:#e9e9e9;border-radius:.5rem;cursor:pointer;display:flex;font-weight:700;justify-content:center}.chat-sender>div{height:70%;padding:0 15px}@media screen and (max-width:768px){.chatbox-empty-message{font-size:medium;text-align:center}.ChatBox-container{grid-template-rows:14vh 54vh 13vh}.chat-sender{align-items:center;display:flex;gap:.1rem;height:3rem;justify-content:space-between;padding:.3rem}.chat-sender>input{flex:5 1;font-size:14px;padding:10px 15px;width:100%}.chat-sender>div{align-items:center;display:flex;font-size:12px;height:55%;justify-content:center;padding:4px 6px}.chat-sender>div:first-of-type{font-size:14px;height:24px;padding:3px;width:24px}.chat-sender .InputEmoji{font-size:12px;height:22px;width:22px}.send-button{font-size:12px;padding:5px 8px}.chatbox-empty-message{font-family:Times New Roman,Times,serif;font-size:x-small}}.Chat{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:22% auto;position:relative}body,html{height:100%;overflow:hidden}.Chat-container,.Left-side-chat{display:flex;flex-direction:column;gap:1rem}.Chat-container{background:var(--cardColor);border-radius:1rem;height:auto;min-height:82vh;overflow:scroll;padding:1rem}.Chat-list{gap:1rem}.Chat-list,.Right-side-chat{display:flex;flex-direction:column}.Right-side-chat{margin-top:5px}.conversation:hover{background:#80808038;cursor:pointer}.conversation{border-radius:.5rem;padding:10px}.conversation>div{position:relative}.online-dot{background-color:#adff2f;border-radius:50%;height:1rem;left:2rem;position:absolute;width:1rem}.chatbox-empty-message{align-self:center;display:flex;font-size:20px;justify-content:center}@media screen and (max-width:768px){.Chat{gap:.3rem;grid-template-columns:16% auto}.follower.conversation>div>.name{display:none}.Chat-container,.rsbox{min-height:76vh}}.hide-in-mobile{display:block}@media screen and (max-width:768px){.hide-in-mobile{display:none}}.nav-icons-container{align-self:flex-end;margin-right:20px;width:16.5rem}@media screen and (max-width:768px){.nav-icons-container{margin-bottom:15px}.Left-side-chat{margin-top:40px}.Chat{grid-template-columns:16% auto}.hide-in-mobile{display:none}.Chat-container h2{font-size:1.2rem;text-align:left}.Chat-list{gap:1rem}.conversation{align-items:center;display:flex;padding:8px}.conversation img{height:35px!important;margin-left:5px;width:35px!important}.follower.conversation>div>.name{display:none}.Left-side-chat{margin-top:45px}.Chat-list{right:18px}.Chat-list,.yep{position:relative}.yep{font-size:15px;right:10px;text-align:center}}