diff --git a/admin-spa/src/components/nav/SubmenuBar.tsx b/admin-spa/src/components/nav/SubmenuBar.tsx
index 63ba7af..82726c1 100644
--- a/admin-spa/src/components/nav/SubmenuBar.tsx
+++ b/admin-spa/src/components/nav/SubmenuBar.tsx
@@ -12,7 +12,7 @@ export default function SubmenuBar({ items = [] }: Props) {
   if (items.length === 0) return null;
 
   return (
-    <div data-submenubar className="border-b border-border bg-background/95">
+    <div data-submenubar className="border-b border-border bg-background md:bg-background/95 md:backdrop-blur md:supports-[backdrop-filter]:bg-background/60 sticky top-0 z-20">
       <div className="px-4 py-2">
         <div className="flex gap-2 overflow-x-auto no-scrollbar">
           {items.map((it) => {
diff --git a/admin-spa/src/components/ui/searchable-select.tsx b/admin-spa/src/components/ui/searchable-select.tsx
index ef7ebe2..934cbaf 100644
--- a/admin-spa/src/components/ui/searchable-select.tsx
+++ b/admin-spa/src/components/ui/searchable-select.tsx
@@ -22,8 +22,6 @@ export interface Option {
   label: React.ReactNode;
   /** Optional text used for filtering. Falls back to string label or value. */
   searchText?: string;
-  /** Optional icon (base64 image or URL) to display before the label */
-  icon?: string;
 }
 
 interface Props {
@@ -67,12 +65,7 @@ export function SearchableSelect({
           aria-disabled={disabled}
           tabIndex={disabled ? -1 : 0}
         >
-          <div className="flex items-center gap-2 flex-1 min-w-0">
-            {selected?.icon && (
-              <img src={selected.icon} alt="" className="w-5 h-4 object-cover rounded-sm flex-shrink-0" />
-            )}
-            <span className="truncate">{selected ? selected.label : placeholder}</span>
-          </div>
+          {selected ? selected.label : placeholder}
           <ChevronsUpDown className="opacity-50 h-4 w-4 shrink-0" />
         </Button>
       </PopoverTrigger>
@@ -111,10 +104,7 @@ export function SearchableSelect({
                     )}
                   />
                 )}
-                {opt.icon && (
-                  <img src={opt.icon} alt="" className="w-5 h-4 object-cover rounded-sm mr-2 flex-shrink-0" />
-                )}
-                <span className="truncate">{opt.label}</span>
+                {opt.label}
               </CommandItem>
             ))}
           </CommandList>
diff --git a/admin-spa/src/routes/Settings/Store.tsx b/admin-spa/src/routes/Settings/Store.tsx
index 06667dd..d6faed0 100644
--- a/admin-spa/src/routes/Settings/Store.tsx
+++ b/admin-spa/src/routes/Settings/Store.tsx
@@ -10,6 +10,16 @@ import { SearchableSelect } from '@/components/ui/searchable-select';
 import { toast } from 'sonner';
 import flagsData from '@/data/flags.json';
 
+// Convert country code to emoji flag
+function countryCodeToEmoji(countryCode: string): string {
+  if (!countryCode || countryCode.length !== 2) return '';
+  const codePoints = countryCode
+    .toUpperCase()
+    .split('')
+    .map(char => 127397 + char.charCodeAt(0));
+  return String.fromCodePoint(...codePoints);
+}
+
 interface StoreSettings {
   storeName: string;
   contactEmail: string;
@@ -302,16 +312,14 @@ export default function StoreDetailsPage() {
                 ? currency.code 
                 : currency.symbol;
               
-              // Find matching flag data
+              // Find matching flag data and convert to emoji
               const flagInfo = flagsData.find((f: any) => f.code === currency.code);
+              const flagEmoji = flagInfo ? countryCodeToEmoji(flagInfo.countryCode) : '';
               
               return {
                 value: currency.code,
-                label: flagInfo 
-                  ? `${currency.name} (${displaySymbol})`
-                  : `${currency.name} (${displaySymbol})`,
+                label: `${flagEmoji} ${currency.name} (${displaySymbol})`.trim(),
                 searchText: `${currency.code} ${currency.name} ${displaySymbol}`,
-                icon: flagInfo?.flag, // Add flag as icon
               };
             })}
             placeholder="Select currency..."
@@ -439,21 +447,13 @@ export default function StoreDetailsPage() {
           // Find flag for current currency
           const currencyFlag = flagsData.find((f: any) => f.code === settings.currency);
           const currencyInfo = currencies.find((c: any) => c.code === settings.currency);
+          const flagEmoji = currencyFlag ? countryCodeToEmoji(currencyFlag.countryCode) : '';
           
           return (
             <>
-              <div className="flex items-center gap-2">
-                {currencyFlag?.flag && (
-                  <img 
-                    src={currencyFlag.flag} 
-                    alt={currencyFlag.country} 
-                    className="w-6 h-4 object-cover rounded-sm" 
-                  />
-                )}
-                <p className="text-sm font-medium">
-                  Your store is located in {currencyFlag?.country || settings.country}
-                </p>
-              </div>
+              <p className="text-sm font-medium">
+                {flagEmoji} Your store is located in {currencyFlag?.country || settings.country}
+              </p>
               <p className="text-sm text-muted-foreground mt-1">
                 Prices will be displayed in {currencyInfo?.name || settings.currency} • Timezone: {settings.timezone}
               </p>