
.img-fluid {
  max-width: 100%;
  height: auto;
  display: block;
  border-radius: 0.5rem;
}
.gallery-item {
  transition: opacity 0.3s ease;
}

.gallery-item:hover {
  opacity: 0.75;
}
.gallery-tab {
  display: flex;
  flex-direction: row;
}

.gallery-tab .nav-link {
  position: relative;
  transition: color 0.3s ease;
  color: #8E8E8E;
}

.gallery-tab .nav-link.active {
  color: #000;
  font-weight: 700;
}


.gallery-tab .nav-link.active::after,
.gallery-tab .nav-link:hover::after {
  width: 100%;
}

@media (min-width: 720px) {
  .gallery-tab {
    flex-direction: column;
  }
  
  .gallery-tab .nav-link {
    transform: rotate(180deg);
    writing-mode: vertical-lr;
    text-orientation: mixed;
    padding: 1rem 0;
  }

  .gallery-tab .nav-link::after {
    top: 0; left: 0;
    width: 2px; height: 0%;
  }

  .gallery-tab .nav-link.active::after,
  .gallery-tab .nav-link:hover::after {
    width: 1px;
    height: 100%;
  }
}

.glightbox-clean .gslide-description {
  background: transparent !important;
}

.glightbox-clean .gslide-description .gdesc-inner {
  text-align: center;
}

.glightbox-clean .gslide-title {
  color: #fff !important;
  font-weight: bold !important;
  font-size: 1.2rem !important;
}

@media (min-width: 720px) {
  .d-md-block { display: block !important; }
  .position-md-absolute { position: absolute !important; }
}


.gallery-item {
  transition: opacity 0.3s ease;
}

.gallery-item:hover {
  opacity: 0.75;
}

.gallery-tab {
  display: flex;
  flex-direction: row; 
}

.gallery-tab .nav-link {
  position: relative;
  transition: color 0.3s ease;
  color: #8E8E8E;
  text-decoration: none;
  font-weight: 700;
}

.gallery-tab .nav-link::after {
  content: "";
  position: absolute;
  background-color: #c1ff72;
  transition: all 1.3s ease;
  top: 100%; left: 0;
  width: 5%; height: 10%;
}

.gallery-tab .nav-link.active::after,
.gallery-tab .nav-link:hover::after {
  width: 100%;
}

@media (min-width: 720px) {
  .gallery-tab {
    flex-direction: column; /* Masaüstü: Alt alta/Dikey */
  }
  
  .gallery-tab .nav-link {
    transform: rotate(180deg);
    writing-mode: vertical-lr; /* Dikey yazı modu */
    text-orientation: mixed;
    padding: 1rem 0;
  }

  .gallery-tab .nav-link::after {
    top: 0; left: 0;
    width: 2px; height: 0%;
  }

  .gallery-tab .nav-link.active::after,
  .gallery-tab .nav-link:hover::after {
    width: 2px;
    height: 100%;
  }
}
