✨ feat(ui): enhance pricing table & filters with responsive button-group, fixed column, scroll tweaks (#1365)

• SelectableButtonGroup
  • Added optional collapsible support with gradient mask & toggle
  • Dynamic tagCount badge support for groups / quota types
  • Switched to responsive Row/Col (`xs 24`, `sm 24`, `lg 12`, `xl 8`) for fluid layout
  • Shows expand button only when item count exceeds visible rows

• Sidebar filters
  • PricingGroups & PricingQuotaTypes now pass tag counts to button-group
  • Counts derived from current models & quota_type

• PricingTableColumns
  • Moved “Availability” column to far right; fixed via `fixed: 'right'`
  • Re-ordered columns and preserved ratio / price logic

• PricingTable
  • Added `compactMode` prop; strips fixed columns and sets `scroll={compactMode ? undefined : { x: 'max-content' }}`
  • Processes columns to remove `fixed` in compact mode

• PricingPage & index.css
  • Added `.pricing-scroll-hide` utility to hide Y-axis scrollbar for `Sider` & `Content`

• Responsive / style refinements
  • Sidebar width adjusted to 460px
  • Scrollbars hidden uniformly across pricing modules

These changes complete the model-pricing UI refactor, ensuring clean scrolling, responsive filters, and fixed availability column for better usability.

web/src/components/common/ui/SelectableButtonGroup.jsx

@@ -82,7 +82,7 @@ const SelectableButtonGroup = ({
       {items.map((item) => {
         const isActive = activeValue === item.value;
         return (
-          <Col span={8} key={item.value}>
+          <Col xs={24} sm={24} md={24} lg={12} xl={8} key={item.value}>
             <Button
               onClick={() => onChange(item.value)}
               theme={isActive ? 'solid' : 'outline'}