.search_tp input {
    color: var(--c_heading) !important;
}

.about p a,
a:not([href]) {
    text-decoration: underline !important;
}

.cust_tab2 .nav-tabs .nav-link {
    font-size: 14px;
    font-weight: 500;
    color: #222;
    letter-spacing: 0.1px;
    border-radius: 0;
    min-height: 50px;
    min-width: 150px;
    border: 0;
}

.cust_tab2 .nav-tabs .nav-link:not(:last-child) {
    border-right: 1px solid #d1d1d1 !important;
}

.cust_tab2 .nav-tabs .nav-link.active {
    border: 0;
    background: #f8f8f8;
}

.cust_tab2 .nav-tabs {
    display: inline-flex;
    border-radius: 14px 14px 0 0;
    border: 1px solid #d1d1d1;
    overflow: hidden;
    border-bottom: 0;
}

.tables table tr :where(th, td) {
    padding: 20px 10px;
    border-top: 1px solid #d1d1d1;
}

.tables table tr th {
    background: #f8f8f8;
    font-size: 14px;
    font-weight: 500;
    color: #222222b2;
}

.tables table tr td {
    font-size: 14px;
    color: var(--c_black);
    letter-spacing: 0.1px;
}

.tables table {
    border: 1px solid #d1d1d1;
    width: 100%;
}

.tables table tr td.text_primary {
    color: var(--c_primary);
}

.tables table tr td .table_tag {
    background: #d4f8d3;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 5px 12px;
}

.tables table .company_logo {
    width: 85px;
    height: 35px;
    border-radius: 4px;
}

.tables table .company_logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.tables table .country_list {
    display: inline-flex;
    gap: 10px;
    align-items: center;
}

.tables table .country_list figure {
    max-width: 50;
}

.search_tp2 {
    display: flex;
    width: 100%;
    position: relative;
}

.search_tp2 input[type="search"] {
    background: transparent;
    border-radius: 8px;
    border: 1px solid #d1d1d1;
    border-radius: 8px;
    padding-right: 170px;
}

.search_tp2 input[type="search"]::placeholder {
    color: #d1d1d1;
}

.mb_60 {
    margin-bottom: 60px;
}

.search_tp2 .btnn {
    min-width: 160px;
    position: absolute;
    right: 3px;
    height: calc(100% - 6px);
    top: 50%;
    transform: translateY(-50%);
    border-radius: 6px;
    z-index: 3;
}

.pagination_list {
    margin: 35px 0 0;
    display: flex;
    justify-content: flex-end;
    gap: 4px;
}

.pagination_list li {
    transition: var(--transition);
    width: 24px;
    height: 24px;
    font-size: 20px;
    color: var(--c_black);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    letter-spacing: 0.1px;
}

.pagination_list li.active {
    background: var(--c_primary);
    color: var(--c_white);
}

.pagination_list li:hover {
    background: #00a9a340;
}

.about.mt_70 {
    margin-top: 66px;
}

.brokerage_news .by_rt_news {
    max-height: unset;
    padding: 20px 40px;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 25px 40px;
}

.brokerage_news .by_rt_news li {
    margin: 0;
    width: calc(100% / 2 - (40px * 1 / 2));
}

.brokerage_news .by_rt_news :where(h3, p) {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    /* number of lines to show */
    line-clamp: 4;
    -webkit-box-orient: vertical;
}

.brokerage_news .by_rt_news h3 {
    -webkit-line-clamp: 2;
    /* number of lines to show */
    line-clamp: 2;
}

.event_more_top {
    border-top: 1px solid #cccccc;
}

.up_crs .logo_list {
    display: flex;
    flex-wrap: wrap;
    gap: 19px;
    padding: 16px 30px 30px 16px;
}

.up_crs .logo_list figure {
    width: 140px;
    height: 56px;
    border-radius: 4px;
}

.up_crs .logo_list figure img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.progress_design {
    height: 30px;
    background: #f6f6f6;
    border-radius: 0;
}

.progress_design .progress-bar {
    background: var(--c_primary);
}

/* chat css */
.chat_sc {
    padding-block: 40px;
}

.chat_sc h1 {
    font-size: 26px;
    font-weight: 700;
    color: #0d1513;
}

.chat_sc .lt {
    height: 100%;
    padding-block: 15px;
    min-height: calc(100vh - 250px);
    max-height: calc(100vh - 250px);
    width: calc(28% - var(--gap_x));
    position: relative;
    overflow: auto;
    border-right: 1px solid #d9dce0;
}

.chat_sc .rt {
    width: calc(72% - var(--gap_x));
}

.chat_sc .chat_single {
    display: flex;
    align-items: center;
    padding: 15px 12px;
    position: relative;
    border-radius: 14px;
    cursor: pointer;
    gap: 8px;
    margin-right: 6px;
}

.chat_sc .chat_single:hover {
    background-color: #f5f5f5;
}

.chat_sc .chat_single.active {
    background-color: #e5f6f6;
}

.chat_sc .chat_single:not(:last-child) {
    margin-bottom: 8px;
}

.chat_sc .chat_single .time {
    top: 10px;
    position: absolute;
    font-size: 12px;
    line-height: 1;
}

.chat_sc .chat_single figure {
    width: 47px;
    height: 47px;
    min-width: 47px;
    border-radius: 50%;
    border: 2px solid var(--c_white);
    overflow: hidden;
}

.chat_sc .chat_single figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.chat_sc .chat_single p {
    font-size: 12px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.chat_sc .chat_single .badge {
    position: absolute;
    top: 36px;
    right: 40px;
    background-color: #00a9a3;
    font-size: 10px;
    font-weight: bold;
    padding: 4px 8px;
    border-radius: 50%;
    min-width: 20px;
    min-height: 20px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.chat_sc .chat_single p strong {
    font-size: 14px;
    color: var(--c_heading);
}

.chat_sc .chat_single p>* {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical;
}

.chat_sc .chat_box {
    max-height: calc(100vh - 327px);
    min-height: calc(100vh - 327px);
    border-radius: 14px;
    background-color: transparent;
    overflow: auto;
}

.chat_sc .chat_box .chat_head {
    top: 0;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    border-bottom: 1px solid var(c_border);
    background-color: var(--c_white);
    padding: 15px 20px;
    position: sticky;
    z-index: 2;
}

/* .fg-emoji-container {
    top: 447px !important;
} */
.chat_sc .chat_box .chat_head figure {
    width: 47px;
    height: 47px;
    min-width: 47px;
    border-radius: 50%;
    overflow: hidden;
    margin: 0 !important;
}

.chat_sc .chat_box .chat_head figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.chat_sc .chat_box .chat_head p {
    font-weight: 700;
    color: var(--c_black);
    margin-bottom: 0;
}

.chat_sc .chat_box .chat_head svg {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background-color: var(--c_primary);
    margin-left: auto;
    color: var(--c_white);
    padding: 5px;
}

.chat_sc .chat_box .chat_body {
    padding: 20px 40px;
    position: relative;
    width: 100%;
    min-height: calc(100vh - 405px);

    z-index: 0;

}

.chat_sc .inner {
    position: relative;
}

.chat_srch {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.chat_srch i {
    color: #696969 !important;
    font-size: 20px !important;
}

.chat_srch .nav-tabs .nav-link {
    padding-inline: 10px;
    font-size: 14px;
}

.chat_srch .nav-tabs li {
    margin: 0;

}

.chat_srch .nav-tabs {
    flex-wrap: nowrap;

}

.chat_srch input {
    padding-left: 45px;
    font-size: 14px;
}

.chat_srch {
    position: relative;
}

.chat_sc .chat_single {
    margin-bottom: 0 !important;
}

.chat_srch::before {
    content: "";
    position: absolute;
    width: 24px;
    height: 24px;

    left: 24px;
    z-index: 9;
    top: 20px;
    background-size: cover;
    background-image: url(../images/search.svg);
    background-position: center;
    background-repeat: no-repeat;


}

.chat_sc .chat_box {
    position: relative;
}

.chat_sc .chat_box {
    background-image: url(../images/chat_bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
}

.chat_sc .chat_box .chat_body>p {
    font-size: 14px;
    text-align: center;
}

.chat_sc .chat_box .chat_body>p:not(:first-child) {
    margin-top: 30px;
}

.chat_sc .chat_box .chat_body>p:not(:last-child) {
    margin-bottom: 15px;
}

.chat_sc .chat_box .chat_body .single_message {
    /* max-width: 310px; */
    max-width: 200px;
}

.chat_sc .chat_box .chat_body .single_message.recieved {
    display: flex;
    align-items: flex-start;
    gap: 2px;
}
.chat_sc .chat_single figure.online{
    right: 26px;
} 
.chat_sc .chat_single .badges{
    top: 26%;
}
.chat_sc .chat_box .chat_body .single_message h6 {
    font-size: 14px;
    color: #00a9a3;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 5px;
}
.chat_sc .chat_box .chat_body .single_message.sended  h6{
    justify-content: flex-end;
}
.chat_sc .chat_box .chat_body .single_message h6 figure {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #01b5ae;
    margin-bottom: 0;
    overflow: hidden;
}
.chat_sc .chat_box .chat_body .single_message h6 figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.chat_sc .chat_box .chat_body .single_message:not(:last-child) {
    margin-bottom: 15px;
}

.chat_sc .chat_box .chat_body .single_message .msg_body {
    width: auto;
    padding: 15px 20px;
    background-color: #f5f8fa;
    display: inline-block;
    margin-bottom: 9px;
    position: relative;
}

.chat_sc .chat_box .chat_body .single_message .msg_body p {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.2;
}

.chat_sc .chat_box .chat_body .single_message.sended {
    text-align: right;
    margin-left: auto;
}

.chat_sc .chat_box .chat_body .single_message.sended .msg_body {
    border-radius: 14px 14px 0 14px;
    background-color: #00a9a3;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    gap: 10px;
    margin-bottom: 28px;
    word-break: break-word;
    position: relative;
}

.chat_sc .chat_box .chat_body .single_message.sended .msg_body::before {
    content: "";
    position: absolute;
    background-image: url(../images/sended_c.svg);
    width: 10px;
    height: 18px;
    bottom: -5px;
    right: -5px !important;
}

.chat_sc .chat_box .chat_body .single_message.sended .msg_body .dropdown-toggle:empty::after {
    content: unset;
}

.chat_sc .chat_box .chat_body .single_message.recieved .msg_body .dropdown-toggle:empty::after {
    content: unset;
}

.chat_sc .chat_box .chat_body .single_message.sended .msg_body::before {
    right: 0;
    border-top-color: var(--c_primary);
    border-left: 15px solid transparent;
}

.chat_sc .chat_box .chat_body .single_message.sended .msg_body:has(.message-container) .dropdown {
    right: -30px;
}

.chat_sc .chat_box .chat_body .single_message.received .msg_body:has(.message-container) .dropdown {
    right: -30px;
}

.chat_sc .chat_box .chat_body .single_message.sended .msg_body p {
    color: var(--c_white);
    text-align: left;
    margin-bottom: 0;
}

.chat_sc .chat_box .chat_body .single_message.received .msg_body {
    border-radius: 14px 14px 14px 0;
    background-color: #fff;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    flex-direction: row-reverse;
    gap: 10px;
    margin-bottom: 28px;
    position: relative;
    word-break: break-word;
}

.chat_sc .chat_box .chat_body .single_message.received .msg_body::before {
    content: "";
    position: absolute;
    background-image: url(../images/received_c.svg);
    width: 12px;
    height: 18px;
    bottom: -4px;
    left: -5px;
}

.chat_sc .chat_box .chat_body .single_message.received .msg_body .dropdown {
    position: absolute;
    right: -10px;
    top: 2px;
}

.chat_sc .chat_box .chat_body .single_message.recieved .msg_body::before {
    left: 0;
    border-top-color: var(--c_grey);
    border-right: 15px solid transparent;
}

.chat_sc .chat_box .chat_body .single_message.received .msg_body p {
    color: var(--c_primary);
    text-align: right;
    margin-bottom: 0;
    /* margin-left: 3px; */
}

.chat_sc .chat_foot {
    display: flex;
    align-items: center;
    padding-top: 25px;
    gap: 5px;
}

.chat_sc .chat_foot .control_group {
    margin-bottom: 0;
    width: 100%;
}

.chat_sc .chat_foot input {
    border: 1px solid #696969;
    border-radius: 50px;
    background-color: #f4f4f4;
}

.chat_sc .chat_foot input:focus {
    border-color: var(--c_primary);
}

.chat_sc .chat_foot .btnn {
    min-width: 1px;
    min-height: 45px;
    padding: 0 0 0 0px;
    background-color: transparent;
    border-radius: 0;
    border: none;
}

.chat_sc .chat_foot .btnn.btn_icon {
    width: 45px;
    min-width: 45px;
    height: 45px;
    background-color: #01b5ae;
    border-radius: 50px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.chat_sc .chat_foot .btnn.btn_icon .fas {
    color: var(--c_white);
    font-weight: 600;
}

.chat_srch {
    padding: 13px;
}

.chat_srch input {
    min-height: 40px;
    height: 40px;
    border-radius: 50px;
    background-color: #f3f3f3;
}

.chat_sc .lt::-webkit-scrollbar {
    height: 6px;
    /* Thin horizontal scrollbar */
}

.chat_sc .chat_box::-webkit-scrollbar,
.chat_sc .lt::-webkit-scrollbar {
    width: 4px;
}

.chat_sc .chat_box::-webkit-scrollbar-track,
.chat_sc .lt::-webkit-scrollbar-track {
    background-color: var(--c_white);
}

/* Handle */
.chat_sc .chat_box::-webkit-scrollbar-thumb,
.chat_sc .lt::-webkit-scrollbar-thumb {
    background: var(--c_primary);
}

/* chat css end */

.chat_sc .chat_box .chat_head .chat_lft {
    display: flex;
    align-items: center;
    gap: 16px;
}

.chat_sc .chat_box .chat_head .chat_rht {
    display: flex;
    align-items: center;
    gap: 16px;
    position: relative;
}

.chat_sc .chat_box .chat_head .chat_rht span {
    cursor: pointer;
}

.chat_sc .chat_box .chat_head .chat_rht span i {
    color: #a5a5a5;
}

.chat_sc .chat_box .chat_head .chat_rht span i.fa-star {
    color: #ffab2d;
}

.emoji-container {
    display: flex;
    background-color: #ffffff;
    border-radius: 15px;
    padding: 3px 6px;
    position: absolute;
    bottom: -15px;
    left: 10px;
    box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.2);
    color: white;
}

.emoji {
    font-size: 14px;
    padding: 2px;
    cursor: pointer;
}

.msg-time {
    font-size: 12px;
    color: #898383;
    position: absolute;
    bottom: 1px;
    right: 5px;
}

.sended-msg-time {
    font-size: 12px;
    color: var(--c_white);
    position: absolute;
    bottom: 1px;
    right: 5px;
}

.reply-container {
    display: flex;
    flex-direction: column;
    position: relative;
    background: #f5f8fa;
    padding: 8px;
    border-radius: 10px;
    max-width: 90%;
    margin: 5px 10px;
    border-left: 3px solid #00a9a3;
}

.reply-header {
    display: flex;
    align-items: center;
    font-size: 12px;
    color: #00a9a3;
    font-weight: 500;
}

.reply-header i {
    margin-right: 5px;
}

.reply-user {
    margin-left: 5px;
}

.reply-message {
    color: #00a9a3;
    font-size: 12px;
    margin-top: 2px;
    white-space: pre-wrap;
    overflow-wrap: break-word;
}

.close-reply {
    position: absolute;
    right: 8px;
    top: 8px;
    background: transparent;
    border: none;
    color: #999;
    font-size: 14px;
    cursor: pointer;
}

.close-reply:hover {
    color: #333;
}

.message-container {
    display: flex;
    flex-direction: column;
    /* background: #fff; */
    padding: 8px;
    border-radius: 8px;
    position: relative;
}

.replied-message {
    background: #f5f8fa;
    padding: 8px;
    border-left: 3px solid #00a9a3;
    border-radius: 5px;
    margin-bottom: 5px;
    display: flex;
    flex-direction: column;
    /* Stack elements vertically */
}

.reply-user {
    font-weight: bold;
    color: #00a9a3;
    font-size: 12px;
    margin-bottom: 3px;
}

.reply-text {
    font-size: 12px;
    color: #555;
    background: #fff;
    padding: 4px 8px;
    border-radius: 5px;
}

.replied-message i {
    margin-right: 5px;
    color: #00a9a3;
}

.attachment-dropdown {
    position: absolute;
    bottom: 97px;
    left: 434px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    display: none;
    z-index: 1000;
    width: 150px;
    padding: 8px;
}

.attachment-dropdown ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.attachment-dropdown ul li {
    /* padding: 8px; */
    text-align: center;
}

.attachment-dropdown ul li a {
    text-decoration: none;
    font-size: 16px;
    color: black;
    display: block;
    border-radius: 5px;
    background: #f1f1f1;
    padding: 5px;
}

.attachment-dropdown ul li a:hover {
    background: #ddd;
}

.msg_body figure {
    height: 93px;
    max-width: 80px;
}

.msg_body figure a .sendimg {
    position: relative;
    right: 64px;
}

.unpinned {
    position: relative;
    /* font-size: 24px; */
    color: #333;
}

.unpinned::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 0;
    width: 100%;
    height: 2px;
    background: red;
    transform: rotate(-45deg);
}

.draft-tooltip {
    display: none;
    position: absolute;
    bottom: 42px;
    left: 10px;
    background: #01b5ae;
    color: white;
    padding: 5px 10px;
    border-radius: 5px;
    font-size: 12px;
}

.video-message {
    position: absolute;
    max-width: 100%;
    height: 100px;
    border-radius: 8px;
    left: 13px;
}


.groupChatIndex .filter h1 {
    font-size: 20px;
    color: var(--c_black);
    font-weight: 600;
}

.groupChatIndex .filter button.btn_sm {
    margin-top: 40px;
    width: 100%;
}

.groupChatIndex .modal.show .modal-dialog {
    max-width: 480px;
    height: 550px;
}

/*  Reduce the modal size (width + height) */
.groupChatIndex .modal-dialog {
    max-width: 300px;
    max-height: 400px;
    margin: 1.75rem auto;
}

/*  Reduce padding inside the modal */
.groupChatIndex .modal-content {
    padding: 15px;
    border-radius: 10px;
}

/*  Smaller close button */
.groupChatIndex .modal-body .btn-close {
    position: absolute;
    right: 10px;
    top: 10px;
    font-size: 12px;
}

/*  Center modal text and content */
.groupChatIndex .modal-body {
    text-align: left;
    max-height: 300px;
    overflow-y: auto;
}

/*  Reduce modal title size */
.groupChatIndex .modal-body h4 {
    font-size: 18px;
    font-weight: 600;
    padding-bottom: 20px;
}

.groupChatIndex .contact_detail {
    gap: 8px;
}

/*  List item styling */
.groupChatIndex .contact_detail li {
    font-size: 14px;
    /* margin-bottom: 10px; */
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
}



.groupChatIndex .contact_detail li img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
}


.groupChatIndex .contact_detail li span {
    color: var(--c_heading);
}

/*  Smooth modal open effect */
.groupChatIndex .modal.fade .modal-dialog {
    transform: translate(0, -30px);
    transition: transform 0.2s ease-out;
}

.groupChatIndex .modal.show .modal-dialog {
    transform: translate(0, 0);
}

.groupChatIndex .filter h1 {
    font-size: 20px;
    color: var(--c_black);
    font-weight: 600;
}

.groupChatIndex .filter button.btn_sm {
    margin-top: 40px;
    width: 100%;
}

.groupChatIndex .modal.show .modal-dialog {
    max-width: 480px;
    height: 550px;
}

/*  Reduce the modal size (width + height) */
.groupChatIndex .modal-dialog {
    max-width: 300px;
    max-height: 400px;
    margin: 1.75rem auto;
}

/*  Reduce padding inside the modal */
.groupChatIndex .modal-content {
    padding: 15px;
    border-radius: 10px;
}

/*  Smaller close button */
.groupChatIndex .modal-body .btn-close {
    position: absolute;
    right: 10px;
    top: 10px;
    font-size: 12px;
}

/*  Center modal text and content */
.groupChatIndex .modal-body {
    text-align: left;
    max-height: 300px;
    overflow-y: auto;
}

/*  Reduce modal title size */
.groupChatIndex .modal-body h4 {
    font-size: 18px;
    font-weight: 600;
    padding-bottom: 20px;
}

.groupChatIndex .contact_detail {
    gap: 8px;
}

/*  List item styling */
.groupChatIndex .contact_detail li {
    font-size: 14px;
    /* margin-bottom: 10px; */
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
}



.groupChatIndex .contact_detail li img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
}


.groupChatIndex .contact_detail li span {
    color: var(--c_heading);
}

/*  Smooth modal open effect */
.groupChatIndex .modal.fade .modal-dialog {
    transform: translate(0, -30px);
    transition: transform 0.2s ease-out;
}

.groupChatIndex .modal.show .modal-dialog {
    transform: translate(0, 0);
}

.chat_sc .chat_box .chat_body .single_message.sended .msg_body .checkbox_22 {
    position: absolute;
    left: -30px;
    top: 50%;
    transform: translate(0px, -50%);
}

.chat_sc .chat_box .chat_body .single_message.received .msg_body .checkbox_22 {
    position: absolute;
    right: -30px;
    top: 50%;
    transform: translate(0px, -50%);
}

.subsc_lst li .btnn.btn-danger {
    background-color: #f41717;
    border-color: #f40b0b;
}

.chat_sc .chat_box .chat_body:has(h1.text-center) {
    display: flex;
    align-items: center;
    justify-content: center;
}


@media (max-width:1200px) {
    .chat_srch .nav-tabs .nav-link {
        font-size: 12px;
    }
}

.search_bar .chat_srch {
    padding: 0;
    margin-bottom: 15px;
}
.search_bar .chat_srch input {
    min-height: 50px;
    height: 50px;
}
.search_bar .chat_srch::before {
    width: 22px;
    height: 22px;
    left: 16px;
    top: 13px;
}
.search_bar .table_pagination.mt-5.col-12.row {
    margin-top: 15px !important;
}
    
html[lang='ar']
{
   
.chat_sc .chat_single .time{
    left: 10px;
}
} 
html[lang='en']

.chat_sc .chat_single .time{
    right: 10px;
}
} 