Looking at the screenshots:

1. First image shows the header with "Atelier" logo and a small style selector (A+ icon) that looks awkward in its current position
2. Second image shows a duplicate X close button issue - one inside the sheet and one outside

Let me fix these issues and add 50 more products.

I see the issue - the SheetContent component has a built-in close button, plus the header has a custom close button. Let me fix the header and also modify the sheet to remove the built-in close button when we're handling it ourselves. I'll also improve the style selector for mobile.

Now let me improve the mobile style selector to look better and be more prominent on mobile. I'll also hide it from the header actions on mobile and only show it in the mobile menu.

Now let me make the mobile menu personalization section more prominent and better looking.

Now let me update the StyleSelector to accept an isMobile prop for a different mobile layout.

Now let me add 50 more products to Sanity. First let me load the necessary tools.

Now let me create 50 more products in batches. I'll create diverse fashion items across all categories and segments.

Created products batch 1

Created products batch 2

Created products batch 3

Created products batch 4

Created products batch 5

Created products batch 6

Created products batch 7

Let me create more products to reach 50 total new products.

Created final products batch

Now let me publish all the new products. Let me first query all draft documents to get their IDs.

Queried draft products

Published new products

I need to also check and publish the remaining draft products that weren't in the first batch.

Checked remaining drafts

All products are now published. I've completed the following updates:

Fixed Issues:

1. Duplicate X icon in mobile menu - Added hideCloseButton prop to the Sheet component and set it to true when we have a custom close button in the menu header
2. Mobile style selector placement - The style selector is now hidden on mobile from the header actions (shown only on sm+), but prominently displayed in the mobile menu with a nice card-style UI featuring a grid of 4 style options (Streetwear, Formal, Sporty, Minimalist)

Added 50 New Products:

• 8 T-Shirts (various styles: oversized, cropped, pima cotton, striped, mesh, longline, henley, tie-dye)
• 7 Shirts (French cuff, linen camp, flannel, poplin, denim western, mandarin collar, performance)
• 7 Pants (wide leg, hiking, pleated dress, linen, baggy jeans, cropped ankle, compression tights)
• 7 Jackets (quilted puffer, leather biker, cashmere overcoat, rain jacket, corduroy trucker, cardigan, anorak)
• 7 Dresses (silk slip, blazer dress, floral midi, denim shirt, bodycon, wrap maxi, tennis dress)
• 7 Activewear (seamless sports bra, training shorts, running singlet, cropped hoodie, yoga pants, track jacket, cycling shorts)
• 7 More items (oversized hoodie, mock neck sweater, cable knit cardigan, polo, utility vest, satin blouse, pleated wide leg pant, graphic sweatshirt)
• 6 Additional items (tailored jumpsuit, sweatpants, ribbed tank, shacket, tennis skirt, crewneck sweatshirt)

Now I'll update the header to replace the search icon with a personalize button on mobile. The StyleSelector will be shown directly in the header on mobile instead of requiring users to open the menu.

Now let me update the StyleSelector to have a better compact mobile view that fits nicely in the header.

I've made the following changes:

1. Removed the search icon on mobile - Search is now hidden on mobile (hidden sm:flex) and only shows on tablet and larger screens
2. Made the StyleSelector always visible - It's no longer wrapped in a hidden sm:block div, so it shows in the header on all screen sizes
3. Optimized the StyleSelector button for mobile - Smaller height (h-9 vs h-10), tighter padding (px-2 vs px-3), smaller font size (10px vs 12px) on mobile, and the text label is hidden on very small screens while showing just the sparkle icon