Merge pull request #126 from RivianTrackr/claude/ai-tire-recommendations-fzXNi

Force flex layout with inline styles to prevent theme overrides

Author: RivianTrackr

frontend/templates/tire-guide.php

@@ -15,13 +15,13 @@
   <div class="filter-body">
     <?php if ( RTG_AI::is_enabled() ) : ?>
     <div id="rtgAiWrapper" class="rtg-ai-section">
-      <div class="rtg-ai-row">
-        <div class="search-container">
+      <div class="rtg-ai-row" style="display: flex !important; align-items: center !important; gap: 8px !important;">
+        <div class="search-container" style="flex: 1 !important; min-width: 0 !important;">
           <label for="rtgAiInput" class="screen-reader-text">Ask AI for tire recommendations</label>
           <input id="rtgAiInput" type="text" class="search-input rtg-ai-input" placeholder="AI: &quot;Best winter tire for 20 inch wheels&quot;" maxlength="500" aria-label="Ask AI for tire recommendations" />
           <i class="fa-solid fa-wand-magic-sparkles search-icon rtg-ai-icon" aria-hidden="true"></i>
         </div>
-        <button id="rtgAiSubmit" class="rtg-ai-submit" type="button" aria-label="Get AI recommendations">
+        <button id="rtgAiSubmit" class="rtg-ai-submit" type="button" aria-label="Get AI recommendations" style="flex-shrink: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; width: 44px !important; height: 44px !important; min-width: 44px !important; padding: 0 !important; margin: 0 !important; position: static !important; transform: none !important;">
           <i class="fa-solid fa-arrow-right" aria-hidden="true"></i>
         </button>
       </div>