/* ========================================
   수강신청 흐름: 주문 요약·주문 내용 확인 창 + 휴대폰 아래 고정 줄 (js/sections/lms/enroll-flow.js)
   2026-10-04 보강: 포함 내용·별도 비용·신청자·취소·환불 기준·필수 동의 2개·판매자 줄
======================================== */
.enr-overlay {
    position: fixed; inset: 0; z-index: 2000;
    display: flex; align-items: center; justify-content: center;
    padding: 16px; background: rgba(10, 22, 40, 0.55);
}
.enr-overlay[hidden] { display: none; }
body.enr-open { overflow: hidden; }
.enr-sheet {
    position: relative; width: 100%; max-width: 500px; max-height: calc(100dvh - 32px); overflow-y: auto; overscroll-behavior: contain;
    padding: 28px 28px 22px; border-radius: 18px; background: #fff;
    box-shadow: 0 28px 68px rgba(16, 24, 40, 0.28); color: #101828;
}
.enr-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.enr-close { /* 창 안을 내려도 닫기가 보이게 위에 붙여 둔다 */
    position: sticky; top: -14px; z-index: 2; float: right; margin: -14px -14px 0 8px; width: 40px; height: 40px;
    border: 0; border-radius: 10px; background: rgba(255, 255, 255, .92); color: #667085; font-size: 18px; cursor: pointer;
}
.enr-close:hover { background: #f2f4f7; }
.enr-eyebrow { margin: 0 0 4px; color: #553ae7; font-size: 13px; font-weight: 700; }
.enr-title { margin: 0 0 18px; font-size: 21px; font-weight: 800; letter-spacing: -0.02em; }
.enr-title:focus { outline: none; }
.enr-changed { margin: -6px 0 14px; padding: 10px 12px; border-radius: 10px; background: #fff4e5; color: #8a4b00; font-size: 14px; font-weight: 600; line-height: 1.55; }

/* 과정 카드 */
.enr-course { display: flex; gap: 14px; align-items: center; padding: 12px; border-radius: 12px; background: #f6f7f9; }
.enr-thumb { width: 96px; height: 54px; border-radius: 8px; object-fit: cover; flex: none; background: #f5f3e7; }
.enr-type { margin: 0 0 2px; color: #667085; font-size: 12.5px; font-weight: 600; }
.enr-name { margin: 0; font-size: 16px; font-weight: 800; line-height: 1.4; }
.enr-meta { margin: 2px 0 0; color: #475467; font-size: 13.5px; font-variant-numeric: tabular-nums; }

/* 금액·기간 */
.enr-rows { margin: 14px 0 0; }
.enr-rows > div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 7px 0; font-size: 15px; }
.enr-rows dt { color: #667085; flex: none; }
.enr-rows dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; }
.enr-rows del { color: #98a2b3; }
.enr-off { color: #e5484d; font-weight: 700; }
.enr-total { border-top: 1px solid #e4e8ee; margin-top: 4px; padding-top: 12px !important; }
.enr-total dt { color: #101828; font-weight: 700; }
.enr-total dd { font-size: 23px; font-weight: 800; color: #101828; }

/* 블록 공통 */
.enr-block { margin-top: 16px; }
.enr-label { margin: 0 0 6px; color: #344054; font-size: 13.5px; font-weight: 800; }
.enr-includes { margin: 0; padding: 0; list-style: none; display: grid; gap: 4px; }
.enr-includes li { position: relative; padding-left: 22px; color: #344054; font-size: 14.5px; line-height: 1.5; }
.enr-includes li::before { content: '✓'; position: absolute; left: 3px; color: #553ae7; font-weight: 800; }
.enr-notice {
    display: flex; gap: 10px; align-items: flex-start; margin: 16px 0 0; padding: 12px 14px; border-radius: 12px;
    background: #f4f2ff; color: #2e2378; font-size: 14px; font-weight: 600; line-height: 1.55;
}
.enr-notice i { margin-top: 3px; color: #553ae7; }
.enr-buyer p { margin: 0; font-size: 15px; font-weight: 700; }
.enr-buyer p span { margin-left: 6px; color: #667085; font-weight: 500; }
.enr-buyer a { display: inline-block; margin-top: 4px; color: #553ae7; font-size: 13.5px; font-weight: 700; }
.enr-refund { padding: 12px 14px; border-radius: 12px; border: 1px solid #e4e8ee; }
.enr-refund ul { margin: 0; padding-left: 18px; list-style: disc; color: #475467; font-size: 13.5px; line-height: 1.6; }
.enr-refund li + li { margin-top: 2px; }
/* 2026-10-05 녹화형 온라인 강의 주문 창(환불 규정 v2): 번호 붙인 요약 3줄, 항목 보조 글, 출시 가격 안내 */
.enr-refund ol { margin: 0; padding-left: 18px; list-style: decimal; color: #344054; font-size: 13.5px; line-height: 1.6; word-break: keep-all; }
.enr-dd-sub { display: block; color: #667085; font-size: 12.5px; font-weight: 500; line-height: 1.5; }
.enr-total .enr-launch { margin-top: 2px; color: #9a3412; font-size: 12.5px; font-weight: 700; }
.enr-refund-more { margin: 8px 0 0; color: #475467; font-size: 13px; line-height: 1.6; }
.enr-refund-more a, .enr-agree a { color: #553ae7; font-weight: 700; }
.enr-refund-more a, .enr-seller span { white-space: nowrap; }

/* 필수 동의 */
.enr-agrees { margin: 14px 0 0; padding: 0; border: 0; display: grid; gap: 8px; }
.enr-agree { display: flex; gap: 10px; align-items: flex-start; padding: 12px; border: 1px solid #e4e8ee; border-radius: 12px; font-size: 14px; font-weight: 600; line-height: 1.5; cursor: pointer; }
.enr-agree:has(input:checked) { border-color: #b8adf7; background: #faf9ff; }
.enr-agree input { width: 18px; height: 18px; margin-top: 2px; accent-color: #553ae7; flex: none; }
.enr-agree b { color: #553ae7; }
.enr-error { margin: 10px 0 0; color: #b42318; font-size: 13.5px; }

.enr-guest { margin: 16px 0 0; color: #475467; font-size: 14px; line-height: 1.6; }
.enr-primary, .enr-secondary {
    display: flex; align-items: center; justify-content: center; width: 100%; min-height: 52px; margin-top: 14px;
    border: 0; border-radius: 12px; font: inherit; font-size: 16.5px; font-weight: 800; text-decoration: none; cursor: pointer;
}
.enr-primary { background: #553ae7; color: #fff; }
.enr-primary:hover { background: #4028c4; color: #fff; }
.enr-primary:disabled { background: #c7c1f5; cursor: not-allowed; }
.enr-primary[aria-busy="true"] { opacity: .75; }
.enr-secondary { min-height: 46px; margin-top: 8px; background: #f2f4f7; color: #344054; font-size: 15px; }
.enr-secondary:hover { background: #e9ecf1; color: #101828; }
.enr-seller { margin: 14px 0 0; color: #98a2b3; font-size: 12px; line-height: 1.5; text-align: center; word-break: keep-all; }
.enr-primary:focus-visible, .enr-secondary:focus-visible, .enr-close:focus-visible, .enr-sheet a:focus-visible, .enr-agree input:focus-visible { outline: 3px solid #b8adf7; outline-offset: 2px; }

/* 주문 창이 열리면 페이지 아래 고정 줄은 숨긴다(겹침 방지) */
body.enr-open .crd-sticky, body.enr-open .ci-sticky { display: none !important; }

/* 휴대폰: 예전 상세 아래 고정 줄(가격 + 수강신청) */
.crd-sticky { display: none; }
@media (max-width: 1024px) {
    .crd-sticky {
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 900;
        display: flex; align-items: center; justify-content: space-between; gap: 12px;
        padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
        background: #fff; border-top: 1px solid #e4e8ee; box-shadow: 0 -8px 24px rgba(16, 24, 40, 0.08);
    }
    .crd-sticky-final { font-size: 19px; font-weight: 800; color: #101828; font-variant-numeric: tabular-nums; }
    .crd-sticky-btn {
        flex: none; min-width: 150px; min-height: 48px; padding: 0 20px; border: 0; border-radius: 12px;
        background: #553ae7; color: #fff; font: inherit; font-size: 16px; font-weight: 800; cursor: pointer;
    }
    .crd-sticky-btn:disabled { background: #c7c1f5; }
    body.has-crd-sticky { padding-bottom: 76px; }
    /* 떠 있는 상담 단추가 고정 줄을 가리지 않게 위로 */
    body.has-crd-sticky .floating-btns, body.has-crd-sticky #btnTop { bottom: 92px !important; }
}
@media (max-width: 480px) {
    .enr-overlay { align-items: flex-end; padding: 0; }
    .enr-sheet {
        max-width: none; max-height: 92dvh; border-radius: 18px 18px 0 0;
        padding: 24px 18px calc(18px + env(safe-area-inset-bottom));
    }
    .enr-title { font-size: 20px; }
    .enr-thumb { width: 80px; height: 45px; }
}
@media (prefers-reduced-motion: no-preference) {
    .enr-overlay:not([hidden]) .enr-sheet { animation: enr-in .18s ease-out; }
    @keyframes enr-in { from { transform: translateY(12px); opacity: 0; } to { transform: none; opacity: 1; } }
}