Mise en place de l'authentification Keycloak

styles.css

@@ -1047,6 +1047,36 @@ body[data-page="cube"] .zone-button.cube-hold-ready::after {
   margin-top: 1.2rem;
 }
 
+.user-access-bar {
+  display: grid;
+  gap: 0.9rem;
+  margin-top: 1rem;
+  padding: 1rem;
+  border-radius: 24px;
+  border: 1px solid var(--panel-border);
+  background: rgba(12, 14, 20, 0.76);
+}
+
+.user-access-copy {
+  display: grid;
+  gap: 0.35rem;
+}
+
+.user-access-copy strong {
+  font-size: 1.02rem;
+}
+
+.user-access-meta {
+  color: var(--muted);
+  line-height: 1.45;
+}
+
+.user-access-actions {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.75rem;
+}
+
 .rule-metrics {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
@@ -1310,12 +1340,23 @@ body[data-page="cube"] .zone-button.cube-hold-ready::after {
     text-align: center;
   }
 
+  .user-access-bar {
+    grid-template-columns: 1fr;
+  }
+
   .brand-link,
   .utility-button {
     justify-self: center;
   }
 }
 
+@media (min-width: 720px) {
+  .user-access-bar {
+    grid-template-columns: minmax(0, 1fr) auto;
+    align-items: center;
+  }
+}
+
 @media (max-width: 900px) {
   .phase-body {
     overflow-y: auto;