body {
	font-size: 16px;
}

td {
    font-weight: 100;
    line-height: 1;
}
.menuicon {
    width: 24px;
    height: 24px;
}
.menuiconmain {
    width: 128px;
    height: 128px;
    padding: 5px;
}
.checklisticon {
    width: 16px;
    height: 16px;
}

.menulink {
    color: rgba(255, 255, 255, 1);
}

.nav-link img{
    background-color: rgba(255,255,255,.5);
    padding: 1px;
}

.error{
    color: red;
}

h1{
    font-size: 1rem;
}

h2{
    font-size: 1rem;
}

@media (min-width: 260px) and (max-width: 575px ) {
    .col-sm-6 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
}
.navbar-dark .navbar-nav .nav-link {
    color: rgba(255,255,255,.9);
}

.navbar-dark .navbar-nav .nav-link {
	padding-right: .4rem;
	padding-left: .4rem;
}

.focus-highlight {
  background-color: #66FF66!important;
}
.smalltext {
  font-size: 10pt;
}

.even, .odd {
    border-top: 1px solid #007bff;
    border-bottom: 1px solid #007bff;
}
.nopadding {
	padding-left: 0px!important;
	padding-right: 0px!important;
}

/* Loader */

span.loadheader {
	display: block;
	margin: 0 auto;
}

span[class*="l-"] {
	height: 4px; width: 4px;
	background: #000;
	display: inline-block;
	margin: 12px 2px;

	border-radius: 100%;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;

	-webkit-animation: loader 4s infinite;
	-webkit-animation-timing-function: cubic-bezier(0.030, 0.615, 0.995, 0.415);
	-webkit-animation-fill-mode: both;
	-moz-animation: loader 4s infinite;
	-moz-animation-timing-function: cubic-bezier(0.030, 0.615, 0.995, 0.415);
	-moz-animation-fill-mode: both;
	-ms-animation: loader 4s infinite;
	-ms-animation-timing-function: cubic-bezier(0.030, 0.615, 0.995, 0.415);
	-ms-animation-fill-mode: both;
	animation: loader 4s infinite;
	animation-timing-function: cubic-bezier(0.030, 0.615, 0.995, 0.415);
	animation-fill-mode: both;
}

span.l-1 {-webkit-animation-delay: 1s;animation-delay: 1s;-ms-animation-delay: 1s;-moz-animation-delay: 1s;}
span.l-2 {-webkit-animation-delay: 0.8s;animation-delay: 0.8s;-ms-animation-delay: 0.8s;-moz-animation-delay: 0.8s;}
span.l-3 {-webkit-animation-delay: 0.6s;animation-delay: 0.6s;-ms-animation-delay: 0.6s;-moz-animation-delay: 0.6s;}
span.l-4 {-webkit-animation-delay: 0.4s;animation-delay: 0.4s;-ms-animation-delay: 0.4s;-moz-animation-delay: 0.4s;}
span.l-5 {-webkit-animation-delay: 0.2s;animation-delay: 0.2s;-ms-animation-delay: 0.2s;-moz-animation-delay: 0.2s;}
span.l-6 {-webkit-animation-delay: 0;animation-delay: 0;-ms-animation-delay: 0;-moz-animation-delay: 0;}

@-webkit-keyframes loader {
	0% {-webkit-transform: translateX(-30px); opacity: 0;}
	25% {opacity: 1;}
	50% {-webkit-transform: translateX(30px); opacity: 0;}
	100% {opacity: 0;}
}

@-moz-keyframes loader {
	0% {-moz-transform: translateX(-30px); opacity: 0;}
	25% {opacity: 1;}
	50% {-moz-transform: translateX(30px); opacity: 0;}
	100% {opacity: 0;}
}

@-keyframes loader {
	0% {-transform: translateX(-30px); opacity: 0;}
	25% {opacity: 1;}
	50% {-transform: translateX(30px); opacity: 0;}
	100% {opacity: 0;}
}

@-ms-keyframes loader {
	0% {-ms-transform: translateX(-30px); opacity: 0;}
	25% {opacity: 1;}
	50% {-ms-transform: translateX(30px); opacity: 0;}
	100% {opacity: 0;}
}

#orderbutton {
    color: white;
    font-size: x-large;
}

.row {
	margin-left: 0px;
	margin-right: 0px;
}

.linktable tbody tr {
	cursor:pointer;
}

.row [class*=col-]{
	margin:0 -.3px;
	/*flex-basis: 20em; */
}

ul.ui-autocomplete {
    z-index: 1100;
}

.invisible{visibility:hidden!important}

.hidden-xs-up{display:none!important}
@media (max-width:575px)
{
	.hidden-xs-down{display:none!important}
}
@media (min-width:576px)
{.hidden-sm-up{display:none!important}}
@media (max-width:767px){.hidden-sm-down{display:none!important}}
@media (min-width:768px){.hidden-md-up{display:none!important}}
@media (max-width:991px){.hidden-md-down{display:none!important} .menulogin{margin-top: 20px;} .navbar-dark .navbar-nav .nav-link{ padding: .6rem 1rem;}}
@media (min-width:992px){.hidden-lg-up{display:none!important}}
@media (max-width:1199px){.hidden-lg-down{display:none!important}}
@media (min-width:1200px){.hidden-xl-up{display:none!important}}.hidden-xl-down{display:none!important}.visible-print-block{display:none!important}
@media print{.visible-print-block{display:block!important}}.visible-print-inline{display:none!important}
@media print{.visible-print-inline{display:inline!important}}.visible-print-inline-block{display:none!important}
@media print{.visible-print-inline-block{display:inline-block!important}}
@media print{.hidden-print{display:none!important}}

@media (min-width:576px)
{
	.alignrightonfullscreen {
		text-align: right;
	}
}

/* remove padding inside a card body */
.card-body .col-12 {
	padding-left: 0px;
	padding-right: 0px;
}

.smallcell {
	padding-top: 8px !important;
	padding-bottom: 8px !important;
}

.btn-outline-secondary {
	background-color: #FFFFFF;
}

@media (max-width:575px)
{
	.boldonsmall {
		font-weight: bold;
	}
}

button.btn.btn-secondary.first {
	min-width: 35px;
}

button.btn.btn-secondary.last {
	min-width: 35px;
}

.batchnrplaceholder {
	font-style: italic;
	font-weight: bold;
}

.btnbatchscanner {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
	margin-left: -5px;
}

.btnrightsquare {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}

/* Navigatie laten scrollen op kleine schermen */
@media screen and (max-width: 991px) {
	.navbar-collapse {
	max-height: calc(100vh - 60px);
	overflow-y: auto;
	}
}

/* pace loader icon */
.pace {
	-webkit-pointer-events: none;
	pointer-events: none;

	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

.pace-inactive {
	display: none;
}

.pace .pace-progress {
	background: #ed1c24;
	position: fixed;
	z-index: 2000;
	top: 0;
	right: 100%;
	width: 100%;
	height: 2px;
}
.errormessage {
	color: red;
	font-weight: bold;
}
.batchlinkline {
	color: blue !important;
	cursor: pointer;
	line-height: 22px;
}

small.performance {
	color: #f5f5f5 !important;
}

.btn-minus, .btn-minus-packageunit {
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
}

.btn-plus, .btn-plus-packageunit {
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
}

.nobottom {
	margin-bottom: 0px;
}

.filterbuttonsmall {
	font-size: 0.7rem !important;
}

.bg-lightseethrough {
	background-color: #f8f9fad8 !important
}

.table thead th {
	vertical-align: top;
}

/* Dark theme*/
@media (prefers-color-scheme: dark) {
	body {
		color: white;
		background-color: #292C35;
	}

	a {
		color: white;
	}

	a:hover {
		color: white;
	}

	a:link {
		color: white;
	}

	a:visited {
		color: white;
	}

	a:active {
		color: white;
	}

	nav {
		background-color: #0029a2 !important;
	}

	.navbar-dark {
		background-color: #0029a2 !important;
	}

	.dropdown-menu.show {
		background-color: #0029a2 !important;
	}

	footer {
		background-color: #1e2027 !important;
	}
	h1, h2, h3, h4, h5, h6 {
		color: white;
	}

	.iitlogo {
		content:url("../images/industrialitlogoinverse.svg");
	}

	.nav-link img {
		padding: 0px;
	}

	form {
		color: white !important;
	}

	button.scan {
		color: white !important;
		border-color: white !important;
		background-color: #6c757d !important;
	}

	button.storagelocations {
		color: white !important;
		border-color: white !important;
		background-color: #6c757d !important;
	}

	button.go{
		color: white !important;
		border-color: white !important;
		background-color: #6c757d !important;
	}

	button.fefo{
		color: white !important;
		border-color: white !important;
		background-color: #6c757d !important;
	}

	button.btn-datepicker{
		color: white !important;
		border-color: white !important;
		background-color: #6c757d !important;
	}

	button.btnbatchscanner{
		color: white !important;
		border-color: white !important;
		background-color: #6c757d !important;
	}

	button.warehouses{
		color: white !important;
		border-color: white !important;
		background-color: #6c757d !important;
	}

	.btn-plus, .btn-plus-packageunit, .btn-minus, .btn-minus-packageunit {
		border-color: white !important;
	}

	.locationlink {
		color: white !important;
		text-decoration: underline !important;
		font-weight: bold;
	}

	.warehouselink {
		color: white !important;
		text-decoration: underline !important;
		font-weight: bold;
	}

	::-webkit-calendar-picker-indicator {
		filter: invert(1);
	}

	select {
		color: white !important;
		background-color: #404552 !important;
	}

	.custom-select {
		background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3e%3cpath fill='white' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right .75rem center/8px 10px;
	}

	input {
		color: white !important;
		border-color: white !important;
		background-color: #404552 !important;
	}

	textarea {
		color: white !important;
		border-color: white !important;
		background-color: #404552 !important;
	}

	th {
		color: white !important;
		background-color: #1e2027 !important;
		border: 1px solid #4e4e4e !important;
	}

	.table-bordered {
		border: 1px solid #4e4e4e !important;
	}

	.tablesorter-filter-row {
		background-color: #1e2027 !important;
		border: 1px solid #4e4e4e !important;
	}
	.table-bordered td, .table-bordered th {
		border: 1px solid #4e4e4e !important;
	}

	tr.even td {
		color: white !important;
		background-color: #2e313c !important;
		border: 1px solid #4e4e4e;
	}

	tr.odd td {
		color: white !important;
		background-color: #1e2027 !important;
		border: 1px solid #4e4e4e !important;
	}
	.odd, .even {
		border: 1px solid #4e4e4e !important;
	}
	.tablesorter-filter {
		border: 1px solid #4e4e4e !important;
	}

	.card-header {
		background-color: #1e2027 !important;
	}

	.card-body {
		color: white !important;
		background-color: #2e313c !important;
	}

	.modal-header {
		background-color: #2e313c !important;
	}

	.modal-footer {
		background-color: #2e313c !important;
	}

	.modal-body {
		background-color: #2e313c !important;
	}

	.ui-menu-item {
		color: white !important;
		background-color: #404552 !important;
	}

	.close {
		color: white !important;
	}

	.table {
		color: white !important;
	}

	.introjs-tooltip {
		background-color: #2e313c !important;
	}

	.btn-outline-secondary .fa-barcode {
		color: white !important;
	}

	.table-secondary td {
		background-color: #2e313c !important;
	}

	.table-light td {
		background-color: #2e313c !important;
	}

	small.performance {
		color: #1e2027 !important;
	}

	[data-rowstatus="completed"] {
		background: #118921 !important;
	}

	.batchlinkline {
		color: white !important;
		text-decoration: underline !important;
		cursor: pointer;
		line-height: 22px;
	}

	.bg-light {
		background-color: #2e313c !important;
	}
}

#overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

#concurrentsessionswarning {
    z-index: 2;
}

/* Loading animation */

.icon-wrapper {
	position: relative;
	display: inline-block;
}

.loader-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    width: 100px;
	height: 100px;
	display: none;
}

.loading .menuiconmain,
.loading .indexmenutext {
    opacity: 0.3;
}

.resultitem.loading {
	position: relative;
	overflow: hidden;
	background-color: #e7e7e7 !important;
}

.resultitem.loading::after {
	content: "";
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: linear-gradient(
		90deg,
		transparent,
		rgba(255, 255, 255, 0.4),
		transparent
	);
	animation: shimmer 1.5s infinite;
	z-index: 10;
	pointer-events: none;
}

@keyframes shimmer {
	0% {
		left: -100%;
	}
	100% {
		left: 100%;
	}
}
