From 1aa09657f2296042bccc45bb0016b794b905c366 Mon Sep 17 00:00:00 2001
From: anielsen99 <amanda.nielsen@gmx.ch>
Date: Wed, 25 Mar 2026 18:15:50 +0100
Subject: [PATCH] add active state to product-card

---
 parfum-shop/src/App.css | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/parfum-shop/src/App.css b/parfum-shop/src/App.css
index 8ad40df..4390ad9 100644
--- a/parfum-shop/src/App.css
+++ b/parfum-shop/src/App.css
@@ -156,6 +156,8 @@
   display: flex;
   flex-direction: column;
   justify-content: space-between;
+  cursor: pointer;
+  transition: transform 0.15s ease, border-color 0.15s ease;
 }
 
 .product-card:focus-visible {
@@ -201,6 +203,11 @@
   );
 }
 
+.product-card:active {
+  transform: scale(0.97);
+  border-color: #ff6a00;
+}
+
 .product-top {
   position: relative;
   z-index: 4;
@@ -287,6 +294,16 @@
   mix-blend-mode: difference;
 }
 
+.product-card:active .product-id,
+.product-card:active .product-top h3,
+.product-card:active .product-bottom p,
+.product-card:active .arrow {
+  color: #ff6a00;
+  mix-blend-mode: normal;
+  transform: scale(1.02);
+  transition: all 0.1s ease;
+}
+
 /* DISCOVERY */
 .discovery-section {
   display: grid;