/**
 * 26.03.04 광고 보고 다운로드 전용 CSS
 * theme/snow/skin/item/basic/ads.view.skin.css
 */

/* 광고 보고 다운로드 모달 */
#adDownloadModal { display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 10000; background: rgba(0,0,0,0.6); align-items: center; justify-content: center; }
#adDownloadModal.show { display: flex; }
#adDownloadModal .ad-download-modal-content { background: #fff; border-radius: 12px; padding: 24px; max-width: 400px; width: 90%; box-shadow: 0 4px 20px rgba(0,0,0,0.15); }
#adDownloadModal .ad-download-modal-content h4 { margin: 0 0 12px; font-size: 16px !important; color: #333; text-align: center; }
/* min-height는 view.skin.php 상단 광고 설정($ad_download_modal_height)에서 자동 적용 */
#adDownloadModal .ad-download-modal-content .ad-slot-wrap { display: flex; align-items: center; justify-content: center; background: #f5f5f5; border-radius: 8px; margin: 16px 0; }
#adDownloadModal .ad-download-modal-content .ad-countdown { text-align: center; color: #666; font-size: 13px !important; margin-bottom: 12px; }
#adDownloadModal .ad-download-modal-content .ad-countdown .count-num { font-weight: bold; color: #f9b700; }
#adDownloadModal .ad-download-modal-content .btn-download-after-ad { display: block; width: 100%; padding: 14px; background: #ccc; color: #fff; border: none; border-radius: 10px; font-size: 14px !important; font-weight: bold; cursor: not-allowed; }
#adDownloadModal .ad-download-modal-content .btn-download-after-ad.ready { background: #f9b700; color: #fff; cursor: pointer; }
#adDownloadModal .ad-download-modal-content .btn-close-ad-modal { display: block; width: 100%; margin-top: 10px; padding: 10px; background: #eee; border: none; border-radius: 8px; font-size: 12px !important; color: #666; cursor: pointer; }

/* 다운로드 버튼 영역 래퍼 (다운로드 + 광고 보고 다운로드) */
.btn_boxArea .downCon .downBtn-wrap { display: flex; gap: 10px; flex-wrap: wrap; }
.btn_boxArea .downCon .downBtn-wrap .downBtn { flex: 1; min-width: 120px; }

/* 광고 보고 다운로드 버튼: 폰트·아이콘 작게, 가운데 정렬 */
.detail_titleArea .btn_boxArea .downCon .downBtn.adDownBtn,
.btn_boxArea .downCon .downBtn.adDownBtn {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  background: #2d7d46;
  font-size: 14px !important;
}
.detail_titleArea .btn_boxArea .downCon .downBtn.adDownBtn span,
.btn_boxArea .downCon .downBtn.adDownBtn span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px;
  font-size: 14px !important;
  padding-left: 0 !important;
  text-align: center;
}
.detail_titleArea .btn_boxArea .downCon .downBtn.adDownBtn span:after,
.btn_boxArea .downCon .downBtn.adDownBtn span:after {
  position: static !important;
  left: auto !important;
  transform: none !important;
  width: 18px;
  height: 16px;
  flex-shrink: 0;
  background-size: contain;
  order: -1; /* 아이콘을 텍스트 앞에 표시 */
}

@media (max-width: 768px) {
  .btn_boxArea .downCon .downBtn-wrap { flex-direction: column; }
  .btn_boxArea .downCon .downBtn-wrap .downBtn { min-width: 100%; }
  .detail_titleArea .btn_boxArea .downCon .downBtn.adDownBtn,
  .btn_boxArea .downCon .downBtn.adDownBtn,
  .detail_titleArea .btn_boxArea .downCon .downBtn.adDownBtn span,
  .btn_boxArea .downCon .downBtn.adDownBtn span { font-size: 13px !important; }
  .btn_boxArea .downCon .downBtn.adDownBtn span:after { width: 16px; height: 14px; }
  /* 광고 모달 폰트 모바일에서 더 줄임 */
  #adDownloadModal .ad-download-modal-content h4 { font-size: 14px !important; }
  #adDownloadModal .ad-download-modal-content .ad-countdown { font-size: 12px !important; }
  #adDownloadModal .ad-download-modal-content .btn-download-after-ad { font-size: 13px !important; }
  #adDownloadModal .ad-download-modal-content .btn-close-ad-modal { font-size: 11px !important; }
}