/* =========================================================
   ERP Theme-Derived Color System + Project-wide Button UX
   - removes leftover default/bootstrap-looking color impressions
   - derives operation/table/button tones from active theme tokens
   - keeps semantics, but harmonizes them with current theme
   ========================================================= */

html,
html[data-theme],
body.erp-modern-v2 {
  --erp-theme-core: color-mix(in srgb, var(--primary, #4f7cff) 78%, var(--topbar-bg, var(--primary, #4f7cff)) 22%);
  --erp-theme-support: color-mix(in srgb, var(--accent, #14b8a6) 68%, var(--primary, #4f7cff) 32%);
  --erp-theme-nav: color-mix(in srgb, var(--nav-bg, var(--topbar-bg, #1e293b)) 76%, var(--primary, #4f7cff) 24%);

  --erp-surface-1: color-mix(in srgb, var(--primary, #4f7cff) 6%, var(--card, #ffffff) 94%);
  --erp-surface-2: color-mix(in srgb, var(--primary, #4f7cff) 10%, var(--card, #ffffff) 90%);
  --erp-surface-3: color-mix(in srgb, var(--primary, #4f7cff) 14%, var(--card, #ffffff) 86%);
  --erp-surface-4: color-mix(in srgb, var(--primary, #4f7cff) 18%, var(--card, #ffffff) 82%);
  --erp-surface-5: color-mix(in srgb, var(--primary, #4f7cff) 24%, var(--card, #ffffff) 76%);
  --erp-surface-accent-1: color-mix(in srgb, color-mix(in srgb, var(--erp-theme-core) 82%, var(--erp-theme-support) 18%) 16%, var(--card, #ffffff) 84%);
  --erp-surface-accent-2: color-mix(in srgb, color-mix(in srgb, var(--erp-theme-core) 68%, var(--erp-theme-support) 32%) 18%, var(--card, #ffffff) 82%);
  --erp-surface-accent-3: color-mix(in srgb, color-mix(in srgb, var(--erp-theme-support) 62%, var(--erp-theme-core) 38%) 18%, var(--card, #ffffff) 82%);
  --erp-surface-accent-4: color-mix(in srgb, color-mix(in srgb, var(--erp-theme-support) 78%, var(--erp-theme-core) 22%) 20%, var(--card, #ffffff) 80%);
  --erp-surface-nav-1: color-mix(in srgb, var(--erp-theme-nav) 14%, var(--card, #ffffff) 86%);
  --erp-surface-nav-2: color-mix(in srgb, var(--erp-theme-nav) 22%, var(--card, #ffffff) 78%);

  --erp-on-light-surface: var(--text, #162033);
  --erp-on-strong-surface: #ffffff;

  /* Theme-derived tables / operation screens */
  --table-bg-base: var(--bg, #f7f9fc);
  --table-row-base: var(--card, #ffffff);
  --table-head-base: var(--erp-surface-4);
  --table-hover-base: color-mix(in srgb, var(--primary, #4f7cff) 11%, var(--card, #ffffff) 89%);
  --table-sticky-base: color-mix(in srgb, var(--primary, #4f7cff) 13%, var(--card, #ffffff) 87%);
  --custom-table-head: var(--table-head-base);
  --custom-table-hover: var(--table-hover-base);
  --custom-table-sticky: var(--table-sticky-base);
  --bluegreen-head-bg: var(--table-head-base);
  --bluegreen-head-text: var(--erp-on-light-surface);
  --bluegreen-border: color-mix(in srgb, var(--primary, #4f7cff) 28%, rgba(15, 23, 42, .12));

  --opr-on-light: var(--erp-on-light-surface);
  --opr-on-dark: var(--erp-on-light-surface);
  --opr-head-bg-base: var(--erp-surface-4);
  --opr-number-bg-base: var(--erp-surface-5);
  --entag-head-bg-base: color-mix(in srgb, var(--erp-theme-core) 74%, var(--erp-theme-nav) 26%);
  --custom-opr-head-bg: var(--opr-head-bg-base);
  --custom-opr-number-bg: var(--opr-number-bg-base);
  --custom-opr-head-text: var(--erp-on-light-surface);
  --custom-opr-number-text: var(--erp-on-light-surface);
  --custom-opr-title-text: var(--erp-on-light-surface);

  /* Operation-type tones: all derived from the active theme */
  --opr-typ-1-head-base: var(--erp-surface-3);
  --opr-typ-1-number-base: var(--erp-surface-5);
  --opr-typ-2-head-base: var(--erp-surface-4);
  --opr-typ-2-number-base: color-mix(in srgb, var(--primary, #4f7cff) 32%, var(--card, #ffffff) 68%);
  --opr-typ-3-head-base: var(--erp-surface-accent-1);
  --opr-typ-3-number-base: color-mix(in srgb, color-mix(in srgb, var(--erp-theme-core) 82%, var(--erp-theme-support) 18%) 30%, var(--card, #ffffff) 70%);
  --opr-typ-4-head-base: var(--erp-surface-accent-2);
  --opr-typ-4-number-base: color-mix(in srgb, color-mix(in srgb, var(--erp-theme-core) 68%, var(--erp-theme-support) 32%) 30%, var(--card, #ffffff) 70%);
  --opr-typ-5-head-base: var(--erp-surface-accent-3);
  --opr-typ-5-number-base: color-mix(in srgb, color-mix(in srgb, var(--erp-theme-support) 62%, var(--erp-theme-core) 38%) 30%, var(--card, #ffffff) 70%);
  --opr-typ-6-head-base: var(--erp-surface-nav-1);
  --opr-typ-6-number-base: var(--erp-surface-nav-2);
  --opr-typ-7-head-base: var(--erp-surface-accent-4);
  --opr-typ-7-number-base: color-mix(in srgb, color-mix(in srgb, var(--erp-theme-support) 78%, var(--erp-theme-core) 22%) 30%, var(--card, #ffffff) 70%);
  --opr-typ-8-head-base: color-mix(in srgb, var(--erp-theme-core) 12%, color-mix(in srgb, var(--erp-theme-support) 12%, var(--card, #ffffff) 88%) 88%);
  --opr-typ-8-number-base: color-mix(in srgb, var(--erp-theme-core) 26%, color-mix(in srgb, var(--erp-theme-support) 14%, var(--card, #ffffff) 86%) 74%);
  --opr-typ-10-head-base: color-mix(in srgb, var(--erp-theme-support) 14%, color-mix(in srgb, var(--erp-theme-nav) 10%, var(--card, #ffffff) 90%) 86%);
  --opr-typ-10-number-base: color-mix(in srgb, var(--erp-theme-support) 28%, color-mix(in srgb, var(--erp-theme-nav) 10%, var(--card, #ffffff) 90%) 72%);
  --opr-typ-10-entag-base: var(--entag-head-bg-base);
  --opr-typ-20-head-base: var(--erp-surface-3);
  --opr-typ-20-number-base: var(--erp-surface-4);
  --opr-typ-21-head-base: var(--erp-surface-4);
  --opr-typ-21-number-base: var(--erp-surface-5);
  --opr-typ-23-head-base: var(--erp-surface-accent-1);
  --opr-typ-23-number-base: color-mix(in srgb, color-mix(in srgb, var(--erp-theme-core) 82%, var(--erp-theme-support) 18%) 28%, var(--card, #ffffff) 72%);
  --opr-typ-24-head-base: var(--erp-surface-accent-3);
  --opr-typ-24-number-base: color-mix(in srgb, color-mix(in srgb, var(--erp-theme-support) 62%, var(--erp-theme-core) 38%) 28%, var(--card, #ffffff) 72%);
  --opr-typ-25-head-base: var(--erp-surface-nav-1);
  --opr-typ-25-number-base: var(--erp-surface-nav-2);
  --opr-typ-30-head-base: var(--erp-surface-accent-4);
  --opr-typ-30-number-base: color-mix(in srgb, color-mix(in srgb, var(--erp-theme-support) 78%, var(--erp-theme-core) 22%) 30%, var(--card, #ffffff) 70%);
  --opr-typ-31-head-base: color-mix(in srgb, var(--erp-theme-nav) 12%, color-mix(in srgb, var(--erp-theme-support) 10%, var(--card, #ffffff) 90%) 88%);
  --opr-typ-31-number-base: color-mix(in srgb, var(--erp-theme-nav) 24%, color-mix(in srgb, var(--erp-theme-support) 12%, var(--card, #ffffff) 88%) 76%);
  --opr-typ-36-head-base: color-mix(in srgb, var(--erp-theme-core) 10%, color-mix(in srgb, var(--erp-theme-nav) 12%, var(--card, #ffffff) 88%) 90%);
  --opr-typ-36-number-base: color-mix(in srgb, var(--erp-theme-core) 24%, color-mix(in srgb, var(--erp-theme-nav) 12%, var(--card, #ffffff) 88%) 76%);
  --opr-typ-77-head-base: color-mix(in srgb, var(--erp-theme-support) 12%, var(--card, #ffffff) 88%);
  --opr-typ-77-number-base: color-mix(in srgb, var(--erp-theme-support) 26%, var(--card, #ffffff) 74%);
  --opr-typ-112-head-base: color-mix(in srgb, var(--erp-theme-core) 12%, color-mix(in srgb, var(--erp-theme-support) 8%, var(--card, #ffffff) 92%) 88%);
  --opr-typ-112-number-base: color-mix(in srgb, var(--erp-theme-core) 24%, color-mix(in srgb, var(--erp-theme-support) 10%, var(--card, #ffffff) 90%) 76%);
  --opr-typ-113-head-base: color-mix(in srgb, var(--erp-theme-support) 14%, color-mix(in srgb, var(--erp-theme-core) 8%, var(--card, #ffffff) 92%) 86%);
  --opr-typ-113-number-base: color-mix(in srgb, var(--erp-theme-support) 28%, color-mix(in srgb, var(--erp-theme-core) 8%, var(--card, #ffffff) 92%) 72%);

  /* Force readable text on all theme-derived OPR surfaces */
  --custom-opr-typ-1-title-text: var(--erp-on-light-surface);
  --custom-opr-typ-1-head-text: var(--erp-on-light-surface);
  --custom-opr-typ-1-number-text: var(--erp-on-light-surface);
  --custom-opr-typ-2-title-text: var(--erp-on-light-surface);
  --custom-opr-typ-2-head-text: var(--erp-on-light-surface);
  --custom-opr-typ-2-number-text: var(--erp-on-light-surface);
  --custom-opr-typ-3-title-text: var(--erp-on-light-surface);
  --custom-opr-typ-3-head-text: var(--erp-on-light-surface);
  --custom-opr-typ-3-number-text: var(--erp-on-light-surface);
  --custom-opr-typ-4-title-text: var(--erp-on-light-surface);
  --custom-opr-typ-4-head-text: var(--erp-on-light-surface);
  --custom-opr-typ-4-number-text: var(--erp-on-light-surface);
  --custom-opr-typ-5-title-text: var(--erp-on-light-surface);
  --custom-opr-typ-5-head-text: var(--erp-on-light-surface);
  --custom-opr-typ-5-number-text: var(--erp-on-light-surface);
  --custom-opr-typ-6-title-text: var(--erp-on-light-surface);
  --custom-opr-typ-6-head-text: var(--erp-on-light-surface);
  --custom-opr-typ-6-number-text: var(--erp-on-light-surface);
  --custom-opr-typ-7-title-text: var(--erp-on-light-surface);
  --custom-opr-typ-7-head-text: var(--erp-on-light-surface);
  --custom-opr-typ-7-number-text: var(--erp-on-light-surface);
  --custom-opr-typ-8-title-text: var(--erp-on-light-surface);
  --custom-opr-typ-8-head-text: var(--erp-on-light-surface);
  --custom-opr-typ-8-number-text: var(--erp-on-light-surface);
  --custom-opr-typ-10-title-text: var(--erp-on-light-surface);
  --custom-opr-typ-10-head-text: var(--erp-on-light-surface);
  --custom-opr-typ-10-number-text: var(--erp-on-light-surface);
  --custom-opr-typ-20-title-text: var(--erp-on-light-surface);
  --custom-opr-typ-20-head-text: var(--erp-on-light-surface);
  --custom-opr-typ-20-number-text: var(--erp-on-light-surface);
  --custom-opr-typ-21-title-text: var(--erp-on-light-surface);
  --custom-opr-typ-21-head-text: var(--erp-on-light-surface);
  --custom-opr-typ-21-number-text: var(--erp-on-light-surface);
  --custom-opr-typ-23-title-text: var(--erp-on-light-surface);
  --custom-opr-typ-23-head-text: var(--erp-on-light-surface);
  --custom-opr-typ-23-number-text: var(--erp-on-light-surface);
  --custom-opr-typ-24-title-text: var(--erp-on-light-surface);
  --custom-opr-typ-24-head-text: var(--erp-on-light-surface);
  --custom-opr-typ-24-number-text: var(--erp-on-light-surface);
  --custom-opr-typ-25-title-text: var(--erp-on-light-surface);
  --custom-opr-typ-25-head-text: var(--erp-on-light-surface);
  --custom-opr-typ-25-number-text: var(--erp-on-light-surface);
  --custom-opr-typ-30-title-text: var(--erp-on-light-surface);
  --custom-opr-typ-30-head-text: var(--erp-on-light-surface);
  --custom-opr-typ-30-number-text: var(--erp-on-light-surface);
  --custom-opr-typ-31-title-text: var(--erp-on-light-surface);
  --custom-opr-typ-31-head-text: var(--erp-on-light-surface);
  --custom-opr-typ-31-number-text: var(--erp-on-light-surface);
  --custom-opr-typ-36-title-text: var(--erp-on-light-surface);
  --custom-opr-typ-36-head-text: var(--erp-on-light-surface);
  --custom-opr-typ-36-number-text: var(--erp-on-light-surface);
  --custom-opr-typ-77-title-text: var(--erp-on-light-surface);
  --custom-opr-typ-77-head-text: var(--erp-on-light-surface);
  --custom-opr-typ-77-number-text: var(--erp-on-light-surface);
  --custom-opr-typ-112-title-text: var(--erp-on-light-surface);
  --custom-opr-typ-112-head-text: var(--erp-on-light-surface);
  --custom-opr-typ-112-number-text: var(--erp-on-light-surface);
  --custom-opr-typ-113-title-text: var(--erp-on-light-surface);
  --custom-opr-typ-113-head-text: var(--erp-on-light-surface);
  --custom-opr-typ-113-number-text: var(--erp-on-light-surface);

  /* Button tokens */
  --erp-btn-radius: 14px;
  --erp-btn-shadow: 0 8px 20px rgba(15, 23, 42, .08);
  --erp-btn-shadow-hover: 0 12px 28px rgba(15, 23, 42, .12);
  --erp-btn-shadow-soft: 0 4px 12px rgba(15, 23, 42, .06);
  --erp-btn-border-soft: color-mix(in srgb, var(--primary, #4f7cff) 16%, rgba(15, 23, 42, .12));
  --erp-btn-ghost-fill: color-mix(in srgb, var(--primary, #4f7cff) 5%, var(--card, #ffffff) 95%);
  --erp-btn-primary-fill: color-mix(in srgb, var(--erp-theme-core) 84%, white 16%);
  --erp-btn-info-fill: color-mix(in srgb, color-mix(in srgb, var(--erp-theme-core) 78%, var(--erp-theme-support) 22%) 86%, white 14%);
  --erp-btn-success-fill: color-mix(in srgb, color-mix(in srgb, var(--erp-theme-support) 72%, var(--erp-theme-core) 28%) 84%, white 16%);
  --erp-btn-warning-fill: color-mix(in srgb, color-mix(in srgb, #d7a14a 38%, var(--erp-theme-core) 62%) 84%, white 16%);
  --erp-btn-danger-fill: color-mix(in srgb, color-mix(in srgb, #d85f72 42%, var(--erp-theme-core) 58%) 84%, white 16%);
  --erp-btn-secondary-fill: color-mix(in srgb, var(--erp-theme-nav) 72%, white 28%);
  --erp-btn-dark-fill: color-mix(in srgb, var(--erp-theme-nav) 88%, white 12%);
  --erp-btn-solid-text: #ffffff;
  --erp-btn-soft-text: var(--text, #162033);
  --erp-btn-focus-ring: 0 0 0 4px color-mix(in srgb, var(--primary, #4f7cff) 18%, transparent);
}

/* Project-wide button system */
body.erp-modern-v2 .btn,
body.erp-modern-v2 a.btn,
body.erp-modern-v2 button.btn,
body.erp-modern-v2 input.btn,
body.erp-modern-v2 .erp-pos-button,
body.erp-modern-v2 .erp-keypad-button,
body.erp-modern-v2 .less-button_Opr,
body.erp-modern-v2 .qbtn,
body.erp-modern-v2 .te-btn,
body.erp-modern-v2 .dataTables_wrapper .dt-buttons .btn,
body.erp-modern-v2 .dataTables_wrapper .buttons-copy,
body.erp-modern-v2 .dataTables_wrapper .buttons-excel,
body.erp-modern-v2 .dataTables_wrapper .buttons-pdf,
body.erp-modern-v2 .dataTables_wrapper .buttons-print {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  min-height: 40px;
  padding: 0 14px;
  border-radius: var(--erp-btn-radius) !important;
  border-width: 1px !important;
  border-style: solid !important;
  font-weight: 800 !important;
  letter-spacing: 0;
  line-height: 1.1;
  text-decoration: none !important;
  box-shadow: var(--erp-btn-shadow-soft) !important;
  transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .16s ease, color .18s ease;
}

body.erp-modern-v2 .btn:not(.btn-link):not(.btn-tool):not(.erp-icon-btn--compact):not(.qbtn):not(.less-button_Opr):focus,
body.erp-modern-v2 .erp-pos-button:focus,
body.erp-modern-v2 .erp-keypad-button:focus,
body.erp-modern-v2 .dataTables_wrapper .dt-buttons .btn:focus,
body.erp-modern-v2 .te-btn:focus {
  outline: none !important;
  box-shadow: var(--erp-btn-focus-ring), var(--erp-btn-shadow) !important;
}

body.erp-modern-v2 .btn:not(.btn-link):not(.btn-tool):not(.disabled):not(:disabled):hover,
body.erp-modern-v2 .erp-pos-button:not(.disabled):not(:disabled):hover,
body.erp-modern-v2 .erp-keypad-button:not(.disabled):not(:disabled):hover,
body.erp-modern-v2 .dataTables_wrapper .dt-buttons .btn:not(.disabled):not(:disabled):hover,
body.erp-modern-v2 .te-btn:not(.disabled):not(:disabled):hover {
  transform: translateY(-1px);
  box-shadow: var(--erp-btn-shadow-hover) !important;
}

body.erp-modern-v2 .btn:disabled,
body.erp-modern-v2 .btn.disabled,
body.erp-modern-v2 .erp-pos-button:disabled,
body.erp-modern-v2 .erp-keypad-button:disabled,
body.erp-modern-v2 .dataTables_wrapper .dt-buttons .btn:disabled {
  opacity: .58 !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}

body.erp-modern-v2 .btn i,
body.erp-modern-v2 .btn .fa,
body.erp-modern-v2 .btn .fas,
body.erp-modern-v2 .btn .far,
body.erp-modern-v2 .btn .fab,
body.erp-modern-v2 .btn .material-icons,
body.erp-modern-v2 .erp-pos-button i,
body.erp-modern-v2 .erp-keypad-button i {
  font-size: .92em;
  line-height: 1;
  margin-inline-end: .05rem;
}

/* Neutral / ghost buttons */
body.erp-modern-v2 .btn:not(.btn-primary):not(.btn-info):not(.btn-success):not(.btn-warning):not(.btn-danger):not(.btn-secondary):not(.btn-dark):not(.btn-link):not(.btn-tool),
body.erp-modern-v2 .btn-default,
body.erp-modern-v2 .te-btn,
body.erp-modern-v2 .dataTables_wrapper .dt-buttons .btn:not(.btn-primary):not(.btn-info):not(.btn-success):not(.btn-warning):not(.btn-danger):not(.btn-secondary) {
  background: linear-gradient(180deg, color-mix(in srgb, var(--erp-btn-ghost-fill) 88%, white 12%), var(--erp-btn-ghost-fill)) !important;
  color: var(--erp-btn-soft-text) !important;
  border-color: var(--erp-btn-border-soft) !important;
}

body.erp-modern-v2 .btn:not(.btn-primary):not(.btn-info):not(.btn-success):not(.btn-warning):not(.btn-danger):not(.btn-secondary):not(.btn-dark):not(.btn-link):not(.btn-tool):hover,
body.erp-modern-v2 .btn-default:hover,
body.erp-modern-v2 .te-btn:hover,
body.erp-modern-v2 .dataTables_wrapper .dt-buttons .btn:not(.btn-primary):not(.btn-info):not(.btn-success):not(.btn-warning):not(.btn-danger):not(.btn-secondary):hover {
  background: linear-gradient(180deg, color-mix(in srgb, var(--primary, #4f7cff) 8%, white 92%), color-mix(in srgb, var(--primary, #4f7cff) 12%, var(--card, #ffffff) 88%)) !important;
  border-color: color-mix(in srgb, var(--primary, #4f7cff) 22%, rgba(15, 23, 42, .12)) !important;
}

/* Semantic buttons: all harmonized with active theme */
body.erp-modern-v2 .btn-primary,
body.erp-modern-v2 .btn-info,
body.erp-modern-v2 .btn-success,
body.erp-modern-v2 .btn-warning,
body.erp-modern-v2 .btn-danger,
body.erp-modern-v2 .btn-secondary,
body.erp-modern-v2 .btn-dark,
body.erp-modern-v2 .erp-pos-button.btn-primary,
body.erp-modern-v2 .erp-pos-button.btn-info,
body.erp-modern-v2 .erp-pos-button.btn-success,
body.erp-modern-v2 .erp-pos-button.btn-warning,
body.erp-modern-v2 .erp-pos-button.btn-danger,
body.erp-modern-v2 .erp-keypad-button.btn-primary,
body.erp-modern-v2 .erp-keypad-button.btn-info,
body.erp-modern-v2 .erp-keypad-button.btn-success,
body.erp-modern-v2 .erp-keypad-button.btn-warning,
body.erp-modern-v2 .erp-keypad-button.btn-danger {
  color: var(--erp-btn-solid-text) !important;
}

body.erp-modern-v2 .btn-primary { background: linear-gradient(180deg, color-mix(in srgb, var(--erp-btn-primary-fill) 88%, white 12%), var(--erp-btn-primary-fill)) !important; border-color: color-mix(in srgb, var(--erp-btn-primary-fill) 84%, rgba(15, 23, 42, .16)) !important; }
body.erp-modern-v2 .btn-info { background: linear-gradient(180deg, color-mix(in srgb, var(--erp-btn-info-fill) 88%, white 12%), var(--erp-btn-info-fill)) !important; border-color: color-mix(in srgb, var(--erp-btn-info-fill) 84%, rgba(15, 23, 42, .16)) !important; }
body.erp-modern-v2 .btn-success { background: linear-gradient(180deg, color-mix(in srgb, var(--erp-btn-success-fill) 88%, white 12%), var(--erp-btn-success-fill)) !important; border-color: color-mix(in srgb, var(--erp-btn-success-fill) 84%, rgba(15, 23, 42, .16)) !important; }
body.erp-modern-v2 .btn-warning { background: linear-gradient(180deg, color-mix(in srgb, var(--erp-btn-warning-fill) 88%, white 12%), var(--erp-btn-warning-fill)) !important; border-color: color-mix(in srgb, var(--erp-btn-warning-fill) 84%, rgba(15, 23, 42, .16)) !important; }
body.erp-modern-v2 .btn-danger { background: linear-gradient(180deg, color-mix(in srgb, var(--erp-btn-danger-fill) 88%, white 12%), var(--erp-btn-danger-fill)) !important; border-color: color-mix(in srgb, var(--erp-btn-danger-fill) 84%, rgba(15, 23, 42, .16)) !important; }
body.erp-modern-v2 .btn-secondary { background: linear-gradient(180deg, color-mix(in srgb, var(--erp-btn-secondary-fill) 88%, white 12%), var(--erp-btn-secondary-fill)) !important; border-color: color-mix(in srgb, var(--erp-btn-secondary-fill) 84%, rgba(15, 23, 42, .16)) !important; }
body.erp-modern-v2 .btn-dark { background: linear-gradient(180deg, color-mix(in srgb, var(--erp-btn-dark-fill) 88%, white 12%), var(--erp-btn-dark-fill)) !important; border-color: color-mix(in srgb, var(--erp-btn-dark-fill) 84%, rgba(15, 23, 42, .16)) !important; color: #fff !important; }

body.erp-modern-v2 .btn-primary:hover { background: linear-gradient(180deg, color-mix(in srgb, var(--erp-btn-primary-fill) 80%, white 20%), color-mix(in srgb, var(--erp-btn-primary-fill) 92%, #0f172a 8%)) !important; }
body.erp-modern-v2 .btn-info:hover { background: linear-gradient(180deg, color-mix(in srgb, var(--erp-btn-info-fill) 80%, white 20%), color-mix(in srgb, var(--erp-btn-info-fill) 92%, #0f172a 8%)) !important; }
body.erp-modern-v2 .btn-success:hover { background: linear-gradient(180deg, color-mix(in srgb, var(--erp-btn-success-fill) 80%, white 20%), color-mix(in srgb, var(--erp-btn-success-fill) 92%, #0f172a 8%)) !important; }
body.erp-modern-v2 .btn-warning:hover { background: linear-gradient(180deg, color-mix(in srgb, var(--erp-btn-warning-fill) 80%, white 20%), color-mix(in srgb, var(--erp-btn-warning-fill) 92%, #0f172a 8%)) !important; }
body.erp-modern-v2 .btn-danger:hover { background: linear-gradient(180deg, color-mix(in srgb, var(--erp-btn-danger-fill) 80%, white 20%), color-mix(in srgb, var(--erp-btn-danger-fill) 92%, #0f172a 8%)) !important; }
body.erp-modern-v2 .btn-secondary:hover { background: linear-gradient(180deg, color-mix(in srgb, var(--erp-btn-secondary-fill) 80%, white 20%), color-mix(in srgb, var(--erp-btn-secondary-fill) 92%, #0f172a 8%)) !important; }
body.erp-modern-v2 .btn-dark:hover { background: linear-gradient(180deg, color-mix(in srgb, var(--erp-btn-dark-fill) 80%, white 20%), color-mix(in srgb, var(--erp-btn-dark-fill) 92%, #0f172a 8%)) !important; }

/* Outline variants */
body.erp-modern-v2 .btn-outline-primary,
body.erp-modern-v2 .btn-outline-info,
body.erp-modern-v2 .btn-outline-success,
body.erp-modern-v2 .btn-outline-warning,
body.erp-modern-v2 .btn-outline-danger,
body.erp-modern-v2 .btn-outline-secondary {
  background: linear-gradient(180deg, color-mix(in srgb, var(--primary, #4f7cff) 5%, var(--card, #ffffff) 95%), var(--card, #ffffff)) !important;
  color: var(--erp-btn-soft-text) !important;
}
body.erp-modern-v2 .btn-outline-primary { border-color: color-mix(in srgb, var(--erp-btn-primary-fill) 36%, rgba(15, 23, 42, .14)) !important; }
body.erp-modern-v2 .btn-outline-info { border-color: color-mix(in srgb, var(--erp-btn-info-fill) 36%, rgba(15, 23, 42, .14)) !important; }
body.erp-modern-v2 .btn-outline-success { border-color: color-mix(in srgb, var(--erp-btn-success-fill) 36%, rgba(15, 23, 42, .14)) !important; }
body.erp-modern-v2 .btn-outline-warning { border-color: color-mix(in srgb, var(--erp-btn-warning-fill) 36%, rgba(15, 23, 42, .14)) !important; }
body.erp-modern-v2 .btn-outline-danger { border-color: color-mix(in srgb, var(--erp-btn-danger-fill) 36%, rgba(15, 23, 42, .14)) !important; }
body.erp-modern-v2 .btn-outline-secondary { border-color: color-mix(in srgb, var(--erp-btn-secondary-fill) 36%, rgba(15, 23, 42, .14)) !important; }

body.erp-modern-v2 .btn-outline-primary:hover { background: color-mix(in srgb, var(--erp-btn-primary-fill) 16%, var(--card, #ffffff) 84%) !important; }
body.erp-modern-v2 .btn-outline-info:hover { background: color-mix(in srgb, var(--erp-btn-info-fill) 16%, var(--card, #ffffff) 84%) !important; }
body.erp-modern-v2 .btn-outline-success:hover { background: color-mix(in srgb, var(--erp-btn-success-fill) 16%, var(--card, #ffffff) 84%) !important; }
body.erp-modern-v2 .btn-outline-warning:hover { background: color-mix(in srgb, var(--erp-btn-warning-fill) 16%, var(--card, #ffffff) 84%) !important; }
body.erp-modern-v2 .btn-outline-danger:hover { background: color-mix(in srgb, var(--erp-btn-danger-fill) 16%, var(--card, #ffffff) 84%) !important; }
body.erp-modern-v2 .btn-outline-secondary:hover { background: color-mix(in srgb, var(--erp-btn-secondary-fill) 16%, var(--card, #ffffff) 84%) !important; }

/* Small / compact controls */
body.erp-modern-v2 .btn-sm,
body.erp-modern-v2 .erp-icon-btn--compact,
body.erp-modern-v2 .qbtn,
body.erp-modern-v2 .less-button_Opr,
body.erp-modern-v2 .btn-tool,
body.erp-modern-v2 .erp-keypad-button {
  min-height: 32px;
  padding: 0 10px;
  border-radius: 12px !important;
  font-size: .92rem;
}

body.erp-modern-v2 .erp-icon-btn--compact,
body.erp-modern-v2 .qbtn,
body.erp-modern-v2 .less-button_Opr,
body.erp-modern-v2 .btn-tool {
  width: 32px;
  min-width: 32px;
  padding: 0 !important;
  gap: 0;
}

body.erp-modern-v2 .erp-icon-btn--compact i,
body.erp-modern-v2 .qbtn i,
body.erp-modern-v2 .less-button_Opr i,
body.erp-modern-v2 .btn-tool i,
body.erp-modern-v2 .erp-icon-btn--compact .fa,
body.erp-modern-v2 .qbtn .fa,
body.erp-modern-v2 .less-button_Opr .fa,
body.erp-modern-v2 .btn-tool .fa,
body.erp-modern-v2 .erp-icon-btn--compact .fas,
body.erp-modern-v2 .qbtn .fas,
body.erp-modern-v2 .less-button_Opr .fas,
body.erp-modern-v2 .btn-tool .fas {
  margin-inline-end: 0;
  font-size: .9rem;
}

/* Button groups / bars look calmer and more consistent */
body.erp-modern-v2 .button-box,
body.erp-modern-v2 .toolbar,
body.erp-modern-v2 .erp-smart-toolbar,
body.erp-modern-v2 .dataTables_wrapper .dt-buttons {
  gap: 10px;
}

body.erp-modern-v2 .button-box .btn,
body.erp-modern-v2 .toolbar .btn,
body.erp-modern-v2 .erp-smart-toolbar .btn,
body.erp-modern-v2 .dataTables_wrapper .dt-buttons .btn {
  margin: 0 !important;
}

/* Table header / invoice shells: eliminate leftover default tones */
body.erp-modern-v2 .erp-opr-scope .erp-table-shell th,
body.erp-modern-v2 .erp-opr-scope .table.table-head-fixed thead tr:nth-child(1) th,
body.erp-modern-v2 .erp-screen-invoice .erp-table-shell th,
body.erp-modern-v2 .BlueGreen th,
body.erp-modern-v2 .table thead th.Title_screan,
body.erp-modern-v2 .table thead th.Title_screan2,
body.erp-modern-v2 .table thead th.Title_screan1,
body.erp-modern-v2 .table thead th.Title_screan5,
body.erp-modern-v2 .table thead th.Title_screan6 {
  background-color: var(--opr-head-bg, var(--table-head-base)) !important;
  color: var(--erp-on-light-surface) !important;
  border-color: color-mix(in srgb, var(--primary, #4f7cff) 18%, rgba(15, 23, 42, .12)) !important;
}

body.erp-modern-v2 .erp-opr-scope .sticky-column_start,
body.erp-modern-v2 .erp-opr-scope .sticky-column_end,
body.erp-modern-v2 .erp-screen-invoice .sticky-column_start,
body.erp-modern-v2 .erp-screen-invoice .sticky-column_end {
  background-color: var(--table-sticky-base) !important;
}

/* Slightly calmer inline action surfaces inside invoice/detail tables */
body.erp-modern-v2 .erp-screen-invoice .qbtn,
body.erp-modern-v2 .erp-screen-invoice .less-button_Opr,
body.erp-modern-v2 .erp-screen-invoice .erp-icon-btn--compact,
body.erp-modern-v2 .erp-opr-scope .qbtn,
body.erp-modern-v2 .erp-opr-scope .less-button_Opr,
body.erp-modern-v2 .erp-opr-scope .erp-icon-btn--compact {
  background: linear-gradient(180deg, color-mix(in srgb, var(--primary, #4f7cff) 7%, white 93%), color-mix(in srgb, var(--primary, #4f7cff) 12%, var(--card, #ffffff) 88%)) !important;
  border-color: color-mix(in srgb, var(--primary, #4f7cff) 18%, rgba(15, 23, 42, .12)) !important;
  color: var(--erp-btn-soft-text) !important;
}

/* Untyped helper/action buttons */
body.erp-modern-v2 .btn-tool,
body.erp-modern-v2 .erp-pos-button:not(.btn-primary):not(.btn-info):not(.btn-success):not(.btn-warning):not(.btn-danger):not(.btn-secondary):not(.btn-dark),
body.erp-modern-v2 .erp-keypad-button:not(.btn-primary):not(.btn-info):not(.btn-success):not(.btn-warning):not(.btn-danger):not(.btn-secondary):not(.btn-dark) {
  background: linear-gradient(180deg, color-mix(in srgb, var(--erp-btn-ghost-fill) 88%, white 12%), var(--erp-btn-ghost-fill)) !important;
  color: var(--erp-btn-soft-text) !important;
  border-color: var(--erp-btn-border-soft) !important;
}

body.erp-modern-v2 .btn-tool:hover,
body.erp-modern-v2 .erp-pos-button:not(.btn-primary):not(.btn-info):not(.btn-success):not(.btn-warning):not(.btn-danger):not(.btn-secondary):not(.btn-dark):hover,
body.erp-modern-v2 .erp-keypad-button:not(.btn-primary):not(.btn-info):not(.btn-success):not(.btn-warning):not(.btn-danger):not(.btn-secondary):not(.btn-dark):hover {
  background: linear-gradient(180deg, color-mix(in srgb, var(--primary, #4f7cff) 8%, white 92%), color-mix(in srgb, var(--primary, #4f7cff) 12%, var(--card, #ffffff) 88%)) !important;
  border-color: color-mix(in srgb, var(--primary, #4f7cff) 22%, rgba(15, 23, 42, .12)) !important;
}

body.erp-modern-v2 .te-btn.primary {
  background: linear-gradient(180deg, color-mix(in srgb, var(--erp-btn-primary-fill) 88%, white 12%), var(--erp-btn-primary-fill)) !important;
  color: var(--erp-btn-solid-text) !important;
  border-color: color-mix(in srgb, var(--erp-btn-primary-fill) 84%, rgba(15, 23, 42, .16)) !important;
}
