/* Global Scrollbar Styles */
/* Light Mode Scrollbars */
:root {
  --scrollbar-track-light: #f1f5f9;
  --scrollbar-thumb-light: #cbd5e1;
  --scrollbar-thumb-hover-light: #94a3b8;
  --scrollbar-track-dark: #1e293b;
  --scrollbar-thumb-dark: #475569;
  --scrollbar-thumb-hover-dark: #64748b;
}

/* Default Light Mode */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--scrollbar-thumb-light) var(--scrollbar-track-light);
}

*::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

*::-webkit-scrollbar-track {
  background: var(--scrollbar-track-light);
  border-radius: 4px;
}

*::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb-light);
  border-radius: 4px;
  border: 1px solid var(--scrollbar-track-light);
}

*::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover-light);
}

*::-webkit-scrollbar-corner {
  background: var(--scrollbar-track-light);
}

/* Dark Mode Scrollbars */
html.dark,
html.dark body,
html.dark * {
  scrollbar-width: thin !important;
  scrollbar-color: var(--scrollbar-thumb-dark) var(--scrollbar-track-dark) !important;
}

html.dark ::-webkit-scrollbar,
html.dark body::-webkit-scrollbar,
html.dark *::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
}

html.dark ::-webkit-scrollbar-track,
html.dark body::-webkit-scrollbar-track,
html.dark *::-webkit-scrollbar-track {
  background: var(--scrollbar-track-dark) !important;
  border-radius: 4px;
}

html.dark ::-webkit-scrollbar-thumb,
html.dark body::-webkit-scrollbar-thumb,
html.dark *::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb-dark) !important;
  border-radius: 4px;
  border: 1px solid var(--scrollbar-track-dark) !important;
}

html.dark ::-webkit-scrollbar-thumb:hover,
html.dark body::-webkit-scrollbar-thumb:hover,
html.dark *::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover-dark) !important;
}

html.dark ::-webkit-scrollbar-corner,
html.dark body::-webkit-scrollbar-corner,
html.dark *::-webkit-scrollbar-corner {
  background: var(--scrollbar-track-dark) !important;
}