diff --git a/src/BootstrapAdminUi/assets/styles/_alert.scss b/src/BootstrapAdminUi/assets/styles/_alert.scss
index d5573a82..65e27c76 100644
--- a/src/BootstrapAdminUi/assets/styles/_alert.scss
+++ b/src/BootstrapAdminUi/assets/styles/_alert.scss
@@ -6,9 +6,3 @@
  * For the full copyright and license information, please view the LICENSE
  * file that was distributed with this source code.
  */
-
-.sylius {
-    &.alert {
-        background-color: #fff;
-    }
-}
diff --git a/src/BootstrapAdminUi/public/app.css b/src/BootstrapAdminUi/public/app.css
index d8f04462..fcb1f7ed 100644
--- a/src/BootstrapAdminUi/public/app.css
+++ b/src/BootstrapAdminUi/public/app.css
@@ -34,7 +34,7 @@
  *
  * For the full copyright and license information, please view the LICENSE
  * file that was distributed with this source code.
- */.sylius.alert{background-color:#fff}/*!
+ *//*!
  * This file is part of the Sylius package.
  *
  * (c) Sylius Sp. z o.o.
diff --git a/src/BootstrapAdminUi/public/app.rtl.css b/src/BootstrapAdminUi/public/app.rtl.css
index 08fbbd78..a17481f7 100644
--- a/src/BootstrapAdminUi/public/app.rtl.css
+++ b/src/BootstrapAdminUi/public/app.rtl.css
@@ -34,7 +34,7 @@
  *
  * For the full copyright and license information, please view the LICENSE
  * file that was distributed with this source code.
- */.sylius.alert{background-color:#fff}/*!
+ *//*!
  * This file is part of the Sylius package.
  *
  * (c) Sylius Sp. z o.o.
diff --git a/src/BootstrapAdminUi/templates/shared/crud/common/content/flashes.html.twig b/src/BootstrapAdminUi/templates/shared/crud/common/content/flashes.html.twig
index f0982812..6dd3648e 100644
--- a/src/BootstrapAdminUi/templates/shared/crud/common/content/flashes.html.twig
+++ b/src/BootstrapAdminUi/templates/shared/crud/common/content/flashes.html.twig
@@ -12,34 +12,30 @@
         {% for type in ['success', 'error', 'info', 'warning'] %}
             {% for flash in session.flashbag.get(type) %}
                 <div
-                    class="mt-3 sylius alert alert-{{ type == 'error' ? 'danger' : type }}"
+                    class="mt-3 sylius alert alert-{{ type == 'error' ? 'danger' : type }} alert-dismissible"
                     role="alert"
                     {{ sylius_test_html_attribute('sylius-flash-message') }}
                     {{ sylius_test_html_attribute('sylius-flash-message-type', type) }}
                 >
-                    <div class="d-flex justify-content-between">
-                        <div class="d-flex">
-                            <div>
-                                {{ ux_icon(icons[type]) }}
-                            </div>
-                            <div class="mx-2">
-                                <h4 class="alert-title">
-                                    {% set header = 'sylius.ui.' ~ type %}
-                                    {{ header|trans }}
-                                </h4>
-                                <div class="text-secondary">
-                                    {% if flash is iterable %}
-                                        {{ flash.message|trans(flash.parameters, 'flashes') }}
-                                    {% else %}
-                                        {{ flash|trans({}, 'flashes') }}
-                                    {% endif %}
-                                </div>
-                            </div>
+                    <div class="alert-icon">
+                        {{ ux_icon(icons[type]) }}
+                    </div>
+                    <div>
+                        <h4 class="alert-heading">
+                            {% set header = 'sylius.ui.' ~ type %}
+                            {{ header|trans }}
+                        </h4>
+                        <div class="alert-description">
+                            {% if flash is iterable %}
+                                {{ flash.message|trans(flash.parameters, 'flashes') }}
+                            {% else %}
+                                {{ flash|trans({}, 'flashes') }}
+                            {% endif %}
                         </div>
-                        <span class="justify-self-end close" data-bs-dismiss="alert" aria-label="Close">
-                            {{ ux_icon('tabler:x') }}
-                        </span>
                     </div>
+                    <a class="btn-close" data-bs-dismiss="alert" aria-label="close">
+                        {{ ux_icon('tabler:x') }}
+                    </a>
                 </div>
             {% endfor %}
         {% endfor %}
diff --git a/src/BootstrapAdminUi/templates/shared/crud/common/sidebar/search.html.twig b/src/BootstrapAdminUi/templates/shared/crud/common/sidebar/search.html.twig
index 72cd4cab..4cabdabf 100644
--- a/src/BootstrapAdminUi/templates/shared/crud/common/sidebar/search.html.twig
+++ b/src/BootstrapAdminUi/templates/shared/crud/common/sidebar/search.html.twig
@@ -1,5 +1,5 @@
 <div class="input-group ps-2 pt-2 pb-3 menu-search">
     <button class="btn btn-sm" type="button" disabled data-menu-search-icon>{{ ux_icon('tabler:search', {'class': 'icon mx-1'}) }}</button>
-    <button class="btn btn-sm" type="button" data-menu-search-clear>{{ ux_icon('tabler:x', {'class': 'icon mx-1'}) }}</button>
-    <input class="form-control form-control-sm" placeholder="{{ 'sylius.ui.search_menu'|trans }}..." type="text" data-menu-search>
+    <button class="btn btn-sm btn-dark" type="button" data-menu-search-clear>{{ ux_icon('tabler:x', {'class': 'icon mx-1'}) }}</button>
+    <input class="form-control form-control-sm text-white" placeholder="{{ 'sylius.ui.search_menu'|trans }}..." type="text" data-menu-search>
 </div>
diff --git a/src/BootstrapAdminUi/templates/shared/crud/index/content/grid/data_table.html.twig b/src/BootstrapAdminUi/templates/shared/crud/index/content/grid/data_table.html.twig
index ea2a7efa..cc7657f7 100644
--- a/src/BootstrapAdminUi/templates/shared/crud/index/content/grid/data_table.html.twig
+++ b/src/BootstrapAdminUi/templates/shared/crud/index/content/grid/data_table.html.twig
@@ -35,7 +35,7 @@
                 </tbody>
             </table>
         </div>
-        <div class="card-footer d-flex align-items-center">
+        <div class="card-footer d-flex align-items-center gap-2 flex-wrap">
             <div class="text-muted">
                 {{ pagination.results_count(data) }}
             </div>