@import url('./views/list-view.css');
@import url('./components/view-frame.css');
@import url('./components/brand-expression.css');
@import url('./components/grid.css');
@import url('./components/app-bar.css');
@import url('./components/login-rich-content.css');
@import url('./components/details-drawer.css');
@import url('./components/vaadin-side-nav.css');
@import url('./views/customer-details.css');


::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}

::-webkit-scrollbar-track {
    background: #fff;
}

::-webkit-scrollbar-thumb {
    background: rgb(2, 79, 103);
}

::-webkit-scrollbar-thumb:hover {
    background: rgb(5, 82, 103);
}
:root {
  --app-bar-height: var(--lumo-size-xl);

  --navi-drawer-width: calc(var(--lumo-size-m) * 7);
  --navi-drawer-rail-width: calc(var(--lumo-size-m) * 1.75);
  --navi-item-indentation: calc(var(--lumo-icon-size-s) + var(--lumo-space-l));

  --details-drawer-width: calc(var(--lumo-size-m) * 11);

  --transition-duration-s: 160ms;
  --transition-duration-m: 240ms;
  --transition-duration-l: 320ms;
  --lumo-space-r-m: var(--lumo-space-m);
  --lumo-space-r-l: var(--lumo-space-l);
  --lumo-space-r-x: var(--lumo-space-l);
  --lumo-space-wide-r-m: var(--lumo-space-wide-m);
  --lumo-space-wide-r-l: var(--lumo-space-wide-l);
  --lumo-font-size: 1rem;
  --lumo-primary-color:#4182c6;
}

@media (max-width: 479px) {
  :root {
    --lumo-space-r-x: 0;
  }
}

@media (min-width: 480px) and (max-width: 1023px) {
  :root {
    --lumo-space-r-x: var(--lumo-space-m);
  }
}

@media (max-width: 1023px) {
  :root {
    --lumo-space-r-m: var(--lumo-space-s);
    --lumo-space-r-l: var(--lumo-space-m);
    --lumo-space-wide-r-m: var(--lumo-space-wide-s);
    --lumo-space-wide-r-l: var(--lumo-space-wide-m);
  }
}

html,
body {
  height: 100%;
  overflow: hidden;
  width: 100%;
}

.root {
  background-color: var(--lumo-contrast-5pct);
}

.app-header-outer,
.app-footer-outer {
  z-index: 3;
}

vaadin-grid-cell-content {
  text-overflow: ellipsis;
}

vaadin-text-field {
  align-self: auto;
}

a[highlight] {
    font-weight: bold;
    text-decoration: underline;
}
.custom-readonly{
	pointer-events: none;
}
.barcode-layout{
	border: 1px solid #e9e9e9;
	width:300px;
	font-size:0.8rem;
	font-weight: bold;
    color: #868686;
    font-style: italic;
}

@media all and (max-width: 414px) {
 .dash-row{
 	flex-direction:column;
 }
 .dash-row>.dashboardview__payment-chart{
 	border-bottom:1px solid #f1f2f5;
 }
}
.header{
   
    --lumo-header-text-color:#1d5a98;
}
.ad-border{
    border: 1px solid #cfcfcf;
}