@charset "utf-8";
@import url('/asset/jcore/css/fonts/fontawesome-pro-6.2.0-web/css/all.min.css'); /*Icons Fonts*/

/* CSS Document */
body{color:rgba(0, 0, 0, 0.85); background: #eeeeee;margin-bottom: 0px;display: table;width: 100%}
body.zh-cn{font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue","PingFang SC","Hiragino Sans GB","Microsoft Yahei",sans-serif;}
body.en{font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;}
.wrapper-body-left{
    display: table-cell;
    background: #2b2f3e !important;
    vertical-align: top;
}

/*====================*/
/*       COMMON       */
/*====================*/

.hide{display: none;}


/*--------------------*/
/*      COMMON PAGE   */
/*--------------------*/
#header{width:1162px; margin:0 auto;position:relative;}

/***   header  ***/
#header_background{width:100%; position:fixed; left:0; top:0; z-index: 100; background:url("/asset/jcore/images/common/structure/header_bg_1.png") repeat-x left -6px #eeeeee;}
.top_menu_left li,.main_menu li,.sub_menu li{float:left;}
.top_menu_left li a,.main_menu li a,.sub_menu li a{display:block;}

/**  top_menu  **/
#header .top_menu_left  .menu_lv2 li a{background-color:  #FFF}
.top_menu_left{margin-top:12px; display:inline-block;position:relative;}
.top_menu_left li{margin-right:2px;}
.top_menu_left li a{padding:3px 9px; background:#353535; color:#aeadad; height: 15px; padding-top: 5px; padding-right: 7px;}
.top_menu_left li.active{background:url("/asset/jcore/images/common/structure/header_control_bg_08.jpg") no-repeat scroll right top;}
.top_menu_left li.active a{background:url("/asset/jcore/images/common/structure/header_control_bg_07.jpg") no-repeat scroll left top; color:#ffffff;}

/**  top_search_box  **/
#top_search_box{width:432px; height:43px; float:right; margin-bottom:25px; margin-right: 50px; background:url("/asset/jcore/images/common/structure/form_bg_01.png") no-repeat scroll left bottom;}
#top_search_box .top_search_box_wrapper{position:relative; margin-left:18px; margin-top:6px; line-height:30px;width: 300px;height: 50px;float: left;}
#top_search_box .keywords_search{width:115px; height:18px; border:0; padding:7px 10px 6px 30px; float:left; margin-left: 40px;margin-right:7px; color:#666;}
#top_search_box .keywords_search_btn{height: 20px; padding-top: 10px; cursor:pointer; width:72px; line-height:30px; text-align:center; color:#ffffff; background-color: #309CCC; position:absolute;right:25px;}
#top_search_box .app_search_icon{width: 15px;height: 15px;display: block;position: absolute ;left: 48px;top: 8px;}
header .top_search .input-group input{border-radius: 50px 0 0 50px !important}
header .top_search .input-group input:focus{border-color: #3c8dbc !important}

/**  main_menu  **/
.main_menu{background:url("/asset/jcore/images/common/structure/main_menu_bg.png") no-repeat scroll left bottom; height:43px; padding-left:27px; display:block;}
.main_menu li{margin-right:3px; margin-left:3px;  background: #D7D7D7;}
.main_menu li a{padding:6px 26px; color:#666; background: #D7D7D7; font-size:13px;}
.main_menu .important{background: #309CCC;}
.main_menu .important a{background: #309CCC; color:#ffffff;}
.main_menu .active{background: #353535;}
.main_menu .active a{background: url("/asset/jcore/images/common/structure/header_bg_transpose.png") repeat-x scroll left -6px #ffffff; color:#ffffff; padding:6px 26px;}

#top_search_wrapper{position: absolute;top: 6px;right: 460px;z-index: 101}
#top_search_form{height: 35px;line-height: 35px;}
#top_search_form .top_search_keywords{width:280px;padding: 7px 10px 6px 10px;border:1px solid #ccc;}
#top_search_form .clear_top_search_text{position: absolute;top: 7px;left: 279px;display: none;}
#top_search_form .blue_btn{background: #309CCC;width: 72px;height: 20px;padding: 5px 0;line-height: 20px;position: absolute;top: 0px;right: -80px;color: #FFFFFF;text-align: center;margin: 0;}

.action .add{background:url("/asset/jcore/images/common/structure/icon_bg.png") -24px -78px no-repeat scroll; margin-right:0px; }
.action .delete{background:url("/asset/jcore/images/common/structure/icon_bg.png") 0 -78px no-repeat scroll; margin-right:10px; }
.action .add,.action .delete{display:block; width:23px; height:24px; float:right;margin-top: -13px; }

/*--------------------*/
/*     MESSAGE PAGE   */
/*--------------------*/
.message_wrapper{position: relative;margin-bottom: 10px;}
.message_wrapper.alert-warning{color: white;background-color: #FFCB00;border-color: #FFCB00;}
.message_wrapper.alert-danger{color: white;background-color: #FF158A!important;border-color: #FF158A;}
.tc_message_wrapper.special{z-index: 9;min-width: 220px;text-align: left;position:absolute}
.tc_message_wrapper.special button.close{line-height:inherit}
.tc_message_wrapper.message_wrapper.alert-success{color: #3C763D;background-color: #DFF0D8!important;border-color: #D6E9C6;}


.message .botom_left{padding:5px 0 5px 0;}
.message li{font-size:12px; padding:0 15px 0 22px; margin:0 0 0 10px; overflow:hidden; max-width:700px; white-space:normal;text-overflow:ellipsis;}

.message_error{background:#f4b8b7;padding:4px 2px;}
.message_error li{background:url("/asset/jcore/images/common/structure/message_error_bg.png") no-repeat scroll left top; color:#eb493d; margin-top:2px;}
.message_error li.message_expend{cursor:pointer; background:none; text-align: center; margin-left: 0px;}

.message_success{background:#cbddb7;padding:4px 2px;}
.message_success li{background:url("/asset/jcore/images/common/structure/message_success_bg.png") no-repeat scroll left top; color:#4c973d; margin-top:2px;}
.message_success li.message_expend{cursor:pointer; background:none; text-align: center; margin-left: 0px;}

.message_warning{background:#fbefb2;padding:4px 2px;}
.message_warning li{background:url("/asset/jcore/images/common/structure/message_warning_bg.png") no-repeat scroll left top; color: #C09853; margin-top:2px;}
.message_warning li.message_expend{cursor:pointer; background:none; text-align: center; margin-left: 0px;}

.message_info{background:#b9e3f8;padding:4px 2px;}
.message_info li{background:url("/asset/jcore/images/common/structure/message_info_bg.png") no-repeat scroll left top; color: #3A87AD; margin-top:2px;}
.message_info li.message_expend{cursor:pointer; background:none; text-align: center; margin-left: 0px;}

.inner_wrapper{padding:0 0 12px 0;}
.outer_wrapper{}
.main_wrapper{}
.main_wrapper h3{padding:8px 0 8px 35px; font-size:18px; font-weight:normal;}

/*--------------------*/
/*    ERROR MSG       */
/*--------------------*/
.error_list li{
    font-size:11px;
    color:red;
}

input.input_error, select.input_error{background: #fff3f3!important;border-color: #FF158A !important;}

/*-------------------*/
/*    Popup          */
/*-------------------*/
.modal .msg{padding:3px; position:relative; z-index:2000; top:170px;  background:#ffffff !important; opacity:1;}
.msg .popup{background:#FFF; -moz-border-radius:8px 8px 8px 8px; position:relative; opacity:1;}
.msg .popup .popup_reset{height:25px; width:67px; text-align:center; line-height:25px; border:0 none; color:#ffffff;}
.msg .popup .popup_reset{background:#515050; padding-bottom:4px;}
.msg .bread .active a{color:#1c8acb;}
.msg .popup h3{background:#e0e0e0;  -moz-border-radius:8px 8px 0px 0px;}
.msg .popup h3 span{margin-left:24px; padding-left:25px; background:url("/asset/jcore/images/common/structure/arrow_02.png") no-repeat left center;}
.msg .popup a.close{position:absolute; top:-20px; right:-20px; height:28px; width:28px; display:block; background:url("/asset/jcore/images/common/popup/close.png") no-repeat center center;}
.msg .popup textarea{width:450px; border:1px solid #dddddd; height:100px; padding:10px;}
.modal{
    /* must be initially hidden */
    display:none;
    /* place overlay on top of other elements */
    position:absolute;
    z-index:500;
    width:100%;
    height:100%;
}

.popup_wrapper{display:none;z-index: 9998;border:7px solid rgb(82, 82, 82); background:rgb(82, 82, 82); -moz-border-radius:8px 8px 8px 8px;}
.popup_wrapper .popup a.close{position:absolute; top:-16px; right:-16px; height:28px; width:28px; display:block; background:url("/asset/jcore/images/common/popup/close.png") no-repeat center center;}
.popup_wrapper .popup .blue_btn{display:inline-block;color:white;cursor:pointer;width:67px;height:25px;background:#309CCC; text-align:center;line-height:25px;margin:0 5px 0 5px;}
.popup_wrapper .popup .gray_btn{display:inline-block;color:white;cursor:pointer;width:67px;height:25px;background:#515050;text-align:center;line-height:25px;margin:0 5px 0 5px;}

.popup_wrapper a, .popup_wrapper a:hover{color:#309CCC;}

.ac_results{z-index:999999;overflow:hidden;}
.ac_results ul{overflow-x:hidden !important;}
.ac_results ul li strong{color:orange;}


/* Jquery Tab UI */
.ui-widget{font-size:11px;}
.ui-tabs{margin:0 20px;}
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a {cursor: pointer;color:#666666;}
ui-tabs-nav li.ui-tabs-selected a:hover, .ui-tabs .ui-tabs-nav li.ui-state-disabled a:hover,.ui-tabs .ui-tabs-nav li.ui-state-hover a:hover, .ui-tabs .ui-tabs-nav li.ui-state-processing a:hover {cursor: pointer;color:#666666;}
.ui-corner-all{border-radius:0px;}


/* pager */
.pager {
    font-size:11px;
    clear:both;
    color:#7498BB;
    display:block;
    height:30px;
    margin:20px auto auto;
    text-align:center;
    width:100%;
}
.pager #current_page {
    background:#EBEBEB none repeat scroll 0 0;
    color:#419CD3;
    font-weight:bold;
    padding:0 8px;
}
.pager a {
    color:#b2b1b1;
    font-weight:bold;
    padding:0 8px;
    text-decoration:none;
}
.pager a:hover {
    color:#419CD3;
    background:#EFEBEF none repeat scroll 0 0;
}
 
/* Address Book */
#adbk{width: 575px;height:620px; padding: 10px; display: none;}
#adbk .adbk_depend_on_content_left{width: 20px;height: 540px;border: 1px solid #E0E0E0;float: left;margin-top: 10px;border-radius: 3px 0 0 3px;}
#adbk .adbk_alphabetical_index{width: 20px;line-height: 20px;display: block;float: left;text-align: center;}
/*#adbk .fixwidth{width: 260px;}*/
#adbk .adbk_activated{color: #009AFF;;font-weight: bold;}
#adbk .adbk_unactivated{color: #A0A0A0;cursor: text;}
#adbk .adbk_email_person{float: left;}
#adbk .adbk_content-left_list{border: 1px solid #E0E0E0; width: 350px;height: 550px;float: left; overflow: auto;margin-top: 5px;border-radius: 3px}
#adbk .adbk_content-left_list ul li{min-height:30px;padding-left: 10px; padding-top: 5px;padding-bottom: 5px;border-bottom: 1px solid #E0E0E0;display: block;float: left;width: 100%;}
#adbk .adbk_content-right{width: 184px;height: 300px;float: right;margin-top: 5px;}
#adbk .adbk_content-right .adbk_right_person_name{border: 1px solid #E0E0E0;width: 180px;height: 450px;float: right;border-radius: 3px}
#adbk .adbk_content-right .adbk_selected_names{overflow: auto;width: 180px;height: 420px;float: right;}
#adbk .adbk_content-right .adbk_selected_names p{background-color:#FFFFDD;margin: 3px 3px 0px 3px;padding: 6px;}
#adbk .adbk_content-right .adbk_clear_right_all_name{height: 30px;background-color:#EEEEEE;float: right;width: 180px;border-bottom-left-radius: 3px;border-bottom-right-radius: 3px }
#adbk .adbk_content-right .adbk_clear_right_all_name span{float: right;cursor: pointer;padding-top: 8px;padding-right: 8px;}
#adbk .adbk_content-right .adbk_email_address_btn{width: 178px;height: 50px;float: right;padding-top: 20px;}
#adbk .adbk_content-right .adbk_send_mail_subject_title{margin-top:20px;float: right;width: 100%}
#adbk .adbk_content-right .adbk_send_mail_content{margin-top:20px;float: right;width: 100%}
#adbk .adbk_content-right .adbk_send_mail_content textarea{width:100%;resize: none;height: 225px;padding: 10px;border-radius: 3px;}
#adbk .adbk_content-left{width: 370px;height: 550px;float: left;}
#adbk .adbk_content-left p.adbk_alphabetical_index{margin-bottom: 0px}
#adbk .adbk_header_in_add_email{width:100%;min-height: 28px;float: left;margin-bottom: 10px;background:#ffffdd;padding:10px;border-radius: 3px}
#adbk .adbk_content-left_list ul li.adbk_selected{background-color: #FFF8DB;}
#adbk .adbk_content-left_list li.adbk_first_index_li{height:20px!important;padding-bottom:0px!important;padding-top: 0px!important;float: left;display: block; border-bottom:2px solid #999999;}
#adbk .adbk_content-left_list .company_name_li .company_name{font-size:14px;width: 75%;display: inline-block}
#adbk .adbk_first_index_li span{font-size:16px;color:#009AFF;font-weight:bold;float: left;line-height: 30px;}
#adbk .adbk_person_name .first_row{float: left;}
#adbk .adbk_person_name .adbk_full_name{color: black;float: left;width: 100px;}
#adbk .adbk_person_name .adbk_full_email {color: black;float: left;width: 170px;word-break: break-all;}
#adbk .adbk_person_name .adbk_factory_description{float:left; margin-left: 25px;}
#adbk #selB1L_chzn{float: right;}
#adbk .adbk_content-left_list .style_icon{float: left;margin-right: 6px;}
#adbk .adbk_content-left_list ul.mt30{margin-top: 30px}
#adbk .adbk_header_in_add_email .adbk_filter_title{margin:5px 10px 0px 4px;float: left}
#adbk .adbk_header_in_add_email .adbk_filter{width:240px; height: 30px;float: left;}
#adbk .adbk_header_in_add_email .adbk_filter option{padding-left: 5px;padding-top: 5px;}
#adbk .instance_all_staff_select{display: none;float: right;line-height: 30px;background-color: white;text-align: right; padding-right: 4px;}

/* select soft delete */
select option.my_soft_delete_widget_form_o_deleted{color: #EB493D;}
select option.my_soft_delete_widget_form_o_normal{color: #666666;}

/* export select  */

#expsel{width: 560px;height: 450px;border: 1px #DDD solid;font-size: 11px;}
#expsel .content{padding: 0px}
#expsel p{height: 26px;margin: 0px}
#expsel p span,#expsel p span em{font-size: 11px;font-weight: bold;color:	#464646;font-style: normal;}
#expsel p span{margin: 5px 5px 0px 0px;}
#expsel #search_items{height: 14px;margin: 4px;padding: 1px;}
#expsel .select_right{}
#expsel .select_right .content{overflow:auto;height: 424px;}
#expsel .select_right ul li{list-style: none;margin:1px auto;height: 17px;padding-left: 10px; padding-top: 2px;}
#expsel .select_right ul .first_hidden{display: none;}
#expsel .select_right ul .select_li_add{background: url("/asset/jcore/images/common/export_select/ui-bg_glass_75_e6e6e6_1x400.png") repeat-x scroll 50% 50% #E6E6E6;}
#expsel .select_right ul .select_li_add:hover{background: url("/asset/jcore/images/common/export_select/ui-bg_glass_75_dadada_1x400.png") repeat-x scroll 50% 50% #E6E6E6;}
#expsel .select_right .assist_helper{display: none;}
#expsel .select_right .add_all{cursor: pointer;}
#expsel .select_right .split_line{border-top: 1px #DDD solid;border-bottom: 1px #DDD solid;height: 15px;background-color: #CCC}
#expsel .select_right ul .select_action_add{
    font-weight: bold;
    float: right;
    margin-right: 10px;
    margin-top: -2px;
    cursor: pointer;
    height: 15px;
    width: 15px;
    background-image: url("/asset/jcore/images/common/export_select/ui-icons.png");
    background-repeat: no-repeat;
    background-position: -16px -127px;   
}

#expsel .select_left{width: 309px;border-right: 1px #DDD solid;float: left;overflow: auto;}
#expsel .select_left .content{overflow:auto;height: 424px;}
#expsel .select_left ul li{list-style: none;margin:1px auto;height: 17px;padding-left: 5px;padding-top: 2px; }
#expsel .select_left ul .select_li_remove{background: url("/asset/jcore/images/common/export_select/ui-bg_glass_75_e6e6e6_1x400.png") repeat-x scroll 50% 50% #E6E6E6;}
#expsel .select_left ul .select_li_remove:hover{background: url("/asset/jcore/images/common/export_select/ui-bg_glass_75_dadada_1x400.png") repeat-x scroll 50% 50% #E6E6E6;}
#expsel .select_left ul .select_action_remove{
    font-weight: bold;
    float: right;
    margin-right: 10px;
    margin-top: -2px;
    cursor: pointer;
    height: 15px;
    width: 15px;
    margin-left: 6px;
    background-image: url("/asset/jcore/images/common/export_select/ui-icons.png");
    background-repeat: no-repeat;
    background-position: -48px -127px;
}
#expsel .select_left p .remove_all{cursor: pointer;}
#expsel .select_left ul.selected_items li input{width: 50px;height:14px; padding: 0px;margin: 0px;float: right;padding-left: 2px;}
#expsel .select_left ul.selected_items li.first_item{display: none;}
#expsel .select_left ul.selected_items li input.hidden_input{display: none;}
#expsel .select_left ul.selected_items li .sort_icon{
    float: left;
    margin-left: 0px;
    margin-right: 5px;
    cursor: pointer;
    height: 15px;
    width: 15px;
    background-image: url("/asset/jcore/images/common/export_select/ui-icons.png");
    background-repeat: no-repeat;
    background-position: -128px -48px;
}

#expsel ul .hidden_part{display: none;}


/*metro popup*/
.MessageBoxButtonSection{display: none}
.MessageBoxMiddle{left: 0;margin: 0 auto}

.metro_popup_wrapper th{text-align:center; font-weight:bold; color:#666;}
.metro_popup_wrapper td{color:#666;}
.metro_popup_wrapper input[type="radio"]{float:left; height:13px; width:13px; border:none; background:none;}
.metro_popup_wrapper input[type="text"]{
    padding:5px;
    /*border:1px solid #DDDDDD;*/
    color:#666666;
}
.metro_popup_wrapper input[type="submit"],input[type="button"],input[type="reset"]{text-align:center; line-height:1; border:0 none; cursor:pointer; outline:none;color:#666666;}
.metro_popup_wrapper input[type="checkbox"]{vertical-align:middle; width:13px; height:13px;border:0 none; }
.metro_popup_wrapper textarea{  height:120px; width:498px;box-shadow: none}
.metro_popup_wrapper input,.metro_popup_wrapper select,.metro_popup_wrapper textarea{border:1px solid #dddddd; color:#666;}
.metro_popup_wrapper select{padding:4px 3px 5px 3px;}


.metro_popup_wrapper {margin-top: 20px;color: black;color:black;font-size: 13px}
.metro_popup_wrapper .metro_popup_tmp{height: 0; width: 0; display: none;}
.metro_popup_wrapper .content{min-height: 50px;}
.metro_popup_wrapper h3{
    font-size:25px;
    color:#615D5D;
    border-bottom: 1px solid #D2D2D2;
    padding-bottom:  5px;
    margin: 0px;
    font-weight: normal;
    background: none;
}
.metro_popup_wrapper .btns{
    text-align: right;
    padding-top: 20px;
    border-top: 1px solid #D2D2D2;
    margin-top: 20px;
}
.metro_popup_wrapper .btns .btn{
    margin-left: 10px;
}
.metro_popup_wrapper .gray_btn {
    -moz-user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
    cursor: pointer;
    display: inline-block;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.42857;
    margin-bottom: 0;
    padding: 6px 12px;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    background-color: #f4f4f4;
    border-color: #ddd;
    opacity: 1;
    float: none;
}
/*.metro_popup_wrapper .btns a:hover{background: #e7e7e7;}*/
.popup_holder{display: none}
#MsgBoxBack .popup_holder{display: block}
/*.metro_popup_wrapper a.blue_btn {background: #3498DB;color: #FFFFFF;display: inline-block; margin-left: 5px;}*/
/* .metro_popup_wrapper a.blue_btn {
    -moz-user-select: none;
    background-color: #3498db;
    color:#fff;
    border: 1px solid transparent;
    border-color: #367fa9;
    cursor: pointer;
    display: inline-block;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.42857;
    margin-bottom: 0;
    padding: 6px 12px;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    border-radius: 3px;
    box-shadow: none;
 }*/
/*.metro_popup_wrapper a.blue_btn:hover {background: #367fa9;}*/
.metro_popup_wrapper a.gray_btn:hover {background: #e7e7e7;color: #333;border: 1px solid #adadad}
.metro_popup_wrapper table tr{line-height: 20px;}
.metro_popup_wrapper table th{text-align: left;font-weight: normal;color: #999;}

@media screen and (max-width:900px){
    #MsgBoxBack .auto_width{width: 70%}
}
@media screen and (min-width:900px){
    #MsgBoxBack .auto_width{width: 900px;}
}

/*popup tcAlert*/
#tcAlerts_popup_container #tcAlerts_popup_panel{
    width: 100%;
    height: 50px;
    padding-bottom: 26px;
    text-align:right;
    border-top: 1px solid #D2D2D2;
    padding-top: 20px;
    margin-bottom: 20px;
}
#tcAlerts_popup_container #tcAlerts_popup_panel a{font-size: 12px;}
#tcAlerts_popup_container #tcAlerts_popup_panel a.gray_btn{
    background: none repeat scroll 0 0 #E7E5E5;
    color: #A3A3A3;
    height: 30px;
    line-height: 13px;
    padding: 10px 5px;
    text-align: center;
    width: 65px;
    display: block;
    float: right;
    margin-left: 5px;
}

#tcAlerts_popup_container #tcAlerts_popup_panel a:hover{background: #EDEAEA;}
#tcAlerts_popup_container #tcAlerts_popup_panel a#tcAlerts_popup_ok{color: #FFF;background-color: #309ccc;}
#tcAlerts_popup_container #tcAlerts_popup_panel a#tcAlerts_popup_ok:hover{background: #35abe0;color: #FFF}
#tcAlerts_popup_container #tcAlerts_popup_title{
    font-size:25px;
    font-weight: normal;
    text-align:left;
    margin-top:30px;
    height:34px;
    padding-bottom:5px;
    border-bottom: 1px solid #D2D2D2;
    color:#615D5D;
}

#tcAlerts_popup_container #tcAlerts_popup_message{
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    font-size: 25px;
    font-weight: normal;
    padding: 20px 10px;
    text-align:left;
    min-height:35px;
}

.tc_popup_message{
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    font-size: 25px;
    font-weight: normal;
    min-height: 35px;
    padding: 20px 10px 0px 10px;
    text-align: left;
    color: #615d5d;
}
@media screen and (max-width:830px){
    #tcAlerts_popup_container .auto_width{width: 70%}
}
@media screen and (min-width:830px){
    #tcAlerts_popup_container .auto_width{width: 830px;}
}
 
/*tabber panel section wrapper*/
.app_panel_section{font-weight: bold;color: #414242;border-bottom: 1px solid #DBDFE2;margin: 15px 25px 10px 25px;padding-left: 10px;height: 29px;line-height: 30px;}
.app_panel_section span{background: #ffffff;font-size: 12px;border: 1px solid #DBDFE2;border-bottom: 0;padding: 8px;}
.app_panel_section label{font-size: 12px;padding: 8px;color: #666666;font-weight: normal}
.app_panel_section label a{color: #666666}

/* corssapp order add popup*/
#crossapp_popup_add_new_order .error_input{border:1px solid red !important;}
#crossapp_popup_add_new_order table{margin: 20px 10px 20px 10px;}
#crossapp_popup_add_new_order table tr{line-height: 30px;}
#crossapp_popup_add_new_order table td{color: #615D5D;border: 1px solid #fff;}
#crossapp_popup_add_new_order table input[type='text']{
    border: 1px solid #BBBBBB;
    color: #615D5D;
    font-size: 12px;
    height: 20px;
    margin-left: 10px;
    padding: 0px 5px;
    width: 222px;
    background: #fff;
}
#crossapp_popup_add_new_order table select{
    border: 1px solid #BBBBBB;
    color: #615D5D;
    font-size: 12px;
    height: 22px;
    margin-left: 10px;
    padding: 0;
    width: 234px;
}
#crossapp_popup_add_new_order table input[type='checkbox']{
    margin-left: 10px;
    padding: 0px 5px;
}
#crossapp_popup_add_new_order table.mt5{margin: 0px auto;margin-top: 5px;margin-bottom: -20px;}
#crossapp_popup_add_new_order table.mt5 tr{line-height: 20px;}
#crossapp_popup_add_new_order table .message_error li {background: url("/asset/jcore/images/common/structure/message_error_bg.png") no-repeat scroll 0 center rgba(0, 0, 0, 0);}
#crossapp_popup_add_new_order table .message_error li.message_expend {background: none;}
#crossapp_popup_add_new_order .date{width: 108px;}
#crossapp_popup_add_new_order em{color:red}
#crossapp_popup_add_new_order .change_bulk_order{color: #309ccc;cursor: pointer}
#crossappordernewform_order_number_prefix{width: 100px !important;}
#crossappordernewform_order_number_value{width: 109px !important;}

/* corssapp costing add popup*/
#crossapp_popup_add_new_costing table{margin: 20px 10px 20px 10px;}
#crossapp_popup_add_new_costing table tr{line-height: 30px;}
#crossapp_popup_add_new_costing table td{color: #615D5D}
#crossapp_popup_add_new_costing table input{
    border: 1px solid #BBBBBB;
    color: #615D5D;
    font-size: 12px;
    height: 20px;
    margin-left: 10px;
    padding: 0px 5px;
    width: 222px;
}
#crossapp_popup_add_new_costing table select{
    border: 1px solid #BBBBBB;
    color: #615D5D;
    font-size: 12px;
    height: 22px;
    margin-left: 10px;
    padding: 0;
    width: 234px;
}
#crossapp_popup_add_new_costing .error_input{border:1px solid red;}
#crossapp_popup_add_new_costing table.mt5{margin: 0px auto;margin-top: 5px;margin-bottom: -20px;}
#crossapp_popup_add_new_costing table.mt5 tr{line-height: 20px;}
#crossapp_popup_add_new_costing table .message_error li {background: url("/asset/jcore/images/common/structure/message_error_bg.png") no-repeat scroll 0 center rgba(0, 0, 0, 0);}
#crossapp_popup_add_new_costing table .message_error li.message_expend {background: none;}
#crossapp_popup_add_new_costing .date{width: 108px;}
#crossapp_popup_add_new_costing em{color:red}
#crossapp_popup_add_new_costing .error_inline{display: block;float: left;margin-left: 5px;}


.app_span_edit_text{color: #309CCC;text-decoration: underline;cursor:pointer}
.comment li span.app_span_edit_text{color: #309CCC;text-decoration: underline;cursor:pointer}
.app_span_delete_text{color: red !important;cursor:pointer;}
.comment li span.app_span_delete_text{color: red;cursor:pointer;}
.comment li .basiccomment_lock{margin-bottom: -5px;text-decoration: underline;cursor: pointer;color: #309CCC}
.comment li .basiccomment_unlock{margin-bottom: -5px;text-decoration: underline;cursor: pointer;color: red}

.comment li .comment_list_left{float: left;width: 52px;height: 52px;margin-left: 10px;}
.comment li .comment_list_right{float: right;width: 710px;margin:0 20px;}
.comment li .comment_date{color:#a5a4a4}
.comment li .comment_list_right .fl a{color: #309CCC;text-decoration: underline}
.comment li .comment_list_right .comment_date{margin-left: 10px;}
.comment li span,.comment li p{line-height:21px;}
.comment li span{color:#54a6d7;}
.comment li .comment_user_avatar{
    float: left;
    background-color: #FFFFFF;
    border: 1px solid #CCCCCC;
    border-radius: 3px 3px 3px 3px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    padding: 1px;
}
.comment li .comment_list{margin-top: 5px;float: left}
.comment li{float: left;padding:8px 0px 8px 0px;  border-bottom:1px solid #dfdfdf; color:#a5a4a4;}

/* common comment */
.service_comment_wrapper .service_comment_add_section{display: none}
.popup_service_comment textarea{font-size: 12px;padding: 5px;margin: 15px;}
.service_comment_wrapper .service_comment_lock.private{color: #d73925;}
.service_comment_wrapper .comment_li_cell{display: inline-block;width: 100%;padding: 8px;border-top: 1px solid #e1e1e1!important;}
.service_comment_wrapper .comment_li_cell:last-child{border-bottom: 1px solid #e1e1e1!important}
.service_comment_wrapper .comment_li_cell > .pull-right + .comment_body {text-align: right;}
.service_comment_wrapper .comment_li_cell .comment_body {position: relative;width: calc(100% - 54px); display: inline-block;padding-left: 20px}
.service_comment_wrapper .comment_li_cell img.media-object {border-radius: 100%; width: 54px;}
.service_comment_wrapper .pinned_comment{display: inline-block;padding: 5px 10px;background-color: #292f4c;color: white;margin-right: 10px;border-radius: 5px 5px 0 0}
.pinned_comment i{color: white !important;}
.service_comment_wrapper li a.user_avator img, .comment_wrapper li a.user_avator img {border: 1px solid #ddd;padding: 2px;}
.service_comment_wrapper .service_comment_add_btn_content{padding: 10px 0;}
.service_comment_wrapper textarea{max-height: 33px;resize:vertical;overflow: hidden;}
.service_comment_wrapper .comment_section_body p{margin: 0px}
.service_comment_wrapper .comment_section_body ul{  
    display: block;
    list-style-type: disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 40px;
    padding-left: 40px;
    
}
.service_comment_wrapper .record_comment_updated{font-size:10px;font-weight: lighter;}
.global_count_badge{
    margin-left: 5px;
    height: 18px;
    text-align: center;
    font-weight: 300;
}
.global_count_badge_fake{
    margin-left: 5px;
    height: 18px;
    text-align: center;
    font-weight: 300;
}

/* common comment */
.service_comment_wrapper .service_comment_add_section{display: none}
.service_comment_wrapper .comment_li_cell{display: inline-block;width: 100%;padding: 8px;border-top: 1px solid #e1e1e1!important;}
.service_comment_wrapper .comment_li_cell:last-child{border-bottom: 1px solid #e1e1e1!important}
.service_comment_wrapper .comment_li_cell > .pull-right + .comment_body {text-align: right;}
.service_comment_wrapper .comment_li_cell .comment_body {position: relative;width: calc(100% - 54px); display: inline-block;padding-left: 20px}
.service_comment_wrapper .comment_li_cell img.media-object {border-radius: 100%; width: 54px;}
.service_comment_wrapper li a.user_avator img, .comment_wrapper li a.user_avator img {border: 1px solid #ddd;padding: 2px;}
.service_comment_wrapper .service_comment_add_btn_content{padding: 10px 0;}
.service_comment_wrapper textarea{max-height: 33px;resize:vertical;overflow: hidden;}
.service_comment_wrapper .pinned_comment{display: inline-block;padding: 5px 10px;background-color: #292f4c;color: white;margin-right: 10px;border-radius: 5px 5px 0 0}
.global_count_badge{
    margin-left: 5px;
    height: 18px;
    text-align: center;
    font-weight: 300;
}
.service_comment_wrapper .comment_content ul{
    display: block;
    list-style-type: disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 40px;
    padding-left: 40px;
}
.comment_count_badge{
    margin-left: 5px;
    background-color: #3498db !important;
    height: 21px;
    line-height: 15px;
    text-align: center;
}
/*comment emojis */
/*=== start===*/
.service_comment_actions .comment_emojis{display:inline-block}
.service_comment_actions .section_actions{display:inline-block}
.service_comment_actions .action_add_emoji i{font-size:1.4em}
.service_comment_actions .comment_emoji_options{display:inline-block;position:relative}
.service_comment_actions .comment_emoji_options ul{display:inline-block;position:absolute;top:-30px;left:-50px;background-color:white;width:auto;display:flex;border-radius:16px;border:1px solid #e1e1e1}
.service_comment_actions .comment_emoji_options ul li{padding:3px}
.service_comment_actions .comment_emoji_options ul li:first-child{padding-left: 8px}
.service_comment_actions .comment_emoji_options ul li:last-child{padding-right: 8px}
.service_comment_actions .comment_emoji_options ul li img{width:16px;height:16px}
.service_comment_actions .comment_emoji_options ul li img:hover{cursor:pointer}
/*已选emoji*/
.service_comment_actions .selected_emoji{display:inline-block;vertical-align:top}
.service_comment_actions .selected_emoji ul{display:flex;flex-wrap:wrap;margin-bottom:2px}
.service_comment_actions .selected_emoji ul li{padding: 1px;padding-left: 5px;}
.service_comment_actions .selected_emoji ul li:hover{cursor: pointer;}
.service_comment_actions .selected_emoji ul li img{width:16px;height:16px}
#tiptip_holder{z-index:999999;}
/*=== end===*/

.service_comment_wrapper .reply_comment_list .comment_li_cell{border:0!important;padding-left: 0px;padding-right: 0px}
.service_comment_wrapper .reply_comment_list .comment_li_cell img.media-object{width: 40px}
.service_comment_wrapper .reply_comment_list .comment_li_cell .comment_body {position: relative;width: calc(100% - 40px); display: inline-block;padding-left: 20px}
.service_comment_wrapper .add_reply_content{padding-top:10px;;margin-top: 10px;border-top: 1px solid #e1e1e1}
.service_comment_wrapper .add_reply_content .add_reply_btn{color:#009AFF;cursor: pointer}
.service_comment_wrapper .add_reply_content .add_reply_btn i{color:#009AFF;}
.service_comment_wrapper .add_reply_content .reply_content_textarea{margin-top: 10px;display: none}
.service_comment_wrapper .add_reply_content .reply_comment_textarea{width:100%;display: inline-block}


.right_col_inner .widget_title{margin-top: 10px;}
.right_col_inner .widget_title span{
    display: block;
    margin: 0 15px;
    padding: 0 10px 2px 0px;
    border-bottom: 1px solid #ccc;
    line-height: 20px;
    font-weight: bold;
    font-size: 12px;
}

.right_col_inner .widget_title span.associated_orders{
    padding-left: 20px;
    background: url("/images/apps/report/report_category/order.png") no-repeat scroll 0 0 transparent;
}

.right_col_inner .widget_title span.associated_costings{
    padding-left: 20px;
    background: url("/images/apps/report/report_category/costing.png") no-repeat scroll 0 0 transparent;
}

.order_avtivity_highlight{color: #009AFF;font-weight: bold;}

 

/* js file upload error  */
#plupload_file_upload_error_tips{border: 1px red solid;padding: 5px;background-color:#fef1ec;margin-top: 10px;display: none}
#plupload_file_upload_error_tips a{float: right;margin-right: 10px;color: red;text-decoration: underline}

/*widget app history*/
#service_for_history_view table th{border-bottom-width: 1px;} 
#service_for_history_view .log_search_loading{position: absolute;right: 20px;top: 7px;display: none} 
#service_for_history_view .search_delete_btn{position: absolute;right: 25px;top: -4px;font-size: 25px;color: #777;display: none} 
#service_for_history_view .search_delete_btn:focus{text-decoration: none} 
#service_for_history_view table .highlight{
    background-color: #ffd76e;
    color: #000;
    font-weight: normal;
}

/**  top_bread_crumb  **/
#header_bread_crumb{ margin-top: 55px}
#top_bread_crumb{ width: 1162px; line-height: 18px; margin: 0 auto; position: relative}
#top_bread_crumb .top_bread_crumb_list li{ float: left; font-size: 12px;}
#top_bread_crumb .top_bread_crumb_list li a{ color: #309ccc; cursor: pointer; text-decoration: underline}
#top_bread_crumb .help{ position: absolute; right: 0; color: #309ccc; background: url('/images/3rd/famicons/information.png') no-repeat; padding-left: 20px; height: 16px; line-height: 16px;}
#top_bread_crumb .breadcrumb_break{ margin: 0 3px -1px;}

#jcrop_catch_wrapper .jcrop-holder{margin: 0 auto}

#popup_app_system_message .gray_btn{width: auto;}
#popup_app_system_message .content{padding: 20px 10px 0px 10px;}
#popup_app_system_message table td{padding: 5px;}


/* popup popup_order_bulk_style_link */
#popup_order_bulk_style_link .style_link_list{color: #615d5d}
#popup_order_bulk_style_link .style_link_list{padding: 20px 15px 0px 15px;}
#popup_order_bulk_style_link .style_link_list ul li{padding: 5px}
#popup_order_bulk_style_link .style_link_list ul li a{color: #309ccc;text-decoration: underline}

/* mulit select */
.multiselect{border-color: #d2d6de;width: 60%;height: 350px !important;}
.ui-multiselect {border: 1px solid #ccc;}
.ui-multiselect div.available {border-left: 1px solid #ccc;}

/* exception error 404 403*/
.exception_error_wrapper{
    margin-top: 8%;
}
.exception_error_wrapper hr{
    border-top: 0
}
.exception_error_wrapper_text{
    font-family: 'Roboto', sans-serif;
    font-size: 24px;
}
.exception_error_wrapper_btn{
    border-radius: 50px;
    font-size: 12px !important;
}
.exception_error_common_text{
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue","PingFang SC","Hiragino Sans GB","Microsoft Yahei",sans-serif;
}
.exception_error_wrapper_icon{
    width: 70px;
    height: 61.25px;
    color: #FDAB3D;
    font-size: 70px;
    margin-bottom: 1.5rem;
}
.exception_sub_text{
    font-size: 14px !important;
    color: #6E7175;
}
.exception_error_code{position: relative;}
.exception_error_code h1{
    font-size:150px;
    font-weight:800;
}
.exception_error_code img{
    left: 200px;
    max-width: 100px;
    position: absolute;
    top: -25px;
}

/*js file upload error*/  
#plupload_file_upload_error_tips{border: 1px red solid;padding: 5px;background-color:#fef1ec;margin-top: 10px;display: none}
#plupload_file_upload_error_tips a{float: right;margin-right: 10px;color: red;text-decoration: underline} 
 
#popup_order_bulk_source_link ul{margin: 0;}
#popup_order_bulk_source_link li{padding: 5px;}

/* ------------------------------ common sf2 ------------------------------ */
body{
    background-color:#f9f9f9;
    /*position:relative;*/
    /*min-width: 1270px;*/
    font-size: 13px;
}
.form-control::-moz-placeholder{color: #777}
.form-control{
    border-radius: 4px !important;
    color:rgba(0, 0, 0, 0.85);
}
.form-control:focus {
    background-color: none;
    border-color: var(--colour-blue-1);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6);
    outline: 0 none;
}
.btn{
    font-size: 13px;
}
.table{margin: 0}

strong, b{
    font-weight:700;}

.font-bold{
    font-weight: bold !important;
}

.black{
    color: #000;
}

.transit{
    transition: all 0.5s;
    -moz-transition: all 0.5s; 
    -webkit-transition: all 0.5s; 
    -o-transition: all 0.5s;}


a:focus{
    outline:none;}

a:hover{
    text-decoration:none;}

/*****************************
Loader
*****************************/

.loading-container {
    position:fixed;
    background-color:#f9f9f9;
    z-index:9;
    top: 0;
    left: 0;
    height:100%;
    width:100%;
    cursor:wait;
}

.loading {
    width: 40px;
    height: 40px;
    position: absolute;
    top: 0;
    left: 0;
    bottom:0;
    right:0;
    margin:auto;
    transform: rotate(45deg);  
}

.loading div {
    width: 16px;
    height: 16px;
    position: absolute;
}

.l1 div, .l2 div, .l3 div, .l4 div {
    width: 100%;
    height: 100%;
}

.l1 div{ background-color:#00BCFF;}
.l2 div{ background-color:#FF0F00;}
.l3 div{ background-color:#73CC00;}
.l4 div{ background-color:#000300;}

.l1 { transform: translate(0,0); }
.l2 { transform: translate(0,16px); }
.l3 { transform: translate(16px,0px); }
.l4 { transform: translate(16px,16px); }

@keyframes rot1 {
    0%{ transform: rotate(0deg); }
    40%{ transform: rotate(0deg); }
    50%{ transform: rotate(0deg); }
    60%{ transform: rotate(90deg); }
    100%{ transform: rotate(90deg); }
}

@keyframes rot2 {
    0%{ transform: rotate(0deg); }
    40%{ transform: rotate(0deg); }
    50%{ transform: rotate(0deg); }
    60%{ transform: rotate(-90deg); }
    100%{ transform: rotate(-90deg); }
}

@keyframes rot3 {
    0%{ transform: rotate(45deg); }
    35%{ transform: rotate(45deg); }
    65%{ transform: rotate(405deg); }
    100%{ transform: rotate(405deg); }
}

@keyframes l1-rise {
    0%{ transform: translate(0px,0px); }
    30%{ transform: translate(-4px, -4px); }
    70%{ transform: translate(-4px, -4px); }
    100%{ transform: translate(0px, 0px); }
}

@keyframes l2-rise {
    0%{ transform: translate(0,16px); }
    30%{ transform: translate(-4px, 20px); }
    70%{ transform: translate(-4px, 20px); }
    100%{ transform: translate(0,16px); }
}

@keyframes l3-rise {
    0%{ transform: translate(16px, 0px); }
    30%{ transform: translate(20px, -4px); }
    70%{ transform: translate(20px, -4px); }
    100%{ transform: translate(16px, 0px); }
}

@keyframes l4-rise {
    0%{ transform: translate(16px,16px); }
    30%{ transform: translate(20px, 20px); }
    70%{ transform: translate(20px, 20px); }
    100%{ transform: translate(16px,16px); }
}



.l1 { animation: l1-rise 3s ease 0s infinite; }
.l2 { animation: l2-rise 3s ease 0s infinite; }
.l3 { animation: l3-rise 3s ease 0s infinite; }
.l4 { animation: l4-rise 3s ease 0s infinite; }

.l1 div, .l4 div { animation: rot1 3s ease 0s infinite; }
.l2 div, .l3 div { animation: rot2 3s ease 0s infinite; }

/*****************************
Left Panel (aside navigation)
*****************************/

aside.left-panel{
    background-color:#2b2f3e !important;
    width:230px;
    /*position:fixed;*/
    padding:15px 0px;
    /*box-shadow:inset -5px 0px 8px rgba(0,0,0,0.3);*/
    height:100%;
    top:0px;
    left:0px;
}
aside.main-sidebar .user_info{width: 75px;height: 70px;}	
aside.left-panel.collapsed{
    overflow:visible !important;
    /*position:absolute;*/
    bottom:0px;}

/*** Aside sizes ***/
aside.left-panel.lg{width:250px;}
aside.left-panel.lg + .content{margin-left:250px;}

/*** Aside Collapsed ***/
/*@media (min-width: 768px) {*/
aside.left-panel.collapsed{	width:75px;	text-align:center;}
aside.left-panel.collapsed + .content{	margin-left:75px;}
aside.left-panel.collapsed .user .user-login,
aside.left-panel.collapsed h4.user-name,
aside.left-panel.collapsed span.nav-label{	display:none;}	
aside.left-panel.collapsed .navigation > ul > li > a{	padding:20px;line-height: 17px;}	
/*aside.left-panel.collapsed .navigation > ul > li.active > a{	color: #fff}*/	
.skin-black .sidebar a{color: inherit !important}
aside.left-panel.collapsed .navigation > ul > li.has-submenu:after{	display:none;}
/*}*/

/*****************************
User
*****************************/
/*.user{	margin-bottom:35px;}*/
.user h4.user-name{
    color:#8e909a;
    word-break:break-all;
    font-size:16px;}

aside.left-panel .user{width: 75px;height: 70px}
aside.left-panel .user img{
    border:1px solid #383c4a;
    padding:8px;
    width:70px;}	

/*****************************
Navigation
*****************************/

.navigation{	margin:20px 0px;}
.navigation > ul > li{	position:relative;}
.navigation > ul > li.has-submenu:after{
    content:"\f105";
    font-family: 'Font Awesome 5 Pro';
    display:inline-block;
    position:absolute;
    color:#7a7e8a;
    right:15px;
    transition: all 0.4s;
    -moz-transition: all 0.4s; 
    -webkit-transition: all 0.4s; 
    -o-transition: all 0.4s;
    top:10px;
    visibility:hidden;}

.navigation > ul > li.active.has-submenu:after,
.navigation > ul > li.has-submenu:hover:after{	color:#fff;}
.navigation > ul > li > a{
    display:block;
    padding:12px 25px;
    color:#7a7e8a;
    text-transform:uppercase;
    /*font-size:22px;*/
    text-decoration:none;
    font-weight:800;
    border-bottom:1px solid #2f3444;
    transition: all 0.4s;
    -moz-transition: all 0.4s; 
    -webkit-transition: all 0.4s; 
    -o-transition: all 0.4s;}

.navigation > ul:hover > li.active > a{
    background-color:transparent;
    box-shadow:none;
    color:#7a7e8a;}

.navigation > ul > li:hover > a,
.navigation > ul > li.active:hover > a,
.navigation > ul > li.active > a{
    color:#fff;
    background-color: #ff404b;
    -webkit-box-shadow: inset -6px 0 8px -2px rgba(0,0,0,0.3);
    box-shadow: inset -6px 0 8px -2px rgba(0,0,0,0.3);}

.navigation ul li a i{
    margin-right:6px;
    font-size:22px;}


/*** Sub Menu ***/
.navigation ul li ul{
    display:none;
    background-color:#333747;
    -webkit-box-shadow: inset -6px 0 8px -2px rgba(0,0,0,0.2);
    box-shadow: inset -6px 0 8px -2px rgba(0,0,0,0.2);}


/*aside:not(.collapsed) .navigation ul li.active ul{	display:block;}*/

.navigation ul li ul li a{
    padding:8px 15px;
    margin: 0 10px;
    color:#7a7e8a;
    text-decoration:none;
    white-space:nowrap;
    transition: all 0.2s;
    -moz-transition: all 0.2s; 
    -webkit-transition: all 0.2s; 
    -o-transition: all 0.2s;
    font-size:13px;
    border-left:0px solid #5e6271;
    text-align:left;
    display:block;}

.navigation ul li ul li a:hover,
.navigation ul li ul li.active a{
    border-left:5px solid #5e6271;
    color:#7a7e8a;}

/*** Aside Collapsed Sub Menu ***/
/*@media (min-width: 768px) {*/
aside.left-panel.collapsed .navigation ul li ul{
    position:absolute;
    z-index:3;
    left:100%;
    top:0px;
    background-color:#fff;
    box-shadow:none;
    padding:10px 0px;
    min-width:200px;
    border:1px solid #dddddd;}

aside.left-panel.collapsed .navigation ul li ul:before{
    display:block;
    content:"";
    height:20px;
    width:20px;
    border-color: transparent #F2F2F4 transparent transparent;
    border-width:10px;
    border-style:solid;
    position:absolute;
    cursor:pointer;
    right:100%;
    top:22px;}

aside.left-panel.collapsed .navigation > ul > li:hover > ul{	display:block !important;}
aside.left-panel.collapsed .navigation ul li ul li a{
    border:0px;
    color:#666666;
    border-bottom:1px dashed #ECECEE;}
/*}*/
.main_left_nav li.module_name{
    font-weight: bold;
}
.main_left_nav li.module_name a{
    padding-left: 10px;
    border-bottom: 1px solid #ececee !important;
}
.main_left_nav li.module_name:hover{
    background: none !important;
}
.main_left_nav .child_item li:last-child a{
    border: 0 !important;
}
.main_left_nav .child_item .module_name{
    /*width: 600px;*/
}
.main_left_nav .child_item .child_li{
    width: 230px;
    float: left;
}
aside.left-panel.collapsed .navigation ul li ul li:hover{
    background: #f2f2f4;
}

/*****************************
Top Header
*****************************/

header.top-head{
    position: fixed;
    width: 100%;
    float: left;
    background-color:#f2f2f4;
    border-bottom:1px solid #ececee;
    padding-top:4px;
    padding-bottom:4px;
    z-index: 3;
    min-width: 620px;
    padding-right: 10px;
}

.navbar-toggle{
    margin:8px 20px 8px 0px;
    display:block;
    padding-left:0px;}

.navbar-toggle .icon-bar{
    background-color:#b3b3be;}

header.top-head .app-search{
    position:relative;
    margin-top:8px;
    margin-bottom:8px;
}

.app-search .form-control,
.app-search .form-control:focus{
    border:1px solid #d3d3db;
    font-size:13px;
    padding-left:30px;
    height: 33px;
    box-shadow:none;}

/*.app-search:before{*/
.app-search .app-search-icon:before{
    content:"\f002";
    font-family: 'Font Awesome 5 Pro';
    cursor:pointer;
    color: #6E7175;
    z-index: 3;
    display:inline-block;
    width: 30px;
    position: absolute;
    font-weight: 300; 
    line-height: 32px;
    margin-left: 12px;
    font-size: 14px;
}

.app-search .form-control::-moz-placeholder {	color:#c4c4cd;}

header.top-head{padding-left: 80px;}
header.top-head .user_avatar{
    float: left;
    background: #f2f2f4 none repeat scroll 0 0 !important;
    position: absolute;
    top: 0;
    left: 10px;
    width: 59px;
    height: 59px;
    border-radius: 50%;
    border: 1px solid #d5d5d5;
    z-index: 2;
}
header.top-head .user_avatar img{
    max-width: 56px;
    max-height: 56px;
}
header .top_search_wrapper{
    text-align: center;
    position: absolute;
    width: 100%;
    margin: 0 auto;
    left: 0;
}
header .top_search_wrapper .input-group{
    margin: 0 auto;
    display: inline-block;
    position: relative;
}
header .top_search_wrapper .input-group input{
    width: 250px;
}
header .top_search_wrapper .input-group .input-group-btn{
    float: left;
}
header .top_search_wrapper .input-group .popup_advanced_search_filter{
    margin-left: 40px;
    line-height: 33px;
    text-decoration: none;
}

#main_nav_tab{
    position: fixed;
    top: 55px;
    width: 100%;
    z-index: 12;
    background: #fff;
    border-radius: 0px;
    padding: 15px 10px 10px 20px;
    margin-bottom: 0px;
    /* border-bottom: 1px solid #e1e1e1; */
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
    display: flex;
    align-items: center;
    gap: 8px;
}

#main_nav_tab .home {
    display: flex;
    align-items: center;
    gap: 8px;
}
#main_nav_tab a{
    color: #6E7175 !important;
    font-size: 14px !important;
}
#main_nav_tab i {
    color: #6E7175 !important;
    font-size: 14px !important;
}
/* #main_nav_tab > li + li::before{
    color: #6E7175 !important;
} */
.breadcrumb-item-container{
    display: flex !important;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: var(--colour-text-2);
}
.breadcrumb-items {
    display: flex !important;
    gap: 8px;
    align-items: center;
}
.breacrumb-icon{
    margin-left: 1px;
}
.breadcrumb-text{
    color: #6E7175 !important;
    font-size: 14px !important;
}

/*** Nav Toolbar (right)***/
header .navbar-default .navbar-nav > li > a{	color:#b3b3be;}

/*** Nav Toolbar (right)***/

.nav-toolbar{
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: unset !important;
    margin-bottom: unset !important;
}

.nav-toolbar > li{
    padding:0px;
    display:inline-block;
    margin-left:5px;
    position:relative;
    list-style:none;}

.nav-toolbar li span.badge{
    position:absolute;
    top:-3px;
    right:-3px;
    background-color:#8d82b5;
    font-weight:300;
    cursor:pointer;
    height:18px;
}
.app-icon{
    font-size: 14px;
    color: #6E7175;
}

.nav-toolbar li span.badge.bg-info{	background-color:#292F4C;}
.nav-toolbar li span.badge.bg-warning{	background-color:#292F4C;}

.nav-toolbar .avatar-photo img{
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid #d5d5d5;
}

.nav-toolbar > li > a{
    color:#292f4c;
    font-size:18px;
    height:34px;
    width:34px;
    text-align:center;
    display:block;
    padding:4px;}

.nav-toolbar > li > a:hover,.nav-toolbar > li > a:focus{
    color:#292f4c;
}	
.nav-toolbar > li > a i.fal{
    color:#292f4c !important;
}

.nav-toolbar .dropdown-menu.panel{
    padding-top:0px;
    padding-bottom:0px;
    z-index: 9999;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.176);
}

.panel-heading-new{
    background-color:#fff !important;
    border: none;
    padding: 0px !important;
}
.dropdown-custom{
    padding: 10px;
}
.nav-toolbar .sidebar-dialog-node{
    display: none
}
.avatar-photo:hover + .sidebar-dialog-node,
.sidebar-dialog-node:hover {
    display: block;
}


.nav-toolbar .sidebar-dialog-node a{color: inherit}
.nav-toolbar .sidebar-dialog-node .ds-dialog-content-wrapper{
    position: absolute;
    z-index: 1001;
    border-radius: 8px;
    width: 220px;
    box-shadow: 0 4px 17px 6px rgba(0, 0, 0, 0.1);
    border: 1px solid #dddddd;
    background-color: white;
    padding-top: 5px;
    padding-bottom: 5px;
    top: 28px;
    right: 0;
}
.nav-toolbar .sidebar-dialog-node .ds-dialog-content-wrapper .sidebar-dialog-section{
    border-bottom: 1px #ECECEE solid
}
.nav-toolbar .sidebar-dialog-node .ds-dialog-content-wrapper .sidebar-dialog-section:last-child{
    border-bottom: 0
}
.nav-toolbar .sidebar-dialog-node .ds-dialog-content-wrapper .sidebar-dialog-section .sidebar-dialog-item{
    padding: 10px 15px;
}
.nav-toolbar .sidebar-dialog-node .ds-dialog-content-wrapper .sidebar-dialog-section .sidebar-dialog-item:hover{
    background-color: #f2f2f4;
    cursor: pointer;
}
.nav-toolbar .sidebar-dialog-node .ds-dialog-content-wrapper .sidebar-dialog-section .sidebar-dialog-item .dialog-title{
    margin-left: 6px
}
.sidebar-dialog-section-item{
    padding: 10px 15px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.sidebar-dialog-section-item:hover{
    background-color: #F5F5F5;
    cursor: pointer;
}
.fav-report-component, .fav-search-component {
    display: none;
}
#advance-search:hover{
    cursor: pointer;
}

/*****************************
Content Area (right)
*****************************/

/*.content{	margin-left:230px;}*/
.content > .container-fluid{
    padding-left:25px;
    padding-right:25px;}

.warper{
    padding-top:20px;
    margin-bottom: 45px;
    padding-bottom:20px;
    min-height:600px;}


/*** Page Header / Page Title ***/
.page-header{
    margin:0px;
    margin-bottom: 15px;
    border:0px;}

.page-header h1{
    color:#84868e;
    font-weight:300;
    font-size:32px;
    margin-top:15px;
    margin-bottom:20px;}

.page-header *{	font-weight:300;}

.page-header * small{
    font-size:14px;
    color:#9D9EA5;}

/*****************************
Custom Margins & Paddings
*****************************/

.no-margn{	margin:0px !important;}
.margn-xs{	margin:5px;}
.margn-sm{	margin:10px;}
.margn-md{	margin:15px;}
.margn-lg{	margin:20px;}
.margn-t-xs{	margin-top:5px;}
.margn-t-sm{	margin-top:10px;}
.margn-t-md{	margin-top:15px;}
.margn-t-lg{	margin-top:20px;}
.margn-b-xs{	margin-bottom:5px;}
.margn-b-sm{	margin-bottom:10px;}
.margn-b-md{	margin-bottom:15px;}
.margn-b-lg{	margin-bottom:20px;}
.margn-l-xs{	margin-left:5px;}
.margn-l-sm{	margin-left:10px;}
.margn-l-md{	margin-left:15px;}
.margn-l-lg{	margin-left:20px;}
.margn-r-xs{	margin-right:5px;}
.margn-r-sm{	margin-right:10px;}
.margn-r-md{	margin-right:15px;}
.margn-r-lg{	margin-right:20px;}
.no-padd{	padding:0px !important;}
.padd-xs{	padding:5px;}
.padd-sm{	padding:10px;}
.padd-md{	padding:15px;}
.padd-lg{	padding:20px;}
.padd-t-xs{	padding-top:5px;}
.padd-t-sm{	padding-top:10px;}
.padd-t-md{	padding-top:15px;}
.padd-t-lg{	padding-top:20px;}
.padd-b-xs{	padding-bottom:5px;}
.padd-b-sm{	padding-bottom:10px;}
.padd-b-md{	padding-bottom:15px;}
.padd-b-lg{	padding-bottom:20px;}
.padd-l-xs{	padding-left:5px;}
.padd-l-sm{	padding-left:10px;}
.padd-l-md{	padding-left:15px;}
.padd-l-lg{	padding-left:20px;}
.padd-r-xs{	padding-right:5px;}
.padd-r-sm{	padding-right:10px;}
.padd-r-md{	padding-right:15px;}
.padd-r-lg{	padding-right:20px;}

/*****************************
Styled Radio/Checkbox
*****************************/

.cr-styled{
    display:inline-block;
    margin:0px 2px;}

.cr-styled i{
    display:inline-block;
    height:20px;
    width:20px;
    cursor:pointer;
    vertical-align:middle;
    border:2px solid #CCC;
    border-radius:3px;
    text-align:center;
    padding-top:1px;
    font-family: 'Font Awesome 5 Pro';}

.cr-styled input{
    visibility:hidden;
    display:none;}

/* Checkbox */
.cr-styled input[type=checkbox]:checked + i:before{	content: "\f00c";}
label.cr-styled.disabled{
    background-color: #f5f5f5 !important;
    cursor: not-allowed !important; 
    opacity: 1 !important;
}
label.cr-styled.disabled .fa{
    cursor: not-allowed !important; 
}
/* Radio */
.cr-styled input[type=radio] + i{	border-radius:20px;}	
.cr-styled input[type=radio]:checked + i:before{	content: "\f111";}

/*** cr-styled Theaming/Colorss ***/
.cr-styled input:checked + i{	border-color:#a49bc4;	color:#a49bc4;}

/*****************************
 Pages / Widgets / Elements 
*****************************/

/****Dashboard Stats****/

.dashboard-stats.panel{
    position:relative;
    cursor:pointer;
    padding:10px 10px 10px 106px;}

.dashboard-stats i.fa.stats-icon{
    width:80px;
    padding:20px;
    font-size:40px;
    position:absolute;
    margin-left:10px;
    left:0px;
    top:10px;
    text-align:center;
    z-index:1;
    color:#fff;
    height:80px;}

.dashboard-stats.rounded i.fa.stats-icon,
.dashboard-stats.rounded.panel{	border-radius:50px;}
.dashboard-stats .sparkline{
    position:absolute;
    left:30px;
    top:20px;
    opacity:0;}

.dashboard-stats h3{	margin-top:14px;}
.dashboard-stats small{
    font-size:14px;
    margin-left:6px;
    opacity:0.8;}	

.dashboard-stats:hover i.fa.stats-icon{
    /*right:10px;*/
    left:100%;
    margin-left:-90px;}

.dashboard-stats:hover h3,
.dashboard-stats:hover p{	opacity:0;}
.dashboard-stats:hover .sparkline,
.dashboard-stats:hover i.fa.stats-icon{	opacity:1;}

/****Messages-Chating****/

.messages{
    max-height:520px;
    overflow:auto;
}

.messages .media{
    padding-top:18px;
    padding-bottom:18px;
    margin:0px;
    border-top:1px dashed #eaeef1;}

.messages .media:first-child{	border:0px;}
.messages .media .media-body .media{
    margin-top:18px;
    padding-bottom:0px;}

/*user status icon*/
.user-status{
    position:relative;
    display:inline-block;}

.user-status:before,
.user-status:before{
    content:"";
    display:inline-block;
    height:12px;
    width:12px;
    border-radius:100%;
    background-color:#666;
    position:absolute;
    top:0px;
    right:0px;
    border:2px solid #fff;}

/*user status icon color*/	
.user-status.online:before{	background-color:#70ba63;}
.user-status.busy:before{	background-color:#01a0e6;}
.user-status.invisibled:before{	background-color:#f2b635;}
.user-status.offline:before{	background-color:#f25648;}
.messages .media > .pull-left{	margin-right:15px;}
.messages .media > .pull-right{	margin-left:15px;}
.messages .media > .pull-right + .media-body{	text-align:right;}	
.messages .media img.media-object{	width:54px;	border-radius:100%;}
.messages .media .media-body{	font-size:13px;}

/****ToDo List****/
.todo-list li{
    border:0px;
    margin:0px;
    border-radius:0px;
    border-bottom:1px dashed #e0e0e0;}

/****Activities List****/

.activities-list{
    max-height:560px;
    overflow:auto;}

.activities-list > li{
    position:relative;
    padding:10px 95px 10px 40px;}

.activities-list > li:before{
    content:"";
    position:absolute;
    left:15px;
    top:0px;
    height:100%;
    border-left:1px solid #ccc;}

.activities-list > li:after{
    content:"";
    position:absolute;
    left:10px;
    top:10px;
    height:12px;
    width:12px;
    border-radius:20px;
    border:1px solid #ccc;
    background-color:#fff;}

.activities-list > li span.time{
    font-size:12px;
    color:#ccc;}

.activities-list li .activity-actions{
    position:absolute;
    right:0px;
    top:25px;}

.activities-list > li.info-activity:before,
.activities-list > li.info-activity:after{	border-color:#4fcdfc;}
.activities-list > li.warning-activity:before,
.activities-list > li.warning-activity:after{	border-color:#fcd036;}
.activities-list > li.danger-activity:before,
.activities-list > li.danger-activity:after{	border-color:#ff6264;}
.activities-list > li.success-activity:before,
.activities-list li.success-activity:after{	border-color:#68b828;}
.activities-list > li.primary-activity:before,
.activities-list > li.primary-activity:after{	border-color:#7c38bc;}
.activities-list > li.info-activity:before,
.activities-list > li.info-activity:after{	border-color:#4fcdfc;}

/*****************************
Footer
*****************************/

.footer {
    background-color: #f2f2f4;
    border-top: 1px solid #ececee;
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 99999;
    height: auto !important;
}
.footer img{margin-right: 14px;height: 23px;}
.footer .copyright{
    font-size: 13px;
    line-height: 22px;
}

/***********************************************
================================================
 Custom Bootstrap / Overwriting
================================================
************************************************/

/*****************************
 Grid
*****************************/

.row.no-gutter {
    margin-left: 0;
    margin-right: 0;}

.row.no-gutter [class*="col-"]:not(:first-child),
.row.no-gutter [class*="col-"]:not(:last-child) {
    padding-left: 0;
    padding-right: 0;
}

/*****************************
 Color >> Backgrounds + Text 
*****************************/

.bg-white{	background-color:#fff!important;}
.text-white{	color:#fff !important;}
.text-white i{	color:#fff !important;}

.bg-pink{	background-color:#eaa1bd;}
.text-pink{	color:#eaa1bd;}

.bg-yellow{	background-color:#f9dc85;}
.text-yellow{	color:#f9dc85;}

.bg-gray{	background-color:#b2b2b2;}
.text-gray{	color:#b2b2b2 !important;}

.bg-lightgray{	background-color:#fbfbfd;}
.text-lightgray{	color:#fbfbfd;}

.bg-red{	background-color:#FF158A !important;}
.text-red{	color: #FF158A !important}
.text-red i{	color: #FF158A !important}

.bg-blue{	background-color:#009AFF;}
.text-blue{	color:#009AFF!important;}

.bg-green{	background-color:#00A65A;}
.text-green{	color:#00A65A !important;}
.text-green i{	color:#00A65A !important;}

.bg-purple{	background-color:#8d82b5;}
.text-purple{	color:#8d82b5;}		

.bg-yellow{	background-color:#F9A43E;}
.text-yellow{	color:#F9A43E;}

.bg-orange{	background-color:#F58559;}
.text-orange{	color:#F58559;}			

.bg-test{	background-color:#79B9D9;}
.text-test{	color:#79B9D9;}

.bg-warning{	background-color:#FEB252;}
.text-warning{	color:#FEB252;}

.bg-danger{	background-color:#E9573F;}
.text-danger{	color:#E9573F !important;}

.bg-success{	background-color:#70BA63;}
.text-success{	color:#70BA63 !important;}

.bg-info{	background-color:#4DC5F9;}
.text-info{	color:#4DC5F9;}	

.bg-dark{	background-color:#292f4c;}
.text-dark{	color:#292f4c;}

/*****************************
 Form Elements
*****************************/

/*** Custom Colors Btn ***/
.btn-purple{
    background-color:#8d82b5;
    border-color:#6b5f98;
    color:#fff;}

.btn-purple:hover,
.btn-purple:focus,
.btn-purple:active,
.btn-purple.active,
.open .dropdown-toggle.btn-purple{
    background-color:#6b5f98;
    color:#fff;}

.btn-green{
    background-color:#70ba63;
    border-color:#579e4b;
    color:#fff;}

.btn-green:hover,
.btn-green:focus,
.btn-green:active,
.btn-green.active,
.open .dropdown-toggle.btn-purple{
    background-color:#579e4b;
    color:#fff;}

/*** Btn Shapes ***/
.btn-circle,
.form-control-circle,
.btn-group .btn-circle:first-child:not(:last-child):not(.dropdown-toggle){
    border-radius:50px;}

.btn-flat,
.form-control-flat{
    border-radius:0px;}

/*****************************
Form Elements
*****************************/

.has-feedback div[class*=col-] .form-control-feedback{	right:15px;	line-height:34px;}

/*****************************
Panel Styling
*****************************/

.panel{	margin-bottom:20px;}
.panel-heading{	font-weight:700;}
.panel-heading small,
.panel-heading span,
.panel-heading.un-bold{	font-weight:400;}

/*** default ***/	
.panel-default > .panel-heading,
.panel-default > .panel-footer{
    border-color: #e8e8eb;
    box-shadow:none;
}		

.panel-default > .section-panel-title{	
    font-weight: normal;
    font-size: 20px;
}

/*** primary ***/
.panel-primary{	border-color:#8d82b5;}
.panel-primary > .panel-heading,
.panel-primary > .panel-footer{
    border-color: #8d82b5;
    background-color:#8d82b5;
    box-shadow:none;}

/*** success ***/
.panel-success{	border-color:#70ba63;}
.panel-success > .panel-heading,
.panel-success > .panel-footer{
    border-color: #70ba63;
    background-color:#70ba63;
    color:#fff;
    box-shadow:none;}

/*** info ***/
.panel-info{	border-color:#4cbceb;}
.panel-info > .panel-heading,
.panel-info > .panel-footer{
    border-color: #4cbceb;
    background-color:#4cbceb;
    color:#fff;
    box-shadow:none;}

/*** warning ***/
.panel-warning{	border-color:#feb252;}
.panel-warning > .panel-heading,
.panel-warning > .panel-footer{
    border-color: #feb252;
    background-color:#feb252;
    color:#fff;
    box-shadow:none;}

/*** danger ***/
.panel-danger{	border-color:#e35b5a;}
.panel-danger > .panel-heading,
.panel-danger > .panel-footer{
    border-color: #e35b5a;
    background-color:#e35b5a;
    color:#fff;
    box-shadow:none;}

/*** Clean Panel Heading ***/
.panel-heading.clean,
.panel-footer.clean{
    background:none;
    border:none;}

/*****************************
 Dropdown
*****************************/
.dropdown { word-break: break-all;}
.dropdown-menu{}
.dropdown-menu > li > a{color:#84868e;}

/*** Dropdown Menu Sizes ***/
.dropdown-menu.md{	min-width:300px}
.dropdown-menu.lg{	min-width:400px;}
.dropdown-menu.arrow:after,
.dropdown-menu.arrow:before{
    content:"";
    display:block;
    position:absolute;
    height:11px;
    width:11px;
    border-color:inherit;
    border-style:solid;
    border-width:11px;
    border-top-color:transparent;
    border-left-color:transparent;
    border-right-color:transparent;
    border-bottom-color:transparent;
    position:absolute;
    bottom:100%;
    left:6px;}

.dropdown-menu.arrow.arrow-top-right,
.dropdown-menu.arrow.arrow-top-left{top:calc(100% + 15px);}

/**Top Right Arrow**/
.dropdown-menu.arrow.arrow-top-right:after,
.dropdown-menu.arrow.arrow-top-right:before{
    border-bottom-color:inherit;
    right:6px;
    left:auto;}

.dropdown-menu.arrow.arrow-top-right:before{	right:5px;	left:auto;}
.dropdown-menu.arrow.arrow-top-right:after{	border-bottom-color:#fff;}

/**Top Left Arrow**/
.dropdown-menu.arrow.arrow-top-left:after,
.dropdown-menu.arrow.arrow-top-left:before{
    border-bottom-color:inherit;
    left:6px;
    left:auto;}

.dropdown-menu.arrow.arrow-top-left:before{	left:5px;}
.dropdown-menu.arrow:after{
    height:10px;
    width:10px;
    border-width:10px;}

.dropdown-menu.arrow.panel-default:after{	border-bottom-color:#F5F5F5;}
/*****************************
Progress Bars
*****************************/

.progress.progress-xxs{	height:4px;}
.progress.progress-xs{	height:8px;}
.progress.progress-sm{	height:12px;}
.progress.progress-lg{	height:24px;}

/*****************************
Horizaontal Row
*****************************/
hr.sm{	margin-top:15px;	margin-bottom:15px;}
hr.xs{	margin-top:10px;	margin-bottom:10px;}
hr.dotted{	border-style:dashed;}
hr.clean{	border:0px;}

/*****************************
Tabs with panel
*****************************/

.panel.tab-pane.tabs-up{
    border-top:0px;
    border-top-left-radius:0px;
    border-top-right-radius:0px;}

/****************************************
=========================================
Responsive Stying
=========================================
*****************************************/

@media (max-width: 768px) {
    aside.left-panel.collapsed{
        width:75px;
        left:0px;
        /*overflow:hidden !important;*/
    }

    aside.left-panel.collapsed + .content{
        margin-left:0px;
        transform:translate3d(250px, 0px, 0px);
        -ms-transform:translate3d(250px, 0px, 0px); 
        -webkit-transform:translate3d(250px, 0px, 0px); 
        -moz-transition: translate3d(250px, 0px, 0px);
        -o-transition: translate3d(250px, 0px, 0px)}

    aside.left-panel{		left:100%;}
    section.content{		margin-left:0px;}
    .content > .container-fluid{
        padding-left:15px;
        padding-right:15px;}

    .page-header h1{
        margin-top:0px;}

    #main_nav_tab{
        padding-left:15px;
        padding-right:15px;}
}

@media (max-width: 450px) {
    .dropdown-menu{	min-width:280px !important;}
    .messages-dropdown{	right:-80px !important;}
    .messages-dropdown.arrow.arrow-top-right:after{		right:85px;}
    .messages-dropdown.arrow.arrow-top-right:before{		right:84px;}	
    .notifications{		right:-40px !important;}
    .notifications.arrow.arrow-top-right:after{		right:45px;}
    .notifications.arrow.arrow-top-right:before{		right:44px;}
}

/****************************************
=========================================
Just For Demo / Showcase
=========================================
*****************************************/

.showcase-btn li, .showcase-btn{	margin-bottom:10px;}
.showcase-switch-button{	margin-right:15px;}
.showcase-pagination{	margin-top:10px;	margin-bottom:10px;}

.showcase-icons div{
    line-height:40px;
    cursor:pointer;
    height:40px;}

.showcase-icons i{
    transition: font-size 0.2s ease 0s;
    text-align:center;
    width:40px;}
.showcase-icons > div:hover i{font-size:26px;}

/* metro popup */
.MessageBoxContainer {color: inherit;}
.MessageBoxButtonSection{display: none}
.MessageBoxMiddle{left: 0;margin: 0 auto}
.metro_popup_wrapper{margin-top: 20px;}
.metro_popup_wrapper .metro_popup_tmp{height: 0; width: 0; display: none;}
.metro_popup_wrapper h1{
    border-bottom: 1px solid #D2D2D2;
    padding-bottom:  5px;
    color: #84868e;
    font-size: 32px;
    font-weight: 300;
    margin-bottom: 20px;
    margin-top: 15px;
}
.metro_popup_wrapper .content{margin: 0 10px;padding: 20px 0;}
.metro_popup_wrapper .btns{
    text-align: right;
    margin: 0;
    padding-top: 20px;
    margin-top: 0px;
    border-top: 1px solid #D2D2D2;
}
/*.metro_popup_wrapper .btns a{
    height: 30px;
    width: 65px;
    background: #E7E5E5;
    color: #A3A3A3;
    padding: 9px 5px 5px 5px;
    line-height: 13px;
    text-align: center;
    font-size: 12px;
}*/
@media screen and (max-width:900px){
    #MsgBoxBack .auto_width{width: 70%}
}
@media screen and (min-width:900px){
    #MsgBoxBack .auto_width{width: 900px;}
}

.metro_popup_wrapper .gray_btn {margin:0 0px 0 10px;display: inline-block;font-size: 13px;opacity:1}
/*.metro_popup_wrapper .btns a:hover{background: #EDEAEA;}*/
.popup_holder{display: none}
#MsgBoxBack .popup_holder{display: block}
/*.metro_popup_wrapper a.blue_btn {background: #428bca;color: #FFFFFF;display: inline-block; margin-left: 5px;}
.metro_popup_wrapper a.blue_btn:hover {background: #357ebd;text-decoration: none}
.metro_popup_wrapper a.blue_btn:focus {text-decoration: none}*/
.metro_popup_wrapper table tr{line-height: 20px;}
.metro_popup_wrapper table tr > th{text-align: left;font-weight: normal;color: #999;padding: 5px;}
.metro_popup_wrapper table tr > td{padding: 5px;}

.metro_popup_wrapper .form-horizontal .form-group {margin-right: 0; margin-left: 0}
#jcrop_catch_wrapper .jcrop-holder {
    margin: 0 auto;
}

/* popup tcAlert */
#tcAlerts_popup_container #tcAlerts_popup_panel{
    width: 100%;
    height: 50px;
    padding-bottom: 26px;
    text-align:right;
    border-top: 1px solid #D2D2D2;
    padding-top: 20px;
    margin-bottom: 20px;
}
#tcAlerts_popup_container #tcAlerts_popup_panel a{font-size: 12px;}
#tcAlerts_popup_container #tcAlerts_popup_panel a.gray_btn{
    background: none repeat scroll 0 0 #E7E5E5;
    color: #A3A3A3;
    height: 30px;
    line-height: 13px;
    padding: 10px 5px;
    text-align: center;
    width: 65px;
    display: block;
    float: right;
    margin-left: 5px;
}

#tcAlerts_popup_container #tcAlerts_popup_panel a:hover{background: #EDEAEA;}
#tcAlerts_popup_container #tcAlerts_popup_panel a#tcAlerts_popup_ok{color: #FFF;background-color: #309ccc;}
#tcAlerts_popup_container #tcAlerts_popup_panel a#tcAlerts_popup_ok:hover{background: #35abe0;color: #FFF}
#tcAlerts_popup_container #tcAlerts_popup_title{
    font-size:26px;
    font-weight: 300;
    text-align:left;
    margin-top:30px;
    border-bottom: 1px solid #D2D2D2;
    color: #84868e;

}

#tcAlerts_popup_container #tcAlerts_popup_message{
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    font-size: 25px;
    font-weight: normal;
    padding: 20px 8px;
    text-align:left;
    min-height:35px;
}

@media screen and (max-width:830px){
    #tcAlerts_popup_container .auto_width{width: 70%}
}
@media screen and (min-width:830px){
    #tcAlerts_popup_container .auto_width{width: 830px;}
}

/* metro popup update higher */
.popup_holder2{display: none}
#tc_metro_popup_higher_container #tc_metro_popup_higher_panel{
    width: 100%;
    height: 50px;
    padding-bottom: 26px;
    text-align:right;
    border-top: 1px solid #D2D2D2;
    padding-top: 20px;
    margin-bottom: 20px;
}
#tc_metro_popup_higher_container #tc_metro_popup_higher_panel a{font-size: 12px;}
#tc_metro_popup_higher_container h3{
    font-size:25px;
    color:#615D5D;
    border-bottom: 1px solid #D2D2D2;
    padding-bottom:  5px;
    margin: 0px;
    font-weight: normal;
    background: none;
}
#tc_metro_popup_higher_container .btns{
    text-align: right;
    padding-top: 20px;
    border-top: 1px solid #D2D2D2;
    margin-top: 20px;
}
#tc_metro_popup_higher_container .btns .btn{
    margin-left: 10px;
}
#tc_metro_popup_higher_container .gray_btn {
    -moz-user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
    cursor: pointer;
    display: inline-block;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.42857;
    margin-bottom: 0;
    padding: 6px 12px;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    background-color: #f4f4f4;
    border-color: #ddd;
    opacity: 1;
    float: none;
}

#tc_metro_popup_higher_container table tr{line-height: 20px;}
#tc_metro_popup_higher_container table tr > th{text-align: left;font-weight: normal;color: #999;padding: 5px;}
#tc_metro_popup_higher_container table tr > td{padding: 5px;}

#tc_metro_popup_higher_container #tc_metro_popup_higher_panel a:hover{background: #EDEAEA;}
#tc_metro_popup_higher_container #tc_metro_popup_higher_panel a.popup_ok{color: #FFF;background-color: #309ccc;}
#tc_metro_popup_higher_container #tc_metro_popup_higher_panel a.popup_ok:hover{background: #35abe0;color: #FFF}
#tc_metro_popup_higher_container #tc_metro_popup_higher_title{
    font-size:26px;
    font-weight: 300;
    text-align:left;
    margin-top:30px;
    border-bottom: 1px solid #D2D2D2;
    color: #84868e;
}

#tc_metro_popup_higher_container #tc_metro_popup_higher_content{
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    font-size: 13px;
    font-weight: normal;
    padding: 20px 8px;
    text-align:left;
    min-height:35px;
}

/* tc input and select form plugin */
.tc_inputandselect_form_plugin{
    position: relative;
}
.tc_inputandselect_form_plugin .tc_inputandselect_content{
    position: absolute;
}
.tc_inputandselect_form_plugin .tc_inputandselect_content_header .word_input{
    width: 80%;
    display: inline-block;
    border-top-right-radius: 0px!important;
    border-bottom-right-radius: 0px!important
}
.tc_inputandselect_form_plugin .tc_inputandselect_content_header .select_btn{
    width: 34px;
    /*margin-left: -4px;*/
    margin-top: -3px;
    height: 34px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    font-size: 14px;
    border-left: 0;
}
.tc_inputandselect_form_plugin .tc_inputandselect_content_header .select_btn .fa-sort-up{float: left;height: 7px}
.tc_inputandselect_form_plugin .tc_inputandselect_content_header .select_btn .fa-sort-down{float: left;}
.tc_inputandselect_form_plugin .tc_inputandselect_content_bottom{display: none;position: relative;z-index: 100003}
.tc_inputandselect_form_plugin .tc_inputandselect_content_bottom .tc_inputandselect_bottom_arrow{
    margin: 0 auto;
    margin-top: 5px;
    height: 14px;
    width: 14px ;
    transform: rotate(45deg);
    border-left:  1px solid #ccc;
    border-top: 1px solid #ccc;
    background-color: white;
    z-index: 100002
}
.tc_inputandselect_form_plugin .tc_inputandselect_content_bottom .tc_inputandselect_content_bottom_base{
    background-color: white;
    border: 1px #ccc solid;
    margin-top: -7px;
    z-index: 100001;
    border-radius: 5px;
    padding: 5px 0px
}
.tc_inputandselect_form_plugin .tc_inputandselect_content_bottom .tc_inputandselect_select_list .tc_inputandselect_list_item{margin-top:10px;max-height: 300px;overflow-y: auto;}
.tc_inputandselect_form_plugin .tc_inputandselect_content_bottom .tc_inputandselect_content_bottom_base p{padding: 5px 10px;margin-bottom: 0px;margin-top: 5px}
.tc_inputandselect_form_plugin .tc_inputandselect_content_bottom .tc_inputandselect_add_new p:hover{color: #00a65a;cursor:pointer}
.tc_inputandselect_form_plugin .tc_inputandselect_content_bottom .tc_inputandselect_select_list p:hover{color: white;background-color: #00a65a}
.tc_inputandselect_form_plugin .tc_inputandselect_content_bottom .tc_inputandselect_add_new .message{padding: 0px 10px;}
.tc_inputandselect_form_plugin .tc_inputandselect_content_bottom .tc_inputandselect_add_new .add_new_loading{display: none}

/* error */
.has_error .form-control{/*color: #e9573f;*/ border:1px solid var(--colour-gray-3);}
.has_error ul li,
.has_error label,
.has_error span,
.has_error input{color: var(--colour-text-1);}

.error-item{padding-left:0;}
.error-item li{
    list-style: none outside none;
    color: #e9573f;
}

ul{list-style: none;padding: 0px;}
form label em{color: #e9573f;float: right;font-size: 20px;}
.odd{background-color: #f9f9f9;}
.top-head .notification_default_data .obj_img_tmp{
    width: 50px;
    height: 50px;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

.top-head .notification_default_data .obj_img_tmp img{
    max-height: 50px;
    max-width: 50px;
}
.top-head .notification_default_data .order_advertised{
    position: absolute;
    top: 23px;
    left: 23px;
}
.navbar-left{
    float: none !important;
}
.top-head .top_search button{
    border: 1px solid #d3d3db;
    border-radius: 50px;
}

.wrapper-body-right .top_search button{
    background: #00A65A;
    border: 1px solid #00A65A;
    margin: 0 !important;
    height: 33px;    
}
.wrapper-body-right .top_search button:hover{
    background: #008d4c;
    border: 1px solid #398439;
}

.comment_wrapper li a.user_avator img,
.comment_wrapper li a.user_avator img{
    padding: 2px;
    border: 1px solid #ddd;
}
.comment_wrapper ul.media-list,
.comment_wrapper ul.media-list{
    margin-bottom: 0px;
}
ul.media-list > li:last-child{
    border: 0;
}

.app_span_edit_text{cursor: pointer;color: #428bca;}
.app_span_edit_text:hover{color: #2a6496;}
.app_span_delete_text{cursor: pointer;color: #e9573f;}

#supplier_instance_detail .customer_logo{margin-right: 10px;}


@media (min-width: 1200px) {
    #wrapper .widget_group{float: right;}
    #wrapper .content_wrapper{
        min-height: 600px;
    }
}

#wrapper .widget_group{margin-bottom: 30px;}
#wrapper .widget_group:last-child{margin-bottom: 0px;}
#wrapper .widget_group .image_wrapper{
    width: 204px;
    height: 204px;
    text-align: center;
    margin: 0 auto;
    padding: 2px;
}
#wrapper .widget_group .obj_img{
    width: 200px;
    height: 200px;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
    padding: 5px;
}
#wrapper .widget_group li{text-align: center;}
#wrapper .widget_group .obj_img img{
    max-width: 196px;
    max-height: 196px;
}
#wrapper .widget_group ul.image_preview{ margin-bottom: 0px;}
#wrapper .widget_group .obj_status{ margin-bottom: 30px;}
#wrapper .widget_group .widget_documents ul.nav li{ padding: 0px;}
#wrapper .widget_group .widget_documents ul.nav li.disabled{background: none !important;}
#wrapper .widget_group .widget_documents ul.list-group{padding: 0 15px;}
#wrapper .widget_cell{margin-bottom: 0px;}

/*status*/
.status_in_progress, .status_draft{background-color: #009AFF!important}
.status_pending,.status_in_production{background-color: #A25DDC!important}
.status_approved,.status_pass,.status_released,.status_completed,.status_active,.status_current,.status_enabled{background-color:#00A65A!important}
.status_cancelled,.status_fail{background-color:#FF158A!important}
.status_quote, .status_confirmed{background-color:#A25DDC!important}
.status_expired{background-color:#eeacc5!important}
.status_terminated,.status_renewed{background-color:#777777!important}
.status_disabled{background-color:#8a6d3b!important}
.status_on_hold,.status_send{background-color:#4dc5f9!important}
.status_published, .status_fulfilled{background-color:#579e4b!important}

.status_text_in_progress{color:#009AFF;}
.status_text_pass{color:#00A65A;}
.status_text_fail{color:#FF158A;}
.status_text_cancelled{color:#FF158A;}

/* popup instance staff details */
#popup_staff_details_info .user_info_content{width: 420px;float: left;height: auto;margin-left: 20px;margin-top: 10px;}
#popup_staff_details_info .user_info_content .info_list .info_item{padding:6px;font-weight:bold;display:inline-block;width:50px;font-size:12px;}
#popup_staff_details_info .user_info_content .info_list li{list-style: none;margin:0;padding:10px;border:0;border-bottom:1px solid #DEDEDE;color: #666;margin-right: 10px;}
#popup_staff_details_info .user_info_content .info_list li p{display:inline-block;}
#popup_staff_details_info .user_info_content .info_list li .show_mode{padding-left:8px;display: inline;}
#popup_staff_details_info .userdetails{vertical-align: middle}
#popup_staff_details_info .container_left_col{float: left; margin-left: 10px;}
#popup_staff_details_info .container_left_col dl .avatar_wrapper{margin: 10px 0 0 10px;text-align:left;padding:10px 0px;text-align: center}
#popup_staff_details_info .container_left_col dl .avatar_wrapper .user_avatar{border: 1px solid #ccc;padding: 4px;width: 150px;height: 150px;}
#popup_staff_details_info .container_left_col dl dd{padding:0px;}
#popup_staff_details_info .container_left_col dl .user_name{font-weight:bold;font-size: 18px;text-align:center;color: #666}
#popup_staff_details_info .container_left_col dl .user_email{text-align:center;}
#popup_staff_details_info .close_button{ margin:0 auto;text-align: center;}
#popup_staff_details_info #popup_user{height: 190px;margin: 10px 0;width: auto;}
#popup_staff_details_info .user_email a{color: #428bca;}
@media (max-width: 900px) {
    #popup_staff_details_info .user_info_content{width: 320px;}
}
@media (max-width: 769px) {
    #popup_staff_details_info .user_info_content{max-width: 320px;margin-left: 20px;margin-top: 0px}
    #popup_staff_details_info .container_left_col{display: none}
    #popup_staff_details_info #popup_user{height: 170px;}
}
@media (max-width: 520px) {
    #popup_staff_details_info .user_info_content{width: auto;margin-top: 0px;}
}


/* exception error 404 403*/
.exception_error_wrapper{margin-top: 8%;}
.exception_error_code{position: relative;}
.exception_error_code h1{
    font-size:150px;
    font-weight:800;
}
.exception_error_code img{
    left: 200px;
    max-width: 100px;
    position: absolute;
    top: -25px;
}
.exception_error_wrapper .has-message{display: inline-block;width: 70%}
.exception_error_wrapper .has-message .message-txt{
    height: 250px;
    vertical-align: middle;
    display: table-cell;
    min-width: 500px;
}

.error_403_txt{margin-left: 70px;}

/* popup staff feedback */
#popup_staff_feedback .user_info_content{float: left;height: auto;margin-left: 40px;margin-top: 20px;}
#popup_staff_feedback .userdetails{vertical-align: middle}
#popup_staff_feedback .container_left_col{float: left; margin-left: 10px;}
#popup_staff_feedback .container_left_col dl .avatar_wrapper{margin: 10px 0 0 10px;text-align:left;padding:10px 0px;text-align: center}
#popup_staff_feedback .container_left_col dl .avatar_wrapper .user_avatar{border: 1px solid #ccc;padding: 4px;width: 150px;height: 150px;}
#popup_staff_feedback .container_left_col dl dd{padding:0px;}
#popup_staff_feedback .container_left_col dl .user_name{font-weight:bold;font-size: 18px;text-align:center;color: #666}
#popup_staff_feedback .container_left_col dl .user_email{text-align:center;}
#popup_staff_feedback .close_button{ margin:0 auto;text-align: center;}
#popup_staff_feedback #popup_user{height: 190px;margin: 10px 0;width: auto;}
#popup_staff_feedback .user_info_content textarea{float: left}
@media (max-width: 900px) {
    #popup_staff_feedback .user_info_content{margin-left: 10px;}
    #popup_staff_feedback .user_info_content{width: 320px;}
}
@media (max-width: 769px) {
    #popup_staff_feedback .user_info_content{max-width: 320px;margin-left: 10px;margin-top: 0px}
    #popup_staff_feedback .container_left_col{display: none}
    #popup_staff_feedback #popup_user{height: 170px;}
}
@media (max-width: 520px) {
    #popup_staff_feedback .user_info_content{width: auto;margin-top: 0px;}
}
#popup_view_guide {padding: 0}
#popup_view_guide ul.guide_tips{list-style: inherit;margin-left: 6%;}
#popup_view_guide ul.guide_tips li{margin: 5px 0}
#popup_view_guide .guide_title{border-bottom: 1px solid #ececee;padding-bottom: 10px;}
#popup_view_guide .guide_description{}
#popup_view_guide .guide_step{padding: 15px 0;border-bottom: 1px solid #ececee;}
#popup_view_guide .guide_step_3{padding-bottom:0;border-bottom: 0;}
#popup_view_guide .step_num{font-size: 30px;margin-right: 25px;}
#popup_view_guide .step_1_select{width:60%;}
#popup_view_guide .guide_step > div{padding: 5px 15px;line-height: 30px;}
#popup_view_guide .guide_step .step_2_input{width: 100%;height: 36px;}
#popup_view_guide .guide_step .step_3_text{width: 100%;height: 130px;line-height: 20px;}
#popup_view_guide .chosen-container-multi {width: 100% !important;}
#popup_view_guide .chosen-container-multi .chosen-choices {
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
    color: #555;
    display: block;
    font-size: 14px;
    height: 34px;
    line-height: 1.42857;
    padding: 3px 12px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    width: 100%;
}
#popup_view_guide .tag_list {margin-top: 10px;}
#popup_view_guide .tag_list .single_tag {
    display: block;
    float: left;
    padding: 5px;
    margin: 0px 5px 5px 0px;
    background-color: #428bca;
    color: white;
    line-height: 21px;
}
#popup_view_guide .tag_list .single_tag .single_tag_delete {
    width: 14px;
    margin-right: 5px;
    cursor: pointer;
}



/* custom css */
/*.wrapper-body-right{margin-left: 75px;}*/
.main_content_wrapper{
    float: left;
    padding-bottom: 50px;                  
    min-width: 1160px;
    width: 100%;
    padding-top: 125px;
}
.main_content_body{padding: 5px 20px 15px 20px;}
.left_wrapper{
    width: 99%;
    min-width: 820px;
    margin: 0 10px 0 -260px;
    float: left;
    /*border: 1px solid #ddd;*/
    /*padding: 15px;*/
    border-radius: 4px;
    /*background: #fff;*/
}
.left_wrapper .panel{
    /*border: none;*/
    box-shadow: none
}

.right_wrapper{width: 250px;float: right}
.right_wrapper .widget_group .widget_claim_staff .user_avator {
    border: 1px solid #ddd;
    border-radius: 100%;
    margin-right: 5px;
    padding: 2px;
    width: 54px;
}
.section_wrapper{margin: 0 0 0 260px}
.widget_wrapper .image_preview{margin: 0}
.widget_wrapper .widget_group .obj_img {
    display: table-cell;
    height: 206px;
    padding: 5px 4px;
    text-align: center;
    vertical-align: middle;
    width: 204px;
}
.widget_wrapper .widget_group .image_wrapper {
    height: 206px;
    margin: 0 auto;
    text-align: center;
    width: 204px;
}
.widget_wrapper .widget_group li {text-align: center;}
.widget_wrapper .widget_group .widget_claim_staff .user_cell {padding: 5px;}
.widget_wrapper .widget_group .widget_documents ul.nav {margin: 0px 15px;}
.widget_wrapper .widget_group .widget_documents ul.nav li {padding: 10px 5px;text-align: left}
.widget_wrapper .widget_group .widget_documents ul.nav li strong{margin-right: 20px;}
.top_main_tab{margin-bottom: 15px;}
.top_main_tab .nav-tabs > li.active > a{
    background-color: inherit;
    border: none;
}
.top_main_tab .nav-tabs  li > a,.top_main_tab .nav-pills li > a{
    background-color: inherit;
    border: none;
}
.top_main_tab .nav-pills  li a{background-color: #fff !important;}
.top_main_tab .nav-pills  li.active a, .top_main_tab .nav-pills  li.active a:hover{
    background-color: #fff !important;
    color: #777;
}
.footer{padding: 5px 15px;}
.main_content_body .left_wrapper .form-control{
    padding: 5px;
    font-size: 13px;
}
.has_error .no-border{
    border: 1px solid #ccc;
}
.no-border{border: none !important;}
.no-pad-bottom{padding-bottom: 0 !important;}
.no-shadow {box-shadow: none!important;}
.no-shadow:active{
    -webkit-box-shadow: none!important;
    box-shadow: none!important;
}
.no-shadow:focus {
    outline:0!important;
}

.normal-link {color: inherit;text-decoration: none}
.normal-link:hover{text-decoration: none;color: inherit;}
#main_nav_tab > li + li::before {
    color: #ccc;
    content: "";
    padding: 0 5px;
}
.chev-arrow{
    margin-left: -16px;
}

.nav-toolbar .more_apps_wrapper{margin-top: 2px !important;}
.nav-toolbar .more_apps_wrapper .app_list{margin: 0}
.nav-toolbar .more_apps_wrapper .app_list i{font-size: 25px;}
.nav-toolbar .more_apps_wrapper .app_list div.last_child{border: 0;margin: 0;}
.nav-toolbar .more_apps_wrapper .app_list div{
    border-bottom: 1px solid #eee;
    margin-bottom: 20px;
    padding-bottom: 20px;
}
.nav-toolbar .more_apps_wrapper .app_list div:last{
    border-bottom: 0;
}

.nav-toolbar .more_apps_wrapper .app_list div .h2{
    margin: 20px 0 10px 0;
}

.fa_orders::before{
    content: "\f07a";
}

.fa_style::before{
    content: "\f0e8";
}

.fa_claims::before{
    content: "\f133";
}

.fa_compliance::before{
    content: "\f046";
}

.fa_component::before{
    content: "\f200";
}

.fa_shipping::before{
    content: "\f16b";
}

.fa_costing::before{
    content: "\f1b2";
}

.fa_3fs::before{
    content: "\f114";
}

.fa_admin::before{
    content: "\f013";
}

.fa_report::before{
    content: "\f080";
}

.fa_support::before{
    content: "\f05a";
}

.bootstrap_blue{color: #428bca}
.bootstrap_red{color: #FF158A !important}
.red_asterisk{font-size: 25px;vertical-align: middle;line-height: 20px;} 
/* nav */
.main_content_wrapper .nav-tabs > li.active > a,
.main_content_wrapper .nav-tabs > li.active > a:hover,
.main_content_wrapper .nav-tabs > li.active > a:focus {
    background-color: #fff;
    border-color: #ddd #ddd transparent;
    border-style: solid;
    border-width: 1px;
    color: #428bca;
}
.main_content_wrapper .nav-tabs > li > a{color: #555;}
.main_content_wrapper .nav-pills > li.active > a,
.main_content_wrapper .nav-pills > li.active > a:hover,
.main_content_wrapper .nav-pills > li.active > a:focus {
    color: #428bca;
    background-color: #fff;
}
.main_content_wrapper .nav-pills > li > a{color: #555;}
.service_comment_delete:hover{background-color: #d9534f;color: white;border-color: #d9534f} 

/* global button*/
#global_header_save_btn{
    position: fixed; 
    z-index: 2;
    bottom: auto;
    right: 45px;
    top: 72px;
}

#global_header_save_btn_fake{
    position: fixed; 
    z-index: 2;
    bottom: auto;
    right: 45px;
    top: 72px;
}

#global_header_save_btn_date{
    position: fixed; 
    z-index: 2;
    bottom: auto;
    right: 45px;
    top: 72px;
}

#global_app_help_link{ bottom: auto; position: fixed; right: 19px; z-index: 13; font-size: 18px; top: 71px;}

/* messager  common tc message color for symfony 2 */
.message_wrapper .glyphicon {
    padding: 0 10px 0 0;
    top: 2px;
}
.message_wrapper button.close{line-height: 17px;font-size: 30px}

/* datepocker fix */
.datepicker .datepicker-days .old,
.datepicker .datepicker-days .new{color:#ccc!important}
.datepicker .datepicker-days .disabled{color:#AEADAD!important}


.panel.panel-no-border{border:none;box-shadow:none;margin-bottom: 0px;}  
/* button format like sonataadmin */
.btn.uppercase {text-transform: uppercase;}
.btn.btn-flat {border-radius: 0;border-width: 1px;box-shadow: none;}
.btn:active {box-shadow: 0 3px 5px rgba(0, 0, 0, 0.125) inset;}
.btn:focus {outline: 0 none;}
.btn.btn-file {overflow: hidden;position: relative;}
.btn.btn-file > input[type="file"] {
    background: white none repeat scroll 0 0;
    cursor: inherit;
    display: block;
    font-size: 100px;
    min-height: 100%;
    min-width: 100%;
    opacity: 0;
    outline: 0 none;
    position: absolute;
    right: 0;
    text-align: right;
    top: 0;
}
.btn-default {background-color: #f4f4f4;border-color: #ddd;}
.btn-default:hover, .btn-default:active, .btn-default.hover {background-color: #e7e7e7 !important;}
.btn-primary {background-color: #009AFF;border-color: #009AFF;min-width: 55px;}
.btn-primary:hover, .btn-primary:active, .btn-primary:focus, .btn-primary.hover, .btn-primary.disabled, .btn-primary.disabled:focus {background-color: #40a9ff;border-color: #009AFF;}
.btn-success {background-color: #00A65A;border-color: #00A65A;}
.btn-success:hover, .btn-success:active, .btn-success.hover {background-color: #00A65A;}
.btn-info {background-color: #00c0ef;border-color: #00acd6;}
.btn-info:hover, .btn-info:active, .btn-info.hover {background-color: #00acd6;}
.btn-none {background-color: #fff;border-color: #D9D9D9;}
.btn-none:hover, .btn-info:active, .btn-info:focus, .btn-info.hover {background-color: #fff;}
.btn-danger {background-color: #FF158A;border-color: #FF158A;}
.btn-danger:hover, .btn-danger:active, .btn-danger.hover {background-color: #FF158A;}
.btn-warning {background-color: #FDAB3D;border-color: #FDAB3D;}
.btn-warning:hover, .btn-warning:active, .btn-warning.hover {background-color: #FDAB3D;}
.btn-outline {
    background: transparent none repeat scroll 0 0;
    border: 1px solid #fff;
    color: #fff;
}
.btn-outline:hover, .btn-outline:focus, .btn-outline:active {
    border-color: rgba(255, 255, 255, 0.7);
    color: rgba(255, 255, 255, 0.7);
}
.btn-link {box-shadow: none;}
.btn[class*="bg-"]:hover {box-shadow: 0 0 100px rgba(0, 0, 0, 0.2) inset;}
.btn-app {
    background-color: #f4f4f4;
    border: 1px solid #ddd;
    border-radius: 3px;
    color: #666;
    font-size: 12px;
    height: 60px;
    margin: 0 0 10px 10px;
    min-width: 80px;
    padding: 15px 5px;
    position: relative;
    text-align: center;
}
.btn-app > .fa, .btn-app > .glyphicon, .btn-app > .ion {display: block;font-size: 20px;}
.btn-app:hover {
    background: #f4f4f4 none repeat scroll 0 0;
    border-color: #aaa;
    color: #444;
}
.btn-app:active, .btn-app:focus {box-shadow: 0 3px 5px rgba(0, 0, 0, 0.125) inset;}
.btn-app > .badge {
    font-size: 10px;
    font-weight: 400;
    position: absolute;
    right: -10px;
    top: -3px;
}
.hover_red_link:hover {
    background-color: #FF158A !important;
    border-color: #FF158A;
    color: #fff;
}
.hover_grey_link:hover {
    background-color: #DCDDDE !important;
    border-color: #DCDDDE;
}

.hover_green_link:hover {
    background-color: #00A65A !important;
    border-color: #00A65A;
    color: #fff;
}

.hover_blue_link:hover {
    background-color: #009AFF !important;
    border-color: #009AFF;
    color: #fff;
}
.hover_red_link:hover i,
.hover_green_link:hover i,
.btn-default:active:focus, .btn-default:active:hover,
.hover_blue_link:hover i{
    color: #fff;
}

.hover_color_red:hover {
    color: #FF158A!important;
}
.hover_color_red:hover i{
    color: #FF158A;
}

.hover_color_grey:hover {
    color: #C4C4C4!important;
}

.hover_color_green:hover {
    color: #00A65A!important;
}
.hover_color_green:hover:before{
    color: #00A65A!important;
}
.hover_color_green:hover i{
    color: #00A65A!important;
}

.hover_color_blue:hover {
    color: #009AFF!important;
}
.hover_color_blue:hover i{
    color: #009AFF!important;
}

.section_add_btn, .section_delete_btn{float:right; margin-top: -46px;}
.section_btn_groups{position: absolute; top: -31px;right: 15px;}

/* left sidebar setting*/
.tc-icon-site_settings::before,
.tc-icon-administration::before,
.fa-administration::before,
.fa-site_settings::before {
    content: "\f013";
    font-family: 'Font Awesome 5 Pro'
}

.popup_user_name_link{float:left;margin-right: 4px;}
.popup_user_create_date{float:left;}

/* popup file upload css */
.plupload_contentv .file_upload_action{
    position:relative;
    float: right;
    margin-top: 25px;
    width: 28px;
    height: 28px; 
    background: url('/asset/jcore/images/common/structure/icon_bg.png') -24px -78px no-repeat scroll;
}

.plupload_content .plupload_add{
    padding: 1px 5px;
    color: #fff;
    font-size: 13px;
    line-height: 1.5;
    background: #f4f4f4;
    border-color: #ddd;
}

.plupload_content .plupload_add:hover{
    background-color: #00a65a !important;
    border-color: #00a65a;
    color: #fff!important;
    text-decoration: none;
}

.plupload_content .plupload_start{
    background: #3c8dbc;
    padding: 1px 5px;
    color: #fff;
    font-size: 13px;
    line-height: 1.5;
    border-color: #367fa9;
}

.plupload_content .plupload_start:hover{
    color: #fff;
    background: #286090;
    border-color: #204d74;
}

.plupload_content a.plupload_disabled:hover,.plupload_content a.plupload_disabled:focus{
    color: #fff;
    background: #286090!important;
    border-color: #204d74!important;
}

/* start multiselect css custom */
.ui-widget{
    font-size: 13px;
}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active{
    background: none;
    border: 1px solid #ccc;
}
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus{
    font-weight: normal;
}
.ui-widget-header a{
    /*color: #428bca;*/
    font-weight: normal;
}
.ui-widget-header a:hover{
    /*color: #2a6496;*/
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default{
    background: none;
}
.ui-multiselect{
    padding: 7px 7px 7px 15px !important;
    border-radius: 4px;
    /*box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;*/
    font-weight: normal;
    width: 165px !important;
    height: 35px !important;
}
.ui-icon-triangle-1-s{
    background-position: -64px -14px;
}
.ui-multiselect-menu label{
    font-weight: normal !important;
    font-size: 13px;
}
.ui-multiselect-menu .ui-helper-reset li{font-size: 12px;}
.ui-multiselect-menu .ui-helper-reset li.color_default .custom_checkbox span{color: #555 !important;}
.ui-multiselect-header .ui-helper-reset a:hover{
    text-decoration: none;
}
.ui-multiselect-header .ui-helper-reset > li > a > span:last-child{
    font-size: 13px;
    margin-left: 3px;
}
.ui-multiselect-header{
    padding: 3px 1px;
}
.ui-multiselect-checkboxes label{
    padding: 3px;
}
.ui-multiselect-checkboxes li{
    padding: 0;
}
.ui-multiselect-checkboxes > li > label > span {
    margin-left: 4px;
}
.ui-multiselect-none span{display: none;}
/* end multiselect css custom */

/*** Clean Panel Heading backgroud ***/
.panel-heading.clean-backgroud{
    background:none;
    border-bottom: 1px dotted #ddd;
}
#tiptip_holder.tip_left{padding: 0}

#service_for_history_view table th{font-weight: bold;}

.cr-styled.checked > i:before{	content: "\f00c"!important;}

/* drag drop file upload */
#drag_drop_file_upload_lists .drag_drop_file_list{
    padding: 0px;
    position: fixed;
    right: 20px;
    bottom: 35px;
    width: 800px;
    z-index: 100005;
    box-shadow: 0px 22px 104px -6px rgba(0, 0, 0, 0.34);
    display: none;
    border-radius: 5px;
}
#drag_drop_file_upload_lists .drag_drop_file_list .drag_drop_header{
    width: 100%;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex; 
    align-items: center;
}
#drag_drop_file_upload_lists .drag_drop_file_list .drag_drop_title{flex-basis: 86%;padding-left: 10px; font-size: 16px;}
#drag_drop_file_upload_lists .drag_drop_file_upload_menu {
    transition: bottom 0.2s ease;
    position: absolute;
    width: 800px;
    height: 63px;
    z-index: 1000001;
    background: #fff;
    border-radius: 5px;
    -ms-flex-direction: row;
    flex-direction: row;
    display: -ms-flexbox;
    display: flex;
    bottom: 35px;
}

#drag_drop_file_upload_lists .drag_drop_file_upload_menu .number-of-actions {
    width: 63px;
    color: #fff;
    border-radius: 5px 0px 0px 0px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    cursor: default;
    font-size: 30px;
}

#drag_drop_file_upload_lists .drag_drop_file_upload_menu .batch-actions-title-section {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex: 1;
    flex: 1;
    cursor: default;
    margin-left: 20px;
}
#drag_drop_file_upload_lists .drag_drop_file_upload_menu .batch-actions-title-section .title {
    font-size: 24px;
    font-weight: 100;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 400px;
}
#drag_drop_file_upload_lists .drag_drop_file_upload_menu .batch-actions-title-section .more-dots {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    height: 20px;
}
#drag_drop_file_upload_lists .drag_drop_file_upload_menu .batch-actions-title-section .more-dots .dot {
    width: 8px;
    height: 8px;
    border-radius: 20px;
    margin-right: 5px;
}
#drag_drop_file_upload_lists .drag_drop_file_upload_menu .batch-actions-items{
    display: -ms-flexbox;
    display: flex;
    align-items: center
}
#drag_drop_file_upload_lists .drag_drop_file_upload_menu .batch-actions-item {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
    margin-right: 20px;
    cursor: pointer;
}

#drag_drop_file_upload_lists .drag_drop_file_upload_menu .batch-actions-item .action-icon {
    font-size: 21px;
    position: relative;
}

#drag_drop_file_upload_lists .drag_drop_file_upload_menu .batch-actions-item .action-name {
    position: relative;
    bottom: -4px;
}
#drag_drop_file_upload_lists .drag_drop_file_upload_menu .batch-actions-delete-item {
    display: -ms-flexbox;
    display: flex;
    width: 63px;
    text-align: center;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    border-left: 1px solid #E1E1E1;
}
#drag_drop_file_upload_lists .drag_drop_file_upload_menu .batch-actions-delete-item span:hover {
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    transition: transform 0.5s ease;
    color:#FF158A;
    cursor: pointer;
}

#drag_drop_file_upload_lists .file_hold_list{
    max-height: 600px;
    overflow-y: auto;
    background-color: white;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}
#drag_drop_file_upload_lists p{margin: 0px} 
#drag_drop_file_upload_lists table th{border-bottom-width: 0px;}
#drag_drop_file_upload_lists .progress{margin-bottom: 0px;} 
/*#drag_drop_file_upload_lists button.start{margin-left: 8px; margin-top: 10px;}
#drag_drop_file_upload_lists button.cancel{margin-top: 10px;}*/
#drag_drop_file_upload_lists .fileupload-buttonbar{margin-left: 0px; margin-right: 0px;}
#drag_drop_file_upload_lists td .name{word-break: break-all}
#drag_drop_file_upload_lists .drag_drop_loading{margin-top: 5px;border: 0px;display: none}
.drag-drop-file-upload-list-overlay {
/*    width: 100%;
    top: 0px;
    bottom: 0px;
    position: fixed; 
    background-color: #E8F0FE;*/
    display: block;
    opacity: 0.5;
    border:2px #4285F4 solid!important;
    padding: 5px;
}

.drag-drop-file-upload-list-overlay-popup{
    background-color: #E8F0FE!important;
    border:2px #4285F4 solid!important;
}

.wrapper-content .tc-wrapper-drag-drop-area{min-height: 30px}

#drag_drop_select_file_upload_input{display: none}

.item_preview_image_add_wrapper .loading_image{height: 250px;line-height: 250px;display: none}

/* comment file upload */
.comment_file_upload_wrapper .drag_drop_file_list{
    padding: 0px;
    position: fixed;
    right: 20px;
    bottom: 35px;
    width: 800px;
    z-index: 100005;
    box-shadow: 0px 22px 104px -6px rgba(0, 0, 0, 0.34);
    display: none;
    border-radius: 5px;
}
.comment_file_upload_wrapper .drag_drop_file_list .drag_drop_header{
    width: 100%;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex; 
    align-items: center;
}
.comment_file_upload_wrapper .drag_drop_file_list .drag_drop_title{flex-basis: 86%;padding-left: 10px; font-size: 16px;}
.comment_file_upload_wrapper .drag_drop_file_upload_menu {
    transition: bottom 0.2s ease;
    position: absolute;
    width: 800px;
    height: 63px;
    z-index: 1000001;
    background: #fff;
    border-radius: 5px;
    -ms-flex-direction: row;
    flex-direction: row;
    display: -ms-flexbox;
    display: flex;
    bottom: 35px;
}

.comment_file_upload_wrapper .drag_drop_file_upload_menu .number-of-actions {
    width: 63px;
    color: #fff;
    border-radius: 5px 0px 0px 0px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    cursor: default;
    font-size: 30px;
}

.comment_file_upload_wrapper .drag_drop_file_upload_menu .batch-actions-title-section {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex: 1;
    flex: 1;
    cursor: default;
    margin-left: 20px;
}
.comment_file_upload_wrapper .drag_drop_file_upload_menu .batch-actions-title-section .title {
    font-size: 24px;
    font-weight: 100;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 400px;
}
.comment_file_upload_wrapper .drag_drop_file_upload_menu .batch-actions-title-section .more-dots {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    height: 20px;
}
.comment_file_upload_wrapper .drag_drop_file_upload_menu .batch-actions-title-section .more-dots .dot {
    width: 8px;
    height: 8px;
    border-radius: 20px;
    margin-right: 5px;
}
.comment_file_upload_wrapper .drag_drop_file_upload_menu .batch-actions-items{
    display: -ms-flexbox;
    display: flex;
    align-items: center
}
.comment_file_upload_wrapper .drag_drop_file_upload_menu .batch-actions-item {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
    margin-right: 20px;
    cursor: pointer;
}

.comment_file_upload_wrapper .drag_drop_file_upload_menu .batch-actions-item .action-icon {
    font-size: 21px;
    position: relative;
}

.comment_file_upload_wrapper .drag_drop_file_upload_menu .batch-actions-item .action-name {
    position: relative;
    bottom: -4px;
}
.comment_file_upload_wrapper .drag_drop_file_upload_menu .batch-actions-delete-item {
    display: -ms-flexbox;
    display: flex;
    width: 63px;
    text-align: center;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    border-left: 1px solid #E1E1E1;
}
.comment_file_upload_wrapper .drag_drop_file_upload_menu .batch-actions-delete-item span:hover {
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    transition: transform 0.5s ease;
    color:#FF158A;
    cursor: pointer;
}

.comment_file_upload_wrapper .file_hold_list{
    max-height: 600px;
    overflow-y: auto;
    background-color: white;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}
.comment_file_upload_wrapper p{margin: 0px}
.comment_file_upload_wrapper table th{border-bottom-width: 0px;}
.comment_file_upload_wrapper .progress{margin-bottom: 0px;}
.comment_file_upload_wrapper .fileupload-buttonbar{margin-left: 0px; margin-right: 0px;}
.comment_file_upload_wrapper td .name{word-break: break-all}
.comment_file_upload_wrapper .drag_drop_loading{margin-top: 5px;border: 0px;display: none}

/* image upload */
#tc_image_drag_drop_upload_lists .drag_drop_file_list{
    padding: 0px;
    position: fixed;
    right: 20px;
    bottom: 35px;
    width: 800px;
    z-index: 100005;
    box-shadow: 0px 22px 104px -6px rgba(0, 0, 0, 0.34);
    display: none;
    border-radius: 5px;
}
#tc_image_drag_drop_upload_lists .drag_drop_file_list .drag_drop_header{
    width: 100%;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex; 
    align-items: center;
}
#tc_image_drag_drop_upload_lists .drag_drop_file_list .drag_drop_title{flex-basis: 86%;padding-left: 10px; font-size: 16px;}
#tc_image_drag_drop_upload_lists .drag_drop_file_upload_menu {
    transition: bottom 0.2s ease;
    position: absolute;
    width: 800px;
    height: 63px;
    z-index: 1000001;
    background: #fff;
    border-radius: 5px;
    -ms-flex-direction: row;
    flex-direction: row;
    display: -ms-flexbox;
    display: flex;
    bottom: 35px;
}

#tc_image_drag_drop_upload_lists .drag_drop_file_upload_menu .number-of-actions {
    width: 63px;
    color: #fff;
    border-radius: 5px 0px 0px 0px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    cursor: default;
    font-size: 30px;
}

#tc_image_drag_drop_upload_lists .drag_drop_file_upload_menu .batch-actions-title-section {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex: 1;
    flex: 1;
    cursor: default;
    margin-left: 20px;
}
#tc_image_drag_drop_upload_lists .drag_drop_file_upload_menu .batch-actions-title-section .title {
    font-size: 24px;
    font-weight: 100;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 400px;
}
#tc_image_drag_drop_upload_lists .drag_drop_file_upload_menu .batch-actions-title-section .more-dots {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    height: 20px;
}
#tc_image_drag_drop_upload_lists .drag_drop_file_upload_menu .batch-actions-title-section .more-dots .dot {
    width: 8px;
    height: 8px;
    border-radius: 20px;
    margin-right: 5px;
}
#tc_image_drag_drop_upload_lists .drag_drop_file_upload_menu .batch-actions-items{
    display: -ms-flexbox;
    display: flex;
    align-items: center
}
#tc_image_drag_drop_upload_lists .drag_drop_file_upload_menu .batch-actions-item {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
    margin-right: 20px;
    cursor: pointer;
}

#tc_image_drag_drop_upload_lists .drag_drop_file_upload_menu .batch-actions-item .action-icon {
    font-size: 21px;
    position: relative;
}

#tc_image_drag_drop_upload_lists .drag_drop_file_upload_menu .batch-actions-item .action-name {
    position: relative;
    bottom: -4px;
}
#tc_image_drag_drop_upload_lists .drag_drop_file_upload_menu .batch-actions-delete-item {
    display: -ms-flexbox;
    display: flex;
    width: 63px;
    text-align: center;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    border-left: 1px solid #E1E1E1;
}
#tc_image_drag_drop_upload_lists .drag_drop_file_upload_menu .batch-actions-delete-item span:hover {
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    transition: transform 0.5s ease;
    color:#FF158A;
    cursor: pointer;
}

#tc_image_drag_drop_upload_lists .file_hold_list{
    max-height: 600px;
    overflow-y: auto;
    background-color: white;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}
#tc_image_drag_drop_upload_lists p{margin: 0px} 
#tc_image_drag_drop_upload_lists table th{border-bottom-width: 0px;}
#tc_image_drag_drop_upload_lists .progress{margin-bottom: 0px;}  
#tc_image_drag_drop_upload_lists .fileupload-buttonbar{margin-left: 0px; margin-right: 0px;}
#tc_image_drag_drop_upload_lists td .name{word-break: break-all}
#tc_image_drag_drop_upload_lists .drag_drop_loading{margin-top: 5px;border: 0px;display: none}



/* popup order price content */
.popup_holder .popup_order_price_content{ text-align: center;padding: 25px 10px;}
.popup_holder .popup_order_price_content table tr{ line-height: 20px;}
.popup_holder .popup_order_price_content th{ 
    padding: 5px;
    background: #ececec none repeat scroll 0 0;
    text-align: center !important;
    border: 1px solid #fff;
}
.popup_holder .popup_order_price_content .td{ padding: 5px;border: 1px solid #fff;}

.ui-autocomplete{
    z-index: 999999; 
    max-height: 300px;
    overflow-y: auto;
    overflow-x: hidden;
}


/* common order create form start*/  
#ordercreateform_order_number_prefix{
    width: 110px;
    float: left;
}
#ordercreateform_order_number_value{
    width: 120px;
    float: right;
}
#popup_create_order .change_bulk_order{
    cursor: pointer;
    color: #428bca;
}
#popup_create_order .has_error ul{
    margin: 0;
}
/* common order create form end*/  

/* table word no warp */
.main_content_wrapper .panel-body table td,
.main_content_wrapper .panel-body table th{
    white-space:normal; 
    word-break:keep-all;
}
.bundle_lock_icon_for_tabs{margin-top: -30px;margin-right: 2px;}

/* activity status*/
.activity_not_done_and_not_overdue{background-color: #fff;color: #fff;border: 1px #c3c3c3 solid}
.activity_not_done_and_overdue{background-color: #FF158A!important;border-color: #FF158A!important;}
.activity_done_on_time{background-color: #00A65A!important;border-color: #00A65A!important;}
.activity_done_not_on_time{background-color: #FDAB3D!important;border-color: #FDAB3D!important;}

/* overflow table content  */
.overflow_section_full_content{position: relative}
.overflow_section_full_content .overflow_section_body{position: absolute;left: 0px;right: 0;overflow: auto;}
.overflow_section_full_content .overflow_section_body .overflow_table_header_tr td{border-top: 0}

/* popup create new */
#popup_create_style textarea{resize: vertical;min-height: 50px;width: 100%!important;}
#popup_first_style_create textarea{width: 100%!important;resize: vertical;}

#popup_create_component textarea{resize: vertical;min-height: 50px;width: 100%!important;}
#popup_first_component_create textarea{width: 100%!important;resize: vertical;}
#popup_create_claim textarea{resize: vertical;min-height: 50px;width: 100%!important;}

.first_app_add_field .content{padding-top: 20px;}
#popup_wizard_add_shipping_origin .order_eta_offset_entity_data,
#popup_wizard_add_shipping_origin .order_in_store_offset_entity_data{
    width: 80px;
}

#popup_wizard_add_compliance_item_critical_path .half_width{width: 50%;}
#popup_wizard_add_compliance_item_critical_path .content{padding-top: 10px}
#popup_wizard_add_compliance_item_critical_path .critical_path_wrapper{padding: 10px; }
#popup_wizard_add_compliance_item_critical_path .activity_type_wrapper{padding: 0px 10px;}
#popup_wizard_add_compliance_item_critical_path .activity_type_wrapper .activities_list_wrap{ max-height: 120px; overflow-y: auto;}
#popup_wizard_add_compliance_item_critical_path .activity_type_wrapper .activities_list{margin-top: 15px;width: 355px;}
#popup_wizard_add_compliance_item_critical_path .activity_type_wrapper .activities_list li{margin-bottom: 5px;}
#popup_wizard_add_compliance_item_critical_path .activity_type_wrapper .activities_list li span{display: inline-block;width: 90%;height: 24px; line-height: 24px;}
#popup_wizard_add_compliance_item_critical_path .activity_type_wrapper .activities_list li .btn_delete{float: right;}
#popup_wizard_add_compliance_item_critical_path .activity_type_wrapper .activities_list li .btn_delete:hover{color: #F16364}

#popup_wizard_add_size_scale .content .first_line_td{border-top: 1px solid #ccc;padding-top: 15px;}
#popup_wizard_add_size_scale .content td{padding: 5px 10px;}


/* popup advance search */
.ui-multiselect-menu{
    z-index: 200000;
}
#popup_advanced_search_filter .form_header ul {width: 100%; border-bottom: 1px solid #D2D2D2;padding: 10px 0;}
#popup_advanced_search_filter .form_header ul li {display: inline-block;padding: 5px 8px;cursor: pointer;font-size: 14px}
#popup_advanced_search_filter .form_header ul li:hover {color: #009AFF;}
#popup_advanced_search_filter .form_header .selected{color: #009AFF}
#popup_advanced_search_filter .form_header .selected i{color: #009AFF}
#popup_advanced_search_filter .required::after{content:''}
#popup_advanced_search_filter .panel-body{padding: 0 0 0 8px} 
#popup_advanced_search_filter .form_details{clear: both;max-height: 500px;margin:0px;overflow-y:auto}
#popup_advanced_search_filter .advanced_filter_keywords_fake{width: 237px;display: inline-block;font-size: 13px;height: 26px;padding-top: 4px;padding-bottom: 4px}
#popup_advanced_search_filter .form-wrapper{margin: 0; padding-bottom: 0px;}
#popup_advanced_search_filter .form-wrapper button.ui-multiselect{
    width: 237px!important;
    border-radius: 4px;
    height: 26px!important;
    padding: 0px 0px 0px 12px !important
}
#popup_advanced_search_filter .form-wrapper select,
#popup_advanced_search_filter .form-wrapper input[type='text']{
    width: 237px!important;
    display: inline-block;
    height: 26px;
    padding: 0px 0px 0px 12px !important
}

#popup_advanced_search_filter .checkbox{
    display: inline-block;
    height: 18px;
    width: 18px;
    cursor: pointer;
    vertical-align: middle;
}
#popup_advanced_search_filter .form-wrapper select option{
    font-weight: normal;
    color: #555;
}
#popup_advanced_search_filter .form-wrapper > div{
    clear: both;
}
#popup_advanced_search_filter .form-wrapper > div > div > div{
    clear: both;
    margin: 0 5px 10px 0;
}
#popup_advanced_search_filter .form-wrapper > div > div > div > div{
    clear: both;
    margin-top: 5px;
}
#popup_advanced_search_filter .form-wrapper > div > div > div label{
    text-align: left;
    font-size: 16px;
    font-weight: normal;;
}
#popup_advanced_search_filter .form-wrapper > div > div > div > div label{
    width: 166px;
    font-size: 13px;
    display: inline-block;
    text-align: right;
    white-space: nowrap;
    max-width: 100%;
    margin-bottom: 5px;
    text-align: left;
}
#popup_advanced_search_filter .form-wrapper > div > div > div > div > div{
    margin-bottom: 10px ;
}
#popup_advanced_search_filter .clear_keywords{   
    position: absolute;
    left: 530px;
    top: 11px;
    z-index: 100;
    cursor: pointer;
    display: none
}

/* right corner notification */
.list-group-item .notification_messager{word-break: keep-all;}

/* first wizard */
.wizard_first_app_create .guide_title{padding-bottom: 20px; border-bottom: 1px solid #D2D2D2;}
.wizard_first_app_create .guide_title .wizard_title{font-size: 20px;}
.wizard_first_app_create .guide_content{padding-top: 10px;padding-bottom: 10px;}
.wizard_first_app_create .guide_title, .wizard_first_app_create form{color: #999;}
.wizard_first_app_create form table tr > th{font-weight: 500;font-size: 13px;}
.wizard_first_app_create .content{padding-top: 30px;}

#popup_wizard_add_costing_template .content{max-height: 650px; overflow-y: auto;margin-top: 20px;padding-top: 0px;}
#popup_wizard_add_costing_template .content table.costing_template_content{float: left;}

#popup_first_login_wizard .image_wrap {
    background-color: #ffffff;
    border: 1px solid #cccccc;
    border-radius: 3px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    display: table-cell;
    height: 176px;
    text-align: center;
    vertical-align: middle;
    width: 176px;
    position: relative;
}
#popup_first_login_wizard .image_wrap img{
    max-width: 173px;
    max-height: 173px;
}
#popup_first_login_wizard .wizard_logo_file_add{
    border: 1px solid #e7e7e7;
    display: table-cell;
    height: 176px;
    text-align: center;
    vertical-align: middle;
    width: 176px;
    position: relative;
    z-index: 0;
    cursor: pointer;
}
#popup_first_login_wizard .wizard_logo_file_add input{
    width: 100%;
    height: 176px;
    opacity: 0;
    cursor: pointer;
}
#popup_first_login_wizard .wizard_logo_file_add span{
    border: 1px solid #ccc;
    border-radius: 50px;
    font-size: 30px;
    height: 50px;
    left: 62px;
    position: absolute;
    top: 62px;
    width: 50px;
    color: #ccc;
    z-index: -1;
    background: rgb(255, 255, 255) none repeat scroll 0% 0%;
}
#popup_first_login_wizard .wizard_logo_file_add span:hover{
    background: rgb(231, 231, 231) none repeat scroll 0% 0%;
}
#popup_first_login_wizard .wizard_logo_file_add span i{
    left: 13px;
    position: absolute;
    top: 11px;
}
#popup_first_login_wizard .image_wrap .image_delete{
    position: absolute;
    color: #9d9ea5;
    cursor: pointer;
    display: none;
    font-size: 20px;
    top: 0px;
    right: 10px;
}

#popup_first_login_wizard .wizard_staff_list{width: 100%;max-height:200px;overflow-y: auto}
#popup_first_login_wizard .wizard_customer_list{width: 100%;max-height:200px;overflow-y: auto}

/* popup first login wizard avatar change */
#file-uploader .qq-uploader .user_avatar{position: relative;width: 152px; height: 152px;padding: 5px;text-align: center;border: 1px solid #e7e7e7;z-index: 0}
#file-uploader .qq-uploader .user_avatar img{max-width: 135px; max-height: 135px;}
#file-uploader .qq-uploader .user_avatar .image_delete{position: absolute;color: #9d9ea5;cursor: pointer;font-size: 20px;top: 0px;display: none;right: 5px;z-index: 1;}
#file-uploader .qq-uploader .user_avatar .qq-upload-button{height: 140px;}
#file-uploader .qq-uploader .user_avatar .add_avatar{border: 1px solid #ccc;border-radius: 50px;font-size: 30px;height: 50px;left: 45px;position: absolute;top: 45px;width: 50px;color: #ccc;z-index: -1;background: rgb(255, 255, 255) none repeat scroll 0% 0%;}
#file-uploader .qq-uploader .user_avatar:hover .add_avatar{background: rgb(231, 231, 231) none repeat scroll 0% 0%;}
#file-uploader .qq-uploader .user_avatar .add_avatar i{left: 13px;position: absolute;top: 11px;}
#popup_wizard_supplier_search .supplier_search_content {
    display: inline-block;
    width: 70%;
    float: left;
}
#popup_wizard_supplier_search .btn_supplier_search_content {
    margin-left: 10px;
    float: left;
}
#popup_wizard_supplier_search .supplier_result {
    width: 100%;
    min-height: 100px;
    float: left;
    padding: 10px 0px;
}
#popup_wizard_supplier_search .supplier_lists {
    max-height: 500px;
    overflow-y: auto;
    overflow-x: hidden;
}
#popup_wizard_supplier_search .supplier_left {
    float: left;
    margin-left: 10px;
    width: 70%;
    border-right: 2px #ddd solid;
    padding-right: 15px;
}
#popup_wizard_supplier_search .supplier_left .supplier_overview{
    float: left;
    margin-left: 10px;
    width: 420px;
}
#popup_wizard_supplier_search .supplier_right {
    float: right;
    width: 25%;
}
#popup_wizard_send_supplier_register_invitation p{margin-bottom: 7px}
#popup_wizard_send_supplier_register_invitation h3{margin-top: 8px}
#popup_wizard_send_supplier_register_invitation .content{padding-top: 10px}
#popup_wizard_send_supplier_register_invitation .btns{margin-top: 10px;float: right;border-radius: 50px;}
#popup_wizard_send_supplier_register_invitation .email_content_left{
    float: left;
    width: 63%;
}
#popup_wizard_send_supplier_register_invitation .email_content_left .contact_message_list{
    list-style: disc;
    margin-left: 25px;
}
#popup_wizard_send_supplier_register_invitation .email_content{font-size: 13px}
#popup_wizard_send_supplier_register_invitation .email_content .form-control{font-size: 13px}
#popup_wizard_send_supplier_register_invitation .email_content .form-control:hover{
    border-color: var(--colour-blue-1);
    background-color: white;
}
#popup_wizard_send_supplier_register_invitation .email_content table{float: right;}
#popup_wizard_send_supplier_register_invitation .save_loading_image{display: none;}
#popup_wizard_send_supplier_register_invitation .send_success_image{display: none;}
#popup_wizard_send_supplier_register_invitation .registration_type_wrapper > div{
    display: flex;
    align-items: center;
    margin: 10px 0;
}
#popup_wizard_send_supplier_register_invitation .registration_type_wrapper > div > input[type='radio']{
    width: 18px;
    height:18px;
    margin: 0 10px 0 0;
    outline: unset;
}
#popup_wizard_send_supplier_register_invitation .registration_type_wrapper > div > label{
    margin: 0;
}

/* ------------------------------ common 201905 ------------------------------ */


body{
    /*background-color: #292f4c;*/
    background:white;
}
a {
    color: #009AFF;
    text-decoration: none;
}
a:hover{
    color: #009AFF;
    opacity: 0.8;
}
.btn:active, .btn.active, .btn:hover{
    background-image: none;
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.btn-primary:hover{border:1px transparent solid}
.btn-success:hover{border:1px transparent solid}

.table>thead>tr>td {
    vertical-align: bottom;
    border-bottom: 1px solid #E1E1E1;
}
input.clear_ie_delete_btn::-ms-clear{display: none;}
input.clear_ie_delete_btn::-ms-reveal{display: none;}
input.clear_ie_delete_btn::-o-clear{display: none;}
/* wrapper-body-left */
.wrapper-body-left{
    width: 66px;
    height: 100%;
    position: fixed;
    background: #292f4c !important;
    left: 0;
    top: 0;
    z-index: 99999;
    /* transition: all 0.2s ease-in-out; */
}
.wrapper-body-left .sidebar-header{
    height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.wrapper-body-left .sidebar-header .sidebar-logo{width:50px;height: 19px}
.wrapper-body-left .fixed-tc-icon{padding-top: 3px}
.wrapper-body-left .sidebar-body{
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.wrapper-body-left .sidebar-item{
    display: -ms-flexbox; 
    display: flex;   
    -ms-flex-pack: center; 
    justify-content: center;
}
.wrapper-body-left .sidebar-item .sidebar-dialog-item [class^="tc-icon-"] {
    font-size: 15px
}

.wrapper-body-left .sidebar-item .sidebar-dialog-item .tc-icon-planner {
    font-size: 18px
}
.wrapper-body-left .sidebar-item .sidebar-item-component{
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    transition: background-color 100ms ease;
    position: relative;
    cursor: pointer;
    font-size: 20px;
    color: white
}
.wrapper-body-left .sidebar-item .sidebar-item-component i{
    color: white;
}
.wrapper-body-left .sidebar-footer{
    position: absolute;  
    bottom: 0;
    width: 100%
}
.wrapper-body-left .sidebar-footer .avatar-photo{
    width: 44px;
    height: 44px;
    text-align: center;
    background-color: white
}
.wrapper-body-left .sidebar-footer  .avatar-photo:hover{
    background-color: white;
}
.wrapper-body-left .sidebar-footer .avatar-photo img{
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 2px white solid;
    transition: width 200ms ease,height 200ms ease;
}
.wrapper-body-left .sidebar-footer .avatar-photo img:hover{
    width: 40px;
    height: 40px;
}
.wrapper-body-left .sidebar-footer .sidebar-item{
    margin: 0;
    margin-bottom: 14px;
}

/* left navigation sidebar dialog */
.wrapper-body-left .sidebar-dialog-node{
    display: none
}
.wrapper-body-left .sidebar-dialog-node a{color: inherit}
.wrapper-body-left .sidebar-dialog-node .ds-dialog-content-wrapper{
    position: absolute;
    z-index: 1001;
    left: 90%;
    border-radius: 8px;
    width: 220px;
    box-shadow: 0 4px 17px 6px rgba(0, 0, 0, 0.1);
    border: 1px solid #dddddd;
    background-color: white;
    padding-top: 5px;
    padding-bottom: 5px;
}
.wrapper-body-left .sidebar-dialog-node .ds-dialog-content-wrapper .sidebar-dialog-section{
    border-bottom: 1px #ECECEE solid
}
.wrapper-body-left .sidebar-dialog-node .ds-dialog-content-wrapper .sidebar-dialog-section:last-child{
    border-bottom: 0
}
.wrapper-body-left .sidebar-dialog-node .ds-dialog-content-wrapper .sidebar-dialog-section .sidebar-dialog-item{
    padding: 10px 15px;
}
.wrapper-body-left .sidebar-dialog-node .ds-dialog-content-wrapper .sidebar-dialog-section .sidebar-dialog-item:hover{
    background-color: #f2f2f4;
    cursor: pointer;
}
.wrapper-body-left .sidebar-dialog-node .ds-dialog-content-wrapper .sidebar-dialog-section .sidebar-dialog-item .dialog-title{
    margin-left: 6px
}

.wrapper-body-left.expanded{
    width: 255px !important;
    /* transition: all 0.2s ease-in-out; */
}

.wrapper-body-left.expanded {
    width: 250px; /* Expanded state width */
}

.wrapper-body-left.collapsed {
    width: 75px !important; /* Collapsed state width */
}
.expanded-sidebar-item{
    height: 40px;
    width: 100%;
    display: flex;
    align-items: center;
    transition: all 0.1s ease-in-out;
}
.expanded-sidebar-item-child{
    height: 40px;
    width: 100%;
    display: flex;
    align-items: center;
    transition: all 0.1s ease-in-out;
}
.expanded-sidebar-item-child:hover{
    background-color: rgba(245, 245, 245, .5);
    cursor: pointer;
    color: #ffffff;
}
.favourite-children{
    display: flex; 
    gap: 8px; 
    padding: 0px 10px 0px 34px; 
    justify-content: space-between; 
}
.favourite-children a{
    color: #ffffff;
    font-size: 12px;
    font-weight: 300;
}
.left-menu-expanded{
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    height: 100%;
}
#expanded-menu{
    overflow-y: auto;
    height: 100%;
}
#expanded-menu::-webkit-scrollbar{
    display: none;
}
.expanded-sidebar-item:hover{
    background-color: rgba(0, 154, 255, .1);
    cursor: pointer;
}
.expanded-sidebar-item .expanded-sidebar-item-component a,
.expanded-sidebar-item .expanded-sidebar-item-component a i,
.expanded-sidebar-item .expanded-sidebar-item-component div a,
.expanded-sidebar-item .expanded-sidebar-item-component div span,
.expanded-sidebar-item .expanded-sidebar-item-component div i{
    color: #ffffff;
    font-size: 16px;
}
.expanded-sidebar-item .expanded-sidebar-item-component,
.expanded-sidebar-item-component{
    display: flex;
    justify-content: space-between;
    padding: 0px 12px 0px 12px;
    cursor: pointer;
    width: 100%;
    color: #ffffff;
}
.gap-1{
    gap: 15px
}

/* create new */
#sidebar-widget-create-new-actions .tc-icons{padding: 5px 8px;}

/* tc-icons */
.tc-icons a.tc-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    float: left;
    height: 38px;
    margin: 3px 5px;
    text-align: center;
    width: 38px;
    border-radius: 3px;
    color: white;
    font-size: 26px;
}
.tc-icons a.tc-icon.app_add_btn{background-color: #00A400;}
.tc-icons a.tc-icon.app_duplicate_btn{background-color: #2CA4D7;}
.tc-icons a.tc-icon.app_delete_btn{background-color: #C4360F;}

.wrapper-body-right{
    z-index: 1000;
    height: 100%;
    margin-left: 66px;
    overflow: hidden;
    transition: all 0.2s ease-in-out;
}

.wrapper-body-right.isExpanded{
    margin-left: 255px !important;
}

/* right widget */
.wrapper-body-right .wrapper-body-right-widget.is-expanded {
    width: 255px;
}

.wrapper-body-right .wrapper-body-right-widget {
    position: fixed;
    border-right: 1px solid #E1E1E1;
    z-index: 8000;
    background-color: #ffffff;
    width: 30px;
    transition: width 200ms ease;
    top: 129px;
    bottom: 19px;
}

.wrapper-body-right .wrapper-body-right-widget-expand-button:hover{
    background-color: #009AFF;
}
.wrapper-body-right .wrapper-body-right-widget-expand-button:hover i{
    color: white;
}
.wrapper-body-right .wrapper-body-right-widget-expand-button.is-pinned {
    right: -12px;
}

.wrapper-body-right .wrapper-body-right-widget-expand-button {
    border: 1px solid #E1E1E1;
    border-radius: 50px;
    background-color: #ffffff;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
    width: 23px;
    height: 23px;
    position: absolute;
    top: 18px;
    z-index: 100;
    transition: background-color 200ms ease, padding-left 200ms ease, padding-right 200ms ease, border-color 200ms ease, color 200ms ease;
}

.wrapper-body-right .wrapper-body-right-widget-expand-button.is-pinned .expand-icon {
    -ms-transform: rotate(-180deg);
    transform: rotate(-180deg);
}

.wrapper-body-right .wrapper-body-right-widget-expand-button .expand-icon {
    font-size: 13px;
    transition: transform 200ms ease;
}

.wrapper-body-right .wrapper-body-right-widget-expand-button:not(.is-pinned) {
    left: calc(100% - 12px);
}
.wrapper-body-right .wrapper-body-right-widget-content{
    padding:0px;
    overflow-y: auto;
    height: 100%;
    overflow-x: hidden;
}

.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component{
    display: inline-block;
    width: 100%;
    border-bottom: 1px solid #E1E1E1;
}
.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component:hover .navigation-item-component-header,
.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component:hover .navigation-item-component-header i,
.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component:hover .item-add i{
    color: #009AFF;
}
.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component a{
    color:inherit
}

.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component .navigation-item-component-header{
    padding: 10px 20px;
    display: flex;
    align-items: center;
}

.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component-header.active {
    color: #009AFF;
    background-color: #CCEBFF;
    border-bottom: 1px solid #CCEBFF;
}
.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component-header.active i{
    color: #009AFF;
}

.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component .navigation-item-component-header:hover{
    color: #009AFF;
    cursor: pointer;
}
.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component .navigation-item-component-header:hover i{
    color: #009AFF;
}

.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component .navigation-item-component-header .item-icon{
    display: inline-block;
    margin-right: 8px;
    font-size: 22px;
    width:22px
}
.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component .navigation-item-component-header .item-title{
    display: inline-block;
    width:153px;
    font-size: 15px;
    font-weight: 400;
}
.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component .navigation-item-component-header .item-counter{
    display: inline-block; background-color: #292f4c;
    padding: 2px 10px;
    border-radius: 20px;
    font-size: 13px;
    color: #ffffff;
    font-weight: 400;
}
.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component .navigation-item-component-header .item-add{
    font-size:18px;color:#777;margin-left: 5px
}

.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component .navigation-item-component-body{
    display: none;
    margin-top: 10px;
    padding: 0px 20px 10px 20px
}
.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component .navigation-item-component-body .item-list{
    padding:10px 12px;
    border-radius: 8px;
    display: inline-block;
    width: 100%
}
.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component .navigation-item-component-body .item-list:hover{
    background-color: #f0f0f0;
    cursor: pointer
}
.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component .navigation-item-component-body .item-list .item_list_member_content{
    width:90%;
    display:flex;
    align-items: center;
}
.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component .navigation-item-component-body .item-list:hover .item_list_member_content i,
.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component .navigation-item-component-body .item-list:hover .item_list_member_content .member_list_name,
.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component .navigation-item-component-body .item-list:hover .item_list_member_content .member_list_company{
    color: #009AFF !important;
}
.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component.new_site_setting_menu_sign .navigation-item-component-body .item-list:hover{
    color: #009AFF;
    background: none !important;
    cursor: pointer
}
.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component .navigation-item-component-body .item-list.active{
    color: #009AFF;
    background-color: #CCEBFF;
}
.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component .navigation-item-component-body .item-list .status_span{
    border: medium none;
    color: #ffffff;
    display: inline-table;
    height: 25px;
    line-height: 25px;
    width: 110px;
    z-index: 10;
    margin-bottom: 0;
    text-align: center;
    border-radius: 5px;
}

.wrapper-body-right .wrapper-body-right-widget .widget-section{
    border-bottom: 1px solid #E1E1E1;
    padding: 5px 0px;
    display: inline-block;
    width: 100%;
}
.wrapper-body-right .wrapper-body-right-widget .widget-section .list-group-item{
    line-height: 25px;
}
.wrapper-body-right .wrapper-body-right-widget .widget-section .widget-title{
    padding-top:10px
}
.wrapper-body-right .wrapper-body-right-widget .widget-section .list-group{margin-bottom: 0px}
.wrapper-body-right .wrapper-body-right-widget .widget-section .list-group .list-group-item{
    display: inline-block;
    width: 100%;
    border: none;
    padding: 6px 0px;
}

.wrapper-body-right .wrapper-body-right-content {
    height: 100%;
    width: 100%;
    opacity: 1;
    visibility: visible;
    -webkit-transition: margin-left 200ms ease, visibility 200ms ease, opacity 200ms ease;
    transition: margin-left 200ms ease, visibility 200ms ease, opacity 200ms ease;
}

.wrapper-body-right .wrapper-body-right-content .wrapper-content{
    height: 100%;
    width: 100%;
    min-width: 820px;
    padding: 106px 20px 70px 55px;
}
.wrapper-body-right .wrapper-body-right-content .wrapper-content .navigation-bar{position: fixed;background-color: #fff;z-index: 9;padding-top: 0px;padding-bottom: 15px; margin-top: -6px;}
.wrapper-body-right .wrapper-body-right-content .wrapper-content .content_for_fix_nav_header_tab{border:0;box-shadow:none;padding-top: 70px}

.wrapper-body-right .wrapper-body-right-content .wrapper-content.wrapper-content-expanded{
    padding-left: 280px;
}

/* top header new */
.header .top-header{
    position: fixed;
    width: calc(100% - 66px);
    height: 55px;
    z-index: 9000;
}
/* .wrapper-body-left.collapsed + .top-header {
    width: calc(100% - 60px) ; 
} */
.top-header.full-width {
    width: 100%;
}
.header.top-header .top-header-content{
    background-color: #fff;
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0px 20px 0px 20px;
    position: fixed;
    width: calc(100% - 66px);
    z-index: 90000;
    box-shadow: 2px 0px 8px rgba(41, 47, 76, .1);
    /* transition: all 0.2s ease-in-out; */
}
.top-header-expand{
    width: calc(100% - 255px) !important;
}
.header.top-header .top_search_area{
    display: flex;
    align-items: center;
    gap: 20px;
    height: 100%;
}

.header.top-header .top_search_area div .create_btn_container {
    height: 100%;
    display: flex;
    align-items: center;
    width: 160px;
}

.create_btn_container.active {
    box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.08),0 3px 6px -4px rgba(0, 0, 0, 0.12),0 9px 28px 8px rgba(0, 0, 0, 0.05);
    border-radius: 2px;
}

.header.top-header .top_search_area div .create_btn_container .create_btn{
    padding: 5px 10px 5px 10px;
    border: 1px solid var(--colour-highlight-2);
    border-radius: 20px;
    background-color: var(--colour-highlight-2);
    display: flex;
    align-items: center;
    gap: 5px;
    margin-left: 10px;
}
.header.top-header .top_search_area div .create_btn_container .create_btn:hover {
    cursor: pointer;
    border: solid 1px var(--colour-blue-1);
}

.create_btn_container.active .create_btn.active {
    border: solid 1px var(--colour-blue-1) !important;
}

.header.top-header .app-search .form-control::-moz-placeholder {color:#c4c4cd;}
.header.top-header .quick_result_area{
    display: flex;
    align-items: center;
    gap: 20px;
    height: 100%;
    width: 576px;
    justify-content: center;
    margin-left: -85px;
}
.quick_result_area.visible {
    box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.08),0 3px 6px -4px rgba(0, 0, 0, 0.12),0 9px 28px 8px rgba(0, 0, 0, 0.05);
    transition: box-shadow 0.3s ease;
}
.header.top-header .quick_result_area .input-group input{
    width: 552px;
    border-radius: 20px !important;
    background: #009AFF1A;
    border: none;
    border: 1px solid var(--colour-highlight-2);
    height: 32px !important;
    padding: 0px 55px 0px 35px;
}
.header.top-header .quick_result_area .input-group input::placeholder{
    font-size: 14px !important;
    color: var(--colour-text-2) !important;
}
.header.top-header .quick_result_area .input-group input:focus,
.header.top-header .quick_result_area .input-group input:hover{
    border: 1px solid var(--colour-blue-1);
}
.advance_filter_search{
    position: absolute;
    right: 11px;
    z-index: 99999;
    top: 10px;
    color: var(--colour-gray-4) !important;
    font-size: 14px !important;
}
.header.top-header .top_search_area .input-group .popup_advanced_search_filter{
    margin-left: 40px;
    line-height: 33px;
    text-decoration: none;
}
.header .top-header-content form.top_search .clear_keywords{   
    position: absolute;
    left: 503px;
    top: 9px;
    z-index: 100;
    cursor: pointer;
    display: none;
    color: #6E7175;
    font-size: 16px !important;
} 
.last_search_items_detail_center{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}
.header .top_search .top_last_search_content{position: relative;display: none}
.header .top_search .top_last_search_content .last_search_items_detail{
    min-height: 90px;
    width: 576px;
    border-radius: 4px; 
    position: absolute; 
    background-color: white;
    top:40px;
    left: -12px;
    z-index: 99999;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;
    max-height: 530px !important;
}
.header .top_search .top_last_search_content .last_search_items_detail .last_item_detail_content {
    padding: 0px 12px 0px 12px;
    width: 100%;
    max-height: 480px !important;
    overflow-y: auto;
    scrollbar-color: var(--colour-gray-3) transparent; 
    scrollbar-width: thin;
    display: flex;
    gap: 8px;
    flex-direction: column;
}
.header .top_search .top_last_search_content .last_search_items_detail .last_item_detail_content .each_item_detail{padding: 4px; display: flex; gap: 10px; border-radius: 4px; min-height: 60px;}
.header .top_search .top_last_search_content .last_search_items_detail .last_item_detail_content .each_item_detail:hover{background-color: #009AFF1A; cursor: pointer;}
.header .top_search .top_last_search_content .last_search_items_detail .last_item_detail_content .each_item_detail:last-child{border-bottom: 0}
.header .top_search .top_last_search_content .last_search_items_detail .last_item_detail_content .each_item_detail .detail_right{max-height: 52px;max-width: 52px}
.header .top_search .top_last_search_content .last_search_items_detail .last_item_detail_content .each_item_detail .detail_right img{max-height: 52px;max-width: 52px}
.header .top_search .top_last_search_content .last_search_items_detail .last_item_detail_content .each_item_detail .detail_left{text-align: left;width: 100%; display: flex; flex-direction: column; gap: 4px;}
.header .top_search .top_last_search_content .last_search_items_detail .last_item_detail_content .each_item_detail .detail_left .quick_result_status_badge{padding: 0px 8px 0px 8px; color: #ffffff; border-radius: 60px;}
.header .top_search .top_last_search_content .last_search_items_detail .last_item_detail_content .each_item_detail .detail_left p{line-height: 14px; margin-bottom: 0px !important; font-size: 12px !important;}
.header .top_search .top_last_search_content .last_search_items_detail .last_item_detail_content .each_item_detail .detail_left .tc-icon-license{font-size: 16px}
.header .top_search .top_last_search_content .last_search_items_detail .last_item_detail_content .each_item_detail .detail_left .tc-icon-planner{font-size: 16px} 

.header .top_search .top_last_search_content .last_search_items_detail .last_search_items_detail_footer{
    display: flex;
    height: 48px;
    align-items: center;
    gap: 4px;
    width: 100%;
    position: relative;
    padding: 12px 4px 12px 4px;
    border-top: 1px solid var(--colour-gray-3);
}

.count-badge{
    border-radius: 60px;
    color: var(--colour-gray-3);
    background-color: var(--colour-blue-5);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    padding: 0px 6px 0px 6px; color: #ffffff; border-radius: 60px;
    font-weight: 400 !important;
}

.header .top_search .top_last_search_content .last_search_items_detail .last_search_items_detail_footer_item{
    border-radius: 30px;
    border: 1px solid #E1E1E1;
    padding: 4px 6px 4px 6px;
    height: 24px;
    display: flex;
    gap: 4px;
    align-items: center;
    transition: all 0.2s ease-in-out;
}
.header .top_search .top_last_search_content .last_search_items_detail .last_search_items_detail_footer_item:hover{
    border: 1px solid #009AFF;
    color: #009AFF;
    cursor: pointer;
}
.image-cell{
    max-width: 52px;
    width: 100%;
    max-height: 52px;
    height: 100%;
    object-fit: contain;
}

#toggle-menu:hover{
    cursor: pointer;
}

.top_search_area .sidebar-dialog-node{
    display: none
}
.create_btn_container .create_btn:hover,
.sidebar-dialog-node:hover {
    display: block;
}

.top_search_area .sidebar-dialog-node a{color: inherit}
.top_search_area .sidebar-dialog-node .ds-dialog-content-wrapper{
    position: absolute;
    z-index: 1001;
    border-radius: 2px;
    width: 160px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;
    background-color: white;
    padding-top: 5px;
    padding-bottom: 5px;
    top: 45px;
}
.top_search_area .sidebar-dialog-node .ds-dialog-content-wrapper.expanded{
    right: 1436px;
}
.top_search_area .sidebar-dialog-node .ds-dialog-content-wrapper .sidebar-dialog-section{
    border-bottom: 1px #ECECEE solid
}
.top_search_area .sidebar-dialog-node .ds-dialog-content-wrapper .sidebar-dialog-section:last-child{
    border-bottom: 0
}
.top_search_area .sidebar-dialog-node .ds-dialog-content-wrapper .sidebar-dialog-section .sidebar-dialog-item{
    padding: 10px 15px;
}
.top_search_area .sidebar-dialog-node .ds-dialog-content-wrapper .sidebar-dialog-section .sidebar-dialog-item:hover{
    background-color: #009AFF1A;
    cursor: pointer;
}
.top_search_area .sidebar-dialog-node .ds-dialog-content-wrapper .sidebar-dialog-section .sidebar-dialog-item .dialog-title{
    margin-left: 6px
}

/* top header */
/* .header.top-header{
    position: fixed;
    width: calc(100% - 66px);
    float: left;
    background-color: blue;
    padding-left: 0px;
    padding-right: 0px;
    z-index: 9000;
} */

/* .header.top-header .top-header-content{
    background-color: #f5f6f8;
    padding-top: 4px;
    padding-bottom: 4px;
    border-radius: 12px 0 0 0;
}

.header .top-header-content form.top_search .clear_keywords{   
    position: absolute;
    left: 230px;
    top: 10px;
    z-index: 100;
    cursor: pointer;
    display: none
} */
/*.header.top-header .top-header-content .navbar-custom-menu > li{
    padding: 0px;
    display: inline-block;
    margin-left: 5px;
    position: relative;
    list-style: none;
}*/
/* .header.top-header .app-search{
    position:relative;
    margin-top:8px;
    margin-bottom:8px;
}

.header.top-header .app-search .form-control,
.header.top-header .app-search .form-control:focus{
    border:1px solid #E1E1E1;
    font-size:13px;
    padding-left:30px;
    height: 33px;
    box-shadow:none;
}

.header.top-header .app-search .form-control::-moz-placeholder {	color:#c4c4cd;}
.header.top-header .top_search_area{
    text-align: center;
    width: 100%;
}
.header.top-header .top_search_area .input-group{
    margin: 0 auto;
    display: inline-block;
}
.header.top-header .top_search_area .input-group input{
    width: 250px;
    margin-right: -1px;
}
.header.top-header .top_search_area .input-group .input-group-btn{
    float: left;
}
.header.top-header .top_search_area .input-group .popup_advanced_search_filter{
    margin-left: 40px;
    line-height: 33px;
    text-decoration: none;
}

.header.top-header .notification_default_data .obj_img_tmp{
    width: 50px;
    height: 50px;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

.header.top-header .notification_default_data .obj_img_tmp img{
    max-height: 50px;
    max-width: 50px;
}
.header.top-header .notification_default_data .order_advertised{
    position: absolute;
    top: 23px;
    left: 23px;
}

.header.top-header .top_search button{
    border: 1px solid #00A65A;
    border-radius: 0 5px 5px 0;
}

.header .top_search .input-group input{
    width: 250px;
    border-radius: 5px 0 0 5px !important;
}

.header .top_search .input-group input::-webkit-input-placeholder{
    color: #777;
    opacity: 1;
}
.header .top_search .input-group input:-moz-placeholder{
    color: #777;
    opacity: 1;
}
.header .top_search .input-group input::-moz-placeholder{
    color: #777;
    opacity: 1;
}
.header .top_search .input-group input:-ms-input-placeholder{
    color: #777;
    opacity: 1;
}

.header .top_search .top_last_search_content{position: relative;display: none}
.header .top_search .top_last_search_content .last_search_items_detail{
    min-height: 90px;
    width: 315px;
    border-radius: 4px; 
    border:1px #E1E1E1 solid;
    position: absolute; 
    background-color: white;
    top:5px;
}
.header .top_search .top_last_search_content .last_search_items_detail .each_item_detail{padding: 10px;border-bottom: 1px #E1E1E1 solid;display: flex;cursor: pointer}
.header .top_search .top_last_search_content .last_search_items_detail .each_item_detail:hover{background-color: #f5f5f5}
.header .top_search .top_last_search_content .last_search_items_detail .each_item_detail:last-child{border-bottom: 0}
.header .top_search .top_last_search_content .last_search_items_detail .each_item_detail .detail_right{position: relative;margin-right: 10px;height: 68px; width: 68px;}
.header .top_search .top_last_search_content .last_search_items_detail .each_item_detail .detail_right img{max-height: 66px;max-width: 66px}
.header .top_search .top_last_search_content .last_search_items_detail .each_item_detail .detail_left{text-align: left;width: 205px;}
.header .top_search .top_last_search_content .last_search_items_detail .each_item_detail .detail_left p{margin-bottom: 5px}
.header .top_search .top_last_search_content .last_search_items_detail .each_item_detail .detail_left p:last-child{margin-bottom: 0px}
.header .top_search .top_last_search_content .last_search_items_detail .each_item_detail .detail_left .tc-icon-license{font-size: 16px}
.header .top_search .top_last_search_content .last_search_items_detail .each_item_detail .detail_left .tc-icon-planner{font-size: 16px} */

/* buttom footer */
.footer.buttom-footer{
    position: fixed;
    width: 25px;
    float: left;
    background-color:#292f4c;
    padding-left: 0px;
    padding-right: 0px;
    z-index: 9000;
    padding: 0;
    bottom: -1px;
    border:0
}

.footer.buttom-footer .buttom-footer-left-content{
    background-color: white;
    height: 19px;
}

/* panel section */
.section-panel{
    margin-bottom: 30px;
    box-shadow: none!important;
    -webkit-box-shadow: none!important;
    display: inline-block;
    width: 100%;
}
.section-panel.is_contraction{margin-bottom: 0px}
.section-panel.is_contraction .section-panel-title{
    background-color: #f5f6f8;
    border: 1px solid #e6e9ef;
    border-radius: 3px;
    padding: 5px 3px;
    margin-bottom: 0px
}

.section-panel .section-panel-title{margin-bottom:10px;border-bottom: 0;}
.section-panel .section-panel-title span.header_span{color:var(--colour-gray-4); display: inline-block;line-height: 28px;height: 28px;float: left;margin-right: 10px}
.section-panel .section-panel-title span.title_count{
    margin-top:-1px;
    float: right;
    display: none
}
.section-panel .section-panel-title span.title_iocn{
    ms-flex-align: center;
    align-items: center;
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 0 0 30px;
    flex: 0 0 30px;
    -ms-flex-pack: center;
    justify-content: center;
    max-width: 30px;
    padding-bottom: 1px;
    position: relative;
    z-index: 1;
}
.section-panel .section-panel-title span.title_iocn i{
    width: 20px;
    height: 20px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    transition: color 0.1s ease, background-color 0.1s ease, opacity 0.1s ease;
    cursor: pointer;
}
span.title_iocn i.tips_icon{border:none;font-size:18px!important;}

.section-panel .section-panel-title span.panel_content_expand_iocn i{
    cursor: pointer;
}

/* actions in top */
.top_action_group .action_setting.active{
    color:#428bca;
    background-color: white;
    border-top: 0;
}

.top_action_group .section_actions_popup.active{
    display: block;
    bottom: 24px;
}

/* actions in bottom */
.bottom_action_group .action_setting.active{
    border-bottom: 0;
}

.bottom_action_group .section_actions_popup.active{
    display: block;
}

/* section action group */
.section_action_group{position:relative}
.section_action_group .section_actions_popup{
    text-align: left;
    border-radius: 5px;
    padding: 10px;
    border: 1px #e1e1e1 solid;
    width: 200px;
    min-height: 40px;
    position: absolute;
    right: 0;   
    background-color: white;
    display: none;
    z-index: 99
}
.section_action_group .section_actions_popup p{
    margin-bottom: 0px;
    padding: 5px;
    line-height:18px;
    cursor: pointer
}
.section_action_group .section_actions_popup .separation_line{border-top:1px #e1e1e1 solid}
.section_action_group .section_actions span:hover{cursor: pointer}
.section_action_group .action_setting{
    display:inline-block;
    text-align: center ; 
    z-index: 10;
    position: relative; 
}
.section_action_group span{
    margin-right: 3px;
    margin-left: 3px;
}

/* kindeditor */
.ke-container{border: 1px solid #E1E1E1!important;border-radius: 5px!important;}
.ke-statusbar{
    background:none!important;
    border-top:0!important;
}
.ke-statusbar .ke-statusbar-center-icon{background:none}
.ke-toolbar{background:none!important;border-bottom-color:#E1E1E1!important }
.ke-toolbar .ke-outline{border: 1px solid white!important;}
.ke-toolbar .ke-outline:hover{border-color: #428bca!important;}

/*  color */
.bg-light-green{	background-color:#00A65A;}
.bg-light-green i{	color:#fff !important;}
.text-light-green{	color:#00A65A;}
.text-light-green .tip-left-indicator-checkbox.checked i{color: #00A65A;}

.bg-light-cyan-blue{	background-color:rgb(0, 200, 117);}
.text-light-cyan-blue{	color:rgb(0, 200, 117);}
.text-light-cyan-blue .tip-left-indicator-checkbox.checked i{color:rgb(0, 200, 117);}

.bg-light-red{	background-color:#FF158A;}
.text-light-red{	color:#FF158A;}
.text-light-red .tip-left-indicator-checkbox.checked i{color:#FF158A;}

.bg-light-vermilion-red{	background-color:#FF642E;}
.text-light-vermilion-red{	color:#FF642E;}
.text-light-vermilion-red .tip-left-indicator-checkbox.checked i{color:#FF642E;}

.bg-light-pink{	background-color:#FF5AC4;}
.text-light-pink{	color:#FF5AC4;}
.text-light-pink .tip-left-indicator-checkbox.checked i{color:#FF5AC4;}

.bg-light-yellow{	background-color:#FFCB00;}
.text-light-yellow{	color:#FFCB00;}
.text-light-yellow .tip-left-indicator-checkbox.checked i{color:#FFCB00;}

.bg-light-blue{	background-color:#0086C0;}
.text-light-blue{	color:#0086C0;}
.text-light-blue .tip-left-indicator-checkbox.checked i{color:#0086C0;}

.bg-light-purple{	background-color:#A25DDC;}
.text-light-purple{	color:#A25DDC;}
.text-light-purple .tip-left-indicator-checkbox.checked i{color:#A25DDC;}

.bg-light-orange{	background-color:#FDAB3D;}
.text-light-orange{	color:#FDAB3D;}
.text-light-orange .tip-left-indicator-checkbox.checked i{color:#FDAB3D;}

.bg-light-gray{	background-color:#C4C4C4;}
.text-light-gray{	color:#C4C4C4;}
.text-light-gray .tip-left-indicator-checkbox.checked i{color:#C4C4C4;}

.bg-light-dark{	background-color:#292F4C;}
.text-light-dark{	color:#292F4C;}
.text-light-dark .tip-left-indicator-checkbox.checked i{color:#292F4C;}

.bg-light-sky-blue{background-color: #009aff;}
.text-light-sky-blue{	color:#009aff !important;}
.text-light-sky-blue .tip-left-indicator-checkbox.checked i{color:#009aff;}

.bg-light-grass-blue{background-color: #66CCFF;}
.text-light-grass-blue{	color:#66CCFF;}
.text-light-grass-blue .tip-left-indicator-checkbox.checked i{color:#66CCFF;}

.light-background-color{background-color: #f5f6f8!important;border-bottom: 1px solid #e6e9ef!important;}

/* line component*/
.line-component-wrapper{width: 100%; z-index: 0;background-color:#fff}
.line-component-wrapper.header_wrapper{
    /*background-color:#eef0f3*/
}
.line-component-wrapper.hover:hover{background-color: #f5f5f5}
.line-component-wrapper-title{background-color: inherit}
.line-component-wrapper input{border: none;}
.line-component-wrapper .line-component-wrapper-content {
    display: -ms-flexbox;
    display: flex;
    /*border-bottom: 1px solid white;*/
    height: 36px;
    line-height: 36px;
}
.line-component-wrapper .line-component-wrapper-content.adaptive-height {
    height: 100%;
}
.line-component-wrapper .line-component-wrapper-content.adaptive-height .component-cell{
    padding-bottom: 3px;
    align-items: flex-start;
    align-self: flex-start;
}
.line-component-wrapper .line-component-wrapper-content.adaptive-height .field_label{
    display: flex;
    align-items: baseline;
}
.line-component-wrapper .line-component-wrapper-content.adaptive-height .field_label div.item_description{
    line-height: 22px
}
.line-component-wrapper .cell-component-content.name-cell {
    -ms-flex: 1 0 308px;
    flex: 1 0 308px;
}

.line-component-wrapper .cell-component-content:not(.color-cell) {
    border-bottom: 1px solid #e6e9ef;
}
.line-component-wrapper .cell-component-content {
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: center;
    font-size: 13px;
    font-weight: 400;
    height: 100%;
    border-right: 1px solid #fff;
    position: relative;
    width: 50%;
}
.line-component-wrapper .line-cell-component {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    padding: 0;
    height: 100%;
    text-align: left;
}
.line-component-wrapper .line-cell-component .tip-left-indicator {
    -ms-flex: 0 0 8px;
    flex: 0 0 8px;
    height: 100%;
    transition: flex-basis 0.1s ease-in;
    transition: flex-basis 0.1s ease-in, -ms-flex-preferred-size 0.1s ease-in;
    position: relative;
}

.line-component-wrapper .line-cell-component .fake_tip-left-indicator {
    -ms-flex: 0 0 8px;
    flex: 0 0 8px;
    height: 100%;
    transition: flex-basis 0.1s ease-in;
    transition: flex-basis 0.1s ease-in, -ms-flex-preferred-size 0.1s ease-in;
    position: relative;
}
.line-component-wrapper .line-cell-component .tip-left-indicator.show_checkbox {
    -ms-flex-basis: 34px;
    flex-basis: 34px;
    cursor: pointer;
}

.line-component-wrapper .line-cell-component .tip-left-indicator .tip-left-indicator-checkbox {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: inherit;
    position: absolute;
    background-color: rgba(0, 0, 0, 0.2);
    outline: 1px rgba(255, 255, 255, 0.2) solid;
    top: 10px;
    left: 10px;
    height: 14px;
    width: 14px;
}
.line-component-wrapper .line-cell-component .tip-left-indicator .tip-left-indicator-checkbox.checked{background-color: #FFF;}

.line-component-wrapper .component-cell {
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 1;
    flex: 1;
    -ms-flex-align: center;
    align-items: center;
    min-width: 0;
    padding-left: 10px;
    text-decoration: none;
    font-weight: 400;
    font-size: 13px;
}
.line-component-wrapper .line-component-add-line {cursor: pointer}
.line-component-wrapper .line-component-add-line:hover{ color: #00a65a;}

/* component-cell-title  component-cell-data */
.line-component-wrapper .component-cell .component-cell-title{
    width: 40%;
}
.line-component-wrapper .component-cell .component-cell-data{
    width: 60%;
}
.line-component-wrapper .component-cell .component-cell-data.data-price{
    width: 30%;
}
.line-component-wrapper .component-cell .component-cell-data-currency{
    width: 30%;
}
/* 行内编辑 */
.line-component-wrapper.inline_block{background-color:transparent}
.line-component-wrapper.inline_block .line-component-wrapper-content{height:32px;line-height: 32px}
.line-component-wrapper.inline_block .cell-component-content{width:100%;border-bottom:0px;border-right:0px}
.line-component-wrapper.inline_block .component-cell{padding-left:0px}
.line-component-wrapper.inline_block .component-cell-data.can_edit{width:100%}
.line-component-wrapper.inline_block .field_save_loading_image{top: 7px!important;right: 8px;}
.line-component-wrapper.inline_block .input{padding:0px 2px}

/* component cell data */
.component-cell-data input{
    height: 24px;
    padding-top: 0px;
    padding-bottom: 0px;
    border-color: #e6e9ef;
    display: inline-block;
    margin-top: 0px
}
.component-cell-data select{
    height: 24px;
    padding-top: 0px;
    padding-bottom: 0px;
    border-color: #e6e9ef;
    display: inline-block
}
.component-cell-data textarea{
    resize:vertical;
    min-height: 24px;
    padding-top: 0px;
    padding-bottom: 0px;
    border-color: #e6e9ef;
    display: inline-block;
    vertical-align: middle;
    z-index: 1;
    background-color: white;
    position: relative
}
.component-cell-data input:focus{
    outline: none;
}
.component-cell-data select:focus{
    outline: none;
}
.component-cell-data textarea:focus{
    outline: none;
}
/* component cell data edit */
.component-cell-data.can_edit .field_label{
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    width: 100%;
    border: 1px transparent dashed
}
.component-cell-data.can_edit .has_error{border: 1px #FF158A solid!important;border-radius: 3px;}
.component-cell-data.can_edit .has_error ul{
    position: absolute;
    background-color: #FF158A;
    border: 1px #FF158A solid;
    color: white;
    padding: 5px;
    z-index: 9;
    top:37px;
    border-radius: 3px;
}
.component-cell-data.can_edit .field_label.has_error ul{
    left: 0;
}
.adaptive-height .component-cell-data.can_edit .has_error ul{
    top:0px;
}
.component-cell-data.can_edit .has_error ul li{color: white;}
.component-cell-data.can_edit .has_error:before{
    color:#FF158A
}

.adaptive-height .component-cell-data.can_edit .field_label{
    white-space: normal
}

.component-cell-data .field_edit{display: none}
.component-cell-data.active{text-align: center}
.component-cell-data.active{background-color: #DCEEFC}
.component-cell-data.active .field_label{display: none!important}
.component-cell-data.active .field_edit{display: block;position: relative}
.component-cell-data.active .field_save_loading_image{
    background:url("/asset/jcore/images/common/loader/1.gif") no-repeat scroll;
    width: 18px;
    height: 18px;
    display: inline-block;
    position: absolute;
    top: 9px;
    right: 12px;
    display: none;
    z-index: 2;
}
.component-cell-data.active input{border:1px #808080 dashed;width: 95%;margin-top: 0px;line-height: 24px}
.component-cell-data.active select{border:1px #808080 dashed;width: 95%;margin-top: 0px}
.component-cell-data.active textarea{border:1px #808080 dashed;width: 100%;min-height: 80px}


/* for select. click one to show drop down content */
.component-cell-data-select{width: 60%}
.component-cell-data-select.data-currency{width: 30%}
.component-cell-data-select select{
    height: 24px;
    padding-top: 0px;
    padding-bottom: 0px;
    border-color: #e6e9ef;
    display: inline-block
}
.component-cell-data-select.can_edit .field_edit{display: block;cursor: pointer;border:1px transparent solid;padding-left: 3px;}

.component-cell-data-select.can_edit .field_edit select{
    padding:0;
    border: 0;
    box-shadow: none;
    cursor: pointer;
    appearance:none;   
   -moz-appearance:none;   
   -webkit-appearance:none;
   width: 80%;
   font-size: 13px;
}
.component-cell-data-select.can_edit .field_edit select::-ms-expand {display: none;} 
.component-cell-data-select.can_edit{background-color: transparent}
.component-cell-data-select.can_edit.active .field_edit{background-color: #DCEEFC;border: 0!important;text-align: center}
.component-cell-data-select.can_edit.active .field_edit select{
    padding: 0 12px;
    border:1px #808080 dashed;
    width: 95%; 
}
.component-cell-data-select.can_edit .field_edit:hover{
    border: 1px #009AFF dashed;
    cursor: pointer;
}
.component-cell-data-select.can_edit.active .field_edit .select-icon-tips{display: none}
.component-cell-data-select.can_edit.require .field_edit:hover .select-icon-tips:before{color:#FF158A;}
.component-cell-data-select.can_edit .field_edit:hover .select-icon-tips:before{color:#009AFF;}
.component-cell-data-select.can_edit .select-icon-tips:before{
    font-family: "Font Awesome 5 Pro";
    content: "\f303";
    cursor: text;
    margin-right: 5px;
    cursor: pointer;
    font-style: normal;
}
.component-cell-data-select.active .field_save_loading_image{
    background:url("/asset/jcore/images/common/loader/1.gif") no-repeat scroll;
    width: 18px;
    height: 18px;
    display: inline-block;
    position: absolute;
    top: 9px;
    right: 12px;
    display: none;
    z-index: 2;
}
.component-cell-data-select.can_edit .has_error{border: 1px #FF158A solid!important;border-radius: 3px;}
.component-cell-data-select.can_edit .has_error ul{
    position: absolute;
    background-color: #FF158A;
    border: 1px #FF158A solid;
    color: white;
    padding: 5px;
    z-index: 9;
    top:37px;
    border-radius: 3px;
}
.component-cell-data-select.can_edit .field_label.has_error ul{left: 0;}
.adaptive-height .component-cell-data-select.can_edit .has_error ul{top:0px;}
.component-cell-data-select.can_edit .has_error ul li{color: white;}
.component-cell-data-select.can_edit .has_error:before{color:#FF158A}
.component-cell-data-select .form-control[disabled]{
    background-color: #fff;
    border:0;
    box-shadow: none;
    appearance:none;   
   -moz-appearance:none;   
   -webkit-appearance:none;
   cursor:default;
   font-size: 13px;
   padding-left: 0px
}

.disabled-multiselect-style{
    border: none !important;
    box-shadow: none !important;
}

/* user first 2 letter */
.resource_item {
    display: inline-block;
    width: 26px;
    height: 26px;
    line-height: 26px;
    border-radius: 13px;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
}
.resource_item_default{
    color: #fff;
    background-color: #8B00FF;
}
.resource_item_a{
    color: #fff;
    background-color: #E32636;
}
.resource_item_b{
    color: #fff;
    background-color: #0095B6;
}
.resource_item_c{
    color: #fff;
    background-color: #C41E3A;
}
.resource_item_d{
    color: #fff;
    background-color: #FED85D;
}
.resource_item_e{
    color: #fff;
    background-color: #50C878;
}
.resource_item_f{
    color: #fff;
    background-color: #801818;
}
.resource_item_g{
    color: #fff;
    background-color: #E49B0F;
}
.resource_item_h{
    color: #fff;
    background-color: #5218FA;
}
.resource_item_i{
    color: #fff;
    background-color: #00416A;
}
.resource_item_j{
    color: #fff;
    background-color: #00A86B;
}
.resource_item_k{
    color: #fff;
    background-color: #4CBB17;
}
.resource_item_l{
    color: #fff;
    background-color: #C8A2C8;
}
.resource_item_m{
    color: #fff;
    background-color: #E0B0FF;
}
.resource_item_n{
    color: #fff;
    background-color: #000080;
}
.resource_item_o{
    color: #fff;
    background-color: #CC7722;
}
.resource_item_p{
    color: #fff;
    background-color: #FFC0CB;
}
.resource_item_q{
    color: #fff;
    background-color: #6C6961;
}
.resource_item_r{
    color: #fff;
    background-color: #00CCCC;
}
.resource_item_s{
    color: #fff;
    background-color: #FF8C69;
}
.resource_item_t{
    color: #fff;
    background-color: #D2B48C;
}
.resource_item_u{
    color: #fff;
    background-color: #120A8F;
}
.resource_item_v{
    color: #fff;
    background-color: #8B00FF;
}
.resource_item_w{
    color: #fff;
    background-color: #C9A0DC;
}
.resource_item_x{
    color: #fff;
    background-color: #eeed09;
}
.resource_item_y{
    color: #fff;
    background-color: #FFFF00;
}
.resource_item_z{
    color: #fff;
    background-color: #506022;
}
/* actions */
.wrapper-body-right .wrapper-body-right-widget-content .navigation-item-component .navigation-item-component-body.actions-component{display: block;padding-left: 8px;padding-right: 8px}
#widget_actions .widget_action_add{background-color: #00a65a;}
#widget_actions .widget_action_add i{color: #fff;}
#widget_actions .widget_action_copy{background-color: #009AFF;}
#widget_actions .widget_action_copy i{color: #fff;}
#widget_actions .widget_action_delete{background-color: #FF158A;}
#widget_actions .widget_action_delete i{color: #fff;}
#widget_actions .widget_history_popup{background-color: #85868d;}
#widget_actions .widget_history_popup i{font-size: 22px;color: #fff;}
#widget_actions .widget_advanced_popup{background-color: #FDAB3D;}
#widget_actions .widget_advanced_popup i{font-size: 22px;color: #fff;}

#widget_actions .right_col_actions {background: #ffffff none repeat scroll 0 0;width: 249px;}
#widget_actions .actions_cells { }
#widget_actions .actions_cells a:hover {opacity: 0.7;}
#widget_actions .actions_cells a i{
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    font-size: 24px;
    margin-top: 8px;
}
#widget_actions .actions_cells a {
    display: inline-block;
    height: 38px;
    margin: 5px 4px 5px 4px;
    width: 38px;
    float: left;
    text-align: center;
    border-radius: 3px;
}
#widget_actions .actions_cells .style_history:hover{color: white}

.widget_wrapper .widget_group .widget_documents ul.nav li strong {float: left;margin-right: 3px;width: 92px;}
.datepicker-dropdown.dropdown-menu{z-index: 11000}

/* status change drop down */
.navigation-status-component-wrapper .current-status-label{
    width: 140px;
    height: 32px;
    line-height: 32px;
    color: white;
    border-radius: 3px;
}
.navigation-status-component-wrapper .current-status-label:hover{
    opacity: 0.8;
    cursor: pointer;
}
.navigation-status-component-wrapper .status-drop-down-picker{
    position:relative;
    display: none;
    z-index: 10;
}
.navigation-status-component-wrapper .status-drop-down-picker-wrapper{
    width: 144px;
    position: absolute;
    z-index: 10;
    border: 1px solid #C4C4C4;
    background: #ffffff;
    box-shadow: 0 8px 16px 0px rgba(0, 0, 0, 0.32);
    border-radius: 4px;
    font-size: 13px;
    transition: width 0.1s;
    pointer-events: all;
    padding: 16px
}

.navigation-status-component-wrapper .status-drop-down-picker-wrapper:before {
    content: " ";
    position: absolute;
    border: solid transparent;
    bottom: 100%;
    border-color: rgba(225, 225, 225, 0);
    pointer-events: none;
    height: 0;
    width: 0;

    right: 50%;
    -ms-transform: translateX(50%);
    transform: translateX(50%);
    border-bottom-color: #FFF;
    border-width: 10px;
}

.navigation-status-component-wrapper .status-drop-down-picker-wrapper .status-picker-color-option {
    display: inline-block;
    width: 100%;
    height: 32px;
    line-height: 32px;
    color: #ffffff;
    margin-bottom: 8px;
    text-align: center;
    border-radius: 3px;
}

.navigation-status-component-wrapper .status-drop-down-picker-wrapper .status-picker-color-option:hover {
    opacity: 0.8;
    cursor: pointer;
}
.navigation-status-component-wrapper .status-drop-down-picker-wrapper .status-picker-color-option:last-child{
    margin-bottom: 0;
}
.navigation-status-component-wrapper .item-list:hover{
    background-color: inherit!important;
    cursor: default!important;
}

.navigation-status-component-wrapper .status_error_wrapper{position:relative;width: 100%;display: none}
.navigation-status-component-wrapper .status_error_wrapper .status_error_message{
    position: absolute;
    top: 5px;
    padding: 5px;
    border-radius: 3px;
    width: 100%;
    color: white
}

.width_10_percent{width:10%!important}
.width_20_percent{width:20%!important}
.width_30_percent{width:30%!important}
.width_40_percent{width:40%!important}
.width_50_percent{width:50%!important}
.width_60_percent{width:60%!important}
.width_70_percent{width:70%!important}
.width_80_percent{width:80%!important}
.width_90_percent{width:90%!important}
.width_100_percent{width:100%!important}

.wrapper-body-right .component_cell_search_content{
    border:1px solid #e6e9ef;
    min-width:250px;
    max-width: 500px;
    max-height: 300px;
    overflow-y: auto;
    position: absolute;
    background-color: white;
    z-index: 2;
    display: none
}
.wrapper-body-right .component_cell_search_content_new{
    border:1px solid #e6e9ef;
    position: absolute;
    background-color: white;
    z-index: 2;
    display: none;
    box-shadow: 0px 9px 28px 8px #0000000D;
    overflow: hidden;
}

.style_costing_section {
    width: 720px;
    max-height: 378px;
    table-layout: fixed;
}
.style_costing_section .contract_name {
    display: flex;
    align-items: center;
    gap: 8px;
}

.style_costing_section .style_costing_header_title {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.style_costing_section .style_costing_header_title .style_costing_header_title_separator {
    height: 14px;
    width: 2px;
    background-color: var(--colour-gray-3);
    display: block;
}

.style_costing_section thead {
    position: sticky;
    top: 0;
    background-color: white;
    z-index: 1;
}

.style_costing_section thead>tr>th {
    vertical-align: bottom;
    border-bottom: 1px solid #E1E1E1;
    font-size: 14px;
    font-weight: 500;
    color: var(--colour-text-1);
    text-align: center;
    align-items: center;
    vertical-align: middle;
}

.style_costing_section tbody>tr>td {
    vertical-align: middle;
    align-items: center;
    text-align: center;
    font-size: 14px;
    font-weight: 400;
    color: var(--colour-text-1);
    width: 100%;
}

.style_costing_section thead th {
    position: sticky;
    top: 0;
    background-color: var(--colour-highlight-1);
    z-index: 1;
}

.scroll-body {
    max-height: 378px;
    overflow-y: auto;
    width: 100%;
    scrollbar-color: var(--colour-gray-3) transparent;
    scrollbar-width: thin;
    position: relative;
}

.license_item_select {
    width: 14px !important;
    height: 16px !important;
}

.hover-highlight {
    background-color: var(--colour-highlight-2) !important;
}

/* tc confirm batch actions popup */
.tc-confirm-batch-actions-menu-wrapper{display: none}
.tc-confirm-batch-actions-menu {
    transition: bottom 0.2s ease;
    position: absolute;
    width: 800px;
    height: 63px;
    z-index: 1000001;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0px 22px 104px -6px rgba(0, 0, 0, 0.34);
    -ms-flex-direction: row;
    flex-direction: row;
    display: -ms-flexbox;
    display: flex;
    bottom: 35px;
}

.tc-confirm-batch-actions-menu .number-of-actions {
    width: 63px;
    color: #fff;
    border-radius: 5px 0px 0px 5px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    cursor: default;
    font-size: 30px;
}

.tc-confirm-batch-actions-menu .batch-actions-title-section {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex: 1;
    flex: 1;
    cursor: default;
    margin-left: 20px;
}
.tc-confirm-batch-actions-menu .batch-actions-title-section .title {
    font-size: 24px;
    font-weight: 100;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 400px;
}
.tc-confirm-batch-actions-menu .batch-actions-title-section .more-dots {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    height: 20px;
}
.tc-confirm-batch-actions-menu .batch-actions-title-section .more-dots .dot {
    width: 8px;
    height: 8px;
    border-radius: 20px;
    margin-right: 5px;
}
.tc-confirm-batch-actions-menu .batch-actions-items{
    display: -ms-flexbox;
    display: flex;
    align-items: center
}
.tc-confirm-batch-actions-menu .batch-actions-item {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
    margin-right: 20px;
    cursor: pointer;
}

.tc-confirm-batch-actions-menu .batch-actions-item .action-icon {
    font-size: 21px;
    position: relative;
}

.tc-confirm-batch-actions-menu .batch-actions-item .action-name {
    position: relative;
    bottom: -4px;
}
.tc-confirm-batch-actions-menu .batch-actions-delete-item {
    display: -ms-flexbox;
    display: flex;
    width: 63px;
    text-align: center;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    border-left: 1px solid #E1E1E1;
}
.tc-confirm-batch-actions-menu .batch-actions-delete-item span:hover {
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    transition: transform 0.5s ease;
    color: var(--colour-blue-1);
    cursor: pointer;
}

/* tc confirm modal popup */
.tc-confirm-modal-wrapper{
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 10000;
    background: rgba(0, 0, 0, 0.4);
    justify-content: center;
    align-items: center;
}
.tc-confirm-modal-content{
    transition: bottom 0.2s ease;
    top: 20%;
    width: 380px;
    z-index: 1000001;
    background: #fff;
    border-radius: 2px;
    box-shadow: 0px 22px 104px -6px rgba(0, 0, 0, 0.34);
    display: flex;
    flex-direction: column;
    padding: 25px 25px 25px 25px;
}
.tc-confirm-modal-section .title{
    font-weight: bold;
    font-size: 15px;
}
.tc-confirm-modal-section .content{
    margin: 5px 0;
}
.tc-confirm-modal-body{
    display: flex;
}
.tc-confirm-modal-body .fa-circle-exclamation{
    color: #faad14;
    font-size: 18px;
    line-height: 1.3;
    margin-right: 15px;
}
.tc-confirm-modal-actions{
    text-align: right;
    margin-top: 15px;
}
.tc-confirm-modal-actions button{
    margin-left: 10px;
}

/* tc right popup */
.tc-right-popup-container .popup-container-panel {
    box-shadow: 0px 0px 10px 0px #999;
    background: white;
    position: fixed;
    top: 0px;
    bottom: 0px;
    right: 0px;
    width: 630px;
    border-left: 1px solid #e1e1e1;
    z-index: 99999;
    max-width: calc(100% - 200px);
    padding: 20px
}

.tc-right-popup-container  .popup-container-panel-overlay {
    width: 100%;
    top: 0px;
    bottom: 0px;
    position: fixed;
    display: block;
    z-index: 99998;
    background-color: #292f4c;
    opacity: 0.4
}
.tc-right-popup-container  .popup-container-panel .popup-container-panel-content,
.tc-right-popup-container  .popup-container-panel .popup-container-panel-content-2
{
    height: 100%;
}

.tc-right-popup-container  .popup-container {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    height: 100%;
}

.tc-right-popup-container  .popup-container .close-btn {
    margin-bottom:10px;
}
.tc-right-popup-container  .popup-container .close-btn i:hover {
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    transition: transform 0.5s ease;
    color:#FF158A;
    cursor: pointer;
}
.tc-right-popup-container  .popup-container .container-content-wrapper .popup_holder .btn{margin-right: 10px}
.tc-right-popup-container  .popup-container .container-content-wrapper {
    position: relative;
}

.tc-right-popup-container .container-content h3{
    font-size: 18px;
    margin: 0px;
    font-weight: normal;
    margin-bottom:20px;
}

.tc-right-popup-container .container-content h3.sub_title{
    font-size: 16px;
}

.tc-right-popup-container .container-content .content{
    overflow-x: hidden; 
    overflow-y: auto;
    position: relative;
}

/* tc center popup */
.tc-center-popup-container{
    position: fixed;
    top: 8%;
    left: 0;
    width: 100%;
    z-index: 100001;
    display: flex;
    justify-content: center;
    align-items: center;
}
.tc-center-popup-container .popup-container-panel {
    box-shadow: 0px 0px 10px 0px #999;
    background: white;
    border-left: 1px solid #e1e1e1;
    border-radius: 12px;
    max-width: calc(100% - 200px);
    overflow: hidden;
}

.tc-center-popup-container  .popup-container-panel-overlay {
    width: 100%;
    top: 0px;
    bottom: 0px;
    position: fixed;
    display: block;
    z-index: 99998;
    background-color: #292f4c;
    opacity: 0.4
}
.tc-center-popup-container  .popup-container-panel .popup-container-panel-content {
    height: 100%;
    max-height: 85vh;
}

.tc-center-popup-container  .popup-container-panel .popup-container-panel-content-2 {
    height: 100%;
    max-height: 85vh;
    overflow-y: scroll;
}

.tc-center-popup-container  .popup-container {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    height: 100%;
    padding: 20px;
}
/*
.tc-center-popup-container  .popup-container .close-btn {
     margin-bottom:10px; 
}*/
.tc-center-popup-container  .popup-container .close-btn i:hover {
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    transition: transform 0.5s ease;
    color: var(--colour-blue-1);
    cursor: pointer;
}
.tc-center-popup-container  .popup-container .container-content-wrapper .popup_holder .btn{margin-right: 10px}
.tc-center-popup-container  .popup-container .container-content-wrapper {
    position: relative;
}

.tc-center-popup-container .container-content h3{
    font-size: 21px;
    margin: 0px;
    font-weight: normal;
    margin-bottom:20px;
}

.tc-center-popup-container .container-content h3.sub_title{
    font-size: 16px;
}

.tc-center-popup-container .container-content .content{
    overflow-x: hidden; 
    overflow-y: auto;
    position: relative;
}

/* pagination */
.pagination>.active>a, .pagination>.active>span, .pagination>.active>a:hover, .pagination>.active>span:hover, .pagination>.active>a:focus, .pagination>.active>span:focus {
    color: #fff!important;
    background-color: #009AFF!important;
    border-color: #009AFF!important;
}
.pagination>li>a, .pagination>li>span {
    color: #009AFF!important;
}
.fa-plus-circle,.fa-times-circle{cursor: pointer;}
.text-overflow{
    overflow:hidden;
    text-overflow:ellipsis;
    -o-text-overflow:ellipsis;
    white-space:nowrap;
}

/* new item */
.new_popup_content_table td {border-top:none!important;padding: 5px!important}
.new_popup_content_table th {border-top:none!important;padding: 5px!important}
.new_popup_content_table td .section_title{font-size: 16px;}
.new_popup_content_table td .half_width{width:45%;display: inline-block;margin-right: 5px}
.new_popup_content_table td input.form-control,.new_popup_content_table td select.form-control{height: 26px!important;padding: 0px 12px!important}
.new_popup_content_table td input.js-datepicker{width: 60%}

#new_order_form .multiple_order{width:80%;display: inline-block}
#new_order_form #order_create_form_style_number{width:80%;display: inline-block}
#new_order_form .change_bulk_order {cursor: pointer;margin-left: 5px}
#new_order_form .order_numbner_td input{margin-right: 0px;float: right}

#popup_create_compliance textarea{resize: vertical;min-height: 50px;width: 100%!important;}
#popup_create_planner textarea{resize: vertical;min-height: 50px;width: 100%!important;}
#popup_create_license textarea{resize: vertical;min-height: 50px;width: 100%!important;}


/*adaptive table*/
.adaptive_component_table{border-spacing: 0px 1px;border-collapse: separate;width: 100%;height: 100%;table-layout: fixed} 
.adaptive_component_table tr.hover:hover td{background-color: #f5f5f5}
.adaptive_component_table .indicator_td{height: 100% }
.adaptive_component_table .indicator_td .left-indicator-tips{display: flex;height: 100%;align-items: center }
.adaptive_component_table .indicator_td .left-indicator-data{margin-left: 10px}
.file_content .file_list .left-indicator-inner,
.adaptive_component_table .indicator_td .left-indicator-inner{
    align-items: center;
    display: flex;
    width: 8px;
    justify-content: center;
    height: 100%;
}
.file_content .file_list .left-indicator-inner.show_checkbox ,
.adaptive_component_table .indicator_td .left-indicator-inner.show_checkbox {
    width: 34px;
    cursor: pointer;    
}

.file_content .file_list .left-indicator-inner .tip-left-indicator-checkbox ,
.adaptive_component_table .indicator_td .left-indicator-inner .tip-left-indicator-checkbox {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: inherit;
    outline: 1px rgba(255, 255, 255, 0.2) solid;
    height: 14px;
    width: 14px;
    border: var(--colour-gray-4) 1px solid;
    border-radius: 3px;
}
#style_activity_list .style_activity_critical_path_item_list .tip-left-indicator-checkbox {
    border: none !important;
}

#style_activity_list .style_activity_critical_path_item_list .tip-left-indicator-checkbox i {
    color: white !important;
}
.file_content .file_list .left-indicator-inner .tip-left-indicator-checkbox.checked{color: inherit}
.adaptive_component_table .indicator_td .left-indicator-inner .tip-left-indicator-checkbox.checked{color: inherit}
.adaptive_component_table td{
    background-color: #fff;
    border-top: 0;
    /* border-right: 1px solid var(--colour-gray-2); */
    border-bottom: 1px solid var(--colour-gray-2);
    border-left: 0;
    height: 36px;
    padding: 0px 10px;
    vertical-align: middle;
}
.adaptive_component_table .indicator_td .fix_header_indicator_td{width: 34px;align-items: center;display: flex;height: 100%;}
.adaptive_component_table td .vertical_align_top{align-self:flex-start; margin-top: 8px;}
.adaptive_component_table tr.header_tr td{
    /*background-color: var(--colour-gray-2);*/
}


.chosen-container-multi .chosen-choices{border-radius: 3px}
.chosen-container-multi{width: calc(100% - 20px)!important}
.chosen-container-multi .search-field input{width: 90%!important}

input[type="number"]{padding-right:0}

.btn-group .btn{padding: 1px 3px}

/* require input, select, textarea */
input:focus:invalid,
input:invalid,
select:focus:invalid,
select:invalid,
textarea:focus:invalid,
textarea:invalid
{
    background: var(--colour-red-4) !important;
    border-color: var(--colour-magenta-3) !important;
}

.new_popup_content_table td.has_error ul li {
    color: var(--colour-magenta-3);
}

/* navigation-bar */
.navigation-bar{
    display: inline-block;
    width: 100%;
    /*margin-bottom: 10px*/
}
.navigation-bar .navigation-bar-item{display: inline-block;padding: 10px;font-size: 20px;position: relative}
.navigation-bar .navigation-bar-item a{color: inherit}
.navigation-bar .navigation-bar-item a:focus{color:#009AFF;text-decoration:none}
.navigation-bar .navigation-bar-item a:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}
.navigation-bar .navigation-bar-item.active{border-bottom: 2px #009AFF solid;color: #009AFF;}
.navigation-bar .navigation-bar-subtab{margin-top: 0px}
.navigation-bar .navigation-bar-subtab .navigation-bar-item{font-size: 18px}
.navigation-bar .navigation-bar-subtab .navigation-bar-item.active{padding: 0 10px;border-bottom: 0;}
.navigation-bar .navigation-bar-item:hover{color: #009AFF;cursor: pointer}

/* nav expand hover */
.navigation-bar .navigation-top-fold-button {
    border: 2px solid #009AFF;
    border-radius: 50px;
    background-color: #ffffff;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 39px;
    z-index: 100;
    transition: background-color 200ms ease, padding-left 200ms ease, padding-right 200ms ease, border-color 200ms ease, color 200ms ease;
}
.navigation-bar .navigation-top-fold-button .expand-icon {
    font-size: 13px;
    transition: transform 200ms ease;
    color: #009AFF;
}
.navigation-bar .navigation-top-fold-button.nav_hover_button {
   background-color: #009AFF!important;
}
.navigation-bar .navigation-top-fold-button.nav_hover_button .expand-icon{
   color: #FFF;
}


.widget_group .obj_img{
    display: table-cell;
    height: 196px;
    text-align: center;
    vertical-align: middle;
    width: 240px;
}

/* item details*/
.global_object_details_content .details_section1{display:flex;margin-top: 10px;margin-bottom: 20px}
.global_object_details_content .details_section1 .left_image{height: 150px;width: 150px;text-align: center;line-height: 150px}
.global_object_details_content .details_section1 .left_image img{max-height: 150px;max-width: 150px}
.global_object_details_content .details_section1 .top_details table td{padding: 5px 0px}
.global_object_details_content .supplier_details_table table td{padding: 5px 10px 5px 0}
.global_object_details_content .supplier_capability_results_list table td{padding: 5px 10px 5px 0}
.global_object_details_content table.table-hover td{background-color: #fff!important;}
.global_object_details_content .table-hover>tbody>tr:hover>td{background-color: #f5f5f5 !important;}
.global_object_details_content table tr.compliance_item_date_overdue td{background-color: #FF158A;color: white}
.global_object_details_content .supplier_details_title{display: inline-block;width: 100%}
.global_object_details_content .supplier_details_title li{float: left;margin-right: 20px;cursor: pointer;font-size: 18px}
.global_object_details_content .supplier_details_title li.active{color: #009AFF;border-bottom: 1px solid #009AFF;}
.global_object_details_content .supplier_details_content .year_capacity_wrapper{
    display: flex;
}
#popup_global_supplier_details .details_section1 {border-top: 1px solid #e1e1e1;border-bottom: 1px solid #e1e1e1;padding: 15px 0;}
#popup_global_supplier_details .details_section1 tr {display: flex;flex-wrap: wrap;}
#popup_global_supplier_details .details_section1 td {border-top:none!important;padding: 5px 10px !important;white-space: nowrap;}
#popup_global_supplier_details .details_section1 td div {width: 100px;display: inline-block;}
#popup_global_license_details .license_item_status{height: 26px;line-height: 26px;color: white;border-radius: 3px;text-align: center}
.global_object_details_content .details_section1 .hover_link_a{
    background-color: #777;
    border-radius:20px;
    padding:1px 5px;
    min-width: 20px;
    display: inline-block;
    text-align: center
}
.global_object_details_content .item_status_label{
    width:100%;
    border-radius: 3px;
    margin-top: 5px;
    padding: 5px 0;
}
.global_object_details_content .details_section1 .app_logo_label{
    vertical-align: middle;
}
.share_btn {
    border: 0;
    background-color: transparent;
    outline: none;
    /* cursor: pointer; */
}

.global_object_details_content .customer_details_title{display: inline-block;width: 100%}
.global_object_details_content .customer_details_title li{float: left;margin-right: 20px;cursor: pointer;font-size: 18px}
.global_object_details_content .customer_details_title li.active{color: #009AFF;border-bottom: 1px solid #009AFF;}

/*qima stat widget*/
.qima_stat .qima_link{
    display: flex;
    flex-direction: row;
    align-items: center;
}
.qima_stat .qima_link span{margin-left: 10px;}
.qima_stat .qima_link img{max-height: 15px; max-width: 60px;}

.wrapper-body-right-widget-content .support_icon_image_wrapper{
    width: 250px;
    margin: 0 auto;
    text-align: center;
    position: relative;
}
.wrapper-body-right-widget-content .support_icon_image_wrapper img{
    max-width: 250px;
}
.wrapper-body-right-widget-content .support_icon_image_wrapper .support_ticket_status_wrapper{
    padding: 0 20px;
    position: absolute;
    bottom: 10px;
    left: 0;
    width: 100%;
}
.wrapper-body-right-widget-content .support_icon_image_wrapper .support_ticket_status_text{
    width: 100%;
    height: 32px;
    line-height: 32px;
    color:white;
    border-radius: 3px;
}
.wrapper-body-right-widget-content .support_icon_image_wrapper .support_ticket_status_open{
    background-color: #FF158A !important;
}
.wrapper-body-right-widget-content .support_icon_image_wrapper .support_ticket_status_closed{
    background-color: #00A65A !important;
}
.margin-left-36{
    margin-left: 36px!important;
}

.tc-object-details-icon{margin-left: 5px;cursor: pointer}
.half_opacity{opacity: 0.5}

/* click icon to edit */
.icon_to_edit_content input{
    height: 24px;
    padding-top: 0px;
    padding-bottom: 0px;
    border-color: #e6e9ef;
    display: inline-block;
    margin-top: 0px
}
.icon_to_edit_content input:focus{outline: none;}
.icon_to_edit_content .field_label i.file_name_edit_icon{margin-right: 5px;cursor: pointer}
.icon_to_edit_content .field_label i.file_name_edit_icon:hover{color: #009AFF}
.icon_to_edit_content .field_edit{display: none}
.icon_to_edit_content.active{text-align: center}
.icon_to_edit_content.active{background-color: #DCEEFC}
.icon_to_edit_content.active .field_label{display: none;}
.icon_to_edit_content.active .field_edit{
    display: block;
    position: relative;
    text-align: left;
    padding-left: 5px;
}
.icon_to_edit_content.active .field_save_loading_image{
    background:url("/asset/jcore/images/common/loader/1.gif") no-repeat scroll;
    width: 18px;
    height: 18px;
    display: inline-block;
    position: absolute;
    top: 9px;
    right: 12px;
    display: none;
    z-index: 2;
}
.icon_to_edit_content.active input{border:1px #808080 dashed;width: 85%;margin-top: 0px;line-height: 24px}
.icon_to_edit_content .error_message{position: absolute;z-index: 10}
.icon_to_edit_content .error_message .tc_message_wrapper{padding-top: 5px;padding-bottom: 5px;}
.icon_to_edit_content .error_message .tc_message_wrapper ul{margin-right: 20px}
.icon_to_edit_content .error_message .tc_message_wrapper button.close{line-height: inherit}

/* custom navtab menu */
.tc_navtab_menu .navtab_title{display: inline-block;width: 100%}
.tc_navtab_menu .navtab_title li{float: left;margin-right: 20px;cursor: pointer;font-size: 18px}
.tc_navtab_menu .navtab_title li.active{color: #009AFF;border-bottom: 1px solid #009AFF;}

#popup_app_file_email_send #adbk{display: block}
#popup_app_file_email_send .adbk_emails_selected{border: 1px solid #ccc;width: 100%;border-radius: 3px;float: left;box-shadow: inset 0 1px 1px rgba(0,0,0,.075);}
#popup_app_file_email_send .adbk_trends_emails{float: left;line-height: 20px;width: 510px;}
#popup_app_file_email_send .adbk_send_address_text{border: 0 none; float: left; height: 25px; margin: 5px 0; padding: 0 5px;}


/* tc ui multiselect checkboxes */
.custom_checkbox{
    font-size: 22px;
    position: relative;
}
.custom_checkbox.fa-check-square{
    color: #009AFF !important;
}
.custom_checkbox.fa-square{
    color: #D7DCDE !important;
}
ul.ui-multiselect-checkboxes li label > input{
    opacity: 0;
    position: absolute;
    z-index: -1;
    left: 10px;
}
.ui-multiselect-checkboxes label{
    display: flex;
    position: relative;
}

.ui-multiselect-none .custom_checkbox,
.ui-multiselect-all .custom_checkbox,
.ui-multiselect-checkboxes .custom_checkbox{
    position: relative;
    display: flex;
}
.ui-multiselect-none .custom_checkbox::before,
.ui-multiselect-all .custom_checkbox::before,
.ui-multiselect-checkboxes .custom_checkbox::before{
    border-radius: 4px;
    transition: none;
    display: block;
    width: 16px;
    height: 16px;
    pointer-events: none;
    content: "";
    background-color: #fff;
    border:#adb5bd solid 1px;
    border-top-color: rgb(173, 181, 189);
    border-right-color: rgb(173, 181, 189);
    border-bottom-color: rgb(173, 181, 189);
    border-left-color: rgb(173, 181, 189);
    min-width: 16px;
}
.ui-multiselect-none .custom_checkbox.checked::before,
.ui-multiselect-checkboxes input:checked ~ .custom_checkbox::before{
    color: #fff;
    border-color: #007bff;
    background-color: #007bff;
}

.ui-multiselect-none .custom_checkbox::after ,
.ui-multiselect-all .custom_checkbox::after ,
.ui-multiselect-checkboxes .custom_checkbox::after {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 16px;
    height: 16px;
    content: "";
    background: no-repeat 50%/50% 50%;
    min-width: 16px;
}
.ui-multiselect-none .custom_checkbox.checked::after ,
/*.ui-multiselect-all .custom_checkbox.checked::after ,*/
.ui-multiselect-checkboxes input:checked ~ .custom_checkbox::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3e%3c/svg%3e");
}
.ui-multiselect-checkboxes input:focus~.custom_checkbox::before{
    box-shadow:0 0 0 2px rgba(0,123,255,.25);
}
.ui-multiselect-checkboxes input:active~.custom_checkbox::before{
    color:#fff;
    background-color:#b3d7ff;
    border-color:#b3d7ff
}
.ui-multiselect-all .custom_checkbox.checked::before ,
.ui-multiselect-checkboxes input:checked~.custom_checkbox::before {
    color:#fff;
    border-color:#007bff;
    background-color:#007bff;
}

.ui-multiselect-all .custom_checkbox.unchecked::before ,
.ui-multiselect-checkboxes input:focus:not(:checked)~.custom_checkbox::before {
    border-color:#80bdff
}
.ui-multiselect-checkboxes input:not(:disabled):active~.custom_checkbox::before {
    color:#fff;
    background-color:#b3d7ff;
    border-color:#b3d7ff
}
.ui-multiselect-checkboxes input:disabled~.custom_checkbox {
    color:#6c757d
}
.ui-multiselect-checkboxes input:disabled~.custom_checkbox::before {
    background-color:#e9ecef
}
.ui-multiselect-checkboxes input:indeterminate~.custom_checkbox::before {
    border-color:#007bff;
    background-color:#007bff
}
.ui-multiselect-checkboxes input:indeterminate~.custom_checkbox::after {
    background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3e%3cpath stroke='%23fff' d='M0 2h4'/%3e%3c/svg%3e")
}
.ui-multiselect-checkboxes input:disabled:checked~.custom_checkbox::before {
    background-color:rgba(0,123,255,.5)
}
.ui-multiselect-checkboxes input:disabled:indeterminate~.custom_checkbox::before {
    background-color:rgba(0,123,255,.5)
}

.ui-multiselect-menu .ui-widget-header{
    background: none;
    border: none;
}
.ui-multiselect-menu .ui-multiselect-all,
.ui-multiselect-menu .ui-multiselect-none{
    display: flex;
}
.ui-multiselect-menu label.ui-corner-all.ui-state-hover{
    background: none !important;
    border: none !important;
}
.ui-multiselect-menu .ui-multiselect-checkboxes label{
    border: none !important;
}
.ui-multiselect-menu .ui-multiselect-checkboxes .ui-corner-all:hover{
    opacity: 0.8;
}

.ui-multiselect-menu .ui-multiselect-header .ui-helper-reset > li > a > span:last-child{
    margin-left: 4px;
}
.ui-multiselect-menu .ui-widget-header .ui-helper-reset li{
    padding: 1px;
}
.ui-multiselect-menu .ui-widget-header .ui-helper-reset .checked.custom_checkbox{
    margin-left: 3px;
}
.ui-multiselect-menu .ui-widget-header .ui-helper-reset .custom_checkbox.unchecked{
    margin-left: 5px;
}
.ui-multiselect-menu .custom_checkbox span{
    font-size: 13px;
    margin-left: 4px;
    line-height: 15px;
}

/* import style popup */
#popup_import_styles .import_style_fake_btn{margin-left: 20px;}
#popup_import_styles .step2 .tips{background-color: #f5f6f8;border-radius: 5px;padding: 10px}
#popup_import_styles .prview_table td{border-top: 0;border-bottom: 1px solid #ddd;}

/* table td resize width*/
table.tc_table_resize_column thead td{position: relative;}
table.tc_table_resize_column thead .col_resizeable_icon.resizing {cursor: col-resize;}
table.tc_table_resize_column thead .col_resizeable_icon{
    width: 20px;
    height:100%;
    display: inline;
    position: absolute;
    right: 0px;
    bottom: 0px;
}
table.tc_table_resize_column thead .col_resizeable_icon:hover {
    cursor: col-resize;
}
/* spectrum color */
.sp-container.sp-light {
    border: 1px solid #E1E1E1;
    background-color: #fff;
    border-radius: 5px;
}

/* tc status picker */
.tc-status-picker-wrapper{
    /*width: 270px;*/
    width: 140px;
    position: relative;
    border: 1px solid #c4c4c4;
    background: #ffffff;
    box-shadow: 0 8px 16px 0px rgba(0, 0, 0, 0.32);
    border-radius: 4px;
    font-size: 13px;
    transition: width 0.1s;
    pointer-events: all;
    height: 100%;
    user-select: none;
}

.tc-status-picker-wrapper .tc-status-picker-colors-view{
    padding: 12px 12px 0px 12px;
    height: 215px; 
    flex: 1 0 auto;
    width: 100%;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: space-between;
    align-items: flex-start;
    overflow: hidden;
    min-width: 0;
}
.tc-status-picker-wrapper .tc-status-picker-colors-view-option{
    width: 112px;
    height: 32px;
    line-height: 32px;
    text-align: center;
    margin-bottom: 8px;
    border-radius: 2px;
    color: #ffffff;
    font-weight: 400;
    cursor: pointer;
    transition: transform 0.1s ease-in-out, opacity 0.1s ease-in-out;
    position: relative;
    padding: 0 3px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.tc-status-picker-wrapper .tc-status-picker-colors-view-option span{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.tc-status-picker-wrapper .tc-status-picker-colors-view-option:hover{opacity: 0.8}
.tc-status-picker-wrapper .tc-status-picker-colors-edit{
    margin-bottom: 8px;
    align-items: center;
    display: flex;
    border-radius: 5px
}
.tc-status-picker-wrapper .tc-status-picker-colors-view-option-edit{
    align-self: auto;
    line-height: 32px;
    text-align: center;
    border-radius: 2px;
    font-weight: 400;
    position: relative;
    display: flex;
    height: 32px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    align-items: center;
    border: 1px solid transparent;
}
.tc-status-picker-wrapper .tc-status-picker-colors-view-option-edit.selected{border: 1px solid #009aff;}
.tc-status-picker-wrapper .tc-status-picker-colors-view-option-edit .color-option-box{
    flex: 0 0 16px;
    height: 100%;
    width: 16px;
    border-radius: 2px 0 0 2px;
    border-width: 1px 0 1px 1px;
    padding-right: 1px;
    border-style: solid;
    border-color: transparent;
    transition: background-color 0.3s ease;
}
.tc-status-picker-wrapper .tc-status-picker-colors-view-option-edit .edit-status-input{
    width:94px;
    height: 30px;
    border: 1px solid transparent;
    padding: 5px;
    transition: background-color 0.3s ease, color 0.5s ease;
}
.tc-status-picker-wrapper .tc-status-picker-colors-view-option-edit .edit-status-input.normal{background-color: #f5f6f8!important;color:#555}
.tc-status-picker-wrapper .tc-status-picker-colors-view-option-edit .edit-status-input.readonly:hover{cursor: not-allowed}
.tc-status-picker-wrapper .tc-status-picker-colors-view-option-edit .edit-status-input.text-normal-white{color: white!important}
.tc-status-picker-wrapper .tc-status-picker-colors-view-option-edit .edit-status-input::placeholder{color: var(--colour-gray-3);}
.tc-status-picker-wrapper .tc-status-picker-colors-edit .edit-status-input:focus{outline: none;}
.tc-status-picker-wrapper .tc-status-picker-colors-edit .change-status-color-btn,
.tc-status-picker-wrapper .tc-status-picker-colors-edit .delete-status-color-btn{display: none;cursor: pointer}
.tc-status-picker-wrapper .tc-status-picker-colors-edit:hover .change-status-color-btn,
.tc-status-picker-wrapper .tc-status-picker-colors-edit:hover .delete-status-color-btn{display: inline-block}
.tc-status-picker-wrapper .tc-status-picker-colors-edit:hover .delete-status-color-btn.disabled{cursor: not-allowed}
.tc-status-picker-wrapper .delete-status-color-wrapper{width: 13px}
.tc-status-picker-wrapper .tc-status-picker-buttom{
    display: flex;
    justify-content: center;
    height: 40px;
    position: relative;
    line-height: 40px;
    color: #009aff;
    border-top: 2px solid #f1f1f1;
    text-align: center;
    font-size: 13px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    transition: color 0.1s;
}
.tc-status-picker-wrapper .tc-status-picker-buttom .action-btn{width:100%}
.tc-status-picker-wrapper .tc-status-picker-buttom .action-btn:hover{color: white;background-color: #009aff}
.tc-status-picker-wrapper .tc-status-color-select-wrapper{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: space-around;
    align-items: flex-start;
    width: 100%;
    padding: 4px;
    transition: top 0.3s ease;
    z-index: 1;
    background-color: #f5f6f8;
}
.tc-status-picker-wrapper .tc-status-color-select-wrapper.mt-5{margin-top: 5px;}
.tc-status-picker-wrapper .tc-status-color-select-wrapper.mb-5{margin-bottom: 5px;}
.tc-status-picker-wrapper .status-change-color-icon{
    border-radius:50%;
    width:20px;
    height: 20px;
    margin: 4px;
    cursor: pointer
}
.tc-status-picker-wrapper .status-change-color-icon:hover{box-shadow: 0 0 3px 3px #c4c4c4;border: 2px white solid;}
.tc-status-picker-wrapper .add-new-status-label-btn{
    justify-content: center;
    cursor: pointer;
    width: 112px;
    transition: background-color 0.2s ease-in,color 0.5s ease;
}
.tc-status-picker-wrapper .step2-content{display: none}
.tc-status-picker-wrapper .apply-btn{display: none}
.tc-status-picker-wrapper .normal-background-white{background-color: white;border: 1px #c4c4c4 dashed;}

.tc-image-label{position: absolute;width: 100%;bottom: 0px;height: 32px;display: flex;justify-content: center;align-items: center;color: white;border-radius: 3px;}

.navigation-item-component .fav_report_list .item-list:hover,
.navigation-item-component .fav_search_list .item-list:hover{cursor: move!important;}

.ke-icon-tccommentfileupload{
    background-image:none!important;
    line-height: 14px!important;
    font-size:14px!important;
    font-family: "Font Awesome 5 Pro";
    font-weight: 300;
}
.ke-icon-tccommentfileupload:before {
    content: "\f0c6";
}

/* manage item css start */
.line-component-wrapper .component-cell .component-cell-title{position: relative;}
.manage_item_wrapper {width: 150px;cursor: pointer}
.manage_item_wrapper .manage_item_label{
    height: 31px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.manage_item_wrapper:hover .manage_item_label{
    background: #E8E8E8;
    padding-left: 5px;
    padding-right: 5px;
    border-radius: 3px;
}
.manage_item_wrapper .fa-caret-down{display: none}
.manage_item_wrapper:hover .fa-caret-down{display: block;}
.manage_item_wrapper .manage_item_active{
    display: none;
    z-index: 2;
    position: absolute;
    width: 150px;
}
.manage_item_wrapper .manage_item_editing{
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #E8E8E8;
    border-radius: 3px;
    line-height: 31px;
    padding: 0 5px;
    cursor: pointer;
}
.manage_item_wrapper .manage_item_actions{
    border: 1px solid #e6e9ef;
    border-radius: 5px;
    background: #fff;
    margin-top: 2px;
}
.manage_item_wrapper .manage_item_action_item{
    display: flex;
    align-items: center;
    line-height: 31px;
    border-bottom: 1px solid #f3f3f3;
    cursor: pointer;
    padding: 0 15px;
}
.manage_item_wrapper .manage_item_action_item:hover{background-color: #f5f5f5;}
.manage_item_wrapper .manage_item_action_item:last-child{border-bottom: 0px;}
.manage_item_wrapper .manage_item_action_item i{margin-right: 10px;}
.manage_item_content .manage_item_search_wrapper{display: flex;align-items: center;}
.manage_item_content .sort-btn{display: none;cursor: pointer}
.manage_item_content .actived.sort-btn{display: inline-block;}
.manage_item_content .sort-header:hover .sort-btn{display: inline-block;}
.manage_item_content .manage_item_search_input{
    height: 26px;
    width: 203px;
    margin-right: 10px;
}
.add_new_item .select_field_type,
.manage_item_list_tb .select_field_type{
    height: 26px;
    padding: 2px;
    font-size: 13px;
}
.manage_item_search_wrapper .manage_item_enabled_filter{
    height: 26px;
    width: 90px;
    padding: 2px;
    font-size: 13px;
}
.manage_item_search_wrapper{margin-bottom: 10px;}
.manage_item_search_wrapper span{
    width: 148px;
    display: inline-block;
}

.manage_item_content .manage_item_list_tb{height: 500px;overflow: auto;}
.manage_item_content .actions{
    display: flex;
    align-items: center;
    justify-content: space-around;
}
.manage_item_content .actions i{cursor: pointer;}
.manage_item_content .item-counter{
    display: inline-block;
    background-color: #292f4c;
    padding: 2px 10px;
    border-radius: 20px;
    font-size: 13px;
    color: #ffffff;
    font-weight: 400;
}
.manage_item_content .add_new_item{display: none;}
.manage_item_content .add_new_item .field_td{background-color: #DCEEFC;}
.manage_item_content .add_new_item .field_edit input{
    height: 24px;
    border: 1px #808080 dashed;
    line-height: 24px;
}
.manage_item_content .field_edit input.has_error{border: 1px #FF158A solid !important;}
.manage_item_content .field_save_loading_image{
    background: url("/asset/jcore/images/common/loader/1.gif") no-repeat scroll;
    width: 18px;
    height: 18px;
    display: inline-block;
    position: absolute;
    top: 5px;
    right: 2px;
    display: none;
    z-index: 2;
}
.manage_item_content .error_msg{display: none;}
.manage_item_content .error_msg ul{
    background-color: #FF158A;
    border: 1px #FF158A solid;
    color: white;
    padding: 5px;
    z-index: 9;
    border-radius: 3px;
    margin: 0;
}
.manage_item_content .edit_item .field_edit{display: none;}
.manage_item_content .active{background-color: #DCEEFC !important;}
.manage_item_content .active input{
    height: 24px;
    border: 1px #808080 dashed;
    line-height: 24px;
}
.manage_item_content .active .display_text{display: none;}
.manage_item_content .active .field_edit{display: block;}
.manage_item_content .edit_item_btn i{cursor: pointer;}
.manage_item_list_tb .error_msg td{padding: 0 8px;}
.manage_item_pagination_content{
    margin: 20px 0 0 0;
}
.manage_item_list_tb .size_scale_tr {display: none;}
.manage_item_list_tb .size_scale_tr td {border-top: 0;}
#popup_manage_item_edit .tc_message_wrapper{padding: 5px;}
/* manage item css end */

/* reorder column */
#tc_sortable_reorder_column_hint{
    position: absolute;
    left: 327px;
    top: 222px;
    background: #555;
    min-width: 100px;
    text-align: center;
    color: white;
    padding: 5px;
    border-radius: 5px;
}
.reorder_column_table .dragged {
    position: absolute;
    top: 0;
    opacity: 0.5;
    z-index: 2000;
    display: none;
}
.reorder_column_table thead td.placeholder {
    display: none;
    background-color: var(--colour-gray-3)!important;
    position: relative;
    padding: 10px 5px;
    border-bottom: 1px solid #e6e9ef;
    border-left: 0;
    height: 36px;
}
.reorder_column_table thead td.placeholder + td:before {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border: 5px solid transparent;
    border-top-color: #555;
    top: -6px;
    margin-left: -5px;
    border-bottom: none;
}

.reorder_column_table .reorder_column_wrapper{position: relative;display: flex;align-items: center;}
.reorder_column_table .reorder_column_wrapper .reorder_column_label{
    height: 31px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    cursor: pointer
}
.reorder_column_table .reorder_column_wrapper .reorder_column_icon{ margin-left: 5px;display: none;cursor: move;}
.reorder_column_table thead td:hover{ background: #f5f5f5;}
.reorder_column_table .reorder_column_wrapper:hover .reorder_column_icon{ display: block}
.reorder_column_table .reorder_column_wrapper:hover .reorder_column_label{
    padding-left: 5px;
    padding-right: 5px;
    border-radius: 3px;
    flex-grow: 1;
}
.reorder_column_table .reorder_column_wrapper:hover .fa-caret-down{display: block;}


.reorder_column_table thead td.move_column_active{background:white!important;}
.reorder_column_table thead td.move_column_active .reorder_column_icon{display: none!important;}
.reorder_column_table thead td.move_column_active .fa-caret-down{display: none!important;}
.reorder_column_table thead td.move_column_active .col_resizeable_icon{display: none!important;}


.reorder_column_table .reorder_column_wrapper .fa-caret-down{display: none;margin-left: 10px}
.reorder_column_table .reorder_column_wrapper .reorder_column_active{
    display: none;
    z-index: 2;
    position: absolute;
    width: 150px;
    top:30px;
    left:-5px
}
.reorder_column_table .reorder_column_wrapper .reorder_column_actions{
    border: 1px solid #e6e9ef;
    border-radius: 5px;
    background: #fff;
    margin-top: 2px;
}
.reorder_column_table .reorder_column_wrapper .reorder_column_action_item{
    display: flex;
    align-items: center;
    line-height: 31px;
    border-bottom: 1px solid #f3f3f3;
    cursor: pointer;
    padding: 0 15px;
    font-weight: normal;
}
.reorder_column_table .reorder_column_wrapper .reorder_column_action_item:hover{background-color: #f5f5f5;}
.reorder_column_table .reorder_column_wrapper .reorder_column_action_item:last-child{border-bottom: 0px;}
.reorder_column_table .reorder_column_wrapper .reorder_column_action_item i{margin-right: 10px;}

/* tc order etd reason picker */
.tc-reason-picker-wrapper{
    /*width: 270px;*/
    width: 140px;
    position: relative;
    border: 1px solid #c4c4c4;
    background: #ffffff;
    box-shadow: 0 8px 16px 0px rgba(0, 0, 0, 0.32);
    border-radius: 4px;
    font-size: 13px;
    transition: width 0.1s;
    pointer-events: all;
    height: 100%;
    user-select: none;
}
.tc-reason-picker-wrapper .reason-label-view{
    padding: 12px 12px 4px 12px;
    height: 218px;
    flex: 1 0 auto;
    width: 100%;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: space-between;
    align-items: flex-start;
    overflow: hidden;
}
.tc-reason-picker-wrapper .reason-label-option{
    width: 112px;
    margin-bottom: 8px;
    height: 32px;
    line-height: 32px;
    text-align: center;
    border-radius: 2px;
    font-weight: 400;
    cursor: pointer;
    transition: transform 0.1s ease-in-out, opacity 0.1s ease-in-out;
    position: relative;
}
.tc-reason-picker-wrapper .step1-content .reason-label-option.selected{background-color: #009AFF!important;color: white}
.tc-reason-picker-wrapper .step1-content .reason-label-option:hover{background-color: #e6e9ef;}
.tc-reason-picker-wrapper .reason-label-option-edit{
    width: 100px;
    align-self: auto;
    line-height: 32px;
    text-align: center;
    border-radius: 2px;
    font-weight: 400;
    position: relative;
    display: flex;
    height: 32px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    align-items: center;
    border: 1px solid transparent;
    justify-content: center;
}

.tc-reason-picker-wrapper .reason-label-option-edit.selected{border: 1px solid #009aff;}
.tc-reason-picker-wrapper .reason-label-option-edit .fixed-reason{
    width:96px;
    height: 30px;
    border: 1px solid transparent;
    background-color: #f5f6f8;
    color:#555;
    text-align: left;
    padding-left: 5px;
    cursor: not-allowed;
}
.tc-reason-picker-wrapper .reason-label-option-edit .edit-reason-input{
    width:96px;
    height: 30px;
    border: 1px solid transparent;
    padding: 5px;
    transition: background-color 0.3s ease, color 0.5s ease;
}
.tc-reason-picker-wrapper .reason-label-option-edit .edit-reason-input:hover{
    border: 1px #009AFF dashed
}
.tc-reason-picker-wrapper .reason-label-option-edit .edit-reason-input.normal{background-color: #f5f6f8;color:#555}
.tc-reason-picker-wrapper .reason-label-option-edit .edit-reason-input.text-normal-white{color: white!important}
.tc-reason-picker-wrapper .reason-label-option-edit .edit-reason-input::placeholder{color:var(--colour-gray-3);}
.tc-reason-picker-wrapper .reason-label-edit{
    margin-bottom: 8px;
    align-items: center;
    display: flex;
    border-radius: 5px
}
.tc-reason-picker-wrapper .reason-label-edit .edit-reason-input:focus{outline: none;}
.tc-reason-picker-wrapper .delete-reason-wrapper{width: 13px;margin-left: 4px;}
.tc-reason-picker-wrapper .delete-reason-wrapper .delete-reason-btn{display: none}
.tc-reason-picker-wrapper .delete-reason-wrapper .delete-reason-btn.disabled{cursor: not-allowed}
.tc-reason-picker-wrapper .reason-label-edit:hover .delete-reason-wrapper .delete-reason-btn{display: block}
.tc-reason-picker-wrapper .reason-picker-buttom{
    display: flex;
    justify-content: center;
    height: 40px;
    position: relative;
    line-height: 40px;
    color: #009aff;
    border-top: 2px solid #f1f1f1;
    text-align: center;
    font-size: 13px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    transition: color 0.1s;
}
.tc-reason-picker-wrapper .reason-picker-buttom .action-btn{width:100%}
.tc-reason-picker-wrapper .reason-picker-buttom .action-btn:hover{color: white;background-color: #009aff}
.tc-reason-picker-wrapper .add-new-reason-wrapper{
    justify-content: center;
    cursor: pointer;
    width: 100px;
    transition: background-color 0.2s ease-in,color 0.5s ease;
}
.tc-reason-picker-wrapper .step2-content{display: none}
.tc-reason-picker-wrapper .apply-btn{display: none}
.tc-reason-picker-wrapper .normal-background-white{background-color: white;border: 1px #c4c4c4 dashed;}

/* survey star start */
.survey_star{
    font-size: 16px;
}
.survey_star.fas{
    color: #ffc107;
}
/* survey star end */

#new_costing_form .style_set_list{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}
#new_costing_form .style_set_list:last-child{
    margin-bottom: 0;
}
#new_costing_form .style_set_list span{
    width: 30%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#new_costing_form .style_set_list input{
    width: 33%;
    padding: 0 5px !important;
}
#new_costing_form .style_sell_price_group span input{
    width: 100% !important;
}
#new_costing_form .style_set_list select.form-control{
    width: 30%;
    padding: 0 2px !important;
}
#new_costing_form .style_sell_price_group{
    display: flex;
    justify-content: space-between;
}
#new_costing_form .cost_set_error{
    background-color: #FF158A;
    border: 1px #FF158A solid;
    color: white;
    padding: 5px;
    border-radius: 3px;
    display: none;
}
#popup_create_style .ui-multiselect{width: 100% !important;}
#popup_create_order .ui-multiselect{width: 100% !important;}
#popup_create_component .ui-multiselect{width: 100% !important;}
/* supplier image label */
#popup_global_supplier_details .image-label-content{display: flex;align-items: center;}
#popup_global_supplier_details .image-label.default-bg{background-color: #e6e9ef;}
#popup_global_supplier_details .image-label{padding: 0px 3px;white-space: nowrap;text-align: center;margin-left: 30px;border:1px transparent solid; width: 140px;height: 30px;border-radius: 3px;position: relative;cursor: pointer;display: flex; justify-content: center; align-items: center;color:white}
#popup_global_supplier_details .image-label:hover{opacity: 0.8}
#popup_global_supplier_details .image-label:after {position: absolute;content: '';right: 0;top: 0;}
#popup_global_supplier_details .image-label:hover:after {transition-duration: 0.5s;border-bottom: 10px solid #c2c2c2;border-right: 10px solid white;}
#popup_global_supplier_details .image-label-delete-btn{margin-left: 10px;display: none}
#popup_global_supplier_details .show_label{display: flex; height: 100%; align-items: center;border: 1px transparent dashed;padding: 5px;cursor: pointer}
#popup_global_supplier_details .label-content{border: 1px transparent dashed;}
#popup_global_supplier_details .label-content:hover{border: 1px #009AFF dashed;}
#popup_global_supplier_details .edit_label{display: none; height: 100%; align-items: center;padding: 5px;width: 100px}
#popup_global_supplier_details .edit_label.active{display: flex;background-color: #DCEEFC}
#popup_global_supplier_details .edit_label input{padding: 0px 3px;border:1px #85868d dashed;outline: none;width: 100%}
#popup_global_supplier_details .edit_label .loading-image{margin-left: 2px;display: none}

/* files模块面包屑 */
#file_nav_tab {
    padding: 5px;
    margin-bottom: 0px;
    width: 100%;
    z-index: 12;
    background: none;
    border-radius: 0px;
    font-size:12px;
    font-weight: bold;
    display: inline;
    margin-left: 10px;
}

#file_nav_tab > li + li::before {
    color: #ccc;
    content: "> ";
    padding: 0 5px;
}

.folder_icon {
    margin-right: 5px;
    max-height: 20px;
    max-width: 20px
}

.icon_to_edit_content.active .folder_save_loading {
    right:36px;
}

.component-cell-data.can_edit.require .field_label:hover:before{
    color: #FF158A;
}
.component-cell-data.can_edit .field_label:hover{
    border: 1px #009AFF dashed;
    cursor: pointer;
    color: #009AFF;
}
.component-cell-data.can_edit .field_label:before{
    font-family: "Font Awesome 5 Pro";
    content: "\f303";
    cursor: text;
    margin-right: 5px;
    cursor: pointer;
}
.component-cell-data.can_edit .field_label.date:before{
    content: "\f073";
    margin-left: 2px;
    font-weight: 300;
}
.component-cell-data.can_edit .field_label:not(.date)::before{
    opacity: 0;
    margin: 0;
    width: 3px;
}
.component-cell-data.can_edit .field_label:hover:before{
    color:#009AFF;
}

i.fa,
i.fas,
i.far,
i.fal,
span.fal,
i.fa-regular,
i.glyphicon,
.fa-plus-circle,.fa-times-circle,
.component-cell-data.can_edit .field_label:before,
.component-cell-data-select.can_edit .select-icon-tips::before,
span.title_iocn i.tips_icon::before,
[class^="tc-icon-"], [class*=" tc-icon-"]{
   color: #BCBCBC;
}
.btn.btn-success i.fa,
.btn.btn-success i.fal,
.btn.btn-success .glyphicon.glyphicon-ok,
.btn.btn-primary i.fa,
.btn.btn-primary i.fal,
.btn.btn-primary .glyphicon.glyphicon-ok,
.btn.btn-danger i.fa{
    color: #fff;
}

/* size scale modify icon */
.modify_link i.fa-sliders:hover {
    color: var(--colour-blue-1);
}

/* style activity approval rejection date popup*/
#popup_activity_approval_rejection_date #adbk{width: 590px}
#popup_activity_approval_rejection_date #adbk .adbk_content-left{margin-right: 10px}
#popup_activity_approval_rejection_date table td{padding: 5px 0px}
#popup_activity_approval_rejection_date table input,
#popup_activity_approval_rejection_date table select{
    height: 26px!important;
    padding: 0px 12px!important;
}
#popup_activity_approval_rejection_date .panel{box-shadow: none;margin-bottom: 0px;}
#popup_activity_approval_rejection_date .adbk_emails_selected{border: 1px solid #e0e0e0;width: 100%;border-radius: 3px;float: left;}
#popup_activity_approval_rejection_date .adbk_send_address_text{border: 0 none; float: left; height: 25px; margin: 5px 0; padding: 0 5px;}
#popup_activity_approval_rejection_date input[type="text"]{width: 100%;}
#popup_activity_approval_rejection_date select{width: 100%;}
#popup_activity_approval_rejection_date textarea{font-size: 12px;width: 100%;resize:vertical;}
#popup_activity_approval_rejection_date .left_title{padding-left: 15px}
#popup_activity_approval_rejection_date .loading_image{text-align:center!important;margin-top: 25px!important; margin-bottom: 25px!important;}
#popup_activity_approval_rejection_date .save_and_complete_activity_btn{display: none}
#popup_activity_approval_rejection_date .file_upload_content td{border-top: 0}

#popup_activity_approval_rejection_date .content{padding-right: 10px}
#popup_activity_approval_rejection_date .object_activity_comment_list{margin-top: 20px;overflow-x: hidden;overflow-y: auto;max-height: 300px}
#popup_activity_approval_rejection_date .service_comment_lock.private{color: #d73925;}
#popup_activity_approval_rejection_date .comment_li_cell{display: inline-block;width: 100%;padding: 8px;border-top: 1px solid #e1e1e1!important;}
#popup_activity_approval_rejection_date .comment_li_cell > .pull-right + .comment_body {text-align: right;}
#popup_activity_approval_rejection_date .comment_li_cell .comment_body {position: relative;width: calc(100% - 54px); display: inline-block;padding-left: 20px}
#popup_activity_approval_rejection_date .comment_li_cell img.media-object {border-radius: 100%; width: 54px;}
#popup_activity_approval_rejection_date .pinned_comment{display: inline-block;padding: 5px 10px;background-color: #292f4c;color: white;margin-right: 10px;border-radius: 5px 5px 0 0}
#popup_activity_approval_rejection_date li a.user_avator img, .comment_wrapper li a.user_avator img {border: 1px solid #ddd;padding: 2px;}
#popup_activity_approval_rejection_date .service_comment_add_btn_content{padding: 10px 0;}
#popup_activity_approval_rejection_date .comment_section_body p{margin: 0px}
#popup_activity_approval_rejection_date .comment_section_body ul{
    display: block;
    list-style-type: disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 40px;
    padding-left: 40px;
}
#popup_activity_approval_rejection_date .record_comment_updated{font-size:10px;font-weight: lighter;}
#popup_activity_approval_rejection_date .style_activity_description{font-size: 14px;margin-bottom: 10px}
#popup_activity_approval_rejection_date .reply_comment_cell{border:0!important;padding-left: 0px;padding-right: 0px}
#popup_activity_approval_rejection_date .reply_comment_cell img.media-object{width: 40px}
#popup_activity_approval_rejection_date .reply_comment_cell .comment_body{position: relative;width: calc(100% - 40px); display: inline-block;padding-left: 20px}
#popup_activity_approval_rejection_date .add_reply_content{padding-top:10px;;margin-top: 10px;border-top: 1px solid #e1e1e1}
#popup_activity_approval_rejection_date .add_reply_content .add_reply_btn{color:#009AFF;cursor: pointer}
#popup_activity_approval_rejection_date .add_reply_content .add_reply_btn i{color:#009AFF;}
#popup_activity_approval_rejection_date .add_reply_content .reply_content_textarea{margin-top: 10px;display: none}
#popup_activity_approval_rejection_date .add_reply_content .reply_comment_textarea{width:100%;display: inline-block}
#popup_activity_approval_rejection_date .comment_body .comment_content {margin-bottom: 10px;}


.style_activity_highlight {
    color: #009AFF;
    font-weight: bold;
    margin-left: 5px;
}

/* froala editor custom css start */
.fr-wrapper {
    border-radius: 0 0 10px 10px;
    border-bottom-color: #CCCCCC !important;
    box-sizing: content-box;
}
.fr-second-toolbar {
    display: none;
}
.fr-toolbar .fr-command.fr-btn svg{
    width: 20px;
    margin: 0;
}
.fr-toolbar .fr-command.fr-btn{
    height: 20px;
    margin: 5px;
    margin-top: 8px;
}
.fr-btn-wrap .fr-command.fr-btn,
.fr-btn-wrap .fr-options{
    margin: 4px 2px;
    margin-top: 8px;
}
.fr-command.fr-btn.fr-options{
    margin-left: -5px;
}
.fr-box.fr-basic .fr-element{
    padding: 20px;
    line-height: 1.6 !important;
}
.fr-toolbar .fr-command.fr-btn.fr-dropdown:after{
    top: 10px;
}
.fr-view {
    line-height: 2 !important;
}
/* froala editor custom css end */

/* left menu pop up css start */
@media (min-height: 720px) {
    .dynamic-dialog {
        max-height: 500px;
    }
}
@media (max-height: 720px) {
    .dynamic-dialog {
        max-height: calc(100vh - 300px);
    }
}
@media (min-height: 700px) {
    .dynamic-dialog-search {
        max-height: 500px;
    }
}
@media (max-height: 700px) {
    .dynamic-dialog-search {
        max-height: calc(100vh - 350px);
    }
}
/* left menu pop up css end */
.menu-hidden {
    display: none;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

.menu-visible {
    display: block;
    opacity: 1;
    transition: opacity 0.3s ease-in-out;
}
.left-menu.no-transition {
    transition: none !important; /* Disable transition */
}

.wrapper-body-right.no-transition,
.wrapper-body-right.no-transition * {
  transition: none !important;
}
.wrapper-body-right.content--hidden {
    visibility: hidden;
}

.wrapper-body-left.no-transition,
.wrapper-body-left.no-transition * {
  transition: none !important;
}

/* widget members start */
#widget_members .widget_members_actions{
    position: absolute;
    top: 12px;
    left: 125px;
}
#widget_members .widget_members_actions .item-btn{
    font-size: 18px;
    color: #777;
    margin-left: 5px;
    cursor: pointer;
}
.widget_members_add_content{
    position: relative;
}
.widget_members_add_content .search_member_input{
    display: none;
    border: 1px solid #E1E1E1;
    font-size: 13px;
    height: 33px;
    box-shadow: none;
}
.widget_members_add_content .loading_image{
    position: absolute;
    top: 10px;
    right: 10px;
    color: #009AFF;
    display: none;
}
.widget_members_add_content .search_member_sec{
    display: none;
    border: 1px #e1e1e1 solid;
    position: absolute;
    width: 100%;
    background-color: white;
    border-radius: 5px;
    padding: 10px 7px;
    box-shadow: 5px 10px 15px 0px #ccc;
    z-index: 1;
    top: 32px;
}
.widget_members_add_content .search_member_sec .search_member_with_loading_content{
    max-height: 160px;
    min-height: 50px;
    overflow: auto;
    position: relative;
    display: none;
}
.widget_members_add_content .search_member_sec .search_member_with_loading_content .loading_sec{
    position: absolute;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    justify-content: center;
    align-items: center;
    background: rgba(255, 255, 255, 0.5);
}
.widget_members_add_content .search_member_sec .search_member_with_loading_content .loading_sec i{
    color: #009AFF;
}
.widget_members_add_content .search_member_sec .search_member_with_loading_content .search_member_content .widget_members_list:hover,
.widget_members_add_content .search_member_sec .widget_members_suggest_list .suggest_list_item:hover,
.widget_members_add_content .search_member_sec .widget_members_suggest_sec .widget_members_suggest_list .suggest_list_item .suggest_member_list .suggest_member_list_item:hover{
    background-color: #f0f0f0;
    cursor: pointer;
}
.widget_members_add_content .search_member_sec .search_member_with_loading_content .search_member_content .widget_members_list{
    width: 100%;
    display: flex;
    align-items: center;
    padding: 10px 5px;
    border-bottom: 1px #e1e1e1 solid;
}
.widget_members_add_content .search_member_sec .search_member_with_loading_content .search_member_content .widget_members_list i,
.widget_members_add_content .search_member_sec .widget_members_suggest_list .suggest_list_item .suggest_list_item_left i{
    color: #6E7175;
    font-size: 16px;
    margin-right: 9px;
}
.widget_members_add_content .search_member_sec .search_member_with_loading_content .search_member_content .member_name,
.member_list_name{
    overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    word-break: break-all;
}
.widget_members_add_content .search_member_sec .search_member_with_loading_content .search_member_content .member_company,
.member_list_company{
    color: #6E7175;
    font-size: 10px;
    overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    word-break: break-all;
}
.widget_members_add_content .search_member_sec .widget_members_suggest_sec{
    position: relative;
}
.widget_members_add_content .search_member_sec .widget_members_suggest_sec .suggest_list_title{
    padding: 5px 5px 10px 5px;
    border-bottom: 1px #e1e1e1 solid;
}
.widget_members_add_content .search_member_sec .widget_members_suggest_sec .widget_members_suggest_list{
    width: 100%;
}
.widget_members_add_content .search_member_sec .widget_members_suggest_sec .widget_members_suggest_list .suggest_list_item{
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    padding: 10px 5px;
    border-bottom: 1px #e1e1e1 solid;
}
.widget_members_add_content .search_member_sec .widget_members_suggest_sec .widget_members_suggest_list .suggest_list_item:last-child{
    border-bottom: 0;
}
.widget_members_add_content .search_member_sec .widget_members_suggest_sec .widget_members_suggest_list .suggest_list_item .suggest_list_item_left{
    display: flex;
    align-items: center;
}
.widget_members_add_content .search_member_sec .widget_members_suggest_sec .widget_members_suggest_list .suggest_list_item .suggest_list_item_left .suggest_company_name{
    overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    word-break: break-all;
}
.widget_members_add_content .search_member_sec .widget_members_suggest_sec .widget_members_suggest_list .suggest_list_item .suggest_member_list{
    position: fixed;
    width: 214px;
    background: #ffffff;
    display: none;
    max-height: 200px;
    overflow: auto;
    box-shadow: 0px 2px 8px 0px #00000026;
    border-radius: 2px;
}
.widget_members_add_content .search_member_sec .widget_members_suggest_sec .widget_members_suggest_list .suggest_list_item .suggest_member_list .suggest_member_list_item{
    padding: 10px 5px;
    border-bottom: 1px #e1e1e1 solid;
    display: flex;
    align-items: center;
    position:relative;
}
.widget_members_add_content .search_member_sec .widget_members_suggest_sec .widget_members_suggest_list .suggest_list_item .suggest_member_list .suggest_member_list_item i{
    color: #26262640;
    font-size: 14px;
    margin-right: 8px;
}
.widget_members_add_content .search_member_sec .widget_members_suggest_sec .widget_members_suggest_list .suggest_list_item .suggest_member_list .suggest_member_list_item i.fa-square-check{
    color: #6E7175;
}
.widget_members_add_content .search_member_sec .widget_members_suggest_sec .widget_members_suggest_list .suggest_list_item .suggest_member_list .suggest_member_list_item i.selected_icon{
    color: #009AFF;
}
.widget_members_add_content .search_member_sec .widget_members_suggest_sec .widget_members_suggest_list .suggest_list_item .suggest_member_list .suggest_member_list_item .suggest_name{
    overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    word-break: break-all;
}
.widget_members_add_content .search_member_sec .widget_members_suggest_sec .widget_members_suggest_list .suggest_list_item .suggest_member_list .suggest_member_list_content{
    position: relative;
}
.widget_members_add_content .search_member_sec .widget_members_suggest_sec .widget_members_suggest_list .suggest_list_item .suggest_member_list .suggest_member_list_content .loading_sec{
    position: absolute;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    justify-content: center;
    align-items: center;
    background: rgba(255, 255, 255, 0.5);
}
.widget_members_add_content .search_member_sec .widget_members_suggest_sec .widget_members_suggest_list .suggest_list_item .suggest_member_list .suggest_member_list_content .loading_sec i{
    color: #009AFF;
}
.navigation_item_component_active_color_text{
    color: #009AFF !important;
}
/* widget members end */

.icon_ui_default .fa-light {
    color: var(--colour-gray-4);
}

.icon_ui_default .fa-light:hover {
    color: var(--colour-blue-1);
}

/*====================*/
/* COSTING COMPONENT  */
/*====================*/

.costing-component-list .component-cell {
    display: flex;
    align-items: center;
    width: 100%;
}

.costing-component-list .component-cell-data {
    padding: 0 8px;
}

.costing-component-list .component-cell-data.code-col {
    flex: 2;
    min-width: 150px;
}

.costing-component-list .component-cell-data.desc-col {
    flex: 3;
    min-width: 200px;
}

.costing-component-list .component-cell-data.unit-col {
    flex: 1;
    min-width: 80px;
}

.costing-component-list .component-cell-data.price-col {
    flex: 1;
    min-width: 100px;
}

.costing-component-list .component-cell-data.qty-col {
    flex: 1;
    min-width: 80px;
}

.costing-component-list .component-cell-data.total-col {
    flex: 1;
    min-width: 100px;
}

.costing-component-list .component-cell-data.currency-col {
    flex: 0.5;
    min-width: 60px;
}

.costing-component-list .component-cell-data.actions-col {
    flex: 1;
    min-width: 100px;
    text-align: right;
}