/* Style and position the "Please click here..." link for all devices */
#content p.out-of-stock-contact-message.below-stock-status a {
    color: #FF0000 !important; /* Red text */
    background-color: #F9F9F9 !important; /* Light shaded white background */
    padding: 0.5em 1em !important; /* Add padding */
    text-decoration: none !important;
    border-radius: 5px !important; /* Optional: Rounded corners */
    transform: translateX(0) !important; /* Reset horizontal shift */
    font-size: 1.1em !important; /* Adjust as needed for desktop */
    text-align: center !important; /* Align text in the middle */
    font-weight: bold !important; /* Make the text bold */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important; /* Light shadow for depth */
    border: 2px solid #000000 !important; /* Black border */
    display: block !important; /* Make the link a block-level element */
    width: 100% !important; /* Make it take the full width of its container */
    margin: 0.5em 0 !important; /* Add some vertical spacing */
    transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, box-shadow 0.2s ease-in-out; /* Smooth transition for hover */
}

#content p.out-of-stock-contact-message.below-stock-status a:hover {
    background-color: #5098B7 !important; /* Light blue background on hover */
    color: #FFFFFF !important; /* White text on hover */
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.3) !important; /* More noticeable shadow on hover */
}

/* Mobile-specific override (adjustments if needed) */
@media (max-width: 768px) {
    #content p.out-of-stock-contact-message.below-stock-status a {
        font-size: 1em !important; /* Adjust as needed for mobile */
    }
}