Fixed carousel buttons not visible on dark image (black) and opening attachment from the inbox cropinf the image

frontend/src/components/inbox/components/AttachmentViewerForm.tsx

@@ -23,7 +23,7 @@ export const AttachmentViewerForm: FC<
     <Wrapper {...WrapperProps}>
       {/* eslint-disable-next-line @next/next/no-img-element */}
       <img
-        width="auto"
+        width="100%"
         height={800}
         style={{
           cursor: "pointer",

frontend/src/components/inbox/components/Carousel.tsx

@@ -30,7 +30,7 @@ import {
 
 const CARD_WIDTH = 300;
 const StyledIconButton = styled(IconButton)({
-  opacity: 0.1,
+  opacity: 0.2,
   zIndex: 9999,
   position: "absolute",
   top: "50%",
@@ -38,7 +38,9 @@ const StyledIconButton = styled(IconButton)({
   transition: "all 0.1s",
   ".carousel-wrapper:hover &": {
     opacity: 1,
+    backgroundColor: "#fff"
   },
+  backgroundColor: "#fff"
 });
 const StyledCarouselDiv = styled("div")({
   display: "flex",