@import url("taskbar.css");
@import url("./customElements/style.css");
@import url("win.css");
@import url("modal.css");
@import url("shadow.css");
@import url("netMsg.css");
@font-face {
	font-family:"Play";
	src: local("Play"), 
		url("/fonts/play/play.woff2") format("woff2"),/*Modern Browsers*/
		url("/fonts/play/play.woff") format("woff"), /*Modern Browsers*/
		/*url("/fonts/play/play.otf") format("opentype"), /*Open Type Font*/
		/*url("/fonts/play/play.svg") format("svg"), /*Legacy iOS*/
		url("/fonts/play/play.ttf") format("truetype"); /*Safari, Android, iOS*/		
	unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; /*cyrillic*/
	font-weight:normal;
	font-style:normal
}
@font-face {
font-family:"TermCyr"; 
src: url("/fonts/term_cyr.ttf") format("truetype"); 
font-style:normal; 
font-weight:normal 
}
:root {
--tsk-height:30px;
}
html {
width:100vw;
height:100vh;
/*overflow-x:hidden*/
}
body {
margin:0;
height:100%;
overflow:hidden;
background:url(/images/bg.gif);
}
/*body:after {z-index:10;
	content: "";
	position: fixed;
	top: 0; bottom: 0; left: 0; right: 0; 
	background: rgba(0, 0, 0, 0.4);
	pointer-events: none;
}*/
/*body > footer {
	position: sticky;
	top: 100vh;
}*/
button:not(:defined) {display:none}
c-select:not(:defined){display:none}
/*c-select:unresolved {display:none}*/
p{margin:0}
input {outline:none}
.center {text-align:center}
.t-right {text-align:right}

.medium {line-height:13px; font-size:8pt}
.small {line-height:12px; font-size:7pt}
.smaller {line-height:10px; font-size:6pt}

.border {border:1px solid black}
.border2x {border:2px solid black}

.mask {
position:fixed;
width:100%;
height:100%;
z-index:5;
background:rgba(131, 100, 40, 0.3)
}
#screenSaver {z-index:10}

#page-wrap {
position:relative;
display:grid;
grid-template-columns:minmax(40px, auto) 1fr 170px;
grid-template-rows:30px 1fr 30px;
margin:0 auto;
padding:0;
max-width:1260px;
width:1260px;/*1260px*/
min-height:100%;
background:none repeat scroll 0 0 #fff;
font:14px/18px "Times New Roman",Times,serif;
overflow:hidden;
transition:transform 0.5s
}
#tline {
position:relative;
grid-column:1/4;
grid-row:1;
height:30px;
background: linear-gradient(to  bottom right, #9bd6b6, #071d12);
}
.menu-toggle {
position:relative;
padding:0;
width:30px;
height:30px;
left:10px;
color:#ccd9e5;
background:#23313f;
border:none;
cursor:pointer;
transition:all 0.3s ease-in-out
}
.menu-toggle:hover {color:aliceblue;}
.menu-toggle:active {padding-left:2px;}
.menu-toggle:before {
content:"≡";/*"\2261";*/
font: 2em "arial"
}
.menu-toggle:after {
content:"";
position:absolute;
top:50%;
margin-top:-3px;
left:-8px;
border-width:5px 6px 5px 0;
border-style:solid;
border-color:transparent #17577c;
opacity:0;
transition:all 0.2s ease-in
}
.menu-toggle.open {
left:180px;
color:#2978a5
}
.menu-toggle.open:after {opacity:1}
#preloader {
position:absolute;
display:none;
top:3px;
right:6px;
z-index:11
}
#pBox {display:flex;/* flex-direction:row-reverse;*/
position:absolute;
top:0;
right:30px;
gap:5px;
color:#fff;
line-height:30px
}
.msg {
color:#68bdd6;
cursor:pointer
}
.msg svg {
position:relative;
margin-right:5px;
top:3px
}
.msg span {
color:#9fd668;
font-size:14px;
animation:none
}
.msg.on span { animation:blink 1s linear infinite }
@keyframes blink {
0% {color:#9fd668}
50% {color:#FBB}
100% {color:#f8fdf5}
}
.ddBox {
position:relative;
display:inline-block;
padding-left:5px;
width:100px;
z-index:4;
/*border-radius:5px;
box-shadow:0 1px 0 rgba(0,0,0,0.2);*/
cursor:pointer;
transition:all 0.3s ease-out
}
.ddBox:after {/* Little arrow */
content:"";
position:absolute;
top:50%;
right:5px;
border-width:5px 5px 0 5px;
border-style:solid;
border-color:#4cbeff transparent
}
.ddBox .dropdown {
position:absolute;
margin:0;
padding-left:0;
left:0;
right:0;
background:#fff;
border-radius:0 0 5px 5px;
border:none;
border-bottom:none;
list-style:none;
transition:height 0.3s ease-out;
max-height:0;
overflow:hidden
}
.ddBox a {
display:inline-block;
padding-left:4px;
box-sizing:border-box;
width:100%;
text-decoration:none;
color:#333;
transition:all 0.3s ease-out;
border-bottom:1px solid #e6e8ea
}
.ddBox .dropdown li:last-of-type a {
border:none
}
.ddBox .dropdown svg {
margin-right:8px;
position:relative;
top:3px
}
.svg-icon {
width:15px;
height:15px;
fill:currentColor
}
.svg-remove {
width:13px;
height:13px;
fill:currentColor
}
/*[class^="icon-"]:before, [class*=" icon-"]:before {}*/
.ddBox .dropdown li:hover a {
color:#57a9d9
}
.ddBox:hover {
background:rgba(76, 190, 255, 0.15);
color:white
}
.ddBox.active {
border-radius:5px 5px 0 0;
background:rgba(76, 190, 255, 0.31);
box-shadow:none;
border-bottom:none;
color:white
}
.ddBox.active:after {
border-color:#82d1ff transparent
}
.ddBox.active .dropdown {
max-height:min-content;
border:1px solid rgba(0,0,0,0.2);
border-top:none
}
.sidebar {
position:absolute;
grid-column:1;
grid-row:2/3;
height:100%;
z-index:4
}
.lnav {
display:flex;
flex-direction:column;
justify-content:space-between;
width:40px;
height:100%;
overflow:hidden;
background:#293949;
cursor:pointer;
transition:all 0.3s ease-in-out
}
.lnav.open {
width:210px;
}
.lnav ul,
.lnav ul ul {
margin:0;
padding:0;
z-index:1
}
.lnav ul li {
min-height:30px;
list-style-type:none;
border-bottom:1px solid rgba(255, 255, 255, 0.05)
}
.lnav ul li:last-child {
border:none
}
.lnav ul li.active ul {
display:block
}
.lnav ul li a {
position:relative;
display:inline-block;
box-sizing:content-box;
width:230px;
line-height:30px;
padding:0 2px 0 10px;
background:#293949;
color:#aeb2b7;
text-decoration:none;
font-size:14px;
transition:all 200ms ease-in
}
.lnav ul li.active > a {
color:#61b3a2
}
.lnav:not(.open) ul li:hover a {
position:absolute
}
.lnav:not(.open) ul li.active ul {
display:none;
}
.lnav:not(.open) ul li.active:hover ul {
display:block;
padding-top:30px;
}
.lnav ul li a svg {
width:1.125em;
position:relative;
top:2px
}
.lnav ul li a:hover {
color:#1abc9c
}
.lnav ul li a span:first-of-type {
padding:0 5px 0 20px
}
.lnav ul li.sub-menu>a span:last-child {
position:absolute;
right:0;
width:35px;
font-size:12px;
}
.lnav:not(.open) ul li.sub-menu>a span:last-child {
left:10px;
}
.lnav:not(.open) ul li.sub-menu:hover>a span:last-child {
left:auto;
right:0;
}
/*.lnav ul li.active>a span:last-child::after {
display:block;
content:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 192 512'><path fill='rgb(26, 188, 156)' d='M25.1 247.5l117.8-116c4.7-4.7 12.3-4.7 17 0l7.1 7.1c4.7 4.7 4.7 12.3 0 17L64.7 256l102.2 100.4c4.7 4.7 4.7 12.3 0 17l-7.1 7.1c-4.7 4.7-12.3 4.7-17 0L25 264.5c-4.6-4.7-4.6-12.3.1-17z'/></svg>");
margin-top:3px
}*/
.lnav ul li.sub-menu>a span:last-child::before {
position:absolute;
display:block;
top:50%;
right:10px;
margin-top:-3px;
content:"\203A";
font-size:18px;
font-weight:bold
}
.lnav ul li:not(.one).active>a span:last-child::before {content:"\2039"}
.lnav ul li.sub-menu>a span:last-child::after {
position:absolute;
display:block;
top:50%;
right:5px;
margin-top:3px;
content:"\2193"
}
.lnav ul li:not(.one).active>a span:last-child::after {content:"\2191"}
.lnav ul ul {
display:none
}
.lnav ul ul li {
background:#23313f;
border-bottom:none
}
.lnav ul ul li a {
padding-left:10px;
color:#aeb2b7
}
#hcontent {
margin:0;
grid-column:2;
grid-row:2
}
#pages {
position:relative;
grid-row:2/3;
grid-column:2/4
}
button {cursor:pointer}
button svg {pointer-events:none}/*чтобы не срабатывало событие на svg*/
[hidden]{display:none !important}/*important повысить приоритет*/
/*.workpiece[hidden] {display:none}/*fix flex hidden*/

.flex-jb {display:flex; justify-content:space-between}
.flex-g {display:flex; gap:4px}

.cbtn {
display:flex;
width:24px;
height:24px;
justify-content:center;
align-items:center;
border:1px solid rgba(0, 0, 0, 0.1);
border-radius:2px;
background:rgba(0, 0, 0, 0.1)
}
.cbtn.add{color:green}
.cbtn.rem{color:rgb(134, 44, 44)}
.cbtn:hover {
border:1px solid rgba(0, 0, 0, 0.15);
background:rgba(0, 0, 0, 0.15)
}
.cbtn:active {
border:1px solid rgba(0, 0, 0, 0.15);
background:rgba(0, 0, 0, 0.15);
box-shadow:rgba(0, 0, 0, 0.175) 0px 3px 5px inset
}

/*input-details*/
input-details summary {
display:block;
padding-left:6px;
font-weight:bold;
white-space:nowrap;
overflow:clip;
text-overflow:ellipsis;
cursor:pointer
}
input-details details:not([open]) summary {cursor:row-resize}
input-details details[open] summary:before {content:'- '}
input-details details:not([open]) summary:before {content:'+ '}
input-details ul {
margin:0;
padding:0 0 0 4px;
list-style-type:none;
cursor:pointer
}
input-details ul li:hover {background: #ccd4dd}
input-details ul li:active {background: #a1caff}
/*input-details end*/
i-select {
width:195px;
--min-height:25px;
border:none;
border-bottom:1px solid gray
}
i-select a {
display:inline-block;
padding-right:2px;
box-sizing:border-box;
width:100%;
border-bottom:1px solid #e6e8ea;
font:16px/24px 'Times New Roman';
white-space:nowrap;
overflow:clip;
text-overflow:ellipsis
}
i-select li[slot] a {border:none}