/* CSS 변수로 Safe Area 값 저장 */
        :root {
            --sat: env(safe-area-inset-top, 0px);
            --sab: env(safe-area-inset-bottom, 0px);
            --sal: env(safe-area-inset-left, 0px);
            --sar: env(safe-area-inset-right, 0px);
            
            /* iOS 구형 브라우저 지원 */
            --sat-constant: constant(safe-area-inset-top);
            --sab-constant: constant(safe-area-inset-bottom);
            --sal-constant: constant(safe-area-inset-left);
            --sar-constant: constant(safe-area-inset-right);
        }

        /* 전역 리셋 */
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            -webkit-tap-highlight-color: transparent;
            -webkit-touch-callout: none;
            -webkit-user-select: none;
            user-select: none;
        }

        html {
            height: 100%;
            width: 100%;
            overflow: hidden;
            position: fixed;
            /* iOS 바운스 방지 */
            overscroll-behavior: none;
        }

        body {
            height: 100%;
            width: 100%;
            overflow: hidden;
            position: fixed;
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
            background: #000;
            -webkit-text-size-adjust: 100%;
            -webkit-font-smoothing: antialiased;
            left: 50%;
    transform: translateX(-50%);
        }

/* 메인 스크롤 컨테이너 Safe Area 적용 */
.main-scroll-container {
    height: calc(100vh - var(--safe-area-inset-bottom, 0px));
    max-height: calc(100vh - var(--safe-area-inset-bottom, 0px));
    height:  calc(100vh + env(safe-area-inset-bottom, 0px));
    max-height:  calc(100vh + env(safe-area-inset-bottom, 0px));
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

/* 하단 고정 네비게이션 Safe Area 적용 
.fixed-bottom-nav {
    bottom: var(--safe-area-inset-bottom, 0px);
}

.bottom-nav {
    bottom: var(--safe-area-inset-bottom, 0px);
}
*/
/* Footer 영역 Safe Area 적용 */
.footer.bottom-nav {
    /*padding-bottom: calc(1rem + var(--safe-area-inset-bottom, 0px));     padding-bottom: calc(1rem + env(safe-area-inset-bottom, 0px));*/
    transform: translateX(-50%);background:#fff;left: 50%;
}

.ios .footer.bottom-nav {
    padding-bottom: 10px;
    transform: translateX(-50%);background:#fff;
}

.footer_location_info {
    padding-bottom: calc(1rem + var(--safe-area-inset-bottom, 0px)); padding-bottom:  calc(1rem + env(safe-area-inset-bottom, 0px));
}


/* 하단 여백 Safe Area 적용 */
.bottom-spacing {
    height: calc(0px + var(--safe-area-inset-bottom, 0px)) !important;
    
}

/* 전체 컨테이너 Safe Area 적용 */
.app-container {
    min-height: calc(100vh - var(--safe-area-inset-bottom, 0px));
}

/* iOS 전용 스타일 */
@supports (-webkit-touch-callout: none) {
    .main-scroll-container {
        height: calc(var(--safe-vh, 1vh) * 100);
        max-height: calc(var(--safe-vh, 1vh) * 100);
    }
}

/* Safe Area 시각적 디버깅 (필요시 사용) */
.debug-safe-area-bottom {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: var(--safe-area-inset-bottom, 0px);
    height: env(safe-area-inset-bottom, 0px);
    background: rgba(255, 0, 0, 0.3);
    z-index: 9998;
    pointer-events: none;
    display: block; /* 디버깅시 block으로 변경 */
    
}

.debug-safe-area-top {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: var(--safe-area-inset-top, 0px);
    background:none;
    z-index: 9998;
    pointer-events: none;
    display: none; /* 디버깅시 block으로 변경 */
}