/* Pricing Section Mobile Slider CSS */

/* Hide mobile slider by default (for desktop) */
.pricing-slider-container {
    display: none;
}

/* Hide the navigation buttons by default */
.pricing-nav-btn {
    display: none;
}

/* Mobile Styles */
@media screen and (max-width: 1023px) {
    /* Hide the original desktop pricing table on mobile */
    .pricing-section .pricing-table {
        display: none;
    }
    
    /* Reposition the limited-offer-notification for mobile view */
    .pricing-section .limited-offer-notification {
        order: 2;
        margin-top: 20px;
    }
    
    /* Show the mobile slider container */
    .pricing-slider-container {
        display: block;
        position: relative;
        width: 100%;
        overflow: hidden;
        margin: 20px 0;
        order: 1;
    }
    
    /* Style for the slider wrapper */
    .pricing-slider {
        display: flex;
        transition: transform 0.3s ease;
        width: 100%;
        overflow: visible !important;
        position: relative;
        padding-top: 20px;
    }
    
    /* Style for individual slide */
    .pricing-slide {
        min-width: 100%;
        flex: 0 0 100%;
        padding: 0px;
        box-sizing: border-box;
        position: relative;
        overflow: visible;
        isolation: isolate;
    }
    
    /* Navigation buttons */
    .pricing-nav-btn {
        display: block;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 40px;
        height: 40px;
        background: rgba(0, 0, 0, 0.5);
        color: white;
        border-radius: 50%;
        border: none;
        cursor: pointer;
        z-index: 10;
        font-size: 18px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .pricing-prev-btn {
        left: 10px;
    }
    
    .pricing-next-btn {
        right: 10px;
    }
    
    /* Indicators for current slide */
    .pricing-indicators {
        display: flex;
        justify-content: center;
        margin-top: 15px;
    }
    
    .pricing-indicator {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.5);
        margin: 0 5px;
        cursor: pointer;
    }
    
    .pricing-indicator.active {
        background: #69fba6;
    }
    
    /* Make sure pricing plans in the slider look nice */
    .pricing-slide .pricing-plan {
        margin-top: 35px;
        max-width: 100%;
        height: auto;
        position: relative;
    }
    
    /* Fix discount badge in mobile slider */
    .pricing-slide .discount-badge {
        position: absolute !important;
        top: -35px !important;
        left: 5px !important;
        z-index: 100 !important;
        width: auto !important;
        min-width: 160px !important;
        box-sizing: border-box !important;
        transform: rotate(0deg) !important;
        pointer-events: none !important;
        font-size: 15px !important; /* 기본 폰트 크기 */
        padding: 8px 8px !important; /* 기본 패딩 */
    }
    
    /* 할인 뱃지 내부 텍스트 스타일 */
    .pricing-slide .discount-badge .discount-text {
        font-size: 15px !important;
        font-weight: bold !important;
    }
    
    .pricing-slide .discount-badge .discount-subtext {
        font-size: 12px !important;
    }
    
    /* Hide other discount badges when not in active slide */
    .pricing-slide:not(.active) .discount-badge {
        opacity: 0 !important;
        visibility: hidden !important;
    }
    
    /* Ensure active slide's badge is shown */
    .pricing-slide.active .discount-badge {
        opacity: 1 !important;
        visibility: visible !important;
    }
    
    /* Make the pricing section content use flexbox for ordering */
    .pricing-section .section-container {
        display: flex;
        flex-direction: column;
    }
}

    /* Adjust specific device styles */
    /* iPhone 모델 (370px-380px) */
    @media screen and (min-width: 370px) and (max-width: 380px) {
        .pricing-slide .pricing-plan {
            padding: 20px 15px;
        }
        
        .pricing-slide .discount-badge {
            min-width: 160px !important;
            top: -40px !important;
            left: 8px !important;
            transform: rotate(0deg) !important;
        }
        
        .pricing-slide .discount-badge .discount-text {
            font-size: 15px !important;
        }
        
        .pricing-slide .discount-badge .discount-subtext {
            font-size: 11px !important;
        }
        .pricing-slider {
            padding-top: 20px;
        }
    }
    
    /* 삼성 갤럭시 S 시리즈 (355px-365px) */
    @media screen and (min-width: 355px) and (max-width: 365px) {
        .pricing-slide .pricing-plan {
            padding: 18px 12px;
        }
        
        .pricing-slide .discount-badge {
            min-width: 150px !important;
            top: -40px !important;
            left: 10px !important;
            padding: 6px 12px !important;
            transform: rotate(0deg) !important;
        }
        
        .pricing-slide .discount-badge .discount-text {
            font-size: 14px !important;
        }
        
        .pricing-slide .discount-badge .discount-subtext {
            font-size: 10px !important;
        }
    }
    
    /* 갤럭시 Z 폴드 5 (340px-348px) */
    @media screen and (min-width: 340px) and (max-width: 348px) {
        .pricing-slide .pricing-plan {
            padding: 16px 10px;
        }
        
        .pricing-slide .discount-badge {
            min-width: 140px !important;
            top: -40px !important;
            left: 10px !important;
            padding: 5px 10px !important;
            transform: rotate(0deg) !important;
        }
        
        .pricing-slide .discount-badge .discount-text {
            font-size: 13px !important;
        }
        
        .pricing-slide .discount-badge .discount-subtext {
            font-size: 9px !important;
        }

        .pricing-slider {
            padding-top: 20px;
        }
    }
    
    /* Enable touch swiping for mobile */
    .pricing-slider-container {
        touch-action: pan-y;
    }
    
    /* 갤럭시 Z 플립 3 (380px-390px) */
    @media screen and (min-width: 380px) and (max-width: 390px) {
        .pricing-slide .discount-badge {
            min-width: 165px !important;
            top: -40px !important;
            left: 10px !important;
            padding: 7px 14px !important;
            transform: rotate(0deg) !important;
        }
        
        .pricing-slide .discount-badge .discount-text {
            font-size: 15px !important;
        }
        
        .pricing-slide .discount-badge .discount-subtext {
            font-size: 11px !important;
        }
    }
    
    /* 갤럭시 노트/아이폰 프로 맥스 (410px-430px) */
    @media screen and (min-width: 410px) and (max-width: 430px) {
        .pricing-slide .discount-badge {
            min-width: 185px !important;
            top: -40px !important;
            left: 10px !important;
            padding: 9px 16px !important;
            transform: rotate(0deg) !important;
        }
        
        .pricing-slide .discount-badge .discount-text {
            font-size: 17px !important;
        }
        
        .pricing-slide .discount-badge .discount-subtext {
            font-size: 13px !important;
        }
    }