From 9b57e0846edc13bf03dab487fef5cc734939496b Mon Sep 17 00:00:00 2001
From: M_Kececi <you@example.com>
Date: Fri, 19 Jun 2026 00:59:02 +0300
Subject: [PATCH] Merge remote-tracking branch 'origin/master'

---
 ui/src/pages/OrderPriceList.vue | 59 ++++++++++++++++++++++++++++-----
 1 file changed, 51 insertions(+), 8 deletions(-)

diff --git a/ui/src/pages/OrderPriceList.vue b/ui/src/pages/OrderPriceList.vue
index bc001f7..1e2200f 100644
--- a/ui/src/pages/OrderPriceList.vue
+++ b/ui/src/pages/OrderPriceList.vue
@@ -1503,9 +1503,15 @@ onMounted(() => {
 }
 
 .top-bar {
+  position: sticky;
+  top: 0;
+  z-index: 60;
   flex-wrap: wrap;
   align-items: flex-start;
   gap: 8px;
+  background: #fff;
+  padding-top: 2px;
+  padding-bottom: 4px;
 }
 
 .top-actions-row--filters,
@@ -1550,6 +1556,7 @@ onMounted(() => {
   border-radius: 4px;
   display: flex;
   flex-direction: column;
+  --top-scroll-height: 22px;
 }
 
 .product-thumb {
@@ -1575,16 +1582,32 @@ onMounted(() => {
 }
 
 .top-x-scroll {
-  flex: 0 0 14px;
-  height: 14px;
+  flex: 0 0 var(--top-scroll-height);
+  height: var(--top-scroll-height);
   overflow-x: auto;
   overflow-y: hidden;
-  background: #fff;
-  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
+  background: #f8fafc;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.14);
+  scrollbar-gutter: stable;
+  z-index: 20;
 }
 
 .top-x-scroll-inner {
-  height: 1px;
+  height: 18px;
+}
+
+.top-x-scroll::-webkit-scrollbar {
+  height: 14px;
+}
+
+.top-x-scroll::-webkit-scrollbar-track {
+  background: #edf1f5;
+}
+
+.top-x-scroll::-webkit-scrollbar-thumb {
+  background: rgba(25, 118, 210, 0.42);
+  border: 3px solid #edf1f5;
+  border-radius: 999px;
 }
 
 .pane-table {
@@ -1593,9 +1616,9 @@ onMounted(() => {
 }
 
 .pricing-table :deep(.q-table__middle) {
-  height: calc(var(--pricing-table-height) - 14px);
-  min-height: calc(var(--pricing-table-height) - 14px);
-  max-height: calc(var(--pricing-table-height) - 14px);
+  height: calc(var(--pricing-table-height) - var(--top-scroll-height));
+  min-height: calc(var(--pricing-table-height) - var(--top-scroll-height));
+  max-height: calc(var(--pricing-table-height) - var(--top-scroll-height));
   overflow: auto !important;
   scrollbar-gutter: stable both-edges;
   overscroll-behavior: contain;
@@ -1603,6 +1626,19 @@ onMounted(() => {
 
 .pricing-table :deep(.q-table) {
   width: max-content;
+  min-width: 100%;
+  table-layout: fixed;
+  font-size: 11px;
+  border-collapse: separate;
+  border-spacing: 0;
+  margin-right: var(--sticky-scroll-comp, 0px);
+}
+
+.pricing-table :deep(.q-table__container) {
+  border: none !important;
+  box-shadow: none !important;
+  background: transparent !important;
+  height: 100% !important;
 }
 
 .pricing-table :deep(td),
@@ -1615,6 +1651,13 @@ onMounted(() => {
   border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
 }
 
+.pricing-table :deep(td > div),
+.pricing-table :deep(td > .q-td) {
+  height: 100% !important;
+  display: flex !important;
+  align-items: center !important;
+}
+
 .pricing-table :deep(td) {
   overflow: hidden !important;
   text-overflow: ellipsis;