/* UI-only treatment for regular user-facing pages.
   Scrolling remains enabled with a slim, rounded scrollbar. */
html,
body,
body * {
  scrollbar-width: thin;
  scrollbar-color: rgb(100 116 139 / 55%) transparent;
  -ms-overflow-style: auto;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
body *::-webkit-scrollbar {
  width: 8px;
  height: 8px;
  background: transparent;
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb,
body *::-webkit-scrollbar-thumb {
  min-height: 34px;
  border: 2px solid transparent;
  border-radius: 999px;
  background: rgb(100 116 139 / 55%);
  background-clip: padding-box;
}

html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover,
body *::-webkit-scrollbar-thumb:hover {
  background: rgb(71 85 105 / 72%);
  background-clip: padding-box;
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track,
body *::-webkit-scrollbar-track {
  background: transparent;
}

/* These desktop regions have page-specific scrollbar rules elsewhere.
   Keep the same compact treatment without touching any admin stylesheet. */
body .sidebar,
body .model-card-grid,
body .ai-messages,
body .chat-messages,
body .conversation-list {
  scrollbar-width: thin;
  scrollbar-color: rgb(100 116 139 / 55%) transparent;
}

body .sidebar::-webkit-scrollbar,
body .model-card-grid::-webkit-scrollbar,
body .ai-messages::-webkit-scrollbar,
body .chat-messages::-webkit-scrollbar,
body .conversation-list::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

body .sidebar::-webkit-scrollbar-thumb,
body .model-card-grid::-webkit-scrollbar-thumb,
body .ai-messages::-webkit-scrollbar-thumb,
body .chat-messages::-webkit-scrollbar-thumb,
body .conversation-list::-webkit-scrollbar-thumb {
  min-height: 34px;
  border: 2px solid transparent;
  border-radius: 999px;
  background: rgb(100 116 139 / 55%);
  background-clip: padding-box;
}

body .sidebar::-webkit-scrollbar-thumb:hover,
body .model-card-grid::-webkit-scrollbar-thumb:hover,
body .ai-messages::-webkit-scrollbar-thumb:hover,
body .chat-messages::-webkit-scrollbar-thumb:hover,
body .conversation-list::-webkit-scrollbar-thumb:hover {
  background: rgb(71 85 105 / 72%);
  background-clip: padding-box;
}
