<!-- head Desktop -->
<div class="row py-5 px-4 px-md-5 mt-5 d-none d-md-block">
    <div class="col-12">
        <div class="d-flex flex-row justify-content-between">
            <div class="m-0 p-0">
                <p class="m-0 p-0 h3 fw-bolder text-dark">{{ lang('machinelist') }}</p>
            </div>
            
            <div class="d-flex flex-row justify-content-end align-items-center">
                
                <div class="m-0 p-0 mx-3">
                    <div class="input-group">
                        <span class="input-group-text py-2" id="basic-addon">
                            <span class="text-dark fw-medium me-2">{{ lang('balance') }} : </span>
                            <span v-if="user.balance" class="text-primary fw-medium">
                                <?php if(!$currencyIsRial){echo($cloudCurrency);} ?>{{ formatCost(user.balance) }}
                                <?php if($currencyIsRial){echo($cloudCurrency);} ?>
                            </span>
                            <span v-else class="text-primary fw-medium">
                                --- 
                            </span>
                            <span class="text-dark ps-3">
                                <?php if($CloudTopupLink):?>
                                    <a href="<?php echo($CloudTopupLink); ?>" target="_top" type="button" class="btn btn-outline-primary">{{ lang('topup') }}</a>
                                <?php endif ?>
                            </span>
                            
                        </span>
                    </div>
                </div>

                <div class="m-0 p-0">
                    <a class="btn btn-primary px-5 py-3" @click="opencreatepage">{{ lang('createmachine') }}</a>
                </div>

                <div class="btn bg-primary text-dark ms-3 h-100 d-flex flex-row justify-content-center align-items-center p-0" style="--bs-bg-opacity: 0.2">
                    <?php include('./includes/commodules/langbtn.php'); ?>
                </div>
                
            </div>
        </div>
    </div>
</div>
<!-- end head -->


<!-- head Mobile -->
<div class="row py-5 mt-5 px-5 d-md-none">
    <div class="col-12 m-0 p-0">
        <div class="row m-0 p-0">
            <p class="m-0 p-0 h3 fw-bolder text-dark">{{ lang('machinelist') }}</p>
        </div>
        
        <div class="d-flex flex-row float-end align-items-center justify-content-center m-0 p-0 mt-4">
            <div class="input-group input-group-sm">
                <span class="input-group-text px-3 rounded-3 py-3" id="basic-addon2">
                    <span class="text-dark fw-medium me-2">{{ lang('balance') }} : </span>
                    <span v-if="user.balance" class="text-primary fw-medium">
                        <?php if(!$currencyIsRial){echo($cloudCurrency);} ?>{{ formatCost(user.balance) }}
                        <?php if($currencyIsRial){echo($cloudCurrency);} ?>
                    </span>
                    <span v-else class="text-primary fw-medium">
                        --- 
                    </span>
                </span>
            </div>
            <div class="m-0 p-0 ps-2">
                <a class="btn btn-primary btn-sm px-3 py-3 rounded-3" style="width: 120px" @click="opencreatepage">{{ lang('createmachine') }}</a>
            </div>
        </div>
    </div>
</div>
<!-- end head -->


