/* Reset any border-radius for gallery elements */
.gallery-item,
.gallery-item *,
.gallery-item img,
.rectangular-image,
#modalImage,
.modal-content,
.modal-body,
img.img-fluid.rectangular-image,
.gallery-item > img,
.modal-body > img,
img#modalImage {
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  overflow: hidden;
}

.gallery-container {
  margin-top: 20px;
}

/* Center the items in the last row */
.row.gallery-container {
  justify-content: center !important;
}

.gallery-item {
  overflow: hidden;
  border-radius: 0;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
  cursor: pointer;
  height: 250px;
  position: relative;
  margin-bottom: 24px;
}

/* Specific class to ensure rectangular images */
.rectangular-image {
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
}

.gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
  border-radius: 0; /* Force no rounded corners on images */
}

/* Ensure Bootstrap img-fluid doesn't add rounded corners */
.img-fluid {
  border-radius: 0;
}

.gallery-item:hover img {
  transform: scale(1.05);
}

.modal-content {
  background-color: transparent;
  border: none;
  border-radius: 0 !important;
}

.modal-body {
  padding: 0;
  border-radius: 0 !important;
}

#modalImage {
  border-radius: 0 !important;
}

.btn-close {
  z-index: 9999;
  opacity: 0.8;
}

.btn-close:hover {
  opacity: 1;
}