frontend/src/css/components/cards.css

/* Card Responsive Styles */
.card {
  background: white;
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-md);
  overflow: hidden;
  transition: all var(--transition-normal);
}

.card:hover {
  box-shadow: var(--shadow-lg);
  transform: translateY(-2px);
}

.card-header {
  padding: var(--spacing-6);
  border-bottom: 1px solid var(--color-secondary-200);
}

.card-body {
  padding: var(--spacing-6);
}

.card-footer {
  padding: var(--spacing-6);
  border-top: 1px solid var(--color-secondary-200);
}

@media (max-width: 639px) {
  .card {
    border-radius: var(--radius-lg);
  }
  
  .card-header,
  .card-body,
  .card-footer {
    padding: var(--spacing-4);
  }
}

/* Post text formatting - preserve line breaks and spaces */
.post-text {
  white-space: pre-wrap !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
  line-height: 1.6 !important;
  margin-bottom: 1rem !important;
}

.post-text p {
  margin: 0 0 1rem 0 !important;
}

.post-text p:last-child {
  margin-bottom: 0 !important;
}

/* Ensure textarea preserves formatting */
.post-content-textarea {
  white-space: pre-wrap !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
}

/* Generated content display */
.generated-content {
  white-space: pre-wrap !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
  line-height: 1.6 !important;
}