/* =====================================================
   Nano Banana 이미지 비율 수정 - 이미지 전체 표시
   ===================================================== */

/* 프리뷰 카드 미디어 영역 - overflow 제거하여 이미지 전체 표시 */
.nano-preview-card-media {
  overflow: visible !important;
  aspect-ratio: 3/2 !important;
  min-height: unset !important;
  max-height: unset !important;
  padding: 1rem !important;
}

/* 컴팩트 카드 미디어 영역 - overflow 제거하여 이미지 전체 표시 */
.nano-card--compact .nano-card-media {
  overflow: visible !important;
  height: unset !important;
  aspect-ratio: 4/3 !important;
  padding: 0.5rem !important;
}

/* 데일리 프롬프트 이미지 - 전체 표시 */
.nano-daily-image {
  overflow: visible !important;
}

.nano-daily-image img {
  max-height: none !important;
  height: auto !important;
  width: 100% !important;
  object-fit: contain !important;
}

/* 전체 프롬프트 그리드 카드 - overflow 제거 */
.nano-grid-card {
  overflow: visible !important;
}

.nano-grid-card-media {
  overflow: visible !important;
  height: unset !important;
  aspect-ratio: 4/3 !important;
  padding: 0.75rem !important;
}

/* 모든 nano-banana 이미지에 대해 전체 표시 보장 */
.nano-preview-card-media img,
.nano-card-media img,
.nano-grid-card-media img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  max-width: 100% !important;
  max-height: 100% !important;
}

/* 반응형 디자인 - 모바일에서도 이미지 전체 표시 */
@media (max-width: 768px) {
  .nano-preview-card-media {
    aspect-ratio: 16/10 !important;
    padding: 0.75rem !important;
  }

  .nano-card--compact .nano-card-media {
    aspect-ratio: 3/2 !important;
    padding: 0.4rem !important;
  }

  .nano-grid-card-media {
    aspect-ratio: 3/2 !important;
    padding: 0.5rem !important;
  }

  .nano-daily-image img {
    max-height: none !important;
  }
}

@media (max-width: 480px) {
  .nano-preview-card-media {
    aspect-ratio: 4/3 !important;
    padding: 0.5rem !important;
  }

  .nano-card--compact .nano-card-media {
    aspect-ratio: 1/1 !important;
    padding: 0.3rem !important;
  }

  .nano-grid-card-media {
    aspect-ratio: 1/1 !important;
    padding: 0.4rem !important;
  }
}

/* 이미지 로딩 중 레이아웃 유지 */
.nano-preview-card-media:not(:has(img)),
.nano-card-media:not(:has(img)),
.nano-grid-card-media:not(:has(img)) {
  min-height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 카드 내부 패딩 조정으로 이미지 공간 확보 */
.nano-card--compact {
  padding-bottom: 0 !important;
}

.nano-grid-card {
  padding-bottom: 0 !important;
}