spliter {
    width: 10px;
    background: var(--highlight);
    height: 100%;
    flex-shrink: 0;
    z-index: 999;
    box-shadow: 0 0 0 1px var(--border-color);
}
spliter[horizontal] {width:100%; height:10px;}
[align='start'] {align-items:flex-start}
[backdrop] {backdrop-filter: blur(15px);background: linear-gradient(to bottom, var(--main-background) 0%,var(--main-light) 100%);box-shadow: inset 0px -1px 0 0px var(--outline),inset 0px 1px 0 0px var(--outline);}

separator[vertical][fit] {height:100%;}
/*[fixed] {position:fixed; bottom:0; top:auto;left:0;}
*/
[sticky] { position: -webkit-sticky; position: sticky; background: var(--main-background); left: 0; right: 0; z-index: 9999; top: 0; }
[sticky][level='2'] {
    top: var(--area);
}
[sticky][level='3']{top: calc(var(--area) + 40px);}

wrapper[row] {flex-direction:row;}

wrap[column] {display:flex; flex-direction:column;}

[minwidth] {min-width:200px;}
/**/
scroller[grid]{height:auto;}

wrap[display='none'] {display:none;}
[display='flex'] {display:flex;}
[align='center'] {align-items:center;}
[align='start'] {align-items:start;}
[justify='center'] {justify-content:center;}
[margin='left'] {margin-left:auto;}
[column] {flex-direction:column;}
[highlight] {background: var(--highlight);}

[margin='auto'] {margin:auto;}

[overflow='auto'] {overflow:auto;}
[overflow-x='hidden'] {overflow-x:hidden;}


[module-highlighter] {background-color:#ffb6c1}

[width='fit']{width:100%;}
[gap='5']{gap:5px;}
/**/
toolbar[accent] {
    padding: 0 20px;
}

toolbar[tab] {min-height:30px; /*padding:0 30px;*/ position:sticky; z-index:9999;}
toolbar[tab] ul[section] li{min-height:30px;border-radius:5px 5px 0 0; font-weight:normal;}
toolbar[tab] ul[section] li.selected {box-shadow:none;font-weight:bold;}

/*.load_cont toolbar[title] {position:sticky; z-index:9999; top:100px;}
*/
toolbar[title] text {padding-right: 10px; white-space:nowrap;}
toolbar[title] separator[horizontal] {margin: 0}
toolbar[border="no"] {box-shadow: none;}
toolbar[border="bottom"] {box-shadow: 0 1px 0 0 var(--border-color);}
toolbar[border="top"] {box-shadow: 0 -1px 0 0 var(--border-color);}
toolbar[userselect="all"] text {user-select: all;}

/**/
ul[section] {transition: .125s .225s;display: flex;flex: 1;align-items: center;position: relative;flex-shrink: 0;overflow: hidden;width: 100%;overflow: auto;overflow: overlay;scroll-snap-type: x mandatory;-webkit-overflow-scrolling: touch;/* scroll-padding-left: 20px; */scroll-behavior: smooth;}
ul[section] li {font-weight:bold;scroll-snap-align: start;list-style: none;min-height: var(--area);overflow: hidden;cursor: pointer;position: relative;overflow: hidden;box-shadow: inset 0 0px 0 0 var(--main-color);display: flex;align-items: center;white-space: nowrap;flex-shrink: 0;}
ul[section] li text {padding: 0 20px; }
ul[section] li:hover, ul[section] li:active {background-color: var(--hover);}
ul[section] li.selected {color: var(--main-color); background-color:#fff; font-weight:bold; box-shadow: inset 0 -2px 0 0;}
ul[section] li[disabled] {opacity:0.5;} 

/**/

segment { background-color:var(--main-color); color:#fff; padding:0 15px 15px; display:flex; flex-direction:column;}
segment[highlight] {background:rgba(107, 0, 33, .5);}

action[info] > group text {margin:0 5px;}
/*action[info] > group {margin:0 5px;}
*/action[info] badge[filled] { box-shadow: none; background:rgba(255,255,255, .15);  color:#fff; padding: 5px 10px; }
action[info] separator[vertical] {height:15px;}
action[info] dot {padding:0;}
action[info='highlight'] > group {line-height:30px; box-shadow: 0 0 0 1px var(--border-color); border-radius:5px;; background-color:#f3f3f3; padding:0 5px;}
/*data_read*/

cont[data='read'] {cursor:text;margin:15px 10px;} 
cont[data='read'] decor border {box-shadow: inset 0 -1.52px 0 0;border-radius: 0;clip-path: none;}
cont:hover input:disabled ~ decor border {opacity:.25}
cont[data='read']  decor label {/*opacity:.5;*/ padding:0; font-weight:bold;}

cont[data='read'] input[type="text"], cont[data='read'] decor label text span{padding:0;}
/**/
toolbar[info] {min-height:100px;}

/*no_header*/

.window_container > div.no_header > div > header {display:none;}
.window_container > div.load > div { border-radius: 15px; }



/**/

/*.load_cont toolbar[tab] {top:60px;}
*/scroller content{overflow:visible;}
/**/
content.selected {
    display: flex;
}
content {display: none;width: 100%;flex-direction: column;flex-shrink: 0;flex:1;overflow:hidden;}
content > wrapper {display:flex; flex-direction:column; height:100%; padding:10px 20px; overflow:initial; box-shadow:none;}
/**/
separator ~ [checkbox] {margin-left:10px;}

/**/
text[bold] {font-weight:bold;}
text[space] {letter-spacing:4px;}


/**/
scroller {-webkit-user-select: none;display: flex;overflow-y:overlay; overflow-x:hidden;flex-direction:column;height:100%;}
dot {padding: 0 10px;font-weight: 700;}
dot::after {content: "\00b7";}

/**/
block[question] td {height:50px; padding:0 10px; }
block[question] tr:not(:first-child), block[question] tr:not(:last-child) { box-shadow: 0 1px 0 0 var(--border-color); }

/**/
[view="grid"][account]{padding:0;}
[account] block {
    float: left;
    padding: 10px;
    box-sizing: border-box;
    position: relative;
    position: relative;
    overflow: hidden;
    z-index: 1;
    border-radius: 5px;
}
[account] block item {display: flex;
    flex-direction: column;
    height: 100%;
    box-shadow: 0 0 0 1px var(--border-color); padding:0 20px 5px 20px;
    border-radius: 5px;
    overflow: hidden;
    z-index: 1;}

[account][view="grid"] {
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    grid-gap: 50px;
}
/*[account] block:hover {box-shadow: var(--elevation);}*/
[account] block title {
    display: flex;
    padding: 5px 0;
}
[account] block group {flex-wrap:nowrap;display:flex; align-items:center;}
[account] block group text {white-space:nowrap; }


[account][hover='no'] block:hover {box-shadow:0 0 0 1px var(--border-color);}

[dot] {border-bottom: 1px dashed #e4e4e4;height: 1px;width: 100%;margin:0 10px;}

.sections [account] {margin:5px; pointer-events:none;}


[view="grid"] {grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); display: grid;grid-gap: 20px;padding: 20px;}

list[horizontal] {overflow-y: hidden;overflow-x: auto;height: 100%;padding: 30px;overflow: overlay;scroll-snap-type: x mandatory;-webkit-overflow-scrolling: touch;scroll-padding-left: 30px;scroll-behavior: smooth;min-height: 200px;}

list {position: relative;z-index: 2;padding: 10px;width: 100%;display: flex;min-height: 100px;align-items: flex-start;}
list[horizontal] > wrap {width: auto;height: 100%;display: flex;padding: 0;flex: 1;float: left;}



/*input filled*/
cont[filled] decor {border-radius: 4px 4px 0 0;background:rgba(0,0,0, .05);}
cont[filled]:hover decor{background:rgba(0,0,0, .07);}
cont[filled] decor border {box-shadow: 0 1px 0 0; border-radius:0; clip-path:none;}
cont[filled] decor label line {box-shadow:none;}
cont[filled] input:placeholder-shown ~ decor label text wrap {
    transform: none;
}

cont[filled] input:focus ~ decor label text wrap, cont[filled] textarea:focus ~ decor label text wrap {
    transform: translateY(-20%) scale(0.8);
    opacity: 1;
}
cont[filled] [class*="ant"] ~ decor label text wrap {
    transform: none;
}
cont[filled] .hasValue ~ decor label text wrap {
    transform: translateY(-20%) scale(0.8)
}
cont[filled] input:focus ~ decor {
    background: rgba(0,0,0, .07)
}
cont[filled] input:-webkit-autofill ~ decor label text wrap {
    transform: translateY(-20%) scale(0.8);
}
cont[filled] decor label text wrap {
    transform: translateY(-20%) scale(0.8)
}


cont[filled] [class*="focused"] ~ decor label text wrap { transform: translateY(-20%) scale(0.8); opacity:1;}


cont[filled] .ant-select-single .ant-select-selector .ant-select-selection-item {padding:10px 0 0 }
cont[filled] input[type="text"], cont[filled] input[type="password"], cont[filled] textarea[placeholder], cont[filled]> .ant-picker, cont[filled] > .ant-input-number{padding:5px 15px 0;}
cont[filled] decor label text wrap {transform-origin:left top}
cont[filled][no='label'] input[type="text"]{padding:0 15px;}
cont[filled] input.input-validation-error ~ decor, cont[filled] .input-validation-error ~ decor {color:var(--error-color); background-color:rgba(255, 99, 71, .05)}
cont[filled]:hover [class*="disabled"] ~ decor, cont[filled] [class*="disabled"] ~ decor, cont[filled] input[disabled] ~ decor,  cont[filled] textarea[disabled] ~ decor {background:rgba(255,255,255, .03);}
/*cont[filled] [class*="disabled"], cont[filled] [class*="disabled"] decor label{opacity:.7}
*/cont[filled] [class*="disabled"] ~ decor border, cont[filled] textarea[disabled] ~ decor border, cont[filled] input[disabled] ~ decor border{opacity:.1; box-shadow:inset 0 0 0 1px;}
/*  cont[filled] [class*="disabled"] ~ decor wrap, cont[filled] textarea[disabled] ~ decor wrap, cont[filled] input[disabled] ~ decor wrap, cont[filled] input[disabled], cont[filled] [class*="disabled"] {opacity:.6;}
*/

cont[filled] .ant-picker-suffix {margin-top:-5px;}
/*cont input:focus ~ decor label text wrap {
    transform: translateY(-20%) scale(0.75);
}
*/
/*cont decor label text wrap {transform:none;}*/
/*cont [class*="ant"] ~ decor label text wrap {
    transform: none;
}*/
/**/
/*wrapper[credit='check'] {overflow:overlay;}
wrapper[credit='check'] toolbar[sticky], wrap[credit] > wrap {
    top: 40px;
}*/
wrap[credit] {
    min-width: 430px;
    position: relative;box-shadow:-1px 0 0 0 var(--border-color); margin-left:23px; padding:0 10px 0 20px;
}
wrap[scroll] {overflow:overlay;}

[group='tables'] {background-color:rgb(211 211 211 / 15%); padding:20px;}

/**/

/*.button.cancel{background:#7f7f7f;color:#fff;margin:0 5px;}*/
.button.delete {background: #ff644e;color: #fff;margin: 0 5px;}
.button.deny {background: #ff644e;color: #fff;margin: 0 5px;}
/*.button.deny {background: #ed7d31;color: #fff;margin: 0 5px;}*/
.button.creditrequest {background: #00c478;color: #fff;margin: 0 5px;}
.button.cod{background:#ffc000; color:#fff;margin:0 5px;}
.button.approve{background:#00c478;color:#fff;margin:0 5px;}
.button.consignment {background:#4472c4;color:#fff;margin:0 5px;}



wrapper[grid] {flex-direction:row; /*padding:0 30px;*/box-shadow:none; overflow:overlay;}
wrapper[grid] > wrap {min-width:300px; max-width:300px; min-height:500px;}

[status='open'] {display: flex;min-height: 35px;align-items: center;justify-content: center;font-weight: bold;margin: 7px;border-radius: 5px;box-shadow: 0 0 0 1px #e4e4e4;}
/**/


group[radio='ant'] {margin:5px 10px;}
group[fit] {width:100%;}

[report] .form_container {padding: 10px;white-space: normal;position: relative;max-height: 100%;min-width: 260px;min-height: 120px; height:auto; flex:none;}


.form_container[scroll='no'] {height:auto; overflow:initial; flex:auto; min-height:auto;}


[header='multi'] .ant-table-thead > tr > th {height:30px;}
[header='multi'] .ant-table-thead tr th {border-right:1px solid #e5e5e5}
[header='multi'] .ant-table-thead > tr > th:not(:last-child):not(.ant-table-selection-column):not(.ant-table-row-expand-icon-cell):not([colspan])::before {width:0;}

[row='space'] .ant-table-tbody > tr > td {padding:10px}

[padding='none'] .ant-table-expanded-row > td {
    padding: 0;
}


.chat icon {
    color: var(--main-color);
}
.bell icon {color:tomato;}
tr.selected {font-weight:bold;}
/**/
.canceled_cont {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 60px;
    padding-bottom: 60px;
}

toolbar wrap[notification] tip {
    position: absolute;
    top: 0px;
    right: 10px;
    pointer-events: none;
    background: #ef5350;
    color: #fff;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9;
    height: 19px;
    padding: 0 5px;
}
view[notification] {
    width: 520px;
    max-height: 800px;
    overflow-y: auto;
    overflow-y: overlay;
    border-radius: 10px;
    overflow-x: hidden;
    display: flex;
    background: #fff;
    box-shadow: 0 50px 110px -20px rgba(0,0,0,.3), 0 0 0 1px var(--border-color);
    -webkit-overflow-scrolling: touch;
    transform: translateY(-10px);
    transition: .125s;
}
.list_view_wrapper{height:100%; width:100%;  display:flex; flex-direction:column;overflow: hidden;  justify-content: space-between;     position:relative;  flex:1;}

list{position: relative; z-index: 0; padding: 10px;  overflow-y: auto; /*overflow-y: overlay;*/ -webkit-overflow-scrolling: touch; width:100%; overflow-x:hidden  }

.notification_list {display: grid;grid-template-columns: repeat(auto-fill, minmax(100%, 1fr));grid-auto-rows: 1fr; width:100%;}

block[list]{width: 100%;box-shadow: 0 -1px 0 0 var(--border-color);}
block[list]:first-child{box-shadow:none}

block[list] item{display:flex;position:relative;align-items:center;}
block[list] item media{width:50px; flex-shrink:0}
block[list] item media[wide]{width:70px}
block[list] item detail{padding:0 0 0 10px;justify-content:center}
block[list] item detail[space]{padding:0 10px}
block[list] item  action .hide{opacity:0;}

block[list]:hover {
    background-image: var(--over-color);
    box-shadow: 0 0 0 1px var(--border-color);
    background-color: var(--background);
}

block item thumb[ratio='1:1']{padding-bottom:100%;} /* square */
block[list] item thumb[round]{border-radius: 25px; position: relative;
    width: 100%;
    height: 0;
    display: flex;overflow: hidden;}
block item thumb wrap[accent] {background: #4e87de;background: var(--main-color);}
block indicate{position:absolute;left:0; top:0; box-shadow:0 0 0 3px var(--background); width:10px;height:10px;border-radius:50px; z-index:5 ; background-color:#ef5350}

block[list]{float: left;padding: 10px;box-sizing: border-box;position: relative;width: 180px;position:relative;overflow:hidden;z-index:1; width:100%;} 

block item thumb wrap {position: absolute;width: 100%;height: 100%; overflow: hidden;background:linear-gradient(to top, rgba(0,0,0,.05) 0%,rgba(0,0,0,.05) 100%);background: var(--over-color);}
block item thumb wrap > icon {
    position: absolute;
    width: 100%;
    height: 100%;
    margin: auto; color:#fff;
}


[display='grid'] group[form] {display:grid; grid-template-columns:120px 150px 150px 150px;}
.tooltip_grid {background-color:#fff;}

[cursor='pointer'] {cursor:pointer;}

/*Dashboard*/

[dashboard] { display: flex; height: 100%; width: 100%; flex-direction: column; overflow: auto; -webkit-overflow-scrolling: touch }

[dashboard][mini] { height: auto; overflow: hidden; flex-shrink: 0; box-shadow: 0 0 0 1px var(--border-color); background: var(--highlight) }
[dashboard][mini] item:hover { box-shadow: 0 0 0 1px var(--border-color); }

[dashboard] > separator[horizontal] { margin: 0 30px; }
/*dashboard:after { content: ""; height: 25%; display: flex; flex-shrink: 0 }*/
[dashboard] header { display: flex; width: 100%; height: 60px; display: flex; align-items: center; padding: 0 15px; }
[dashboard] header text { padding: 0 15px; font-size: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
[dashboard] > wrap { display: grid; width: 100%; flex-shrink: 0; padding: calc(var(--area) / 2); flex-wrap: wrap; grid-gap: 10px; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }

[dashboard] > wrap[template="large"] { grid-template-columns: repeat(auto-fill, minmax(100%, 1fr)); }

@media(max-width:700px) {

    [dashboard] > wrap { grid-template-columns: repeat(auto-fill, minmax(100%, 1fr)); }

}



[dashboard]{display: flex;height: 100%;width: 100%;flex-direction: column;overflow: auto;-webkit-overflow-scrolling: touch;}

item[dwidget] { z-index: 1; transition: box-shadow .125s; position: relative;  background: var(--background); box-shadow: 0 0 0 1px var(--border-color); overflow: hidden; display: flex; flex-direction: column;  height: 210px; width: 100%; border-radius: 20px; /*flex: 1 1 320px;*/ cursor:pointer; margin-bottom: 10px}



item[dwidget]:hover { box-shadow: 0 50px 110px -20px rgba(0,0,0,.3), 0 0 0 1px var(--border-color); z-index: 2; }


item[dwidget] > wrap { display: flex; width: 100%; height: 100%; background: var(--background); overflow: hidden; align-items: center; position: relative; }
item[dwidget] > info { padding: 20px 20px 0 20px; flex-direction:row;gap:5px;color: var(--main-color);}


[dashboard] item[accent] { background: var(--main-color); color: #fff; }
[dashboard] item count { font-size: 50px; font-weight: 700; font-family: Roboto }
[dashboard] item > text { margin-top: 10px; }



[dwidget] wrap item[large] { height: auto; width: 100%; flex: 1 }
[dwidget] wrap item[extra] { height: auto; width: 100%; flex: 1 1 100% }

/**/


th.ant-table-cell.dark {
    background: #bfbfbf;
    border-top: 1px solid #b2b2b2;
}
th.ant-table-cell.light {
    background: #d0d0d0;
    border-top: 1px solid #c4c4c4;
}

.ant-tooltip-arrow-content {
    background-color: #fafafa !important;
}
/*.canceled_cont img {width:470px;}
*/ /*scroll   */
::-webkit-scrollbar-track {
    display: none
}

 ::-webkit-scrollbar { width: 10px; height: 10px; background-color: transparent; }

 ::-webkit-scrollbar-thumb { background-color: rgba(136, 136, 136, 0.3); background-clip: padding-box; height: 40px; width: 40px;  }

 :hover::-webkit-scrollbar-thumb { }

 ::-webkit-scrollbar-thumb:hover { border: none; }

 ::-webkit-scrollbar-button { display: none }

 ::-webkit-scrollbar-corner,
 ::-webkit-resizer { background-color: transparent; }


 /*GURGEN*/
.button.carrier_equipment_call1 { background-color: red; color: #fff; min-width: 140px; max-width: 140px;}
.button.carrier_equipment_call2 { background-color: #4472c4; color: #fff; min-width: 140px; max-width: 140px; }
.button.carrier_equipment_tempcover_extend {background-color: skyblue; min-width: 140px; max-width: 140px;}
.button.carrier_equipment_tempcover_aprove { background-color: #c3f7c7; min-width: 140px; max-width: 140px;}
.button.carrier_equipment_tempcover_deny {background-color: #ff8f8f; min-width: 140px; max-width: 140px;}
.button.carrier_equipment_tempcover_cancel { color: black; background-color: lightgray; min-width: 140px; max-width: 140px;}