From 64147303dbea6ac05e5e085e10760c4fc3a4727c Mon Sep 17 00:00:00 2001
From: FIN-IT_AndriFP <andrifebriyadiputra@gmail.com>
Date: Wed, 11 Feb 2026 14:12:00 +0700
Subject: fix layout spec

---
 .../components/ProductComparisonModal.tsx          | 29 ++++++++++++++++++----
 1 file changed, 24 insertions(+), 5 deletions(-)

(limited to 'src-migrate/modules/product-detail/components/ProductComparisonModal.tsx')

diff --git a/src-migrate/modules/product-detail/components/ProductComparisonModal.tsx b/src-migrate/modules/product-detail/components/ProductComparisonModal.tsx
index b5676ac8..5dd3f175 100644
--- a/src-migrate/modules/product-detail/components/ProductComparisonModal.tsx
+++ b/src-migrate/modules/product-detail/components/ProductComparisonModal.tsx
@@ -523,9 +523,11 @@ const ProductComparisonModal = ({ isOpen, onClose, mainProduct, selectedVariant
               <InputGroup size="sm">
                 <AutoCompleteInput
                   variant="outline"
-                  // fontSize="xs"
-                  fontSize={{ base: '16px', md: 'sm' }} // fix font size mobile
-                  borderRadius="md"
+                  fontSize="sm"
+                  _focus={{
+                    fontSize: {base: '16px', md: 'sm'},
+                    borderColor: 'red.500',
+                  }}borderRadius="md"
                   placeholder="Cari Varian..."
                   value={product.inputValue}
                   onChange={(e) => handleInputChange(index, e.target.value)}
@@ -640,8 +642,25 @@ const ProductComparisonModal = ({ isOpen, onClose, mainProduct, selectedVariant
               <InputGroup size="sm">
                 <InputLeftElement pointerEvents="none"><Icon as={Search} color="gray.300" /></InputLeftElement>
                 <Input
-                  placeholder="Cari Produk..." borderRadius="md"
-                  fontSize={{ base: '16px', md: 'sm' }} // fix font size mobile
+                  placeholder="Cari Produk..."
+                  borderRadius="md"
+                  fontSize="16px"
+                  sx={{
+                    base: {
+                        transform: "scale(0.875)",       // Kecilkan visual jadi setara 14px (sm)
+                        transformOrigin: "left center",
+                        width: "114.29%",                // Kompensasi lebar
+                        marginBottom: "-2px",
+                        marginRight: "-14.29%"
+                    },
+                    md: {
+                        fontSize: "sm",       // Di Desktop pakai ukuran asli (14px)
+                        transform: "none",
+                        width: "100%",
+                        marginBottom: "0",
+                        marginRight: "0"
+                    }
+                  }}
                   value={activeSearchSlot === index ? searchQuery : ''}
                   onFocus={() => { setActiveSearchSlot(index); setSearchQuery(''); }}
                   onChange={(e) => setSearchQuery(e.target.value)}
-- 
cgit v1.2.3