/* Shared screen-only flat themes. The historical asset URL is retained for all
   existing screen entry points. Registration's explicit theme takes precedence
   over an absent shell preference; obsolete or missing preferences use navy. */
@media screen {
  html:root {
    --my-shell-primary: #123f61;
    --my-shell-primary-strong: #0d304b;
    --my-shell-primary-soft: #edf3f7;
    --my-shell-bg: #eef4f8;
    --my-shell-surface: #fff;
    --my-shell-surface-soft: #f8fbfd;
    --my-shell-ink: #0f172a;
    --my-shell-muted: #64748b;
    --my-shell-line: #d8e4ed;
  }

  html:root[data-my-theme="blue"]:not([data-register-theme]),
  html:root[data-register-theme="blue"] {
    --my-shell-primary: #495aa3;
    --my-shell-primary-strong: #323f7c;
    --my-shell-primary-soft: #eef0f8;
  }

  html:root[data-my-theme="green"]:not([data-register-theme]),
  html:root[data-register-theme="green"] {
    --my-shell-primary: #0f766e;
    --my-shell-primary-strong: #115e59;
    --my-shell-primary-soft: #eaf5f3;
  }

  html:root[data-my-theme="dark"]:not([data-register-theme]),
  html:root[data-register-theme="dark"] {
    --my-shell-primary: #334155;
    --my-shell-primary-strong: #0f172a;
    --my-shell-primary-soft: #e8edf3;
    --my-shell-bg: #e7edf5;
  }

  html:root {
    --my-shell-sidebar-deep: var(--my-shell-primary);
    --my-shell-sidebar-mid: var(--my-shell-primary);
    --my-shell-sidebar-low: var(--my-shell-primary);
    --alfares-focus-ring: var(--my-shell-primary);
    --auth-primary: var(--my-shell-primary);
    --auth-primary-deep: var(--my-shell-primary-strong);
    --auth-primary-soft: var(--my-shell-primary-soft);
    --register-primary: var(--my-shell-primary);
    --register-primary-deep: var(--my-shell-primary-strong);
    --register-primary-soft: var(--my-shell-primary-soft);
    --invoice-detail-head-start: var(--my-shell-primary);
    --invoice-detail-head-end: var(--my-shell-primary);
    --invoice-detail-head-ink: #fff;
    --invoice-detail-head-line: color-mix(in srgb, var(--my-shell-primary) 45%, #fff);
    --invoice-detail-head-accent: color-mix(in srgb, var(--my-shell-primary) 24%, #fff);
  }

  /* branches */
  html:root .branches-page {
    --branches-blue: var(--my-shell-primary);
    --branches-blue-dark: var(--my-shell-primary-strong);
  }

  /* locations */
  html:root .locations-page {
    --locations-primary: var(--my-shell-primary);
    --locations-primary-dark: var(--my-shell-primary-strong);
  }

  /* units */
  html:root .units-page {
    --units-primary: var(--my-shell-primary);
    --units-primary-dark: var(--my-shell-primary-strong);
  }

  /* categories */
  html:root .categories-page {
    --categories-primary: var(--my-shell-primary);
    --categories-primary-dark: var(--my-shell-primary-strong);
  }

  /* activities */
  html:root .activities-page {
    --activities-primary: var(--my-shell-primary);
    --activities-primary-dark: var(--my-shell-primary-strong);
  }

  /* sources */
  html:root .sources-page {
    --sources-primary: var(--my-shell-primary);
    --sources-primary-dark: var(--my-shell-primary-strong);
  }

  /* sellers */
  html:root .sellers-page {
    --sellers-primary: var(--my-shell-primary);
    --sellers-primary-dark: var(--my-shell-primary-strong);
  }

  /* cost centers */
  html:root .cost-centers-page {
    --cc-blue-950: var(--my-shell-primary-strong);
    --cc-blue-900: var(--my-shell-primary-strong);
    --cc-blue-800: var(--my-shell-primary-strong);
    --cc-blue-700: var(--my-shell-primary);
    --cc-blue-600: var(--my-shell-primary);
  }

  /* accounts */
  html:root #OprAccounts_Page {
    --accounts-primary: var(--my-shell-primary);
    --accounts-primary-strong: var(--my-shell-primary-strong);
  }

  /* accounts modern */
  html:root #OprAccounts_Page {
    --accounts-modern-primary: var(--my-shell-primary);
    --accounts-modern-primary-strong: var(--my-shell-primary-strong);
    --accounts-modern-table-head: var(--my-shell-primary);
    --accounts-modern-focus: color-mix(in srgb, var(--my-shell-primary) 16%, transparent);
  }

  /* items */
  html:root #OprItems_Page {
    --items-blue: var(--my-shell-primary);
    --items-blue-dark: var(--my-shell-primary-strong);
    --items-header: var(--my-shell-primary);
  }

  /* items modern */
  html:root #OprItems_Page {
    --items-modern-primary: var(--my-shell-primary);
    --items-modern-primary-hover: var(--my-shell-primary-strong);
    --items-modern-table-head: var(--my-shell-primary);
    --items-modern-focus: var(--my-shell-primary);
  }

  /* permissions */
  html:root .permissions-page {
    --slh-blue: var(--my-shell-primary);
    --slh-blue-strong: var(--my-shell-primary-strong);
  }

  /* options */
  html:root .options-page {
    --options-primary: var(--my-shell-primary);
    --options-primary-strong: var(--my-shell-primary-strong);
  }

  /* account bindings */
  html:root .tarefat-page {
    --tarefat-primary: var(--my-shell-primary);
    --tarefat-primary-strong: var(--my-shell-primary-strong);
  }

  /* database settings */
  html:root .config-db-page {
    --config-db-primary: var(--my-shell-primary);
    --config-db-primary-dark: var(--my-shell-primary-strong);
  }

  /* HR */
  html:root .hr-visual-page.hr-visual-page {
    --hr-visual-blue: var(--my-shell-primary);
    --hr-visual-accent: var(--my-shell-primary);
    --hr-visual-accent-soft: color-mix(in srgb, var(--my-shell-primary) 10%, #fff);
  }

  /* payroll */
  html:root .hrp-page {
    --hrp-blue: var(--my-shell-primary);
    --hrp-blue-deep: var(--my-shell-primary-strong);
  }

  /* fast production */
  html:root .fp-page {
    --fp-blue: var(--my-shell-primary);
    --fp-blue-deep: var(--my-shell-primary-strong);
  }

  /* reports */
  html:root .my-report-page {
    --my-report-blue: var(--my-shell-primary);
    --my-report-accent: var(--my-shell-primary);
    --my-report-accent-soft: color-mix(in srgb, var(--my-shell-primary) 10%, #fff);
  }

  /* document blue actions */
  html:root :is(.erp-opr-invoice-shell, .erp-opr-sndat-shell) {
    --my-doc-blue: var(--my-shell-primary);
    --my-doc-action: var(--my-shell-primary);
    --my-doc-action-hover: var(--my-shell-primary-strong);
    --my-doc-edit: var(--my-shell-primary);
    --my-doc-edit-hover: var(--my-shell-primary-strong);
  }

  /* invoice/voucher detail and lookup identity */
  html:root :is(.erp-opr-invoice-shell, .erp-opr-sndat-shell) {
    --invoice-detail-head-start: var(--my-shell-primary);
    --invoice-detail-head-end: var(--my-shell-primary);
    --invoice-detail-head-accent: color-mix(in srgb, var(--my-shell-primary) 24%, #fff);
    --invoice-detail-head-line: color-mix(in srgb, var(--my-shell-primary) 45%, #fff);
  }

  /* POS blue accent */
  html:root .pos2-restaurant-document {
    --pos2-accent: var(--my-shell-primary);
    --pos2-product-blue: var(--my-shell-primary);
  }

  /* POS legacy blue actions */
  html:root .pos2-restaurant-document .pos2-legacy-stage {
    --pos2-sales-blue: var(--my-shell-primary);
    --pos2-action-blue: var(--my-shell-primary);
    --pos2-action-blue-dark: var(--my-shell-primary-strong);
  }


  /* Legacy directory headers keep their existing size and behavior. */
  html:root :is(
    .branches-page .branches-table,
    .locations-page .locations-table,
    .units-page .units-table,
    .categories-page .categories-table,
    .activities-page .activities-table,
    .sources-page .sources-table,
    .sellers-page .sellers-table,
    .cost-centers-page .cost-centers-table,
    .fp-page .fp-table
  ) thead th {
    background: var(--my-shell-primary);
    color: #fff;
  }

  /* Draft/edit uses the same blue in its normal, hover and focus states. */
  html:root
    :is(.erp-opr-invoice-shell, .erp-opr-sndat-shell) .invoice-draft-button {
    --doc-button-tone: var(--my-shell-primary);
    --doc-button-hover: var(--my-shell-primary-strong);
    --doc-button-bg: var(--my-shell-primary);
    --doc-button-bg-hover: var(--my-shell-primary-strong);
  }

  /* Common document surfaces consume flat values instead of private gradients.
     Product photos, charts, content fields and print remain module-owned. */
  html:root body :is(.erp-opr-invoice-shell, .erp-opr-sndat-shell) {
    --invoice-shell-surface: var(--my-shell-bg) !important;
    --invoice-surface-command: var(--my-shell-surface) !important;
    --invoice-surface-identity: var(--my-shell-surface) !important;
    --invoice-surface-workspace: var(--my-shell-surface-soft) !important;
    --invoice-surface-items: var(--my-shell-surface) !important;
    --invoice-surface-totals: var(--my-shell-surface-soft) !important;
    --invoice-premium-soft-head-bg: var(--my-shell-surface-soft) !important;
    --invoice-premium-card-head-bg: var(--my-shell-primary) !important;
  }

  /* Only gradient-valued button tokens are flattened. Existing flat report,
     cancel and destructive button fills keep their own foreground contract. */
  html:root body .kt-invoice-extension .kt-tailoring-print-button.is-general {
    --doc-button-bg: #285fc2 !important;
    --doc-button-bg-hover: #1e4fae !important;
  }

  html:root body .erp-opr-invoice-shell .invoice-workshop-save-button {
    --doc-button-bg: #168058 !important;
    --doc-button-bg-hover: #116746 !important;
  }

  html:root body .erp-opr-invoice-shell .my-document-button[data-command-kind="new"] {
    --doc-button-bg: var(--my-doc-new) !important;
    --doc-button-bg-hover: var(--my-doc-new-hover) !important;
  }

  html:root body .erp-opr-invoice-shell .my-document-button[data-command-kind="reports"] {
    --doc-button-bg: #566b7c !important;
    --doc-button-bg-hover: #435666 !important;
  }

  html:root body .erp-opr-invoice-shell .my-document-button[data-command-kind="return"] {
    --doc-button-bg: var(--my-doc-return) !important;
    --doc-button-bg-hover: var(--my-doc-return-hover) !important;
  }

  html:root body .erp-opr-invoice-shell .invoice-save-button {
    --doc-button-bg: var(--my-doc-save) !important;
    --doc-button-bg-hover: var(--my-doc-save-hover) !important;
  }

  html:root body .erp-opr-invoice-shell .invoice-draft-button {
    --doc-button-bg: var(--my-doc-edit) !important;
    --doc-button-bg-hover: var(--my-doc-edit-hover) !important;
  }

  html:root body .erp-opr-invoice-shell .invoice-save-print-button {
    --doc-button-bg: var(--my-doc-save-print) !important;
    --doc-button-bg-hover: var(--my-doc-save-print-hover) !important;
  }

  html:root body .erp-opr-invoice-shell .invoice-multi-payment-button {
    --doc-button-bg: var(--my-doc-payment) !important;
    --doc-button-bg-hover: var(--my-doc-payment-hover) !important;
  }

  html:root body .invoice-extra-data-button {
    --doc-button-bg: var(--my-doc-workshop) !important;
    --doc-button-bg-hover: var(--my-doc-workshop-hover) !important;
  }

  html:root body .invoice-extra-qr-button {
    --doc-button-bg: var(--my-doc-qr) !important;
    --doc-button-bg-hover: var(--my-doc-qr-hover) !important;
  }

  html:root body .erp-opr-invoice-shell .invoice-extra-data-button {
    --doc-button-bg: var(--my-doc-workshop) !important;
    --doc-button-bg-hover: var(--my-doc-workshop-hover) !important;
  }

  html:root body .erp-opr-invoice-shell .invoice-extra-qr-button {
    --doc-button-bg: var(--my-doc-qr) !important;
    --doc-button-bg-hover: var(--my-doc-qr-hover) !important;
  }


  html:root body .erp-opr-invoice-shell.erp-opr-invoice-shell .my-document-payment-methods button[data-payment-value] {
    background: var(--payment-option-bg-end, var(--my-shell-surface)) !important;
  }

  html:root body .erp-opr-invoice-shell.erp-opr-invoice-shell .my-document-payment-methods button[data-payment-value]:not(.is-active):not([aria-pressed="true"]):focus-visible {
    background: var(--payment-option-hover-bg, var(--my-shell-surface-soft)) !important;
  }

  html:root body .erp-opr-invoice-shell.erp-opr-invoice-shell .my-document-payment-methods button[data-payment-value]:is(.is-active, [aria-pressed="true"]) {
    background: var(--payment-option-active-end, var(--my-shell-primary)) !important;
  }

  html:root body :is(.my-document-button.is-blue, .my-shell-button.is-primary,
    .my-document-workspace-tabs button.is-active, .auth-language-switcher .lang-btn.is-active,
    .register-plan-toolbar .alfares-plan-tabs [aria-selected="true"],
    .register-billing-toggle button.is-active, .register-plan-grid .register-plan-select) {
    background: var(--my-shell-primary) !important;
    color: #fff !important;
  }

  html:root body .my-document-button.is-primary {
    background: var(--my-doc-primary, #0f766e) !important;
  }

  /* Neutral chrome and card surfaces share one solid fill. */
  html:root body :is(.my-slider-home-head, .my-nav-menu.my-nav-user-menu--premium,
    .my-nav-shortcuts-head, .my-nav-shortcuts-commit-bar, .my-nav-collapsed-flyout-head,
    .my-nav-user-license-card, .my-report-select-panel, .alfares-system-confirm,
    .invoice-row-details-menu--item-details, .invoice-data-premium-panel,
    .erp-voucher-account-search-premium-box, .invoice-party-premium-search,
    .erp-document-search-premium-box, .erp-invoice-document-search__table-head,
    .auth-card, .auth-control, .auth-select-panel, .auth-dialog-card,
    .register-form-heading, .register-plan-toolbar, .register-verification-card,
    .register-existing-account-card, .register-plan-grid .plan-card) {
    background: var(--auth-surface, var(--my-shell-surface)) !important;
  }

  html:root body .erp-opr-invoice-shell :is(.invoice-data-premium-panel, .my-document-totals),
  html:root body .erp-opr-invoice-shell .my-document-totals .my-report-summary-card,
  html:root body .erp-opr-invoice-shell .my-report-select-panel,
  html:root body .my-report-select-panel[data-floating-select-panel="true"],
  html:root body .invoice-row-details-menu.invoice-row-details-menu--item-details,
  html:root body #VoucherAccountSearchModal#VoucherAccountSearchModal .erp-voucher-account-search-premium-box {
    background: var(--my-shell-surface) !important;
  }

  html:root body :is(.my-nav-topbar .my-slider-icon-button, .my-nav-action:not(.my-nav-upgrade-cta), .my-nav-user, .my-nav-clock,
    .my-report-select-button, .alfares-catalog-select-trigger,
    .alfares-quick-entry-field-menu-trigger, .alfares-quick-entry-field-action,
    .alfares-quick-entry-field-menu__report, .auth-secondary-button, .register-secondary-button) {
    background: var(--my-shell-surface-soft) !important;
  }

  html:root body .erp-opr-invoice-shell :is(.my-report-select-button, .my-document-date-shell, .my-document-date-trigger),
  html:root body .my-report-select-panel[data-floating-select-panel="true"] .my-report-select-option:is(.is-active, [aria-selected="true"], :focus-visible),
  html:root body .erp-opr-invoice-shell .my-report-select-option:is(.is-active, [aria-selected="true"], :focus-visible),
  html:root body :is(.register-selected-plan, .register-plan-grid .plan-card.is-featured) {
    background: var(--my-shell-primary-soft) !important;
  }

  html:root body :is(.auth-form-panel::before, .register-plan-grid .plan-card::before,
    .register-existing-account-card::before) {
    background: transparent !important;
    mask-image: none !important;
  }

  html:root body .register-plan-grid .plan-card--trial {
    background: var(--register-success-soft, #eaf9f4) !important;
  }

  html:root body .alfares-system-confirm__icon {
    background: var(--my-shell-primary-soft) !important;
    color: var(--my-shell-primary) !important;
  }

  html:root body .alfares-system-confirm[data-tone="danger"] .alfares-system-confirm__icon {
    background: #fff1ee !important;
    color: #a33a2c !important;
  }
  /* Theme identity takes precedence over legacy document-specific blue tones. */
  html:root body :is(.erp-opr-invoice-shell, .erp-opr-sndat-shell, .pos2-restaurant-document) {
    --invoice-detail-head-start: var(--my-shell-primary) !important;
    --invoice-detail-head-end: var(--my-shell-primary) !important;
    --invoice-header-bg-start: var(--my-shell-primary) !important;
    --invoice-header-bg-end: var(--my-shell-primary) !important;
    --invoice-premium-card-head-bg: var(--my-shell-primary) !important;
    --invoice-detail-head-ink: #fff;
    --lookup-premium-start: var(--my-shell-primary);
    --lookup-premium-mid: var(--my-shell-primary);
    --lookup-premium-end: var(--my-shell-primary);
    --lookup-premium-blue: var(--my-shell-primary);
  }

  html:root body :is(.my-slider-sidebar, .my-nav-topbar, .auth-brand-panel, .register-progress-card),
  html:root body :is(.auth-primary-button, .register-primary-button) {
    background: var(--my-shell-primary) !important;
    color: #fff !important;
  }

  html:root body :is(.my-slider-shell, .my-slider-home) {
    background: var(--my-shell-bg) !important;
  }

  html:root body :is(.branches-page, .locations-page, .units-page, .categories-page,
    .activities-page, .sources-page, .sellers-page, .cost-centers-page,
    .options-page, .config-db-page, .fp-page, #OprItems_Page, #OprAccounts_Page) {
    background: var(--my-shell-bg) !important;
  }

  html:root body :is(.branches-panel-header, .locations-panel-header, .units-panel-header,
    .categories-panel-header, .activities-panel-header, .sources-panel-header,
    .sellers-panel-header, .cost-centers-panel-header, .config-db-panel-heading,
    .permissions-rail-heading, .permissions-context, .permissions-functional-tabs-shell,
    .permissions-pricing-card, .permissions-users-drawer > header,
    .options-context, .options-panel-header) {
    background: var(--my-shell-surface-soft) !important;
  }

  html:root body :is(.auth-form-panel, .register-form-card, .register-workspace) {
    background: var(--auth-page, var(--my-shell-bg)) !important;
  }

  html:root body :is(.my-slider-sidebar, .my-nav-topbar) :is(button, a) {
    --alfares-control-on-primary: #fff;
  }

  html:root :is(body[data-auth-screen="login"], body.mysite-register-body) {
    --alfares-control-on-primary: #fff;
  }

  html:root body table thead th,
  html:root body :is(#OprAccounts_Page, #OprItems_Page) table thead th,
  html:root body :is(.erp-opr-invoice-shell, .erp-opr-sndat-shell) :is(#tblOprDetail, #tblOprDetail_return, #Entag_tblOprDetail) thead th,
  html:root body .pos2-restaurant-document table thead th {
    background: var(--my-shell-primary) !important;
    border-color: var(--invoice-detail-head-line) !important;
    color: #fff !important;
    text-shadow: none !important;
    box-shadow: none !important;
  }

  html:root body :is(.erp-item-search-popover, .erp-document-search-modal--premium, .invoice-party-search-modal,
    #VoucherAccountSearchModal#VoucherAccountSearchModal) {
    --account-search-accent: var(--my-shell-primary);
    --account-search-accent-strong: var(--my-shell-primary-strong);
    --account-search-line: var(--invoice-detail-head-line);
    --lookup-premium-start: var(--my-shell-primary);
    --lookup-premium-end: var(--my-shell-primary);
    --lookup-premium-blue: var(--my-shell-primary);
  }

  html:root body :is(.erp-item-search-popover-head, .erp-item-search-table-head, .erp-document-search-hero,
    .invoice-party-search-hero, .invoice-price-menu-head, .invoice-row-details-menu__head,
    .my-document-menu-header, .invoice-payment-modal-head, .alfares-quick-entry-modal__header,
    .my-report-select-panel-header),
  html:root body .erp-opr-invoice-shell :is(#contextmenu_price_levels, #contextmenu_price) > .invoice-price-menu-head,
  html:root body .invoice-row-details-menu[data-invoice-row-details-card] .invoice-row-details-menu__head,
  html:root body #VoucherAccountSearchModal#VoucherAccountSearchModal .erp-item-search-popover-head,
  html:root body .erp-document-search-modal--premium .erp-document-search-hero,
  html:root body .erp-opr-invoice-shell .invoice-party-search-hero,
  html:root body :is(.auth-dialog-card, .register-existing-account-card) > header {
    background: var(--my-shell-primary) !important;
    color: #fff !important;
    text-shadow: none !important;
  }

  html:root body :is(.erp-item-search-popover-head, .erp-document-search-hero, .invoice-party-search-hero,
    .invoice-price-menu-head, .invoice-row-details-menu__head, .my-document-menu-header,
    .invoice-payment-modal-head, .alfares-quick-entry-modal__header, .my-report-select-panel-header)
    :is(h2, strong, small, span, em, svg):not(button, a, [role="button"], button *, a *, [role="button"] *),
  html:root body #VoucherAccountSearchModal#VoucherAccountSearchModal .erp-item-search-popover-title
    :is(h2, small):not(button, a, [role="button"], button *, a *, [role="button"] *),
  html:root body :is(.auth-dialog-card, .register-existing-account-card) > header
    :is(h2, strong, small):not(button, a, [role="button"], button *, a *, [role="button"] *) {
    color: #fff !important;
  }

  html:root body .erp-opr-invoice-shell :is(#contextmenu_price_levels, #contextmenu_price) {
    --invoice-price-level-accent: var(--my-shell-primary) !important;
    --invoice-price-level-accent-deep: var(--my-shell-primary) !important;
    --invoice-price-level-accent-line: var(--invoice-detail-head-line) !important;
  }

  html:root body .erp-opr-invoice-shell #contextmenu_price_levels .invoice-dynamic-price-table thead th {
    background: var(--my-shell-primary) !important;
    color: #fff !important;
    box-shadow: none !important;
  }

  html:root body :is(select, .alfares-catalog-select-trigger, .my-report-select-button,
    .auth-select-value, .register-select-value) {
    color: #000 !important;
    -webkit-text-fill-color: #000 !important;
  }

  html:root body :is(.auth-select-trigger, .auth-select-trigger > span,
    .auth-control select, .register-field select) {
    color: #000 !important;
    -webkit-text-fill-color: #000 !important;
  }

  html:root body :is(.auth-searchable-select, .auth-select-trigger,
    .auth-control:has(select), .register-field select) {
    background: #fff !important;
  }

  html:root body.mysite-register-body :is(.register-form-heading, .register-plan-toolbar,
    .register-verification-card, .register-existing-account-card, .register-plan-grid .plan-card) {
    background: var(--register-surface) !important;
  }

  html:root:is([data-my-theme="dark"], [data-register-theme="dark"])
    :is(.auth-card-header > span, .auth-link-button, .auth-switch a,
      .register-form-heading span, .register-selected-plan-copy strong) {
    color: #bfdbfe;
  }

  /* Dark semantic success keeps its green role with readable contrast. */
  html:root[data-my-theme="dark"] body[data-auth-screen="login"]
    .auth-license-status[data-license-state="licensed"] {
    color: #6ee7b7;
  }

  html:root[data-register-theme="dark"] body.mysite-register-body
    #AccountRegister_ThemeMenuTrigger {
    color: var(--register-ink) !important;
    -webkit-text-fill-color: var(--register-ink) !important;
  }

  /* On desktop the native picker is at the right edge; mobile already anchors
     inside its toolbar and retains its original left-aligned menu geometry. */
  @media (min-width: 981px) {
    html:root body.mysite-register-body .register-theme-menu {
      left: auto;
      right: 0;
    }
  }

  /* Native action audit: flat paint for the exact document/POS chrome roles.
     Semantic fills keep their former final stop; no product surface is selected. */
  html:root body .erp-opr-invoice-shell .invoice-lines-table .my-document-empty-lines .my-document-button {
    background: var(--my-shell-primary) !important;
  }
  html:root body .erp-opr-invoice-shell .invoice-lines-table .my-document-empty-lines .my-document-button:is(:hover, :focus-visible) {
    background: var(--my-shell-primary-strong) !important;
  }
  html:root body .erp-opr-sndat-shell :is(#btnNew, #btnHeaderPrint) {
    background: #edf5ff !important;
  }
  html:root body .erp-opr-sndat-shell :is(#btnNew, #btnHeaderPrint):is(:hover, :focus-visible) {
    background: #e0eeff !important;
  }
  html:root body :is(.erp-opr-invoice-shell, .erp-opr-sndat-shell) #Opr_Discount {
    background: #f8fbff !important;
  }
  html:root body :is(.erp-opr-invoice-shell, .erp-opr-sndat-shell) [data-invoice-totals-extra-toggle] {
    background: #e9f9fb !important;
  }
  html:root body.mysite-register-body .register-stepper button.is-active {
    background: rgba(14, 165, 233, .12) !important;
  }

  html:root body .pos2-restaurant-document .pos2-legacy-stage .pos-primary-command {
    background: var(--my-shell-primary) !important;
    border-color: var(--my-shell-primary) !important;
    color: #fff !important;
  }
  html:root body .pos2-restaurant-document .pos2-legacy-stage .pos-primary-command:is(:hover, :focus-visible) {
    background: var(--my-shell-primary-strong) !important;
    border-color: var(--my-shell-primary-strong) !important;
  }
  html:root body .pos2-restaurant-document .pos2-legacy-stage .pos-primary-command:focus-visible {
    box-shadow: 0 0 0 2px var(--my-shell-surface), 0 0 0 4px var(--my-shell-primary) !important;
  }
  html:root body .pos2-restaurant-document .pos2-legacy-stage
    :is(.pos-print-trigger, .pos-keypad button, .product-add, .workspace-tabs button,
      .pos-search-trigger, .item-more-trigger, .pos-mobile-panel-switcher button) {
    background: var(--pos2-sales-blue-soft, #eff6ff) !important;
  }
  html:root body .pos2-restaurant-document .pos2-legacy-stage .pos-operation-button-drawer {
    background: var(--pos2-sales-emerald-soft, #e9fbf4) !important;
  }
  html:root body .pos2-restaurant-document .pos2-legacy-stage .pos-operation-button-suspend {
    background: #e6fbff !important;
  }
  html:root body .pos2-restaurant-document .pos2-legacy-stage .pos-operation-button-suspend:focus-visible {
    background: #cffafe !important;
  }
  html:root body .pos2-restaurant-document .pos2-legacy-stage :is(.pos-badge-warning, .pos-keypad .key-warn) {
    background: var(--pos2-sales-amber-soft, #fff7e6) !important;
  }
  html:root body .pos2-restaurant-document .pos2-legacy-stage
    :is(.pos-operation-button-delete, .pos-operation-button-return, .pos-operation-button-exit, .pos-keypad .key-clear) {
    background: var(--pos2-sales-red-soft, #fff1f2) !important;
  }
  html:root body .pos2-restaurant-document .pos2-legacy-stage
    :is(.pos-operation-button-delete, .pos-operation-button-return, .pos-operation-button-exit, .pos-keypad .key-clear):focus-visible {
    background: #ffe4e6 !important;
  }
  html:root body .erp-opr-invoice-shell.pos2-restaurant-document .pos2-legacy-stage
    #SearchNots.payment-note {
    background: var(--pos2-action-cyan-soft, #e8f7ff) !important;
  }
  html:root body .erp-opr-invoice-shell.pos2-restaurant-document .pos2-legacy-stage
    #SearchNots.payment-note:focus-visible {
    background: var(--pos2-action-cyan-dark, #0369a1) !important;
  }
  html:root body .erp-opr-invoice-shell.pos2-restaurant-document .pos2-legacy-stage
    .payment-note[data-pos2-toggle="keyboard"] {
    background: var(--pos2-action-indigo-soft, #eef2ff) !important;
  }
  html:root body .erp-opr-invoice-shell.pos2-restaurant-document .pos2-legacy-stage
    .payment-note[data-pos2-toggle="keyboard"]:focus-visible {
    background: var(--pos2-action-indigo-dark, #3730a3) !important;
  }
  html:root body .erp-opr-invoice-shell.pos2-restaurant-document .pos2-legacy-stage .pos-party-field-shell {
    background: #fbfdff !important;
  }
  html:root body .erp-opr-invoice-shell.pos2-restaurant-document .pos2-legacy-stage .pos-party-field-shell
    :is(.invoice-party-field-icon, [data-party-search-menu-button]) {
    background: #e5fbff !important;
  }
  html:root body .erp-opr-invoice-shell.pos2-restaurant-document .pos2-legacy-stage .pos-party-field-shell
    .invoice-party-detail-field-trigger {
    background: #f0f7fd !important;
  }
  html:root body .erp-opr-invoice-shell.pos2-restaurant-document .pos2-legacy-stage .pos-party-field-shell
    .invoice-party-menu-trigger {
    background: #f7f3fd !important;
  }
  html:root body .erp-opr-invoice-shell.pos2-restaurant-document.pos2-restaurant-document .pos2-legacy-stage
    .my-document-payment-methods button[data-payment-value] {
    background: var(--payment-option-bg-end) !important;
  }
  html:root body .erp-opr-invoice-shell.pos2-restaurant-document.pos2-restaurant-document .pos2-legacy-stage
    .my-document-payment-methods button[data-payment-value]:not(.is-active):not([aria-pressed="true"]):focus-visible {
    background: var(--payment-option-hover-bg) !important;
  }
  html:root body .erp-opr-invoice-shell.pos2-restaurant-document.pos2-restaurant-document .pos2-legacy-stage
    .my-document-payment-methods button[data-payment-value]:is(.is-active, [aria-pressed="true"]) {
    background: var(--payment-option-active-end) !important;
  }
  html:root body .pos2-restaurant-document .pos2-legacy-stage .pos-mobile-panel-switcher {
    background: #f1f7ff !important;
  }
  html:root body .pos2-restaurant-document .delivery-amount-field {
    background: #f0fdfa !important;
  }
  html:root body .pos2-restaurant-document .invoice-lines-table,
  html:root body .erp-opr-invoice-shell .invoice-lines-table .my-document-empty-lines .invoice-empty-icon {
    background: rgba(236, 246, 248, .92) !important;
  }
}