.ion-attachments-archive {
  display: grid;
  align-items: start;
  column-gap: 96px;
  row-gap: 24px;
  grid-template-columns: repeat(2, 1fr);
}

.ion-attachments-archive-product {
  display: flex;
  gap: 24px;
  align-items: center;
}

.ion-attachments-archive-image {
  width: 33.33%;
}

.ion-attachments-archive-image img {
  transition: transform 0.3s ease;
  width: 100%;
  height: 100% !important;
  object-fit: contain;
  aspect-ratio: 1/1;
}

.ion-attachments-archive-image:hover img {
  transform: scale(1.05);
}

.ion-attachments-archive-content {
  width: 66.66%;
}

.ion-attachments-archive-sku {
  color: #656565;
  margin-bottom: 10px;
}

.ion-attachments-archive-attachments {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ion-attachments-archive-attachments .ion-attachments-link:hover {
  color: var(--mfn-woo-themecolor);
  text-decoration: none;
}

.ion-attachments-archive-attachments .ion-attachments-link:hover strong {
  text-decoration: underline;
}

.ion-attachments-archive-attachments .ion-attachments-link::before {
  font-family: 'Font Awesome 5 Free';
  color: var(--mfn-woo-themecolor); 
  font-weight: 900;
  margin-right: 8px;
}

.ion-attachments-archive-attachments .ion-attachments-link--manual::before {
  content: '\f46d';
}

.ion-attachments-archive-attachments .ion-attachments-link--datasheet::before {
  content: '\f7d9';
}

/* Mobile & Tablet Responsive */
@media only screen and (max-width: 1024px) {
  .ion-attachments-archive {
    grid-template-columns: repeat(1, 1fr);
    column-gap: 48px;
    row-gap: 48px;
  }

  .ion-attachments-archive-image {
    width: 25%;
  }

  .ion-attachments-archive-content {
    width: 75%;
  }
}