/* 모바일 전용 기본 리셋 및 안전 영역 대응 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* iOS 안전 영역 대응 */
body {
    padding-top: env(safe-area-inset-top);
    padding-right: env(safe-area-inset-right);
    padding-bottom: env(safe-area-inset-bottom);
    padding-left: env(safe-area-inset-left);
    
    /* iOS 줌 방지 */
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

/* 모바일 최적화 컨테이너 */
.mobile-container {
    max-width: 100%;
    width: 100%;
    margin: 0 auto;
    padding: 0 16px;
    box-sizing: border-box;
}

/* 모든 요소가 컨테이너를 벗어나지 않도록 */
.mobile-container * {
    max-width: 100%;
    box-sizing: border-box;
}

/* 폼 요소 최적화 */
.mobile-input {
    min-height: 44px;
    font-size: 16px; /* iOS 줌 방지 */
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

/* 버튼 최적화 */
.mobile-btn {
    min-height: 44px;
    padding: 12px 16px;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    user-select: none;
    -webkit-user-select: none;
}

/* 터치 디바이스에서 호버 효과 비활성화 */
@media (hover: none) and (pointer: coarse) {
    .mobile-card:hover {
        transform: none;
        box-shadow: var(--shadow-md);
    }
}

/* 미디어 쿼리 기본 브레이크포인트 */
@media (max-width: 1200px) {
    .ld-min {
        display: block !important;
    }
    .ld-min-hidden {
        display: none !important;
    }
}

@media (max-width: 1024px) {
    .md-min {
        display: block !important;
    }
    .md-min-hidden {
        display: none !important;
    }
}

@media (max-width: 768px) {
    .sd-min {
        display: block !important;
    }
    .sd-min-hidden {
        display: none !important;
    }
    
    /* 모바일 전용 섹션 스타일 */
    .section {
        border-radius: 18px;
        border: 2px solid var(--border);
        padding: 24px 16px;
        margin: 16px 0;
    }
}

@media (max-width: 480px) {
    .xs-min {
        display: block !important;
    }
    .xs-min-hidden {
        display: none !important;
    }
}

@media (max-width: 375px) {
    .xxs-min {
        display: block !important;
    }
    .xxs-min-hidden {
        display: none !important;
    }
}