/* satoshi-modal/style.css */

.open-apostle,.open-commandment,.open-gospel, .open-declaration{cursor:pointer;display:block}
.open-apostle *,.open-commandment *,.open-gospel *,.open-declaration *{pointer-events:none} /* 자식이 클릭 가로채지 않게 */
.elementor-shape,.wpr-particles,canvas{pointer-events:none!important}   /* 덮개 레이어 무력화 */


.custom-modal {
  display: none;
  position: fixed;
  z-index: 1000;
  left: 0; top: 0;
  width: 100vw; height: 100vh;
  background: rgba(0,0,0,0.6);
  align-items: center;
  justify-content: center;  
}

.custom-modal-content {
  background: #fff;
  border-radius: 18px;
  border: 4px solid #c084fc66; /* 전체 테두리 */
  box-shadow: 0 6px 32px #0003;
  padding: 4rem 2rem 2rem;
  min-width: 868px;

  overflow-y: auto;
  
  text-align: center;
  position: relative;
  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  
  max-width: 56rem;
  max-height: 90vh;
}

.custom-modal-close {
  position: absolute;
  top: 16px; right: 18px;
  font-size: 2em;
  cursor: pointer;
  background: #fff;
  border-radius: 50%;
  width: 38px; height: 38px;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 6px #0001;
  transition: background 0.2s;
}
.custom-modal-close:hover {
  background: #e9d5ff;
}

/* 타이틀 */
.popup-title {
  font-size: 1.875rem;
  line-height: 2.25rem;
  font-family: "Cinzel","Cinzel Fallback";
  font-weight: 700;
  color: #9333ea; /* 타이틀 색 */
  margin-bottom: 1rem;
  letter-spacing: 1px;
  text-transform: uppercase;
}

/* 서브타이틀 + 연도 */
.popup-subtitle-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 1.5rem;
}
.popup-subtitle {
  font-size: 1.125rem;
  line-height: 1.625;
  font-weight: 600;
  color: #a855f7; /* 서브타이틀 색 */
}
.popup-subtitle-wrapper span {
  font-size: 1.125rem;
  line-height: 1.625;
  font-weight: 600;
  color: #9ca3af;
}

/* 구분선 */
.popup-divider {
  border: none;
  border-top: 1px solid #e9d5ff; /* 서브타이틀 하단 border */
  margin-top: 1.5rem !important;
  margin-bottom: 1.5rem !important;
}

/* 본문 */
.popup-desc {
  color: #1f293c;
  font-size: 1rem;
  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  line-height: 1.625;
  text-align: left;
  margin: 0 auto;
  white-space: pre-line;
  letter-spacing: 0.01em;
  max-width: 92%;
}

/* open-declaration일 때만 normal */
.custom-modal.type-open-declaration .popup-desc {
  white-space: normal;
}


/* open-apostle */
.type-open-apostle .custom-modal-content {
  border-color: #4ade80; /* 초록 */
}
.type-open-apostle .popup-title {
  color: #15803d;
}
.type-open-apostle .popup-subtitle {
  color: #16a34a;
}

/* open-commandment */
.type-open-commandment .custom-modal-content {
  border-color: #a855f7; /* 연보라 */
}
.type-open-commandment .popup-title {
  color: #7e22ce; /* 진보라 */
}
.type-open-commandment .popup-subtitle {
  color: #9333ea; /* 보라 */
}

/* open-gospel */
.type-open-gospel .custom-modal-content {
  border-color: #38bdf8; /* 파랑 */
}
.type-open-gospel .popup-title {
  color: #0284c7;
}
.type-open-gospel .popup-subtitle {
  color: #0ea5e9;
}

/* open-declaration */
.type-open-declaration .custom-modal-content {
  border-color: #facc15; /* 노랑 */
}
.type-open-declaration .popup-title {
  color: #ca8a04;
}
.type-open-declaration .popup-subtitle {
  color: #eab308;
}



/* 태블릿 */
@media (max-width: 1024px) {
  .custom-modal-content {
    min-width: auto;
    width: 90%;
    max-height: 85vh;
  }

  .popup-title {
    font-size: 1.5rem;
    line-height: 2rem;
  }
  .popup-subtitle,
  .popup-subtitle-wrapper span {
    font-size: 1rem;
  }
  .popup-desc {
    font-size: 0.95rem;
  }

}

/* 모바일 */
@media (max-width: 640px) {
  .custom-modal-content {
    width: 85%;
    max-height: 80vh;
    padding: 2rem 1rem;
  }

  .popup-title {
    font-size: 1.5rem;
    line-height: 1.75rem;
  }
  .popup-subtitle,
  .popup-subtitle-wrapper span {
    font-size: 1.25rem;
  }
  .popup-desc {
    font-size: 0.875rem;
  }
}