/* =====================================================================
   굿즈 룰렛 - 개발 보정 스타일

   style.css 는 퍼블 산출물이라 다음 퍼블 전달 시 통째로 교체된다.
   개발 쪽 보정은 덮어쓰이지 않도록 이 파일에 모은다.
   로드 순서: reset.css -> style.css -> custom.css
   ===================================================================== */

/* ------------------------------------------------------------------
   공통 모달(jquery.alert) 보정.
   공통 모달 CSS 는 '제목 없는 1버튼 alert' 기준으로만 완성돼 있다.
   - $.confirm 은 title 이 null 이어도 빈 <h2>(노란 바)가 남는다
   - .popup-btn ul 에 flex 가 없어 2버튼이 세로로 쌓인다
   - .popup-content input 규칙(width:100%;height:6rem)이 체크박스를 깨뜨린다
   이 페이지에서만 로드되는 스타일이라 다른 화면에는 영향이 없다.
   ------------------------------------------------------------------ */
.alert_popup .popup-title:empty { display: none; }
.alert_popup .popup-wrap { min-width: 320px; }

.alert_popup .popup-wrap .popup-content .popup-btn ul { display: flex; margin: 0; padding: 0; }
.alert_popup .popup-wrap .popup-content .popup-btn ul li { margin-right: 0; flex: 1 1 0; }
.alert_popup .popup-wrap .popup-content .popup-btn ul li a { padding: 16px 0; font-size: 15px; }
.alert_popup .popup-wrap .popup-content .popup-btn ul li a.close {
    background-color: #fff; color: #111; box-shadow: inset 0 0 0 1px #111;
}

/* 당첨 팝업 안내 문구 (본문에서 한 줄 띄우고 굵기 낮춤) */
.alert_popup .jca-win-sub {
    display: block; margin-top: 18px;
    font-size: 15px; font-weight: 400; line-height: 1.4;
}

/* 서브 문구(em). 공통 기본값은 노란 20px 이라 이 페이지 톤에 맞춰 낮춘다 */
.alert_popup .popup-wrap .popup-content .text-box strong {
    margin-top: 18px; margin-bottom: 0;
    color: #ff422e; font-size: 13px; font-weight: 400; line-height: 1.5; text-align: center;
}
.alert_popup .popup-wrap .popup-content .text-box strong:empty { display: none; }

/* 개인정보 동의 체크박스 */
.alert_popup .jca-agree { display: block; margin-top: 18px; font-size: 14px; line-height: 1.5; }
.alert_popup .jca-agree label { display: inline-flex; align-items: flex-start; gap: 6px; cursor: pointer; }
/* common.css 가 사이트 전역에서 input[type=checkbox] 를
   display:none + visibility:hidden 으로 숨긴다(원래는 <i> 를 대신 그리는 방식).
   공통 모달 안에서는 체크박스 자체를 써야 하므로 여기서만 되살린다. */
.alert_popup .jca-agree input[type="checkbox"] {
    display: inline-block !important;
    visibility: visible !important;
    width: 16px !important; height: 16px !important; min-width: 16px;
    margin: 2px 0 0 !important; padding: 0;
    border: 1px solid #c8c8c8; border-radius: 3px;
    accent-color: #111; background: none;
    appearance: auto; -webkit-appearance: checkbox; font-size: inherit;
}
.alert_popup .jca-agree input[type="checkbox"]::after { content: none !important; }
.alert_popup .jca-agree a { color: inherit; text-decoration: underline; }

/* 동의 전에는 확인 버튼을 누를 수 없다 */
.alert_popup .popup-btn ul li a.confirm.jca-disabled {
    pointer-events: none; background-color: #c8c8c8; color: #fff;
}