.chat-room-container{display:flex;flex-direction:column;height:100vh;background-color:#ece5dd;font-family:Segoe UI,sans-serif}.chat-messages{flex:1;overflow-y:auto;padding:10px;display:flex;flex-direction:column}.chat-message{display:flex;margin-bottom:10px}.sent{justify-content:flex-end}.received{justify-content:flex-start}.message-bubble{max-width:70%;padding:10px;border-radius:10px;position:relative;background-color:#dcf8c6;color:#000;word-wrap:break-word}.received .message-bubble{background-color:#fff}.text{margin:0;padding-right:40px}.timestamp{font-size:.5rem;position:absolute;bottom:5px;right:10px;color:#888}.chat-form{display:flex;padding:10px;border-top:1px solid #ccc;background-color:#f0f0f0}.chat-input{flex:1;padding:10px;border:none;border-radius:20px;outline:none}.chat-send-button{margin-left:10px;padding:10px 15px;border:none;background-color:#075e23;color:#fff;border-radius:20px;cursor:pointer}.chat-send-button:hover{background-color:#0b806e}@media screen and (max-width: 700px){.chat-room-container{height:90vh}.message-bubble{max-width:85%}}.sender-name{font-weight:700;font-size:.8rem;color:#075e54;margin-bottom:2px;display:block}.date-separator{text-align:center;margin:15px auto;padding:6px 12px;background-color:#e1f3ff;color:#333;font-size:.85rem;border-radius:15px;width:fit-content}.navbar{background:#007bff;color:#fff;padding:10px 20px;position:fixed;width:100%;top:0;left:0;z-index:1000;box-shadow:0 4px 6px #0000001a}.nav-container{display:flex;justify-content:space-between;align-items:center;max-width:1100px;margin:0 auto}.nav-logo{font-size:1.5rem;font-weight:700;text-decoration:none;color:#fff}.nav-links{list-style:none;display:flex;gap:20px}.nav-links li{display:inline}.nav-links a{text-decoration:none;color:#fff;font-size:1rem;padding:8px 12px;transition:.3s}.nav-links a:hover{background:#fff3;border-radius:5px}.nav-toggle{display:none;flex-direction:column;cursor:pointer}.bar{background:#fff;width:25px;height:3px;margin:4px;transition:.3s}.mobile-icons{display:none}@media screen and (max-width: 768px){.nav-links{position:absolute;top:50px;left:0;background:#007bff;width:100%;flex-direction:column;text-align:center;gap:0;padding:10px 0;display:none}.nav-links.open{display:flex}.nav-links li{padding:10px 0}.nav-toggle{display:flex;margin-right:30px}.bar.open:nth-child(1){transform:rotate(45deg) translate(5px,5px)}.bar.open:nth-child(2){opacity:0}.bar.open:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}.nav-links{display:none}.mobile-icons{display:flex;width:100px;justify-content:space-around;margin-right:20px}}@keyframes growFade{0%{transform:translate(-50%,-50%) scale(1);opacity:1}50%{transform:translate(-50%,-50%) scale(1.6);opacity:1}to{transform:translate(-50%,-50%) scale(.5);opacity:0}}.profile-container{text-align:center;padding:20px}.profile-container img{width:100px;height:100px;border-radius:50%;object-fit:cover}.profile-stats{display:flex;justify-content:center;gap:20px;margin-top:10px}.profile-stats div{text-align:center}.profile-stats div strong{font-size:24px}.follow-button{margin-top:10px;padding:10px 20px;border-radius:8px;color:#fff;font-size:16px;border:none;cursor:pointer;transition:.3s}.follow-button.following{background-color:red}.follow-button.not-following{background-color:#007bff}.posts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}.posts-grid .post{border:1px solid #ccc;padding:10px}.posts-grid .post img{width:100%;aspect-ratio:4/5;border-radius:5px;object-fit:cover}.posts-grid .post h3{font-size:14px;margin-bottom:5px}.modal{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;justify-content:center;align-items:center}.modal-content{background-color:#fff;padding:20px;border-radius:8px;width:80%;max-width:400px}.modal-content h3{margin-bottom:10px}.modal-content ul{list-style-type:none;padding:0}.modal-content ul li{margin:5px 0}.modal-content button{margin-top:20px;padding:10px 15px;border-radius:8px;background-color:#007bff;color:#fff;border:none;cursor:pointer;transition:.3s}.modal-content button:hover{background-color:#0056b3}.bottom-navbar{z-index:1000;position:fixed;bottom:0;width:100%;background-color:#fff;display:flex;justify-content:space-around;align-items:center;padding:10px 0;box-shadow:0 -2px 5px #0000001a;border-top:1px solid #ddd}.nav-item{text-decoration:none;color:#333;font-size:12px;text-align:center;display:flex;flex-direction:column;align-items:center}.icon{font-size:20px;margin-bottom:3px}@media screen and (min-width: 768px){.bottom-navbar{display:none}}