@import "common-variables.css";

/*
There are several copies of this file:

* <repo>\Source\LentuneClient\src\common\resources\css\main\lt-base.css
  This is the master file. Make all your changes there.

* <repo>\Source\lt-angular-workspace\projects\lt-angular-lib\styles\copied-css\lt-base.css
  This is a copy for angular.
  It gets created/updated if you run `npm run prebuild` in the angular project.

* <repo>\Source\LentuneClient\css\main\lt-base.css
  I don't know what this is, but don't edit it. It gets overwritten every time the master file changes.

*/

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
	font-family: "Figtree", sans-serif;
}

::-webkit-scrollbar {
	width: 15px;
}

::-webkit-scrollbar-track {
	background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
	background: #cccccc;
}

/* :root {
	--customer-color-1: #d82b30;
} */

html,
body,
.lt-full-height {
	height: 100%;
	font-size: max(10px, min(1.4vw, 14px));
}

.lt-full-width {
	width: 100%;
}

.lt-row-flex-container {
	display: flex !important;
	flex-flow: row;
}

.lt-column-flex-container {
	display: flex !important;
	flex-flow: column;
}

.lt-column-flex-container>.lt-flex-content.container-fluid {
	margin: 0;
}

.container-no-margin {
	padding-left: 15px;
	padding-right: 15px;
	padding-top: 15px;
}

.lt-flex-content {
	flex: 1;
	overflow-y: auto;
}

.lt-overflow-x-hidden {
	overflow-x: hidden;
}

.lt-overflow-y-hidden {
	overflow-y: hidden;
}

body:has(.lt-full-screen) lt-navigation-bar,
body:has(.lt-full-screen) lt-quick-navigation-bar {
	display: none;
}

body:has(.lt-full-screen) #main-router-view-container {
	padding: 0 !important;
}

#main-router-view-container.valinor-router-view-container {
	background: var(--background-primary);
}

#main-router-view-container.valinor-router-view-container {
	background: var(--background-primary);
	/* 59px is the width of the side nav bar. Fixes twitching bug on https://lentune.atlassian.net/browse/DEV-17050 */
	max-width: calc(100vw - 60px);
}

#main-router-view-container.valinor-router-view-container.no-navigation-bar {
	background: var(--background-primary);
	max-width: 100vw;
}

#main-router-view-container:has(review-ds-payable-invoice),
#main-router-view-container:has(review-ds-payable-invoice-legacy) {
	padding: 0px 0px 1px 0px !important;
	overflow-x: hidden !important;
}

#main-router-view-container:has(.full-height-router-view) {
	overflow: hidden;
}

#main-router-view-container:has(review-ds-payable-invoice) router-view,
#main-router-view-container:has(review-ds-payable-invoice-legacy) router-view,
#main-router-view-container:has(.full-height-router-view) router-view,
review-ds-payable-invoice,
review-ds-payable-invoice-legacy,
.full-height-router-view {
	display: block;
	height: 100%;
}

lt-doc-viewer-ds-payable-invoice {
	display: block;
}

lt-label {
	/* font-size: 12px; */
	font-weight: bold;
	/* color: #191f20; */
	color: brown;
}

.lt-grid-disabled {
	pointer-events: none;
}

label.btn.disabled {
	pointer-events: none;
}

.lt-label {
	/* font-size: 12px; */
	font-weight: bold;
	/* color: #191f20; */
	color: brown;
}

.lt-input {
	/*font-weight:bold;*/
	/* color: #191f20; */
	color: red;
}

lt-input {
	/*font-weight:bold;*/
	/* color: #191f20; */
	color: red;
}

.lt-bar-chart {
	overflow-x: auto;
	margin-top: 15px;
	padding: 15px
}

.lt-bar-chart-container {
	box-sizing: border-box;
	width: 100%;
	background-color: #ddd;
	margin-bottom: 5px;
	display: table;
}

.lt-bar-chart-label {
	padding-right: 5px;
}

.lt-bar-chart-key {
	margin-bottom: 15px;
}

.lt-bar-chart-key-color {
	width: 20px;
}

.lt-bar-chart-key-label {
	padding-left: 5px;
	padding-right: 15px;
}

.lt-table {
	display: table;
}

.lt-table-row {
	display: table-row;
}

.lt-table-cell {
	display: table-cell;
}

.lt-bar-chart-bar {
	display: table-cell;
	text-align: right;
	padding-top: 1px;
	padding-bottom: 1px;
	color: white;
	font-size: max(10px, min(1.1vw, 11px));
}

.lt-dropdown-content {
	display: none;
	position: absolute;
	background-color: #fff;
	min-width: 160px;
	min-height: 200px;
	padding: 0;
	width: inherit;
	z-index: 2100;
	border: 1px solid #ccc;
	position: fixed;
}

.lt-dropdown-content-aurelia {
	min-height: auto;
	height: 605px;
}

.lt-dropdown-content .list-group-item:first-child {
	border-top: 0;
}

.lt-link,
.lt-dropdown-content a {
	cursor: pointer;
}

.lt-dropdown-content .list-group-item {
	border-radius: 0;
	border-left: 0;
	border-right: 0;
}

.lt-dropdown-content .list-group {
	margin-bottom: 0;
}

.lt-combo-box .dropdown-toggle {
	height: var(--form-input-height);
}

.lt-combo-box .dropdown-toggle.resizable-button {
	height: max(22px, min(3.4vw, var(--form-input-height)));
}

.ui-pnotify .alert {
	margin-bottom: 0;
}

.modal {
	text-align: center;
	z-index: 3000;
}

.modal:before {
	content: '';
	display: inline-block;
	height: 100%;
	vertical-align: middle;
	margin-right: -4px;
}

.modal-dialog {
	display: inline-block;
	text-align: left;
	vertical-align: middle;
}

.lt-standard-dialog-layout .dialog-header-content {
	border-bottom: 1px solid #e5e5e5;
}

.dialog-header-content {
	padding: 10px 15px;
}

.dialog-close-icon {
	cursor: pointer;
	font-size: 14px;
}

.lt-standard-dialog-layout {
	max-height: 95vh;
}

.lt-standard-dialog-layout .secondary-navigation>li>a,
.lt-standard-dialog-layout .primary-navigation>li>a,
.lt-standard-dialog-layout .btn {
	font-size: 14px;
}

.lt-standard-dialog-layout .input-group-btn>button,
.lt-standard-dialog-layout .single-option,
.lt-standard-dialog-layout .lt-combo-box .dropdown-toggle .lt-standard-dialog-layout .form-control {
	height: var(--form-input-height);
}

.lt-standard-dialog-layout .form-control {
	font-size: var(--form-input-font-size);
	height: var(--form-input-height);
}

.lt-standard-dialog-layout .dialog-body-container {
	padding: 48px;
	max-height: 75vh;
	overflow-y: auto;
}

.dialog-footer-container:not(lt-confirm-cancel-footer .dialog-footer-container) {
	border-top: 1px solid #e5e5e5;
}

.dialog-footer-container {
	padding: 10px 13px;
}

ux-dialog-body.dialog-body-narrow {
	width: min(832px, 95vw);
}

ux-dialog-body.dialog-body-medium {
	width: min(1232px, 75vw);
}

ux-dialog-body.dialog-body-wide {
	width: 95vw;
}

ux-dialog:has(.dialog-body-wide) {
	left: 2vw !important;
}

ux-dialog-body {
	max-height: 85vh;
	overflow-y: auto;
}

.lt-image-thumbnail {
	border: solid 1px #4a4a4a;
	width: 100%;
	max-height: 150px;
	object-fit: cover;
	margin-bottom: 15px;
	cursor: pointer;
}

/* proto.oi do not know where to put this? */

.onoffswitch {
	position: relative;
	width: 90px;
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
}

.onoffswitch-checkbox {
	display: none;
}

.onoffswitch-label {
	display: block;
	overflow: hidden;
	cursor: pointer;
	border: 2px solid #999999;
	border-radius: 20px;
}

.onoffswitch-inner {
	display: block;
	width: 200%;
	margin-left: -100%;
	transition: margin 0.3s ease-in 0s;
}

.onoffswitch-inner:before,
.onoffswitch-inner:after {
	display: block;
	float: left;
	width: 50%;
	height: 30px;
	padding: 0;
	line-height: 30px;
	font-size: max(10px, min(1.4vw, 14px));
	color: white;
	font-family: "Figtree", sans-serif;
	font-weight: bold;
	box-sizing: border-box;
}

.onoffswitch-inner:before {
	content: "ON";
	padding-left: 10px;
	background-color: #34A7C1;
	color: #FFFFFF;
}

.onoffswitch-inner:after {
	content: "OFF";
	padding-right: 10px;
	background-color: #EEEEEE;
	color: #999999;
	text-align: right;
}

.onoffswitch-switch {
	display: block;
	width: 22px;
	margin: 4px;
	background: #FFFFFF;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 56px;
	border: 2px solid #999999;
	border-radius: 20px;
	transition: all 0.3s ease-in 0s;
}

.onoffswitch-checkbox:checked+.onoffswitch-label .onoffswitch-inner {
	margin-left: 0;
}

.onoffswitch-checkbox:checked+.onoffswitch-label .onoffswitch-switch {
	right: 0px;
}

.lt-form-group {
	margin-bottom: 10px;
}

.lt-form-group label {
	margin-bottom: 0px;
}

.jqx-notification-icon {
	display: none;
}

.lt-notification-title {
	font-weight: bold;
	padding-bottom: 5px;
}

.lt-container {
	padding-top: 15px;
	padding-bottom: 15px;
	width: 100%;
}

.timeline {
	position: relative;
	margin-top: 4px;
	margin-bottom: 30px;
}

.timeline .line {
	position: absolute;
	width: 4px;
	display: block;
	background: currentColor;
	top: 0px;
	bottom: 0px;
	margin-left: 30px;
}

.timeline .separator {
	border-bottom: 1px solid currentColor;
	padding: 5px;
	padding-left: 40px;
	font-style: italic;
	font-size: .9em;
	margin-left: 30px;
	text-align: center;
}

.timeline .line::before {
	top: -4px;
}

.timeline .line::after {
	bottom: -4px;
}

.timeline .line::before,
.timeline .line::after {
	content: '';
	position: absolute;
	left: -4px;
	width: 12px;
	height: 12px;
	display: block;
	border-radius: 50%;
	background: currentColor;
}

.timeline .panel {
	position: relative;
	margin: 10px 0px 21px 70px;
	clear: both;
}

.timeline .panel::before {
	position: absolute;
	display: block;
	top: 8px;
	left: -24px;
	content: '';
	width: 0px;
	height: 0px;
	border: inherit;
	border-width: 12px;
	border-top-color: transparent;
	border-bottom-color: transparent;
	border-left-color: transparent;
}

.timeline .panel .panel-heading.icon * {
	font-size: 20px;
	vertical-align: middle;
	line-height: 40px;
}

.timeline .panel .panel-heading.icon {
	position: absolute;
	left: -59px;
	display: block;
	width: 40px;
	height: 40px;
	padding: 0px;
	border-radius: 50%;
	text-align: center;
	float: left;
}

.timeline .panel-outline {
	border-color: transparent;
	background: transparent;
	box-shadow: none;
}

.timeline .panel-outline .panel-body {
	padding: 10px 0px;
}

.timeline .panel-outline .panel-heading:not(.icon),
.timeline .panel-outline .panel-footer {
	display: none;
}

.lt-tag {
	border-radius: 30px;
	padding-left: 15px;
	padding-right: 15px;
	color: #000000;
	display: inline-block;
}

.lt-tag-primary {
	background-color: #337AB7;
	border-radius: 30px;
	padding-left: 15px;
	padding-right: 15px;
	color: #ffffff;
	display: inline-block;
}

.lt-tag-primary .btn-link {
	color: #ffffff;
}

.btn-link {
	max-width: 100%;
}

.btn-link a {
	max-width: 100%;
	text-overflow: ellipsis;
	overflow: hidden;
	display: inline-block;
}


.btn-tertiary-cta-dark,
.btn-tertiary-cta-dark.active,
.btn-tertiary-cta-dark:active {
	font-size: 14px !important;
	font-weight: 600 !important;
	background-color: transparent;
	border: none;
	color: var(--text-black-primary);
}

.btn-tertiary-cta-dark[disabled],
.btn-tertiary-cta-dark.disabled,
.btn-tertiary-cta-dark:disabled {
	font-size: 14px !important;
	font-weight: 600 !important;
	background-color: transparent;
	border: none;
	color: var(--brand-text-black-disabled);
}

.btn-tertiary-cta-dark:not([disabled]):hover,
.btn-tertiary-cta-dark.active:not([disabled]):hover {
	font-size: 14px !important;
	font-weight: 600 !important;
	background-color: transparent;
	border: none;
	color: var(--brand-purple2);
}

.btn-tertiary-cta-dark:not([disabled]):focus,
.btn-tertiary-cta-dark.active:not([disabled]):focus {
	font-size: 14px !important;
	font-weight: 600 !important;
	background-color: transparent;
	border: none;
	color: var(--text-black-secondary);
}

.btn-tertiary-cta,
.btn-tertiary-cta.active,
.btn-tertiary-cta:active {
	font-size: 13px !important;
	font-weight: 600 !important;
	background-color: transparent;
	border: none;
	color: var(--brand-purple2);
}

.btn-tertiary-cta[disabled],
.btn-tertiary-cta.disabled,
.btn-tertiary-cta:disabled {
	font-size: 13px !important;
	font-weight: 600 !important;
	background-color: transparent;
	border: none;
	color: var(--brand-tertiary-link-disabled);
}

.btn-tertiary-cta:not([disabled]):hover,
.btn-tertiary-cta.active:not([disabled]):hover {
	font-size: 13px !important;
	font-weight: 600 !important;
	background-color: transparent;
	border: none;
	color: var(--brand-purple-hover);
}

.btn-tertiary-cta:not([disabled]):focus,
.btn-tertiary-cta.active:not([disabled]):focus {
	font-size: 13px !important;
	font-weight: 600 !important;
	background-color: transparent;
	border: none;
	color: var(--brand-lilac);
}

.jqx-notification-container {
	z-index: 1000000000;
}

.lt-home-div {
	width: auto;
	min-height: calc(100% + 30px);
	margin-left: -15px;
	margin-right: -15px;
	margin-top: -15px;
	margin-bottom: -15px;
	padding-bottom: 16px;
}

.lt-home-content {
	overflow: auto;
	padding-top: 15px;
}

.lt-home-nav-left {
	overflow: hidden;
}

.lt-home-nav-left .btn.btn-link {
	border: none;
	width: 100%;
	text-align: left;
	margin-top: 3px;
	margin-bottom: 3px;
	padding-left: 15px;
	padding-right: 15px;
	white-space: normal;
}

.lt-home-nav-left .btn.btn-link:hover,
.lt-home-nav-left .btn.btn-link:focus {
	text-decoration: none;
}

.lt-home-nav-left div .sub-menu-box-header {
	margin: 23px 0px 10px 6px;
}

.sub-menu-box-header .fa {
	font-size: 14px;
}

.sub-menu-box {
	background-color: #fafafa;
	border-radius: 5px;
	margin-left: 6px;
	padding-top: 10px;
	padding-bottom: 10px;
}

.lt-home-right {
	border: solid var(--token-divider);
	border-width: 0px 0px 0px 1px;
	height: 100%;
	min-height: calc(100vh - 113px);
}

lt-menu .btn {
	border-bottom-right-radius: 0px !important;
	border-bottom-left-radius: 0px !important;
	height: 35px;
	margin-top: 7px;
}

lt-menu .lt-menu-title {
	padding-top: 13px;
	padding-bottom: 13px;
}

.lt-menu-lv1>ul {
	background-color: #0066A5 !important;
}

.lt-menu-lv1>ul>li>a {
	font-weight: bolder !important;
	color: #FFFFFF;
}

.lt-menu-lv1>ul>li.active>a,
.lt-menu-lv1>ul>li.active>a:focus,
.lt-menu-lv1>ul>li.active>a:hover {
	background-color: #0275BD !important;
}

.lt-menu-lv2>ul {
	background-color: #0275BD !important;
}

.lt-menu-lv2>ul>li>a {
	font-weight: bolder !important;
	color: #FFFFFF;
}

.lt-menu-lv2>ul>li.active>a,
.lt-menu-lv2>ul>li.active>a:focus,
.lt-menu-lv2>ul>li.active>a:hover {
	color: #0275BD !important;
	background-color: #ffffff !important;
}

lt-menu .nav-pills>li+li {
	margin-left: 0px !important;
}

.jqx-rc-all-bootstrap {
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	border-radius: 0;
}

.jqx-grid,
.jqx-grid-column-header,
.jqx-grid-cell {
	border-style: none;
}

.jqx-grid-cell-bootstrap.jqx-item .jqx-input-bootstrap.jqx-widget-content {
	background: #66afe9;
	border-color: #0275BD;
}

.jqx-widget-header-bootstrap {
	background-color: var(--customer-color-1);
	color: #fff;
}

.jqx-grid-column-sortascbutton {
	color: #ffffff;
}

.jqx-grid-column-sortascbutton-bootstrap,
.jqx-expander-arrow-bottom-bootstrap,
.jqx-window-collapse-button-bootstrap,
.jqx-menu-item-arrow-up-bootstrap,
.jqx-menu-item-arrow-up-selected-bootstrap,
.jqx-menu-item-arrow-top-up-bootstrap,
.jqx-icon-arrow-up-bootstrap,
.jqx-icon-arrow-up-hover-bootstrap,
.jqx-icon-arrow-up-selected-bootstrap {
	background-image: url(../../images/icon-up.png);
}

.jqx-widget-bootstrap .jqx-grid-group-expand-bootstrap,
.jqx-grid-group-expand-bootstrap,
.jqx-grid-column-menubutton-bootstrap,
.jqx-grid-column-sortdescbutton-bootstrap,
.jqx-expander-arrow-top-bootstrap,
.jqx-window-collapse-button-collapsed-bootstrap,
.jqx-menu-item-arrow-down-bootstrap,
.jqx-menu-item-arrow-down-selected-bootstrap,
.jqx-menu-item-arrow-down-bootstrap,
.jqx-icon-arrow-down-bootstrap,
.jqx-icon-arrow-down-hover-bootstrap,
.jqx-icon-arrow-down-selected-bootstrap {
	background-image: url(../../images/icon-down.png);
}

.jqx-grid-column-menubutton {
	background-image: url(../../images/icon-menu-small-white.png) !important;
}

.jqx-grid-cell a {
	color: #0275bd;
}

.jqx-grid-cell a .glyphicon-trash {
	color: #d9534f;
}

.jqx-grid-cell a .glyphicon-exclamation-sign {
	color: orange;
}

.jqx-grid-cell a .glyphicon-plus {
	color: #5cb85c;
}

.lt-tab-margin {
	margin-bottom: 5px;
}

.lt-tabs {
	margin-bottom: 2px;
	border-bottom: 0px;
	flex: 100;
}

.lt-tabs>li>a {
	border: none !important;
	border-bottom: 3px solid transparent !important;
	min-height: 40px;
	padding-bottom: 8px !important;
	padding-top: 8px !important;
}

.lt-space {
	height: 57px;
}

.lt-prompt,
.lt-table-label,
.lt-validation-error {
	font-size: 12px;
	font-weight: 600;
	color: var(--text-black-primary);
}

.lt-prompt {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	height: 15px;
}

.lt-validation-error {
	color: #d9534f;
}

.lt-table-label {
	padding-right: 8px;
}

.lt-dialog-body {
	padding: 15px;
}

.lt-box-heading,
.lt-shade-heading {
	font-size: max(10px, min(1.2vw, 12px));
	margin-top: 3px;
	margin-bottom: 3px;
	font-weight: bold;
	align-content: end;
}

.lt-box,
.lt-box-grey {
	background-color: #fafafa;
	padding: 15px;
	display: inline-block;
	width: 100%;
	border: none;
	line-height: 1.42857143;
}

.lt-box-thin-padding .lt-box {
	padding: 10px 10px 0px 10px !important;
}

.lt-box-collapsed {
	padding: 5px;
}

.lt-shade {
	background-color: #fafafa;
	padding: 15px;
}


.lt-detail-block {
	background-color: #F4F4F4;
	padding-top: 15px;
	padding-bottom: 15px;
}

.lt-detail-block-grid-align {
	margin-top: 5px;
}

.lt-detail-block-dark {
	background-color: #e0e0e0;
	padding-top: 15px;
	padding-bottom: 15px;
}

.lt-margin-block-v {
	margin-top: 5px;
	margin-bottom: 5px;
}

.lt-margin-block-h {
	margin-left: 5px;
	margin-right: 5px;
}

.lt-section-space-line {
	height: 15px;
}

.lt-form-group>input:disabled {
	border: none;
	box-shadow: none;
	background-color: transparent;
	/* text-align: left !important; */
	padding-left: 0px;
	padding-right: 0px;
}

.lt-form-group>textarea {
	padding: 8px 12px;
	width: 100%;
	height: 88px;
	border-radius: 4px;
	border: 1px solid #ccc
}

.lt-form-group>textarea:disabled {
	border: none;
	box-shadow: none;
	background-color: var(--brand-grey-50);
	text-align: left !important;
	padding: 8px 12px;
	resize: none
}

.lt-content {
	padding-top: 10px;
}

.lt-fieldset {
	border: 1px #cccccc solid;
	border-radius: 4px;
}

.lt-fieldset>legend {
	border: none;
	margin-left: 20px;
	width: auto;
	margin-bottom: 0px;
}

.lt-jqx-scheduler-cell-highlight {
	border-color: #3f7ebe !important;
	background: #a2c0df !important;
}

.lt-scheduler-heightlight {
	background-color: #c1ffb6;
}

.jqx-scheduler-appointment-bootstrap {
	background-color: transparent !important;
	border-color: transparent !important;
}

.lt-red-text {
	color: #d9534f;
}

.lt-green-text {
	color: #008000;
}

.lt-gray-text {
	color: gray;
}

.lt-orange-text {
	color: #ffa500;
}

.lt-green-text-important {
	color: #008000 !important;
}

.lt-orange-text-important {
	color: #ffa500 !important;
}

.lt-red-text-important {
	color: #d9534f !important;
}

.lt-lilac-text-800,
.lt-lilac-text-700 {
	color: var(--brand-lilac);
}

.lt-lilac-text-800 {
	font-weight: 800 !important;
}

.lt-lilac-text-700 {
	font-weight: 700 !important;
}

.jqx-grid-cell-selected .lt-green-text {
	color: white;
}

.lt-warning-text {
	color: var(--text-warning-default);
	font-weight: 600;
	font-size: 12px;
}

/* lt-navigation-bar styling */

nav,
nav a {
	color: #515151;
}

nav .nav-pills>li+li {
	margin-left: 0px;
}

nav li:hover {
	cursor: default;
}

.navbar-header {
	background-color: #FFF;
	float: left;
	width: 200px;
}

.navbar-header.active {
	background-color: #FFF;
}

.navbar-brand {
	font-size: max(10px, min(2vw, 20px));
	color: #ffffff;
	padding: 12px 30px 0px 30px;
	height: 50px;
}

.navbar-brand-valinor {
	padding: 12px 19px 12px 19px;
	height: 50px;
	display: block;
	margin-right: 0 !important;
}

.navbar-valinor {
	border-bottom: 1px solid var(--valinor-border);
}

.primary-navigation {
	background-color: #ffffff;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap-reverse;
	padding-top: 2px;
}

.primary-navigation li {
	height: 24px;
	margin-top: 0px;
	border-width: 1px 1px 0px 1px;
	color: #4a4a4a;
	border-color: #cccccc;
	border-style: solid;
	border-radius: 4px 4px 0px 0px;
	margin-right: 1px;
}

.primary-navigation>li>a {
	height: 23px;
	display: inline-block;
	max-width: calc(100vw - 300px);
	overflow: hidden;
}

/* first tab will be Home icon */
.primary-navigation>li:first-of-type>a {
	padding-left: 16px;
	padding-right: 16px;
}

.primary-navigation>li>a,
.primary-navigation>li>a:hover,
.primary-navigation>li>a:focus {
	background-color: transparent;
}

.primary-navigation>li.active,
.primary-navigation>li.active>a,
.primary-navigation>li.active>a:hover,
.primary-navigation>li.active>a:focus {
	background-color: #4a4a4a;
	color: #ffffff;
}

.primary-navigation a.canClose {
	padding-right: 32px;
}

nav .glyphicon {
	padding-left: 5px;
	padding-top: 7px;
	height: 100%;
	top: 0px;
	vertical-align: top;
}

nav .glyphicon.glyphicon-home {
	padding-top: 2px;
	padding-left: 0px;
}

nav .glyphicon.glyphicon-remove {
	font-size: max(8px, min(1vw, 10px));
}

lt-navigation-bar a:hover,
lt-navigation-bar a:focus {
	color: #515151;
	text-decoration: none;
	outline: none;
}

.secondary-navigation {
	background-color: #4a4a4a;
}

.secondary-navigation li {
	height: 24px;
	margin-top: 8px;
	border-right: 1px solid rgba(255, 255, 255, 0.25)
}

.secondary-navigation-empty {
	border-style: solid;
	border-width: 0px 0px 1px 0px;
	border-color: #4a4a4a;
}

.secondary-navigation>li {
	color: #ffffff;
}

.secondary-navigation>li.active {
	background-color: #ffffff;
}

nav li.active {
	border-radius: 3px 3px 0px 0px;
	border-color: transparent;
}

.secondary-navigation>li>a {
	font-size: max(10px, min(1.4vw, 14px));
	height: 100%;
	padding-top: 2px;
	padding-left: 0px;
	padding-right: 15px;
	display: inline-block;
	color: #ffffff;
}

.secondary-navigation>li>a,
.secondary-navigation>li>a:hover,
.secondary-navigation>li>a:focus {
	background-color: transparent;
}

.secondary-navigation>li.active,
.secondary-navigation>li.active>a,
.secondary-navigation>li.active>a:hover,
.secondary-navigation>li.active>a:focus {
	background-color: #ffffff;
	color: var(--customer-color-1);
}

.secondary-navigation>li.active>a,
.secondary-navigation>li.active>a:hover,
.secondary-navigation>li.active>a:focus {
	font-weight: bold;
}

.primary-navigation>li>a {
	padding: 3px 9px 5px 0px;
	font-size: max(10px, min(1.4vw, 14px));
}

.secondary-navigation a.hideClose {
	padding-left: 15px;
}

.primary-navigation .glyphicon.hideClose,
.secondary-navigation .glyphicon.hideClose {
	display: none;
}

.secondary-navigation .glyphicon.glyphicon-remove {
	padding-left: 15px;
}

.badge .glyphicon {
	cursor: pointer;
	position: absolute;
	right: 5px;
	top: 4px;
}

.lt-badge-default {
	background-color: var(--customer-color-1);
}

.lt-badge-primary {
	background-color: var(--brand-purple2);
}

.lt-badge-new {
	background-color: var(--gray);
}

.lt-badge-warn {
	background-color: orange;
}

.lt-badge-info {
	background-color: var(--brand-lilac);
}

.lt-box .lt-badge-list {
	margin: -15px;
}

.lt-badge-list {
	background-color: var(--gray-50);
	padding: 15px;
	overflow-y: auto;
	overflow-x: hidden;
}

.lt-badge-list .badge {
	margin-top: 2px;
	margin-bottom: 2px;
	max-width: 100%;
	position: relative;
	overflow: hidden;
	text-overflow: ellipsis;
}

.lt-badge-list .badge:has(.glyphicon) {
	padding-right: 15px !important;
}

.lt-badge-list .badge:first-of-type {
	margin-left: 5px;
}

.lt-badge-list .badge+.badge {
	margin-left: 5px;
}

.lt-badge-list .badge:has(.glyphicon)>span:first-child {
	padding-right: 5px;
}

.lt-quicknav-menu {
	background-color: #4a4a4a;
	padding: 32px 0px 10px 0px;
	height: 100%;
	width: 50px;
	box-shadow: -2px 2px 9px 2px #666666;
}

lt-quick-navigation-bar {
	text-align: center;
}

.lt-quick-navigation-divider {
	border-bottom: 1px solid rgba(255, 255, 255, 0.25);
	margin-bottom: 16px;
	margin-left: 8px;
	margin-right: 8px;
}

.lt-btn-quick-nav-container {
	margin-bottom: 15px;
}

.lt-btn-quick-nav {
	color: #4a4a4a;
	background-color: #fff;
	margin-top: 8px;
	border: solid 1px #4a4a4a;
}

.lt-btn-quick-nav-circle-container {
	position: relative;
}

.lt-btn-quick-nav-badge {
	background-color: var(--customer-color-1);
	position: absolute;
	right: 1px;
	top: 1px;
}

.lt-btn-user-icon {
	background-color: var(--valinor-inactive);
	color: #ffffff;
	border: 2px solid transparent;
}

.lt-toggle-btn-quick-nav-selected {
	background-color: #fafafa;
}


.lt-btn-quick-nav-container:hover .lt-btn-quick-nav,
.lt-toggle-btn-quick-nav-selected .lt-btn-quick-nav {
	color: var(--customer-color-1);
	border: solid 1px var(--customer-color-1);
}

.lt-btn-quick-nav-link,
.lt-btn-quick-nav-link:hover,
.lt-btn-quick-nav-link:focus {
	max-width: 60px;
	padding: 5px 3px;
	white-space: normal;
	font-size: max(10px, min(1.1vw, 11px)) !important;
	color: #f5f5f5;
	text-decoration: none;
}

.lt-toggle-btn-quick-nav-selected .lt-btn-quick-nav-link {
	color: #4a4a4a;
}

.lt-quick-nav-flyout-contents {
	height: 100%;
	overflow-y: auto;
	width: min(80vw, 400px);
}

.lt-quicknav-flyout {
	padding: 32px 0px 10px 0px;
	height: 100%;
	position: absolute;
	z-index: 999;
	max-height: 100%;
	width: auto;
	white-space: nowrap;
	transform: translateX(-100%);
	background: #fafafa;
	border-left: 1px solid lightgray;
}

.lt-quicknav-flyout.no-border {
	border: none;
}

.lt-quicknav-flyout.scroll {
	/* overflow: scroll; */
}

.lt-quicknav-flyout-heading {
	color: #4a4a4a;
	padding-top: 5px;
	padding-bottom: 5px;
	font-size: max(10px, min(1.6vw, 16px));
	font-weight: bold;
}

.lt-quicknav-flyout-heading-row {
	margin-left: 15px;
	margin-right: 15px;
}

lt-quick-stock-cart lt-button {
	margin-bottom: 15px;
}

.lt-popup-notification {
	position: fixed;
	right: 60px;
	bottom: 10px;
	width: 400px;
	padding: 10px;
	transform: translate(-15px, calc(-100vh + 40px));
	transition: all 0.5s ease 0.2s;

	border-radius: 4px;
	background: var(--background-background-secondary-dark);
	box-shadow: var(--box-shadow-dark);
	color: var(--text-white-primary);
	z-index: 9999;
	overflow: hidden;
}

.lt-popup-notification-closed {
	width: 0px;
	max-height: 0px;
	padding: 0px;
}

.lt-popup-notification-open {
	transform: translateX(0px);
	max-height: 300px;
}

.lt-notification {
	background: #4a4a4a;
	border-radius: 3px;
	margin: 0px 15px 15px 15px;
	color: #f5f5f5;
	text-align: left;
	font-size: max(10px, min(1.5vw, 15px));
	font-family: "Figtree", sans-serif;
	white-space: normal;
	padding: 10px;
	box-shadow: 3px 3px 5px 2px #666666;
	cursor: pointer;
}

.lt-notification-unread {
	background: transparent;
	color: #4a4a4a;
	border: solid #4a4a4a 1px;
}

.lt-notification .btn-link:active,
.lt-notification .btn-link:focus,
.lt-notification .btn-link:hover,
.lt-notification .btn-link:visited {
	color: #337ab7;
}

.lt-notification:not(.lt-notification-unread) .btn-link,
.lt-notification:not(.lt-notification-unread) .btn-link:active,
.lt-notification:not(.lt-notification-unread) .btn-link:focus,
.lt-notification:not(.lt-notification-unread) .btn-link:hover,
.lt-notification:not(.lt-notification-unread) .btn-link:visited {
	color: #1e90ff;
}

.lt-standard-field-height {
	height: 52px;
}

.lt-align-bottom {
	position: absolute;
	bottom: 0;
}

.lt-notification-glyphicon-close {
	font-size: max(10px, min(1.1vw, 11px));
	float: right;
	cursor: pointer;
	margin-top: -5px;
	margin-right: -3px;
}

.lt-notification-timestamp {
	color: #808080;
	float: right;
	margin-right: 5px;
}

.lt-notification-body {
	font-size: max(10px, min(1.2vw, 12px));
}

.lt-notification-list-msg-empty {
	font-size: max(10px, min(1.3vw, 13px));
}

.lt-list-item-description-container {
	max-height: 60px;
	overflow: hidden;
}

.lt-list-item-title {
	white-space: normal;
	color: #000000;
	padding-top: 5px;
	font-size: max(10px, min(1.5vw, 15px));
}

.lt-list-item-description {
	white-space: normal;
	color: #000000;
	padding-top: 3px;
}

.lt-list-item-status,
.lt-status-tag {
	border-radius: 4px;
	font-weight: 600;
}

.lt-list-item-status {
	padding: 1px 5px;
	font-size: 10px;
}

.lt-status-tag {
	font-size: 12px;
	cursor: default;
	padding: 0;
	margin-right: 3px;
}

.lt-status-tag>.text.with-closer {
	padding: 1px 0.25em 1px 5px;
}

.lt-status-tag>.text.no-closer {
	padding: 1px 5px;
}

.lt-status-tag>.text.clickable {
	cursor: pointer;
}

.lt-status-tag>.text.clickable:hover,
.lt-status-tag>.text.clickable:focus {
	text-decoration: underline;
}

.lt-status-tag>.closer {
	cursor: pointer;
	padding: 1px 5px 1px 0.25em;
}

.lt-list-item-left {
	min-width: 110px;
}

.lt-list-item-details {
	padding-top: 3px;
	color: #1a1a1a;
}

.lt-strong {
	font-weight: bold;
}

.lt-strong .lt-prompt {
	font-weight: bold;
}

.lt-analysis-line-grid-container {
	max-height: calc(100vh - 450px);
}

lt-view-ds-payable-invoice-analysis-line:first-of-type>div {
	border-top: 1px solid lightgray;
}

lt-view-ds-payable-invoice-analysis-line:last-of-type>div {
	margin-bottom: 20px;
}

lt-view-ds-payable-invoice-analysis-line>div {
	padding-top: 5px;
	padding-bottom: 5px;
	border-bottom: 1px solid lightgray;
}

lt-view-ds-payable-invoice-analysis-line .lt-list-item-details {
	max-height: 38px;
	overflow: hidden;
	margin-bottom: 2px;
}

lt-view-ds-payable-invoice-analysis-line .lt-list-item-enabled .lt-list-item-details {
	color: #4a4a4a;
}

lt-view-ds-payable-invoice-analysis-line .lt-list-item-details.lt-list-item-description {
	font-size: max(10px, min(1.2vw, 12px));
	color: #808080;
}

lt-view-ds-payable-invoice-analysis-line {
	font-size: max(10px, min(1.3vw, 13px));
}

lt-view-ds-payable-invoice-analysis-line .btn-link {
	font-size: max(10px, min(1.3vw, 13px));
}

lt-view-ds-payable-invoice-analysis-line>div:not(.lt-list-item-enabled) {
	color: lightgray;
}

lt-view-ds-payable-invoice-analysis-line>div.lt-list-item-enabled .btn-link {
	color: orange;
}

ux-dialog:not(:has(.lt-standard-dialog-layout)) {
	max-width: 90vw !important;
	min-width: min(90vw, 800px) !important;
}

ux-dialog>ux-dialog-header {
	padding: 0px !important;
	min-height: 56px;
}

/* animation */

.fade-in-add {
	-webkit-animation: fadeIn 0.5s;
	animation: fadeIn 0.5s;
}

@-webkit-keyframes fadeIn {
	0% {
		opacity: 0
	}

	100% {
		opacity: 1
	}
}

@keyframes fadeIn {
	0% {
		opacity: 0
	}

	100% {
		opacity: 1
	}
}

@-webkit-keyframes fadeOut {
	0% {
		opacity: 1;
		height: 100%;
	}

	50% {
		opacity: 0.5;
		height: 50%;
	}

	100% {
		opacity: 0;
		height: 0%;
	}
}

@keyframes fadeOut {
	0% {
		opacity: 1;
		height: 100%;
	}

	50% {
		opacity: 0.5;
		height: 50%;
	}

	100% {
		opacity: 0;
		height: 0%;
	}
}

.animate-fade-in {
	-webkit-animation: fadeIn 1s;
	animation: fadeIn 1s;
}

.animate-fade-out {
	-webkit-animation: fadeOut 1s;
	animation: fadeOut 1s;
}

.lt-advanced-search-button {
	margin-top: 15px;
}

button.btn:not(.btn-link) {
	font-weight: 600;
}

.btn-clear,
.btn-clear:focus {
	color: #d9534f;
	background-color: transparent;
	border-color: #d9534f;
	width: auto !important;
	border-radius: 4px !important;
}

.btn-clear:hover {
	color: #d9534f;
	background-color: #d9534f4d;
}


lt-button+lt-advance-search-button>.lt-advanced-search-button {
	margin-top: 0px;
}

lt-button .lt-flex-row {
	justify-content: center;
	flex-wrap: nowrap;

}

lt-button .lt-button-spinner {
	width: 14px;
}

.fa-beat,
.fa-bounce,
.fa-fade,
.fa-beat-fade,
.fa-flip,
.fa-pulse,
.fa-shake,
.fa-spin,
.fa-spin-pulse {
	animation-duration: 1s;
	animation-iteration-count: infinite;
}


ux-dialog-footer .btn {
	margin: 0;
}

.lt-space-row {
	height: 15px;
}

.lt-jqx-grid-icon-cell {
	margin-top: 6px;
	margin-left: 15px;
}

.lt-form-group>.input-group {
	width: 100%;
}

.lt-form-group>.input-group>input:disabled {
	border: none;
	box-shadow: none;
	background-color: transparent;
	/* text-align: left !important; */
	padding-left: 0px;
	padding-right: 0px;
}

.lt-warning-color {
	color: orange
}

.lt-danger-color {
	color: #d9534f !important;
}

.lt-warning-textarea {
	color: #620e21;
	font-size: 15px;
	font-weight: bold;
}

.lt-loader {
	position: fixed;
	top: 50%;
	left: 50%;
	font-size: 30pt;
	font-family: "Figtree", sans-serif;
	transform: translate(-50%, -50%);
	transform: -webkit-translate(-50%, -50%);
	transform: -moz-translate(-50%, -50%);
	transform: -ms-translate(-50%, -50%);
	color: #0066A5;
}

.lt-loader-icon {
	margin: auto 0;
}

.lt-loader-text {
	font-size: 12pt;
}

.lt-load-dot {
	color: #0275BD;
	display: inline-block;
	font-weight: lighter;
}

.lt-load .lt-load-dot:nth-last-child(1) {
	animation: loadingFrames 3s .8s ease-in-out infinite;
}

.lt-load .lt-load-dot:nth-last-child(2) {
	animation: loadingFrames 3s .7s ease-in-out infinite;
}

.lt-load .lt-load-dot:nth-last-child(3) {
	animation: loadingFrames 3s .6s ease-in-out infinite;
}

.lt-load .lt-load-dot:nth-last-child(4) {
	animation: loadingFrames 3s .5s ease-in-out infinite;
}

.lt-load .lt-load-dot:nth-last-child(5) {
	animation: loadingFrames 3s .4s ease-in-out infinite;
}

.lt-load .lt-load-dot:nth-last-child(6) {
	animation: loadingFrames 3s .3s ease-in-out infinite;
}

.lt-load .lt-load-dot:nth-last-child(7) {
	animation: loadingFrames 3s .2s ease-in-out infinite;
}

.lt-load .lt-load-dot:nth-last-child(8) {
	animation: loadingFrames 3s .1s ease-in-out infinite;
}

.btn {
	overflow: hidden;
	border-radius: 20px;
}

.btn.resizable-button {
	font-size: max(10px, min(1.4vw, var(--form-input-font-size))) !important;
}

.btn:not(lt-button-dropdown>div>.btn):not(.input-group-btn>.btn):not(.lt-btn-circle):not(.lt-btn-quick-nav-link) {
	padding-left: 6px !important;
	padding-right: 6px !important;
}

.btn:active,
.btn.active {
	box-shadow: none;
}

.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
	outline: none;
}

.btn-primary {
	background-color: #28a745;
	border-color: #1e7e34;
	color: #fff;
}

.btn {
	border-width: 1px;
	padding-top: 5px;
	padding-bottom: 5px;
}

.btn-group>.btn:first-child:not(:last-child):not(.dropdown-toggle) {
	border-right-width: 1px;
}

.btn-group>.btn:last-child:not(:first-child),
.btn-group>.dropdown-toggle:not(:first-child) {
	border-left-width: 1px;
}

lt-lookup .dropdown-toggle {
	border-width: 1px;
}

/* .primary-outline {
	border-color: #28a745;
	color: #28a745;
	background-color: #ffffff;
}

.primary-outline:hover,
.primary-outline:focus,
.primary-outline:focus:active {
	color: #28a745;
	border-color: #28a745;
	color: #ffffff;
	background-color: rgba(40, 167, 69, .5);
} */

.secondary-outline {
	border-color: #0275BD;
	color: #0275BD;
	background-color: #ffffff;
}

.secondary-outline:hover,
.secondary-outline:focus,
.secondary-outline:focus:active {
	border-color: #0275BD;
	color: #0275BD;
	background-color: rgba(51, 122, 183, .3);
}



.warning-outline {
	border-color: #EC971F;
	color: #EC971F;
	background-color: #ffffff;
}

.warning-outline:hover,
.warning-outline:focus,
.warning-outline:focus:active {
	border-color: #EC971F;
	color: #EC971F;
	background-color: rgba(236, 151, 31, .3);
}

.error-outline {
	border-color: var(--brand-error-default);
	color: var(--brand-error-default);
	background-color: #ffffff;
}

.error-outline:hover,
.warning-outline:focus,
.warning-outline:focus:active {
	border-color: var(--brand-error-hover);
	color: var(--brand-error-hover);
}

@keyframes loadingFrames {
	0% {
		transform: translate(0, 0);
	}

	10% {
		transform: translate(0, -0.5em);
	}

	20% {
		transform: translate(0, 0);
	}
}

.form-control {
	color: rgba(0, 0, 0, 1);
	font-size: max(10px, min(1.4vw, var(--form-input-font-size)));
	height: max(22px, min(3.4vw, var(--form-input-height)));
	padding-left: 6px;
	padding-right: 6px;
}

.form-control.dx-texteditor {
	height: var(--form-input-height);
}

.form-control:hover {
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .87);
}

.form-control:focus {
	border: none;
	box-shadow: inset 0 0 0 2px var(--brand-dx-base);
}

.input-group-btn>.resizable-button {
	height: max(22px, min(3.4vw, var(--form-input-height)));
}

.input-group-btn:last-child>.dropdown-toggle {
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
}

.lt-tabs a {
	outline: none;
}

.lt-tabs a:hover,
.lt-grid a:hover,
lt-button-dropdown a:hover,
lt-button-popover a:hover {
	cursor: pointer;
}


lt-button-dropdown .dropdown-toggle {
	padding: 0 !important;
}

lt-button-dropdown .dropdown-toggle.no-default-action {
	padding: 5px 0px 5px 12px !important;
}

lt-button-dropdown .dropdown-toggle.no-default-action.btn-link {
	padding: 0 !important;
}

lt-button-dropdown .dropdown-toggle.no-default-action div {
	width: 27px;
	float: right;
}

lt-button-dropdown li>a {
	color: var(--text-black-primary) !important;
}

.lt-btn-circle.lt-btn-xl {
	width: 70px;
	height: 70px;
	padding: 10px 16px;
	font-size: 24px;
	line-height: 1.33;
}

.lt-btn-circle.lt-btn-lg {
	width: 38px;
	height: 38px;
	font-size: 16px;
	font-weight: bold;
}

.lt-btn-circle.lt-btn-lg>span.glyphicon {
	line-height: 1.6;
}

.lt-btn-circle {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	padding: 0;
	text-align: center;
	font-size: 12px;
	line-height: 1.42857;
}

.btn-flex {
	display: flex;
	align-items: stretch;
	align-content: stretch;
}

.btn-flex .btn:first-child {
	flex-grow: 1;
	text-align: center;
}

.btn-flex .btn:hover {
	text-decoration: none;
}

.center {
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.jqx-grid-load.jqx-grid-load-bootstrap {
	z-index: 2999;
}

.jqx-tooltip-arrow {
	display: none;
}

.ux-dialog-confirm ux-dialog-footer {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
}

ux-dialog-container {
	z-index: 10000 !important;
}

ux-dialog-overlay {
	z-index: 10000 !important;
}

a.navbar-brand {
	background-color: #ffffff;
}

lt-checkbox {
	overflow-y: visible !important;
	display: block;
}

input[type="checkbox"] {
	accent-color: var(--text-black-primary);
}

.lt-checkbox-label {
	color: var(--text-black-primary);
	font-weight: 400 !important;
	margin-top: 5px;
	font-size: var(--form-input-font-size);
}

.lt-checkbox-label.lt-checkbox-disabled {
	color: #B3AFAF;
}

.lt-checkbox-toolTip {
	margin-top: 2px;
	margin-right: 4px;
	margin-left: 4px;
}

.lt-checkbox-first {
	margin-top: 0px;
}

.lt-checkbox-box {
	width: 15px;
}

.lt-month-end i {
	margin-top: 2px;
	margin-right: 4px;
	margin-left: 10px
}

.lt-grid-standard {
	padding-top: 5px;
	background-color: transparent;
}

.lt-grid-container {
	margin-left: -15px;
	margin-right: 15px;
}

.lt-logo {
	background-image: url("https://lentunestorage.blob.core.windows.net/lentune-public/Hub/lentune-default-logo.png");
	width: 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 123px;
}

.jqx-menu ul {
	padding: 0;
	font-family: "Figtree", sans-serif;
}

.jqx-menu ul li {
	font-family: "Figtree", sans-serif;
}

.jqx-menu-item-top {
	margin: 0;
}

.jqx-popover {
	z-index: 9999;
	max-width: 95vw;
}

.jqx-popup-bootstrap {
	border-radius: 0 !important;
}

.jqx-button[disabled=false] {
	pointer-events: auto;
}

.lt-alert-title {
	font-weight: bold;
}


.alert-warning {
	color: #8a6d3b !important;
	background-color: #fcf8e3 !important;
	border-color: #faebcc !important;
}

.alert-success {
	color: #3c763d !important;
	background-color: #dff0d8 !important;
	border-color: #d6e9c6 !important;
}

.alert-success {
	color: #3c763d !important;
	background-color: #dff0d8 !important;
	border-color: #d6e9c6 !important;
}

.alert-danger {
	color: #a94442 !important;
	background-color: #f2dede !important;
	border-color: #ebccd1 !important;
}

.lt-tab-row,
.lt-flex-row {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

.no-flex-wrap {
	flex-wrap: nowrap;
}

.fill-remaining-space {
	flex: 1;
	overflow: hidden;
}

.fill-height {
	height: 100%;
	display: block;
	overflow: hidden;
}

.text-top-row-primary,
.text-top-row-secondary {
	margin-right: 15px;
	line-height: 34px;
}

.text-top-row-primary {
	color: var(--brand-brick);
}

.text-top-row-secondary {
	color: var(--brand-purple2);
}

.lt-tab-row lt-button,
.lt-flex-row lt-button,
.lt-flex-row lt-ng-button,
.lt-tab-row lt-button-dropdown,
.lt-flex-row lt-button-dropdown,
.lt-flex-row lt-ng-button-dropdown,
.lt-flex-row lt-button-popover,
.lt-tab-row a,
.lt-flex-row a,
.lt-flex-row lt-lookup-local,
.lt-flex-row .lt-flex-row-item {
	margin-right: 12px;
}

.lt-tab-row :last-child,
.lt-flex-row :last-child {
	margin-right: 0px !important;
}

.lt-align-self-center {
	align-self: center;
}

.btn-top-row:first-child,
.btn-top-row:first-child {
	margin-left: 0px;
}

.lt-table-datum-number {
	text-align: right;
}

ux-dialog-overlay.active {
	background-color: black;
	opacity: 0.5 !important;
}

.padding-zero {
	padding: 0;
}

.margin-zero {
	margin: 0 !important;
}

.margin-top-6 {
	margin-top: 6px;
}

.margin-right-3 {
	margin-right: 3px;
}

.lentune-widget-label-clickable,
.lentune-widget-label-clickable i {
	color: #01435A;
	cursor: pointer;
}

lt-button-dropdown .lt-dropdown-content {
	height: fit-content;
}

lt-button-dropdown li {
	display: list-item !important;
}

ul.lt-dropdown-menu,
.lt-dropdown-menu ul {
	min-width: 160px;
	padding: 5px 0;
	margin: 0px;
	text-align: left;
	list-style: none;
	width: fit-content;
	overflow: hidden;
}

.lt-dropdown-menu li>a {
	display: block;
	padding: 3px 20px;
	clear: both;
	font-weight: 400;
	white-space: nowrap;
}

.lt-dropdown-menu li>a:hover,
.lt-dropdown-menu li>a:focus {
	text-decoration: none;
	background-color: #f5f5f5;
}

.lt-dropdown-menu .active>a,
.lt-dropdown-menu .active>a:hover,
.lt-dropdown-menu .active>a:focus {
	text-decoration: none;
	background-color: #f5f5f5;
}

.lt-dropdown-menu .disabled>a:hover,
.lt-dropdown-menu .disabled>a:focus {
	text-decoration: none;
	background-image: none;
	background-color: transparent;
}

.lt-object-title {
	font-size: 120%;
	margin: 3px;
	margin-right: 8px;
	font-weight: bold;
}

.lt-bottom-line-heading {
	border-bottom: 1px solid var(--customer-color-1);
	;
	font-size: max(10px, min(1.6vw, 16px));
	font-weight: bold;
	width: 100%;
}

.jqx-tooltip-text {
	text-align: left;
	white-space: pre-line;
}


.lt-box-heading-inline {
	width: 100%;
	display: inline;
}

.lt-invalid-text {
	background-color: lightpink;
}

.tab-header {
	font-weight: bold;
}

.opaque-33 {
	opacity: 33%;
}

.opaque-50 {
	opacity: 50%;
}

.opaque-66 {
	opacity: 66%;
}

.upload-drag {
	border: 1px solid rgba(0, 0, 0, 0);
	border-radius: 4px;
	padding: 0.5em;
}

.upload-drag[dragging] {
	border: 1px solid #337AB7;
}

.error .lt-prompt {
	color: red;
}

/* @group Blink */
.blink {
	-webkit-animation: blink .75s linear infinite;
	-moz-animation: blink .75s linear infinite;
	-ms-animation: blink .75s linear infinite;
	-o-animation: blink .75s linear infinite;
	animation: blink .75s linear infinite;
}

@-webkit-keyframes blink {
	0% {
		opacity: 1;
	}

	50% {
		opacity: 1;
	}

	50.01% {
		opacity: 0;
	}

	100% {
		opacity: 0;
	}
}

@-moz-keyframes blink {
	0% {
		opacity: 1;
	}

	50% {
		opacity: 1;
	}

	50.01% {
		opacity: 0;
	}

	100% {
		opacity: 0;
	}
}

@-ms-keyframes blink {
	0% {
		opacity: 1;
	}

	50% {
		opacity: 1;
	}

	50.01% {
		opacity: 0;
	}

	100% {
		opacity: 0;
	}
}

@-o-keyframes blink {
	0% {
		opacity: 1;
	}

	50% {
		opacity: 1;
	}

	50.01% {
		opacity: 0;
	}

	100% {
		opacity: 0;
	}
}

@keyframes blink {
	0% {
		opacity: 1;
	}

	50% {
		opacity: 1;
	}

	50.01% {
		opacity: 0;
	}

	100% {
		opacity: 0;
	}
}

.LentuneSummary {
	margin: 0;
	padding: 1em;
	width: 100%;
}

.LentuneSummary DIV.SpecialHeading {
	padding-right: 4px;
	padding-left: 4px;
	font-size: 18px;
	padding-bottom: 4px;
	color: #ffffff;
	padding-top: 4px
}

.LentuneSummary DIV.SpecialBody {
	padding-right: 4px;
	padding-left: 4px;
	font-size: 12px;
	padding-bottom: 4px;
	color: #ffffff;
	padding-top: 4px
}

.LentuneSummary DIV.homepagePadding {
	padding-right: 16px;
	padding-left: 16px;
	padding-bottom: 16px;
	padding-top: 16px
}

.LentuneSummary A.special:link {
	color: #c3e8ff;
	text-decoration: underline
}

.LentuneSummary A.special:visited {
	color: #c3e8ff;
	text-decoration: underline
}

.LentuneSummary A.special:hover {
	color: #c3e8ff;
	text-decoration: none
}

.LentuneSummary DIV.ContentPadding {
	padding-right: 16px;
	padding-left: 16px;
	padding-bottom: 16px;
	padding-top: 16px
}

.LentuneSummary .heading {
	font-weight: bold;
	font-size: 15px;
}

.LentuneSummary TD.darkblue {
	background: #1d1580;
	height: 4px
}

.LentuneSummary TD.header {
	background: #ffffff;
	height: 98px
}

.LentuneSummary .AccountTransactionRowHeading {
	font-weight: bold;
	font-size: 13px;
}

.LentuneSummary .AccountTransactionOddRow {
	background: #E8F8C8;
	vertical-align: Top;
}

.LentuneSummary .AccountTransactionEvenRow {
	background: #E6FDB6;
	vertical-align: Top;
}

.LentuneSummary .AccountTable {
	cell-spacing: 0;
	cell-padding: 0;
	border: 0;
	background-color: #E4E4E4;
	border-collapse: collapse;
}

.LentuneSummary .AccountTransactionReference {
	width: 21%;
	vertical-align: Top;
}

.LentuneSummary .AccountTransactionDescription {
	width: 30%;
	vertical-align: Top;
}

.LentuneSummary .AccountTransactionMoney {
	text-align: right;
	width: 12%;
}

.LentuneSummary .AccountTransactionMoneyHeading {
	text-align: right;
	vertical-align: Top;
	font-weight: bold;
	font-size: 13px;
}

.LentuneSummary .Date {
	text-align: left;
	width: 14%;
}

.LentuneSummary .CommunicationRowHeading {
	font-weight: bold;
	font-size: 13px;
}

.LentuneSummary .CommunicationOddRow {
	background: #E8F8C9;
	vertical-align: Top;
}

.LentuneSummary .CommunicationEvenRow {
	background: #E6FDB8;
	vertical-align: Top;
}

.LentuneSummary .CommunicationTable {
	cell-spacing: 0;
	cell-padding: 0;
	border: 0;
	background-color: #E4E4E4;
	border-collapse: collapse;
}

.LentuneSummary .CommunicationStaff {
	text-align: left;
	width: 15%;
}

.LentuneSummary .CommunicationHeading {
	text-align: right;
	font-weight: bold;
	font-size: 13px;
}

.LentuneSummary .CommunicationReference {
	width: 12%;
	vertical-align: Top;
}

.LentuneSummary .CommunicationDescription {
	width: 48%;
	vertical-align: Top;
}

.LentuneSummary TD {
	border-bottom: 1px solid darkgray;
	font-size: 12px;
}

.LentuneSummary div {
	background: #E4E4E4;
}

.LentuneSummary .headingcell {
	padding-left: 1px;
	font-weight: bold;
	font-size: 12px;
	color: white;
}

.LentuneSummary table {
	background: #D5D5D5;
	width: 100%;
}

.LentuneSummary .whiteCell {
	font-size: 11px;
	background: #ffffff;
}

.LentuneSummary .redFontValueCellBold {
	font-size: 11px;
	background: #ffffff;
	color: red;
	font-weight: bold;
}

.LentuneSummary .greyCellLge {
	background: #E2E2E2;
}

.LentuneSummary .greyCell {
	font-size: 11px;
	padding-left: 10px;
	font-weight: bold;
	width: 20%;
	background: #E4E4E4;
	color: #008000;
}

.LentuneSummary .redFontCellBold {
	font-size: 11px;
	padding-left: 10px;
	font-weight: bold;
	width: 20%;
	background: #E4E4E4;
	color: #FF0000;
}

.LentuneSummary .HEADINGONE {
	width: 100%;
	padding-left: 1px;
	font-weight: bold;
	font-size: 18px;
}

.LentuneSummary .headingcell {
	background: #008000;
}

.LentuneSummary Title {
	padding-right: 0pt;
	padding-top: 0pt;
	padding-left: 0pt;
	padding: 0pt;
	margin: 0pt;
}

/* @end */

.jqx-popover {
	z-index: 20000 !important;
}

lt-checkbox {
	padding-right: 6px !important;
}

lt-checkbox .lt-prompt {
	height: 18px;
}

lt-button-dropdown .btn-group,
lt-button-popover .btn-group {
	height: 34px;
	vertical-align: top;
}

.grid-sum {
	position: relative;
	margin: 4px;
	overflow: hidden;
	font-weight: bold;
}

.add-space-around {
	padding-top: 10px;
	padding-left: 30px;
	padding-right: 30px;
	padding-bottom: 10px;
}

/* @font-face {
	font-family: 'Figtree', sans-serif;
	src: url("../src/common/resources/fonts/Figtree-VariableFont_wght.ttf")format(ttf);
}  */

@font-face {
	font-family: 'Figtree';
	src: url("../../fonts/Figtree-VariableFont_wght.ttf") format('truetype');
	/* Update the font file path and format */
}


@font-face {
	font-family: 'Caveat';
	src: url("../../fonts/Caveat-VariableFont_wght.ttf")format('truetype');

}

* {
	font-family: "Figtree", sans-serif;
}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
td:hover,
td:focus {
	font-family: "Figtree", sans-serif;
}

.jqx-grid-table .jqx-grid-cell,
.jqx-grid-table .jqx-grid-cell:hover {
	font-family: "Figtree";
}

a,
.jqx-grid-cell a,
.lt-advanced-search-button {
	color: #4c20b7;
}

a:hover,
a:focus,
.jqx-grid-cell a:hover,
.jqx-grid-cell a:focus,
.lt-advanced-search-button:hover,
.lt-advanced-search-button:focus {
	color: #7d4fef;
}


.jqx-listitem-state-selected-bootstrap,
.jqx-menu-item-selected-bootstrap,
.jqx-tree-item-selected-bootstrap,
.jqx-calendar-cell-selected-bootstrap,
.jqx-grid-cell-selected-bootstrap,
.jqx-menu-vertical-bootstrap .jqx-menu-item-top-selected-bootstrap,
.jqx-grid-selectionarea-bootstrap {
	background-color: #e5e5e5 !important;
	border-color: unset !important;
	color: #000000 !important;
}



.site-alias-container {
	vertical-align: middle;
	display: flex;
	align-items: center;
	padding-right: 10px;
}

.site-alias {
	color: var(--brand);
	font-size: 14px;
	font-weight: 500;
	text-transform: capitalize;
	margin-right: 10px;
}

.new-feature-button-container {
	min-width: 34px;
}

.lt-btn-quick-nav-container:hover .lt-btn-quick-nav,
.lt-toggle-btn-quick-nav-selected .lt-btn-quick-nav {
	color: var(--brand-brick);
	border: solid 1px var(--brand-brick);
}

[role=columnheader].jqx-grid-column-header {
	background-color: var(--brand);
}

.lt-badge-default {
	background-color: var(--brand-error-default)
}

.lt-section-header {
	color: var(--brand);
	font-size: 18px;
	font-weight: 800;
}

.lt-tabs>li>a {
	color: var(--valinor-inactive);
}

.lt-tabs>li>a:hover,
.lt-tabs>li>a:focus,
.lt-tabs>li>a.active,
.lt-tabs>li>a.active:focus {
	background-color: transparent;
	border: none !important;
	color: var(--brand-nav-hover);
	font-weight: 600;
}

.lt-tabs>li.active>a,
.lt-tabs>li.active>a:hover .lt-tabs>li.active>a:focus {
	color: var(--brand-purple3);
	border-bottom: 3px solid var(--brand-purple3) !important;
	font-weight: 600;
}

.valinor-router-view-container .nav-tabs>li.active>a {
	color: var(--text-black-primary);
}

.nav-tabs>li.active>a,
.nav-tabs>li.active>a:focus,
.nav-tabs>li.active>a:hover {
	color: var(--brand-purple3);
}

.lt-vertical-tabs {
	list-style-type: none;
	list-style-image: none;
	padding-inline-start: 0px;
}

.lt-vertical-tabs>li {
	margin-top: 5px;
}

.lt-vertical-tabs>li>a>i {
	margin-right: 8px;
	width: 15px;
}

.lt-vertical-tabs>li>a {
	padding: 8px;
	display: block;
	width: 100%;
}

.lt-vertical-tabs>li>a {
	font-size: 15px;
	font-weight: 500;
	color: var(--text-black-secondary);
}

.lt-vertical-tabs>li>a:hover {
	color: var(--brand-nav-hover);
	text-decoration: none;
	cursor: pointer;
}

.lt-vertical-tabs>li.active>a {
	color: var(--brand-lilac);
	font-weight: 600;
}

.nav-pills>li.active>a,
.nav-pills>li.active>a:focus,
.nav-pills>li.active>a:hover {
	background-color: var(--brand-purple3);
}


/* .lt-tabs>li>a:hover {
	border-bottom: 3px solid var(--brand-brick) !important;
} */


.lt-logo {
	background-image: url("../../css/images/LentuneLogo_Brick_RGB.png");
}

.lt-load-dot {
	color: var(--brand-purple2);
}


.lt-loader {
	color: var(--brand-purple2);
}

lt-navigation-bar {
	background-color: white;
}

/* 
nav,
nav a {
	background-color: var(--brand);
}

a.navbar-brand {
	background-color: var(--brand);
} */

.spacer {
	height: 20px;
}

.navbar-header .fill-remaining-space {
	background-color: white;
}

.primary-navigation {
	/* background-color: var(--brand);
	color: white; */
	background-color: white;
}

.primary-navigation li {
	background-color: var(--brand-lightest-sky);
	color: var(--brand);
	border: 1px solid var(--brand-sky);
}

.primary-navigation>li>a {
	color: var(--brand);
}

.primary-navigation>li.active {
	border-bottom: none;
}

.primary-navigation>li.active,
.primary-navigation>li.active>a,
.primary-navigation>li.active>a:hover,
.primary-navigation>li.active>a:focus {
	background-color: var(--brand);
	color: white;
}

.nav-tabs>li>a,
.nav-tabs>li>a:focus,
.nav-tabs>li>a:hover,
.nav-tabs>li.active>a,
.nav-tabs>li.active>a:focus,
.nav-tabs>li.active>a:hover {
	border: none;
}

.secondary-navigation {
	background-color: var(--brand);
}

.secondary-navigation>li.active,
.secondary-navigation>li.active>a,
.secondary-navigation>li.active>a:hover,
.secondary-navigation>li.active>a:focus {
	background-color: white;
	color: var(--brand-purple2);
}

.lt-box-modern {
	border: 1px solid var(--token-divider);
	border-radius: 10px;
	padding-top: 15px;
	box-shadow: 0 3px 6px rgba(0, 0, 0, 0.0), 0 3px 6px rgba(0, 0, 0, 0.12);
}

.lt-box-modern:not(:last-child) {
	margin-bottom: 15px;
}

.lt-box {
	background-color: var(--brand-lightest-sky);
}

.lt-box-grey {
	background-color: var(--background-secondary);
}

.lt-box-outlined {
	background-color: white;
	border: var(--brand-purple3) 1px solid;
	border-radius: 4px;
}

.sub-menu-box {
	border: none;
	background-color: var(--menu-primary);
}

.lt-detail-block {
	background-color: var(--brand-lightest-sky);
	border: none;
}


/* input,
select,
textarea {
	
} */

.form-control {
	color: #4d4d4d;
}

.responsive-row {
	display: flex;
	flex-wrap: wrap;
}

.col-responsive-small {
	flex: 1 2;
	min-width: 140px;
}

.col-responsive-medium {
	flex: 2 1;
	min-width: 200px;
}

.narrow-col,
.narrow-row>* {
	padding-right: 6px !important;
	padding-left: 6px !important;
}

.narrow-container {
	padding-left: 8px;
	padding-right: 8px;
}

.narrow-row {
	margin-left: -8px;
	margin-right: -8px;
}

lt-ds-payable-invoice-dashboard-filter h3 {
	font-family: "Figtree";
	color: var(--brand-purple2);
}

.btn-link.active,
.btn-link:active {
	color: var(--brand-purple2) !important;
}

.btn-link[disabled],
fieldset[disabled] .btn-link {
	color: var(--text-black-inactive) !important;
}

.lt-quicknav-menu {
	background-color: var(--brand);
	box-shadow: none;
}

.jqx-grid-header-bootstrap {
	background-color: #4c20b7;
}

.lt-btn-quick-nav-badge {
	background-color: var(--brand-brick);
}

.lt-badge-warn {
	background-color: var(--brand-lightest-brick);
	color: #1a1a1a;
}

.lt-badge-orange {
	background-color: var(--chip-color-orange);
}

.lt-badge-blue {
	background-color: var(--brand-lilac);
}

.badge {
	font-weight: 600;
	border-radius: 25px;
	height: 20px;
	min-width: 20px;
	padding: 0px 5px 0px 5px;
	line-height: 20px;
}

.input-placeholder-secondary,
.input-placeholder-secondary-disabled {
	height: 84%;
	font-size: 11px;
	color: #B2B2B2;
	padding: 2.2%;
	position: absolute;
	display: inline-flex;
	align-items: center;
	right: 5px;
	top: 2px;
	z-index: 5;
}

.input-placeholder-secondary {
	background-color: white;
}


/* buttons */

/* button with highest importance is btn-primary */

.btn-primary,
.btn-primary.active,
.btn-primary:active {
	background-color: var(--brand-brick);
	border-color: var(--brand-brick);
	color: white !important;
}

.btn-primary[disabled],
.btn-primary.disabled,
.btn-primary:disabled {
	background-color: var(--brand-brick) !important;
	border-color: var(--brand-brick) !important;
}

.btn-primary:not([disabled]):hover,
.btn-primary:not([disabled]).focus,
.btn-primary:not([disabled]):focus,
.btn-primary.active:not([disabled]).focus,
.btn-primary.active:not([disabled]):focus,
.btn-primary.active:not([disabled]):hover,
.btn-primary.focus:not([disabled]):active,
.btn-primary:focus:not([disabled]):active,
.btn-primary:hover:not([disabled]):active,
.btn-primary:not([disabled]):after {
	background-color: color-mix(in srgb, var(--brand-brick), #000 10%);
	border-color: color-mix(in srgb, var(--brand-brick), #000 10%);
}

.btn-icon-cta {
	border-width: 0 !important;
	height: 34px !important;
	width: 34px !important;
	border-radius: 17px !important;
	margin-top: 0px !important;
	font-size: 14px !important;
}

.btn-icon-cta .glyphicon {
	padding: 0px !important;
}

.btn-secondary-icon-cta {
	color: var(--brand-purple2) !important;
}

.btn-secondary-icon-cta:not([disabled]):hover,
.btn-secondary-icon-cta.active:not([disabled]):hover {
	background-color: var(--brand-lilac-4);
	border-color: var(--brand-lilac-4);
	color: white;
}

.btn-primary-icon-cta,
.btn-primary-icon-cta.active,
.btn-primary-icon-cta:active {
	color: var(--brand-purple2) !important;
	border: none;
	background-color: transparent;
}

.btn-primary-icon-cta[disabled],
.btn-primary-icon-cta.disabled,
.btn-primary-icon-cta:disabled {
	color: var(--brand-purple-disabled) !important;
}

.btn-primary-icon-cta:not([disabled]):hover,
.btn-primary-icon-cta.active:not([disabled]):hover {
	color: var(--brand-purple-hover) !important;
}

.btn-primary-icon-cta:not([disabled]):focus,
.btn-primary-icon-cta.active:not([disabled]):focus {
	color: var(--brand-lilac) !important;
}

/* btn-primary-cta should replace usages of btn-primary going forward */
.btn-primary-cta:not([disabled]),
.btn-primary-cta.active:not([disabled]),
.btn-primary-cta:active:not([disabled]) {
	background-color: var(--brand-lilac);
	border-color: var(--brand-lilac);
	color: white;
}

.btn-primary-cta[disabled],
.btn-primary-cta.disabled,
.btn-primary-cta:disabled {
	background-color: var(--brand-purple-disabled) !important;
	/* border-color: var(--brand-purple-disabled) !important; */
	color: white;
}

.btn-primary-cta:not([disabled]):hover,
.btn-primary-cta.active:not([disabled]):hover {
	background-color: var(--brand-purple-hover);
	border-color: var(--brand-purple-hover);
	color: white;
}

.btn-primary-cta:not([disabled]):focus,
.btn-primary-cta.active:not([disabled]):focus {
	background-color: var(--brand-lilac);
	border-color: var(--brand-lilac);
	color: white;
}

/* btn-secondary-cta should replace usages of btn-secondary going forward */
.btn-secondary-cta,
.btn-secondary-cta.active,
.btn-secondary-cta:active {
	background-color: rgba(0, 0, 0, 0);
	border-color: var(--brand-lilac2);
	color: var(--brand-lilac);
}

.btn-secondary-cta[disabled],
.btn-secondary-cta.disabled,
.btn-secondary-cta:disabled {
	background-color: rgba(0, 0, 0, 0);
	border-color: var(--brand-purple-disabled) !important;
	color: var(--brand-purple-disabled) !important;
}

.btn-secondary-cta:not([disabled]):hover,
.btn-secondary-cta.active:not([disabled]):hover {
	background-color: rgba(0, 0, 0, 0);
	border-color: var(--brand-purple-hover);
	color: var(--brand-purple-hover);
}

.btn-secondary-cta:not([disabled]):focus,
.btn-secondary-cta.active:not([disabled]):focus {
	background-color: rgba(0, 0, 0, 0);
	border-color: var(--brand-lilac);
	color: var(--brand-lilac);
}

.btn-secondary-cta-white,
.btn-secondary-cta-white.active,
.btn-secondary-cta-white:active {
	background-color: rgba(0, 0, 0, 0);
	border-color: var(--brand-white);
	color: var(--brand-white);
}

.btn-secondary-cta-white[disabled],
.btn-secondary-cta-white.disabled,
.btn-secondary-cta-white:disabled {
	background-color: rgba(0, 0, 0, 0);
	border-color: var(--brand-text-black-disabled) !important;
	color: var(--brand-text-black-disabled) !important;
}

.btn-secondary-cta-white:not([disabled]):hover,
.btn-secondary-cta-white.active:not([disabled]):hover {
	background-color: rgba(0, 0, 0, 0);
	border-color: var(--brand-purple-hover);
	color: var(--brand-purple-hover);
}

.btn-secondary-cta-white:not([disabled]):focus,
.btn-secondary-cta-white.active:not([disabled]):focus {
	background-color: rgba(0, 0, 0, 0);
	border-color: var(--brand-lilac);
	color: var(--brand-lilac);
}

.btn-warning-cta {
	background-color: var(--brand-warning);
	color: white !important;
	border: none;
}

.btn-warning-cta:hover,
.btn-warning-cta:focus,
.btn-warning-cta:focus.active,
.btn-warning-cta:hover:enabled {
	background-color: color-mix(in srgb, var(--brand-warning), #000 20%);
	border: none;
	color: white;
}

.btn-primary-brick,
.btn-primary-brick.active,
.btn-primary-brick:active {
	background-color: var(--brand-brick);
	border-color: var(--brand-brick);
	color: white;
}

.btn-primary-brick[disabled],
.btn-primary-brick.disabled,
.btn-primary-brick:disabled {
	background-color: var(--brand-brick-disabled) !important;
	border-color: var(--brand-brick-disabled) !important;
	color: #FFFFFF99;
}

.btn-primary-brick:not([disabled]):hover,
.btn-primary-brick.active:not([disabled]):hover {
	background-color: var(--brand-brick-hover);
	border-color: var(--brand-brick-hover);
	color: white;
}

.btn-primary-brick:not([disabled]):focus,
.btn-primary-brick.active:not([disabled]):focus {
	background-color: var(--brand-lighter-brick);
	border-color: var(--brand-lighter-brick);
	color: white;
}

.btn-sm {
	height: 28px !important;
	line-height: 28px;
	padding: 0px 6px;
}

.btn-xs {
	height: 24px !important;
	line-height: 24px;
	padding: 0px 6px;
}

.btn-lg {
	height: 40px !important;
	line-height: 30px;
	padding: 5px 12px;
}

ux-dialog>ux-dialog-footer .btn.btn-primary:not([disabled]):hover:enabled {
	background-color: color-mix(in srgb, var(--brand-brick), #000 10%);
	border-color: color-mix(in srgb, var(--brand-brick), #000 10%);
	/* filter: brightness(0.9); */
}

fieldset[disabled] .btn-primary.focus,
fieldset[disabled] .btn-primary:focus,
fieldset[disabled] .btn-primary:hover {
	background-color: color-mix(in srgb, var(--brand-brick), #000 10%);
	border-color: color-mix(in srgb, var(--brand-brick), #000 10%);
	color: white;
}

/* btn-secondary is second to btn-primary in order of importance */

.btn-secondary,
.btn-secondary.active,
.btn-secondary:active {
	background-color: var(--brand-lilac);
	border-color: var(--brand-lilac);
	color: white;
}

.btn-top-row .btn-secondary {
	background-color: var(--brand-brick);
	border-color: var(--brand-brick);
}


.btn-secondary:not([disabled]):hover,
.btn-secondary:not([disabled]).focus,
.btn-secondary:not([disabled]):focus,
.btn-secondary.active:not([disabled]).focus,
.btn-secondary.active:not([disabled]):focus,
.btn-secondary.active:not([disabled]):hover,
.btn-secondary.focus:not([disabled]):active,
.btn-secondary:focus:not([disabled]):active,
.btn-secondary:hover:not([disabled]):active,
.btn-secondary:not([disabled]):after {
	background-color: color-mix(in srgb, var(--brand-lilac), #000 20%);
	border-color: color-mix(in srgb, var(--brand-lilac), #000 20%);
	color: white;
}

.btn-secondary[disabled],
.btn-primary[disabled] {
	color: white;
}


/* .btn-secondary.disabled.focus,
.btn-secondary.disabled:focus,
.btn-secondary.disabled:hover {
	background-color: var(--brand);
	border-color: var(--brand);
	color: white;
} */

.btn-top-row .btn-secondary:not([disabled]):hover,
.btn-top-row .btn-secondary:not([disabled]):focus,
.btn-top-row .btn-secondary:not([disabled]):active,
.btn-top-row .btn-secondary.active:not([disabled]):hover,
.btn-top-row .btn-secondary.active:not([disabled]).focus {
	background-color: color-mix(in srgb, var(--brand-brick), #000 10%) !important;
	border-color: color-mix(in srgb, var(--brand-brick), #000 10%) !important;
	/* filter: brightness(0.9); */
}

.primary-outline {
	background-color: white;
	color: color-mix(in srgb, var(--brand-brick), #000 10%);
	border: 1px solid color-mix(in srgb, var(--brand-brick), #000 10%);
}

.primary-outline[disabled],
.primary-outline.disabled,
.primary-outline:disabled {
	background-color: white;
	color: color-mix(in srgb, var(--brand-brick), #000 10%) !important;
	border: 1px solid color-mix(in srgb, var(--brand-brick), #000 10%) !important;
}


.primary-outline.btn-default:not([disabled]):hover,
.primary-outline.btn-default:not([disabled]):focus,
.primary-outline.btn-default:not([disabled]):active {
	background-color: color-mix(in srgb, var(--brand-brick), #000 10%) !important;
	border-color: color-mix(in srgb, var(--brand-brick), #000 10%) !important;
	color: white !important;
	/* filter: brightness(0.9) !important; */
}


.secondary-outline {
	color: var(--brand-lilac);
	border-color: var(--brand-lilac);
	background-color: white;
}

.secondary-outline[disabled],
.secondary-outline.disabled,
.secondary-outline:disabled {
	color: var(--brand-lilac) !important;
	border-color: var(--brand-lilac) !important;
	background-color: white !important;
}

.secondary-outline.btn-default:hover,
.secondary-outline.btn-default:focus,
.secondary-outline.btn-default:active {
	background-color: var(--brand-lilac);
	border-color: var(--brand-lilac);
	color: white;
}

.btn-delete {
	color: var(--brand-maroon);
	border-color: var(--brand-maroon);
	background-color: white;
}

.btn-delete:hover,
.btn-delete:focus,
.btn-delete:active {
	background-color: color-mix(in srgb, var(--brand-maroon), #000 10%) !important;
	border-color: color-mix(in srgb, var(--brand-maroon), #000 10%) !important;
	color: white !important;
}

.btn-warning {
	background-color: var(--brand-maroon);
	border: none;
}


.btn-warning:hover,
.btn-warning:focus,
.btn-warning:focus.active,
.btn-warning:hover:enabled {
	background-color: color-mix(in srgb, var(--brand-maroon), #000 20%) !important;
	/* filter: brightness(0.9); */
	border: none;
	color: white;
}


.btn-info-icon {
	width: 28px;
	height: 28px;
}

.btn-info {
	background-color: var(--background-background-secondary-dark);
	border: none !important;
	color: white;
	padding: 4px;
}

.btn-info:hover,
.btn-info[disabled]:hover {
	background-color: var(--text-black-secondary);
}

.btn-info:focus,
.btn-info:active {
	background-color: var(--background-background-base-dark) !important;
}

.btn-info:disabled {
	opacity: 0.5;
	/* background-color: var(--background-background-primary-dark) !important; */
}

.btn-info:hover,
.btn-info:focus,
.btn-info:hover:enabled,
.btn-info:focus:enabled {
	color: white;

}

.btn-icon-default {
	width: 34px;
	background-color: transparent;
	color: var(--text-black-secondary);
}

.btn-icon-default:active {
	color: var(--brand);
}

.btn-icon-default:hover {
	color: var(--brand-nav-hover);
}

lt-button.col-xs-1 {
	padding-left: 0;
	padding-right: 0;
}

lt-button.col-xs-1 button {
	padding-left: 0;
	padding-right: 0;
}

.advance-search-action-container>.btn-link {
	margin-top: 0;
}

.btn-link:not(.lt-btn-quick-nav-link):not(.jqx-grid-cell .btn-link) {
	color: var(--text-black-secondary);
}

.btn-link:focus:not(.btn-link[disabled]) {
	color: var(--brand);
}

.btn-link:hover:not(.btn-link[disabled]) {
	color: var(--brand-purple-hover) !important;
	font-weight: 600 !important;
}

.btn-link:hover:not(.btn-link[disabled]),
.btn-link:focus:not(.btn-link[disabled]) {
	text-decoration: none !important;
}

.lt-btn-quick-nav-link {
	color: white;
}

.lt-btn-quick-nav-link:hover,
.lt-btn-quick-nav-link:focus {
	color: white !important;
	font-weight: 400 !important;
}

.lt-toggle-btn-quick-nav-selected .lt-btn-quick-nav-link {
	color: #4a4a4a !important;
}

.sticky-buttons {
	position: sticky;
	bottom: 0;
	display: table;
	width: 100%;
	background-color: white;
	padding: 3px 0px;
	overflow-y: visible;
	z-index: 900;
}

/* alerts */
.jqx-notification-error,
.jqx-danger {
	background-color: var(--brand-maroon) !important;
	border: none;
}

.jqx-notification-error,
.jqx-danger .jqx-notification-content {
	background-color: var(--brand-maroon) !important;
}

.alert-info {
	background-color: #b8a8ff40;
	color: var(--brand);
	border: none;
}

.dx-toast-stack {
	z-index: 1000000000 !important;
}

.lt-ng-notification-container {
	padding-bottom: 15px;
	padding-top: 15px;
	display: flex;
	flex: 1;
	justify-content: space-between;
}

.lt-ng-notification-error-icon-container {
	margin-right: 15px;
	display: flex;
	justify-content: center;
	align-items: center;
	background: var(--brand-error-default);
	border-radius: 14px;
	width: 27px;
	height: 27px;
}

.lt-ng-notification-success-icon-container {
	margin-right: 15px;
	display: flex;
	justify-content: center;
	align-items: center;
	background: var(--brand-success-default);
	border-radius: 14px;
	width: 27px;
	height: 27px;
}

.lt-ng-notification-error-icon {
	color: white;
	width: 27px;
	height: 27px;
	font-size: 27px;
}

.lt-ng-notification-success-icon {
	color: white;
	width: 27px;
	height: 27px;
	font-size: 27px;
}

.lt-ng-notification-text {
	display: flex;
	flex-direction: column;
	flex: 1;
}

.lt-ng-notification-title {
	font-size: 19px;
	font-weight: 700;
}

.lt-ng-notification-message {
	font-size: 16px;
	font-weight: 400;
	white-space: pre-line;
}

.lt-ng-notification-close {
	width: 16px;
	height: 16px;
	font-size: 16px;
	cursor: pointer;
	margin-left: 64px;
}

.error-message i {
	color: var(--brand-error-default);
}

/* 
.jqx-notification-warning,
.jqx-warning {
	background-color: #d9ff5770 !important;
	border: none !important;
}

.jqx-notification-success,
.jqx-success {
	background-color: #00ff8e70 !important;
	border: none !important;
} */

.lt-notification-title {
	font-weight: normal;
	font-size: larger;
}

.progress-bar {
	background-color: #CDC2FF;
	border: none;
	box-shadow: none !important;
}

.alert-info {
	background-color: #a5ceff40;
	box-shadow: none;
	border: none;
}

lt-grid .jqx-grid-cell-right-align {
	color: inherit;
}

.customer-portal .row {
	margin-left: 15px;
	margin-right: 15px;
}

.customer-portal-title {
	margin: 15px 0px 10px 0px !important;
	padding: 0;
	padding-left: 8px;
}

.customer-portal-subtitle {
	margin: 15px 0px 0.5em 15px;
	padding: 0;
	padding-left: 8px;
	margin: 0 0 10px 0px;
}

.customer-portal-summary-header {
	padding-left: 15px;
}

.customer-portal img {
	margin: 1em;
	max-height: 36px;
}

.customer-portal td div {
	background-color: var(--background-secondary);
	border: none;
	border-radius: 0.5em;
	margin: 1em;
	padding: 2em 0 2em 0;
	text-align: center;
}

.customer-portal .box h1 {
	margin: 0 0 2em 0;
}

.heading-primary {
	color: var(--brand-purple2) !important;
}

.heading-black-primary {
	color: var(--text-black-primary) !important;
}

.heading-black-secondary {
	color: var(--text-black-secondary) !important;
}

.heading-lilac-4 {
	color: var(--brand-lilac-4) !important;
}

.paragraph-white {
	color: var(--text-white-primary) !important;
}

.heading01 {
	color: var(--text-black-primary);
	font-size: 28px;
	font-weight: 700;
}

.heading02 {
	color: var(--text-black-primary);
	font-size: 24px;
	font-weight: 700;
}

.heading03 {
	color: var(--text-black-primary);
	font-size: 21px;
	font-weight: 700;
	margin: 0;
}

.heading04 {
	color: var(--text-black-primary);
	font-size: max(19px, min(1.1vw, 11px));
	font-weight: 700;
}

.heading05 {
	color: var(--text-black-primary);
	font-size: 17px;
	font-weight: 700;
}

.sub-menu-box-header,
.heading06 {
	font-size: 15px;
	font-weight: 600;
	color: var(--text-black-primary);
}

.heading06-bold {
	font-size: 15px;
	font-weight: 700;
	color: var(--text-black-primary);
}

.heading07-bold {
	font-size: 14px;
	font-weight: 700;
	color: var(--text-black-primary);
}

.heading08 {
	font-size: 13px;
	font-weight: 600;
	color: var(--text-black-primary);
}

.heading08-italic {
	font-size: 13px;
	font-weight: 600;
	font-style: italic;
	color: var(--text-black-subtle);
}

.sub-menu-box .btn-link,
.paragraph02-bold,
.paragraph02 {
	font-size: 14px;
	color: var(--text-black-secondary);
}

.paragraph02 {
	font-weight: 400;
}

.paragraph02-bold {
	font-weight: 600;
}

.paragraph03 {
	font-size: 13px;
	font-weight: 400;
}

.paragraph04 {
	color: var(--text-black-secondary);
	font-size: 12px;
	font-weight: 400;
}

.paragraph04-bold {
	font-weight: 600 !important;
}

.paragraph06 {
	color: var(--text-black-inactive);
	font-size: 10px;
	font-weight: 400;
}

.required-asterisk {
	color: var(--brand-brick);
}

/* Notifications */

.lt-quicknav-flyout {
	background-color: #f7f7f7;
	border: none;
}

.lt-quicknav-flyout .lt-notification {
	background: #4d4d4d;
	color: white;
	box-shadow: none;
	border: none;
	border-bottom-left-radius: 105px 25px;
}

.lt-quicknav-flyout .lt-notification-unread {
	background: #00ff8e40;
	border: none;
}


.lt-quicknav-flyout-heading {
	color: #ec5f4f;
	font-size: x-large;
	font-family: Caveat;

}


.lt-quicknav-flyout .lt-notification-title {
	font-size: larger;
	color: white;
}

.lt-quicknav-flyout .lt-notification-body {
	color: white;
	font-size: 14px;

}

.lt-quicknav-flyout .lt-notification-timestamp {
	color: #4a4a4a;
}

.lt-quicknav-flyout .lt-notification-unread {
	background: white;
	color: #2a1360;
	border: 1px solid #3c1492;
	box-shadow: 1px 1px 2px 0 #b8a8ff;
	padding: 5px;
}


.lt-notification-unread .lt-notification-title {
	color: #2a1360;
}

.lt-notification-unread .lt-notification-body {
	color: #2a1360;
}

.lt-notification-unread .lt-notification-timestamp {
	color: white;
}

.lt-notification:not(.lt-notification-unread) .btn-link {
	color: #b8a8ff;
}

.lt-notification:not(.lt-notification-unread) .mark-as-read {
	display: none;
}

.lt-notification .btn-link:active,
.lt-notification .btn-link:focus,
.lt-notification .btn-link:hover,
.lt-notification .btn-link:visited {
	color: #3c1492;
}

.lt-title {
	color: var(--brand);
	font-weight: bolder;
}

.lt-sub-title {
	color: var(--brand-purple3);
}

/* hard to find elements */
.jqx-widget-header-bootstrap {
	background-color: var(--brand);
}

.jqx-grid-column-sortascbutton,
.jqx-grid-column-sortascbutton-bootstrap,
.jqx-icon-arrow-up,
.jqx-icon-arrow-up-bootstrap {
	color: white;
}

.timeline .panel-primary {
	border-color: var(--brand-lilac);

}

.timeline .panel-primary>.panel-heading {
	background-color: var(--brand-lilac);
	border-color: var(--brand-lilac);
}

.jqx-popover {
	height: unset !important;
}

.matching-price input {
	color: green;
}

.invoice-dashboard-tabs {
	margin-left: 20px;
}

.invoice-pill {
	border: none;
	padding: 9px;
	margin: 10px;
	border-radius: 10px;
	background-color: #b8a8ff40;
}


.invoice-list .jqx-grid-cell-selected-bootstrap {




	background-color: #a5ceff60 !important;
}

#recheckingHeader,
#rejectedErpHeader {
	margin-top: 0;
	background-color: rgba(236, 95, 79, 0.20);
}

#recheckingHeaderLegacy {
	margin-top: 10px;
	color: red;
}

#recheckingHeader>a {
	color: #FD5A57;
}

#rejectedErpHeader>a {
	color: var(--brand-brick);
}

.invoice-pill h4 {
	text-align: center;
	color: #2a1360;
}

.invoice-pill p {
	text-align: center;
	font-size: small;
	color: black;
}

.dash-area {
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	flex-wrap: wrap;
}


.dashboard-quadrant {
	flex: 1;
	min-width: calc(50% - 20px);
	max-width: calc(50% - 20px);
	box-sizing: border-box;
	margin: 10px;
	background-color: var(--background-base);
	flex-direction: column;
	height: 100%;
}

invoice-tile {
	overflow: hidden;
}

.invoice-pill h4 {
	font-size: x-large;
}

.invoice-pill a:hover {
	text-decoration: none;
}

.invoice-pill a:hover h4 {
	color: #ec5f4f;
}

.invoice-pill a:hover p {
	color: #4c20b7;
}

.dash-footer {
	background-color: #b8a8ff20;
	margin: 0;
	margin-bottom: 0;
	padding: 5px;
	bottom: 0;
	margin-top: auto;
}

.dash-footer span {
	color: #ec5f4f;
}

.dash-footer a {
	cursor: pointer;
}

.invoice-values h5 {
	color: #2a1360;
	font-style: bolder;
}

.quadrant-title {
	font-size: 24px;
	color: var(--brand-brick);
	margin: 10px;
	font-weight: 800;
}

.chart-area {
	margin-top: 20px;
}

.chart-legend {
	list-style: none;
	padding: 0;
	margin-top: 60px;
}

.chart-legend li {
	font-size: smaller;
	margin-bottom: 7px;
	margin-top: 0;
	padding-top: 0;
}

.legend-color {
	display: inline-block;
	width: 60px;
	height: 10px;
	margin-right: 5px;
	opacity: 0.7;
}

.chart-legend span {
	display: inline-block;
	height: 10px;
	margin-right: 10px;
	width: 60px;
}

textarea {
	resize: vertical;
}

.customExportComment textarea {
	height: 200px !important;
}

.lt-switch.active {
	background-color: var(--brand-lilac) !important;
	color: white !important;
}

.mis-matched {
	color: red;
}

.mis-matched .lt-prompt {
	color: red;
}

.invoice-status-chip {
	margin: 4px 8px 0 0 !important;
	display: inline-block;
}

.invoice-status-chip.onhold {
	background-color: var(--chip-background-color-orange);
	border: 1px solid var(--chip-background-color-orange);
	color: var(--chip-color-orange);
}

.invoice-status-chip.checked {
	background-color: var(--chip-background-color-lightblue);
	border: 1px solid var(--chip-background-color-lightblue);
	color: var(--chip-color-lightblue);
}

.invoice-status-chip.approved {
	background-color: var(--chip-background-color-green);
	border: 1px solid var(--chip-background-color-green);
	color: var(--chip-color-green);
}

.invoice-status-chip.requiresrechecking {
	background-color: var(--chip-background-color-lightred);
	border: 1px solid var(--chip-background-color-lightred);
	color: var(--chip-color-lightred);
}

.invoice-status-chip.promptpayment {
	background-color: var(--chip-background-color-darkred);
	border: 1px solid var(--chip-background-color-darkred);
	color: var(--chip-color-darkred);
}

.invoice-status-chip.confidential {
	background-color: var(--chip-background-color-lilac);
	border: 1px solid var(--chip-background-color-lilac);
	color: var(--chip-color-lilac);
}

.invoice-status-chip.rejectederp {
	background-color: var(--chip-background-color-lightred);
	border: 1px solid var(--chip-background-color-lightred);
	color: var(--chip-color-brick);
}

.invoice-status-chip.processed {
	background-color: var(--chip-background-color-darkred);
	border: 1px solid var(--chip-background-color-darkred);
	color: var(--brand-maroon);
}

.invoice-status-chip.claim {
	background-color: var(--chip-background-color-purple);
	border: 1px solid var(--chip-background-color-purple);
	color: var(--chip-color-purple);
}

.invoice-status-chip.awaitingcredit,
.invoice-status-chip.indispute {
	border: 1px solid var(--chip-color-orange);
	color: var(--chip-color-orange);
}

.invoice-status-chip.default {
	background-color: var(--chip-background-color-default);
	border: 1px solid var(--chip-background-color-default);
	color: var(--brand);
}

.invoice-status-chip.clickable {
	cursor: pointer;
}

.invoice-status-chip.clickable:hover {
	text-decoration: underline;
}