/* Custom CSS*/

body {
    padding-top: 120px;
}

label { text-align:right; }

#product-search-dialog, #product-qrscan-dialog { position:fixed; width:600px; height:120px; left:50%; top:20%; margin-left:-300px; margin-top:-60px;display:none; z-index:10000}
/*#product-search-dialog { position:fixed; width:300px; height:120px; left:50%; top:50%; margin-left:-150px; margin-top:-160px;display:none; z-index:10000}*/
/*#product-search-dialog { position:fixed; width:600px; height:120px; left:50%; top:50%; margin-left:-300px; margin-top:-60px;display:none; z-index:10000}*/
#product-scanned-dialog { position:fixed; width:600px; height:200px; left:50%; top:50%; margin-left:-300px; margin-top:-100px; display:none; z-index:10000}
#notes-dialog, #remark-dialog  { position:fixed; width:600px; height:200px; left:50%; top:50%; margin-left:-300px; margin-top:-100px; display:none; z-index:10000}

#txtLotNumberEnter, #txtQuantityEnter, #txtPackingQuantityEnter, #txtQuantityInEnter, #txtPINoEnter{ position:absolute; padding:3px; display:none; text-align:center}

#upload-container {position:absolute; top:0px; left:0px; width:0px; height:0px; overflow:hidden}

#overlay{
	display:none;
	position:fixed;
	z-index:8001;
	top:0;
	left:0;
	width:100%;
	height:100%;    
	background-color:#333;
	color:#FFF;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; // first!
	filter: alpha(opacity=60);
	opacity: 0.6;   /*supported by current Mozilla, Safari, and Opera*/ 
	-moz-opacity: 0.6;  /*older Mozilla*/ 
	-khtml-opacity: 0.6;   /*older Safari*/ 
}

#overlay-loading { position:fixed; width:28px; height:28px; left:50%; top:50%; margin-left:-14px; margin-top:-14px; border-radius:15px; background-color:white; opacity:0.8; z-index:8002; color:black}

.command-button { min-width:120px;}

.icon-pencil, .icon-trash, .icon-print, .icon-folder-opened, .icon-folder-closed, .icon-setting, .icon-detail, .preview-link, .icon-pointer { cursor:pointer; }
.dropdown-filter { min-width:300px; padding: 15px; padding-bottom: 15px;}

.splitrow { margin-bottom:5px; }

.splitrow input, .splitrow select{ margin-bottom:2px; }

ul.nopadding { list-style:none; padding:0px; margin:0px }

ul.photo-thumbs { list-style:none; padding:0px; margin:0px; float:left; width:100%; margin-bottom:10px; }
ul.photo-thumbs li { float:left; margin:5px; padding:3px; position:relative; min-width:100px; min-height:100px; }
ul.photo-thumbs li span.icon-remove { position:absolute; right:-5px; top:-5px;}
ul.photo-thumbs li img { height:80px;}
ul.photo-thumbs.small li { min-width:40px; min-height:30px; margin:3px; padding:0px;}
ul.photo-thumbs.small li img { height:30px; border:1px solid #CCC; box-shadow:#000 0px 0px 5px; }


ul.photo-thumbs li a.icon-primary { font-size:10px; display:none }
ul.photo-thumbs li:hover a.icon-primary { display:block}

ul.attachment-thumbs { list-style:none; padding:0px; margin:0px }
ul.attachment-thumbs li { float:left; margin:5px; padding:3px; position:relative; }
ul.attachment-thumbs li span.icon-remove { position:absolute; right:-5px; top:-5px;}
ul.attachment-thumbs li img { height:80px;}
ul.attachment-thumbs.small li { float:none; margin:0px; padding:0px; }
ul.attachment-thumbs.small li img { height:30px;}
ul.attachment-thumbs.small li span.icon-remove { position:absolute; right:5px; top:0px;}

img.project-photo { min-width:100%; max-width:100%;  border:2px solid white; box-shadow:#000 0px 0px 10px; }
img.announcement-photo { min-width:100%; max-width:100%; border:2px solid white; box-shadow:#000 0px 0px 10px; margin-bottom:10px; }

.announcements { min-height:450px;}
.smallfont { font-size:10px;}
.mediumfont { font-size:12px;}

.darkred { color:#FF118C;}
.red { color:red;}
.green { color:green;}
.yellow { color:yellow;}

table th.sortheader { background-image: url('images/tablelist/bg.gif'); background-repeat: no-repeat; background-position: center right; cursor:pointer; padding-right:1.5em; white-space:nowrap }
table th.sortheader:hover {}
table th.sortheader.headerSortUp { background-image: url('images/tablelist/asc.gif'); }
table th.sortheader.headerSortDown { background-image: url('images/tablelist/desc.gif'); }

.datepicker{z-index:10000 !important;}

ul.sales-lead-list { padding:0px; margin:0px; list-style:none; }

ul.sales-lead-list li { float:left; position:relative; width:80px; padding:10px 2px; font-size:10px; }
ul.sales-lead-list li i { display:block; font-size:10px; }
ul.sales-lead-list li:nth-child(5) { width:10px;}

div.success { border:#6F0 1px solid; background-color:#FFC; color:#030; padding:10px; border-radius:5px}
div.error { border:#C00 1px solid; background-color:#FCC; color:#F30; padding:10px; border-radius:5px}

.info input.icon-update { color:black !important}

#upline-info {
	padding-right:20px;
	position:relative;
}

#upline-name {
	font-size:20px;
}

#upline-position {
	font-style:italic;
}

#upline-info-close {
	position:absolute;
	right:10px;
	top:10px;
	cursor:pointer;
}

.glyphicon-refresh-animate {
    -animation: spin .7s infinite linear;
    -webkit-animation: spin2 .7s infinite linear;
}

@-webkit-keyframes spin2 {
    from { -webkit-transform: rotate(0deg);}
    to { -webkit-transform: rotate(360deg);}
}

@keyframes spin {
    from { transform: scale(1) rotate(0deg);}
    to { transform: scale(1) rotate(360deg);}
}

.archive-list { margin:0px; padding:0px 0px 0px 0px; list-style:none; }
.archive-list li { float:left; width:100%; box-sizing:border-box; padding:10px 10px; border:1px solid #EEEEEE; border-radius:10px; margin:2px; position:relative; }
.archive-list li a.fa { position:absolute; right:15px;}

.non-active { text-decoration:line-through; color:#999 !important }
.deleted { text-decoration:line-through; color:red }

.search-box { border:1px solid #EEEEEE; border-radius:10px;}
.search-box > span { margin:1px; border:1px solid #333; background-color:#EEEEEE; display:inline-block; padding:5px 5px 5px 5px; border-radius:5px; white-space:nowrap}
.pointer { cursor:pointer}


.label0 { background-color:#FFFFFF}
.label1 { background-color:#FFFFFF}
.label2 { background-color:#FC9684}
.label3 { background-color:#849EE4}
.label4 { background-color:#A4DE64}
.label5 { background-color:#E4E6D4}
.label6 { background-color:#FCB674}
.label7 { background-color:#84EEF4}
.label8 { background-color:#D4CE84}
.label9 { background-color:#C4A6F4}
.label10 { background-color:#A4CEC4}
.label11 { background-color:#FCE674}

.overline { text-decoration:line-through;}

@media (min-width: 1200px) .container { width:100% !important; }
@media (min-width: 992px) .container { width:100% !important; }
@media (min-width: 768px) .container { width:100% !important; }


.selection-list {
	list-style:none; margin:0px; border:2px solid #DCE4EC; border-radius:3px; padding:10px; background-color:white; min-height:42px;
}

#item-list .numbers { position:relative }
#item-list tr .icon-add-title, #item-list tr .icon-add-lotnumber { display:none; position:absolute; cursor:pointer}
#item-list tr:hover .icon-add-title, #item-list tr:hover .icon-add-lotnumber { display:inline}
#item-list tr .icon-add-title, #item-list tr .icon-add-lotnumber {top:0px; left:0px;}

#item-list tr .panel-edit-title { display:none }
#item-list tr:hover .panel-edit-title { display:inline }

.typehead-container { position:relative}
.typehead-container > .fa-remove { position:absolute; right:10px; top:0.8em; cursor:pointer}
.non-stock { color:#666 !important}

.top-link-new-window { position:absolute; right:0px; top:0px; padding:3px 10px 3px 10px !important;}
.dropdown-menu > li { position:relative; padding-left:20px; padding-right:20px}


.typeahead.dropdown-menu { background-color:var(--white);}
.typeahead.dropdown-menu > li.dropdown-item > a { text-decoration:none; color:var(--dark); }
.typeahead.dropdown-menu > li.dropdown-item.active > a { color:var(--light); }

.typeahead.dropdown-menu > li.dropdown-item > a:hover { text-decoration:none; color:var(--dark); }
.typeahead.dropdown-menu > li.dropdown-item.active > a:hover { text-decoration:none; color:var(--light); }


.product-browser-item { cursor:pointer}
.product-browser-item:hover { background-color:#EEEEEE}
.product-browser-item label {     font-weight: normal;
    cursor: pointer;
    width: 100%;
    
    margin: 0px;
    display: inline-block;
    padding: 0px;}
.product-browser-item td { line-height:1em; padding:0px;}
.product-browser-item label.product-browser-product-info { padding:5px;}
#product-browser-status { font-size:0.80em}

.ajax-loading { background-image:url('/img/ajax-loading.gif'); background-repeat:no-repeat; background-position:right}
.record-detail { background-color:azure;}
.record-detail:hover { background-color:azure;}
/*
.record-detail { background-color:#EEEEEE; border-top:3px solid black; border-bottom:3px solid black}
.record-detail:hover { background-color:#EEEEEE; }
*/

.expiry-date {font-size:8px; border-radius:5px; padding:3px 5px}
.expiry-date.30days {background-color:green; }
.expiry-date.14days {background-color:orange; }
.expiry-date.7days { background-color:yellow; }
.expiry-date.expired { background-color:red; }

.onscreen-ruler { display:inline-block; width:640px; height:100px; cursor:move; background-image:url('images/rulers/ruler15cm.svg'); background-repeat:no-repeat; z-index:10000}
.onscreen-ruler.protractor{ display:inline-block; width:500px; height:268px; cursor:move; background-image:url('images/rulers/angle_ruler.png'); background-repeat:no-repeat}

.badge-best{color:white; background-color:#F90;}
.badge-new{color:white; background-color:#9C0;}
.badge-hot{color:white; background-color:#F33;}
.badge-promote{color:white; background-color:#F39;}

ul.list-tree-supplier-category,
ul.list-tree-supplier-category ul {list-style:none; padding-left:0px;}
ul.list-tree-supplier-category li { padding-left:20px;}

.stats {
	float:left;
	display:inline-block;
	width:130px;
	height:auto;
	margin:5px;
	border:2px solid #f5ccb3;
	padding:10px;
	border-radius:3px;
	min-height:120px;
	background-color:#F8DDCC;
	color:#853400;
	text-align:center;
}

.stats > div:nth-child(1) { font-weight:bold;}
.stats > div:nth-child(2) { font-size:20px; }
.stats > div:nth-child(3) { font-size:14px; color:green;}
.stats > div:nth-child(4) { font-size:14px;}
.stats.reduced > div:nth-child(3) { color:red}


.catalog-goods-list {
	margin-top:10px;	
	display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: stretch;
}

.catalog-goods-list > .catalog-goods-item {
	display:inline-block;
	position:relative;
	float:left;
	width:90%;
	margin-left:10px;
	margin-bottom:10px;
	margin-right:0px;		
	/*height:300px;*/
	border:1px solid #CCCCCC;
	border-radius:5px;
	overflow:hidden;
	background-color:white;
	transition: all .2s linear;
	font-size:12px;
	padding-bottom:60px;
	cursor:pointer;
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {  
	.catalog-goods-list > .catalog-goods-item {
		 width:45%;
	}
}
 
/* Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */
@media (min-width: 768px) {  
	.catalog-goods-list > .catalog-goods-item {
		 width:30%;
	}
}
 
/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 
	.catalog-goods-list > .catalog-goods-item {
		 width:30%;
	}

}
 
/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {  
	.catalog-goods-list > .catalog-goods-item {
		 width:18%;
	}

}
 

.catalog-goods-list > .catalog-goods-item:hover {
	z-index:1000;
	-webkit-box-shadow: 0 15px 30px rgba(0,0,0,0.4);
    box-shadow: 0 5px 15px rgba(0,0,0,0.4);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.catalog-goods-list > .catalog-goods-item .catalog-goods-item-info {
	padding:10px;
}

.catalog-goods-list > .catalog-goods-item .catalog-goods-item-info > div:nth-child(1) {
	display: -webkit-box;
	-webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
	overflow: hidden;
}
.catalog-goods-list > .catalog-goods-item .catalog-goods-item-info > div:nth-child(2) {
	display: -webkit-box;
	-webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
	overflow: hidden;
}

.catalog-goods-list > .catalog-goods-item .catalog-goods-item-info > div:nth-child(3) {
	display: -webkit-box;
	-webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
	overflow: hidden;
}


.catalog-goods-list > .catalog-goods-item .catalog-goods-item-cart {
	position:absolute; bottom:0px; width:100%;
	padding:10px;
	display:flex;
	align-items: flex-start;
    flex-direction: column;
    flex-wrap: nowrap;
}


.catalog-goods-list > .catalog-goods-item .catalog-goods-item-cart > div:nth-child(1) {}
.catalog-goods-list > .catalog-goods-item .catalog-goods-item-cart > div:nth-child(2) {}


.goods-variations > .goods-variation { display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start; font-size:14px; margin-bottom:2px; }

.goods-variations > .goods-variation:nth-child(n+2) {
	border-top:1px solid gray;
}

.goods-variations > .goods-variation > .goods-variation-label {text-align:left; width:70px; padding:3px 5px; margin:2px}
.goods-variations > .goods-variation > .goods-variation-options { text-align:center; padding:3px 10px; margin:2px; background-color:white; border:1px solid gray; cursor:pointer;}
.goods-variations > .goods-variation > .goods-variation-options:hover {border:1px solid gray;}
.goods-variations > .goods-variation > .goods-variation-options.selected { background-color:var(--primary);color:white; border:1px solid gray;}
.goods-variations > .goods-variation > .goods-variation-options.disabled { opacity:0.65; cursor:not-allowed;}

.dropdown-item.active > a { color:var(--white);}
.item-serialno-wrap { text-align:right; position:relative}
.item-serialno-counter { position:absolute; top:0.6em; right:100px; border-radius:10px; font-size:0.8em;  }

.bootstrap-select .dropdown-menu {z-index:2000}
.bootstrap-select { min-width:300px;max-width:300px;}


.typeahead.dropdown-menu { width: 93.5%; }
.typeahead.dropdown-menu > .dropdown-item { white-space:normal; }
.typeahead.dropdown-menu > .dropdown-item > a { width:100%; font-size:15px; }
.typeahead.dropdown-menu > .dropdown-item > a > div:nth-child(1) {}
.typeahead.dropdown-menu > .dropdown-item > a > div:nth-child(2) {font-size: 0.75em}