/*=================================================================================
КАСТОМНЫЙ СКРОЛЛБАР - BASE__SCROLLBAR
=================================================================================*/

/* ==================== БАЗОВЫЕ СТИЛИ СКРОЛЛБАРА ==================== */

/* Общие стили для всех скроллбаров */
.base__scrollbar-custom,
.base__scrollbar-custom *,
* {
  scrollbar-width: thin;
  scrollbar-color: #6366f1 rgba(255, 255, 255, 0.05);
}

/* Webkit стили для всех скроллбаров */
.base__scrollbar-custom::-webkit-scrollbar,
*::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

.base__scrollbar-custom::-webkit-scrollbar-track,
*::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 10px;
}

.base__scrollbar-custom::-webkit-scrollbar-thumb,
*::-webkit-scrollbar-thumb {
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
  border-radius: 10px;
  transition: all 0.3s ease;
}

.base__scrollbar-custom::-webkit-scrollbar-thumb:hover,
*::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(135deg, #5b5bf6, #9333ea);
  box-shadow: 0 0 10px rgba(99, 102, 241, 0.3);
}

.base__scrollbar-custom::-webkit-scrollbar-corner,
*::-webkit-scrollbar-corner {
  background: rgba(255, 255, 255, 0.05);
}

/* ==================== ТОНКИЙ СКРОЛЛБАР ДЛЯ ЧАТОВ И МАЛЕНЬКИХ БЛОКОВ ==================== */

.base__scrollbar-thin {
  scrollbar-width: thin;
  scrollbar-color: #6366f1 rgba(255, 255, 255, 0.05);
}

.base__scrollbar-thin::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.base__scrollbar-thin::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 8px;
  margin: 5px 0;
}

.base__scrollbar-thin::-webkit-scrollbar-thumb {
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
  border-radius: 8px;
  transition: all 0.3s ease;
}

.base__scrollbar-thin::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(135deg, #5b5bf6, #9333ea);
  box-shadow: 0 0 8px rgba(99, 102, 241, 0.4);
}

.base__scrollbar-thin::-webkit-scrollbar-corner {
  background: rgba(255, 255, 255, 0.05);
}

/* ==================== СКРЫТЫЙ СКРОЛЛБАР ==================== */

.base__scrollbar-hidden {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.base__scrollbar-hidden::-webkit-scrollbar {
  display: none;
}

/* ==================== СКРОЛЛБАР ДЛЯ НАВИГАЦИИ ==================== */

.base__nav-scrollbar {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.base__nav-scrollbar::-webkit-scrollbar {
  display: none;
}

/* ==================== СПЕЦИАЛЬНЫЕ ЦВЕТОВЫЕ СХЕМЫ ==================== */

/* Золотой скроллбар */
.base__scrollbar-gold {
  scrollbar-width: thin;
  scrollbar-color: #ffd700 rgba(255, 215, 0, 0.1);
}

.base__scrollbar-gold::-webkit-scrollbar-thumb {
  background: linear-gradient(135deg, #ffd700, #ffb347);
}

.base__scrollbar-gold::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(135deg, #ffed4e, #ffa500);
  box-shadow: 0 0 10px rgba(255, 215, 0, 0.4);
}

/* Зеленый скроллбар */
.base__scrollbar-green {
  scrollbar-width: thin;
  scrollbar-color: #10b981 rgba(16, 185, 129, 0.1);
}

.base__scrollbar-green::-webkit-scrollbar-thumb {
  background: linear-gradient(135deg, #10b981, #059669);
}

.base__scrollbar-green::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(135deg, #34d399, #047857);
  box-shadow: 0 0 10px rgba(16, 185, 129, 0.4);
}

/* Красный скроллбар */
.base__scrollbar-red {
  scrollbar-width: thin;
  scrollbar-color: #ef4444 rgba(239, 68, 68, 0.1);
}

.base__scrollbar-red::-webkit-scrollbar-thumb {
  background: linear-gradient(135deg, #ef4444, #dc2626);
}

.base__scrollbar-red::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(135deg, #f87171, #b91c1c);
  box-shadow: 0 0 10px rgba(239, 68, 68, 0.4);
}

/* ==================== АДАПТИВНОСТЬ ==================== */

@media (max-width: 768px) {
  .base__scrollbar-custom::-webkit-scrollbar,
  *::-webkit-scrollbar {
    width: 6px;
    height: 6px;
  }
  
  .base__scrollbar-thin::-webkit-scrollbar {
    width: 4px;
    height: 4px;
  }
}

/* ==================== ВЫСОКИЙ КОНТРАСТ ДЛЯ ACCESSIBILITY ==================== */

@media (prefers-contrast: high) {
  .base__scrollbar-custom::-webkit-scrollbar-thumb,
  *::-webkit-scrollbar-thumb {
    background: #ffffff;
  }
  
  .base__scrollbar-custom::-webkit-scrollbar-track,
  *::-webkit-scrollbar-track {
    background: #000000;
  }
}

/* ==================== ТЕМНАЯ ТЕМА ==================== */

@media (prefers-color-scheme: dark) {
  .base__scrollbar-custom::-webkit-scrollbar-track,
  *::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.2);
  }
  
  .base__scrollbar-custom::-webkit-scrollbar-corner,
  *::-webkit-scrollbar-corner {
    background: rgba(0, 0, 0, 0.2);
  }
}
