/* Default (all screens) */
.donation-details {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-height 0.3s ease, opacity 0.3s ease;
}

.donation-details.open {
  max-height: 999px;
  opacity: 1;
}

/* Mobile adjustments */
@media (max-width: 640px) {
  .donation-details {
    /* Don’t hide completely, just let animation still work */
    overflow: hidden;
    transition: max-height 0.3s ease, opacity 0.3s ease;
  }

  .donation-details.open {
    max-height: 999px;
    opacity: 1;
  }
}

/* Donation card styling */
.donation-card {
  cursor: pointer;
  transition: box-shadow 0.2s ease;
}

.donation-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

/* Toggle button link style */
.toggle-details {
  background: none;
  border: none;
  padding: 0;
  font: inherit;
  color: #4338ca; /* Tailwind indigo-700 */
  cursor: pointer;
  text-decoration: underline;
}
.toggle-details:hover {
  color: #3730a3; /* Tailwind indigo-800 */
}