/* Fix for eliminating gap after last box */
@media (max-width: 768px) {
    /* Main container */
    .predplatne-boxes {
        /* Reset the 100vw approach that's causing issues */
        width: auto !important;
        max-width: none !important;
        position: static !important;
        left: auto !important;
        right: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        
        /* Simple flex layout */
        display: flex !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        gap: 15px !important;
        padding: 0 20px !important;
        margin-bottom: 20px !important;
        
        /* No fixed width - let content determine width */
        width: fit-content !important;
        min-width: 100% !important;
        
        /* Hide scrollbar */
        scrollbar-width: none !important;
        -ms-overflow-style: none !important;
    }
    
    .predplatne-boxes::-webkit-scrollbar {
        display: none !important;
    }
    
    /* Parent container needs overflow hidden */
    .vyber-baleni-wrapper,
    .vyber-zpusobu,
    .frekvence-vyber,
    .mnozstvi-vyber,
    .doba-vyber,
    .checkout-step {
        overflow-x: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    
    /* Individual boxes */
    .predplatne-box {
        flex: 0 0 280px !important;
        width: 280px !important;
        margin: 0 !important;
    }
    
    /* No pseudo elements for spacing */
    .predplatne-boxes::before,
    .predplatne-boxes::after {
        display: none !important;
    }
}