/* Menu text spacing to avoid overlap with icon area */
.menu-link > div {
    margin-left: 1.5rem; /* Space for icon area */
}

/* Ensure icon has proper spacing */
.menu-icon {
    margin-right: 0.5rem;
    width: 1.25rem;
    text-align: center;
}

/* Alternative approach - add padding to menu links */
.menu-link {
    padding-left: 2.5rem !important; /* Reserve space for icon */
}

/* Reset padding when icon is present */
.menu-link:has(.menu-icon) {
    padding-left: 0.75rem !important;
}

/* Fallback for browsers that don't support :has() */
.menu-link .menu-icon + div {
    margin-left: 0; /* Reset margin when icon is present */
}