.opf_share-by-shortlink-button {
    margin-left: 5px;
    display: block; /* Keep display: block; for mobile centering */
    float: right; /* This will only apply on larger screens */
}

.opf_share-by-shortlink-button p {
    margin: 5px;
    text-align: center; /* Center text within the paragraph on mobile */
}

.opf_share-by-shortlink-button canvas {
    float: right; /* This will only apply on larger screens */
    margin-bottom: 20px;
    display: block; /* Make canvas a block element for centering */
    margin-left: auto; /* Center canvas horizontally */
    margin-right: auto;
}

@media (max-width: 768px) { /* Adjust 768px as needed */
    .opf_share-by-shortlink-button {
        float: none; /* Remove float on mobile */
        margin: 0 auto; /* Center the button itself */
        text-align: center; /* Center the text inside the button container */
        width: fit-content; /* Or 100% if you want full width */
    }

    .opf_share-by-shortlink-button canvas {
        float: none; /* Remove float on mobile */
        margin-bottom: 20px;
    }
}