#help-icon-container {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    height: 100%; /* Stretches to the height of the parent */
    width: auto;  /* The width will adapt to the contents (icon) */
    padding: 5px;
}

#help-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%; /* Auto-fits to the width of the icon */
    height: 100%; /* Keeps aspect ratio for the icon */
    font-size: 3em;
}

#help-icon-link {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}

/* Mobile breakpoint for screens smaller than 768px */
@media (max-width: 768px) {
    #help-icon-container {
        padding: 5px;
        /* width: 80%; */
        height: auto;
    }

    #help-icon {
        width: 20px; /* Set a fixed width for the icon on mobile */
        height: 20px; /* Maintain aspect ratio with a fixed height */
        font-size: 30px;
    }

    #help-icon-link {
        width: 100%; /* Keep the link full width for easy tapping */
        height: auto; /* Allow the link height to adapt */
    }
}