.profile-listing li.profile-listing-card > :not(.profile-listing-data) img {
    width: 100px;
}
/* Remove background gradient and control opacity shift in Bootstrap 4 */
.carousel-control-prev,
.carousel-control-next {
  background: none !important; /* Removes the dark gradient overlay */
  opacity: 0.7;                /* Optional: Sets a fixed opacity for the arrow icon */
  transition: none;            /* Stops the fade transition effect */
}

/* Maintain identical opacity on hover and focus to prevent flashing */
.carousel-control-prev:hover,
.carousel-control-prev:focus,
.carousel-control-next:hover,
.carousel-control-next:focus {
  background: none !important;
  opacity: 0.7; 
  outline: 0;
}
/* Example for a 16:9 Aspect Ratio */
.proportional-carousel .carousel-inner {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 36.81%; /* 16:9 ratio (9 / 16 = 0.5625) */
}

.proportional-carousel .carousel-item {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.proportional-carousel .carousel-item img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* Ensures image fills container proportionally without distortion */
}