/* TinyMCE 에디터 내부 스타일 */

/* 기본 폰트 및 타이포그래피 */
body { 
  font-family: "Pretendard", "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Arial, sans-serif;
  font-size: 1rem;
  line-height: 1.1rem;
}
/* 에디팅 시 단락 간 마진 간격 제거 */
body p {
  margin: 0;
}

/* figure 태그는 이미지 너비에 맞춤 */
figure.image,
figure {
  display: block !important;
  margin: 0 !important;
  width: fit-content !important;
  max-width: 100% !important;
}

/* 정렬 클래스에 따른 패딩 */
figure.image.align-left,
figure.align-left {
  padding-right: 1rem !important;
  float:left !important;
}

figure.image.align-right,
figure.align-right {
  padding-left: 0.5rem !important;
  padding-bottom: 0.5rem !important;
  float:right !important;
}

img[style*="float: left"] {
  padding-bottom: 0.5rem !important;
  padding-right: 1.5rem !important;
}

img[style*="float: right"] {
  padding-left: 1.5rem !important;
}
/* figcaption 스타일 - 이미지 너비 내에서 강제 줄바꿈 */
figure figcaption {
  display: block;
  margin-top: 8px;
  font-size: 0.875rem;
  color: #666;
  text-align: center;
  font-style: italic;
  word-break: break-all;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
}

/* 이미지 클래스 (추가 예시) */
.img-rounded,
figure.img-rounded img,
figure.image.img-rounded img {
  border-radius: 12px;
}

.img-shadow,
figure.img-shadow,
figure.image.img-shadow {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
}

@media (max-width: 600px) {
  figure.image.align-left,
  figure.align-left,
  figure.image.align-right,
  figure.align-right {
    float: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
    display: block !important;
    padding: 0% !important;
  }
}

/* 이미지 클래스에 따른 마진 */
.editor-content img[style*="float: left"] {
  margin-right: 0.5rem !important;
  margin-bottom: 0.5rem !important;
  display: block;
}
.editor-content img[style*="float: right"] {
  margin-left: 0.5rem !important;
  margin-bottom: 0.5rem !important;
  display: block;
}
@media (max-width: 600px) {
  .editor-content img[style*="float: left"],
  .editor-content img[style*="float: right"] {
    float: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
    display: block !important;
  }
}