:root {
	--main-bgcolor:#F8F8F8;
	--tab-head-bg:#A8A8A8;
	--tab-head-col:#FFFFFF;
	--tab-odd-bg:#F8F8F8;
	--tab-even-bg:#E0E0E0;
}



/* UL - FILTER */

div.filter-form {
	background-color:var(--tab-head-bg);
	color:var(--tab-head-col);
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	align-items:center;
	margin:8px 0px 8px 0px;
	padding:4px 2px 4px 2px;

}

div.filter-form .filter-apply {
	width:72px;
	flex-grow:0;
	flex-shrink:0;
	text-align:center;
}

div.filter-form .filter-apply input[type="submit"] {
 	display:inline-block;
	font-size:16px;
	border:none;
	border-radius:4px;
	padding:6px 9px;
	background-color:#336699;
	color:#FFFFFF;
	min-width:40px;
}

ul.filter {
	list-style-type:none;
	margin:0px;
	padding:0px;
	box-sizing:border-box;
	display:flex;
	flex-direction:row;
	align-items:stretch;
	justify-content:stretch;
	background-color:var(--tab-head-bg);
	color:var(--tab-head-col);
}

ul.filter-wrap {
	flex-wrap:wrap;
}


div.filter-form > div.filter {
	width: calc(100% - 90px);
	flex-grow:10;
}

div.filter-form ul.filter {
	width:100%;
}

div.filter-form ul.filter + ul.filter {
    border-top:1px solid var(--tab-head-col);
	margin-top:12px;
	padding-top:12px;
}

ul.filter > li {
	box-sizing:border-box;
	flex-grow:0;
	margin:0px;
	padding:2px;
/*	border:1px solid #F0F0F0;*/
}

ul.filter > li.fw5 {width:5%;}
ul.filter > li.fw7 {width:7%;}
ul.filter > li.fw8 {width:8%;}
ul.filter > li.fw10 {width:10%;}
ul.filter > li.fw15 {width:15%;}
ul.filter > li.fw20 {width:20%;}
ul.filter > li.fw25 {width:25%;}
ul.filter > li.fw30 {width:30%;}
ul.filter > li.fw35 {width:35%;}
ul.filter > li.fw40 {width:40%;}
ul.filter > li.fw45 {width:45%;}
ul.filter > li.fw50 {width:50%;}
ul.filter > li.fw60 {width:60%;}
ul.filter > li.fw70 {width:70%;}
ul.filter > li.fw80 {width:80%;}
ul.filter > li.fw90 {width:90%;}

ul.filter > li select,
ul.filter > li input[type="date"],
ul.filter > li input[type="number"],
ul.filter > li input[type="text"] {
	position:relative;
    box-sizing:border-box;
    display:inline-block;
    width:100%;
    margin:0px;
    border:1px solid var(--main-fcolor);
    font-size:var(--fs-nr);
    padding:1px;
}

ul.filter > li select::placeholder,
ul.filter > li input[type="date"]::placeholder,
ul.filter > li input[type="number"]::placeholder,
ul.filter > li input[type="text"]::placeholder {
	position:absolute;
	z-index:+10;
	font-size:80%;
	right:2px;
	top:2px;
	opacity:0.8;
	font-weight:normal;
}

ul.filter > li + li {
	margin-left:4px;
}

ul.filter > li input[type="date"],
ul.filter > li input[type="number"],
ul.filter > li input[type="text"] {
    padding-bottom:2px;
}

ul.filter > li > span {
    box-sizing:border-box;
    font-size:var(--fs-nr);
/*	color:var(--tab-head-col);*/
	display:block;
/*	width:100%; */
	text-align:center;
	padding:1px;
	margin-bottom:4px;
}

ul.filter > li button,
ul.filter > li input[type="button"],
ul.filter > li input[type="submit"] {
    display:inline-block;
    margin:8px 4px 8px 4px;
    vertical-align:middle;
    text-align:center;
    box-sizing:border-box;
    font-size:var(--fs-nr);
    padding:4px 8px 4px 8px;
}

@media (max-width:900px) {

  ul.filter-wrap > li {
  	min-width:140px;
  }

  div.filter-form > div.filter,
  div.filter-form {
  	display:block;
	width:auto;
  }

   div.filter-form div.filter-apply {
	display:block;
	width:auto;
	text-align:right;
	margin:12px;
  }

}


/* form settings */

.form-section {
	text-align:center;
	margin:24px 0px 12px 0px;
	font-size:110%;
	line-height:125%;
	font-weight:bold;
}

.form-fields {
	list-style-type:none;
	margin:0px;
	padding:0px;
	--cnt-border-color:#336699;
	--cnt-background-color:#F8F8F8;
}

.form-fields > li {
	box-sizing:border-box;
	display:flex;
	flex-direction:row;
	justify-content:stretch;
	align-items:flex-start;
	margin:0px;
	padding:4px 0px 4px 0px;
}

.form-fields.form-horizontal {
	display:flex;
	flex-direction:row;
	justify-content:stretch;
	align-items:flex-start;
}

.form-fields.form-horizontal > li {
	display:block;
}

.form-fields > li.sep {
 	margin-top:48px;
}

.form-compact .form-fields > li,
.form-compact.form-fields > li {
	padding:1px 0px 1px 0px;
}

.form-fields > li.hid {
 	display:none;
}

.form-fields > li > div {
	box-sizing:border-box;
}

.form-fields > li > div.field-label {
	position:relative;
	width:35%;
	padding:4px 32px 4px 4px;
	flex-grow:0;
	flex-shrink:0;
	text-align:right;
}

.form-compact .form-fields > li > div.field-label {
	padding:2px 32px 2px 4px;
}

.form-fields > li.field-group {
	margin-top:8px;
	margin-bottom:8px;
}

.form-compact .form-fields > li.field-group {
	margin-top:2px;
	margin-bottom:2px;
}

.form-fields > li.field-group .form-fields {
	width:100%;
}

.form-fields > li.req > div.field-label {
	font-weight:bold;
}

.form-fields > li.req > div.field-label::after{
	display:block;
	position:absolute;
	z-index:+2;
	font-size:16px;
	font-weight:bold;
	text-align:center;
	color:#CC9933;
	text-shadow:0px 0px 8px #F8F8F8;
	content:'*';
	width:32px;
	right:0px;
	top:calc(50% - 8px);
}

.form-fields > li > div.field-control {
	position:relative;
	width:65%;
	padding:4px;
}

.form-compact .form-fields > li > div.field-control {
	padding:1px;
}

.form-fields.form-horizontal > li > div.field-label,
.form-fields.form-horizontal > li > div.field-control{
	width:auto;
	padding:2px;
	text-align:left;
}


.form-fields .fill-err .field-control,
.form-fields .uniq-check.no-uniq .field-control {
	--cnt-border-color:#990033;
	--cnt-background-color:#FFE0E0;
}

.form-fields .uniq-check.no-uniq .field-control::after {
	display:inline-block;
	content:var(--used-label,"already used");
	background-color:#CC0033;
	color:#F8F8F8;
	margin:2px 0px 2px 12px;
	padding:3px 9px 3px 9px;
	border-radius:3px;
	border:none;
}

.form-compact input[type="text"]::placeholder,
.form-compact input[type="date"]::placeholder,
.form-compact input[type="number"]::placeholder,
.form-compact input[type="password"]::placeholder,
.form-compact input[type="file"]::placeholder,
.form-compact select::placeholder,
.form-compact textarea::placeholder {
	font-size:13px;
	font-style:normal;
}

.form-panel  {
	display:block;
	margin:12px -12px 12px -12px;
	padding:4px 0px 4px 0px;
	text-align:center;
}

.topline {
    border-top:1px solid #666666;
}

.bottomline {
    border-bottom:1px solid #666666;
}

.form-panel.topline {
    border-top:1px solid #666666;
    margin-top:18px;
    padding-top:18px;
}

.form-panel.bottomline {
    border-bottom:1px solid #666666;
    margin-bottom:18px;
    padding-bottom:18px;
}

.form-panel > input,
.form-panel > button {
	box-sizing:border-box;
	min-width:180px;
	margin:12px;
	padding:6px 12px 6px 12px;
	text-align:center;
	border-radius:4px;
	color:#F0F0F0;
	background-color:#336699;
	transition:0.4s;
}

.form-panel > input.btred,
.form-panel > button.btred {
	background-color:#CC0033;
}

.form-panel > input:hover,
.form-panel > button:hover {
	color:#FFFFFF;
	box-shadow:0px 0px 10px #003366;
	background-color:#3366CC;
}

.form-panel > input.btred:hover,
.form-panel > button.btred:hover {
	color:#FFFFFF;
	box-shadow:0px 0px 10px #CC0033;
	background-color:#FF0033;
}

.form-data {
	display:none;
}

.form-fields > li .field-control .field-control-wrap {
	display:flex;
	flex-direction:row;
/*	flex-wrap:wrap;*/
	align-items:center;
	justify-content:stretch;
	margin:-4px;
}

.form-fields > li .field-control .field-control-wrap > * {
	margin:4px !important;
}

.form-fields > li div.field-control input[type="text"],
.form-fields > li div.field-control input[type="date"],
.form-fields > li div.field-control input[type="number"],
.form-fields > li div.field-control input[type="password"],
.form-fields > li div.field-control input[type="file"],
.form-fields > li div.field-control select,
.form-fields > li div.field-control textarea {
	width:100%;
	font-size:1em;
	box-sizing:border-box;
	background-color:var(--cnt-background-color);
	color:var(--cnt-border-color);
	border:2px solid var(--cnt-border-color);
	margin:0px;
	padding:2px 4px 2px 4px;
}

.form-compact .form-fields > li div.field-control input[type="text"],
.form-compact .form-fields > li div.field-control input[type="number"],
.form-compact .form-fields > li div.field-control input[type="date"],
.form-compact .form-fields > li div.field-control input[type="password"],
.form-compact .form-fields > li div.field-control input[type="file"],
.form-compact .form-fields > li div.field-control select,
.form-compact .form-fields > li div.field-control textarea {
	border:1px solid var(--cnt-border-color);
	padding:1px 2px 1px 2px;
}

.form-fields > li div.field-control input[type="text"]:disabled,
.form-fields > li div.field-control input[type="number"]:disabled,
.form-fields > li div.field-control input[type="date"]:disabled,
.form-fields > li div.field-control input[type="password"]:disabled,
.form-fields > li div.field-control input[type="file"]:disabled,
.form-fields > li div.field-control select:disabled,
.form-fields > li div.field-control textarea:disabled {
	border-color:#999999;
	background-color:#D8D8D8;
}

.form-fields > li div.field-control input[type="text"][readonly],
.form-fields > li div.field-control input[type="number"][readonly],
.form-fields > li div.field-control input[type="date"][readonly],
.form-fields > li div.field-control input[type="password"][readonly],
.form-fields > li div.field-control input[type="file"][readonly],
.form-fields > li div.field-control select[readonly],
.form-fields > li div.field-control textarea[readonly] {
	border-color:#666666;
	background-color:#F0F0F0;
}

.form-fields > li > div.field-control textarea {
	height:200px;
}

.form-fields > li div.field-control *.narrow {min-width:180px;max-width:180px;}
.form-fields > li div.field-control *.medium {min-width:180px;max-width:260px;}
.form-fields > li div.field-control *.large {min-width:260px;max-width:360px;}

.form-fields > li.white   {background-color: #FFFFFF;}
.form-fields > li.green   {background-color: #E0FFF0;}
.form-fields > li.cyan    {background-color: #E0FFFF;}
.form-fields > li.blue    {background-color: #E0E0FF;}
.form-fields > li.red     {background-color: #FFE0E0;}
.form-fields > li.gray    {background-color: #E0E0E0;}
.form-fields > li.yellow  {background-color: #FFFFE0;}
.form-fields > li.orange  {background-color: #FFE0C0;}
.form-fields > li.violet  {background-color: #FFE0FF;}
.form-fields > li.grass   {background-color: #E0FFE0;}

.filter > li.white   {background-color: #FFFFFF;color:#333333;}
.filter > li.green   {background-color: #339966;}
.filter > li.cyan    {background-color: #339999;}
.filter > li.blue    {background-color: #336699;}
.filter > li.red     {background-color: #990033;}
.filter > li.gray    {background-color: #666666;}
.filter > li.yellow  {background-color: #CCCC33;color:#333333;}
.filter > li.orange  {background-color: #CC9933;color:#333333;}
.filter > li.violet  {background-color: #663399;}
.filter > li.grass   {background-color: #339933;}




table td.tlft    {text-align:left;}
table td.tcnt    {text-align:center;}
table td.tbld    {font-weight:bold;}
table td.tita    {font-style:italic;}
table td.trgt    {text-align:right;}
table td.tsml    {font-size:85%; line-height:100%;}
table td.tlrg    {font-size:120%; line-height:125%;}
table td.tnowrap {white-space:nowrap;}
table td.twrap   {white-space:normal;}
table td.blft    {border-left:1px solid var(--tab-head-bg,#999999) !important;}
table td.brgt    {border-right:1px solid var(--tab-head-bg,#999999) !important;}
table td.lblft   {border-left:1px solid #CCCCCC !important;}
table td.lbrgt   {border-right:1px solid #CCCCCC !important;}

table.dyn tr.blank-row,
.form-fields .blank-row,
form .blank-row {display:none !important;}

/* REPORT AND FILTERING */

table.tabreport {
    width:100%;
	border-collapse:collapse;
	border:none;
}

.tabreport tr > td {
	border-top:1px solid var(--main-bgcolor);
}

.tabreport.reltd > tbody > tr > td {
	position:relative;
}

.tabreport > tbody > tr > td::before {
	display:none;
}

.tabreport > thead > tr > td::before {
	display:block;
	text-align:center;
}

.tabreport td.cw5  {width:5%;}
.tabreport td.cw7  {width:7%;}
.tabreport td.cw8  {width:8%;}
.tabreport td.cw10 {width:10%;}
.tabreport td.cw15 {width:15%;}
.tabreport td.cw20 {width:20%;}
.tabreport td.cw25 {width:25%;}
.tabreport td.cw33 {width:33%;}
.tabreport td.cw40 {width:40%;}
.tabreport td.cw50 {width:50%;}
.tabreport td.cw66 {width:66%;}
.tabreport td.cw75 {width:75%;}
.tabreport td.cw80 {width:80%;}
.tabreport td.cw90 {width:90%;}

.tabreport:not(.noautorow) > tbody > tr:nth-child(odd),
.tabreport > tbody > tr.odd  {
	background-color:var(--tab-odd-bg);
	color:var(--tab-odd-col);
}

.tabreport:not(.noautorow) > tbody > tr:nth-child(odd) > td + td {
	border-left:1px solid var(--tab-even-bg);
}

.tabreport:not(.noautorow) > tbody > tr:nth-child(even),
.tabreport > tbody > tr.even {
	background-color:var(--tab-even-bg);
	color:var(--tab-even-col);
}

.tabreport:not(.noautorow) > tbody > tr:nth-child(even) > td + td {
	border-left:1px solid var(--tab-odd-bg);
}

.tabreport thead td,
.tabreport .head > td,
.tabreport .control > td {
	background-color:var(--tab-head-bg) !important;
	color:var(--tab-head-col) !important;
/*	font-size:var(--fs-sm);*/
	font-weight:bold;
	font-style:normal;
	text-align:center;
	padding:1px 3px 1px 3px;
}

.tabreport thead td,
.tabreport .head > td {
	padding:6px 3px 3px 3px;
	border-top:1px solid var(--tab-head-col);
}

.tabreport thead td,
.tabreport .head > td + td,
.tabreport .control > td + td {
	border-left:1px solid var(--tab-head-col);
}

.tabreport .section > td {
	background-color:var(--tab-sect-bg, --tab-head-bg) !important;
	color:var(--tab-sect-col, --tab-head-col) !important;
	border-top:1px solid var(--tab-sect-col, --tab-head-col);
	font-size:var(--fs-nr);
	font-weight:bold;
	font-style:normal;
	text-align:center;
	padding:9px 1px 3px 1px;
}

.tabreport > tbody > tr > td.hl-green   {background-color:#F0FFF0;}
.tabreport > tbody > tr > td.hl-red     {background-color:#FFF0F0;}
.tabreport > tbody > tr > td.hl-yellow  {background-color:#FFFFF0;}
.tabreport > tbody > tr > td.hl-blue    {background-color:#F0F0FF;}
.tabreport > tbody > tr > td.hl-violet  {background-color:#FFF0FF;}
.tabreport > tbody > tr > td.hl-orange  {background-color:#FFF8F0;}
.tabreport > tbody > tr > td.hl-gray    {background-color:#F0F0F0;}

/*.tabreport.selrow > tbody > tr:hover {overflow:visible;}*/
.tabreport.selrow > tbody > tr:hover > td {opacity:0.9;}

.tabreport > tbody > tr.sample {display:none;}

.tabreport.wcontrols input,
.tabreport.wcontrols select,
.tabreport.wcontrols textarea {box-sizing:border-box;width:100%;}

@media (max-width:600px) {
	.tabreport.adp,
	.tabreport.adp tbody,
	.tabreport.adp tbody tr,
	.tabreport.adp tbody tr td {
		display:block;
		margin:0px;
		box-sizing:border-box;
		border:none;
	}

	.tabreport.adp thead {
		display:none;
    }

   	.tabreport.adp tbody tr {
   		margin-top:12px;
   		border-radius:8px;
   	}

   	.tabreport.adp tbody tr > td {
   		padding-left:12px;
   		padding-right:12px;
   	}

 	.tabreport.adp tbody tr > td:first-child {
   		padding-top:12px;
   		border-top-left-radius:8px;
   		border-top-right-radius:8px;
 	}

 	.tabreport.adp tbody tr > td:last-child {
   		padding-bottom:12px;
   		border-bottom-left-radius:8px;
   		border-bottom-right-radius:8px;
 	}

   	.tabreport.adp tbody tr td::before {
   		display:inline-block;
   		margin-right:12px;
   	}


}

.fr-btn {
	box-sizing:border-box;
	display:inline-block;
 	min-width:42px;
	margin:4px;
	background-color:#336699;
	color:white;
	padding:4px 6px;
	border:none;
	border-radius:4px;
}

.fr-btn.bt-gray {background-color:#999999;}
.fr-btn.bt-black {background-color:#333333;}
.fr-btn.bt-cyan {background-color:#339999;}
.fr-btn.bt-green {background-color:#339966;}
.fr-btn.bt-red {background-color:#990033;}
.fr-btn.bt-yellow {background-color:#CCCC66;color:#333333;}
.fr-btn.bt-orange {background-color:#CC9966;color:#333333;}


.checklist {
 	border:1px solid var(--tab-head-bg);
	background-color:var(--main-bgcolor);
	margin:0px;
	padding:4px;
	min-height:200px;
	max-height:min(300px,100%);
	overflow-y:auto;
}

.checklist.ch-fix {
	height:200px;
 	border:2px solid #336699;
}


.checklist > span {
	display:block;
	margin:6px 0px 2px 0px;
 	color:#999999;
}

.checklist > label {
	display:flex;
	flex-direction:row;
	justify-content:flex-start;
	align-items:flex-start;
	gap:8px;
	margin:2px 0px 2px 0px;
 	color:#336699;
}

.checklist.ch-nohb input[type="checkbox"] {
	display:none !important;
}


/* two-columns norton-like panels */

.form-xchanger {
 	display:grid;
	gap:8px;
	grid-template-columns: 1fr 50px 1fr;
	grid-template-rows: minmax(auto, 300px);
	align-items:stretch;
}

.form-xchanger > .xc-panel {
	display:flex;
	flex-direction:column;
	align-items:stretch;
	justify-content:space-around;
}

.vert-flex {
	display:flex;
	flex-direction:column;
	align-items:stretch;
	justify-content:stretch;
}

.vert-flex > div {
        flex-grow:1;
	flex-shrink:1;
}

.vert-flex > div.flex-ext {
        flex-grow:10;
	flex-shrink:10;
}


.cr-pnt {cursor:pointer;}