.breadcrumb-ss .back-link {
    position: absolute;
    top: 0;
    left: 15px;
    width: 100%;
}
.content-wrapper {
    padding: 0 !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    position: relative;
}
#app > div.container-scroller > div > div > div > div.row.suivi_chantier_header_wh > div:nth-child(2) > div.avatar_title_wh > div.title.f_bold_wh {
    padding: 0 !important;
    border: none !important;
}
.view_icons {
    display: none;
}

  /********Media Query*********/
/*********Mobile*********/
@media (min-width: 770px) {
    .mobile_navbar_wh,
    .goBack_mobile_wh {
        display: none;
    }
    .displayNone {
        display: none !important;
    }
    .navbar_wh {
        background: #231f20 !important;
        /* height: 60px !important; */
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
    .page-body-wrapper,
    .home-tab .tab-content {
        padding-top: 0px !important;
    }
    #app > div.content-wrapper {
        padding-left: 15px !important;
        padding-top: 0 !important;
    }
    .chat_container > div:first-child {
        padding-left: unset !important;
        padding-right: unset !important;
        /* border-right: unset !important; */
        
        /* width: 100% !important; */
    }
    .chat_container > div:first-child > div > div > div > div {
        /* border-left: 1px solid #555 !important; */
        /* border-right: 1px solid #555 !important; */
    }
    
    /* .chat_super_container_wh {
        height: 100vh !important;
        overflow: visible !important;
        position: relative !important;
    }
    .chat_super_container_wh #nkd-app > div > div {
    }
    .chat_super_container_wh #nkd-app.main-panel {
        height: calc(100vh - 97px) !important;
        padding-bottom: 0 !important;
    }
    .chat_super_container_wh #nkd-app > div {
        height: 100% !important;
        height: calc(100vh - 97px) !important;
    }
    .chat_super_container_wh #nkd-app > div > div:nth-child(2) > div > div > div {
        height: 100% !important;
        padding-bottom: 0 !important;
    }
    .chat_super_container_wh #overview > div {
        height: 100% !important;
        height: calc(100vh - 97px) !important;
        overflow: visible !important;
    }
    .chat_super_container_wh #msgerChat {
        height: 100% !important;
    } */
    /* body > :first-child{
        position: absolute;
    } */

    /* .container-scroller {
        overflow-y: hidden !important;
        height: 95vh !important;
    } */
    

}
@media (max-width: 768px) {
    .chat_super_container_wh {
        min-height: 100vh !important;
        overflow: visible !important;
        position: unset !important;
    }
    .displayNone,
    .displayNoneMobile {
        display: none !important;
    }
    .main-panel {
        width: 100% !important;
    }
    .content-wrapper {
        margin-bottom: 100px;        
    }
    .breadcrumb-ss .back-link {
        top: -5px;
        left: 5px;
    }
    /* ************************* HEADER ************************** */
    .navbar_wh {
        background: #231f20 !important;
        height: 60px !important;
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
    .goBack_mobile_wh {
        position: absolute;
        left: 20px;
        top: 15px;
    }
    .goBack_mobile_wh i {
        color: #a8e863;
        font-size: 35px;
    }

    .page-body-wrapper {
        padding-top: 30px !important;
    }
    /* ************************* MOBILE NAVBAR ************************** */
    .mobile_navbar_wh {
        position: fixed;
        bottom: 0;
        width: 100%;
        height: 80px;
        /* overflow: hidden; */
        border-radius: 15px;
        border-top: 1px solid #999;
        /* background: #000; */
        background: linear-gradient(to top, #252122 0%, #353233 75%) !important;
        padding: 20px;
    }
    .mobile_navbar_container {
        position: relative;
        width: 100%;
        display: flex;
        justify-content: space-between;
    }
    .mobile_navbar_left_side,
    .mobile_navbar_right_side {
        display: flex;
        gap: 45px;
    }
    .mobile_navbar_left_side a i,
    .mobile_navbar_right_side a i {
        color: white;
        font-size: 27px;
    }
    .mobile_navbar_left_side a path {
        fill: white;
    }
    .mobile_navbar_left_side a:active i,
    .mobile_navbar_right_side a:active i{
        color: #a8e863;
    }
    .mobile_navbar_left_side a:active path {
        fill: white;
    }

    .mobile_navbar_middle_button {
        position: absolute;
        left: 50%;
        bottom: 20%;
        height: 65px;
        width: 65px;
        transform: translateX(-50%);
        border-radius: 50%;
        padding: 10px;
        background: #a8e863;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .mobile_navbar_middle_button a {
        /* height: 50px;
        width: 50px; */
    }
    .mobile_navbar_middle_button a i {
        color: white;
        font-size: 35px;
    }
    .mobile_navbar_middle_button a path {
        fill: #fff !important;
        stroke: #fff !important;
    }
    .mobile_navbar_middle_button a:active i {
        color: #2f2a2b;
    }

    /* ************************* DASHBOARD ************************** */
    .dash_infos_container {
        flex-wrap: wrap;
    }
    .dash_info_item {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        border-left: none;
        border-top: 1px solid #555;
    }
    .dash_info_item:first-child {
        border-top: none;
    }
    .dash_info_item::after {
        background: transparent;
    }


    .dash_activities_container {
        flex-wrap: wrap;
    }
    .dash_activity_item {
        border-left: none;
        max-width: none;
        border-top: 1px solid #777;
    }
    .dash_activity_item:first-child {
        border-top: none;
    }


    /* ************************* CHAT ************************** */
    
    .chat_container {
        height: unset !important;
        overflow: auto !important;
        width: 100%;
        margin-left: unset !important;
        margin-right: unset !important;
    }
    .chat_container > div,
    .chat_container > div:nth-child(2) > div > div.stretch-card,
    .chat_container .card .card-body,
    .msger-chat,
    .msger-inputarea,
    .cont_wh {
        padding-left: unset !important;
        padding-right: unset !important;
        /* width: 100% !important; */
    }
    .chat_container > div {
        /* overflow-x: hidden; */
        padding-left: 0px !important;
        padding-right: 0px !important;
        
    }
    #overview > div > div.col-lg-8.d-flex.flex-column > div > div > div > div {
        border-left: none !important;
        width: 100% !important;
    }
    #overview > div > div.col-lg-8.d-flex.flex-column > div {
        margin-left: unset !important;
    }
    .msger-chat {
        height: 55vh !important;
        padding-left: 20px !important;
        /* min-height: 300px !important; */
    }
    .msger-inputarea,
    .msger-chat {
        width: 95% !important;
    }
    .msger-inputarea > div:first-child {
        margin-left: 0 !important;
    }
    .backToChatList {
        display: flex;
        align-items: center;
        gap: 7px;
        margin-top: 10px;
    }
    .backToChatList i,
    .backToChatList h4 {
        font-size: 20px;

        color: #a8e863 !important;
    }
    .backToChatList i {
        height: 18px;
        margin-bottom: 8px;
    }
    .backToChatList h4 {
        font-size: 18px;
        margin-bottom: 0;
    }

    .msg-img {
        display: none !important;
    }

    #msgerChat div.msg-bubble > div.msg-info,
    #msgerChat div.msg-bubble > div.msg-text {
        font-size: 14px;
        
    }

    
    /* ************************* LOGIN ************************** */
    .page_title_wh {
        font-size: 27px !important;
    }
    .form_wh {
        width: 100% !important;
    }


    /* ************************* CLIENTS ************************** */
    .tab_labels_wh {
        position: relative;
    }
    .tab_labels_wh > div:first-child label{
        font-size: 14px;
        padding-left: 0 !important;
        padding-right: 10px !important;
    }
    .tab_labels_wh > div:last-child{
        position: absolute;
        right: 0;
        bottom: 110%;
        width: 110px !important;
        padding: 0 !important;
        
    }
    .card .card-body,
    .tab_panels_wh {
        padding-left: unset !important;
        padding-right: unset !important;
    }
    .tab_panels_wh .just_space_between_wh {
        flex-wrap: wrap;
        row-gap: 20px;

    }
    .tab_panels_wh .just_space_between_wh > div:last-child {
        padding-left: 25px;
    }

    .clients_grid_container_wh {
        grid-template-columns: 1fr;
    }
    .tab_panels_wh .panel > div:nth-child(3) {
        margin-bottom: 30px;
    }

    .view_icons {
        display: none;
    }

    .row_double_input_wh {
        flex-wrap: wrap;
    }
    .all_chantiers_container_wh .jcsb_wh {
        flex-wrap: wrap;
        row-gap: 15px;
    }
    #app > div.container-scroller > div > div > div > div.row.flex-grow.m_t_15 > div.col-12.jcsb_wh {
        flex-wrap: wrap;
        row-gap: 20px;
    }
    #app > div.container-scroller > div > div > div > div.row.flex-grow.m_t_15 > div.all_chantiers_container_wh > div > span > span {
        font-size: 16px !important;
    }
    #app > div.container-scroller > div > div > div > div.row.flex-grow.m_t_15 > div.btn_container > button {
        font-size: 16px !important;
    }
    #app > div.container-scroller > div > div > div > div.row.flex-grow.m_t_15 > div:nth-child(1) > div > div > div.select-selected,
    #app > div.container-scroller > div > div > div > div.row.flex-grow.m_t_15 > div:nth-child(1) > div > div > div.select-items > div {
        font-size: 16px !important;
    }

    .custom_select_container_wh {
        flex-wrap: wrap;
        row-gap: 15px;
        width: 100%;

    }

    .client_data_vertical_block_wh,
    .client_data_vertical_block_wh > div {
        display: flex;
        justify-content: center;
        width: 100% !important;

    }
    .profile_data_value_wh {
        min-width: unset !important;
    }
    /* .client_data_vertical_block_wh:first-child {
        display: none;
    } */
    #app > div.container-scroller > div > div > div > div.row.flex-grow.m_t_15 > div.col-12.jcsb_wh.pdx_20_wh.m_t_50 > div:nth-child(1) {
        display: none;
    }

    #ongletOne > div.col-12.jcsb_wh.m_t_50,
    #ongletTwo > div.col-12.jcsb_wh.m_t_50 {
        flex-wrap: wrap;
        flex-direction: column !important;
        justify-content: center;
        align-items: flex-start;
        text-align: left !important;
    }

    #ongletOne > div.col-12.jcsb_wh.m_t_50 > div > div,
    #ongletTwo > div.col-12.jcsb_wh.m_t_50 > div > div {
        border-bottom: 1px solid #777;
        width: 100% !important;
    }
    #ongletOne > div.col-12.jcsb_wh.m_t_50 > div > div >.icon_text_wh,
    #ongletTwo > div.col-12.jcsb_wh.m_t_50 > div > div >.icon_text_wh{
        width: 100% !important;
    }
    #ongletOne > div.col-12.jcsb_wh.m_t_50 > div > div > .data_value_wh,
    #ongletOne > div.col-12.jcsb_wh.m_t_50 > div > div > .data_value_red_wh,
    #ongletTwo > div.col-12.jcsb_wh.m_t_50 > div > div > .data_value_wh {
        text-align: right;
    }

    #ongletOne > div.col-12.jcc_wh.m_t_70.pdx_20_wh > div > div.bar_titles_wh.jcc_wh > div,
    #ongletTwo > div.col-12.jcc_wh.m_t_70.pdx_20_wh > div > div.bar_titles_wh.jcc_wh > div {
        text-align: center;
    }

    /* ******************************************************* */
    #app > div.container-scroller > div > div > div > div.row.flex-grow.m_t_15 > div.col-12.grid-margin.stretch-card > div > div > form > div {
        flex-wrap: wrap;
    }
    #app > div.container-scroller > div > div > div > div.row.flex-grow.m_t_15 > div.col-12.grid-margin.stretch-card > div > div > form > div > div {
        margin-left: 0 !important;
        margin-top: 10px;
    }
    #app > div.container-scroller > div > div > div > div.row.flex-grow.m_t_15 > div.col-12.grid-margin.stretch-card > div > div > form > div > span {
        width: 100%;
    }
    #app > div.container-scroller > div > div > div > div.row.flex-grow.m_t_15 > div:nth-child(2) > div > div.dragndrop_infos_wh > div.drag.dragndrop_input_text_wh {
        width: 100%;
        text-align: center;
        flex-wrap: wrap;
    }
    #app > div.container-scroller > div > div > div > div.row.flex-grow.m_t_15 > div:nth-child(2) > div > div.dragndrop_infos_wh > div.drag.dragndrop_input_text_wh a,
    #app > div.container-scroller > div > div > div > div.row.flex-grow.m_t_15 > div:nth-child(2) > div > div.dragndrop_infos_wh > div.drag.dragndrop_input_text_wh p {
        width: 100%;
        text-align: center;
    }


    /* ******************************* SUIVI CHANTIER ********************************** */

    #app > div.container-scroller > div > div > div > div.row.suivi_chantier_header_wh {
        width: unset !important;
    }
    #app > div.container-scroller > div > div > div > div.row.suivi_chantier_header_wh > div {
        width: 100% !important;
        margin-bottom: 30px;
    }


    .tab_labels_right_wh {
        /* flex-wrap: wrap; */
    }
    .tab_labels_right_wh .card_title_wh {
        font-size: 10px !important;
    }
    .tab {
        padding: 10px 8px;
        margin: 0;
    }
    #three-panel > div.jcsb_wh.m_t_30 {
        flex-wrap: wrap;
    }

    .primary_btn_wh {
        padding: 5px 60px;
    }
    .primary_btn_wh.fsz_14_mob {
        font-size: 14px;
    }


    /* *************************************************************************************** */
    #app > div.container-scroller > div > div > div > div.row.suivi_chantier_header_wh > div.card_green_gradient_container_mini_wh {
        flex-wrap: wrap;
        justify-content: center;
    }
    #app > div.container-scroller > div > div > div > div.row.m_t_70 > div.col-lg-8.d-flex.flex-column > div > div > div > div > div.dash_infos_container > div {
        padding-left: 10px !important;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center ;
        text-align: center ;
    }
    #app > div.container-scroller > div > div > div > div.row.m_t_70 > div.col-lg-8.d-flex.flex-column > div > div > div > div > div.col-12.jcc_wh.m_t_30 > div > div.bar_titles_wh.jcc_wh > div {
        width: 300px;
        text-align: center ;
    }


    /* ////////////////////////////////////////////////////////////////// */
    .lot_fournisseur_container_wh {
        flex-wrap: wrap;
    }
    .lot_fournisseur_text {
        border-right: unset !important;
        border-bottom: 1px solid #777;
    }
}