/* Styling for the new Quick-Nav Widget */
#quick-nav-widget {
    transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}

#quick-nav-menu {
    /* Initially hidden off-screen to the right */
    transform: translateX(100%);
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
}

/* State when the widget is OPEN */
#quick-nav-widget.is-active #quick-nav-menu {
    transform: translateX(0);
    opacity: 1;
    pointer-events: auto;
    visibility: visible;
}

/* Rotate the icon when open */
#quick-nav-widget.is-active #quick-nav-toggle svg {
    transform: rotate(180deg);
}

/* Inactive state (faded and partially hidden) */
#quick-nav-widget.is-inactive {
    transform: translateY(-50%) translateX(20px);
    opacity: 0.4;
    pointer-events: none; /* Add this line */
}
#quick-nav-widget.is-inactive #quick-nav-toggle {
    pointer-events: auto;
    cursor: pointer;
}