From 36d3378a4ed1b76f52415e6272ac0f04652cfd82 Mon Sep 17 00:00:00 2001
From: Ayoub-Aguezar-12 <Ayoub.aguezar.dev@gmail.com>
Date: Wed, 4 Feb 2026 05:20:30 +0100
Subject: [PATCH] webUI: serve Tailwind v4 and update deprecated opacity
 utilities

---
 .gitignore                                    | 2 ++
 agentic_security/routes/static.py             | 2 +-
 agentic_security/static/partials/concent.html | 6 +++---
 3 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/.gitignore b/.gitignore
index 4dfe1a2..694f911 100644
--- a/.gitignore
+++ b/.gitignore
@@ -23,3 +23,5 @@ agentic_security/agents/operator_agno.py
 .claude/
 plan.md
 auto_loop.sh
+.venv/
+.cache/
diff --git a/agentic_security/routes/static.py b/agentic_security/routes/static.py
index 2abafd9..b5a838e 100644
--- a/agentic_security/routes/static.py
+++ b/agentic_security/routes/static.py
@@ -115,7 +115,7 @@ async def serve_icon(icon_name: str) -> FileResponse:
 async def proxy_tailwindcss() -> FileResponse:
     """Proxy the Tailwind CSS script."""
     return proxy_external_resource(
-        "https://cdn.tailwindcss.com",
+        "https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4",
         STATIC_DIR / "tailwindcss.js",
         "application/javascript",
     )
diff --git a/agentic_security/static/partials/concent.html b/agentic_security/static/partials/concent.html
index 5f93895..4e4313c 100644
--- a/agentic_security/static/partials/concent.html
+++ b/agentic_security/static/partials/concent.html
@@ -1,5 +1,5 @@
  <div id="consent-modal" v-if="showConsentModal"
-    class="fixed inset-0 bg-black bg-opacity-75 flex justify-center items-center z-50">
+    class="fixed inset-0 bg-black/75 flex justify-center items-center z-50">
     <div
         class="bg-dark-card text-dark-text p-8 rounded-xl shadow-2xl max-w-xl w-full">
         <h2 class="text-2xl font-bold mb-6 text-center">AI Red Team Ethical
@@ -54,12 +54,12 @@ <h2 class="text-2xl font-bold mb-6 text-center">AI Red Team Ethical
         <div class="flex justify-center space-x-4 mt-8">
             <button
                 @click="declineConsent"
-                class="bg-dark-accent-red text-white rounded-lg px-6 py-3 font-medium hover:bg-opacity-80 transition-colors">
+                class="bg-dark-accent-red text-white rounded-lg px-6 py-3 font-medium hover:bg-dark-accent-red/80 transition-colors">
                 Decline
             </button>
             <button
                 @click="acceptConsent"
-                class="bg-dark-accent-green text-dark-bg rounded-lg px-6 py-3 font-medium hover:bg-opacity-80 transition-colors">
+                class="bg-dark-accent-green text-dark-bg rounded-lg px-6 py-3 font-medium hover:bg-dark-accent-green/80 transition-colors">
                 I Agree and Understand
             </button>
         </div>