From a19692e9a42be0f48a62dbdb1ea5689b21cef04a Mon Sep 17 00:00:00 2001
From: oimwiodev <fedora-heremes@me.com>
Date: Fri, 26 Jun 2026 21:31:26 +0100
Subject: [PATCH] Temu-style speed: faster animations, flash border, aggressive
 urgency

---
 templates/index.html | 30 +++++++++++++++++++-----------
 1 file changed, 19 insertions(+), 11 deletions(-)

diff --git a/templates/index.html b/templates/index.html
index e6873b5..c3b00ad 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -94,36 +94,44 @@
     padding: 5px 12px; border-radius: 5px;
     font-size: 11px; font-weight: 700; letter-spacing: 0.5px;
     z-index: 2;
-    animation: glow 2s ease-in-out infinite;
+    animation: glow 0.8s ease-in-out infinite;
   }
   @keyframes glow {
     0%, 100% { box-shadow: 0 0 8px rgba(59,130,246,0.3); }
-    50% { box-shadow: 0 0 20px rgba(59,130,246,0.6); }
+    50% { box-shadow: 0 0 25px rgba(59,130,246,0.8); }
   }
 
   /* ── Limited offer ── */
   .old-price { text-decoration:line-through; color:var(--muted); font-size:18px; font-weight:400; }
-  .deal-price { font-size:32px; font-weight:800; color:#22c55e; animation: dealPulse 1.5s ease-in-out infinite; }
+  .deal-price { font-size:32px; font-weight:800; color:#22c55e; animation: dealPulse 0.7s ease-in-out infinite; }
   @keyframes dealPulse {
     0%, 100% { transform:scale(1); }
-    50% { transform:scale(1.04); }
+    25% { transform:scale(1.06); }
+    75% { transform:scale(1.06); }
   }
   .limited-tag { 
     display:inline-block; background:#ef4444; color:#fff; 
     padding:3px 10px; border-radius:4px; font-size:11px; font-weight:700;
-    animation: blink 1s ease-in-out infinite; margin-top:4px;
+    animation: blink 0.5s ease-in-out infinite; margin-top:4px;
   }
   @keyframes blink {
     0%, 100% { opacity:1; }
-    50% { opacity:0.5; }
+    50% { opacity:0.2; }
   }
-  .hurry-text { font-size:11px; color:#ef4444; font-weight:600; margin-top:6px; animation: shake 0.5s ease-in-out infinite; }
+  .hurry-text { font-size:11px; color:#ef4444; font-weight:600; margin-top:6px; animation: shake 0.3s ease-in-out infinite; }
   @keyframes shake {
     0%, 100% { transform:translateX(0); }
-    25% { transform:translateX(-2px); }
-    75% { transform:translateX(2px); }
+    25% { transform:translateX(-3px); }
+    75% { transform:translateX(3px); }
+  }
+  .btn-shake { animation: shake 0.4s ease-in-out infinite; }
+
+  /* ── Flash overlay ── */
+  .pricing-card.flash-deal { border-color:#ef4444; animation: flashBorder 0.8s ease-in-out infinite; }
+  @keyframes flashBorder {
+    0%, 100% { border-color:#ef4444; box-shadow:0 0 0 rgba(239,68,68,0); }
+    50% { border-color:#ff6b6b; box-shadow:0 0 15px rgba(239,68,68,0.3); }
   }
-  .btn-shake { animation: shake 0.6s ease-in-out infinite; }
 
   /* Why */
   .reasons { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:24px; }
@@ -383,7 +391,7 @@ async function loadPricing() {
            <div class="hurry-text">${lang==='fr'?'⭐ Dépêchez-vous !':"⭐ Hurry!"}</div>`
         : `<div class="price">${Number(t.sell_price).toLocaleString('fr-MA')} <small>MAD</small></div>`;
       return `
-      <div class="pricing-card">
+      <div class="pricing-card ${isAtlas ? 'flash-deal' : ''}">
         ${isAtlas ? '<div class="promo-badge">LE BON CHOIX</div>' : ''}
         <h3>${t.name}</h3>
         ${priceHTML}