Highlight current product variation

src/pages/ProductDetails.tsx

@@ -619,7 +619,11 @@ const ProductDetails = () => {
               const metadata = parseProductName(variant.name);
 
               return (
-                <div key={variant.id} className="rounded-xl border border-dark-border bg-dark-input/45 p-4">
+                <div key={variant.id} className={`rounded-xl border p-4 ${
+                  variant.id === productInfo.id
+                    ? 'border-brand-primary/50 bg-brand-primary/10 shadow-sm shadow-brand-primary/10'
+                    : 'border-dark-border bg-dark-input/45'
+                }`}>
                   <div className="flex flex-col gap-2 md:flex-row md:items-start md:justify-between">
                     <div className="min-w-0">
                       <Link to={`/products/${variant.id}`} className="block truncate text-sm font-bold text-dark-text transition-colors hover:text-brand-primary hover:underline" title={`Ver produto ${variant.name}`}>