/* Final fix for mobile carousel - ensure first box is visible */
@media (max-width: 768px) {
    /* Override all previous styles */
    .predplatne-form-step .predplatne-boxes,
    .predplatne-container .predplatne-boxes,
    .predplatne-boxes {
        /* Force reset */
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
        
        /* Then apply our styles */
        display: flex !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        gap: 15px !important;
        
        /* Padding for visibility */
        padding-left: 20px !important;
        padding-right: 20px !important;
        padding-bottom: 20px !important;
        
        /* Scroll behavior */
        scroll-padding-left: 20px !important;
        scrollbar-width: none !important;
        -ms-overflow-style: none !important;
    }
    
    .predplatne-boxes::-webkit-scrollbar {
        display: none !important;
    }
    
    /* Individual boxes */
    .predplatne-boxes .predplatne-box,
    .predplatne-box {
        flex: 0 0 280px !important;
        width: 280px !important;
        min-width: 280px !important;
        max-width: 280px !important;
        margin: 0 !important;
    }
    
    /* First box specific */
    .predplatne-boxes .predplatne-box:first-child {
        margin-left: 0 !important;
    }
    
    /* Last box specific */
    .predplatne-boxes .predplatne-box:last-child {
        margin-right: 0 !important;
    }
    
    /* Active state */
    .predplatne-box.active {
        border-color: #00466A !important;
        box-shadow: 0 0 0 2px #00466A !important;
    }
    
    /* Preset buttons same treatment */
    .preset-buttons {
        display: flex !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        gap: 10px !important;
        padding: 0 20px 20px 20px !important;
        margin: 0 !important;
        width: 100% !important;
        scrollbar-width: none !important;
        -ms-overflow-style: none !important;
    }
    
    .preset-buttons::-webkit-scrollbar {
        display: none !important;
    }
}