/* Adapted Tabler screen design for the existing Vue 2 / Element 2 application.
 * Load after the existing screen styles. Font faces are in admin-ui-fonts.css.
 * No Bootstrap or Tabler JavaScript. Print and exported documents keep their styles.
 */
@media screen {
  html[data-asr-theme="tabler"] {
    --asr-ui-primary: #206bc4;
    --asr-ui-primary-hover: #1859a6;
    --asr-ui-primary-soft: #edf4fc;
    --asr-ui-bg: #f6f8fb;
    --asr-ui-surface: #fff;
    --asr-ui-text: #182433;
    --asr-ui-muted: #526477;
    --asr-ui-border: #dce1e7;
    --asr-ui-radius: 6px;
    --asr-ui-control: 32px;
    --asr-ui-shadow: none;
    --asr-ui-font: "Inter UI", "Noto Sans SC UI", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
    --asr-focus-ring: 0 0 0 3px rgb(32 107 196 / 18%);
    --asr-primary: var(--asr-ui-primary);
    --asr-primary-soft: var(--asr-ui-primary-soft);
    --asr-ink: var(--asr-ui-text);
    --asr-muted: var(--asr-ui-muted);
    --asr-line: var(--asr-ui-border);
    --asr-bg: var(--asr-ui-bg);
    --asr-card: var(--asr-ui-surface);
  }

  html[data-asr-theme="tabler"] body {
    color: var(--asr-ui-text);
    background: var(--asr-ui-bg);
    font-family: var(--asr-ui-font);
    font-size: 14px;
    line-height: 1.55;
  }
  html[data-asr-theme="tabler"] #app .app-wrapper,
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell {
    --admin-primary: #206bc4;
    --admin-ink: #182433;
    --admin-muted: #526477;
    --admin-line: #dce1e7;
    --admin-surface: #f6f8fb;
    --asr-primary: #206bc4;
    --asr-primary-soft: #edf4fc;
    --asr-ink: #182433;
    --asr-muted: #526477;
    --asr-line: #dce1e7;
    --asr-bg: #f6f8fb;
    --asr-ui-font: "Inter UI", "Noto Sans SC UI", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
    --asr-ui-radius: 6px;
    --asr-ui-control: 32px;
    --asr-ui-shadow: none;
    color: var(--asr-ui-text) !important;
    background: var(--asr-ui-bg) !important;
    font-family: var(--asr-ui-font) !important;
    font-size: 14px;
  }
  html[data-asr-theme="tabler"] #app .app-wrapper :is(.main-container, .app-main, .dashboard-container),
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell :is(.main-container, .app-main, .dashboard-container) {
    background: var(--asr-ui-bg) !important;
  }
  html[data-asr-theme="tabler"] #app .app-wrapper .navbar,
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell .navbar {
    background: var(--asr-ui-surface) !important;
    border-bottom: 1px solid var(--asr-ui-border) !important;
    box-shadow: none !important;
  }
  html[data-asr-theme="tabler"] #app .app-wrapper .sidebar-container,
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell .sidebar-container {
    background: #182433 !important;
    border-color: #253649 !important;
    box-shadow: none !important;
  }
  html[data-asr-theme="tabler"] #app .app-wrapper .sidebar-container .el-menu,
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell .sidebar-container .el-menu {
    background: transparent !important;
  }
  html[data-asr-theme="tabler"] #app .app-wrapper .sidebar-container :is(.el-menu-item, .el-submenu__title),
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell .sidebar-container :is(.el-menu-item, .el-submenu__title) {
    color: #c9d4e2 !important;
    background: transparent !important;
    font-family: var(--asr-ui-font);
    font-size: 14px;
    border-radius: 6px !important;
    box-shadow: none !important;
  }
  html[data-asr-theme="tabler"] #app .app-wrapper .sidebar-container :is(.el-menu-item, .el-submenu__title):hover,
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell .sidebar-container :is(.el-menu-item, .el-submenu__title):hover {
    background: #253649 !important;
    color: #fff !important;
  }
  html[data-asr-theme="tabler"] #app .app-wrapper .sidebar-container .el-menu-item.is-active,
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell .sidebar-container .el-menu-item.is-active {
    background: #206bc4 !important;
    color: #fff !important;
    box-shadow: none !important;
    font-weight: 600;
  }

  html[data-asr-theme="tabler"] #app :is(.asr-role-page, .asr-admin-management) {
    background: var(--asr-ui-bg);
    color: var(--asr-ui-text);
    font-family: var(--asr-ui-font);
    padding: 20px;
  }
  html[data-asr-theme="tabler"] #app .app-wrapper :is(.page-title, .ph-title, .audit-title, .dash-title, .asr-admin-management h1),
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell :is(.page-title, .ph-title, .audit-title, .dash-title, .asr-admin-management h1) {
    color: var(--asr-ui-text) !important;
    font-family: var(--asr-ui-font) !important;
    font-size: 22px !important;
    font-weight: 600;
    line-height: 1.4 !important;
  }
  html[data-asr-theme="tabler"] #app .asr-role-page h1 { font-size: 22px; }
  html[data-asr-theme="tabler"] #app .app-wrapper :is(.table-card, .ledger-card, .fb-card, .panel-card, .insight-card, .kpi-item, .profit-card, .el-card, .asr-role-detail, .asr-role-form, .asr-role-table, .asr-admin-entry, .asr-admin-management-content),
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell :is(.table-card, .ledger-card, .fb-card, .panel-card, .insight-card, .kpi-item, .profit-card, .el-card, .asr-role-detail, .asr-role-form, .asr-role-table, .asr-admin-entry, .asr-admin-management-content) {
    background: var(--asr-ui-surface) !important;
    border-color: var(--asr-ui-border) !important;
    border-radius: 6px !important;
    box-shadow: none !important;
  }
  html[data-asr-theme="tabler"] #app .app-wrapper :is(.filter-container, .list-filter, .asr-role-toolbar, .asr-role-actions, .asr-role-pagination) {
    gap: 8px;
    margin-block: 12px;
    align-items: center;
  }

  /* Explicit fonts on text surfaces; element-icons retains its own font face. */
  html[data-asr-theme="tabler"] :is(.el-input__inner, .el-textarea__inner, .el-button, .el-form-item__label, .el-radio__label, .el-checkbox__label, .el-table, .el-pagination, .el-dialog, .el-message-box, .el-dropdown-menu, .el-select-dropdown, .el-picker-panel, .el-menu--popup),
  html[data-asr-theme="tabler"] #app .app-wrapper :is(.el-input__inner, .el-textarea__inner, .el-button, .el-table),
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell :is(.el-input__inner, .el-textarea__inner, .el-button, .el-table) {
    font-family: var(--asr-ui-font) !important;
    font-size: 14px;
  }
  html[data-asr-theme="tabler"] :is(.el-input__inner, .el-date-editor.el-input__inner),
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell .el-input__inner {
    height: 32px !important;
    line-height: 30px !important;
    color: var(--asr-ui-text);
    border-color: var(--asr-ui-border);
    border-radius: 6px !important;
  }
  html[data-asr-theme="tabler"] .el-input__icon { line-height: 32px !important; }
  html[data-asr-theme="tabler"] .el-textarea__inner {
    color: var(--asr-ui-text);
    border-color: var(--asr-ui-border);
    border-radius: 6px;
    line-height: 1.55;
  }
  html[data-asr-theme="tabler"] :is(.el-input__inner, .el-textarea__inner):focus {
    border-color: var(--asr-ui-primary);
    box-shadow: var(--asr-focus-ring);
  }
  html[data-asr-theme="tabler"] .el-input.is-disabled .el-input__inner {
    color: var(--asr-ui-muted);
    background: #f1f3f6;
  }
  html[data-asr-theme="tabler"] .el-button:not(.el-button--text):not(.is-circle),
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell .el-button:not(.el-button--text):not(.is-circle) {
    min-height: 32px !important;
    padding: 8px 12px !important;
    line-height: 14px;
    border-radius: 6px !important;
    box-shadow: none !important;
  }
  html[data-asr-theme="tabler"] .el-button--primary,
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell .el-button--primary {
    color: #fff !important;
    border-color: var(--asr-ui-primary) !important;
    background: var(--asr-ui-primary) !important;
  }
  html[data-asr-theme="tabler"] .el-button--primary:not(.is-disabled):is(:hover, :focus-visible),
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell .el-button--primary:not(.is-disabled):is(:hover, :focus-visible) {
    border-color: var(--asr-ui-primary-hover) !important;
    background: var(--asr-ui-primary-hover) !important;
  }
  html[data-asr-theme="tabler"] .el-button--primary.is-plain,
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell .el-button--primary.is-plain {
    color: var(--asr-ui-primary) !important;
    border-color: #b5cee9 !important;
    background: var(--asr-ui-primary-soft) !important;
  }
  html[data-asr-theme="tabler"] .el-button--text { color: var(--asr-ui-primary); }
  html[data-asr-theme="tabler"] :is(.el-button, .asr-role-page button):focus-visible {
    outline: 2px solid var(--asr-ui-primary);
    outline-offset: 2px;
  }
  html[data-asr-theme="tabler"] .el-form-item.is-error :is(.el-input__inner, .el-textarea__inner) {
    border-color: #d63939 !important;
  }
  html[data-asr-theme="tabler"] #app .asr-role-page :is(button, input:not([type="checkbox"]):not([type="radio"]), select) {
    min-height: 32px;
    padding: 5px 10px;
    border-radius: 6px;
    font-size: 14px;
  }
  html[data-asr-theme="tabler"] #app .asr-role-page :is(input, select, textarea) { border-color: var(--asr-ui-border); }

  html[data-asr-theme="tabler"] #app .app-wrapper .el-table,
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell .el-table {
    background: var(--asr-ui-surface);
    color: var(--asr-ui-text);
    border-color: var(--asr-ui-border) !important;
    border-radius: 6px !important;
    font-variant-numeric: tabular-nums;
  }
  html[data-asr-theme="tabler"] #app .app-wrapper .el-table :is(th, td),
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell .el-table :is(th, td),
  html[data-asr-theme="tabler"][data-asr-page="orders"]:has(#app .asr-admin-shell) #app .app-wrapper.asr-admin-shell .asr-navigation-orders .el-table :is(th, td) {
    height: 42px !important;
    padding: 9px 0 !important;
    border-bottom-color: var(--asr-ui-border) !important;
    background: var(--asr-ui-surface) !important;
    vertical-align: middle !important;
  }
  html[data-asr-theme="tabler"] #app .app-wrapper .el-table th,
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell .el-table th,
  html[data-asr-theme="tabler"][data-asr-page="orders"]:has(#app .asr-admin-shell) #app .app-wrapper.asr-admin-shell .asr-navigation-orders .el-table th {
    color: var(--asr-ui-muted) !important;
    font-size: 14px !important;
    font-weight: 600;
    background: #f8fafc !important;
  }
  html[data-asr-theme="tabler"] #app .app-wrapper .el-table .cell,
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell .el-table .cell,
  html[data-asr-theme="tabler"][data-asr-page="orders"]:has(#app .asr-admin-shell) #app .app-wrapper.asr-admin-shell .asr-navigation-orders .el-table .cell {
    padding: 0 12px !important;
    line-height: 22px !important;
    overflow-wrap: anywhere;
  }
  html[data-asr-theme="tabler"] #app .el-table :is(th, td):is(.asr-cell-money, .asr-cash-money-cell),
  html[data-asr-theme="tabler"] #app .el-table :is(th, td):is(.asr-cell-money, .asr-cash-money-cell) > .cell,
  html[data-asr-theme="tabler"] .asr-tabler-cash-overlay .asr-cash-money-cell > .cell {
    text-align: center !important;
    font-variant-numeric: tabular-nums;
  }
  html[data-asr-theme="tabler"] #app .app-wrapper .el-table__body :is(tr:hover, tr.hover-row) > td,
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell .el-table__body :is(tr:hover, tr.hover-row) > td {
    background: #f8fafc !important;
  }
  html[data-asr-theme="tabler"] #app .app-wrapper .el-table__body tr.current-row > td,
  html[data-asr-theme="tabler"] #app .app-wrapper.asr-admin-shell .el-table__body tr.current-row > td {
    background: var(--asr-ui-primary-soft) !important;
  }
  html[data-asr-theme="tabler"] #app .asr-role-table :is(th, td) { padding: 9px 12px; }
  html[data-asr-theme="tabler"] #app .asr-role-table th { background: #f8fafc; font-size: 14px; }
  html[data-asr-theme="tabler"] .el-pagination { margin-top: 12px; color: var(--asr-ui-muted); }
  html[data-asr-theme="tabler"] .el-pagination :is(button, .el-pager li) { height: 32px; line-height: 32px; min-width: 32px; border-radius: 6px; }
  html[data-asr-theme="tabler"] .el-pagination .el-pager li.active { color: var(--asr-ui-primary); }

  /* Element's dialogs and poppers may live directly under body. Theme them there. */
  html[data-asr-theme="tabler"] :is(.el-dialog, .el-message-box, .el-select-dropdown, .el-dropdown-menu, .el-picker-panel) {
    color: var(--asr-ui-text);
    background: var(--asr-ui-surface);
    border-color: var(--asr-ui-border);
    border-radius: 6px !important;
    box-shadow: 0 8px 24px rgb(24 36 51 / 12%);
  }
  html[data-asr-theme="tabler"] :is(.el-dialog__title, .el-message-box__title) { color: var(--asr-ui-text); font-size: 20px; font-weight: 600; }
  html[data-asr-theme="tabler"] :is(.el-dialog__header, .el-dialog__footer) { padding: 16px; }
  html[data-asr-theme="tabler"] .el-dialog__body { padding: 16px; font-size: 14px; line-height: 1.55; }
  html[data-asr-theme="tabler"] :is(.el-select-dropdown__item, .el-dropdown-menu__item) { font-size: 14px; line-height: 32px; min-height: 32px; }
  html[data-asr-theme="tabler"] .el-select-dropdown__item.selected { color: var(--asr-ui-primary); background: var(--asr-ui-primary-soft); font-weight: 600; }
  html[data-asr-theme="tabler"] body > .el-menu--vertical .el-menu--popup { background: #182433 !important; border-color: #253649; }
  html[data-asr-theme="tabler"] body > .el-menu--vertical :is(.el-menu-item, .el-submenu__title) { color: #c9d4e2 !important; background: transparent !important; }
  html[data-asr-theme="tabler"] body > .el-menu--vertical .el-menu-item.is-active { color: #fff !important; background: #206bc4 !important; box-shadow: none; }

  @media (max-width: 767px) {
    html[data-asr-theme="tabler"] #app :is(.asr-role-page, .asr-admin-management) { padding: 12px; }
    html[data-asr-theme="tabler"] #app .app-wrapper :is(.page-title, .dash-title, .asr-admin-management h1) { font-size: 20px !important; }
  }
}

/* Cash screen draft adopted into this source layer. */
@media screen {
  :root {
    --asr-tabler-cash-font: "Inter UI", "Noto Sans SC UI", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
    --asr-tabler-cash-bg: #f6f8fb;
    --asr-tabler-cash-surface: #ffffff;
    --asr-tabler-cash-ink: #182433;
    --asr-tabler-cash-muted: #526477;
    --asr-tabler-cash-border: #dce1e7;
    --asr-tabler-cash-primary: #206bc4;
    --asr-tabler-cash-primary-hover: #1859a6;
    --asr-tabler-cash-primary-soft: #edf4fc;
    --asr-tabler-cash-danger: #d63939;
    --asr-tabler-cash-radius: 6px;
    --asr-tabler-cash-control: 32px;
    --asr-tabler-cash-focus: 0 0 0 3px rgb(32 107 196 / 18%);
    --payment-handling-text: var(--asr-tabler-cash-ink);
    --payment-handling-muted: var(--asr-tabler-cash-muted);
    --payment-handling-danger: var(--asr-tabler-cash-danger);
    --payment-handling-border: var(--asr-tabler-cash-border);
    --payment-handling-surface: var(--asr-tabler-cash-surface);
  }

  /* Verified runtime roots. Legacy finance views retain the existing admin gate. */
  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) {
    color: var(--asr-tabler-cash-ink);
    background: var(--asr-tabler-cash-bg);
    font-family: var(--asr-tabler-cash-font);
    font-size: 14px;
    line-height: 1.55;
    font-variant-numeric: tabular-nums;
  }

  #app .app-main .payment-handling-page {
    box-sizing: border-box;
    max-width: 1280px;
    min-width: 0;
    margin: 0 auto;
    padding: 20px;
  }

  #app .app-main .payment-handling-heading,
  #app .app-main .payment-handling-detail-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 16px;
  }

  #app .app-main .payment-handling-heading h1,
  #app .asr-admin-shell .app-main :is(.asr-finance-overview, .asr-finance-records, .asr-finance-approval) :is(.ph-title, .page-title, .audit-title) {
    margin: 0;
    color: var(--asr-tabler-cash-ink) !important;
    font-family: var(--asr-tabler-cash-font);
    font-size: 22px !important;
    font-weight: 600;
    line-height: 1.4;
  }

  #app .app-main .payment-handling-detail-heading h2 {
    margin: 0;
    color: var(--asr-tabler-cash-ink);
    font-size: 20px;
    font-weight: 600;
    line-height: 1.4;
  }

  #app .app-main .payment-handling-page h3 {
    margin: 20px 0 12px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.55;
  }

  #app .app-main :is(.payment-handling-create, .payment-handling-detail),
  #app .asr-admin-shell .app-main :is(.asr-finance-overview, .asr-finance-records, .asr-finance-approval) :is(.table-card, .ledger-card, .fb-card, .finance-command, .finance-insight),
  #app .asr-admin-shell :is(.asr-receivable-company-dashboard, .asr-payable-supplier-dashboard) {
    background: var(--asr-tabler-cash-surface) !important;
    border: 1px solid var(--asr-tabler-cash-border) !important;
    border-radius: var(--asr-tabler-cash-radius) !important;
    box-shadow: none !important;
  }

  #app .app-main :is(.payment-handling-create, .payment-handling-detail) {
    padding: 16px;
  }

  #app .app-main .payment-handling-filter,
  #app .app-main .payment-handling-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
  }

  #app .app-main .payment-handling-filter :is(.el-input, .el-select) {
    width: 160px;
    max-width: 100%;
  }

  #app .app-main .payment-handling-create > .payment-handling-filter { margin-bottom: 12px; }
  #app .app-main .payment-handling-actions { margin-top: 20px; }
  #app .app-main .payment-handling-actions .el-button + .el-button { margin-left: 0; }

  /* UI-output renderer hooks; these files are candidates, not installed Main code. */
  #app .asr-admin-shell .payment-handling-row-actions,
  #app .app-main .payment-handling-page .payment-handling-row-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 8px;
    white-space: nowrap;
    font-family: var(--asr-tabler-cash-font);
    font-size: 14px;
  }

  #app .asr-admin-shell .payment-handling-row-actions .el-button,
  #app .app-main .payment-handling-page .payment-handling-row-actions .el-button {
    min-height: 32px;
    margin: 0;
    padding: 5px 2px;
    border-radius: 6px;
    font-family: var(--asr-tabler-cash-font);
    font-size: 14px;
    line-height: 22px;
  }

  #app .app-main .payment-handling-revision-cell {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
    padding-block: 2px;
  }

  #app .app-main .payment-handling-revision-cell .el-textarea__inner {
    padding: 6px 8px;
    text-align: left;
    line-height: 1.55;
  }

  #app .app-main .payment-handling-detail-heading > .payment-handling-actions { margin-top: 0; }
  #app .app-main .payment-handling-detail-heading .payment-handling-stage { display: inline-flex; margin-top: 8px; }
  #app .app-main .payment-handling-detail-tabs { margin-top: 16px; }
  #app .app-main .payment-handling-detail-tabs .el-tabs__header { margin-bottom: 16px; }
  #app .app-main .payment-handling-detail-tabs .el-tabs__item { height: 40px; color: var(--asr-tabler-cash-muted); font-family: var(--asr-tabler-cash-font); font-size: 14px; line-height: 40px; }
  #app .app-main .payment-handling-detail-tabs .el-tabs__item.is-active { color: var(--asr-tabler-cash-primary); font-weight: 600; }
  #app .app-main .payment-handling-detail-tabs .el-tabs__item.is-disabled { color: var(--asr-tabler-cash-muted); opacity: .6; }
  #app .app-main .payment-handling-detail-tabs .el-tabs__active-bar { background: var(--asr-tabler-cash-primary); }
  #app .app-main .payment-handling-detail-tabs .el-tabs__nav-wrap::after { height: 1px; background: var(--asr-tabler-cash-border); }

  #app .app-main .payment-handling-invoice-view,
  .payment-handling-invoice-form {
    color: var(--payment-handling-text);
    font-family: var(--asr-tabler-cash-font);
    font-size: 14px;
    line-height: 1.55;
  }

  #app .app-main .payment-handling-invoice-view :is(.payment-handling-invoice-card, .payment-handling-invoice-cash, .payment-handling-invoice-legacy) {
    background: var(--payment-handling-surface);
    border-color: var(--payment-handling-border);
    border-radius: 6px;
    box-shadow: none;
  }

  #app .app-main .payment-handling-invoice-view :is(h3, h4, h5) { color: var(--payment-handling-text); font-size: 14px; font-weight: 600; }
  #app .app-main .payment-handling-invoice-allocations { background: var(--payment-handling-surface); font-family: var(--asr-tabler-cash-font); font-size: 14px; }
  #app .app-main .payment-handling-invoice-allocations :is(th, td) { height: 42px; box-sizing: border-box; padding: 9px 12px; border-color: var(--payment-handling-border); line-height: 22px; }
  /* This renderer's fixed two-column table is order reference + coveredAmount. */
  #app .app-main .payment-handling-invoice-allocations :is(th, td):last-child { text-align: center; font-variant-numeric: tabular-nums; }
  .payment-handling-invoice-coverage-row .el-input__inner { text-align: center; font-variant-numeric: tabular-nums; }
  #app .app-main .payment-handling-invoice-view .el-dialog { border: 1px solid var(--payment-handling-border); border-radius: 6px; }
  #app .app-main .payment-handling-invoice-view :is(.el-dialog__header, .el-dialog__footer) { padding: 16px; background: var(--payment-handling-surface); border-color: var(--payment-handling-border); border-radius: 0; }
  #app .app-main .payment-handling-invoice-view .el-dialog__title { color: var(--payment-handling-text); font-family: var(--asr-tabler-cash-font); font-size: 20px; line-height: 1.4; }

  .payment-handling-more-menu .el-button--text { min-height: 22px; margin: 0; padding: 0; color: var(--asr-tabler-cash-primary); font-family: var(--asr-tabler-cash-font); font-size: 14px; line-height: 22px; }
  .payment-handling-more-menu .el-button--text.is-disabled { color: var(--asr-tabler-cash-muted) !important; opacity: .6; }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) .el-table {
    color: var(--asr-tabler-cash-ink);
    background: var(--asr-tabler-cash-surface);
    border: 1px solid var(--asr-tabler-cash-border);
    border-radius: var(--asr-tabler-cash-radius);
    font-family: var(--asr-tabler-cash-font);
    font-size: 14px;
    font-variant-numeric: tabular-nums;
  }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) .el-table :is(th, th.is-leaf, td) {
    box-sizing: border-box;
    height: 42px;
    padding: 9px 0;
    border-bottom-color: var(--asr-tabler-cash-border) !important;
    background: var(--asr-tabler-cash-surface) !important;
  }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) .el-table :is(th, th.is-leaf) {
    color: var(--asr-tabler-cash-muted) !important;
    font-size: 14px;
    font-weight: 600;
  }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) .el-table .cell {
    padding: 0 12px;
    line-height: 22px;
    overflow-wrap: anywhere;
  }

  /* In the inspected cash candidate, is-right columns are monetary columns. */
  #app .app-main .payment-handling-page .el-table :is(th.is-right, td.is-right, .asr-cash-money-cell),
  #app .app-main .payment-handling-page .el-table :is(th.is-right, td.is-right, .asr-cash-money-cell) > .cell,
  #app .asr-admin-shell .app-main :is(.asr-finance-overview, .asr-finance-records, .asr-finance-approval) .el-table .asr-cash-money-cell,
  #app .asr-admin-shell .app-main :is(.asr-finance-overview, .asr-finance-records, .asr-finance-approval) .el-table .asr-cash-money-cell > .cell {
    text-align: center !important;
    font-variant-numeric: tabular-nums;
  }

  /* All current payment-handling table inputs are per-order monetary inputs. */
  #app .app-main .payment-handling-page .el-table .el-input__inner {
    text-align: center;
    font-variant-numeric: tabular-nums;
  }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) .el-table td:has(:is(.el-input, .el-button)) { padding-block: 4px; }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) .el-table .el-table__body :is(tr:hover, tr.hover-row) > td {
    background: #f8fafc !important;
  }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) .el-table .el-table__body tr.current-row > td {
    background: var(--asr-tabler-cash-primary-soft) !important;
  }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) :is(.el-input__inner, .el-date-editor.el-input__inner) {
    height: var(--asr-tabler-cash-control);
    line-height: 30px;
    border-color: var(--asr-tabler-cash-border);
    border-radius: var(--asr-tabler-cash-radius);
    color: var(--asr-tabler-cash-ink);
    background: var(--asr-tabler-cash-surface);
    font-family: var(--asr-tabler-cash-font);
    font-size: 14px;
  }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) .el-input__icon {
    line-height: var(--asr-tabler-cash-control);
  }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) .el-textarea__inner {
    color: var(--asr-tabler-cash-ink);
    border-color: var(--asr-tabler-cash-border);
    border-radius: var(--asr-tabler-cash-radius);
    font-family: var(--asr-tabler-cash-font);
    font-size: 14px;
    line-height: 1.55;
    padding: 8px 10px;
  }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) :is(.el-input__inner, .el-textarea__inner):focus {
    border-color: var(--asr-tabler-cash-primary);
    box-shadow: var(--asr-tabler-cash-focus);
  }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) .el-input.is-disabled .el-input__inner {
    color: var(--asr-tabler-cash-muted);
    background: #f1f3f6;
    border-color: var(--asr-tabler-cash-border);
  }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) :is(.el-form-item__label, .el-radio__label, .el-checkbox__label) {
    color: var(--asr-tabler-cash-ink);
    font-family: var(--asr-tabler-cash-font);
    font-size: 14px;
  }

  #app .app-main .payment-handling-page :is(.el-form-item__label, .el-form-item__content) { line-height: 32px; }
  #app .app-main .payment-handling-page .el-form-item { margin-bottom: 16px; }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) .el-button {
    font-family: var(--asr-tabler-cash-font);
    font-size: 14px;
    font-weight: 500;
    border-radius: var(--asr-tabler-cash-radius);
    box-shadow: none;
  }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) .el-button:not(.el-button--text):not(.is-circle) {
    box-sizing: border-box;
    min-height: 32px;
    padding: 8px 12px;
    line-height: 14px;
  }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) .el-button--primary {
    color: #fff !important;
    background: var(--asr-tabler-cash-primary) !important;
    border-color: var(--asr-tabler-cash-primary) !important;
  }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) .el-button--primary:not(.is-disabled):is(:hover, :focus-visible) {
    background: var(--asr-tabler-cash-primary-hover) !important;
    border-color: var(--asr-tabler-cash-primary-hover) !important;
  }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) .el-button--primary.is-plain {
    color: var(--asr-tabler-cash-primary) !important;
    background: var(--asr-tabler-cash-primary-soft) !important;
    border-color: #b5cee9 !important;
  }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) .el-button--primary.is-plain:not(.is-disabled):is(:hover, :focus-visible) {
    color: #fff !important;
    background: var(--asr-tabler-cash-primary-hover) !important;
    border-color: var(--asr-tabler-cash-primary-hover) !important;
  }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) .el-button--text {
    min-height: 32px;
    padding: 5px 2px;
    color: var(--asr-tabler-cash-primary);
    line-height: 22px;
  }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) .el-button.is-disabled {
    cursor: not-allowed;
    opacity: .6;
  }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) .el-button--text.is-disabled {
    color: var(--asr-tabler-cash-muted) !important;
    text-decoration: none;
  }

  #app .app-main :is(.payment-handling-page, .asr-admin-shell .asr-finance-overview, .asr-admin-shell .asr-finance-records, .asr-admin-shell .asr-finance-approval) .el-button:focus-visible {
    outline: 2px solid var(--asr-tabler-cash-primary);
    outline-offset: 2px;
  }

  #app .app-main .payment-handling-stage {
    color: var(--asr-tabler-cash-primary);
    background: var(--asr-tabler-cash-primary-soft);
    border: 1px solid #c5d9ee;
    border-radius: var(--asr-tabler-cash-radius);
    padding: 4px 8px;
    font-size: 14px;
    line-height: 22px;
  }

  #app .app-main .payment-handling-facts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px 24px;
    margin: 20px 0;
  }

  #app .app-main .payment-handling-facts dt { margin-bottom: 4px; color: var(--asr-tabler-cash-muted); font-size: 14px; }
  #app .app-main .payment-handling-facts dd { margin: 0; color: var(--asr-tabler-cash-ink); font-size: 14px; overflow-wrap: anywhere; }
  #app .app-main .payment-handling-form { max-width: 700px; margin-top: 20px; }
  #app .app-main .payment-handling-form :is(.el-select, .el-date-editor) { width: 100%; max-width: 440px; }
  #app .app-main .payment-handling-selection { margin: 12px 0; color: var(--asr-tabler-cash-muted); font-size: 14px; line-height: 1.55; }
  #app .app-main .payment-handling-notice { color: var(--asr-tabler-cash-muted); background: #f1f4f8; border: 1px solid var(--asr-tabler-cash-border); }
  #app .app-main .payment-handling-error { color: #a52828; background: #fff2f2; border: 1px solid #edcaca; }
  #app .app-main :is(.payment-handling-notice, .payment-handling-error) { padding: 10px 12px; margin: 0 0 16px; border-radius: 6px; font-size: 14px; line-height: 1.55; }
  #app .app-main .payment-handling-page .el-pagination { margin-top: 12px; color: var(--asr-tabler-cash-muted); font-family: var(--asr-tabler-cash-font); font-size: 14px; }
  #app .app-main .payment-handling-page .el-pagination :is(button, .el-pager li) { min-width: 32px; height: 32px; line-height: 32px; border-radius: 6px; }
  #app .app-main .payment-handling-page .el-pagination .el-pager li.active { color: var(--asr-tabler-cash-primary); }

  /*
   * Element 2 body-mounted surfaces:
   * 1. Preferred explicit marker: customClass/popperClass="asr-tabler-cash-overlay".
   * 2. Existing cash route fallback: html[data-asr-page="finance"] + :has(page).
   *    This fallback applies only while the inspected payment-handling page exists.
   *    It does not assume that body poppers inherit from #app or .asr-admin-shell.
   * Do not target all el-* poppers globally, overwrite z-index or change visibility.
   */
  :is(.asr-tabler-cash-overlay, .payment-handling-more-menu, .payment-handling-select-popper, .payment-handling-date-popper),
  :is(html[data-asr-page="finance"]:has(#app .app-main .payment-handling-page)) body > :is(.el-dialog__wrapper, .el-message-box__wrapper, .el-select-dropdown, .el-dropdown-menu, .el-picker-panel, .el-message) {
    color: var(--asr-tabler-cash-ink);
    font-family: var(--asr-tabler-cash-font);
    font-size: 14px;
    font-variant-numeric: tabular-nums;
  }

  :is(.asr-tabler-cash-overlay, .payment-handling-more-menu, .payment-handling-select-popper, .payment-handling-date-popper):is(.el-dialog, .el-message-box, .el-select-dropdown, .el-dropdown-menu, .el-picker-panel, .el-message),
  :is(.asr-tabler-cash-overlay, .payment-handling-more-menu, .payment-handling-select-popper, .payment-handling-date-popper) > :is(.el-dialog, .el-message-box),
  :is(html[data-asr-page="finance"]:has(#app .app-main .payment-handling-page)) body > :is(.el-dialog__wrapper, .el-message-box__wrapper) > :is(.el-dialog, .el-message-box),
  :is(html[data-asr-page="finance"]:has(#app .app-main .payment-handling-page)) body > :is(.el-select-dropdown, .el-dropdown-menu, .el-picker-panel, .el-message) {
    box-sizing: border-box;
    border: 1px solid var(--asr-tabler-cash-border);
    border-radius: var(--asr-tabler-cash-radius);
    box-shadow: 0 8px 24px rgb(24 36 51 / 12%);
  }

  :is(.asr-tabler-cash-overlay, .payment-handling-more-menu, .payment-handling-select-popper, .payment-handling-date-popper) :is(.el-dialog__header, .el-dialog__footer),
  :is(html[data-asr-page="finance"]:has(#app .app-main .payment-handling-page)) body > .el-dialog__wrapper :is(.el-dialog__header, .el-dialog__footer) {
    padding: 16px;
    background: var(--asr-tabler-cash-surface);
    border-color: var(--asr-tabler-cash-border);
    border-radius: 0;
  }

  :is(.asr-tabler-cash-overlay, .payment-handling-more-menu, .payment-handling-select-popper, .payment-handling-date-popper) :is(.el-dialog__title, .el-message-box__title),
  :is(html[data-asr-page="finance"]:has(#app .app-main .payment-handling-page)) body > :is(.el-dialog__wrapper, .el-message-box__wrapper) :is(.el-dialog__title, .el-message-box__title) {
    color: var(--asr-tabler-cash-ink);
    font-family: var(--asr-tabler-cash-font);
    font-size: 20px;
    font-weight: 600;
    line-height: 1.4;
  }

  :is(.asr-tabler-cash-overlay, .payment-handling-more-menu, .payment-handling-select-popper, .payment-handling-date-popper) :is(.el-dialog__body, .el-message-box__message, .el-message__content),
  :is(html[data-asr-page="finance"]:has(#app .app-main .payment-handling-page)) body > :is(.el-dialog__wrapper, .el-message-box__wrapper, .el-message) :is(.el-dialog__body, .el-message-box__message, .el-message__content) {
    font-family: var(--asr-tabler-cash-font);
    font-size: 14px;
    line-height: 1.55;
    overflow-wrap: anywhere;
  }

  :is(.asr-tabler-cash-overlay, .payment-handling-more-menu, .payment-handling-select-popper, .payment-handling-date-popper) :is(.el-input__inner, .el-textarea__inner, .el-button, .el-form-item__label, .el-checkbox__label, .el-radio__label),
  :is(html[data-asr-page="finance"]:has(#app .app-main .payment-handling-page)) body > :is(.el-dialog__wrapper, .el-message-box__wrapper, .el-picker-panel) :is(.el-input__inner, .el-textarea__inner, .el-button, .el-form-item__label, .el-checkbox__label, .el-radio__label) {
    font-family: var(--asr-tabler-cash-font);
    font-size: 14px;
  }

  :is(.asr-tabler-cash-overlay, .payment-handling-more-menu, .payment-handling-select-popper, .payment-handling-date-popper) .el-input__inner,
  :is(html[data-asr-page="finance"]:has(#app .app-main .payment-handling-page)) body > :is(.el-dialog__wrapper, .el-message-box__wrapper, .el-picker-panel) .el-input__inner {
    height: 32px;
    line-height: 30px;
    border-color: var(--asr-tabler-cash-border);
    border-radius: 6px;
  }

  :is(.asr-tabler-cash-overlay, .payment-handling-more-menu, .payment-handling-select-popper, .payment-handling-date-popper) :is(.el-input__inner, .el-textarea__inner):focus,
  :is(html[data-asr-page="finance"]:has(#app .app-main .payment-handling-page)) body > :is(.el-dialog__wrapper, .el-message-box__wrapper, .el-picker-panel) :is(.el-input__inner, .el-textarea__inner):focus {
    border-color: var(--asr-tabler-cash-primary);
    box-shadow: var(--asr-tabler-cash-focus);
  }

  :is(.asr-tabler-cash-overlay, .payment-handling-more-menu, .payment-handling-select-popper, .payment-handling-date-popper) .el-button:not(.el-button--text):not(.is-circle),
  :is(html[data-asr-page="finance"]:has(#app .app-main .payment-handling-page)) body > :is(.el-dialog__wrapper, .el-message-box__wrapper, .el-picker-panel) .el-button:not(.el-button--text):not(.is-circle) {
    min-height: 32px;
    padding: 8px 12px;
    line-height: 14px;
    border-radius: 6px;
  }

  :is(.asr-tabler-cash-overlay, .payment-handling-more-menu, .payment-handling-select-popper, .payment-handling-date-popper) .el-button--primary,
  :is(html[data-asr-page="finance"]:has(#app .app-main .payment-handling-page)) body > :is(.el-dialog__wrapper, .el-message-box__wrapper, .el-picker-panel) .el-button--primary {
    color: #fff !important;
    background: var(--asr-tabler-cash-primary) !important;
    border-color: var(--asr-tabler-cash-primary) !important;
    box-shadow: none;
  }

  :is(.asr-tabler-cash-overlay, .payment-handling-more-menu, .payment-handling-select-popper, .payment-handling-date-popper) .el-button--primary:not(.is-disabled):is(:hover, :focus-visible),
  :is(html[data-asr-page="finance"]:has(#app .app-main .payment-handling-page)) body > :is(.el-dialog__wrapper, .el-message-box__wrapper, .el-picker-panel) .el-button--primary:not(.is-disabled):is(:hover, :focus-visible) {
    background: var(--asr-tabler-cash-primary-hover) !important;
    border-color: var(--asr-tabler-cash-primary-hover) !important;
  }

  :is(.asr-tabler-cash-overlay, .payment-handling-more-menu, .payment-handling-select-popper, .payment-handling-date-popper) .el-button--primary.is-plain,
  :is(html[data-asr-page="finance"]:has(#app .app-main .payment-handling-page)) body > :is(.el-dialog__wrapper, .el-message-box__wrapper, .el-picker-panel) .el-button--primary.is-plain {
    color: var(--asr-tabler-cash-primary) !important;
    background: var(--asr-tabler-cash-primary-soft) !important;
    border-color: #b5cee9 !important;
  }

  :is(.asr-tabler-cash-overlay, .payment-handling-more-menu, .payment-handling-select-popper, .payment-handling-date-popper) .el-button--primary.is-plain:not(.is-disabled):is(:hover, :focus-visible),
  :is(html[data-asr-page="finance"]:has(#app .app-main .payment-handling-page)) body > :is(.el-dialog__wrapper, .el-message-box__wrapper, .el-picker-panel) .el-button--primary.is-plain:not(.is-disabled):is(:hover, :focus-visible) {
    color: #fff !important;
    background: var(--asr-tabler-cash-primary-hover) !important;
    border-color: var(--asr-tabler-cash-primary-hover) !important;
  }

  :is(.asr-tabler-cash-overlay, .payment-handling-more-menu, .payment-handling-select-popper, .payment-handling-date-popper) .el-button.is-disabled,
  :is(html[data-asr-page="finance"]:has(#app .app-main .payment-handling-page)) body > :is(.el-dialog__wrapper, .el-message-box__wrapper, .el-picker-panel) .el-button.is-disabled {
    cursor: not-allowed;
    opacity: .6;
  }

  :is(.asr-tabler-cash-overlay, .payment-handling-more-menu, .payment-handling-select-popper, .payment-handling-date-popper) :is(.el-select-dropdown__item, .el-dropdown-menu__item),
  :is(html[data-asr-page="finance"]:has(#app .app-main .payment-handling-page)) body > :is(.el-select-dropdown, .el-dropdown-menu) :is(.el-select-dropdown__item, .el-dropdown-menu__item) {
    box-sizing: border-box;
    min-height: 32px;
    height: auto;
    padding: 5px 12px;
    line-height: 22px;
    font-size: 14px;
  }

  :is(.asr-tabler-cash-overlay, .payment-handling-more-menu, .payment-handling-select-popper, .payment-handling-date-popper) .el-select-dropdown__item.selected,
  :is(html[data-asr-page="finance"]:has(#app .app-main .payment-handling-page)) body > .el-select-dropdown .el-select-dropdown__item.selected {
    color: var(--asr-tabler-cash-primary);
    background: var(--asr-tabler-cash-primary-soft);
    font-weight: 600;
  }

  :is(.asr-tabler-cash-overlay, .payment-handling-more-menu, .payment-handling-select-popper, .payment-handling-date-popper) :is(.el-select-dropdown__item, .el-dropdown-menu__item):not(.is-disabled):hover,
  :is(html[data-asr-page="finance"]:has(#app .app-main .payment-handling-page)) body > :is(.el-select-dropdown, .el-dropdown-menu) :is(.el-select-dropdown__item, .el-dropdown-menu__item):not(.is-disabled):hover {
    background: #f1f4f8;
  }

  /* State semantics remain visible; do not remove invalid/disabled affordances. */
  #app .app-main .payment-handling-page .el-form-item.is-error :is(.el-input__inner, .el-textarea__inner),
  :is(.asr-tabler-cash-overlay, .payment-handling-more-menu, .payment-handling-select-popper, .payment-handling-date-popper) .el-form-item.is-error :is(.el-input__inner, .el-textarea__inner),
  :is(html[data-asr-page="finance"]:has(#app .app-main .payment-handling-page)) body > .el-dialog__wrapper .el-form-item.is-error :is(.el-input__inner, .el-textarea__inner) {
    border-color: #d63939;
  }

  @media (max-width: 760px) {
    #app .app-main .payment-handling-page { padding: 12px; }
    #app .app-main :is(.payment-handling-create, .payment-handling-detail) { padding: 12px; }
    #app .app-main :is(.payment-handling-heading, .payment-handling-detail-heading) { align-items: flex-start; }
    #app .app-main .payment-handling-heading h1 { font-size: 20px !important; }
    #app .app-main .payment-handling-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    #app .app-main .payment-handling-filter :is(.el-input, .el-select) { width: 140px; }
  }
}

/* Compact Tabler spacing across existing pages. Status/error content stays visible. */
html[data-asr-theme="tabler"] #app .app-main :is(.filter-container,.list-filter,.asr-role-toolbar,.asr-role-actions,.asr-shared-role-toolbar,.payment-handling-filter) { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-block:12px; }
html[data-asr-theme="tabler"] #app .app-main :is(.filter-container,.list-filter,.asr-role-toolbar,.asr-shared-role-toolbar,.payment-handling-filter) .el-button + .el-button { margin-left:0; }
html[data-asr-theme="tabler"] #app .app-main :is(.asr-role-page,.asr-admin-management,.asr-shared-role-page,.payment-handling-page) h1 { font-size:22px; line-height:1.4; margin:0 0 12px; }
html[data-asr-theme="tabler"] #app .app-main :is(.asr-role-page,.asr-admin-management,.asr-shared-role-page,.payment-handling-page) h2 { font-size:18px; line-height:1.4; margin:0 0 12px; }
html[data-asr-theme="tabler"] #app .app-main .el-table :is(th,td) { padding-block:8px; }
html[data-asr-theme="tabler"] #app .app-main .el-table .cell { line-height:22px; }
html[data-asr-theme="tabler"] #app .app-main .el-pagination { margin-top:12px; }