Unable to call CSS and JS Reference in Search Display Templates

Hi

Context:    I am trying to brand the enterprise search results hover panel (Preview Panel) as I marked with red square box in the screen shot and  I tried with inline styling for one of the HTML Files called “Item_CommonHoverPanel_Actions.html” which is present in the “masterpage/display templates/search/” path and when I looked at the code, it is completely different than normal styling and any way I applied inline styles to the one of the div (belongs to “OPEN”) and style is applied.

Problem: How to brand those display templates, applying custom CSS and custom javascript code or client object model for a button.

Problem Description:

Say I want to put a button named “ Save “ and on click I want that list item to be moved into SavedList. When I trying to add client object model code to that button, its not functioning. So as my custom style sheets for those templates.  

I have gone through so many solutions but every one say that include <script> tag below the body tag and refer CSS and JS files over there and I have tried but CSS and scripting is not applied.

Recommended Solution: I am giving some code what I have written in the script tag and tried to override some of the classes  in these CSS but not applied for existing display templates.

                                                      <script>                                                              $includeCSS(this.url,"~sitecollection/Styles/testResult.css");                                                      $includeScript(this.url,"~sitecollection/Scripts/Search.js");

                                        </script>

Kindly let me know any quick and best solutions for existing and proposed templates so that I can modify my existing code.  

Thanks

Razvi444