.dropdown-item .fa, .dropdown-item .fas {
 	min-width: 20px;
 }

 .vertical-nav-menu i.metismenu-state-icon, .vertical-nav-menu i.metismenu-icon {
 	font-size: 1.25em;
 }

 * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  transition: none !important;
}

td.action, th.action {
	width: 120px;
	white-space: nowrap;
	text-align: center;
}

/* layout 30px -> 15px */
.app-sidebar .app-sidebar__inner {
    padding: 15px 15px;
}
.app-main .app-main__inner {
    padding: 15px 15px;
}
.app-page-title {
    padding: 5px 15px;
    margin: -15px -15px 15px;
}
.card-body {
    padding: 15px;
	overflow-x: scroll;
	min-height: 880px;
}

.alert {
	padding: .75rem 15px;
    margin-bottom: 0;
    border-radius: 0;
}

.statuscol {
	min-width: 30px;
	max-width: 30px;
	font-size: 10px;
	cursor: pointer;
}

h4.objectHeader {
	margin-top: .4rem;
	color: #fff;
	margin-right: 10px;
	font-weight: 700;
}

.btn-excel {
	color: #fff;
	background-color: #008000;
	border-color: #008000;
}

.btn-excel:hover {
	color:#fff;
	background-color:#017101;
	border-color:#017101;
}
#dataRowCount {
    display: contents;
    font-size: inherit;
}

#version {
	position: fixed;
    color: #000;
    margin: 0 16px;
    bottom: 0;
    left: -16px;
    font-size: 10px;
    width: 280px;
    padding: 4px 16px;
    text-align: right;
}

.closed-sidebar #version {
	width: 80px;
	text-align: center;
}

.overlay {
	position: fixed;
    width: 100%;
    height: 100%;
    z-index: 99;
}

.overlay .inner {
	width: 100%;
	height: 100%;
	background: #dbe3ef;
	opacity: 0.7;
}

.overlay .spinner {
	text-align: center;
	position: absolute;
	top: calc(50% - 36px);
	left: calc(50% - 36px);
	color: #780edd;
	font-size: 72px;
}

.no-caps {
	text-transform: none;
}

.small {
	font-size: 90%;
}

.btn-group-xs>.btn, .btn-xs {
    padding: .3rem .4rem .3rem .4rem;
    font-size: .675rem;
    line-height: .5;
    border-radius: .2rem;
}

.app-header.header-text-light .app-header__logo .logo-src {
    background: url(assets/images/logo.svg);
    background-size: contain;
    background-repeat: no-repeat;
}

a {
    color: #780edd;
}

.app-sidebar__heading {
    color: #780edd;
}

.vertical-nav-menu li a.mm-active {
    color: #780edd;
    background: #fbf8ff;
}

.vertical-nav-menu li a:hover {
    background: #fbf8ff;
}

.btn-link {
    color: #780edd;
}

.btn-link:hover,
a:hover {
    color: #5a09a7;
}

.btn-attention {
	border-bottom-color: #dd0e74;
    border-bottom-width: 5px;
    padding-bottom: 0.25rem;
}

.btn-attention:hover {
	border-bottom-color: #ad1e40;
    border-bottom-width: 5px;
    padding-bottom: 0.25rem;
}


body.small .app-main .app-main__inner {
    padding: 2px;
}

body.small .app-page-title {
    padding: 5px 15px;
    margin: -5px -10px 0px;
}

body.small .card-body {
    padding: 2px;
}

.btn-light {
    color: #780edd;
}
.btn-light:hover {
    color: #5a09a7;
}

.app-header.header-text-light .app-header__logo .logo-src {
    background-position-x: center;
}

.app-logo {
    background-image: url(assets/images/logo-peopood.svg);
    background-repeat: no-repeat;
    height: 80px;
    width: 100%;
}

.btn-outline-alternate:hover,
.btn-outline-alternate:active,

.btn-outline-alternate:not(:disabled):not(.disabled):active,
.btn-outline-alternate:not(:disabled):not(.disabled).active,
.show>.btn-outline-alternate.dropdown-toggle {
    background-color: transparent;
    color: #780edd;
}

img.rounded-circle {
	filter: invert(1);
}

.input-group {
    white-space: nowrap;
}


/* planogramm */
.imageContainer {
	max-height: 550px;
    overflow-y: scroll;
}

#inventoryImageSection .imageContainer {
	max-height: 300px;
}

#container {
  height:801px;
  overflow:visible;
  padding:0;
  position:relative;
}

.box {
	background-color: #fff;
	text-align: center;
	font-family: Asap, Avenir, Arial, sans-serif;
	width: 49px;
	height: 74px;
	line-height: 100px;
	color: black;
	position: absolute;
	top:0;
	background-position: center;
	background-size: 140%;
	background-repeat: no-repeat;
	border: 1px solid #eee;
}

.controls {
	background-color: #222;
	border: 1px solid #555;
	color: #bbb;
	font-size: 18px;
  margin: 20px 0;
}
.controls ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
.controls li {
	display: inline-block;
	padding: 8px 0 8px 10px;
	margin:0;
}
.controls input {
  vertical-align:middle;
  cursor: pointer;
}
.controls .controlsTitle {
  border-right:1px solid #555;
  border-bottom:none;
  padding-right:10px;
}

.position .fas {
	color: #eee;
    padding-top: 30px;
    text-align: center;
    display: block;
    font-size: 16px;
    cursor: pointer;
}

.position:hover .fas {
	color: #780edd;
}

.boxDiff {
	font-size: 18px;
	width: calc(100% - 6px);
	height: 20px;
	position: absolute;
	bottom: 3px;
	left: 3px;
	padding: 0;
	text-align: center;
	line-height: 0;
	background-color: #fff;
    font-weight: 700;
	opacity: 0.8;
	border: 0;
	border-radius: 0;
}

table.modalImageSmall {
	margin-left: auto;
	margin-right: auto;
}

div.modalImageSmall {
    margin-right: 3px;
    margin-bottom: 2px;
    cursor: pointer;
    position: relative;
    display: inline-block;
    text-align: center;
    width: 50px;
    height: 75px;
    overflow: hidden;
    padding-bottom: 15px;
	border: 1px solid #ccc;
}

div.modalImageSmall img {
    height: auto;
    width: 100%;
    z-index: 10;
    max-height: 75px;
    max-width: 50px;
}

dev.modalImageSmall input {
	position: absolute;
	bottom: 1px;
	right: 0px;
	z-index: 20;
}

.modalImageSmall:not(.productReplaced):after {
    content: "";
    display: inline-block;
    background: url("/assets/images/unchecked.svg") no-repeat top right;
    width: 20px;
    height: 20px;
    position: absolute;
    bottom: 4px;
    right: calc(50% - 10px);
}

table.modalImageSmall:not(.productReplaced):after {
    right: calc(50% - 16px);
}

.modalImageSmall.selected:after {
    background: url("/assets/images/checked.svg") no-repeat top right;
    bottom: 2px;
}

.modalImageSmall.red {
	border: 2px solid red;
}
.modalImageSmall.green {
	border: 2px solid green;
}
.modalImageSmall.orange {
	border: 2px solid #FF9800;
}

div.modalImageSmall.selected {
	border: 3px solid #780edd!important;
}

div.modalImageSmall.selected.red {
    position: relative;
}

div.modalImageSmall.selected.red::before {
    content: " ";
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border: 3px solid red;
}

table.modalImageSmall.selected {
	border: 3px solid #780edd!important;
}

.modal-body {
    padding: 1rem;
}

.viewImage {
	/*
	max-width: 150px;
    max-height: 100%;
    */
	width: 100%;
    height: auto;
}

.position {
	position: absolute;
    border: 1px solid rgb(238, 238, 238);
    overflow: hidden;
}
.position .comment {
	background-color: #f00;
    height: 20px;
    right: -10px;
    position: absolute;
    top: -10px;
    width: 20px;
	transform: rotate(-45deg);
	z-index: 1040;
}
.position .remove {
	background-color: #780edd;
    height: 20px;
    left: -10px;
    position: absolute;
    top: -10px;
    width: 20px;
	transform: rotate(-45deg);
	z-index: 1040;
}


.alert.hidden {
	display: none;
}

.planogram-footer {
	padding: 8px 15px;
	color: #fff;
	background-color: #780edd;
}

.planogram-footer-sep:last-child {
	display: none;
}

.planogram-footer-sep {
	height: 60px;
	border: 1px solid #a84cff!important;
	background-color: #a84cff;
	opacity: 0.5;
}

.customer-autocomplete {
	min-width: 350px;
}

.autocomplete-suggestions {
  border: 1px solid #d0d6db;
  background: #FFF;
  cursor: default;
  overflow: auto;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}

.autocomplete-suggestion {
  padding: 6px 12px;
  white-space: nowrap;
  overflow: hidden;
}

.autocomplete-selected {
  background: #F0F0F0;
}

.autocomplete-suggestions strong {
  font-weight: normal;
  color: #780edd;
}

.card-header>.nav .nav-link.active,
.card-header>.nav .nav-link:hover {
    color: #780edd;
}
.card-header>.nav .nav-link::before {
	background: #780edd;
}

.box {
    box-shadow: inset 0px 0px 0px 1px #888;
}

.box.red {
	box-shadow: inset 0px 0px 0px 1px red;
}

.box.orange {
	box-shadow: inset 0px 0px 0px 1px #FF9800;
}

.box.green {
	box-shadow: inset 0px 0px 0px 1px green;
}

.box.black {
	box-shadow: inset 0px 0px 0px 3px black !important;
}
.box.neon {
	box-shadow: inset 0px 0px 0px 3px #ff00ff !important;
}


.findTotals h5.selected {
	border-bottom: 2px solid #fff;
}

.modal-dialog.modal-100 {
 	width: calc(100% - 40px);
    max-width: 1000px;
}

.inv-add-amount {
	color: #000;
    display: inline-block;
    padding: 2px;
    line-height: 1;
    vertical-align: top;
    background-color: rgba(255,255,255,0.5);
    font-size: 7px;
}
.inv-add-amount:empty {
	display: none;
}

.total_sum,
.total_vahe {
    color: #780edd;
    background-color: #fff;
    padding: 0 3px;
    border-radius: 3px;
}

.total_vahe {
	font-weight: 700;
}

#planogram-footer h6 span {
	font-size: 1.25rem;
    line-height: 1.5;
}

.modalImageSmall div {
	width: 50px;
    padding-top: calc(50% - 18px);
    font-size: 10px;
    overflow: hidden;
    overflow-wrap: break-word;
    vertical-align: middle;
    display: inline-block;
    height: 75px;
}

.btn-danger {
	background-color: #dd0e74;
	border-color: #dd0e74;
}

.undoRemove {
	white-space: nowrap;
}

#planogram-footer-price {
	background-color: #c30edd;
}

@media (min-width: 576px) {
	.modal-dialog.modal-lg {
	    max-width: 600px;
	}
}


.planogram .card.mb-3 {
    margin-bottom: 0 !important;
}

span.f10 {
	font-size: 10px;
	line-height: 10px !important;
	max-height: 21px;
	overflow: hidden;
	display: inline-block;
    width: 45px;
    position: absolute;
    top: 40%;
    left: 0;
    text-align: center;
}

.autoPlano span.f10 {
	font-size: 7px;
	line-height: 8px !important;
    left: -4px;
}



.deleteBtn {
	display: none;
}

tr.customer-closed td {
	text-decoration: line-through;
}

#container.autoPlano .position .fas {
	zoom: 80.25%;
}

#container.zoomedIn {
	zoom: 40%;
}
#container.zoomedIn .boxDiff {
	bottom: 6px;
	height: 24px;
}


/*
@media (max-width: 992px) {
	#container.zoomedIn .boxDiff {
		font-size: 7px;
	}

	#container.zoomedIn i.fas {
		font-size: 8px;
		padding-top: 25px;
	}

	#container.zoomedIn .f10 {
		font-size: 6px;
	}
}
*/
.boxDiff.yellow {
	background-color: #ffffab !important;
	opacity: 0.9;
}

.boxDiff.gold {
	background-color: #ff9980 !important;
	opacity: 0.9;
}

.badge {
    padding: 5px 8px !important;
}

.productAdded {
    opacity: 0.15;
}

.nuncaMostrar {
	background-color: rgba(255,255,255,0.8);
    background-blend-mode: lighten;
}

.table-inventory td {
	position: relative;
}
.table-inventory td i.fa-level-up-alt {
	position: absolute;
	top: -7px;
}

.modal-dialog.modal-dialog-centered {
	box-shadow: none !important;
}

.modal-dialog-centered .modal-content {
	box-shadow: 0 0.76875rem 2.4875rem rgb(52 58 64 / 30%), 0 1.3375rem 1.70625rem rgb(52 58 64 / 30%), 0 0.55rem 0.53125rem rgb(0 0 0 / 5%), 0 0.225rem 0.4375rem rgb(52 58 64 / 30%);
}

.productReplaced:after {
	position: absolute;
    color: #780edd;
    top: 48px;
    left: 13px;
    background-color: #fff;
    border-radius: 3px;
    border: 1px solid #a496b2;
    height: 20px;
    width: 20px;
    content: "\f362";
    padding-top: 3px;
    font-family: 'Font Awesome 5 Free'
}

@media (max-width: 991px) {
	.closed-sidebar.closed-sidebar-mobile .app-sidebar .app-header__logo, .closed-sidebar.closed-sidebar-mobile .app-header .app-header__logo {
	    width: calc(50% + 300px);
	}
}

.closed-sidebar .app-sidebar {
    z-index: 3000;
}

.font-weight-bolderer {
	font-weight: 600 !important;
}

.clickSave {
	order: 4;
	z-index: 10;
}

.clickLohista {
	order: 5;
	z-index: 10;
}

@media only screen and (max-width: 1320px) {
    .app-header-right {
        display: none !important;
    }
}

.btnZoomIn,
.btnZoomOut {
    order: 3;
}

@media (min-width: 992px) {
    .btnZoomIn,
    .btnZoomOut {
        display: none;
    }
}

.force-rounded-corners input,
.force-rounded-corners button {
	border-radius: 3px !important;
}

.force-rounded-corners h6 {
	margin: 7px 4px;
}

i.metismenu-icon.text-danger {
	opacity: 1;
}

i.metismenu-icon.text-danger {
	opacity: 0.9;
}

.vertical-nav-menu li a:hover i.metismenu-icon.text-danger {
    opacity: 1;
}

.app-page-title h5 {
	margin: 9px 0 11px 1px;
}

th {
	text-align:none;
}

.m-m2 {
	position: relative;
	top: -16px;
}

.bg-karto {
    background-color: #16aaff !important;
}

.bg-transparent {
    background-color: transparent !important;
}

.box-indicators {
    position: absolute;
    display: flex;
    align-items: center;
    top: 4px;
    right: 4px;
    z-index: 1;
    pointer-events: none;
    gap: 2px;
}

.box-indicator {
    width: 10px;
    height: 10px;
    display: block;
    border-radius: 50%;
}