.chat-container-modern{display:flex;flex-direction:column;height:75vh;max-height:700px;border-radius:.75rem;overflow:hidden;border:1px solid #dee2e6}.chat-header-modern{flex-shrink:0;background-color:#f8f9fa;border-bottom:1px solid #dee2e6}.chat-body-modern{flex-grow:1;overflow-y:auto;padding:1rem;background-color:#fff}.chat-footer-modern{flex-shrink:0;background-color:#f8f9fa;border-top:1px solid #dee2e6;padding:.75rem 1rem}.chat-footer-modern .form-control{border-radius:20px}.chat-footer-modern .form-control:focus{box-shadow:none;border-color:#86b7fe}.chat-footer-modern .btn{border-radius:50%;width:40px;height:40px;padding:0;display:flex;align-items:center;justify-content:center}.chat-body-modern .chat-message{display:flex;margin-bottom:1rem;align-items:flex-end}.chat-body-modern .chat-message .message-bubble{position:relative;padding:.6rem 1rem 1.8rem;border-radius:1.2rem;max-width:70%;min-width:90px;line-height:1.5;word-wrap:break-word}.chat-body-modern .chat-message .message-content{font-size:.95rem}.chat-body-modern .chat-message .message-content p{margin:0}.chat-body-modern .chat-message .message-time{position:absolute;bottom:5px;right:12px;font-size:.7rem;opacity:.7}.chat-body-modern .chat-message.sent{justify-content:flex-end}.chat-body-modern .chat-message.sent .message-bubble{background-color:#0d6efd;color:#fff;border-bottom-right-radius:.5rem}.chat-body-modern .chat-message.sent .message-time{color:#e0e0e0}.chat-body-modern .chat-message.received{justify-content:flex-start}.chat-body-modern .chat-message.received .message-bubble{background-color:#e9ecef;color:#212529;border-bottom-left-radius:.5rem}.chat-body-modern .chat-message.received .message-time{color:#6c757d}.chat-date-separator{display:flex;align-items:center;text-align:center;margin:1.5rem 0;color:#adb5bd}.chat-date-separator::before,.chat-date-separator::after{content:'';flex:1;border-bottom:1px solid #e9ecef}.chat-date-separator:not(:empty)::before{margin-right:.5em}.chat-date-separator:not(:empty)::after{margin-left:.5em}.chat-date-separator span{color:#6c757d;font-size:.8rem;font-weight:500;text-transform:uppercase}@media (max-width:767px){.chat-container-modern{height:calc(100vh - 120px)}.chat-body-modern{padding:.5rem}.chat-body-modern .chat-message .message-bubble{max-width:80%;font-size:.9rem}}