/*==========================================
09-1📌 텍스트 콜아웃 제어 (주석용)*/
/* [1] 파란색 콜아웃을 투명화*/
.notion-callout[class*="blue"] {
  background-color: transparent !important; 
  border: 0px solid transparent !important;  
  border-radius: 12px !important;
  padding: 0px !important;
  color: #37352f !important;
}
/* [2] 글자 크기 제어 (주석용 0.8rem)----- */
.notion-callout[class*="blue"] *,
.notion-callout[class*="blue"] *::before,
.notion-callout[class*="blue"] *::after,
.notion-callout[class*="blue"] p,
.notion-callout[class*="blue"] div,
.notion-callout[class*="blue"] span,
.notion-callout[class*="blue"] li,
.notion-callout[class*="blue"] strong,
.notion-callout[class*="blue"] b {
  font-size: 0.8rem !important;    
  line-height: 1.6 !important;     
}
[class*="blue"] .notion-text-block,
[class*="blue"] [contenteditable="false"] {
  font-size: 0.8rem !important;
}
@media (max-width: 768px) {
  .notion-callout[class*="blue"] *,
  .notion-callout[class*="blue"] p,
  .notion-callout[class*="blue"] span,
  .notion-callout[class*="blue"] li,
  .notion-callout[class*="blue"] strong,
  .notion-callout[class*="blue"] div {
    font-size: 0.75rem !important; 
    line-height: 1.6 !important;
    margin-bottom: 4px !important;
  }
  .notion-callout[class*="blue"] ul, 
  .notion-callout[class*="blue"] ol {
    padding-left: 18px !important;
    margin-top: 8px !important;
  }
  .notion-callout[class*="blue"] {
    padding: 0px !important;
    margin-bottom: -15px !important; 
    width: 100% !important;
  }
}
/*==========================================
09-2📌 콜아웃 텍스트 제어 (상세페이지 적용)
[1] 화이트 박스형/
/*--- 1. 콜아웃 박스 컬러 지정---*/
.notion-callout[class*="brown"],
.notion-callout[class*="gray"] {
    background-color: #ffffff !important; 
    border: 0px solid rgba(0, 0, 0, 0.08) !important;
    border-radius: 12px !important;
    padding: 20px !important;
    color: #37352f !important; 
}
/* 📌 그레이 콜아웃 상하좌우 여백 */
.notion-callout[class*="gray"] {
    padding: 15px 20px 12px 10px !important;
}
/*---2. 콜아웃 텍스트 정렬---*/
/* 브라운/그레이 공통: 너비 확보 */
.notion-callout[class*="brown"] .notion-callout__content,
.notion-callout[class*="gray"] .notion-callout__content {
    margin-left: 0 !important;
    width: 100% !important;
}
/* 브라운만 중앙 정렬 */
.notion-callout[class*="brown"] .notion-callout__content {
    text-align: center !important;
}
/* 그레이만 좌측 정렬 */
.notion-callout[class*="gray"] .notion-callout__content {
    text-align: left !important;
}
/*------[2] 투명 텍스트형 (Green)---------*/
 .notion-callout[class*="green"] {
    background-color: transparent !important;
    border: none !important;
    border-radius: 0px !important;  
    /* 위아래 마진(여백) 조절 */
    padding-top: 0px !important;    
    padding-bottom: 0px !important; 
    padding-left: 0 !important;
    padding-right: 0 !important;
    min-height: 0 !important;       
}
/* 초록색 콜아웃 내부 콘텐츠 정렬 */
.notion-callout[class*="green"] .notion-callout__content {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    width: 100% !important;
}
/*====[3] h2 선택적숨김(주황색)===*/
/* 1. 주황색 콜아웃의 외형 투명화 */
.notion-callout[class*="orange"] {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
}
/* 3.콜아웃 내부 내용 중 텍스트/H1/H2 숨김 */
.notion-callout[class*="orange"] .notion-callout__content > .notion-text,
.notion-callout[class*="orange"] .notion-callout__content > h1,
.notion-callout[class*="orange"] .notion-callout__content > h2,
.notion-callout[class*="orange"] .notion-callout__content > .notion-h-title {
    display: none !important;
}
/*---[3] 화이트 풀배경 (H1 및 H2 전용)----*/
/* [1] 전역 가두리 해제 */
.notion-page-content {
    overflow-x: clip !important;
}
/* [2] 화이트 배경 적용 */
.notion-callout:not([class*="_background"]):not([class*="yellow"]):not([class*="red"]):not([class*="orange"]):has(h1, h2) {
    width: 100vw !important;
    max-width: none !important;
    position: relative !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background-color: #ffffff !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin-top: -65px !important;
    margin-bottom: 0px !important; 
    padding-top: 50px !important;
    padding-bottom: 0 !important;
}
/* [3] 내부 콘텐츠 중앙 정렬 */
.notion-callout:not([class*="_background"]):not([class*="yellow"]):not([class*="red"]):not([class*="orange"]):has(h1, h2) > .notion-callout__content {
    max-width: 1150px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    display: block !important;
    padding: 0 20px !important;
}
/* [4] 아이콘 숨김 */
.notion-callout:not([class*="_background"]):not([class*="red"]):not([class*="orange"]):has(h1, h2) > .notion-callout__icon {
    display: none !important;
}
/* [5] 내부 갤러리/이미지 방어 */
.notion-callout:not([class*="_background"]):not([class*="red"]):not([class*="orange"]):has(h1, h2) .notion-collection-gallery,
.notion-callout:not([class*="_background"]):not([class*="red"]):not([class*="orange"]):has(h1, h2) img {
    max-width: 100% !important;
}
@media (max-width: 768px) {
    .notion-callout:not([class*="_background"]):not([class*="yellow"]):not([class*="red"]):not([class*="orange"]):has(h1, h2)
    > .notion-callout__content {
        max-width: 100% !important;
        padding-left: 33px !important;
        padding-right: 33px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}