html, body { overflow-x: hidden; }

  /* -------- Цвета для тем -------- */
  :root{
    /* Светлая тема */
    --scroll-track: rgba(0, 0, 0, 0.06);          /* ~ bg-slate-900/6 */
    --scroll-thumb: rgba(99, 102, 241, 0.45);     /* indigo-500/45 */
    --scroll-thumb-hover: rgba(99, 102, 241, 0.70);
    --scroll-corner: transparent;
  }
  html.dark{
    /* Тёмная тема */
    --scroll-track: rgba(255, 255, 255, 0.08);    /* ~ white/8 */
    --scroll-thumb: rgba(99, 102, 241, 0.50);     /* indigo-500/50 */
    --scroll-thumb-hover: rgba(99, 102, 241, 0.75);
    --scroll-corner: transparent;
  }





/* /public/assets/css/custom.css */
a[href] { cursor: pointer; }

button:not(:disabled),
[role="button"]:not([aria-disabled="true"]) { cursor: pointer; }

button:disabled,
[aria-disabled="true"] { cursor: not-allowed; }







  /* Куда применяем «красивый скролл» */
  body,
  main,
  #appSidebar nav,
  .overflow-x-auto{
    /* Firefox */
    scrollbar-width: thin;
    scrollbar-color: var(--scroll-thumb) var(--scroll-track);
    /* iOS инерция */
    -webkit-overflow-scrolling: touch;
  }

  /* WebKit: общий трек/ползунок */
  body::-webkit-scrollbar,
  main::-webkit-scrollbar,
  #appSidebar nav::-webkit-scrollbar,
  .overflow-x-auto::-webkit-scrollbar{
    width: 10px;             /* вертикальный скролл */
    height: 10px;            /* горизонтальный скролл */
  }

  /* узкий вариант на мобильных — ещё ненавязчивее */
  @media (max-width: 1024px){
    body::-webkit-scrollbar,
    main::-webkit-scrollbar,
    #appSidebar nav::-webkit-scrollbar,
    .overflow-x-auto::-webkit-scrollbar{
      width: 8px;
      height: 8px;
    }
  }

  /* Трек */
  body::-webkit-scrollbar-track,
  main::-webkit-scrollbar-track,
  #appSidebar nav::-webkit-scrollbar-track,
  .overflow-x-auto::-webkit-scrollbar-track{
    background: var(--scroll-track);
    border-radius: 9999px;
  }

  /* Ползунок */
  body::-webkit-scrollbar-thumb,
  main::-webkit-scrollbar-thumb,
  #appSidebar nav::-webkit-scrollbar-thumb,
  .overflow-x-auto::-webkit-scrollbar-thumb{
    background: var(--scroll-thumb);
    border-radius: 9999px;
    /* «воздушный» вид: прозрачная окантовка даёт отступ внутри трека */
    border: 3px solid transparent;
    background-clip: padding-box;
  }

  /* Hover/Active — немного ярче, но всё ещё деликатно */
  body::-webkit-scrollbar-thumb:hover,
  main::-webkit-scrollbar-thumb:hover,
  #appSidebar nav::-webkit-scrollbar-thumb:hover,
  .overflow-x-auto::-webkit-scrollbar-thumb:hover{
    background: var(--scroll-thumb-hover);
    background-clip: padding-box;
  }
  body::-webkit-scrollbar-thumb:active,
  main::-webkit-scrollbar-thumb:active,
  #appSidebar nav::-webkit-scrollbar-thumb:active,
  .overflow-x-auto::-webkit-scrollbar-thumb:active{
    background: var(--scroll-thumb-hover);
    background-clip: padding-box;
  }

  /* Угол (когда и вертикальный, и горизонтальный вместе) */
  body::-webkit-scrollbar-corner,
  main::-webkit-scrollbar-corner,
  #appSidebar nav::-webkit-scrollbar-corner,
  .overflow-x-auto::-webkit-scrollbar-corner{
    background: var(--scroll-corner);
  }

  /* На оверлее и прочих «служебных» слоях скролл не нужен */
  #sidebarOverlay{
    scrollbar-width: none;
  }
  #sidebarOverlay::-webkit-scrollbar{ display: none; }