.custom-button {
    text-decoration: underline;
    text-underline-offset: 4px;
    background-color: #29ABE2;
    color: white;
    font-weight: bold;
    padding: 0.5rem 1.75rem; /* py-2 px-7 */
    border-radius: 9999px; /* rounded-full */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.06); /* shadow */
    text-align: center;
    transition: background-color 0.2s ease-in-out;
    width: 100%; /* w-full */
    font-size: 1rem; /* text-m */
}

@media (min-width: 768px) {
    .custom-button {
        font-size: 1.25rem; /* md:text-xl */
        width: auto; /* md:w-auto */
    }
}

.custom-button:hover {
    background-color: #3b82f6; /* hover:bg-blue-500 */
}
.active {
    background-color: #3b82f6; /* Example active color */
    color: white;
}