Hi there,
After several rounds of customisations using Ai my mobile view of the store is broken.
My store is: https://modistore.co.uk/
Ai has attempted many times to look for errors however the problem is still persisting.
If someone could take a look and recommend how I can fix this it would be greatly appreciated.
Hi there,
I checked your code and the issue is coming from a single CSS line in your footer. You currently have width: min-content; applied to the payment icons container.
This property forces the container to shrink to the smallest possible width, which is why your payment icons are not expanding properly across the footer. If you comment out this css property on the div it will adjust as per your mobile screen.
Hey @Andalbutka23
Follow these Steps:
<style>
.footer__payment-icons.mb2 {
width: 100% !important;
}
</style>
RESULT:
Best,
Moeed
In your Shopify Admin go to online store > themes > actions > edit code
Find Asset > base.css and paste this at the bottom of the file:
ul.payment-icons {
display: block;
}
My apologies It’s the wrong store version unfortunately that’s published. The broken version I refer to is far worse than this.
No problem at all, that happens.
Could you please share the correct (broken) version or a preview link of the theme you’re referring to? That will help me better understand the issue.
Once I can see the exact problem, I’ll guide you step by step or fix it for you.
Best regards,
Devcoder 
You can easily share a preview link to your draft theme. Just preview it and use “Copy link” button in the preview bar at the bottom.
Generally, things like this happen when you’ve made errors while editing your theme CSS assets.
Try to track what edits you’ve done and undo them.
Another option is to copy/paste file contents from the older backup copy of the theme.
Hey @Andalbutka23, It’s always better to separate the desktop from the mobile design to avoid these kind of problems
Hi @tim_tairli yes there must have been some css changes (though ai has inspected the custom.css on numerous occasions to find it clean). Here’s a link to the preview you requested: https://awloor4rc9zqqnr3-78428864837.shopifypreview.com
The code in your theme.css looks terrible with these repetitive media queries,
but here is the source of your problem – you have media query which have a missing closing curly brace.
I see it in line 9066 and your site goes back to normal if I comment the media query line:
before / after
Or you need to add an extra closing brace in/after line 9072.
Then you need to fix your payment icons as suggested above…
if my post is helpful, please like it ♡ and mark as a solution -- this will help others find it
Hey @tim_tairli a huge thanks for the brilliant observation 
it worked and cleaned up the broken layout but now the cart and search icons are hidden. If we can render them
back safely then it will be entirely fixed
Can you re-create a preview link as they expire rather quickly…
Hi @tim_tairli . Here is a new preview link: https://hzaw21ilub6ni802-78428864837.shopifypreview.com
Your custom.css contains this – remove it.
.icon-header-button svg:not(.icon-cart) {
display: none !important;
}
HI @tim_tairli It worked and everything is back to normal. Thank you so much for the great solutions which I will mark as successful. I have a few other minor things to address but they can wait.
Hi @Andalbutka23,
When the entire mobile view breaks after several rounds of customizations, I would avoid making more random edits first. It usually helps to narrow down what changed.
I would check these in order:
1. Duplicate or unfinished CSS added by the AI edits
2. Custom code added to theme.liquid or base.css/theme.css
3. Sections that use fixed widths instead of responsive widths
4. Any recently added app blocks or custom scripts
5. Whether an older theme backup still works correctly on mobile
If you have a backup from before the AI changes, duplicate the current theme and compare the two instead of editing the live theme directly.
Also, after the layout is fixed, I would run a general cleanup pass. Broken mobile layouts often come together with old custom code, unused snippets, and scripts that were added during testing.
For that kind of cleanup check, I build Checkpoint: Store Scanner. It can help flag leftover app code, slow scripts, large files, and other store health issues. I would treat it as a secondary check after the immediate mobile issue is fixed.