Status Action Buttons - Copy this Html, Bootstrap Component to your project

How to put the button on a nice place on the card? <div class="card game-card h-100"> <div class="card-body"> <div class="d-flex justify-content-between align-items-center mb-2"> <span class="text-muted">@Game.StartTime</span> <span class="px-2 py-1"> <span class="bi bi-geo-alt-fill me-1"></span> @if (Game.IsHomeGame) { <button type="button" class="btn p-0 text-decoration-underline" data-bs-toggle="modal" data-bs-target="#gamePitchModal_@Game.Id"> @Game.Pitch </button> } else { @Game.Pitch } </span> </div> <h5 class="card-title text-center">@($"{Game.HomeTeam} vs {Game.AwayTeam}")</h5> <div class="row text-center mt-3"> <AuthorizeView Roles="Referee"> <Authorized> @if (!Game.AllRefsAssigned) { <div class="col-12"> @if (!_hasUmpireSentRequest) { <button class="btn btn-outline-available me-3 mb-3" @onclick="SetAvailable" disabled="@_isSubmitting"> <i class="bi bi-check-circle me-2"></i>Available </button> } else { <button class="btn btn-outline-pending mb-3" disabled> <i class="bi bi-hourglass me-2"></i>Pending </button> } </div> } </Authorized> </AuthorizeView> <div class="col-6 border-end"> <p class="card-text mb-0">@Game.UmpireOne</p> </div> <div class="col-6"> <p class="card-text mb-0">@Game.UmpireTwo</p> </div> </div> </div> </div>