[MERGE] Forward-port of branch 13.0 to 14.0

extensions/odoo_theme/layout_templates/header.html

@@ -5,7 +5,7 @@
       </a>
 </div>
 {%- include "layout_templates/searchbox.html" %}
-<div class="d-none d-lg-flex">
+<div class="d-none d-lg-flex ms-auto">
     {%- include "layout_templates/language_switcher.html" %}
     {%- include "layout_templates/version_switcher.html" %}
     <a class="btn btn-primary fw_semibold" href="https://odoo.com/trial">Try Odoo for FREE</a>

extensions/odoo_theme/layout_templates/searchbox.html

@@ -1,5 +1,5 @@
 {# NOTE: the 'searchbox' id is used to hook the "Hide Search Matches" button #}
-<div id="searchbox" class="o_search_wrapper flex-grow-1 pe-lg-2" role="search">
+<div id="searchbox" class="o_search_wrapper pe-lg-2" role="search">
     <form class="o_search" action="{{ pathto('search') }}" method="get">
         <input type="text" name="q" id="q" class="form-control rounded-pill" placeholder="What are you looking for?">
         <input type="hidden" name="area" value="default">

extensions/odoo_theme/layout_templates/version_switcher.html

@@ -1,5 +1,5 @@
 <div class="o_versions row gx-2 me-3">
-	<div class="col col-form-label">
+	<div class="col align-self-center">
     	<label class="fw_bold small ms-2">Version</label>
     </div>
     <div class="col">

extensions/odoo_theme/static/style.scss

@@ -88,6 +88,7 @@ header.o_main_header {
 
     .o_search_wrapper {
         display: flex;
+        position: relative;
         opacity: 1;
         @include transition(opacity .3s);
         @include media-breakpoint-down(lg) {
@@ -95,14 +96,16 @@ header.o_main_header {
             position: absolute;
             width: calc(100% - (#{$padding-s} * 2));
             top: calc(100% + #{$padding-s});
-       }
+        }
+        @include media-breakpoint-up(lg) {
+            flex-grow: 1;
+            max-width: 500px;
+        }
 
         .o_search {
             position: relative;
             width: 100%;
-            @include media-breakpoint-up(lg) {
-                max-width: 500px;
-            }
+
 
             .btn {
                 @include o-position-absolute($top: 50%, $right: 1rem);
@@ -123,17 +126,10 @@ header.o_main_header {
     }
 
     .highlight-link {
-        @media only screen and (max-width: 1242px) and (min-width: 992px){
-            position: absolute;
-            bottom: 0;
-        }
+        @include o-position-absolute($bottom: -1.5rem, $right: 1rem);
         margin-bottom: 0;
-        padding: 0 1rem;
-        text-align: center;
-        align-self: center;
-
         a {
-            @include font-size($font-size-secondary);
+            @include font-size(12px);
         }
     }