Fix toast long messages and update toast styles

brasilio_auth/templates/brasilio_auth/login.html

@@ -36,6 +36,7 @@
           placeholder="Usuário" aria-label="Usuário"
           aria-describedby="Campo usuário"
           required
+          autofocus
       >
     </div>
     <div class="input-group input-group-lg mb-4">

templates/includes/toast.html

@@ -1,16 +1,10 @@
-<div
-  class="toast align-items-center text-white bg-{{type}} bg-gradient border-0 fw-bold p-1"
-  role="alert"
-  aria-live="assertive"
-  aria-atomic="true"
->
-  <div class="d-flex">
-    <div class="toast-body">{{ message }}</div>
-    <button
-      type="button"
-      class="btn-close btn-close-white me-2 m-auto"
-      data-bs-dismiss="toast"
-      aria-label="Close"
-    ></button>
+<div class="toast" role="alert" aria-live="assertive" aria-atomic="true">
+  <div class="toast-header">
+    <div class="rounded me-2 p-2 bg-{{type}}"></div>
+    <strong class="me-auto">Brasil.io</strong>
+    <button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>
+  </div>
+  <div class="toast-body">
+    {{ message }}
   </div>
 </div>