@import 'https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@200;300;400;500;600;700;800&display=swap';body.New {
    font-family: plus jakarta sans,sans-serif;
    color: #000!important;
    font-size: 13px;
    background: #fff!important;
    padding-left: 224px;
    padding-top: 70px
}

body.New.SYSTEM_DEPOT_COUNT .countNonClick{pointer-events: none;}
body.New.SYSTEM_DEPOT_COUNT .countDisabled{background: #efefef !important;color: #828282 !important;border-color: #efefef !important;}
body.New.SYSTEM_DEPOT_COUNT .countDisabled>*{color: #828282 !important}

body.New.SYSTEM_DEPOT_COUNT header.headerv3 {
    top: 0;
    position: sticky;
    left: 0;
    width: calc( 100% - 0px );
}
body.New.SYSTEM_DEPOT_COUNT .PageView_v2{margin-top: -60px !important;}
body.New header.headerv3 {
    left: 224px;
    width: calc( 100% - 288px );
    background: #fff;
    margin: 0;
    padding: 0 32px;
    border-bottom: 1px solid #eaeaf4;
    z-index: 999931
}

body.New .sidebar {
    top: 0;
    height: 100%;
    background: #fafafa;
    border-right: 1px solid #eaeaf4;
    width: 224px;
    z-index: 1000000
}

body.New .sidebar #leftside-navigation {
    width: 224px;
    background: #fafafa
}

body.New header.headerv3>.Logov3 {
    display: none
}

body.New.left-nav-control .sidebar {
    left: -184px
}

body.New.left-nav-control .sidebar:hover {
    left: 0
}


body.New.left-nav-control header.headerv3 {
    left: 40px;
    width: calc(100% - 40px);
}

body.New.left-nav-control .sidebar #leftside-navigation ul li a>.frk {
    margin-right: 13px
}

body.New.left-nav-control header.headerv3.nonNav {
    left: 0;
    width: calc( 100% - 28px )
}

body.New header.headerv3>.HamburgerNav {
    color: initial;
    padding: 0;
    font-size: 22px;
    display: flex;
    align-items: center;
    width: 40px;
    height: 40px;
    border: 1px solid #eaeaf4;
    justify-content: center;
    margin-right: 16px;
    border-radius: 3px;
    cursor: pointer
}

body.New header.headerv3>.HamburgerNav:hover {
    border-color: #3d6cff;
    background: 0 0;
    color: #3d6cff
}

body.New header.headerv3>.HamburgerNav:hover>i {
    color: #3d6cff
}

header.headerv3>.HamburgerNav>i {
    color: #000;
    padding: 0;
    font-size: 24px
}

body.New header.headerv3>.HamburgerNav>i {
    color: #000;
    padding: 0;
    font-size: 24px
}

body.New header.headerv3>.header-search .area {
    box-shadow: none;
    border: 1px solid #eaeaf4;
    border-radius: 3px;
    min-width: 320px;
    height: 40px;
    display: flex
}

body.New header.headerv3>.header-search .area .search-elements {
    background: 0 0;
    border: 0;
    display: flex;
    align-items: center
}

body.New header.headerv3>.header-search .area .search-elements .search-select {
    background: 0 0;
    color: initial;
    border-color: #eaeaf4
}

body.New header.headerv3>.header-search .area .search-elements .search-input {
    color: initial
}

header.headerv3>.HamburgerNav::before,header.headerv3>.HamburgerNav::after {
    display: none!important
}

header.headerv3>.HamburgerNav>span {
    display: none!important
}

body.New .categorySelect {
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
    font-size: 24px;
    margin-left: 16px;
    color: inherit;
    border: 1px solid #eaeaf4;
    height: 40px;
    width: 40px;
    justify-content: center;
    border-radius: 3px;
    cursor: pointer
}

body.New .categorySelect:hover {
    border-color: #3d6cff;
    background: 0 0;
    color: #3d6cff
}

body.New .navi-logo {
    display: flex;
    margin: 14px;
    background: 0 0;
    align-items: center;
    border-bottom: 1px solid #eaeaf4;
    height: 59px
}

body.New .navi-logo img {
    height: 33px
}

body.New .navi-logo>.Text {
    display: flex;
    background: 0 0;
    flex-direction: column;
    margin-left: 10px
}

body.New .navi-logo>.Text>span:nth-child(1) {
    display: flex;
    font-weight: 600;
    font-size: 16px;
    color: #3d6cff
}

body.New .navi-logo>.Text>span:nth-child(2) {
    width: 100%;
    font-size: 12px;
    color: #000;
    font-weight: 600
}

body.New .container-v3 {
    padding: 32px
}

body.New .container-fluid {
    padding: 0;
    padding-bottom: 80px
}

body.New .container-fluid.PB0 {
    padding-bottom: 0
}

body.New .container-fluid.PL16 {
    padding-left: 16px
}

body.New .container-fluid.PR16 {
    padding-right: 16px
}

body.New .container-fluid.PT16 {
    padding-top: 16px
}

body.New .chart-bar-area {
    box-shadow: none
}

body.New .chart-container {
    box-shadow: none
}

body.New .dash-container {
    box-shadow: none
}

body.New header.headerv3>.header-control {
    padding: 0
}

body.New header.headerv3>.header-control>.item>.userCard {
    display: flex;
    flex-direction: row-reverse;
    height: 40px;
    border: 1px solid #eaeaf4;
    border-radius: 3px;
    padding: 6px;
    margin-left: 16px
}

body.New header.headerv3>.header-control>.item>.userCard>.userInfo>.Name {
    color: #3d6cff;
    font-size: 12px
}

body.New header.headerv3>.header-control>.item>.userCard>.userInfo>.Firm {
    font-size: 9px;
    color: #000
}

body.New header.headerv3>.header-control>.item>.userCard>.Pp {
    border-radius: 3px;
    background: 0 0;
    color: #3d6cff;
    border: 1px solid #3d6cff;
    margin: 0;
    margin-left: 16px;
    height: 27px
}

.MobAllSearch {
    color: initial;
    padding: 0;
    font-size: 22px;
    display: flex;
    align-items: center;
    width: 40px;
    height: 40px;
    border: 1px solid #eaeaf4;
    justify-content: center;
    border-radius: 3px;
    cursor: pointer;
    margin-left: auto;
    display: none
}

body.New header.headerv3>.header-control>.item>.control-item {
    font-size: 22px;
    display: flex;
    align-items: center;
    width: 40px;
    height: 40px;
    border: 1px solid #eaeaf4;
    justify-content: center;
    margin-left: 16px;
    border-radius: 3px;
    color: #5a5e9a;
    padding: 0
}

body.New header.headerv3>.header-control>.item>.control-item:hover {
    border-color: #3d6cff;
    background: 0 0;
    color: #3d6cff
}

body.New header.headerv3>.header-control>.item>.control-item>.control-item-dropdown {
    top: 42px;
    border-radius: 3px
}

.control-panel>.column .control-item.item-dropdown .item-dropdown-content {
    left: 0
}

.control-panel>.column .control-item.item-dropdown .item-dropdown-content>.List::before {
    left: 5px
}

body.New .breadcrumb_v2 {
    margin: 0 32px;
    border-color: #eaeaf4;
    margin-bottom: 16px;
    height: 30px;
    display: none
}

body.New .breadcrumb_v2>.Left {
    padding-left: 0;
    padding: 0;
    display: flex
}

body.New .breadcrumb_v2>.Support>.Link {
    background: 0 0;
    line-height: 16px;
    display: flex;
    justify-content: center;
    align-items: center
}

body.New .control-panel {
    padding: 0 32px;
    margin-top: 16px;
    display: flex;
    flex-direction: column;
    background: url(/Library/Img/Newpanbg.svg);
    background-repeat: no-repeat;
    background-position: 100%
}

body.New .control-panel>.column .panel-title {
    margin-bottom: 20px
}

body.New .control-panel>.column .panel-title>.T {
    font-size: 28px;
    margin-bottom: 10px;
    font-weight: 500
}

body.New .PageTitleBox {
    margin-bottom: 20px
}

body.New .PageTitleBox span:nth-child(1) {
    font-size: 28px!important;
    margin-bottom: 10px!important;
    font-weight: 500!important
}

body.New .PageTitleBox span:nth-child(2) {
    color: rgba(66,72,87,.56);
    display: flex;
    font-size: 14px!important
}

body.New .control-panel>.column .panel-title>.sT {
    font-size: 14px
}

body.New .v2Table-container {
    top: 200px;
    left: 16px;
    right: 16px
}

body.New .tablesorter-default {
    font-family: plus jakarta sans,sans-serif;
    color: #5a5e9a!important;
    font-size: 13px
}

body.New .tablesorter-default .header,body.New .tablesorter-default .tablesorter-header {
    background: #fafafa;
    padding: 0!important;
    border: 0
}

body.New .tablesorter-header-inner {
    border-right: 1px solid #dedede;
    padding: 5px 12px;
    line-height: 13px;
    margin: 8px 0;
    font-size: 12px;
    color: #5a5e9a;
    font-weight: 500
}

body.New .tablesorter-header-inner:last-child {
    border-right: 0
}

body.New .tablesorter-default td {
    border-top: 1px solid #f4f4f4!important;
    color: #000;
    padding: 10px 12px;
    cursor: pointer
}

body.New .tablesorter-default tr:hover td {
    background: #dde2e5c7!important
}

body.New .PageView_v2 .accordionTable tr:hover td {
    background: #fafafa!important
}

.MobilBottomNav {
    display: none
}

body.New .refresh-btn {
    display: none
}

body.New .depot-btn {
    display: none
}

body.New .barcodeCam {
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
    font-size: 24px;
    margin-left: 16px;
    color: inherit;
    border: 1px solid #eaeaf4;
    height: 40px;
    width: 40px;
    justify-content: center;
    border-radius: 3px;
    cursor: pointer
}

body.New .barcodeCam:hover {
    border-color: #3d6cff;
    background: 0 0;
    color: #3d6cff
}

body.New .barcodeCam {
    display: none
}

.MobLogo {
    display: none
}

body.New.left-nav-control header.headerv3.nonNav .MobLogo {
    display: flex
}

body.New .MobLogo>.Text {
    display: flex;
    flex-direction: column;
    margin-left: 10px
}

body.New .MobLogo>.Text>span:nth-child(1) {
    display: flex;
    font-weight: 700;
    font-size: 15px
}

body.New .MobLogo>.Text>span:nth-child(2) {
    display: flex;
    font-size: 10px;
    color: #000
}

body.New .Popup_v2>.Modal>.Htm>.Document>.Close {
    display: flex;
    right: 10px;
    top: -20px!important;
    border-radius: 100%;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    font-size: 35px;
    background: #fff;
    width: 41px!important;
    height: 41px!important;
    border-radius: 100%!important;
    border: 0;
    color: #5a5e9a
}

body.New .Popup_v2 .color-list {
    display: flex;
    align-items: center;
    padding: 18px 0;
    padding-top: 3px;
    overflow-y: scroll;
    overflow-x: auto;
    max-width: 320px
}

@media only screen and (min-width: 991px) {
    body.New .Popup_v2 .color-list {
        overflow-y:scroll;
        overflow-x: auto;
        max-width: 100%
    }
}

body.New .Popup_v2 .Accordion {
    width: 100%;
    display: flex;
    flex-direction: column
}

body.New .Popup_v2 .Accordion>.AccordionHead {
    background: #fff;
    color: #5a5e9a;
    border: 1px solid #5a5e9a;
    padding: 4px;
    border-radius: 4px;
    line-height: 30px;
    cursor: pointer
}

body.New .Popup_v2 .Accordion>.Content.Features {
    display: none;
    background: #cccccc3b;
    padding: 12px;
    font-size: 12px
}

body.New .Popup_v2 .Accordion.Active>.Content.Features {
    display: block
}

body.New .popup_v2_area-box .box-column .box-content .filter-item .column.Size {
    display: flex;
    justify-content: center;
    align-items: center
}

body.New .popup_v2_area-box.varyasyonModal.productList .box-column .box-content .filter-item .column.Size .SizeItem {
    width: 40px;
    height: 40px;
    min-width: 40px;
    display: flex;
    justify-content: center;
    align-items: center
}

body.New .Popup_v2 .color-list>div {
    margin: 0 8px;
    display: flex;
    flex-direction: column;
    align-items: center
}

body.New .Popup_v2 .color-list>div>span:nth-child(1) {
    width: 30px;
    height: 30px;
    display: block;
    border-radius: 100px;
    border: 4px solid #fff;
    box-shadow: 0 0 0 1px #0000;
    margin-bottom: 3px
}

body.New .Popup_v2 .color-list>div>span:nth-child(2) {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 42px;
    display: none
}

body.New .Popup_v2 .color-list>div.Active>span:nth-child(1) {
    box-shadow: 0 0 0 1px #000
}

body.New .Popup_v2 .SalePhotoDownload {
    height: 40px;
    width: 40px;
    display: flex;
    color: #000;
    font-size: 22px;
    align-items: center;
    justify-content: center
}

body.New .Popup_v2 .SaleAddBag {
    width: 100%;
    background: #000;
    color: #fff;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    margin-left: 10px
}

body.New .Popup_v2 .SaleAddBag.Disabled {
    background: #f1f1f1;
    border: 1px solid #cdcdcd;
    color: #737373;
    pointer-events: none
}

body.New .popup_v2_area-box.varyasyonModal.productList .box-column .box-content .filter-item .column.Size .SizeItem {
    width: 40px;
    height: 40px;
    min-width: 40px;
    display: flex;
    justify-content: center;
    align-items: center
}

body.New .popup_v2_area-box .box-column .box-content .filter-item .column.Size .SizeItem:hover>div {
    top: inherit;
    opacity: 1;
    visibility: visible;
    bottom: calc( 100% + 10px);
    height: fit-content
}

body.New .Popup_v2 .Modal .Htm .Document .Title>.TitleIcon {
    display: none!important
}

.CenterArea .CenterHead .UserNavi {
    float: right
}

.CenterArea .CenterHead .UserNavi .Bulletin {
    float: left;
    position: relative;
    padding: 0 10px;
    margin-left: 20px
}

.CenterArea .CenterHead .UserNavi .Bulletin svg {
    float: left;
    height: 35px;
    line-height: 35px
}

.CenterArea .CenterHead .UserNavi .Message {
    float: left;
    position: relative;
    padding: 0 10px
}

.CenterArea .CenterHead .UserNavi .Message svg {
    float: left;
    height: 35px;
    line-height: 35px
}

.CenterArea .CenterHead .UserNavi .Profil {
    display: flex;
    align-items: center;
    padding: 0 5px;
    padding-right: 0;
    cursor: pointer;
    position: relative;
    z-index: 2;
    max-width: 180px
}

.CenterArea .CenterHead .UserNavi .Profil .Photo {
    flex: none;
    width: 35px;
    height: 35px;
    font-size: 12px;
    background-color: #134871;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    color: #fff;
    margin-left: 4px
}

header.headerv3>.header-control>.item>.userCard>.userInfo {
    color: #fff
}

header.headerv3>.header-control>.item>.userCard>.userInfo>.Name {
    font-size: 12px;
    font-weight: 600
}

header.headerv3>.header-control>.item>.userCard>.userInfo>.Firm {
    font-size: 12px;
    color: #8e99b9
}

.CenterArea .CenterHead .UserNavi .Profil:hover .Wind {
    display: block
}

.CenterArea .CenterHead .UserNavi .Profil .Wind {
    float: left;
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    min-width: 260px;
    background: #fff;
    border-top: 0;
    z-index: 1;
    width: min-content;
    box-shadow: 0 5px 20px rgba(146,153,184,.12549019607843137)
}

.CenterArea .CenterHead .UserNavi .Profil .Info {
    float: left;
    width: 100%;
    text-align: right;
    padding: 0;
    margin-left: 10px
}

.CenterArea .CenterHead .UserNavi .Profil .Info .Name {
    float: left;
    width: 100%;
    font-size: 12px;
    font-weight: 600
}

.CenterArea .CenterHead .UserNavi .Profil .Info .Mail {
    float: left;
    color: #6a7f88;
    font-size: 10px;
    font-weight: 400;
    line-height: 11px;
    width: 100%
}

.CenterArea .CenterHead .UserNavi .Profil .Wind .SignOut {
    float: left;
    width: 100%;
    cursor: pointer;
    padding: 10px;
    background: #f8f9fb;
    text-align: center;
    border-top: 1px solid #e1e1f361;
    line-height: 24px;
    display: flex;
    align-items: center;
    justify-content: center
}

.CenterArea .CenterHead .UserNavi .Profil .Wind .SignOut svg {
    border-radius: 30px;
    height: 20px;
    width: 20px;
    margin-right: 10px;
    font-size: 16px
}

.CenterArea .CenterHead .UserNavi .Profil .Wind .Nav {
    float: left;
    width: 100%;
    padding: 10px 15px 20px
}

.CenterArea .CenterHead .UserNavi .Profil .Wind .Nav .Item {
    float: left;
    width: 100%;
    cursor: pointer;
    margin: 0;
    margin-bottom: 18px;
    line-height: 20px;
    text-align: left;
    color: #9299b8
}

.CenterArea .CenterHead .UserNavi .Profil .Wind .Nav .Item:hover {
    color: #000
}

.CenterArea .CenterHead .UserNavi .Profil .Wind .Nav .Item svg {
    float: left;
    border-radius: 30px;
    height: 20px;
    width: 20px;
    margin-right: 10px;
    font-size: 16px
}

.CenterArea .PageTitle {
    float: left;
    width: 100%;
    margin-top: 0;
    padding: 0 15px;
    border-top: 1px solid #d8dce0
}

.CenterArea .PageTitle .PageTitleLeft {
    float: left;
    padding: 10px 0
}

.CenterArea .PageTitle .PageTitleLeft .PageName {
    float: left;
    width: 100%;
    font-weight: 400;
    line-height: 28px;
    font-size: 16px
}

.CenterArea .PageTitle .PageTitleLeft .PageText {
    float: left;
    width: 100%;
    font-weight: 400;
    line-height: 13px;
    font-size: 12px
}

.CenterArea .PageTitle .PageTitleLeft .PageName .BtnBack {
    float: left;
    background: #e8dbff17;
    border: 1px solid #ccc;
    margin-right: 5px;
    display: flex;
    align-items: center;
    padding: 3px;
    border-radius: 4px;
    line-height: initial;
    cursor: pointer
}

.CenterArea .PageTitle .PageTitleLeft .PageName .BtnBack:hover {
    background: #e0e7ea;
    color: #000
}

.CenterArea .PageTitle .PageTitleLeft .PageName .BtnBack i {
    float: left
}

.CenterArea .PageTitle .PageTitleLeft .PageName .BtnBack span {
    float: left;
    width: 100%;
    font-weight: 400;
    background: 0 0;
    color: #000;
    font-size: 12px;
    margin: 0;
    border: 0;
    line-height: inherit
}

.CenterArea .PageTitle .PageTitleLeft .PageName span {
    border: 1px solid #ff5722;
    color: #ff5722;
    font-weight: 500;
    padding: 2px 10px;
    border-radius: 3px;
    margin-right: 5px;
    font-size: 12px;
    line-height: 22px
}

.CenterArea .PageTitle .PageTitleRight {
    float: right;
    width: 60%;
    text-align: right
}

.CenterArea .PageTitle .PageTitleRight input {
    margin: 14px 0;
    float: none;
    width: initial;
    font-size: 14px;
    padding: 2px 10px
}

.CenterArea .PageTitle .PageTitleRight select {
    margin: 14px 0;
    float: none;
    width: initial;
    font-size: 14px;
    padding: 5px 10px
}

.CenterArea .PageTitle .PageTitleRight .Btn {
    margin: 14px 0
}

.CenterArea .PageTitle .PageTitleRight .PageSubTab {
    float: left;
    width: 100%;
    display: flex;
    text-align: right;
    justify-content: flex-end
}

.CenterArea .PageTitle .PageTitleRight .PageSubTab.Mobil {
    display: none
}

.CenterArea .PageTitle .PageTitleRight .PageSubTab .PageSubTabItem {
    line-height: 50px;
    margin: 0 10px;
    font-size: 14px;
    border-top: 1px solid transparent;
    cursor: pointer
}

.CenterArea .PageTitle .PageTitleRight .PageSubTab .PageSubTabItem.Active {
    border-color: #2196f3;
    color: #2196f3
}

.CenterArea .PageTitle .PageTitleRight .PageSubTab .PageSubTabItem:hover {
    border-color: #000;
    color: #000
}

.CenterArea .PageTitle .PageTitleRight .Dropdown {
    float: right;
    position: relative;
    margin: 14px 0 14px 8px;
    display: flex;
    align-items: flex-end;
    align-content: stretch;
    justify-content: space-around;
    flex-direction: row
}

.CenterArea .PageTitle .PageTitleRight .Dropdown>i {
    float: left;
    background: #fff;
    border: 1px solid #b5c1d2;
    width: 31px;
    height: 31px;
    line-height: 31px;
    text-align: center;
    border-radius: 4px
}

.CenterArea .PageTitle .PageTitleRight .Dropdown .Wind {
    float: left;
    display: none;
    position: absolute;
    z-index: 7;
    right: 0;
    top: 25px;
    min-width: 200px;
    background: #fff;
    color: #fff;
    box-shadow: 0 5px 20px rgb(95 104 143/52%);
    border-radius: 5px 0 6px 6px
}

.CenterArea .PageTitle .PageTitleRight .Dropdown:hover i {
    display: block;
    background: #000;
    border: transparent;
    color: #fff;
    cursor: pointer
}

.CenterArea .PageTitle .PageTitleRight .Dropdown:hover .Wind {
    display: block
}

.CenterArea .PageTitle .PageTitleRight .Dropdown .Wind .DBtn {
    float: left;
    width: 100%;
    padding: 10px;
    text-align: left;
    cursor: pointer
}

.CenterArea .PageTitle .PageTitleRight .Dropdown .Wind .DBtn:hover {
    background: #fff;
    border-radius: 4px
}

.CenterArea .PageTitle .PageTitleRight .Dropdown .Wind .DBtn i {
    float: right;
    font-size: 14px;
    line-height: 20px;
    background: 0 0;
    width: initial;
    margin: 0;
    color: #fff
}

.CenterArea .PageTitle .PageTitleRight .Dropdown .Wind .DBtn i.List {
    color: #fff
}

.CenterArea .PageTitle .PageTitleRight .Dropdown .Wind .DBtn i.Edit {
    color: #4caf50
}

.CenterArea .PageTitle .PageTitleRight .Dropdown .Wind .DBtn i.Delete {
    color: red
}

.CenterArea .PageTitle .PageTitleRight .Dropdown .Wind .DBtn i.Upload {
    color: #2f2f2f
}

.CenterArea .PageTitle .PageTitleRight .Dropdown .Wind .DBtn i.Download {
    color: #2d2d2d
}

.CenterArea .PageTitle .PageTitleRight .Dropdown .Wind .DBtn i.Time {
    color: #ff5722
}

.CenterArea .PageTitle .PageTitleRight .Dropdown .Wind .DBtn span {
    float: right;
    font-size: 14px;
    line-height: 20px;
    padding-right: 10px;
    display: inline-block;
    color: #fff
}

.CenterArea .PageView {
    float: left;
    width: 100%;
    padding: 0 15px;
    padding-bottom: 80px
}

.CenterArea .PageView .PageSubView {
    float: left;
    width: 100%;
    display: none
}

.CenterArea .PageView .PageSubView.Active {
    float: left;
    width: 100%;
    display: block
}

.CenterArea .PageView .LanguageSelectedBar {
    float: left;
    width: 100%;
    position: relative;
    z-index: 4;
    margin-bottom: 0
}

.CenterArea .PageView .LanguageSelectedBar .LangItem {
    float: left;
    position: relative;
    transition: all 0s ease-out;
    display: flex;
    align-items: center;
    padding: 4px 25px 4px 4px;
    border: 1px solid #e8e9e9;
    cursor: pointer;
    color: #141a23;
    font-size: 14px;
    background: #fff;
    margin-right: 3px;
    border-radius: 4px
}

.CenterArea .PageView .LanguageSelectedBar .LangItem img {
    float: left;
    width: 20px;
    height: 20px;
    border-radius: 100px;
    margin-right: 4px
}

.CenterArea .PageView .LanguageSelectedBar .LangItem span {
    float: left;
    position: relative;
    transition: all 0s ease-out;
    padding-right: 8px
}

.CenterArea .PageView .LanguageSelectedBar .LangItem.Active {
    background: #fff;
    top: 0;
    box-shadow: 0 2px 12px rgb(0 40 117/6%);
    border: 1px solid #ff5722;
    border-bottom: 4px solid #ff5722
}

.CenterArea .PageView .LanguageSelectedBar .LangItem.Ok:before {
    font-family: "font awesome 5 free";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 16px;
    content: "\f058";
    font-weight: 900;
    color: #4caf50;
    font-size: 13px;
    float: right;
    position: absolute;
    right: 5px;
    font-size: 18px
}

.CenterArea .PageView .LanguageSelectedBar .LangItem.Non:before {
    font-family: "font awesome 5 free";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 16px;
    content: "\f057";
    font-weight: 900;
    color: red;
    font-size: 13px;
    float: right;
    position: absolute;
    right: 5px;
    font-size: 16px
}

.CenterArea .PageView .LanguageSelectedBar .LangItem.Active:after {
    font-family: "font awesome 5 free";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 16px;
    content: "\f0d7";
    font-weight: 900;
    margin-right: 4px;
    color: #ff5722;
    font-size: 13px;
    position: absolute;
    bottom: -13px;
    left: 50%;
    margin-left: -8px;
    font-size: 33px
}

.CenterArea .PageView .GroupArea {
    float: left;
    width: 100%;
    margin-bottom: 10px
}

.CenterArea .PageView .GroupArea .Title {
    float: left;
    width: 100%;
    font-size: 18px;
    box-shadow: inset 10px 0 0 0 #ff5722;
    text-indent: 20px
}

.CenterArea .PageView .Box {
    float: left;
    width: 100%;
    padding: 16px;
    border: 1px solid #e8e9e9;
    margin-bottom: 24px;
    border-radius: 6px;
    box-shadow: 1px 4px 45px -24px #00000059;
    position: relative;
    z-index: 1;
    background: #fff
}

.CenterArea .PageView .Box .BoxTitle {
    float: left;
    width: 100%;
    font-size: 19px;
    margin-bottom: 8px;
    font-weight: 400;
    color: #000
}

.CenterArea .PageView .LineBox {
    float: left;
    width: 100%;
    display: block;
    border: 1px solid #e8e9e9;
    padding: 20px;
    text-align: center;
    border-radius: 4px
}

.CenterArea .PageView .LineBox:hover {
    border: 1px solid #000
}

.CenterArea .PageView .LineBox .Icon {
    float: left;
    width: 100%;
    display: block;
    font-size: 26px;
    margin-bottom: 10px
}

.CenterArea .PageView .LineBox .Name {
    float: left;
    width: 100%;
    display: block;
    font-size: 14px;
    height: 22px
}

.CenterArea .PageView .ColorBox {
    float: left;
    width: 100%;
    display: block;
    text-align: center;
    border-radius: 4px
}

.CenterArea .PageView .ColorBox.Green {
    background: #5985ee
}

.CenterArea .PageView .ColorBox.Blue {
    background: #4bbbce
}

.CenterArea .PageView .ColorBox.Yellow {
    background: #46cd93
}

.CenterArea .PageView .ColorBox .General {
    float: left;
    width: 100%;
    display: flex;
    padding: 20px
}

.CenterArea .PageView .ColorBox .General .Info {
    float: left;
    width: 100%;
    text-align: left
}

.CenterArea .PageView .ColorBox .General .Info .Title {
    float: left;
    width: 100%;
    font-size: 18px;
    color: #fff;
    margin-bottom: 4px
}

.CenterArea .PageView .ColorBox .General .Info .Desc {
    float: left;
    width: 100%;
    font-size: 14px;
    color: #ffffffa6
}

.CenterArea .PageView .ColorBox .General .Stats {
    float: left;
    flex: none;
    font-size: 18px;
    background: #fff;
    font-weight: 600;
    color: #000000b8;
    padding: 0 10px;
    border-radius: 5px;
    line-height: 34px
}

.CenterArea .PageView .ColorBox .Day {
    float: left;
    width: 100%;
    background: #00000045;
    text-align: left;
    color: #fff;
    padding: 10px 20px;
    display: flex
}

.CenterArea .PageView .ColorBox .Day .Title {
    float: left;
    width: 100%;
    font-size: 14px;
    margin: 0 10px 0 0
}

.CenterArea .PageView .ColorBox .Day .Title span {
    float: right;
    font-size: 14px;
    font-weight: 500;
    background: #fff;
    color: #000;
    border-radius: 4px;
    padding: 0 10px;
    margin-left: 10px
}

.CenterArea .PageView .ColorBox .Day .Before {
    float: left;
    width: 100%;
    font-size: 14px;
    margin: 0 0 0 10px
}

.CenterArea .PageView .ColorBox .Day .Before span {
    float: right;
    font-size: 14px;
    background: #fff;
    color: #000;
    border-radius: 4px;
    padding: 0 10px;
    margin-left: 10px
}

.CenterArea .PageView .ColorBox .Day .Before span.Up {
    color: #4caf50;
    font-weight: 500
}

.CenterArea .PageView .ColorBox .Day .Before span.Up::before {
    font-family: "font awesome 5 free";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 16px;
    content: "\f30c";
    color: #4caf50;
    font-weight: 900;
    margin-right: 4px;
    font-size: 13px
}

.CenterArea .PageView .ColorBox .Day .Before span.Down {
    color: #f10;
    font-weight: 500
}

.CenterArea .PageView .ColorBox .Day .Before span.Down::before {
    font-family: "font awesome 5 free";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 16px;
    content: "\f309";
    font-weight: 900;
    margin-right: 4px;
    color: red;
    font-size: 13px
}

.RightArea {
    float: left;
    width: 100%
}

.CenterArea .PageView .Pagination {
    float: left;
    width: calc(100% - 320px);
    position: fixed;
    bottom: -92px;
    right: 0;
    display: flex;
    justify-content: space-around;
    transition: all cubic-bezier(.77,0,.175,1) .56s;
    z-index: 1
}

.CenterArea .PageView .Pagination .Container {
    float: left;
    width: 99%;
    margin: 0;
    padding: 20px 30px;
    background: #eaecef;
    transition: all cubic-bezier(.77,0,.175,1) .56s;
    border-radius: 20px 20px 0 0;
    box-shadow: 0 -7px 68px -23px #000
}

.CenterArea .PageView .Pagination.sticky {
    bottom: 0
}

.CenterArea .PageView .Pagination .Text {
    float: left;
    width: 267px;
    font-size: 12px
}

.CenterArea .PageView .Pagination .Box {
    float: left;
    margin-left: 10px;
    margin-top: -2px;
    width: initial;
    background: 0 0;
    box-shadow: none;
    border: 0;
    padding: 0;
    margin: 0
}

.CenterArea .PageView .Pagination .Box .PaginationItem {
    float: left;
    margin: 2px;
    border: 1px solid #ccc;
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 26px;
    font-weight: 800;
    font-size: 12px;
    cursor: pointer;
    background: #fff
}

.CenterArea .PageView .Pagination .Box .PaginationItem:hover {
    border: 1px solid #672883;
    background: #672883;
    color: #fff
}

.CenterArea .PageView .Pagination .Box .PaginationItem.Disabled {
    border: 1px solid #f0f2f5;
    background: #c9cfd8;
    color: #fff;
    pointer-events: none
}

.CenterArea .PageView .Pagination .Box .PaginationItemInput {
    float: left
}

.CenterArea .PageView .Pagination .Box .PaginationItemInput input {
    float: left;
    outline: none;
    width: 60px;
    height: 30px;
    border: 1px solid #e1e5ec;
    text-align: center;
    margin: 2px;
    background: #fff
}

.CenterArea .PageView .Box.CaseBox .Name {
    float: left;
    width: 100%;
    color: #ff5722;
    font-weight: 500
}

.CenterArea .PageView .Box.CaseBox .Ciro {
    float: left;
    width: 100%;
    font-size: 16px;
    font-weight: 600
}

.CenterArea .PageView .Box.CaseBox .BeforeCiro {
    float: left;
    width: 100%;
    font-size: 11px
}

.CenterArea .PageView .Box.CaseBox .BeforeCiro .RateView {
    background: #e6ebf1;
    color: #fff;
    border-radius: 2px;
    font-weight: 700;
    font-size: 10px;
    padding: 2px 5px
}

.CenterArea .PageView .Box.CaseBox .BeforeCiro .RateView.P {
    background: #4caf50
}

.CenterArea .PageView .Box.CaseBox .BeforeCiro .RateView.N {
    background: red
}

.CenterArea .PageView .Box.CaseBox .RateBar {
    float: left;
    width: 100%;
    position: relative;
    margin-top: 10px
}

.CenterArea .PageView .Box.CaseBox .RateBar .LeftRate {
    float: left;
    position: absolute;
    right: 50%;
    height: 3px;
    width: 20%;
    background: red
}

.CenterArea .PageView .Box.CaseBox .RateBar .LeftRate span {
    position: absolute;
    top: 8px;
    left: 0;
    background: red;
    font-size: 10px;
    color: #fff;
    border-radius: 4px;
    padding: 0 4px 2px
}

.CenterArea .PageView .Box.CaseBox .RateBar .RightRate {
    position: absolute;
    left: 50%;
    height: 3px;
    background: #4caf50
}

.CenterArea .PageView .Box.CaseBox .RateBar .RightRate span {
    position: absolute;
    top: 8px;
    right: 0;
    background: #4caf50;
    font-size: 10px;
    color: #fff;
    border-radius: 4px;
    padding: 0 4px 2px
}

.CenterArea .PageView .Box.CaseBox .RateBar .Center {
    float: left;
    position: absolute;
    top: -5px;
    left: 50%;
    height: 14px;
    width: 1px;
    background: #000
}

.CenterArea .PageView .Box.CaseBox .RateBar .Line {
    float: left;
    width: 100%;
    height: 3px;
    background: #f0f2f5
}

.row.Fle {
    display: flex
}

.row.Fle .col-md-1,.row.Fle .col-md-10,.row.Fle .col-md-11,.row.Fle .col-md-12,.row.Fle .col-md-2,.row.Fle .col-md-3,.row.Fle .col-md-4,.row.Fle .col-md-5,.row.Fle .col-md-6,.row.Fle .col-md-7,.row.Fle .col-md-8,.row.Fle .col-md-9 {
    float: left;
    padding-right: 15px;
    padding-left: 15px;
    padding-top: 15px;
    padding-bottom: 15px
}

.dshBox {
    width: 100%;
    padding: 16px;
    border: 1px solid #e8e9e9;
    margin-bottom: 24px;
    border-radius: 6px;
    position: relative;
    z-index: 1;
    background: #fff;
    height: 100%
}

.dshBox.Btn {
    box-shadow: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-bottom: 0
}

.dshBox.Btn.Green {
    background: #4caf50;
    color: #fff
}

.dshBox.Btn.Blue {
    background: #1b6aa8;
    color: #fff
}

.dshBox.Btn i {
    font-size: 22px
}

.dshBox.Btn span {
    font-size: 14px;
    line-height: 30px
}

.dshBox.dsh_001 {
    display: flex;
    margin-bottom: 0
}

.dshBox.dsh_001 .BLeft {
    width: 100%
}

.dshBox.dsh_001 .BLeft .Num {
    display: block;
    font-size: 30px;
    font-weight: 600;
    line-height: 26px
}

.dshBox.dsh_001 .BLeft .Text {
    display: block
}

.dshBox.dsh_001 .BLeft .RateArea {
    display: flex;
    font-size: 14px;
    width: 100%;
    margin-top: 14px
}

.dshBox.dsh_001 .BLeft .RateArea.Up {
    color: #009688
}

.dshBox.dsh_001 .BLeft .RateArea.Down {
    color: #f10
}

.dshBox.dsh_001 .BLeft .RateArea .Icon {
    line-height: 22px
}

.dshBox.dsh_001 .BLeft .RateArea .Rate {
    margin: 0 6px;
    font-weight: 500;
    line-height: 22px
}

.dshBox.dsh_001 .BLeft .RateArea .SubText {
    float: left;
    color: #919191;
    line-height: 22px
}

.dshBox.dsh_001 .BRight {
    width: 168px;
    flex: none
}

.dshBox.dsh_001 .BRight .sales-target {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 40px;
    padding-bottom: 20px;
    text-align: center
}

.dshBox.dsh_001 .BRight .sales-target__progress-bar {
    position: relative;
    margin: 0 4px;
    float: left;
    text-align: center;
    width: 100%
}

.dshBox.dsh_001 .BRight .sales-target__progress-bar .barOverflow {
    position: relative;
    overflow: hidden;
    width: 164px;
    height: 80px;
    margin-bottom: -30px;
    display: inline-block
}

.dshBox.dsh_001 .BRight .sales-target__progress-bar .bar {
    position: absolute;
    top: 0;
    left: 0;
    width: 165px;
    height: 165px;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 8px solid #1c75bb29;
    border-bottom-color: #1c76bd;
    border-right-color: #1c73b7;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.dshBox.dsh_001 .BRight .sales-target__progress-bar .left {
    position: absolute;
    width: 15px;
    height: 15px;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    left: 0;
    bottom: 0;
    overflow: hidden
}

.dshBox.dsh_001 .BRight .sales-target__progress-bar .right {
    position: absolute;
    background: #fff;
    width: 15px;
    height: 15px;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    right: 0;
    bottom: 0;
    overflow: hidden
}

.dshBox.dsh_001 .BRight .sales-target__progress-bar .back {
    width: 15px;
    height: 15px;
    background: #e8faf4;
    position: absolute
}

.dshBox.dsh_001 .BRight .sales-target__progress-bar .total-count {
    position: absolute;
    top: 85%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    font-size: 18px;
    font-weight: 700
}

.dshBox.dsh_001 .BRight .sales-target__progress-bar .total-count .total-count__text {
    font-size: 15px;
    line-height: 22px;
    text-transform: capitalize;
    color: #868eae;
    font-weight: 400
}

.dshBox.dsh_002 {
    display: block;
    margin-bottom: 0
}

.dshBox.dsh_002 .AreaTitle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
    margin-bottom: 10px;
    border-bottom: 1px solid #f1f2f6;
    padding-bottom: 8px
}

.dshBox.dsh_002 .AreaTitle .Text {
    display: block;
    font-size: 16px;
    font-weight: 600
}

.dshBox.dsh_002 .AreaTitle .TabList {
    display: flex;
    width: 100%;
    justify-content: flex-end
}

.dshBox.dsh_002 .AreaTitle .TabList .TabItem {
    display: block;
    margin: 0 10px;
    cursor: pointer
}

.dshBox.dsh_002 .AreaTitle .TabList .TabItem.Active {
    color: #2196f3
}

.dshBox.dsh_002 .AreaTitle .TabList .TabItem:hover {
    color: #2196f3
}

.dshBox.dsh_002 .AreaBody {
    display: block;
    height: calc( 100% - 40px)
}

.dshBox.dsh_002 .AreaBody .TabView {
    display: none;
    height: 100%
}

.dshBox.dsh_002 .AreaBody .TabView.Active {
    display: flex;
    flex-direction: column
}

.dshBox.dsh_002 .AreaBody .TabView .Info {
    display: flex;
    flex: auto
}

.dshBox.dsh_002 .AreaBody .TabView .Info .Item {
    display: block;
    margin-right: 20px;
    margin: 10px 30px 35px 0
}

.dshBox.dsh_002 .AreaBody .TabView .Info .Item .Total {
    display: block;
    font-size: 22px;
    font-weight: 500
}

.dshBox.dsh_002 .AreaBody .TabView .Info .Item .Text {
    display: flex;
    align-items: center
}

.dshBox.dsh_002 .AreaBody .TabView .Info .Item .Text .Colr {
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 100px;
    background: #000;
    margin-right: 5px;
    flex: none
}

.dshBox.dsh_002 .AreaBody .TabView .Info .Item .Text .SubText {
    display: block
}

.dshBox.dsh_003 {
    display: block;
    margin-bottom: 0
}

.dshBox.dsh_003 .AreaTitle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row
}

.dshBox.dsh_003 .AreaTitle .Text {
    display: block;
    font-size: 19px
}

.dshBox.dsh_003 .AreaBody {
    display: block;
    height: calc( 100% - 30px)
}

.dshBox.dsh_003 .AreaBody .sales-target {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 40px;
    padding-bottom: 20px;
    text-align: center
}

.dshBox.dsh_003 .AreaBody .sales-target .sales-target__single {
    width: 100%
}

.dshBox.dsh_003 .AreaBody .sales-target .sales-target__single h3 {
    width: 100%;
    font-size: 30px;
    margin-bottom: 0
}

.dshBox.dsh_003 .AreaBody .sales-target .sales-target__single .text-success {
    width: 100%;
    font-size: 30px;
    margin-bottom: 0;
    color: #ff5722
}

.dshBox.dsh_003 .AreaBody .sales-target .sales-target__single .color-gray {
    width: 100%;
    line-height: 16px
}

.dshBox.dsh_003 .AreaBody .sales-target__progress-bar {
    position: relative;
    margin: 15px 4px 4px;
    float: left;
    text-align: center;
    width: 100%
}

.dshBox.dsh_003 .AreaBody .sales-target__progress-bar .barOverflow {
    position: relative;
    overflow: hidden;
    width: 222px;
    height: 111px;
    margin-bottom: -14px;
    display: inline-block
}

.dshBox.dsh_003 .AreaBody .sales-target__progress-bar .bar {
    position: absolute;
    top: 0;
    left: 0;
    width: 222px;
    height: 222px;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 15px solid #ff572212;
    border-bottom-color: #ff5722;
    border-right-color: #ff5722;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.dshBox.dsh_003 .AreaBody .sales-target__progress-bar .left {
    position: absolute;
    width: 15px;
    height: 15px;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    left: 0;
    bottom: -24px;
    overflow: hidden
}

.dshBox.dsh_003 .AreaBody .sales-target__progress-bar .right {
    position: absolute;
    background: #fff;
    width: 15px;
    height: 15px;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    right: 0;
    bottom: -24px;
    overflow: hidden
}

.dshBox.dsh_003 .AreaBody .sales-target__progress-bar .back {
    width: 15px;
    height: 15px;
    background: #e8faf4;
    position: absolute
}

.dshBox.dsh_003 .AreaBody .sales-target__progress-bar .total-count {
    position: absolute;
    top: 92%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    font-size: 30px;
    font-weight: 700
}

.dshBox.dsh_003 .AreaBody .sales-target__progress-bar .total-count .total-count__text {
    font-size: 15px;
    line-height: 22px;
    text-transform: capitalize;
    color: #868eae;
    font-weight: 400
}

.dshBox.dsh_004 {
    display: block;
    margin-bottom: 0
}

.dshBox.dsh_004 .AreaTitle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
    margin-bottom: 10px;
    border-bottom: 1px solid #f1f2f6;
    padding-bottom: 8px
}

.dshBox.dsh_004 .AreaTitle .Text {
    display: block;
    font-size: 16px;
    font-weight: 600
}

.dshBox.dsh_004 .AreaBody {
    display: block;
    height: calc( 100% - 40px)
}

.dshBox.dsh_004 .AreaBody tr {
    width: 100%
}

.dshBox.dsh_004 .AreaBody tr td {
    font-size: 15px;
    border: 0;
    box-shadow: none!important;
    padding: 10px 0
}

.dshBox.dsh_004 .AreaBody tr td .User {
    display: flex;
    align-items: center
}

.dshBox.dsh_004 .AreaBody tr td .User .Photo {
    width: 40px;
    height: 40px;
    margin-right: 5px
}

.dshBox.dsh_004 .AreaBody tr td .User .Photo img {
    width: 40px;
    height: 40px;
    border-radius: 40px;
    overflow: hidden
}

.dshBox.dsh_004 .AreaBody tr td .User .Info {
    display: block;
    height: calc( 100% - 30px)
}

.dshBox.dsh_004 .AreaBody tr td .User .Info span:nth-child(1) {
    float: left;
    width: 100%;
    font-weight: 500
}

.dshBox.dsh_004 .AreaBody tr td .User .Info span:nth-child(2) {
    float: left;
    width: 100%;
    color: #ff5722;
    font-size: 14px;
    padding-top: 3px
}

.dshBox.dsh_004 .AreaBody tr td .User .Info {
    float: left;
    width: 100%
}

.dshBox.dsh_004 .AreaBody .Btn {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background: 0 0;
    border: 0;
    box-shadow: none;
    border-top: 1px solid #ccc;
    text-align: center;
    padding: 13px;
    cursor: pointer
}

.chartjs-tooltip {
    opacity: 1;
    position: absolute;
    background: #fff;
    -webkit-box-shadow: 0 8px 10px #9299b815;
    box-shadow: 0 8px 10px #9299b815;
    padding: 10px 12px!important;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid #f1f2f6;
    min-width: 80px;
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    pointer-events: none;
    -webkit-transform: translate(-50%,5%);
    -ms-transform: translate(-50%,5%);
    transform: translate(-50%,5%);
    z-index: 222;
    top: 0;
    left: 0
}

.chartjs-tooltip:before {
    position: absolute;
    content: "";
    border-top: 5px solid #fff;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    bottom: -5px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.chartjs-tooltip-key {
    display: inline-block;
    width: 10px;
    height: 10px;
    background: pink;
    margin-right: 10px
}

.tooltip-title {
    font-size: 12px;
    font-weight: 500!important;
    font-family: Inter,sans-serif;
    text-transform: capitalize;
    margin-bottom: 4px
}

.tooltip-value {
    color: #63b963;
    font-size: 22px;
    font-weight: 600!important;
    font-family: Inter,sans-serif
}

.tooltip-value sup {
    font-size: 12px
}

.chartjs-tooltip table tbody td {
    font-size: 13px;
    font-weight: 500;
    padding: 0;
    padding-bottom: 3px;
    white-space: nowrap;
    border: 0;
    box-shadow: none;
    text-align: left
}

.chartjs-tooltip table tbody td .data-label {
    margin-left: 3px;
    color: #868eae
}

.ap-po-timeChart .overview-single__chart {
    margin-top: -10px
}

.ap-po-timeChart .parentContainer {
    position: relative;
    bottom: -6px
}

.card-chart-bar {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    margin-bottom: 25px
}

.device-pieChart-wrap .pie-chart-legend {
    position: absolute;
    top: 50%;
    left: 50%;
    text-align: center;
    width: 200px;
    margin-bottom: 0;
    display: inline-block;
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%)
}

.device-pieChart-wrap .pie-chart-legend p {
    margin-bottom: 0;
    font-size: 14px
}

.device-pieChart-wrap .pie-chart-legend span {
    font-size: 24px;
    display: block;
    font-weight: 600
}

.ant-skeleton {
    display: table;
    width: 100%
}

.ant-skeleton-rtl {
    direction: rtl
}

.ant-skeleton-header {
    display: table-cell;
    padding-right: 16px;
    vertical-align: top
}

.ant-skeleton-rtl .ant-skeleton-header {
    padding-right: 0;
    padding-left: 16px
}

.ant-skeleton-header .ant-skeleton-avatar {
    display: inline-block;
    vertical-align: top;
    background: #f2f2f2;
    width: 32px;
    height: 32px;
    line-height: 32px
}

.ant-skeleton-header .ant-skeleton-avatar.ant-skeleton-avatar-circle {
    border-radius: 50%
}

.ant-skeleton-header .ant-skeleton-avatar-lg {
    width: 40px;
    height: 40px;
    line-height: 40px
}

.ant-skeleton-header .ant-skeleton-avatar-lg.ant-skeleton-avatar-circle {
    border-radius: 50%
}

.ant-skeleton-header .ant-skeleton-avatar-sm {
    width: 24px;
    height: 24px;
    line-height: 24px
}

.ant-skeleton-header .ant-skeleton-avatar-sm.ant-skeleton-avatar-circle {
    border-radius: 50%
}

.ant-skeleton-content {
    display: table-cell;
    width: 100%;
    vertical-align: top
}

.ant-skeleton-content .ant-skeleton-title {
    width: 100%;
    height: 10px;
    margin-top: 0;
    background: #f2f2f2
}

.ant-skeleton-content .ant-skeleton-title+.ant-skeleton-paragraph {
    margin: 0;
    margin-top: 10px
}

.ant-skeleton-content .ant-skeleton-paragraph {
    padding: 0
}

.ant-skeleton-content .ant-skeleton-paragraph>li {
    width: 100%;
    height: 10px;
    list-style: none;
    background: #f2f2f2
}

.ant-skeleton-content .ant-skeleton-paragraph>li:last-child:not(:first-child):not(:nth-child(2)) {
    width: 61%
}

.ant-skeleton-content .ant-skeleton-paragraph>li+li {
    margin-top: 10px
}

.ant-skeleton-with-avatar .ant-skeleton-content .ant-skeleton-title {
    margin-top: 12px
}

.ant-skeleton-with-avatar .ant-skeleton-content .ant-skeleton-title+.ant-skeleton-paragraph {
    margin-top: 28px
}

.ant-skeleton.ant-skeleton-active .ant-skeleton-content .ant-skeleton-paragraph>li,.ant-skeleton.ant-skeleton-active .ant-skeleton-content .ant-skeleton-title {
    background: -webkit-gradient(linear,left top,right top,color-stop(25%,#f2f2f2),color-stop(37%,#e6e6e6),color-stop(63%,#f2f2f2));
    background: linear-gradient(90deg,#f2f2f2 25%,#e6e6e6 37%,#f2f2f2 63%);
    background-size: 400% 100%;
    -webkit-animation: ant-skeleton-loading 1.4s ease infinite;
    animation: ant-skeleton-loading 1.4s ease infinite
}

.ant-skeleton-rtl.ant-skeleton.ant-skeleton-active .ant-skeleton-content .ant-skeleton-paragraph>li,.ant-skeleton-rtl.ant-skeleton.ant-skeleton-active .ant-skeleton-content .ant-skeleton-title {
    -webkit-animation-name: ant-skeleton-loading-rtl;
    animation-name: ant-skeleton-loading-rtl
}

.ant-skeleton.ant-skeleton-active .ant-skeleton-avatar {
    background: -webkit-gradient(linear,left top,right top,color-stop(25%,#f2f2f2),color-stop(37%,#e6e6e6),color-stop(63%,#f2f2f2));
    background: linear-gradient(90deg,#f2f2f2 25%,#e6e6e6 37%,#f2f2f2 63%);
    background-size: 400% 100%;
    -webkit-animation: ant-skeleton-loading 1.4s ease infinite;
    animation: ant-skeleton-loading 1.4s ease infinite
}

.ant-skeleton-rtl.ant-skeleton.ant-skeleton-active .ant-skeleton-avatar {
    -webkit-animation-name: ant-skeleton-loading-rtl;
    animation-name: ant-skeleton-loading-rtl
}

.ant-skeleton.ant-skeleton-active .ant-skeleton-button,.ant-skeleton.ant-skeleton-active .ant-skeleton-input {
    background: -webkit-gradient(linear,left top,right top,color-stop(25%,#f2f2f2),color-stop(37%,#e6e6e6),color-stop(63%,#f2f2f2));
    background: linear-gradient(90deg,#f2f2f2 25%,#e6e6e6 37%,#f2f2f2 63%);
    background-size: 400% 100%;
    -webkit-animation: ant-skeleton-loading 1.4s ease infinite;
    animation: ant-skeleton-loading 1.4s ease infinite
}

.ant-skeleton-element {
    display: inline-block
}

.ant-skeleton-element .ant-skeleton-button {
    display: inline-block;
    vertical-align: top;
    background: #f2f2f2;
    border-radius: 4px;
    width: 80px;
    height: 40px;
    line-height: 40px
}

.ant-skeleton-element .ant-skeleton-button.ant-skeleton-button-circle {
    width: 40px;
    border-radius: 50%
}

.ant-skeleton-element .ant-skeleton-button.ant-skeleton-button-round {
    border-radius: 40px
}

.ant-skeleton-element .ant-skeleton-button-lg {
    width: 96px;
    height: 48px;
    line-height: 48px
}

.ant-skeleton-element .ant-skeleton-button-lg.ant-skeleton-button-circle {
    width: 48px;
    border-radius: 50%
}

.ant-skeleton-element .ant-skeleton-button-lg.ant-skeleton-button-round {
    border-radius: 48px
}

.ant-skeleton-element .ant-skeleton-button-sm {
    width: 64px;
    height: 32px;
    line-height: 32px
}

.ant-skeleton-element .ant-skeleton-button-sm.ant-skeleton-button-circle {
    width: 32px;
    border-radius: 50%
}

.ant-skeleton-element .ant-skeleton-button-sm.ant-skeleton-button-round {
    border-radius: 32px
}

.ant-skeleton-element .ant-skeleton-avatar {
    display: inline-block;
    vertical-align: top;
    background: #f2f2f2;
    width: 32px;
    height: 32px;
    line-height: 32px
}

.ant-skeleton-element .ant-skeleton-avatar.ant-skeleton-avatar-circle {
    border-radius: 50%
}

.ant-skeleton-element .ant-skeleton-avatar-lg {
    width: 40px;
    height: 40px;
    line-height: 40px
}

.ant-skeleton-element .ant-skeleton-avatar-lg.ant-skeleton-avatar-circle {
    border-radius: 50%
}

.ant-skeleton-element .ant-skeleton-avatar-sm {
    width: 24px;
    height: 24px;
    line-height: 24px
}

.ant-skeleton-element .ant-skeleton-avatar-sm.ant-skeleton-avatar-circle {
    border-radius: 50%
}

.ant-skeleton-element .ant-skeleton-input {
    display: inline-block;
    vertical-align: top;
    background: #f2f2f2;
    width: 100%;
    height: 40px;
    line-height: 40px
}

.ant-skeleton-element .ant-skeleton-input-lg {
    width: 100%;
    height: 48px;
    line-height: 48px
}

.ant-skeleton-element .ant-skeleton-input-sm {
    width: 100%;
    height: 32px;
    line-height: 32px
}

@-webkit-keyframes ant-skeleton-loading {
    0% {
        background-position: 100% 50%
    }

    to {
        background-position: 0 50%
    }
}

@keyframes ant-skeleton-loading {
    0% {
        background-position: 100% 50%
    }

    to {
        background-position: 0 50%
    }
}

@-webkit-keyframes ant-skeleton-loading-rtl {
    0% {
        background-position: 0 50%
    }

    to {
        background-position: 100% 50%
    }
}

@keyframes ant-skeleton-loading-rtl {
    0% {
        background-position: 0 50%
    }

    to {
        background-position: 100% 50%
    }
}

.saopc-list table {
    width: 100%!important;
    margin: 0 auto;
    clear: both;
    border-collapse: separate;
    border-spacing: 0;
    display: table
}

.saopc-list table thead tr {
    font-weight: 400
}

.saopc-list table thead tr th {
    font-weight: 400;
    line-height: 35px;
    text-align: left;
    padding: 2px 7px 0
}

.saopc-list table tbody tr.sH {
    font-weight: 400
}

.saopc-list table tbody tr.sH th {
    font-weight: 500;
    color: #000;
    text-align: left;
    padding: 10px 10px 0;
    text-transform: uppercase;
    font-size: 11px
}

.saopc-list table tbody tr {
    cursor: pointer
}

.saopc-list table tbody tr:hover td {
    box-shadow: inset 0 1px 0 0 #ff9800,inset 0 -1px 0 0 #ff9800
}

.saopc-list table tbody tr:hover td:nth-child(1) {
    border-radius: 6px 0 0 6px;
    box-shadow: inset 0 1px 0 0 #ff9800,inset 0 -1px 0 0 #ff9800,inset 1px 0 0 0 #ff9800
}

.saopc-list table tbody tr:hover td:last-child {
    border-radius: 0 6px 6px 0;
    box-shadow: inset 0 1px 0 0 #ff9800,inset 0 -1px 0 0 #ff9800,inset -1px 0 0 0 #ff9800
}

.saopc-list table tbody td {
    line-height: 40px;
    padding: 2px 10px;
    border: 4px solid #fff;
    border-right: 0;
    border-left: 0;
    font-size: 13px;
    position: relative;
    box-shadow: inset 0 1px 0 0 #2d3336,inset 0 1px 0 0 #2d3336,inset 0 -1px 0 0 #2d3336;
    font-weight: 400;
    text-align: left
}

.saopc-list table tbody tr.nonLine td {
    box-shadow: inset 0 1px 0 0 #2d333600,inset 0 -1px 0 0 #2d333659!important;
    border-radius: 0!important;
    border: 0;
    padding-bottom: 10px;
    padding-top: 10px
}

.saopc-list table tbody td.Price:before {
    content: attr(curr);
    position: absolute;
    left: 10px;
    top: 9px;
    height: 39px;
    background: #d3d9e2;
    color: #000;
    display: flex;
    align-items: center;
    width: 30px;
    text-align: center;
    justify-content: center;
    font-size: 12px
}

.saopc-list table tbody td .BoxPrice {
    display: flex;
    align-items: center
}

.saopc-list table tbody td span.ImgIcon {
    font-size: 26px;
    color: #97a2b3;
    display: inline-block;
    margin: 2px 0 0 5px
}

.saopc-list table tbody td span.ImgIcon.Active {
    color: #4caf50
}

.saopc-list table tbody td span.Time {
    line-height: 0;
    font-size: 11px;
    font-weight: 400;
    background: #e0e7ea;
    padding: 2px 3px;
    border-radius: 4px
}

.saopc-list table tbody td:nth-child(1) {
    border-radius: 6px 0 0 6px;
    box-shadow: inset 0 1px 0 0 #2d3336,inset 0 -1px 0 0 #2d3336,inset 1px 0 0 0 #2d3336
}

.saopc-list table tbody tr.nonLine td:nth-child(1) {
    border-radius: 0;
    box-shadow: inset 0 1px 0 0 #2d333600,inset 0 -1px 0 0 #2d333659,inset 1px 0 0 0 #2d333600
}

.saopc-list table thead th:first-child {
    display: block
}

.saopc-list table tbody td:first-child {
}

.saopc-list table tbody td:last-child {
    border-radius: 0 6px 6px 0;
    box-shadow: inset 0 1px 0 0 #2d3336,inset 0 -1px 0 0 #2d3336,inset -1px 0 0 0 #2d3336
}

.saopc-list table tbody td i.move {
    padding: 0;
    width: 25px;
    text-align: center;
    background: #e0e7ea;
    border-radius: 4px;
    margin-left: 1px;
    font-size: 16px;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    line-height: 46px;
    cursor: move;
    display: flex;
    align-items: center;
    justify-content: center
}

.saopc-list table tbody tr:hover td i.move {
    background: #ff9800;
    color: #fff
}

.saopc-list table tbody td img.Icon {
    padding: 3px 4px;
    margin: 4px 0;
    float: left
}

.saopc-list table tbody td .contentLang {
    display: none;
    background: #c8cfe170;
    color: #000;
    width: 36px;
    height: 36px;
    border-radius: 3px;
    position: absolute;
    right: 5px;
    top: 12px;
    text-indent: 0;
    line-height: 36px;
    text-align: center;
    font-size: 22px
}

.saopc-list table tbody tr:hover .contentLang {
    display: block
}

.saopc-list table tbody tr span.Name {
    padding: 8px 15px;
    line-height: 28px;
    float: left
}

.saopc-list table tbody tr div.LongText {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 320px
}

.saopc-list table tbody tr td.textL {
    text-align: left
}

.saopc-list table tbody tr td.textR {
    text-align: right
}

.saopc-list table tbody tr td.textC {
    text-align: center
}

.saopc-list table tbody tr td.textb {
    font-weight: 700
}

.saopc-list table tbody tr td.Icon img {
    border-radius: 100px
}

.saopc-list table tbody tr td input {
    float: left;
    width: 100%;
    font-weight: 400;
    font-size: 12px;
    line-height: 28px;
    border: 1px solid #ccc;
    padding: 5px;
    outline: none
}

.saopc-list table tbody tr td.Price input {
    text-indent: 28px
}

[SUPPLY_STATUS="2"] .finality {
    background: #4caf50!important;
    color: #fff!important
}

[SUPPLY_STATUS="2"] .finality::before {
    color: #fff!important
}

[SUPPLY_STATUS="2"] .Btn.supply {
    background: #fff!important;
    box-shadow: 0 0 0 1px #ccc!important;
    color: #000!important
}

[SUPPLY_STATUS="2"] {
    background: #4caf500f!important;
    border-color: #4caf50!important
}

@media only screen and (max-width: 768px) {
    body.New.left-nav-control header.headerv3 {
        left:0;
        width: calc(100% - 28px);
        margin: 0 14px;
        width: 100%;
        padding: 0 10px;
        margin: 0;
        z-index:105;
    }

    body.New.left-nav-control header.headerv3.nonNav {
        width: 100%;
        margin: 0;
        padding-left: 14px;
        padding-right: 14px;
        z-index: 9999991
    }

    body.New header.headerv3 {
        left: 0;
        width: calc(100% - 28px);
        margin: 0 14px
    }

    body.New .container-v3 {
        padding: 14px;
        width: 100%
    }

    body.New.left-nav-control .sidebar {
        left: -240px
    }

    body.New {
        padding-left: 0
    }

    body.New .leftNavBg {
        background: #000000a1;
        z-index: 999932
    }

    body.New .MobilBottomNav {
        width: 100%;
        height: 75px;
        background: linear-gradient(180deg,#042AE5,#00188D);
        position: fixed;
        bottom: 0;
        display: flex;
        height: 75px;
        align-items: center;
        justify-content: center;
        padding: 0 14px;
        z-index: 9;
        transition: all 1s
    }

    body.New .MobilBottomNavItem {
        width: 100%;
        color: #fff;
        text-transform: uppercase;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        position: relative
    }

    body.New .MobilBottomNavOptions {
        display: none
    }

    body.New .MobilBottomNavOtherItem {
        margin-left: 12px;
        margin-right: 12px;
        display: flex;
        justify-content: space-between;
        width: 100%;
        align-items: center
    }

    body.New .MobilBottomNavItem.Active>i::after {
        content: "";
        position: absolute;
        top: 0;
        right: -6px;
        width: 10px;
        height: 10px;
        background: #ff0045 0% 0% no-repeat padding-box;
        opacity: 1;
        border-radius: 100%;
        z-index: 1
    }

    body.New .MobilBottomNavItem>i {
        font-size: 18px;
        margin-bottom: 10px;
        position: relative
    }

    body.New .MobilBottomNavItem>span {
        font-size: 11px;
        font-weight: 100
    }

    body.New header.headerv3>.header-control>.item>.userCard {
        display: none
    }

    body.New .control-panel>.column .control-item>.control-btn>span {
        color: #5a5e9a!important
    }

    body.New .control-panel>.column .control-item>.control-btn>i {
        color: #5a5e9a!important;
        display: block;
        margin-left: 6px;
        font-size: 12px
    }

    body.New .control-panel>.column .panel-title {
        margin-top: 16px
    }

    body.New .bodyWrapperOnlineSale .control-panel>.column .panel-title {
        margin-bottom: 8px;
        margin-top: 8px
    }

    body.New .bodyWrapperOnlineSale .control-panel>.column .panel-title>.T {
        display: flex;
        align-items: flex-start;
        flex-direction: column
    }

    body.New .bodyWrapperOnlineSale .control-panel>.column .panel-title>.T>span {
        margin-top: 8px;
        display: none
    }

    body.New .bodyWrapperOnlineSale .control-panel>.column .panel-title>.sT {
        font-size: 14px;
        display: none
    }

    body.New .bodyWrapperOnlineSale .chart-container .chart-head_1 {
        padding-bottom: 0;
        padding-left: 16px;
        padding-right: 16px
    }

    body.New .bodyWrapperOnlineSale .chart-container.chart-card-1>.chart-content>.chart-head {
        padding-left: 16px;
        padding-right: 16px;
        margin-bottom: 16px
    }

    body.New .bodyWrapperOnlineSale .chart-container .chart-content.Supply_Statistic {
        height: auto!important
    }

    body.New .bodyWrapperOnlineSale .chart-container .chart-content.Supply_Statistic>div#spak-chart2 {
        display: none
    }

    body.New .bodyWrapperOnlineSale .chart-container .chart-content .chart-body {
        padding-bottom: 0!important
    }

    .bodyWrapperOnlineSale .DataContainer .DataList>.item>.Num {
        font-size: 13px!important;
        line-height: inherit!important;
        padding: 4px 7px!important
    }

    .bodyWrapperOnlineSale .DataContainer .DataList>.item {
        margin-top: 4px!important;
        margin-bottom: 10px!important
    }

    .bodyWrapperOnlineSale .col-sm-12:nth-child(2) .DataContainer .DataList>.item {
        background: #87cefa!important;
        color: #fff
    }

    .bodyWrapperOnlineSale .col-sm-12:nth-child(2) .DataContainer .DataList>.item>.Num {
        font-size: 26px!important
    }

    .bodyWrapperOnlineSale .DataContainer .DataList>.item>.Num>span:first-child {
        margin-bottom: 6px
    }

    .bodyWrapperOnlineSale .content-wrapperv2>.title-box>.column>.T {
        font-size: 16px!important;
        margin-bottom: 6px!important
    }

    body.New .control-panel {
        padding: 0;
        margin-top: 16px;
        margin-bottom: 16px;
        padding-left: 16px;
        padding-right: 16px;
        overflow: inherit
    }

    body.New .bodyWrapperOnlineSale .control-panel {
        flex-direction: row
    }

    .PageView_v2.balanceCustomSettings .v2Table-container,body.New .PageView_v2.customOrderArea .v2Table-container {
        top: 178px;
        height: calc(100vh - 308px);
        padding-left: 0;
        padding-right: 0
    }

    .PageView_v2.balanceCustomSettings .control-panel-scroll-hide,.PageView_v2.customOrderArea .control-panel-scroll-hide {
        transform: translateY(0)!important;
        visibility: visible!important
    }

    .PageView_v2.balanceCustomSettings .control-panel,.PageView_v2.customOrderArea .control-panel {
        margin-bottom: 0;
        align-items: flex-start;
        border-bottom: 0;
        margin: 0!important;
        padding-top: 16px;
        padding-bottom: 14px;
        position: fixed;
        top: 60px;
        left: 0;
        right: 0;
        width: 100%;
        background: #fff url(/Library/Img/Newpanbg.svg);
        z-index: 99999999999
    }

    .MobAllSearch {
        display: flex
    }

    body.New header.headerv3>.header-search .area {
        width: 100%;
        min-width: 100%
    }

    body.New header.headerv3>.header-search .area .search-elements {
        width: 100%
    }

    header.headerv3>.header-search.Active {
        box-shadow: 0 13px 24px -17px #000
    }

    .SearchView {
        width: 100%;
        background: #fff!important
    }

    .SearchView>.Search_Detail {
        width: 100%;
        background: 0 0
    }

    .SearchView>.Search_Detail>.searchLeft {
        width: calc(100% - 20px);
        background: #fff;
        margin: 0 10px
    }

    .SearchView>.Search_Detail>.searchLeft>.Tab {
        width: 100%;
        display: flex!important;
        flex-direction: column;
        padding: 14px!important;
        background: #fff!important;
        border: 0!important;
        border-bottom: 1px solid #ccc!important;
        margin-bottom: 5px!important;
        color: #000!important
    }

    .SearchView>.Search_Detail>.searchLeft>.Tab>span {
        width: 100%!important;
        border: 0!important;
        font-size: 13px!important;
        line-height: 17px!important;
        text-align: left!important;
        text-indent: 0!important;
        background: 0 0!important;
        color: #000!important
    }

    body.New .MobilBottomNav.customOrderbottomNav {
        box-shadow: 0 0 80px -25px #000
    }

    .PageView_v2.customOrderArea .control-panel>.column .control-item>.theme-select {
        height: 36px;
        background-position-y: 14px;
        color: #5a5e9a;
        font-size: 12px;
        font-weight: 400
    }

    .PageView_v2.customOrderArea .control-panel>.column .panel-title {
        margin-top: 0;
        margin-bottom: 10px
    }

    .PageView_v2.customOrderArea .control-panel>.column {
        flex-wrap: wrap
    }

    body.New .control-panel>.column:last-child {
        justify-content: flex-start
    }

    body.New .bodyWrapperOnlineSale .control-panel>.column:last-child {
        margin-top: 8px
    }

    body.New .bodyWrapperOnlineSale .chart-container {
        margin-top: 16px
    }

    body.New .bodyWrapperOnlineSale .content-wrapperv2 {
        margin-top: 22px!important;
        margin-bottom: 22px!important
    }

    body.New .control-panel>.column:last-child::-webkit-scrollbar {
        width: 6px!important;
        height: 3px!important
    }

    body.New .control-panel>.column:last-child::-webkit-scrollbar {
        width: 8px!important;
        height: 2px!important
    }

    body.New .control-panel>.column:last-child::-webkit-scrollbar-thumb {
        background-color: #a8a8a8
    }

    body.New .control-panel>.column:last-child::-webkit-scrollbar-track {
        background: rgba(255,255,255,.41)
    }

    body.New .v2Table-container {
        margin: 0 16px;
        top: 0
    }

    body.New .v2Table-overflow {
        padding-bottom: 0
    }

    body.New .MobLogo {
        display: flex
    }

    body.New .MobLogo>img {
        display: flex
    }

    body.New .categorySelect {
        display: none
    }

    body.New .Popup_v2>.Modal>.Htm>.Document {
        padding-bottom: 40px
    }

    body.New .DepotViewContainer .Container .TabViews .DepotView .ProductList .ProductItem .Info {
        display: flex;
        flex-direction: column;
        min-height: 50px;
        width: 100%;
        align-items: flex-start;
        justify-content: center
    }

    body.New .DepotViewContainer .Container .TabViews .DepotView .ProductList .ProductItem .Info .Name {
        font-size: 10px;
        height: inherit!important;
        font-weight: 300!important;
        text-align: left!important
    }
}

[LJ_Duplicate_Order_Factor] .BoxArea>.Box {
    width: 100%;
    height: 100%;
    border: 1px solid #efefef;
    padding: 14px;
    border-radius: 2px;
    box-shadow: 0 3px 10px -7px #0003
}

.BoxArea>.Box .Title {
    width: 100%;
    font-weight: 700;
    font-size: 18px;
    margin-bottom: 10px
}

.BoxArea>.Box .List {
    width: 100%;
    display: flex;
    flex-direction: column
}

.BoxArea>.Box .List>.Item {
    width: 100%;
    display: flex;
    flex-direction: column
}

.BoxArea>.Box .List>.Item>.Info {
    width: 100%;
    display: flex;
    border: 1px solid #efefef;
    border-bottom: 0;
    align-items: center;
    padding: 7px
}

.BoxArea>.Box .List>.Item>.Info>.Name {
    width: 100%;
    font-weight: 700
}

.BoxArea>.Box .List>.Item>.Info>.Content {
    width: 100%;
    min-width: 120px;
    max-width: 180px;
    display: flex;
    flex-direction: column;
    text-align: center
}

.BoxArea>.Box .List>.Item>.Info>.Content>span:nth-child(0) {
    width: 100%
}

.BoxArea>.Box .List>.Item>.Info>.Content>span:nth-child(1) {
    width: 100%;
    font-size: 9px;
    color: #515151;
    text-transform: uppercase
}

.BoxArea>.Box .List>.Item>.Progress {
    width: 100%
}

.BoxArea>.Box .List>.Item>.Progress>span {
    width: 100%
}

.container-fluid .grid-stack {
    min-height: 500px;
    height: 100%;
    background: 0 0
}

.container-fluid .grid-stack>.grid-stack-item>.grid-stack-item-content {
    margin: 0;
    position: absolute;
    width: auto;
    overflow-x: hidden;
    overflow-y: hidden;
    background: 0 0
}

.BoxArea {
    width: 100%;
    height: 100%
}

.BoxArea>.View {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    border: 1px solid #efefef;
    padding: 14px;
    border-radius: 4px
}

.BoxArea .dashReport_Title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
    border-bottom: 1px solid #efefef;
    padding-bottom: 6px
}

.BoxArea .dashReport_Title>.Text {
    display: flex;
    flex-direction: column
}

.BoxArea .dashReport_Title>.Text>span:nth-child(1) {
    display: flex;
    font-weight: 600;
    font-size: 14px;
    color: #5a5e9a
}

.BoxArea .dashReport_Title>.Text>span:nth-child(2) {
    display: flex;
    font-size: 11px;
    color: #5a5e9a
}

.BoxArea .dashReport_Title>.Selected {
    border: 0
}

.BoxArea .dashReport_Title>.Selected>select {
    border: 1px solid #efefef;
    padding: 5px;
    border-radius: 4px;
    color: #5a5e9a;
    font-weight: 300
}

.dashReport_Title>.Selected>select {
    border: 1px solid #efefef;
    padding: 5px;
    border-radius: 4px;
    color: #5a5e9a;
    font-weight: 300
}

.grid-stack-item .BoxArea[DataId="1013"] .View .tab-content {
    height: auto;
    overflow: auto
}

.grid-stack-item .BoxArea[DataId="1013"] .View .tab-content table {
    width: 100%
}

.grid-stack-item .BoxArea[DataId="1013"] .View .tab-content table>thead {
    height: auto;
    overflow: auto
}

.grid-stack-item .BoxArea[DataId="1013"] .View .tab-content table>thead>tr {
    height: auto;
    overflow: auto
}

.grid-stack-item .BoxArea[DataId="1013"] .View .tab-content table>thead>tr>th {
    font-size: 11px;
    text-transform: uppercase;
    color: #5a5e9a;
    padding: 0 4px 8px;
    text-align: left
}

.grid-stack-item .BoxArea[DataId="1013"] .View .tab-content table>thead>tr>th:nth-child(2) {
    text-align: center
}

.grid-stack-item .BoxArea[DataId="1013"] .View .tab-content table>thead>tr>th:nth-child(3) {
    text-align: center
}

.grid-stack-item .BoxArea[DataId="1013"] .View .tab-content table>tbody {
    height: auto;
    overflow: auto
}

.grid-stack-item .BoxArea[DataId="1013"] .View .tab-content table>tbody>tr {
    height: auto;
    overflow: auto
}

.grid-stack-item .BoxArea[DataId="1013"] .View .tab-content table>tbody>tr>td {
    line-height: 26px;
    text-align: left;
    padding: 0 4px
}

.grid-stack-item .BoxArea[DataId="1013"] .View .tab-content table>tbody>tr>td:nth-child(2) {
    background: #5a5e9a!important;
    color: #fff;
    text-align: center;
    border-radius: 0
}

.grid-stack-item .BoxArea[DataId="1013"] .View .tab-content table>tbody>tr>td:nth-child(3) {
    text-align: center
}

.grid-stack-item .BoxArea[DataId="1027"] .View .tab-content {
    height: auto;
    overflow: auto
}

.grid-stack-item .BoxArea[DataId="1027"] .View .tab-content table {
    width: 100%
}

.grid-stack-item .BoxArea[DataId="1027"] .View .tab-content table>thead {
    height: auto;
    overflow: auto
}

.grid-stack-item .BoxArea[DataId="1027"] .View .tab-content table>thead>tr {
    height: auto;
    overflow: auto
}

.grid-stack-item .BoxArea[DataId="1027"] .View .tab-content table>thead>tr>th {
    font-size: 11px;
    text-transform: uppercase;
    color: #5a5e9a;
    padding: 0 4px 8px;
    text-align: left
}

.grid-stack-item .BoxArea[DataId="1027"] .View .tab-content table>thead>tr>th:nth-child(2) {
    text-align: center
}

.grid-stack-item .BoxArea[DataId="1027"] .View .tab-content table>thead>tr>th:nth-child(3) {
    text-align: center
}

.grid-stack-item .BoxArea[DataId="1027"] .View .tab-content table>tbody {
    height: auto;
    overflow: auto
}

.grid-stack-item .BoxArea[DataId="1027"] .View .tab-content table>tbody>tr {
    height: auto;
    overflow: auto
}

.grid-stack-item .BoxArea[DataId="1027"] .View .tab-content table>tbody>tr>td {
    line-height: 26px;
    text-align: left;
    padding: 0 4px
}

.grid-stack-item .BoxArea[DataId="1027"] .View .tab-content table>tbody>tr>td:nth-child(2) {
    background: #5a5e9a!important;
    color: #fff;
    text-align: center;
    border-radius: 0
}

.grid-stack-item .BoxArea[DataId="1027"] .View .tab-content table>tbody>tr>td:nth-child(3) {
    text-align: center
}

.grid-stack-item .BoxArea[DataId="1010"] .View .tab-content {
    height: auto;
    overflow: auto
}

.grid-stack-item .BoxArea[DataId="1010"] .View .tab-content table {
    width: 100%
}

.grid-stack-item .BoxArea[DataId="1010"] .View .tab-content table>thead {
    height: auto;
    overflow: auto
}

.grid-stack-item .BoxArea[DataId="1010"] .View .tab-content table>thead>tr {
    height: auto;
    overflow: auto
}

.grid-stack-item .BoxArea[DataId="1010"] .View .tab-content table>thead>tr>th {
    font-size: 11px;
    text-transform: uppercase;
    color: #5a5e9a;
    padding: 0 4px 8px;
    text-align: center
}

.grid-stack-item .BoxArea[DataId="1010"] .View .tab-content table>tbody {
    height: auto;
    overflow: auto
}

.grid-stack-item .BoxArea[DataId="1010"] .View .tab-content table>tbody>tr {
    height: auto;
    overflow: auto
}

.grid-stack-item .BoxArea[DataId="1010"] .View .tab-content table>tbody>tr>td {
    line-height: 16px;
    text-align: center;
    padding: 0 4px;
    border: 1px solid #e3e3e3;
    font-size: 10px
}

.grid-stack-item .BoxArea[DataId="1010"] .View .tab-content table>tbody>tr>td.bg_blue {
    background: #5a5e9a!important;
    color: #fff
}

.grid-stack-item[gs-h="8"] .BoxArea[DataId="1010"] .View .tab-content table>tbody>tr>td {
    line-height: 23.3px
}

.grid-stack-item[gs-h="7"] .BoxArea[DataId="1010"] .View .tab-content table>tbody>tr>td {
    line-height: 19.6px
}

.BoxArea .stats-card {
    color: #fff;
    border-radius: 3px;
    box-shadow: 6px 3px 12px 0 rgba(0,0,0,.05);
    -webkit-box-shadow: 6px 3px 12px 0 rgba(0,0,0,.05);
    -moz-box-shadow: 6px 3px 12px 0 rgba(0,0,0,.05);
    -ms-box-shadow: 6px 3px 12px 0 rgba(0,0,0,.05);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%
}

.BoxArea .stats-card.card1 {
    background-color: #5985ee
}

.BoxArea .stats-card.card2 {
    background-color: #4bbbce
}

.BoxArea .stats-card.card3 {
    background-color: #e66793
}

.BoxArea .stats-card.card4 {
    background-color: #46cd93
}

.BoxArea .stats-card.card1 .card-desc,.BoxArea .stats-card.card2 .card-desc,.BoxArea .stats-card.card3 .card-desc,.BoxArea .stats-card.card4 .card-desc {
    background-color: rgba(255,255,255,.1)
}

.BoxArea .stats-card .card-desc {
    padding: 13px;
    height: 100%;
    max-height: 60%;
    min-height: 60px;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly
}

.BoxArea .stats-card .card-desc>.desc-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: auto;
    max-height: 50px
}

.BoxArea .stats-card .card-desc>.desc-head>.column .T {
    font-weight: 600;
    color: rgba(255,255,255,.5);
    font-size: 14px
}

.BoxArea .stats-card .card-desc>.desc-head>.column .num {
    font-weight: 600;
    font-size: 1.8rem
}

.BoxArea .stats-card .card-desc>.desc-past {
    font-size: 12px;
    text-align: left;
    display: block
}

.BoxArea .stats-card .card-desc>.desc-past>.past-num {
    display: inline-block;
    background-color: #fff;
    color: #4a4a4a;
    padding: 0 5px;
    border-radius: 5px;
    font-size: 10px;
    margin-right: 2px
}

.BoxArea .stats-card .card-desc>.desc-past>.past-num.up {
    color: green
}

.BoxArea .stats-card .card-desc>.desc-past>.past-num.down {
    color: red
}

.BoxArea .stats-card .desc-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 17px 13px
}

.BoxArea .stats-card .desc-footer>.column .Icon {
    font-size: 20px;
    color: rgba(255,255,255,.58)
}

section.dashboard-column {
    margin-top: 20px;
    position: relative;
    padding: 0 15px
}

section.dashboard-column .column-head {
    position: relative
}

section.dashboard-column .column-head::before {
    left: 0;
    right: 0
}

section.dashboard-column .column-head::before {
    content: "";
    position: absolute;
    top: -3px;
    left: 15px;
    right: 15px;
    height: 3px;
    background-color: #007ffa;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px
}

section.dashboard-column .column-head .head-area {
    background-color: #fff;
    padding: 12px 0;
    border-bottom: 1px solid #ebebeb
}

section.dashboard-column .column-head .head-area .Title {
    display: flex;
    align-items: center;
    font-weight: 100
}

section.dashboard-column .column-head .head-area .Title>.Icon {
    margin-right: 10px;
    font-size: 18px;
    display: flex;
    align-items: center;
    color: #f65925
}

section.dashboard-column .column-head .head-area .Title>span {
    display: block;
    line-height: 16px
}

section.dashboard-column .column-head .head-area .Title>span>span.LastUpdate {
    display: block;
    font-size: 12px;
    margin-top: 2px;
    color: #888
}

section.dashboard-column .column-head .head-area .Refresh {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 5px 0
}

section.dashboard-column .column-head .head-area .Refresh span:first-child {
    font-size: 11px;
    color: #848484;
    margin-right: 5px
}

.BoxArea .View {
    background: #fff;
    position: relative
}

.BoxArea .View .content-area {
    background-color: #fff;
    padding: 20px;
    border-bottom: 2px solid #e2e2e2;
    position: relative;
    height: auto!important
}

.BoxArea .View .chart_title {
    background-color: #fff;
    border-bottom: 1px solid #ebebeb;
    display: flex;
    padding: 10px 15px 7px
}

.BoxArea .View .chart_title>.item {
    font-size: 20px;
    font-weight: 900
}

.BoxArea .View .chart_title>.item>span {
    display: block;
    font-size: 11px;
    color: #4b4b4b;
    font-weight: 400;
    margin-bottom: -4px
}

.BoxArea .View .tab-head {
    background-color: #fff;
    border-bottom: 1px solid #ebebeb
}

.BoxArea .View .tab-head .tab-list {
    white-space: nowrap;
    overflow-y: hidden;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
    display: flex
}

.BoxArea .View .tab-head .tab-list li {
    list-style: none;
    padding: 10px 15px;
    cursor: pointer;
    border-right: 1px solid #ebebeb;
    line-height: 21px
}

.BoxArea .View .tab-head .tab-list li:first-child {
    border-top-left-radius: 3px
}

.BoxArea .View .tab-head .tab-list li:last-child {
    border-top-right-radius: 3px
}

.BoxArea .View .tab-head .tab-list li.active {
    background: #ff5a23;
    color: #fff;
    pointer-events: none
}

.BoxArea .View .tab-head .tab-list.red li {
    border-color: #eb4955
}

.BoxArea .View .tab-head .tab-list.red li.active {
    background: #eb4955
}

.BoxArea .View .tab-content {
}

.BoxArea .View .tab-content .tab-container {
    padding: 25px 15px 15px;
    background-color: #fff
}

.BoxArea .View .tab-head .tab-list li.active .st {
    color: #fff
}

.BoxArea .View .tab-head .tab-list li span {
    display: block
}

.BoxArea .View .tab-head .tab-list li .st {
    font-size: 11px;
    color: #4b4b4b;
    font-weight: 400
}

.BoxArea .View .tab-head .tab-list li .N {
    font-size: 20px;
    font-weight: 900
}

.BoxArea .View .tab-head .tab-list.freezeTAB li {
    pointer-events: none
}

.chart-content_hr {
    padding-top: 10px;
    border-top: 1px dashed #c3c3c3
}

.BoxArea .View .chart-content {
    display: flex;
    text-align: center
}

.BoxArea .View .chart-content>.item {
    flex: auto
}

.BoxArea .View .chart-content>.item>.Txt {
    position: relative;
    font-weight: 700;
    font-size: 16px;
    line-height: 18px;
    padding-left: 22px;
    display: inline-block;
    text-align: left
}

.BoxArea .View .chart-content>.item>.Txt::before {
    content: "";
    width: 15px;
    height: 15px;
    border: 3px solid #f66526;
    position: absolute;
    border-radius: 50%;
    left: 0;
    top: 10px
}

.BoxArea .View .chart-content>.item>.Txt.Style2::before {
    border-color: #307ffa
}

.BoxArea .View .chart-content>.item>.Txt.Style3::before {
    border-color: silver
}

.BoxArea .View .chart-content>.item>.Txt>span {
    display: block
}

.BoxArea .View .chart-content>.item>.Txt>span:first-child {
    display: block;
    font-size: 12px;
    color: #000;
    font-weight: 100
}

.BoxArea .View .chart-content.small>.item>.Txt {
    padding-left: 21px;
    width: 100%
}

.BoxArea .View .chart-content.small>.item>.Txt>span:first-child {
    font-size: 10px
}

.BoxArea .View .chart-content.small>.item>.Txt::before {
}

.BoxArea .View .chart-content.small>.item>.Txt>span {
    font-size: 14px
}

.BoxArea .View .chart-content.style2 {
    text-align: left
}

.BoxArea .View .chart-content.style2>.item>.Txt {
    padding-left: 0;
    padding-top: 17px;
    font-size: 13px;
    width: 100%
}

.BoxArea .View .chart-content.style2>.item>.Txt::before {
    top: 0;
    border-width: 2px;
    left: 0;
    border-color: #5a5e9a;
    background-color: #fff
}

.BoxArea .View .chart-content.style2>.item>.Txt::after {
    content: "";
    position: absolute;
    height: 1px;
    background-color: #5a5e9a;
    left: 13px;
    top: 7px;
    right: 0
}

.BoxArea .View .chart-content.style2>.item>.Txt>span:first-child {
    font-size: 10px
}

.BoxArea .View .chart-content.style3 {
    text-align: left;
    display: block
}

.BoxArea .View .chart-content.style3>.item {
    display: inline-block;
    width: calc(50% - 2px);
    text-align: center
}

.BoxArea .View .chart-content.style3>.item>.Txt {
    font-size: 13px;
    line-height: 18px;
    margin: 7px 0
}

.BoxArea .View .chart-content.style3>.item>.Txt>span.colored {
    color: #cd3439
}

.BoxArea .View .chart-content.style3>.item>.Txt>span:first-child {
    font-size: 12px
}

.BoxArea .View .chart-content.style3>.item>.Txt::before {
    border-width: 2px;
    border-color: #cd3439;
    top: 5px
}

.BoxArea .View .chart-content.style3>.item>.Txt::after {
    content: "";
    position: absolute;
    left: 6px;
    top: 25px;
    width: 2px;
    bottom: 0;
    background-color: #cd343947
}

.BoxArea .View .chart-content.style3>.item.Single>.Txt::after {
    height: 22px
}

.BoxArea .View .chart-content>.item>.Txt.Style4::before {
    border-color: #fed439
}

.tableALL {
    background-color: #e5e5e5;
    margin-top: -1px;
    font-size: 10px;
    text-align: center;
    padding: 3px 0 13px;
    position: relative
}

.tableALL::after {
    content: url(/Report/assets/img/Icons/down_arrow.svg);
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -12px;
    z-index: 2
}

.BoxArea .View .dashboard-table {
    border: 0;
    margin: 0
}

.BoxArea .View .dashboard-table thead {
}

.BoxArea .View .dashboard-table thead th {
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
    background-color: #e5e5e5;
    text-align: center;
    padding: 6px 4px;
    font-size: 11px;
    font-weight: 600
}

.BoxArea .View .dashboard-table thead th:last-child {
    border-right: 0
}

.BoxArea .View .dashboard-table tbody td {
    background-color: #f7f7f7;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
    padding: 0 6px;
    text-align: center;
    font-size: 11px;
    color: #6f6f6f
}

.BoxArea .View .dashboard-table.readTable tbody tr {
}

.BoxArea .View .dashboard-table.readTable tbody tr.show {
    display: table-row
}

.BoxArea .View .dashboard-table tbody td:last-child {
    border-right: 0
}

.BoxArea .View .dashboard-table tbody td.bg_blue {
    background-color: #59b6f1!important;
    color: #fff!important;
    font-weight: 600
}

.BoxArea .View .dashboard-table tbody td.bg_gray {
    background-color: #efefef!important
}

.BoxArea .View .dashboard-table.blue-table tbody td:not(:first-child) {
    background-color: #e7f4fe
}

.BoxArea .View .content-area .transfer-analiz {
    display: flex;
    justify-content: center;
    margin-top: 20px;
    margin-bottom: 20px
}

.BoxArea .View .content-area .transfer-analiz>.column {
}

.BoxArea .View .content-area .transfer-analiz>.column:first-child {
    min-width: 110px
}

.BoxArea .View .content-area .transfer-analiz>.column>.Left {
    font-weight: 600;
    font-size: 13px;
    text-align: center
}

.BoxArea .View .content-area .transfer-analiz>.column>.Left>.Icon {
    margin-bottom: -12px
}

.BoxArea .View .content-area .transfer-analiz>.column>.Left>.Icon>img {
    display: inline-block
}

.BoxArea .View .content-area .transfer-analiz>.column>.Left>.price {
    font-size: 22px;
    color: #ff2223;
    margin-top: -4px
}

.BoxArea .View .content-area .transfer-analiz>.column .List {
    margin-left: 30px
}

.BoxArea .View .content-area .transfer-analiz>.column .List>.item {
    line-height: 18px;
    height: 54px;
    font-weight: 600;
    font-size: 13px;
    padding-left: 21px;
    position: relative
}

.BoxArea .View .content-area .transfer-analiz>.column .List>.item::before {
    content: "";
    position: absolute;
    left: 0;
    top: 7px;
    width: 15px;
    height: 15px;
    border: 2px solid #f52224;
    border-radius: 50%
}

.BoxArea .View .content-area .transfer-analiz>.column .List>.item::after {
    content: "";
    position: absolute;
    left: 6.1px;
    width: 1px;
    height: 27px;
    top: 27px;
    background-color: #f6646673
}

.BoxArea .View .content-area .transfer-analiz>.column .List>.item:last-child::after {
    display: none
}

.BoxArea .View .content-area .transfer-analiz>.column .List>.item>span:first-child {
    display: block;
    font-size: 11px;
    color: #6f6f6f;
    font-weight: 400
}

.BoxArea .View .content-area .chart-wrapper {
    position: relative
}

.BoxArea .View .content-area .chart-wrapper .half_circle {
    width: 100%;
    height: 150px;
    position: relative;
    overflow: hidden;
    margin-bottom: 10px;
    padding-top: 10px;
    text-align: center
}

.BoxArea .View .content-area .chart-wrapper .chart-content .Single {
    width: 100%;
    display: flex;
    justify-content: center
}

.BoxArea .View .content-area .chart-wrapper .half_circle>.circle-text {
    display: inline-block;
    width: 200px;
    margin-top: 47px;
    line-height: 22px
}

.BoxArea .View .content-area .chart-wrapper .half_circle>.circle-text>.T {
    color: #4b4b4b
}

.BoxArea .View .content-area .chart-wrapper .half_circle>.circle-text>.N {
    font-size: 24px;
    font-weight: 600;
    color: #cd3439
}

.BoxArea .View .content-area .chart-wrapper .half_circle:before {
    content: '';
    width: 300px;
    height: 150px;
    position: absolute;
    border: 27px solid #cd3439;
    border-radius: 300px 300px 0 0;
    border-bottom: none;
    left: 50%;
    transform: translateX(-50%)
}

.BoxArea .View .content-area .chart-wrapper .half_circle:after {
    content: url(/Report/assets/img/Icons/return-icon.png);
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -11px;
    z-index: 2
}

.BoxArea .View .content-area .widget-area {
    border: 1px solid #eee;
    padding: 10px;
    border-radius: 3px;
    margin-bottom: 15px
}

.BoxArea .View .content-area .widget-area>.T {
    font-size: 13px;
    font-weight: 100;
    margin-bottom: 7px
}

.BoxArea .View .content-area .widget-area>.widget-list::after {
    content: "";
    clear: both;
    display: table
}

.BoxArea .View .content-area .widget-area>.widget-list>.widget-item {
    margin: 0 5px;
    float: left;
    width: calc(50% - 10px)
}

.BoxArea .View .content-area .widget-area>.widget-list>.widget-item:last-child {
}

.BoxArea .View .content-area .widget-area>.widget-list>.widget-item>.widget {
    background-color: #fff0f0;
    border: 1px solid #ffe6e6;
    border-radius: 5px;
    padding: 8px 9px;
    line-height: 16px;
    position: relative;
    color: #ffc5c5
}

.BoxArea .View .content-area .widget-area>.widget-list>.widget-item>.widget>.widget-icon {
    position: absolute;
    right: 10px;
    font-size: 24px;
    top: 8px
}

.BoxArea .View .content-area .widget-area>.widget-list>.widget-item>.widget>.widget-icon {
    position: absolute;
    right: 10px;
    font-size: 24px;
    top: 8px
}

.BoxArea .View .content-area .widget-area>.widget-list>.widget-item>.widget>.widget-icon.icon1x {
    font-size: 20px
}

.BoxArea .View .content-area .widget-area>.widget-list>.widget-item>.widget>.widget-icon.ifa-36::before {
    color: #d3d3d3
}

.BoxArea .View .content-area .widget-area>.widget-list>.widget-item>.widget>.widget-t {
    font-weight: 700;
    color: #545454;
    font-size: 12px
}

.BoxArea .View .content-area .widget-area>.widget-list>.widget-item>.widget>.count {
    font-size: 11px;
    color: #8a8a8a;
    margin-top: 7px
}

.BoxArea .View .content-area .widget-area>.widget-list>.widget-item>.widget>.price {
    font-size: 15px;
    color: #ee0f22;
    font-weight: 600
}

.BoxArea .View .content-area .widget-area>.widget-list.blue-widget>.widget-item>.widget {
    background-color: #f0f9ff;
    border-color: #e2f3fe;
    color: #bfe3fc
}

.BoxArea .View .content-area .widget-area>.widget-list.blue-widget>.widget-item>.widget>.price {
    color: #0099f6
}

.BoxArea .View .content-area .widget-area>.widget-list.gray-widget>.widget-item>.widget {
    background-color: #f5f5f5;
    border-color: #f0f0f0;
    color: #d3d3d3
}

.BoxArea .View .content-area .widget-area>.widget-list.gray-widget>.widget-item>.widget>.price {
    color: #ff6632
}

.BoxArea .View .content-area .accepted-area {
}

.BoxArea .View .content-area .accepted-area>.Long {
    display: flex;
    position: relative;
    align-items: center;
    border-radius: 5px;
    background-color: #fbfbfb;
    border: 1px solid #efefef;
    padding: 15px 10px;
    padding-right: 50px;
    margin-bottom: 9px
}

.BoxArea .View .content-area .accepted-area>.Long::before {
    content: "\ea98";
    font-family: misszenne!important;
    position: absolute;
    right: 16px;
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    color: #e7e7e7;
    font-size: 38px
}

.BoxArea .View .content-area .accepted-area>.Long>.item {
    flex: 1
}

.BoxArea .View .content-area .accepted-area>.Long>.item p {
    font-size: 13px;
    font-weight: 600
}

.BoxArea .View .content-area .accepted-area>.Long>.item .count {
    font-size: 11px;
    color: #909090
}

.BoxArea .View .content-area .accepted-area>.Long>.item .num {
    color: #ff6632;
    font-weight: 700;
    margin-top: -3px
}

.BoxArea .View .content-area .accepted-area>.Small {
    display: flex
}

.BoxArea .View .content-area .accepted-area>.Small>.column {
    flex: 1;
    margin-right: 8px
}

.BoxArea .View .content-area .accepted-area>.Small>.column:last-child {
    margin-right: 0
}

.BoxArea .View .content-area .accepted-area>.Small>.column>.item {
    text-align: center;
    padding: 9px 4px 12px;
    border: 1px solid #ebebeb;
    border-radius: 5px;
    -webkit-box-shadow: inset 0 0 13px 2px rgba(241,241,241,.6);
    -moz-box-shadow: inset 0 0 13px 2px rgba(241,241,241,.6);
    box-shadow: inset 0 0 13px 2px rgba(241,241,241,.6)
}

.BoxArea .View .content-area .accepted-area>.Small>.column>.item>.icon {
    font-size: 24px;
    color: #c7c7c7
}

.BoxArea .View .content-area .accepted-area>.Small>.column>.item>.T {
    font-size: 10px;
    color: #f66633;
    font-weight: 500;
    padding-bottom: 8px;
    margin-bottom: 5px;
    position: relative;
    line-height: 12px;
    margin-top: 2px
}

.BoxArea .View .content-area .accepted-area>.Small>.column>.item>.T::after {
    content: "";
    position: absolute;
    bottom: 0;
    height: 1px;
    width: 50%;
    background-color: #ebebeb;
    left: 50%;
    transform: translateX(-50%)
}

.BoxArea .View .content-area .accepted-area>.Small>.column>.item>.txt {
    font-size: 14px;
    font-weight: 600;
    color: #f77244;
    line-height: 16px
}

.BoxArea .View .content-area .accepted-area>.Small>.column>.item>.txt>span {
    display: block
}

.BoxArea .View .content-area .accepted-area>.Small>.column>.item>.txt>span:first-child {
    font-size: 10px;
    color: #7b7b7b
}

.BoxArea .View .content-area .supply-area {
}

.BoxArea .View .content-area .supply-area>.Long {
    display: flex;
    position: relative;
    align-items: center;
    border-radius: 5px;
    background-color: #fbfbfb;
    border: 1px solid #efefef;
    padding: 10px 0;
    margin-bottom: 9px;
    justify-content: space-between
}

.BoxArea .View .content-area .supply-area>.Long>.item {
    border-right: 1px dashed #d2d2d2;
    padding: 0 10px;
    flex: 1 auto
}

.BoxArea .View .content-area .supply-area>.Long>.item:last-child {
    border: 0
}

.BoxArea .View .content-area .supply-area>.Long>.item p {
    font-size: 10px;
    font-weight: 600
}

.BoxArea .View .content-area .supply-area>.Long>.item .num {
    color: #ff6632;
    font-weight: 700;
    font-size: 12px
}

.BoxArea .View .content-area .supply-area>.Small {
    display: flex
}

.BoxArea .View .content-area .supply-area>.Small>.column {
    flex: 1;
    margin-right: 8px
}

.BoxArea .View .content-area .supply-area>.Small>.column:last-child {
    margin-right: 0
}

.BoxArea .View .content-area .supply-area>.Small>.column>.item {
    text-align: center;
    padding: 9px 4px 12px;
    border: 1px solid #ebebeb;
    border-radius: 5px;
    -webkit-box-shadow: inset 0 0 13px 2px rgba(241,241,241,.6);
    -moz-box-shadow: inset 0 0 13px 2px rgba(241,241,241,.6);
    box-shadow: inset 0 0 13px 2px rgba(241,241,241,.6)
}

.BoxArea .View .content-area .supply-area>.Small>.column>.item>.icon {
    font-size: 24px;
    color: #c7c7c7
}

.BoxArea .View .content-area .supply-area>.Small>.column>.item>.T {
    font-size: 10px;
    font-weight: 500;
    padding-bottom: 8px;
    position: relative;
    line-height: 12px;
    margin-top: 2px
}

.BoxArea .View .content-area .supply-area>.Small>.column>.item>.txt {
    font-size: 13px;
    font-weight: 600;
    color: #f66633;
    line-height: 16px
}

.grid-stack-item .BoxArea .View {
    justify-content: flex-start
}

.grid-stack-item .BoxArea .View .tab-head .tab-list li .st {
    font-size: 14px;
    font-weight: 700;
    color: #5a5e9a;
    text-transform: uppercase
}

.grid-stack-item .BoxArea .View .tab-head .tab-list li .N {
    font-size: 12px;
    font-weight: 600;
    color: #5a5e9a
}

.grid-stack-item .BoxArea .View .tab-head .tab-list li.active {
    background: #5a5e9a
}

.grid-stack-item .BoxArea .View .tab-head .tab-list li.active .st,.grid-stack-item .BoxArea .View .tab-head .tab-list li.active .N {
    color: #fff
}

.grid-stack-item .BoxArea .View .dashboard-table thead th {
    background-color: #fff
}

.grid-stack-item .BoxArea .View .dashboard-table tbody td {
    background-color: #fff;
    color: #5a5e9a;
    font-size: 12px;
    font-weight: 400;
    text-align: left
}

.grid-stack-item .BoxArea .View .dashboard-table tbody td.bg_blue {
    background-color: #5a5e9a!important
}

.grid-stack-item .BoxArea .View .tab-content {
    height: calc(100% - 70px)
}

.grid-stack-item .BoxArea .View .tab-content .tab-container {
    height: 100%
}

.grid-stack-item .BoxArea .View .tab-content .tab-container .table-responsive {
    height: 100%
}

body.New .RequestSearchView thead {
    position: sticky;
    top: 0;
    z-index: 1
}

body.New .RequestSearchView tr[F='1'] td:first-child {
    box-shadow: inset 6px 0 0 0 #03a9f4
}

.FileView .List table {
    width: 100%
}

.FileView .List table>tbody {
    width: 100%
}

.FileView .List table>tbody>tr {
    width: 100%;
    cursor: pointer;
    position: relative
}

.FileView .List table>tbody>tr>td {
    width: 100%;
    padding: 8px;
    background: #fff!important;
    border-bottom: 4px solid #fafafa;
    box-shadow: inset 0 -1px 0 0 #c3c3c3,inset 0 1px 0 0 #c3c3c3;
    cursor: pointer
}

.FileView .List table>tbody>tr>td:first-child {
    border-radius: 12px 0 0 12px;
    box-shadow: inset 0 -1px 0 0 #c3c3c3,inset 0 1px 0 0 #c3c3c3,inset 1px 0 0 0 #c3c3c3
}

.FileView .List table>tbody>tr>td:last-child {
    border-radius: 0 12px 12px 0;
    box-shadow: inset 0 -1px 0 0 #c3c3c3,inset 0 1px 0 0 #c3c3c3,inset -1px 0 0 0 #c3c3c3
}

.FileView .List table>tbody>tr:hover>td {
    background: #f1f1f1!important
}

.ModalError {
    position: fixed;
    left: 0;
    top: 0;
    background: 0 0;
    width: 100%;
    height: 100%;
    z-index: 99999999
}

.ModalError>.Overflow {
    position: absolute;
    left: 0;
    top: 0;
    background: #53535370;
    width: 100%;
    height: 100%;
    pointer-events: none
}

.ModalError>.Content {
    position: absolute;
    background: #fff;
    border: 1px solid #e5e5e5;
    box-shadow: 0 17px 23px -24px #000;
    padding: 9px 10px;
    border-radius: 13px;
    font-size: 12px;
    color: #430000;
    z-index: 9;
    width: max-content;
    max-width: 340px
}

.ModalError.Success>.Content {
    color: #1f5813
}

.ModalError>.Content>.BtnList {
    display: flex;
    justify-content: flex-end;
    margin: 5px 0 0
}

.ModalError>.Content>.BtnList>.BtnCancel {
    background: #efefef;
    padding: 4px 12px;
    border-radius: 4px;
    color: #919191;
    cursor: pointer
}

.ModalError>.Content>.BtnList>.BtnCancel:hover {
    background: #dcdcdc
}

.ModalError>.Content>.BtnList>.BtnResume {
    background: #bf2424;
    color: #fff;
    padding: 4px 12px;
    border-radius: 4px;
    margin-left: 5px;
    cursor: pointer
}

.ModalError>.Content>.BtnList>.BtnResume:hover {
    background: #6f0b0b
}

.ModalError.Success>.Content>.BtnList>.BtnResume {
    background: #33bf24
}

.ModalError.Success>.Content>.BtnList>.BtnResume:hover {
    background: #0b5806
}

.NewProductRequest .control-panel>.column .control-item {
    width: 100%;
    display: flex
}

.NewProductRequest .control-panel>.column .control-item .Btn.cancelFileBtn {
    background: #ffe6e6;
    border-radius: 4px;
    margin-right: 5px;
    line-height: 33px;
    padding: 0 10px;
    display: flex;
    align-items: center;
    gap: 10px;
    width: fit-content;
    border: 0;
    position: relative
}

.NewProductRequest .control-panel>.column .control-item .Btn.cancelFileBtn:hover {
    background: #ffe6e6
}

.NewProductRequest .control-panel>.column .control-item .Btn.cancelFileBtn>i {
    line-height: 33px;
    font-size: 16px;
    color: red
}

.NewProductRequest .control-panel>.column .control-item .Btn.cancelFileBtn>span {
    color: red;
    top: 0
}

.NewProductRequest .control-panel>.column .control-item .Btn.cancelFileBtn:hover {
    background: red
}

.NewProductRequest .control-panel>.column .control-item .Btn.cancelFileBtn:hover i {
    color: #fff
}

.NewProductRequest .control-panel>.column .control-item .Btn.cancelFileBtn:hover span {
    color: #fff
}

.nonPointer {
}

.NewProductRequest .control-panel>.column .control-item .Btn.saveFileBtn {
    background: #cfecd1;
    border-radius: 4px;
    margin-right: 5px;
    line-height: 22px;
    padding: 0 10px;
    display: flex;
    align-items: center;
    gap: 10px;
    width: fit-content;
    border: 0;
    position: relative
}

.NewProductRequest .control-panel>.column .control-item .Btn.saveFileBtn>i {
    line-height: 33px;
    font-size: 16px;
    color: #4a4a4a
}

.NewProductRequest .control-panel>.column .control-item .Btn.saveFileBtn>span {
    color: #4a4a4a;
    top: 0
}

.NewProductRequest .control-panel>.column .control-item .Btn.saveFileBtn:hover {
    background: #6eb021
}

.NewProductRequest .control-panel>.column .control-item .Btn.saveFileBtn:hover i {
    color: #fff
}

.NewProductRequest .control-panel>.column .control-item .Btn.saveFileBtn:hover span {
    color: #fff
}

.AddItemSuccess {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 0;
    height: 0;
    opacity: 0;
    border-radius: 100%;
    background: #2fbd35;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    transition: all .3s
}

.AddItemSuccess.Active {
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 1;
    border-radius: 0;
    transition: all .3s
}

.FileView.ErpBuying .List table>tbody>tr:nth-child(1)>td {
    background: #f8f4cf!important
}

.FileView.ErpBuying .List table>tbody>tr:nth-child(2)>td {
    background: #fcf9df!important
}

.FileView.ErpBuying .List table>tbody>tr:nth-child(3)>td {
    background: #fffded!important
}

.FileView.ErpBuying .List table>tbody>tr:nth-child(4)>td {
    background: #fffded8f!important
}


body.fastReport .control-panel .column:nth-child(1){display: none;}
body.fastReport .v2Table-container{top:120px}
body.fastReport table tr.sH:nth-child(1){ position: sticky;top: 0;}
    
@media only screen and (max-width: 768px) {
    body.New .webSupplyContainer {
        padding:0 16px
    }

    body.New .webSupplyContainer.PL0 {
        padding-left: 0
    }

    body.New .webSupplyContainer.PR0 {
        padding-right: 0
    }

    body.New .webSupplyContainer .webSupply-item {
        padding: 0
    }

    body.New .webSupplyContainer .webSupply-item::after {
        background: 0 0;
        border: 0
    }

    body.New .webSupplyContainer .webSupply-item>.item-body {
        background: linear-gradient(178deg,#7db3ff,#bee0ff);
        border: 0;
        overflow: hidden;
        margin-bottom: 14px;
        z-index: 1;
        position: relative
    }

    body.New .webSupplyContainer .webSupply-item>.item-body>.Info>.item-title {
        color: #061d8f
    }

    body.New .webSupplyContainer .webSupply-item>.item-body>.Info>.item-count {
        color: #061d8f
    }

    body.New .webSupplyContainer .webSupply-item>.item-body>div {
        position: relative;
        z-index: 2
    }

    body.New .webSupplyContainer .webSupply-item>.Bg {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        overflow: hidden;
        background: linear-gradient(178deg,#7db3ff,#bee0ff);
        border-radius: 10px;
        opacity: 1;
        z-index: 0
    }

    body.New .PageView_v2 .control-panel {
        padding-bottom: 16px!important
    }

    body.New .PageView_v2 .control-panel>.column .panel-title>.T>span {
        background: #fff;
        color: #000;
        padding: 0 4px;
        border-radius: 2px
    }

    .control-panel>.column .control-item.Full {
        width: 100%
    }

    .control-panel>.column .control-item.Full>.control-btn {
        width: 100%;
        display: flex;
        justify-content: center;
        border: 0!important
    }

    body.New .siparisDetay_Area {
        padding: 0;
        border: 0;
        margin: 0;
        margin-top: 16px
    }

    body.New .siparisDetay_Area .column.Left {
        padding: 16px;
        border: 1px solid #eee;
        background: #fff;
        border-radius: 8px
    }

    body.New .siparisDetay_Area .column.Right {
        padding: 16px;
        border: 1px solid #eee;
        background: #fff;
        border-radius: 8px
    }

    body.New .PageView_v2.OrderDetail {
        background: 0 0!important;
        padding: 60px 14px 0!important
    }

    body.New .ItemBox {
        float: left;
        width: 100%;
        display: flex;
        padding-bottom: 10px;
        border-bottom: 1px solid #42485826;
        margin-bottom: 10px;
        background: #fff;
        padding: 0;
        border-radius: 6px;
        overflow: hidden
    }

    body.New .ItemBox .Info {
        float: left;
        width: 100%;
        padding-left: 10px;
        padding: 16px;
        padding-bottom: 0
    }

    body.New .PageView_v2 .v2Table-container .v2Table-overflow .ItemBox .Info .SubItem span a {
        color: #000!important
    }

    body.New .ItemBox .Photo .Box {
        box-shadow: 0 0 0 1px #42485838;
        text-align: center;
        border-radius: 4px;
        margin: 5px;
        margin-top: auto;
        width: initial
    }
}