/**
 * Global Scrollbar Styles
 * Apply scrollbar styling to elements with .scrollbar-gray or .scrollbar-blue class
 */

/* Gray Scrollbar */
.scrollbar-gray::-webkit-scrollbar {
  width: 5px !important;
}

.scrollbar-gray::-webkit-scrollbar-track {
  background: #f0f0f0 !important;
  border-radius: 100px !important;
  box-sizing: content-box !important;
  width: 5px !important;
}

.scrollbar-gray::-webkit-scrollbar-thumb {
  background: #888888 !important;
  border-radius: 100px !important;
}

/* Ensure parent containers don't clip dropdown overflow */
.scrollbar-gray {
  overflow-x: visible !important;
}

.scrollbar-gray [data-more-actions-dropdown] {
  z-index: 50 !important;
}

/* Blue Scrollbar (for category menus) */
.scrollbar-blue::-webkit-scrollbar {
  width: 5px !important;
}

.scrollbar-blue::-webkit-scrollbar-track {
  background: #B2C8F2 !important;
  border-radius: 100px !important;
  box-sizing: content-box !important;
  width: 5px !important;
}

.scrollbar-blue::-webkit-scrollbar-thumb {
  background: #0F52D4 !important;
  border-radius: 100px !important;
}

/* Blue Scrollbar (for category menus) */
.scrollbar-blue-wide::-webkit-scrollbar {
  width: 8px !important;
}

.scrollbar-blue-wide::-webkit-scrollbar-track {
  background: #B2C8F2 !important;
  border-radius: 100px !important;
  box-sizing: content-box !important;
  width: 8px !important;
}

.scrollbar-blue-wide::-webkit-scrollbar-thumb {
  background: #0F52D4 !important;
  border-radius: 100px !important;
}
