#container_pictures {
  display: flex;
  align-items: flex-start;       /* Align images to the top */
  width: 42.5%;
  padding: 5px;
  gap: 3%;                       /* Space between side thumbnails and main image */
  height: 100vh;                 /* Tall container for product pictures */
}

#other_picture {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 80vh;
  width: 12%;
  align-items: center;
  padding: 5px;
  position: sticky;              /* Thumbnails stay visible on scroll */
  top: 220px;                    /* Vertical offset for the sticky */
  align-self: flex-start;
}

.container_other {
  width: 100%;
  height: 9vh;
  background-color: #e2d8c5;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 5px;
  border: 1px solid white;
  padding: 5px;
}

/* Thumbnail hover zoom */
.container_other:hover .other_pict {
  transform: scale(1.15);
}

.other_pict {
  width: auto;
  height: 95%;
  cursor: pointer;
  transition: transform 0.5s ease;
}


/* ---------------- MAIN CENTER IMAGE ---------------- */

#product_fiche {
  position: sticky;              /* Main picture stays fixed while scrolling */
  top: 20svh;                    /* Modern unit based on viewport safe-area */
  align-self: flex-start;
  height: 80vh;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}

#pict_center {
  width: auto;
  height: 85%;
}


/* ---------------- MEDIA QUERIES ---------------- */

@media (max-width: 1366px){
  #other_picture{
    top:200px;                   /* Slight sticky offset adjustment */
  }
}

@media (max-width: 1280px) and (max-height: 1024px){
  #pict_center{
    width: 100%;
    height:auto;
  }
  #product_fiche{
    height: auto;
    align-items: start;
  }
  #container_pictures{
    height:60vh;
  }
}

@media (max-width: 1280px) and (max-height: 960px){
  #pict_center{
    height:70%;
  }
  #container_pictures{
    height:60vh;
  }
}

@media (max-width: 1280px) and (max-height: 800px){
  #pict_center{
    height:80%;
  }
  #container_pictures{
    height:90vh;
  }
}

@media (max-width: 1280px) and (max-height: 720px){
  #pict_center{
    height:auto;
    width: 100%;
  }
}

@media (max-width: 1176px){
  #other_picture{
    width: 80px;                 /* Smaller thumbnail column */
  }
  #pict_center{
    width: 100%;
    height: auto;
  }
  #product_fiche{
    height: auto;
    align-items: start;
  }
  #container_pictures{
    height:100vh;
  }
}

@media (max-width: 1152px){
  #container_pictures{
    height:90vh;
  }
  #pict_center{
    width: 120%;
    height: auto;
  }
}

@media (max-width: 800px){
  #container_pictures{
    width: 40%;
    height:130vh;
  }
  #pict_center{
    width: 130%;
  }
}

@media (max-width: 700px){
  #container_pictures{
    display: none;               /* Hide entire picture section on small mobile */
  }
}