.someclassname {
	background-color: #F2F2F2;
}
/*.modal{
      --bs-modal-width: 640px !important;
    }
 .img-container img { 
  display: block !important; 
  max-width: 100% !important; /* Ensures the image scales to fit the container */ 
 }
  .cropper-container{
  width: auto !important;
}*/


/* Ensure the modal has a fixed width */
#cropperModal .modal-dialog {
  max-width: 670px !important; /* Adjust as needed */
  width: auto !important;
}

/* Ensure the image fits within the modal */
#modalImage {
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  margin: 0 auto !important;
}

/* Style the overlay */
.overlay {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 92% !important;
  height: 100% !important;
  background: rgba(0, 0, 0, 0.5) !important;
  display: none !important;
  justify-content: center !important;
  align-items: center !important;
  color: white !important;
  font-size: 1.5em !important;
  cursor: pointer !important;
}

/* Ensure the crop box fits within the modal */
.cropper-container {
  max-width: 92% !important;
  height: auto !important;
  margin: 0 auto;
}