/* toutes les pages */

body{
  /* theme ete
  background-color: #000000;
  background-size: 12px 12px;
  background-image: repeating-linear-gradient(45deg, #0b1f43 0, #0b1f43 1.2000000000000002px, #000000 0, #000000 50%);*/
  /* theme ete (old) 
  background-color: #000000;
  background-image: linear-gradient(to right, #0d132a, #0d132a 7px, #000000 7px, #000000 );
  background-size: 14px 100%;
  */
  /* theme basique 
  background-color: #000411;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3E%3Cg fill='%231f2329' fill-opacity='0.4'%3E%3Cpath fill-rule='evenodd' d='M0 0h4v4H0V0zm4 4h4v4H4V4z'/%3E%3C/g%3E%3C/svg%3E");
  */
  
  /* theme new (+ logique avec barre nav et pas de bug) */
  background-color: #000000;
  background-size: 18px 18px;
  background-image:  repeating-linear-gradient(to right, #001e33, #001e33 0.9px, #000000 0.9px, #000000);


  user-select:none;
  -moz-user-select:none;
  -webkit-user-select:none;
  -webkit-touch-callout:none;
  -ms-user-select: none;
}
html, body {
  overflow-x:hidden;
} 
img {
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
}
/*style pour scrollbar general*/
::-webkit-scrollbar {
  width: 14px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background: linear-gradient(90deg, rgba(0,0,0,0.41990563315169815) 100%, rgba(12, 74, 110, 1) 100%, rgba(0,212,255,1) 100%);
}
::-webkit-scrollbar-thumb {
  background: #0c4a6e; 
  border-radius: 6px;
}
::-webkit-scrollbar-thumb:hover {
  background: #3d63b8;
}
/*style pour scrollbar scrollBarStyled*/
.scrollBarStyled::-webkit-scrollbar {
  width: 5px;
  height: 10px;
}
.scrollBarStyled::-webkit-scrollbar-track {
  background: linear-gradient(90deg, rgba(0,0,0,0.41990563315169815) 100%, rgba(12, 74, 110, 1) 100%, rgba(0,212,255,1) 100%);
}
.scrollBarStyled::-webkit-scrollbar-thumb {
  background: #0c4a6e; 
  border-radius: 6px;
}
.scrollBarStyled::-webkit-scrollbar-thumb:hover {
  background: #3d63b8;
}


/* catalogue */
#list_types, #list_langues, #list_genres {
  max-height: 0; /* Cache les listes */
  opacity: 0;
  transform: translateY(-20px);
  pointer-events: none;
  transition: opacity 0.3s ease, transform 0.3s ease, max-height 0.3s ease;
  overflow: hidden;
}

#list_types.open, #list_langues.open, #list_genres.open {
  max-height: 4000px; /* Ajustez cette valeur selon le contenu de vos listes */
  opacity: 1;
  transform: translateY(0);
  pointer-events: all;
}

.transition-transform {
  transition: transform 0.3s ease;
}

#iconTypes.open, #iconLangues.open, #iconGenres.open {
  transform: rotate(180deg);
}


/* scroll avec grab planning et accueil */
.drag-grabScroll {
  cursor: grab;
  overflow-x: auto;
  white-space: nowrap;
}
.grabScroll {
  cursor: grabbing;
}


/* cartes horizontale comme catalogue */
@media screen and (max-width: 768px){.imageCarteHorizontale{width:130px; height:145px;}}
@media screen and (min-width: 768px){.imageCarteHorizontale{width:190px; height:145px;}}
@media screen and (max-width: 768px){.infoCarteHorizontale{width:150px;}}
@media screen and (min-width: 768px){.infoCarteHorizontale{width:200px;}}




#scrollProgressWrapper {
position: fixed;
bottom: 0;
right: 0;
margin: 1.75rem; /* équivaut à Tailwind m-7 */
z-index: 300;
width: 60px;
height: 60px;
}

#scrollProgressSvg {
position: absolute;
top: 0;
left: 0;
width: 60px;
height: 60px;
}

#topBtn {
width: 60px;
height: 60px;
display: flex;
align-items: center;
justify-content: center;
}



/* ///////////////////////////////////////////////TAILWIND BONUS/////////////////////////////////////////////////// */