/* Scrollbar styles for dark mode */
@media (prefers-color-scheme: dark) {
  /* Webkit browsers (Chrome, Safari, Edge) */
  ::-webkit-scrollbar {
    width: 12px;
    height: 12px;
  }

  ::-webkit-scrollbar-track {
    background: transparent;
  }

  ::-webkit-scrollbar-thumb {
    background: #404040;
    border-radius: 6px;
    border: 2px solid transparent;
    background-clip: padding-box;
  }

  ::-webkit-scrollbar-thumb:hover {
    background: #525252;
    border: 2px solid transparent;
    background-clip: padding-box;
  }

  /* Firefox */
  * {
    scrollbar-width: thin;
    scrollbar-color: #404040 transparent;
  }
}

/* Scrollbar styles for light mode */
@media (prefers-color-scheme: light) {
  /* Webkit browsers (Chrome, Safari, Edge) */
  ::-webkit-scrollbar {
    width: 12px;
    height: 12px;
  }

  ::-webkit-scrollbar-track {
    background: transparent;
  }

  ::-webkit-scrollbar-thumb {
    background: #d4d4d4;
    border-radius: 6px;
    border: 2px solid transparent;
    background-clip: padding-box;
  }

  ::-webkit-scrollbar-thumb:hover {
    background: #a3a3a3;
    border: 2px solid transparent;
    background-clip: padding-box;
  }

  /* Firefox */
  * {
    scrollbar-width: thin;
    scrollbar-color: #d4d4d4 transparent;
  }
}
