html:root {
    /*   --secondary-blue-dark: #255798;
     --woodsmoke-color: #212121;
    --white-color: #fff;
    --nevada-color: #646F7D;
    --cadet-blue-color: #b1b9c1;*/
    --athens-gray-color: #e9ecf0;
    --vivid-green-color: #0fa91c;
}
.flex-center {display:flex;align-items:center;}
.flex-center-center {display:flex;align-items:center;}
.flex-center-between {display: flex;align-items: center;justify-content: space-between;}
.flex-end-between {display: flex;align-items: end;justify-content: space-between;}
.humana-chatbox-page {padding:32px 0 0; background:#eaeef5;}
.humana-chatbox-page .sec-title {position:relative; padding-bottom:24px; margin:0;}
.humana-chatbox-page .sec-title h5 {margin:0 0 4px;font-size: 20px;font-weight:700; color:var(--woodsmoke-color); line-height:normal;}
.humana-chatbox-page .sec-title small { font-size: 16px;font-weight: 400;line-height: normal;color:var(--woodsmoke-color);margin:0 0 12px; display:block;}
.humana-chatbox-page .sec-title .line {width:120px;height: 2px;background:var(--vibrant-lime-green); display:flex;}
.humana-chatbox-block {display: flex;padding: 32px;flex-direction: column;gap: 32px;border-radius: 16px;background:var(--white-color); border:1px solid var(--athens-gray-color); margin:0 0 48px;}
.humana-chatbox-head .humana-chatbox-head-left {gap:24px;}
.humana-chatbox-head-left .person-img {width:64px; height:64px; border-radius:50%;}
.humana-chatbox-head-left .humana-info .humana-info-head {gap:9px;}
.humana-chatbox-head-left .humana-info h5 {color:var(--secondary-blue-dark); font-size: 20px;font-weight: 700;line-height: normal;margin:0;}
.humana-chatbox-head-left .humana-info .humana-info-head small {font-size: 16px;font-weight: 400;line-height: normal;color:var(--nevada-color);}
.humana-chatbox-head-left .humana-info .status-text {position:relative;font-size: 14px;font-weight: 500;line-height: normal; color:var(--nevada-color); padding-left:16px; gap:8px; margin:6px 0 0;}
.humana-chatbox-head-left .humana-info .status-text:before {position:absolute; content:''; width:8px; height:8px; border-radius:50%; background:var(--vivid-green-color); left:0; top:6px;}
.outline-btn {gap: 4px;border-radius: 4px;background:var(--white-color);border:1px solid var(--cadet-blue-color) !important;font-size: 14px;font-weight: 600;line-height: normal;color:var(--secondary-blue-dark); padding:7px 24px 6px;}
.outline-btn .icon {position:relative; top:-2px;}
.humana-chat-container {border-radius: 8px;background:var(--white-color);box-shadow: 0 2px 8px 0 rgba(14, 10, 31, 0.00); border: 1px solid #b1b9c1; display: flex; flex-direction: column; height: 500px; overflow:hidden;}
.humana-chat-container .chat-header {font-size: 16px;font-weight: 500;line-height: normal;color:var(--woodsmoke-color); padding:8px 16px 7px;}
.humana-chat-container  .chat-header span {gap:8px; }
.chatbot-messages {flex-grow: 1;padding:8px 16px;overflow-y: auto;flex-direction: column-reverse;}
.chatbot-messages .message-wrapper .message { padding: 12px;border-radius: 12px; margin-bottom:4px;position: relative;
  font-size: 14px;line-height: 20px; max-width:420px;}
.chatbot-messages .message-wrapper .message p {margin:0;}
.chatbot-messages .message-wrapper .message .list {margin:6px 0 0 8px; padding:0;}
.chatbot-messages .message-wrapper .message .list li {position:relative; font-size: 14px;font-weight: 500;line-height: 20px;color:var(--woodsmoke-color); padding-left:16px;}
.chatbot-messages .message-wrapper .message .list li + li {margin:0 !important;}
.chatbot-messages .message-wrapper .message .list li:before {position:absolute;content:''; width:4px;height:4px; border-radius:50%; background:var(--woodsmoke-color); left:0; top: 7px;}
@media (min-width: 1920px){
    .chatbot-messages .message-wrapper .message {
        max-width: 620px
    }
}
.chatbot-messages .message-wrapper {display:flex; flex-direction:column;margin-bottom:10px}
.chatbot-messages .message-wrapper.bot { align-items: flex-start;}
.chatbot-messages .message-wrapper.user { display:flex; justify-content:end;}
.chatbot-messages .message-wrapper.user .time {text-align:end;}
.chatbot-messages .message.bot { background-color:var(--athens-gray-color); align-self: flex-start; }
.chatbot-messages .message.user  { background:#f5f6f8;align-self: flex-end;}
.chatbot-messages .message-wrapper .time {font-size: 12px;font-weight: 500;line-height: normal;color:var(--nevada-color);}
.chat-input {  border-top: 1px solid #eee; padding: 13px 16px 11px; display: flex;align-items: center;}
.chat-input input { padding: 10px 12px;   flex-grow: 1; font-size: 14px;  outline: none; border-radius:6px;gap: 8px; border:none;}
.chat-input.send-btn, .chat-input .icon-btn { background: none !important; border: none; font-size: 18px; margin-left: 8px;cursor: pointer;}
.new-message {animation: slideUpFadeIn 0.3s ease-out;}
.chatbot-product-card {display: flex;padding: 12px;align-items: flex-start;border-radius: 12px;background: linear-gradient(97deg, #f4f9ff 57.79%, var(--white-color) 100%); margin-top:7px;}
.chatbot-product-card .chatbot-product-img { width: 85px;height: 85px; border-radius: 8px;  object-fit: cover;  margin-right: 16px;}
.chatbot-product-card .chatbot-product-content {flex: 1;}
.chatbot-product-content p{font-size: 16px;font-style: normal;font-weight: 500;line-height: normal;color:var(--woodsmoke-color); margin:0;}
.chatbot-product-content small {font-size: 12px;font-style: normal;font-weight: 400;line-height: normal; color:var(--nevada-color); display:block;}
.chatbot-product-content .text-link {text-decoration:none; gap:6px; margin-top:6px;}
.chatbot-prodouctcard-main {margin-top:7px; max-width:420px; } 
@media (min-width: 1920px) {
    .chatbot-prodouctcard-main {
        max-width: 620px
    }
}
@keyframes slideUpFadeIn {
    0% {
        transform: translateY(20px);
        opacity: 0;
    }

    100% {
        transform: translateY(0);
        opacity: 1;
    }
}