/*------------------------------------
- BASE values
------------------------------------*/
* {
	margin:0px;
	padding:0px;
	text-decoration:none;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:1em;
	-webkit-appearance: none;
	color:#000000;
}

html,
body {
	height: 100%;
	background-color: #fcfcfc;

}

/*------------------------------------
- Fonts
------------------------------------*/
@font-face {
	font-family: "BarCodeFont";
	src: url(../fonts/barcode.ttf) format("truetype");
}


/*------------------------------------
- TEMP
------------------------------------*/

.choices__list {
	text-align: start;
}

html,body {
	background-size: cover;
	background-repeat: no-repeat;
	height: 100%;
}

.container {
	height: 100%;
	align-content: center;
}

.loginCard {
	height: auto;
	margin-top: auto;
	margin-bottom: auto;
	width: 400px;
	background-color: rgba(0,0,0,0.5);
}

.social_icon span:hover {
	color: white;
	cursor: pointer;
}

.card-header h3 {
	color: white;
}

#login, #password {

}

#forgotPasswordButton, #forgotBackButton {
	text-decoration: none;
}


.codePart {
	font-size: 20px;
	font-weight: 800;
	text-align: center;
}


.bigIcon {
	font-size: 25px;
}



.avatar {
	position: relative;
	width: 2.375rem;
	height: 2.375rem;
	cursor: pointer;
}
.avatar img {
	width: 100%;
	height: 100%;
}
.avatar .avatar-initial {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	text-transform: uppercase;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	background-color: #8592a3;
	font-weight: 700;
}
.avatar.avatar-online:after, .avatar.avatar-offline:after, .avatar.avatar-away:after, .avatar.avatar-busy:after {
	content: "";
	position: absolute;
	bottom: 0;
	right: 3px;
	width: 8px;
	height: 8px;
	border-radius: 100%;
	box-shadow: 0 0 0 2px #fff;
}
.avatar.avatar-online:after {
	background-color: #71dd37;
}
.avatar.avatar-offline:after {
	background-color: #8592a3;
}
.avatar.avatar-away:after {
	background-color: #ffab00;
}
.avatar.avatar-busy:after {
	background-color: #ff3e1d;
}

#logo {
	float:left;
}

.mainHeaderDarkBg {
	/*background-color: #32373a;*/
}

#personalTotals {
	width: 100%;
}

.accordionForMenu {
	padding: 0;
}

.disabledMenuItem {
	color:#f18721 !important;
	text-decoration: line-through;
}


/*------------------------------------
- EO TEMP
------------------------------------*/
/*------------------------------------
- COLOR primary
------------------------------------*/
.alert-primary {
	color: #8e4a08;
	background-color: #fdeee0;
	border-color: #fbe4cd;
}

.alert-primary hr {
	border-top-color: #fad7b5;
}

.alert-primary .alert-link {
	color: #5e3105;
}

.badge-primary {
	color: #212529;
	background-color: #f18721;
}

.badge-primary[href]:hover, .badge-primary[href]:focus {
	color: #212529;
	background-color: #d16d0d;
}

.bg-primary {
	background-color: #f18721 !important;
}

a.bg-primary:hover, a.bg-primary:focus,
button.bg-primary:hover,
button.bg-primary:focus {
	background-color: #d16d0d !important;
}

.border-primary {
	border-color: #572d0a !important;
}

.btn-primary {
	color: #212529;
	background-color: #f18721;
	border-color: #f18721;
}

.btn-primary:hover {
	color: #212529;
	background-color: #e0750e;
	border-color: #572d0a;
}

.btn-primary:focus, .btn-primary.focus {
	box-shadow: 0 0 0 0.2rem rgba(241, 135, 33, 0.5);
}

.btn-primary.disabled, .btn-primary:disabled {
	color: #212529;
	background-color: #f18721;
	border-color: #f18721;
}

.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, .show > .btn-primary.dropdown-toggle {
	color: #212529;
	background-color: #d16d0d;
	border-color: #c3660c;
}

.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-primary.dropdown-toggle:focus {
	box-shadow: 0 0 0 0.2rem rgba(241, 135, 33, 0.5);
}

.btn-outline-primary {
	color: #f18721 !important;
	background-color: transparent !important;
	border-color: #f18721 !important;
}

.btn-outline-primary:hover {
	color: #212529 !important;
	background-color: #f18721 !important;
	border-color: #f18721 !important;
}

.btn-outline-primary:focus, .btn-outline-primary.focus {
	box-shadow: 0 0 0 0.2rem rgba(241, 135, 33, 0.5);
}

.btn-outline-primary.disabled, .btn-outline-primary:disabled {
	color: #f18721;
	background-color: transparent;
}

.btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active, .show > .btn-outline-primary.dropdown-toggle {
	color: #212529 !important;
	background-color: #f18721 !important;
	border-color: #f18721 !important;
}

.btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-primary.dropdown-toggle:focus {
	box-shadow: 0 0 0 0.2rem rgba(241, 135, 33, 0.5);
}

.list-group-item-primary {
	color: #8e4a08;
	background-color: #fbe4cd;
}

.list-group-item-primary.list-group-item-action:hover, .list-group-item-primary.list-group-item-action:focus {
	color: #8e4a08;
	background-color: #fad7b5;
}

.list-group-item-primary.list-group-item-action.active {
	color: #212529;
	background-color: #8e4a08;
	border-color: #8e4a08;
}

.table-primary,
.table-primary > th,
.table-primary > td {
	background-color: #fbe4cd;
}

.table-hover .table-primary:hover {
	background-color: #fad7b5;
}

.table-hover .table-primary:hover > td,
.table-hover .table-primary:hover > th {
	background-color: #fad7b5;
}

.text-primary {
	color: #f18721 !important;
}

a.text-primary:hover, a.text-primary:focus {
	color: #d16d0d !important;
}


/*------------------------------------
- Elements
------------------------------------*/
.mainContent {
	background-color: #fcfcfc;
}

/*------------------------------------
- Elements
------------------------------------*/
.header {
	margin-bottom: 0 !important;
}

.nav-link {
	color:#000;
	pointer-events: auto;
	cursor: pointer;
}

.nav-link:hover {
	color: #8e4a08;
}

.buttonmenu .nav-item,
.productbuttonmenu .nav-item,
.customerbuttonmenu .nav-item {
	margin: 5px;
}

.list-group-item {
	pointer-events: auto;
	cursor: pointer;
}

.input-group-prepend {
	width : 35%;
}

.input-group-prepend label {
	width: 100%;
	overflow: hidden;
}

.hiddenDiv {
	display: none;
}

.disabledDiv {
	pointer-events: none;
	opacity: 0.4;
}

.list-group-item.active {
	background-color: #f18721;
}

.text-bg-primary {
	background-color: #f18721 !important;
}

.accordion-button:not(.collapsed) {
	background-color: #eaecef;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
	background-color: #f18721;
}

.tab-pane {
	padding-top: 5px;
}

#popupContent {
	min-height: 300px;
}


.tox-statusbar__branding {
	display: none;
}

.hoverCardProduct, .hoverCardCustomer {
	position: fixed;
	margin-top: -190px;
}

.hoverCardProduct {
	width: 42.2%;
}

.hoverCardCustomer {
	width: 50%;
}


input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* Firefox */
input[type=number] {
	-moz-appearance: textfield;
}

.subtext {
	font-size: 11px;
}

.inlaidContent {
	width: 100%;
	min-height:400px;
	border:2px solid #dddddd;
	padding:1%;
	background-color:#ffffff;
	overflow-y: auto;
}

/*------------------------------------
- Pagination
------------------------------------*/
.pagination > li > a
{
	background-color: white;
	color: #f18721;
}

.pagination > li > a:focus,
.pagination > li > a:hover,
.pagination > li > span:focus,
.pagination > li > span:hover
{
	color: #5a5a5a;
	background-color: #eee;
	border-color: #ddd;
}

.pagination > .active > a
{
	color: white;
	background-color: #f18721 !Important;
	border: solid 1px #f18721 !Important;
}

.pagination > .active > a:hover
{
	background-color: #f18721 !Important;
	border: solid 1px #f18721;
}

/*------------------------------------
- Tickets
------------------------------------*/

.media {
	position: relative;
	padding: 0 0 0 20px;
}
.media img {
	width: 75px;
	height: 75px;
	display: block;
	border-radius: 50%;
}

.testimonial-wrapper {
	padding: 0 10px;
}

.testimonial-l, .testimonial-r {
	color: #808080;
	position: relative;
	padding: 15px;
	background: #f1f1f1;
	border: 1px solid #efefef;
	border-radius: 3px;
	margin-bottom: 15px;
	min-height: 100px;
}
.testimonial-l::after, .testimonial-r::after {
	content: "";
	width: 15px;
	height: 15px;
	display: block;
	background: #f1f1f1;
	border: 1px solid #efefef;
	border-width: 0 0 1px 1px;
	position: absolute;
	bottom: -8px;
	transform: rotateZ(-46deg);
}

.testimonial-l::after {
	left: 2%;
}

.testimonial-r::after {
	left: 80%;
}

.adminResponse {
	border: 1px solid #f18721;
}

.overview-l {
	padding: 3px 0 0 1%;
}
.overview-r {
	padding: 3px 0 0 80%;
}
.overview-l .details, .overview-r .details {
	padding: 5px 0 8px;
}
.overview-l b, .overview-r b {
	text-transform: uppercase;
	color: #f18721;
}

#imageHorizontalScroll {
	width: 100%;
	height: 105px;
	white-space: nowrap;
	position: relative;
	overflow-x: scroll;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	margin-bottom: 5px;
}

#imageHorizontalScroll a {
	width: auto;
	border: 2px solid #eee;
	float: none;
	height: 90%;
	margin: 0 0.25%;
	display: inline-block;
	zoom: 1;
}

#imageHorizontalScroll a:hover {
	opacity: 0.5;
}

/*------------------------------------
- Autocomplete
------------------------------------*/
.autocomplete-suggestions {
	border: 1px solid #999;
	background: #FFF;
	overflow: auto;
}
/*.autocomplete-suggestion {*/
/*	padding: 2px 10px;*/
/*	white-space: nowrap;*/
/*	overflow: hidden;*/
/*}*/


.autocomplete-suggestion {
	padding: 2px 10px;
	height: 30px;
	white-space: nowrap;
	overflow: hidden;
	position: relative;
	display: block;
	text-decoration: none;
	border-bottom: 1px solid #efefef;

}

.autocomplete-selected {
	background: #F0F0F0;
}
.autocomplete-suggestions strong {
	font-weight: 800;
	color: #f18721;
}
.autocomplete-group {
	padding: 2px 10px;
}
.autocomplete-group strong {
	display: block;
	border-bottom: 1px solid #000;
}

/*------------------------------------
- LOGIN Form
------------------------------------*/
.form-signin {
	max-width: 330px;
	padding: 1rem;
}

.form-signin .form-floating:focus-within {
	z-index: 2;
}

.form-signin input[type="email"] {
	margin-bottom: -1px;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
}

.form-signin input[type="password"] {
	margin-bottom: 10px;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}



/*------------------------------------
- Portal
------------------------------------*/

.portal #welcome {
	width:50%;
	margin: 100px auto;
}

.portal #welcome h1, .portal #signup h1 {
	width: 100%;
	text-align: center;
	font-size: 4em;
	font-weight: 800;
	color:#6f7170;
}

.portal #welcome img {
	display: block;
	margin:0px auto;
	width:50%;
}


/*------------------------------------
- POS
------------------------------------*/
#posRight {
	width:100%;
	float:left;
	height:400px;
	border:2px solid #dddddd;
	padding:1%;
	background-color:#ffffff;
	overflow-y: auto;
}

#posTotals #total {
	width:200px;
	height:auto;
	float:right;
	font-size:16px;
	font-weight:800;
	text-align:right;
}

#posTotals #total .tax {
	width:200px;
	height:auto;
	float:right;
	font-size:12px;
	font-weight:600;
}


/*------------------------------------
- Sales
------------------------------------*/

#saleLink p {
	width:auto;
	padding: 0px 10px;
	float:left;
}

#saleProduct {
	width: 100%;
}


/*------------------------------------
- Patternlock
------------------------------------*/
svg.patternlock g.lock-lines line {
	stroke-width: 1.5;
	stroke: black;
	opacity: 0.5;
}

svg.patternlock g.lock-dots circle {
	stroke: transparent;
	fill: black;
	stroke-width: 13.5;
}

svg.patternlock g.lock-actives circle {
	fill: black;
	opacity: .2;
	animation: lock-activate-dot .15s 0s ease 1;
	transform-origin: center;
}

svg.patternlock g.lock-lines line {
	stroke-width: 1.5;
	stroke-linecap: round;
}

svg.patternlock.success g.lock-actives circle {
	fill: green;
}

svg.patternlock.error g.lock-actives circle {
	fill: red;
}

@keyframes lock-activate-dot {
	0% {
		transform: scale(0);
	}
	75% {
		transform: scale(1.1);
	}
	100% {
		transform: scale(1.0);
	}
}



/*------------------------------------
- Canvas JS
------------------------------------*/
.canvasjs-chart-canvas {
	/*background-color: #fcfcfc;*/
}

.canvasjs-chart-credit {
	display: none;
}


/* Remove all Bootstrap default accordion styling */
.seamless-accordion,
.seamless-accordion .accordion-item,
.seamless-accordion .accordion-button {
	background-color: transparent !important;
	border: none !important;
	box-shadow: none !important;
	color: inherit !important;
}

/* Make the button look like a regular list item */
.seamless-button {
	font-size: 0.9rem;
	padding-left: 1rem;
	transition: background 0.2s;
}

.seamless-button:hover {
	background-color: rgba(0,0,0,0.05) !important;
}

/* Hide the default Bootstrap chevron */
.seamless-button::after {
	display: none !important;
}

/* Custom icon rotation */
.accordion-icon {
	transition: transform 0.2s ease;
	font-size: 0.7rem;
}

.seamless-button:not(.collapsed) .accordion-icon {
	transform: rotate(90deg);
}

/* Indentation line to show depth */
.accordion-body {
	border-left: 1px solid #dee2e6;
	margin-left: 0.75rem;
}