/* Scrollbar personalizzata per ManuOpus.com */
/* Colori coordinati con il tema bianco e blu del sito */

/* Per browser Webkit (Chrome, Safari, Edge) */
::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

::-webkit-scrollbar-track {
  background: #f8f9fa; /* --gray-100 del sito */
  border-radius: 10px;
  border: 1px solid #e9ecef;
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(135deg, #0d6efd 0%, #0a58ca 100%); /* --primary-blue e --dark-blue */
  border-radius: 10px;
  border: 2px solid #f8f9fa;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(135deg, #0a58ca 0%, #074db3 100%); /* Versione più scura per hover */
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
}

::-webkit-scrollbar-thumb:active {
  background: linear-gradient(135deg, #074db3 0%, #063f9a 100%); /* Versione ancora più scura per click */
}

::-webkit-scrollbar-corner {
  background: #f8f9fa;
}

/* Per Firefox */
html {
  scrollbar-width: thin;
  scrollbar-color: #0d6efd #f8f9fa;
}

/* Stile specifico per elementi con overflow scroll */
.custom-scroll,
.overflow-auto,
.overflow-scroll {
  scrollbar-width: thin;
  scrollbar-color: #0d6efd #f8f9fa;
}

.custom-scroll::-webkit-scrollbar,
.overflow-auto::-webkit-scrollbar,
.overflow-scroll::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

.custom-scroll::-webkit-scrollbar-thumb,
.overflow-auto::-webkit-scrollbar-thumb,
.overflow-scroll::-webkit-scrollbar-thumb {
  background: linear-gradient(135deg, #0d6efd 0%, #0a58ca 100%);
  border-radius: 6px;
  border: 1px solid #f8f9fa;
}

/* Animazione smooth per la transizione */
::-webkit-scrollbar-thumb {
  transition: background 0.3s ease, box-shadow 0.3s ease;
}

/* Media query per dispositivi touch */
@media (hover: none) and (pointer: coarse) {
  ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }

  ::-webkit-scrollbar-thumb {
    border-radius: 6px;
    border: 1px solid #f8f9fa;
  }
}

/* Stile per scrollbar sottili in aree specifiche */
.thin-scroll::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.thin-scroll::-webkit-scrollbar-thumb {
  background: #0d6efd;
  border-radius: 4px;
  border: none;
}

.thin-scroll::-webkit-scrollbar-track {
  background: #e9ecef;
  border-radius: 4px;
  border: none;
}