﻿@charset "UTF-8";
/* General */
/* Container sizes for various content containers */
:root {
  --color-primary: hsl(210, 50%, 27%);
  --color-primary-hover: hsl(210, 50%, 34%);
  --color-primary-hover-light: hsl(210, 80%, 94%);
  --color-secondary: hsl(189, 100%, 29%);
  --color-secondary-hover: hsl(189, 100%, 97%);
  --color-tertiary: hsl(350, 54%, 38%);
  --color-contrast: #fafafa;
  --color-white: #fff;
  --color-black: #000;
  --color-neutral: #cfcfcf;
  --color-neutral-hover: hsl(0, 0%, 95%);
  --color-restaurant-calendar: hsl(210, 50%, 34%);
  --color-arrangements: #f39492;
  --color-quicksale: #8b6cb0;
  --color-internal: hsl(210, 23%, 75%);
  --color-internal-hover: hsl(1, 80%, 97%);
  --color-off-white: #fcfcfc;
  --color-accent-bright: hsl(192, 51%, 79%);
  --color-page-background: hsl(210, 8%, 95%);
  --color-section-background: hsl(210deg 8% 93%);
  --color-section-border: hsl(0deg 0% 88%);
  --color-okay: #0e860e;
  --color-okay-hover: hsl(120, 81%, 95%);
  --color-warning: #ffd700;
  --color-warning-alternative: #ffb300;
  --color-error: #d71d1d;
  --color-require-action: hsl(50, 100%, 62%);
  --color-require-action-dark: hsl(50, 100%, 50%);
  --color-require-action-hover: hsl(50, 80%, 94%);
  --color-require-action-delayed: hsl(19, 100%, 43%);
  --color-require-action-delayed-hover: hsl(19, 90%, 94%);
  --header-height: 3rem;
  --border-1: 0.0625rem solid;
  --border-2: 0.125rem solid;
}
@media (min-width: 75rem) {
  :root {
    --header-height: 3.5rem;
  }
}
:root {
  --sidebar-width: 18.75rem;
  --component-max-width: 52.5rem;
  --page-padding: 1rem;
}
@media (min-width: 62rem) {
  :root {
    --page-padding: 2rem;
  }
}
:root {
  --orders-header-height: 8rem;
}
@media (min-width: 76.1875rem) {
  :root {
    --orders-header-height: 4.5rem;
  }
}
:root {
  --production-item-width: 11rem;
  --production-item-font-size: 0.75em;
}
@media (min-width: 75rem) {
  :root {
    --production-item-width: 14rem;
    --production-item-font-size: 1em;
  }
}

@media (prefers-color-scheme: light) {
  html:has(.SystemPreference) {
    --color-page-background: hsl(210, 8%, 95%);
    --color-sidebar-background: var(--color-white);
    --color-header-background: var(--color-primary);
    --color-header-foreground: var(--color-accent-bright);
    --color-header-link-active-background: var(--color-primary-hover);
    --color-header-link-hover-background: hsl(210, 50%, 30%);
    --color-border-subtle: #bdbdbd;
    --color-border-medium: #777;
    --color-border-medium-hover: #454545;
    --color-body-text: hsl(208, 39%, 12%);
    --color-text-dimmed: #777;
    --color-accent: var(--color-secondary);
    --color-accent-contrast: var(--color-off-white);
    --color-headings: var(--color-primary);
    --color-nav-background: var(--color-white);
    --color-nav-text: var(--color-primary);
    --color-nav-text-hover: var(--color-primary);
    --color-product-search-icons: var(--color-primary);
    --color-card-text: var(--color-body-text);
    --color-card-text-hover: var(--color-body-text);
    --color-card-background: #fcfcfc;
    --color-card-background-hover-default: hsl(0, 0%, 95%);
    --color-card-foreground: var(--color-body-text);
    --color-border-restaurant: var(--color-neutral);
    --color-arrangements-hover: hsl(1, 80%, 97%);
    --color-order-status-background: var(--color-secondary);
    --color-orderline-background: var(--color-contrast);
    --color-orderline-child-background: var(--color-page-background);
    --color-orderline-border: #eee;
    --color-hover-background: hsl(192, 75%, 93%);
    --color-focus-outline: var(--color-primary);
    --color-input-background: white;
    --color-input-placeholder: hsl(208, 7%, 46%);
    --color-input-border: #919191;
    --color-input-border-hover: #595959;
    --color-dropdown-listbox-background: var(--color-off-white);
    --color-section-background: hsl(210deg 8% 93%);
    --color-section-border: hsl(0deg 0% 88%);
    --color-serving-item-background: var(--color-off-white);
    --color-serving-item-neutral-hover: var(--color-neutral-hover);
    --color-serving-item-okay-hover: var(--color-okay-hover);
    --color-serving-item-require-action-hover: var(--color-require-action-hover);
    --color-serving-item-require-action-delayed-hover: var(--color-require-action-delayed-hover);
    --color-serving-item-readytoclose-hover: var(--color-primary-hover-light);
    --color-serving-item-neutral: var(--color-neutral);
    --color-serving-item-require-action-title: var(--color-body-text);
    --color-dropdown-border: hsl(210, 14%, 89%);
    --color-catalog-background: hsl(192, 75%, 93%);
    --color-catalog-text: hsl(209, 61%, 92%);
    --color-catalog-selected-text: hsl(208, 39%, 12%);
    --grid-background: hsl(210, 13%, 98%);
    --grid-alt-row: hsl(210, 13%, 95%);
    --grid-selected: hsl(210, 8%, 95%);
    --grid-hover: hsl(210, 8%, 95%);
    --color-modal-background: var(--color-white);
    --color-modal-text: var(--color-body-text);
    --color-modal-border: var(--color-border-subtle);
  }
}
@media (prefers-color-scheme: dark) {
  html:has(.SystemPreference) {
    --color-page-background: hsl(215, 35%, 13%);
    --color-sidebar-background: hsl(216, 41%, 20%);
    --color-header-background: hsl(215, 35%, 13%);
    --color-header-foreground: hsl(209, 61%, 92%);
    --color-header-link-active-background: var(--color-nav-background);
    --color-header-link-hover-background: hsl(216, 41%, 16%);
    --color-border-subtle: hsl(216, 56%, 27%);
    --color-border-medium: hsl(216, 56%, 27%);
    --color-border-medium-hover: hsl(216, 56%, 37%);
    --color-body-text: hsl(209, 61%, 92%);
    --color-text-dimmed: hsl(210, 39%, 55%);
    --color-accent: hsl(190, 56%, 62%);
    --color-accent-contrast: hsl(216, 41%, 20%);
    --color-headings: var(--color-body-text);
    --color-nav-background: hsl(216, 41%, 20%);
    --color-nav-text: var(--color-body-text);
    --color-nav-text-hover: var(--color-body-text);
    --color-product-search-icons: var(--color-body-text);
    --color-card-text: var(--color-body-text);
    --color-card-text-hover: var(--color-body-text);
    --color-card-background: hsl(216, 44%, 15%);
    --color-card-background-hover-default: hsl(216, 54%, 17%);
    --color-card-foreground: hsl(209, 61%, 92%);
    --color-border-restaurant: hsl(216, 56%, 27%);
    --color-arrangements-hover: hsl(1, 18%, 10%);
    --color-order-status-background: var(--color-nav-background);
    --color-orderline-background: hsl(216, 39%, 14%);
    --color-orderline-child-background: hsl(216, 30%, 18%);
    --color-orderline-border: var(--color-border-medium);
    --color-hover-background: var(--color-primary-hover-light);
    --color-hover-serving-background: hsl(216, 44%, 15%);
    --color-focus-outline: hsl(190, 56%, 62%);
    --color-input-background: hsl(216, 44%, 15%);
    --color-input-placeholder: hsl(212, 10%, 53%);
    --color-input-border: var(--color-border-medium);
    --color-input-border-hover: var(--color-border-medium-hover);
    --color-dropdown-listbox-background: var(--color-nav-background);
    --color-serving-item-background: var(--color-nav-background);
    --color-serving-item-neutral-hover: var(--color-hover-serving-background);
    --color-serving-item-okay-hover: var(--color-hover-serving-background);
    --color-serving-item-require-action-hover: var(--color-hover-serving-background);
    --color-serving-item-require-action-delayed-hover: var(--color-hover-serving-background);
    --color-serving-item-readytoclose-hover: var(--color-hover-serving-background);
    --color-serving-item-neutral: var(--color-border-restaurant);
    --color-serving-item-require-action-title: var(--color-accent-contrast);
    --color-section-background: transparent; /* make sticky bar transparent in dark */
    --color-section-border: var(--color-border-subtle); /* darker border in dark */
    --color-dropdown-border: var(--color-border-medium);
    --color-catalog-background: var(--color-primary-hover-light);
    --color-catalog-text: hsl(209, 61%, 92%);
    --color-catalog-selected-text: hsl(208, 39%, 12%);
    --grid-background: hsl(216, 44%, 15%);
    --grid-alt-row: hsl(216, 40%, 17%);
    --grid-selected: hsl(216, 41%, 20%);
    --grid-hover: hsl(216, 41%, 20%);
    --color-modal-background: hsl(216, 41%, 20%);
    --color-modal-text: var(--color-body-text);
    --color-modal-border: var(--color-border-subtle);
  }
}

html:has(.Light) {
  --color-page-background: hsl(210, 8%, 95%);
  --color-sidebar-background: var(--color-white);
  --color-header-background: var(--color-primary);
  --color-header-foreground: var(--color-accent-bright);
  --color-header-link-active-background: var(--color-primary-hover);
  --color-header-link-hover-background: hsl(210, 50%, 30%);
  --color-border-subtle: #bdbdbd;
  --color-border-medium: #777;
  --color-border-medium-hover: #454545;
  --color-body-text: hsl(208, 39%, 12%);
  --color-text-dimmed: #777;
  --color-accent: var(--color-secondary);
  --color-accent-contrast: var(--color-off-white);
  --color-headings: var(--color-primary);
  --color-nav-background: var(--color-white);
  --color-nav-text: var(--color-primary);
  --color-nav-text-hover: var(--color-primary);
  --color-product-search-icons: var(--color-primary);
  --color-card-text: var(--color-body-text);
  --color-card-text-hover: var(--color-body-text);
  --color-card-background: #fcfcfc;
  --color-card-background-hover-default: hsl(0, 0%, 95%);
  --color-card-foreground: var(--color-body-text);
  --color-border-restaurant: var(--color-neutral);
  --color-arrangements-hover: hsl(1, 80%, 97%);
  --color-order-status-background: var(--color-secondary);
  --color-orderline-background: var(--color-contrast);
  --color-orderline-child-background: var(--color-page-background);
  --color-orderline-border: #eee;
  --color-hover-background: hsl(192, 75%, 93%);
  --color-focus-outline: var(--color-primary);
  --color-input-background: white;
  --color-input-placeholder: hsl(208, 7%, 46%);
  --color-input-border: #919191;
  --color-input-border-hover: #595959;
  --color-dropdown-listbox-background: var(--color-off-white);
  --color-section-background: hsl(210deg 8% 93%);
  --color-section-border: hsl(0deg 0% 88%);
  --color-serving-item-background: var(--color-off-white);
  --color-serving-item-neutral-hover: var(--color-neutral-hover);
  --color-serving-item-okay-hover: var(--color-okay-hover);
  --color-serving-item-require-action-hover: var(--color-require-action-hover);
  --color-serving-item-require-action-delayed-hover: var(--color-require-action-delayed-hover);
  --color-serving-item-readytoclose-hover: var(--color-primary-hover-light);
  --color-serving-item-neutral: var(--color-neutral);
  --color-serving-item-require-action-title: var(--color-body-text);
  --color-dropdown-border: hsl(210, 14%, 89%);
  --color-catalog-background: hsl(192, 75%, 93%);
  --color-catalog-text: hsl(209, 61%, 92%);
  --color-catalog-selected-text: hsl(208, 39%, 12%);
  --grid-background: hsl(210, 13%, 98%);
  --grid-alt-row: hsl(210, 13%, 95%);
  --grid-selected: hsl(210, 8%, 95%);
  --grid-hover: hsl(210, 8%, 95%);
  --color-modal-background: var(--color-white);
  --color-modal-text: var(--color-body-text);
  --color-modal-border: var(--color-border-subtle);
}

html:has(.Dark) {
  --color-page-background: hsl(215, 35%, 13%);
  --color-sidebar-background: hsl(216, 41%, 20%);
  --color-header-background: hsl(215, 35%, 13%);
  --color-header-foreground: hsl(209, 61%, 92%);
  --color-header-link-active-background: var(--color-nav-background);
  --color-header-link-hover-background: hsl(216, 41%, 16%);
  --color-border-subtle: hsl(216, 56%, 27%);
  --color-border-medium: hsl(216, 56%, 27%);
  --color-border-medium-hover: hsl(216, 56%, 37%);
  --color-body-text: hsl(209, 61%, 92%);
  --color-text-dimmed: hsl(210, 39%, 55%);
  --color-accent: hsl(190, 56%, 62%);
  --color-accent-contrast: hsl(216, 41%, 20%);
  --color-headings: var(--color-body-text);
  --color-nav-background: hsl(216, 41%, 20%);
  --color-nav-text: var(--color-body-text);
  --color-nav-text-hover: var(--color-body-text);
  --color-product-search-icons: var(--color-body-text);
  --color-card-text: var(--color-body-text);
  --color-card-text-hover: var(--color-body-text);
  --color-card-background: hsl(216, 44%, 15%);
  --color-card-background-hover-default: hsl(216, 54%, 17%);
  --color-card-foreground: hsl(209, 61%, 92%);
  --color-border-restaurant: hsl(216, 56%, 27%);
  --color-arrangements-hover: hsl(1, 18%, 10%);
  --color-order-status-background: var(--color-nav-background);
  --color-orderline-background: hsl(216, 39%, 14%);
  --color-orderline-child-background: hsl(216, 30%, 18%);
  --color-orderline-border: var(--color-border-medium);
  --color-hover-background: var(--color-primary-hover-light);
  --color-hover-serving-background: hsl(216, 44%, 15%);
  --color-focus-outline: hsl(190, 56%, 62%);
  --color-input-background: hsl(216, 44%, 15%);
  --color-input-placeholder: hsl(212, 10%, 53%);
  --color-input-border: var(--color-border-medium);
  --color-input-border-hover: var(--color-border-medium-hover);
  --color-dropdown-listbox-background: var(--color-nav-background);
  --color-serving-item-background: var(--color-nav-background);
  --color-serving-item-neutral-hover: var(--color-hover-serving-background);
  --color-serving-item-okay-hover: var(--color-hover-serving-background);
  --color-serving-item-require-action-hover: var(--color-hover-serving-background);
  --color-serving-item-require-action-delayed-hover: var(--color-hover-serving-background);
  --color-serving-item-readytoclose-hover: var(--color-hover-serving-background);
  --color-serving-item-neutral: var(--color-border-restaurant);
  --color-serving-item-require-action-title: var(--color-accent-contrast);
  --color-section-background: transparent; /* make sticky bar transparent in dark */
  --color-section-border: var(--color-border-subtle); /* darker border in dark */
  --color-dropdown-border: var(--color-border-medium);
  --color-catalog-background: var(--color-primary-hover-light);
  --color-catalog-text: hsl(209, 61%, 92%);
  --color-catalog-selected-text: hsl(208, 39%, 12%);
  --grid-background: hsl(216, 44%, 15%);
  --grid-alt-row: hsl(216, 40%, 17%);
  --grid-selected: hsl(216, 41%, 20%);
  --grid-hover: hsl(216, 41%, 20%);
  --color-modal-background: hsl(216, 41%, 20%);
  --color-modal-text: var(--color-body-text);
  --color-modal-border: var(--color-border-subtle);
}
html:has(.Dark) .card {
  background-color: var(--color-card-background);
  border-color: var(--color-border-subtle);
  color: var(--color-body-text);
}
html:has(.Dark) .card-title {
  color: var(--color-headings);
}

@media (prefers-color-scheme: dark) {
  html:has(.SystemPreference) .card {
    background-color: var(--color-card-background);
    border-color: var(--color-border-subtle);
    color: var(--color-body-text);
  }
  html:has(.SystemPreference) .card-title {
    color: var(--color-headings);
  }
}
.menu-collapsed,
.menu-collapsed ~ .main {
  --sidebar-width: 3.5rem;
}

.hide-sidebar {
  --sidebar-width: 0px;
}

/* General */
/* Container sizes for various content containers */
/* General */
/* Container sizes for various content containers */
.control-label {
  font-weight: 600;
}

.form-group {
  margin-bottom: 1.5rem;
}
.form-group:last-child {
  margin-bottom: 0;
}

.text-right input.e-lib.e-input {
  text-align: right;
  padding-right: 0.5rem;
}

@media (hover: hover) and (pointer: fine) {
  input:focus, input.e-input:focus,
  textarea:focus,
  textarea.e-input:focus {
    outline: 0;
  }
  input:focus:focus-visible, input.e-input:focus:focus-visible,
  textarea:focus:focus-visible,
  textarea.e-input:focus:focus-visible {
    border-color: transparent;
    outline-color: transparent;
    border-radius: 0.25rem;
    -webkit-box-shadow: 0 0 0 0.125rem var(--color-focus-outline);
            box-shadow: 0 0 0 0.125rem var(--color-focus-outline);
  }
}
input, input.e-input,
textarea,
textarea.e-input {
  background-color: var(--color-input-background);
  color: inherit;
  border-radius: 0.25rem;
  border: var(--border-1) var(--color-input-border);
}
input:not(:disabled):hover, input.e-input:not(:disabled):hover,
textarea:not(:disabled):hover,
textarea.e-input:not(:disabled):hover {
  border-color: var(--color-input-border-hover);
}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
  color: var(--color-input-placeholder);
}
input::-moz-placeholder, textarea::-moz-placeholder {
  color: var(--color-input-placeholder);
}
input:-ms-input-placeholder, textarea:-ms-input-placeholder {
  color: var(--color-input-placeholder);
}
input::-ms-input-placeholder, textarea::-ms-input-placeholder {
  color: var(--color-input-placeholder);
}
input::placeholder,
textarea::placeholder {
  color: var(--color-input-placeholder);
}
input:disabled,
textarea:disabled {
  opacity: 0.5;
}

.page.Light input[type=date] {
  color-scheme: light;
}
.page.Dark input[type=date] {
  color-scheme: dark;
}
.page.SystemPreference input[type=date] {
  color-scheme: light dark;
}

ul {
  margin: 0;
  padding: 0;
}

a,
.btn-link {
  color: var(--color-secondary);
}

.valid.modified:not([type=checkbox]) {
  outline: 1px solid #26b050;
}

.invalid {
  outline: 1px solid var(--color-error);
}

.validation-message {
  color: var(--color-error);
}

#blazor-error-ui {
  background: var(--color-warning);
  top: var(--header-height);
  -webkit-box-shadow: 0 1px 1px hsla(60, 38%, 50%, 0.5);
          box-shadow: 0 1px 1px hsla(60, 38%, 50%, 0.5);
  display: none;
  left: 0;
  padding: 0.6rem 1.25rem 0.7rem 1.25rem;
  position: fixed;
  width: 100%;
  z-index: 1020;
}

#blazor-error-ui .dismiss {
  cursor: pointer;
  position: absolute;
  right: 0.75rem;
  top: 0.5rem;
}

#blazor-error-ui .reload {
  font-weight: bold;
}

#title {
  position: absolute;
  color: #000;
  top: calc(50% - 141px);
  left: 50%;
  margin-bottom: 1.5625rem;
  font-size: 1.75rem;
}

.sb-content-overlay {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 100vh;
}

.sb-content-overlay.sb-hide {
  display: none;
}

.page-padding {
  padding: var(--page-padding);
}

section:first-child:has(> h1),
.scroll-container {
  height: 100%;
  overflow: auto;
}

.modal-content {
  background-color: var(--color-modal-background);
  color: var(--color-modal-text);
  border-color: var(--color-modal-border);
}

.child-cancelled {
  text-decoration: line-through;
  color: var(--color-text-dimmed);
}

.status-active {
  color: var(--color-okay);
  font-weight: 600;
}

.order-cell {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
}

.order-type-badge {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25rem;
  padding: 0.125rem 0.5rem;
  background-color: var(--color-hover-background);
  color: var(--color-text-dimmed);
  border-radius: 4px;
  font-size: 0.85em;
}
.order-type-badge svg {
  width: 1rem;
  height: 1rem;
}

.order-number {
  font-weight: 500;
}

.venue-cell {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
  max-width: 100%;
}

.order-cancelled-banner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  margin-bottom: 0.5rem;
  background-color: var(--color-error);
  color: #fff;
  font-weight: 600;
  font-size: 1rem;
  border-radius: 4px;
}
.order-cancelled-banner svg {
  width: 1.25rem;
  height: 1.25rem;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

.icon-pencil {
  background: center/contain no-repeat url("/images/icons/pencil.svg");
  height: 1rem;
}

button svg {
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

body,
button {
  font-variant-numeric: tabular-nums;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--color-headings);
}

h1 {
  margin-bottom: 2rem;
}

h2,
h3 {
  margin-bottom: 1.5rem;
}

.order-new .e-dlg-header {
  font-size: 1.375rem;
}
.order-new .e-dlg-header-content {
  padding: 1rem 1rem 1.5rem;
  margin-bottom: 1.5rem;
}
@media (max-height: 56em) {
  .order-new .e-dlg-header-content {
    padding-bottom: 1rem;
    margin-bottom: 1rem;
  }
}
.order-new .e-dlg-content {
  display: contents;
}
.order-new .content-wrapper {
  padding: 0 1rem;
}
.order-new .action-buttons {
  padding: 0 1rem 1rem;
}

/* General */
/* Container sizes for various content containers */
.features-page {
  padding-left: 2rem;
  padding-right: 2rem;
}

.feature-settings {
  max-width: 860px;
}
.feature-settings .card {
  margin-bottom: 1.5rem;
  padding: 1.5rem;
}
.feature-settings .card-title {
  margin: 0 0 1rem;
}

.feature-switch-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1rem;
  margin: 0.75rem 0;
}

.feature-actions {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1rem;
}

.role-matrix {
  border-collapse: collapse;
  width: 100%;
  max-width: 620px;
}
.role-matrix th,
.role-matrix td {
  padding: 0.75rem 1rem;
}
.role-matrix thead th {
  border-bottom: 2px solid var(--color-border, #ddd);
}
.role-matrix thead th:first-child {
  text-align: left;
}
.role-matrix thead th:not(:first-child) {
  text-align: center;
  width: 110px;
  padding: 0.75rem 12px;
}
.role-matrix tbody th[scope=row] {
  text-align: left;
  font-weight: 500;
}
.role-matrix tbody td {
  text-align: center;
  padding: 0.75rem 12px;
}
.role-matrix tbody tr:nth-child(even) {
  background: var(--color-surface-alt, #f7f8fa);
}
.role-matrix__na {
  color: var(--color-muted, #aaa);
}

body .e-toast-container.e-toast-top-right {
  top: calc(var(--header-height) + 16px);
  right: 16px;
}

.e-toast-danger ul {
  list-style-type: disc;
  text-indent: 0;
  -webkit-margin-before: 1em;
          margin-block-start: 1em;
  -webkit-margin-after: 1em;
          margin-block-end: 1em;
  -webkit-margin-start: 0px;
          margin-inline-start: 0px;
  -webkit-margin-end: 0px;
          margin-inline-end: 0px;
  -webkit-padding-start: 20px;
          padding-inline-start: 20px;
}

/*
    PKR ?!
    .e-toast-header-close-icon::before {
    background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat; 
    position: relative;
}*/
/* Buttons */
.e-btn.e-outline {
  color: var(--color-body-text);
  border-color: var(--color-border-subtle);
}
.e-btn.e-outline:hover, .e-btn.e-outline:focus {
  background-color: var(--color-card-background-hover-default);
  color: var(--color-body-text);
}
.e-btn:disabled {
  cursor: not-allowed;
}

/* Inputs */
.e-input-group-icon:hover {
  background: var(--color-hover-background) !important;
  color: inherit !important;
  border-color: inherit !important;
}

/* Radio buttons */
.e-radio-wrapper label {
  /* The bootstrap5 theme hard-codes the label to #212529, which is unreadable
     on the dark page background. Use the theme-aware token so it adapts. */
}
.e-radio-wrapper label .e-label {
  color: var(--color-body-text);
}
.e-radio-wrapper label:hover {
  background-color: var(--color-hover-background);
}

/* Focus styles */
.e-input-group.e-input-focus:not(.e-warning):not(.e-success):not(.e-error), .e-input-group.e-input-focus:not(.e-warning):not(.e-success):not(.e-error):hover, .e-input-group.e-control-wrapper.e-input-focus:not(.e-warning):not(.e-success):not(.e-error), .e-input-group.e-control-wrapper.e-input-focus:not(.e-warning):not(.e-success):not(.e-error):hover {
  border-color: var(--color-primary) !important;
  -webkit-box-shadow: 0 0 0.1875rem 0 var(--color-primary);
          box-shadow: 0 0 0.1875rem 0 var(--color-primary);
}

/* Dropdown */
.e-dropdown-popup {
  background-color: var(--color-dropdown-listbox-background);
  color: var(--color-body-text);
}
.e-dropdown-popup ul {
  font-size: 1rem;
  border-color: var(--color-dropdown-border);
}
.e-dropdown-popup ul .e-item {
  height: 2.5rem;
  line-height: 2.5rem;
}
@media (hover: none) and (pointer: coarse) {
  .e-dropdown-popup ul .e-item {
    height: 3rem;
    line-height: 3rem;
  }
}
.e-dropdown-popup ul .e-item:hover {
  background-color: var(--color-hover-background);
  color: inherit;
}

.e-dropdownbase .e-list-item {
  font-size: 1rem;
  height: 2.5rem;
  line-height: 2.5rem;
}
@media (hover: none) and (pointer: coarse) {
  .e-dropdownbase .e-list-item {
    height: 3rem;
    line-height: 3rem;
  }
}
.e-dropdownbase .e-list-item.e-hover {
  background-color: var(--color-hover-background);
}

/* Inputs */
.e-input-group input.e-input input.e-input,
.e-input-group input.e-input textarea.e-input, .e-input-group.e-control-wrapper input.e-input,
.e-input-group.e-control-wrapper textarea.e-input {
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, "Noto Sans", sans-serif, BlinkMacSystemFont, "Helvetica Neue", Arial, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 1rem;
}
.e-input-group input.e-input input.e-input, .e-input-group.e-control-wrapper input.e-input {
  height: 2.375rem;
}

/* Radio buttons */
.e-radio-wrapper {
  padding: 0 0.5rem;
}
.e-radio-wrapper:first-child {
  padding-left: 0;
}
.e-radio-wrapper:last-child {
  padding-right: 0;
}

.e-radio + label::before {
  width: 1rem;
  height: 1rem;
}
.e-radio + label::after {
  left: 5px;
  top: 5px;
}
.e-radio + label .e-label {
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, "Noto Sans", sans-serif, BlinkMacSystemFont, "Helvetica Neue", Arial, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 1rem;
}

/* Checkboxes */
.e-checkbox-wrapper .e-frame {
  height: 1rem;
  width: 1rem;
}
.e-checkbox-wrapper .e-check::before {
  content: "";
  display: inline-block;
  background: center/contain no-repeat url("/images/icons/check-white.svg");
  width: 0.875rem;
  height: 0.875rem;
}

.order-new {
  position: fixed;
  top: 50% !important;
  left: 50% !important;
  width: 60rem !important;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  padding: 0.4375rem;
}

.label {
  font-weight: 600;
}

.e-device .e-dlg-content * {
  font-size: 0.875rem;
}

/* Date picker */
.order-date-picker.e-popup-open {
  left: unset !important;
  right: 0.25rem;
  top: 10.9375rem !important;
  -webkit-box-shadow: 0 0 1rem 0 rgba(0, 0, 0, 0.15);
          box-shadow: 0 0 1rem 0 rgba(0, 0, 0, 0.15);
}
@media (min-width: 76.1875rem) {
  .order-date-picker.e-popup-open {
    top: 7.9385rem !important;
  }
}

.e-toast-ref-element:empty {
  display: none;
}

/* SwitchPaymentDialog — SfDialog renders outside component scope, so scoped styles don't apply */
.switch-payment-dialog-wrapper.e-dialog {
  background-color: var(--color-card-background);
  color: var(--color-body-text);
}
.switch-payment-dialog-wrapper .e-dlg-header-content {
  background-color: var(--color-card-background);
  color: var(--color-headings);
  border-bottom: 1px solid var(--color-border-subtle);
}
.switch-payment-dialog-wrapper .e-dlg-header-content .e-btn.e-dlg-closeicon-btn {
  color: var(--color-body-text);
}
.switch-payment-dialog-wrapper .e-dlg-content {
  background-color: var(--color-card-background);
  color: var(--color-body-text);
}
.switch-payment-dialog-wrapper .e-footer-content {
  background-color: var(--color-card-background);
}
.switch-payment-dialog-wrapper {
  /* Payment method buttons: ensure hover is readable in dark mode */
}
.switch-payment-dialog-wrapper .radio-button-wrapper {
  color: var(--color-body-text);
}
.switch-payment-dialog-wrapper .radio-button-wrapper:hover {
  background-color: var(--color-card-background-hover-default);
}
.switch-payment-dialog-wrapper .radio-button-wrapper label {
  border-color: var(--color-border-medium);
}

.grid-wrapper {
  max-width: 60rem;
  -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.062745098);
          box-shadow: 0 0 20px rgba(0, 0, 0, 0.062745098);
  border-radius: 8px;
}
.grid-wrapper .e-grid {
  padding: 1rem;
}
.grid-wrapper .e-toolbar .e-toolbar-items {
  padding: 0;
}

.e-grid {
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, "Noto Sans", sans-serif, BlinkMacSystemFont, "Helvetica Neue", Arial, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  border-color: transparent;
  background: var(--grid-background);
  border-radius: 8px;
}
.e-grid,
.e-grid .e-headercell,
.e-grid .e-gridheader,
.e-grid .e-headercontent,
.e-grid .e-gridcontent,
.e-grid .e-content,
.e-grid .e-table,
.e-grid .e-emptyrow td,
.e-grid .e-rowcell,
.e-grid .e-detailheadercell,
.e-grid .e-detailindentcell,
.e-grid .e-detailrowcollapse,
.e-grid .e-detailrowexpand {
  background-color: var(--grid-background) !important;
  color: var(--color-body-text) !important;
}
.e-grid .e-emptyrow td {
  min-height: 2.5rem;
}
.e-grid .e-toolbar {
  background: var(--grid-background);
  border-color: transparent;
  border-radius: 8px 8px 0 0;
}
.e-grid .e-toolbar .e-search .e-input,
.e-grid .e-toolbar .e-search input.e-input,
.e-grid .e-toolbar .e-search input.e-searchinput {
  background-color: var(--color-input-background) !important;
  color: var(--color-body-text) !important;
  height: 2rem;
}
.e-grid .e-toolbar .e-search .e-input-group,
.e-grid .e-toolbar .e-search .e-input-group.e-control-wrapper,
.e-grid .e-toolbar .e-search span.e-input-group {
  background-color: var(--color-input-background) !important;
  border-color: var(--color-border-subtle) !important;
}
.e-grid .e-toolbar .e-search .e-search-icon,
.e-grid .e-toolbar .e-search .e-searchclear {
  background-color: var(--color-input-background) !important;
}
.e-grid .e-toolbar .e-toolbar-search span.e-input-group,
.e-grid .e-toolbar .e-toolbar-search .e-input-group {
  background: var(--color-input-background) !important;
  background-color: var(--color-input-background) !important;
  border-color: var(--color-border-subtle) !important;
  border-bottom-color: var(--color-border-subtle) !important;
}
.e-grid .e-toolbar .e-toolbar-search span.e-input-group::before, .e-grid .e-toolbar .e-toolbar-search span.e-input-group::after,
.e-grid .e-toolbar .e-toolbar-search .e-input-group::before,
.e-grid .e-toolbar .e-toolbar-search .e-input-group::after {
  background: var(--color-border-subtle) !important;
}
.e-grid .e-toolbar .e-toolbar-search span.e-input-group input,
.e-grid .e-toolbar .e-toolbar-search span.e-input-group input.e-input,
.e-grid .e-toolbar .e-toolbar-search span.e-input-group input.e-searchinput,
.e-grid .e-toolbar .e-toolbar-search .e-input-group input,
.e-grid .e-toolbar .e-toolbar-search .e-input-group input.e-input,
.e-grid .e-toolbar .e-toolbar-search .e-input-group input.e-searchinput {
  background: transparent !important;
  background-color: transparent !important;
  color: var(--color-body-text) !important;
}
.e-grid .e-toolbar .e-toolbar-search span.e-input-group .e-input-group-icon,
.e-grid .e-toolbar .e-toolbar-search .e-input-group .e-input-group-icon {
  background: transparent !important;
  color: var(--color-body-text) !important;
}
.e-grid .e-gridheader {
  border-top-color: transparent;
  border-bottom-color: var(--grid-background);
  border-bottom-width: 2px;
  -webkit-box-shadow: 0 4px 10px rgba(0, 0, 0, 0.062745098);
          box-shadow: 0 4px 10px rgba(0, 0, 0, 0.062745098);
}
.e-grid .e-headercelldiv,
.e-grid .e-headertext,
.e-grid .e-sortfilterdiv,
.e-grid .e-filtermenudiv {
  color: var(--color-body-text) !important;
}
.e-grid .e-rowcell {
  padding-top: 9px;
  padding-bottom: 9px;
  border-color: transparent;
  border-width: 0;
}
.e-grid .e-gridcontent .e-altrow .e-rowcell:not(.e-editedbatchcell):not(.e-updatedtd) {
  background-color: var(--grid-alt-row) !important;
}
.e-grid .e-headercell {
  height: 3rem;
}
.e-grid td.e-active {
  background: var(--grid-selected);
}
.e-grid .e-sortnumber {
  margin-top: 4px;
  background-color: var(--grid-selected);
  height: 1rem;
  width: 1rem;
}
.e-grid.e-gridhover tr[role=row]:not(.e-editedrow):hover .e-rowcell:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell) {
  background: var(--grid-hover);
}
.e-grid .e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error), .e-grid .e-input-group.e-control-wrapper.e-input-focus:not(.e-success):not(.e-warning):not(.e-error), .e-grid .e-input-group.e-input-focus:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled), .e-grid .e-input-group.e-control-wrapper.e-input-focus:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) {
  border-color: var(--color-border-subtle);
  /* box-shadow: 0 0 0.25em rgba(108, 117, 125, 0.5); */
  -webkit-box-shadow: 0 0 0 3px rgba(130, 138, 145, 0.5);
          box-shadow: 0 0 0 3px rgba(130, 138, 145, 0.5);
  -webkit-transition: none;
  transition: none;
}
.e-grid .e-gridcontent {
  border-radius: 0 0 8px 8px;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.062745098);
          box-shadow: 0 0 10px rgba(0, 0, 0, 0.062745098);
  padding-bottom: 8px;
}

.e-toolbar .e-toolbar-items {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  min-height: unset;
  background: var(--grid-background);
  padding: 0 4px;
}
.e-toolbar .e-toolbar-items:first-child > .e-toolbar-right .e-toolbar-item:last-child {
  margin-right: 0;
}
.e-toolbar .e-toolbar-items:not(.e-tbar-pos) .e-toolbar-item:first-child {
  margin-left: 0;
}
.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn.e-tbtn-txt .e-icons.e-btn-icon {
  padding-top: 4px;
}
.e-toolbar .e-toolbar-items .e-toolbar-item:not(.e-separator) {
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 0;
  padding-right: 0;
}
.e-toolbar .e-toolbar-items .e-toolbar-item.e-overlay {
  background: inherit;
}
.e-toolbar .e-toolbar-items .e-toolbar-left .e-toolbar-item:first-child {
  margin-left: 0;
}
.e-toolbar .e-toolbar-items.e-tbar-pos {
  margin-bottom: 8px;
}
.e-toolbar .e-toolbar-items .e-tbar-btn .e-tbar-btn-text {
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, "Noto Sans", sans-serif, BlinkMacSystemFont, "Helvetica Neue", Arial, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  text-transform: uppercase;
  font-weight: 600;
}
.e-toolbar .e-tbar-btn,
.e-toolbar .e-tbar-btn.e-btn,
.e-toolbar .e-tbar-btn.e-btn.e-tbtn-txt {
  background: var(--grid-background) !important;
  color: var(--color-body-text) !important;
  border-color: var(--color-border-subtle);
}
.e-toolbar .e-tbar-btn .e-tbar-btn-text,
.e-toolbar .e-tbar-btn .e-btn-icon,
.e-toolbar .e-tbar-btn.e-btn .e-tbar-btn-text,
.e-toolbar .e-tbar-btn.e-btn .e-btn-icon,
.e-toolbar .e-tbar-btn.e-btn.e-tbtn-txt .e-tbar-btn-text,
.e-toolbar .e-tbar-btn.e-btn.e-tbtn-txt .e-btn-icon {
  color: var(--color-body-text) !important;
}
.e-toolbar .e-tbar-btn:hover, .e-toolbar .e-tbar-btn:focus, .e-toolbar .e-tbar-btn:active,
.e-toolbar .e-tbar-btn.e-btn:hover,
.e-toolbar .e-tbar-btn.e-btn:focus,
.e-toolbar .e-tbar-btn.e-btn:active,
.e-toolbar .e-tbar-btn.e-btn.e-tbtn-txt:hover,
.e-toolbar .e-tbar-btn.e-btn.e-tbtn-txt:focus,
.e-toolbar .e-tbar-btn.e-btn.e-tbtn-txt:active {
  background: var(--grid-hover) !important;
  color: var(--color-body-text) !important;
}
.e-toolbar .e-toolbar-item .e-search .e-search-icon, .e-toolbar .e-toolbar-item .e-search .e-search-icon:hover {
  border-left-color: transparent;
  padding: 0 4px;
}
.e-toolbar .e-toolbar-item .e-search .e-search-icon:hover {
  background: var(--color-input-background);
}
.e-toolbar .e-search-icon::before {
  background: center/contain no-repeat url("/images/icons/search.svg");
}

.e-toolbar .e-add::before,
.e-toolbar .e-delete::before,
.e-toolbar .e-update::before,
.e-toolbar .e-cancel::before,
.e-toolbar .e-search-icon::before {
  display: inline-block;
  content: "";
  width: 1.125rem;
  height: 1.125rem;
}
.e-toolbar .e-add::before {
  background: center/contain no-repeat url("/images/icons/plus.svg");
  -webkit-transform: translateY(2px);
      -ms-transform: translateY(2px);
          transform: translateY(2px);
}
.e-toolbar .e-delete::before {
  background: center/contain no-repeat url("/images/icons/trash.svg");
  -webkit-transform: translateY(2px);
      -ms-transform: translateY(2px);
          transform: translateY(2px);
}
.e-toolbar .e-update::before {
  background: center/contain no-repeat url("/images/icons/device-floppy.svg");
  -webkit-transform: translateY(3px);
      -ms-transform: translateY(3px);
          transform: translateY(3px);
}
.e-toolbar .e-cancel::before {
  background: center/contain no-repeat url("/images/icons/x.svg");
  -webkit-transform: translateY(3px);
      -ms-transform: translateY(3px);
          transform: translateY(3px);
}

.e-columnheader .e-icon-ascending::before,
.e-columnheader .e-icon-descending::before {
  display: inline-block;
  content: "";
  width: 1.125rem;
  height: 1.125rem;
}

.e-control {
  /*font-family: inherit;*/
}

/* Column header */
.e-columnheader .e-icon-ascending::before {
  background: center/contain no-repeat url("/images/icons/sort-ascending.svg");
  width: 1.125rem;
  height: 1.125rem;
}

.e-columnheader .e-icon-descending::before {
  background: center/contain no-repeat url("/images/icons/sort-descending.svg");
  width: 1.125rem;
  height: 1.125rem;
}

/* Dark mode: invert SVG icons in grid headers, pager, toolbar, and action buttons */
:root:has(.Dark) .action-button img {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
}
:root:has(.Dark) .e-columnheader .e-icon-ascending::before,
:root:has(.Dark) .e-columnheader .e-icon-descending::before,
:root:has(.Dark) .e-pager .e-icon-first::before,
:root:has(.Dark) .e-pager .e-icon-prev::before,
:root:has(.Dark) .e-pager .e-icon-next::before,
:root:has(.Dark) .e-pager .e-icon-last::before,
:root:has(.Dark) .e-toolbar .e-add::before,
:root:has(.Dark) .e-toolbar .e-delete::before,
:root:has(.Dark) .e-toolbar .e-update::before,
:root:has(.Dark) .e-toolbar .e-cancel::before,
:root:has(.Dark) .e-toolbar .e-search-icon::before,
:root:has(.Dark) .e-grid .e-icon-filter {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
}

@media (prefers-color-scheme: dark) {
  :root:has(.SystemPreference) .action-button img {
    -webkit-filter: brightness(0) invert(1);
            filter: brightness(0) invert(1);
  }
  :root:has(.SystemPreference) .e-columnheader .e-icon-ascending::before,
  :root:has(.SystemPreference) .e-columnheader .e-icon-descending::before,
  :root:has(.SystemPreference) .e-pager .e-icon-first::before,
  :root:has(.SystemPreference) .e-pager .e-icon-prev::before,
  :root:has(.SystemPreference) .e-pager .e-icon-next::before,
  :root:has(.SystemPreference) .e-pager .e-icon-last::before,
  :root:has(.SystemPreference) .e-toolbar .e-add::before,
  :root:has(.SystemPreference) .e-toolbar .e-delete::before,
  :root:has(.SystemPreference) .e-toolbar .e-update::before,
  :root:has(.SystemPreference) .e-toolbar .e-cancel::before,
  :root:has(.SystemPreference) .e-toolbar .e-search-icon::before,
  :root:has(.SystemPreference) .e-grid .e-icon-filter {
    -webkit-filter: brightness(0) invert(1);
            filter: brightness(0) invert(1);
  }
}
.e-grid .e-btn.e-outline {
  border-color: var(--color-border-subtle);
}

/* Pagination */
.e-grid .e-pager {
  border-top: transparent;
  background: var(--grid-background);
  color: var(--color-body-text);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-top: 1rem;
}

.e-pager {
  padding: 0;
  background-color: var(--grid-background);
  color: var(--color-body-text);
}
.e-pager .e-pagercontainer {
  margin: 0;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}
.e-pager .e-icons,
.e-pager .e-numericitem,
.e-pager .e-pagercontainer .e-first,
.e-pager .e-pagercontainer .e-prev,
.e-pager .e-pagercontainer .e-next,
.e-pager .e-pagercontainer .e-last,
.e-pager .e-mfirst,
.e-pager .e-mprev,
.e-pager .e-mnext,
.e-pager .e-mlast {
  background-color: var(--grid-background);
  color: var(--color-body-text);
  border-color: var(--color-border-subtle);
}

.e-pager .e-pagercontainer .e-icons,
.e-pager .e-numericitem {
  padding: 0;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  width: 2.5rem;
  height: 2.5rem;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.e-pager .e-pagercontainer .e-prev::before,
.e-pager .e-pagercontainer .e-next::before {
  content: "";
  width: 1rem;
  height: 1rem;
}

.e-pager .e-pagercontainer .e-first::before,
.e-pager .e-pagercontainer .e-last::before {
  content: "";
  width: 1.25rem;
  height: 1.25rem;
}

.e-pager .e-numericitem {
  color: var(--color-body-text);
}

.e-pager .e-currentitem,
.e-pager .e-numericitem.e-currentitem,
.e-pager .e-numericitem.e-currentitem:hover,
.e-pager .e-numericitem.e-currentitem:focus,
.e-pager .e-numericitem.e-currentitem:active,
.e-pager .e-active {
  background: var(--grid-selected) !important;
  background-color: var(--grid-selected) !important;
  color: var(--color-body-text) !important;
  border-color: var(--color-border-subtle) !important;
}

.e-pager div.e-icons {
  color: var(--color-body-text);
}

.e-pager .e-icon-first::before {
  background: center/contain no-repeat url("/images/icons/chevrons-left.svg");
}

.e-pager .e-icon-prev::before {
  background: center/contain no-repeat url("/images/icons/chevron-left.svg");
}

.e-pager .e-icon-next::before {
  background: center/contain no-repeat url("/images/icons/chevron-right.svg");
}

.e-pager .e-icon-last::before {
  background: center/contain no-repeat url("/images/icons/chevrons-right.svg");
}

.e-pager.sf-pager .e-prev {
  margin-left: 0;
}

.e-pager.sf-pager .e-last {
  margin-left: 0;
}

.e-numericcontainer {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

.e-pager .e-pagerdropdown {
  all: unset;
  width: 72px;
}

.e-pager .e-pagesizes {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-ordinal-group: 0;
      -ms-flex-order: -1;
          order: -1;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  padding-right: 1rem;
}

.e-pager .e-pagerconstant {
  all: unset;
  margin-left: 0.75rem;
}

.e-grid .e-pager .e-control-wrapper .e-dropdownlist {
  height: 38px;
  min-width: none;
  background: var(--color-hover-background);
}

.e-pager .e-spacing.e-numericitem:not(.e-active):not(.e-np):not(.e-pp):hover {
  background: var(--grid-hover);
}

.e-pager .e-currentitem,
.e-pager .e-currentitem:hover {
  background: var(--grid-selected) !important;
  color: var(--color-body-text) !important;
}

.e-pager .e-parentmsgbar {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  text-align: right;
  padding-left: 1rem;
}

/* Override Syncfusion default border-color: #fff on grid cells (breaks dark mode) */
.e-grid .e-rowcell,
.e-grid .e-groupcaption,
.e-grid .e-indentcell,
.e-grid .e-recordplusexpand,
.e-grid .e-recordpluscollapse,
.e-grid .e-rowdragdropcell,
.e-grid .e-detailrowcollapse,
.e-grid .e-detailrowexpand,
.e-grid .e-detailindentcell,
.e-grid .e-detailcell {
  border-color: var(--color-border-subtle);
}
/*# sourceMappingURL=Presentation\Kentaurus.Web\wwwroot\styles\app.css.map */