/* 모달 루트: body 직속으로 이동되므로 자체 위치 제약 없이 투명 래퍼 역할만 한다 */
.modal-root[data-v-07b8fefc] {
    position: static;
}

/* 백드롭(dim): 뷰포트 전체를 덮는 시각적 배경.
   pointer-events:none 으로 바깥 페이지의 클릭/스크롤을 막지 않는다(시각적 dim만 담당). */
.modal-backdrop[data-v-07b8fefc] {
    position: fixed;
    inset: 0;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10040;
    background-color: rgba(0, 0, 0, 0.5);
    pointer-events: none;
}

/* 오버레이 레이어: 뷰포트 전체 고정. 다이얼로그를 가운데 정렬하고,
   다이얼로그가 뷰포트보다 길면 이 레이어가 스크롤한다.
   콘텐츠 컨테이너 스크롤(②)은 모달이 body 직속이 되면서 자연 제거된다.
   pointer-events:none 으로 레이어 자체는 바깥 스크롤/클릭을 막지 않고,
   실제 인터랙션은 .modal-dialog 에만 허용한다(dim 클릭 통과 = 바깥 스크롤 유지). */
.modal[data-v-07b8fefc] {
    position: fixed;
    inset: 0;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10050;
    overflow-y: auto;
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.75rem 0;
}
.modal-dialog[data-v-07b8fefc] {
    margin: 0 auto;
    width: calc(100% - 2rem);
    max-width: 500px;
    max-height: calc(100vh - 3.5rem);
    display: flex;
    flex-direction: column;
    pointer-events: auto;
    flex-shrink: 0;
}
.modal-content[data-v-07b8fefc] {
    display: flex;
    flex-direction: column;
    max-height: 100%;
    overflow: hidden;
    border-radius: 12px;
}
.modal-body[data-v-07b8fefc] {
    flex: 1;
    overflow-y: auto;
    max-height: calc(100vh - 210px);
}
.modal-sm[data-v-07b8fefc] {
    max-width: 300px;
}
.modal-lg[data-v-07b8fefc] {
    max-width: 800px;
}
.modal-xl[data-v-07b8fefc] {
    max-width: 1140px;
}
.fa-3x[data-v-07b8fefc] {
    font-size: 3em;
}
@media (max-width: 576px) {
.modal[data-v-07b8fefc] {
        padding: 0.5rem 0;
}
.modal-dialog[data-v-07b8fefc] {
        margin: 0 auto;
        width: calc(100% - 1rem);
        max-width: none;
        max-height: calc(100vh - 1rem);
}
.modal-lg[data-v-07b8fefc],
    .modal-xl[data-v-07b8fefc] {
        max-width: none;
}
.modal-body[data-v-07b8fefc] {
        max-height: calc(100vh - 180px);
}
}