Index: src/main/java/mk/ukim/finki/synergymed/config/RoleResolver.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/config/RoleResolver.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
+++ src/main/java/mk/ukim/finki/synergymed/config/RoleResolver.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -0,0 +1,36 @@
+package mk.ukim.finki.synergymed.config;
+
+import lombok.RequiredArgsConstructor;
+import mk.ukim.finki.synergymed.repositories.AdminRepository;
+import mk.ukim.finki.synergymed.repositories.PharmacistRepository;
+import mk.ukim.finki.synergymed.repositories.ClientRepository;
+import org.springframework.security.core.authority.SimpleGrantedAuthority;
+import org.springframework.stereotype.Component;
+
+import java.util.ArrayList;
+import java.util.List;
+
+@Component
+@RequiredArgsConstructor
+public class RoleResolver {
+
+    private final AdminRepository adminRepo;
+    private final PharmacistRepository pharmacistRepo;
+    private final ClientRepository clientRepo;
+
+    // Returns raw roles: e.g., ["ADMIN","PHARMACIST","CLIENT"]
+    public List<String> rolesForUser(Integer userId) {
+        List<String> roles = new ArrayList<>();
+        if (adminRepo.existsById(userId)) roles.add("ADMIN");
+        if (pharmacistRepo.existsById(userId)) roles.add("PHARMACIST");
+        if (clientRepo.existsById(userId)) roles.add("CLIENT");
+        return roles;
+    }
+
+    public List<SimpleGrantedAuthority> authoritiesForUser(Integer userId) {
+        List<String> roles = rolesForUser(userId);
+        return roles.stream()
+                .map(r -> new SimpleGrantedAuthority("ROLE_" + r))
+                .toList();
+    }
+}
Index: src/main/java/mk/ukim/finki/synergymed/models/PharmacyCatalogId.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/models/PharmacyCatalogId.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/models/PharmacyCatalogId.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -3,5 +3,7 @@
 import jakarta.persistence.Column;
 import jakarta.persistence.Embeddable;
+import lombok.AllArgsConstructor;
 import lombok.Getter;
+import lombok.NoArgsConstructor;
 import lombok.Setter;
 import org.hibernate.Hibernate;
@@ -13,4 +15,6 @@
 @Setter
 @Embeddable
+@NoArgsConstructor
+@AllArgsConstructor
 public class PharmacyCatalogId implements Serializable {
     private static final long serialVersionUID = 1717201987474340712L;
Index: src/main/java/mk/ukim/finki/synergymed/repositories/AdminRepository.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/repositories/AdminRepository.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/repositories/AdminRepository.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -5,3 +5,5 @@
 
 public interface AdminRepository extends JpaRepository<Admin, Integer> {
+    boolean existsById(Integer userId);
+
 }
Index: src/main/java/mk/ukim/finki/synergymed/repositories/BrandedmedicineRepository.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/repositories/BrandedmedicineRepository.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/repositories/BrandedmedicineRepository.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -3,5 +3,20 @@
 import mk.ukim.finki.synergymed.models.Brandedmedicine;
 import org.springframework.data.jpa.repository.JpaRepository;
+import org.springframework.data.jpa.repository.Query;
+import org.springframework.data.repository.query.Param;
+
+import java.util.List;
 
 public interface BrandedmedicineRepository extends JpaRepository<Brandedmedicine, Integer> {
+    @Query(value = """
+        select distinct bm.*
+        from synergymed.brandedmedicine bm
+        join synergymed.inventory_brandedmedicine ibm on ibm.branded_medicine_id = bm.id
+        join synergymed.inventory i on i.id = ibm.inventory_id
+        join synergymed.facility f on f.id = i.facility_id
+        join synergymed.company c on c.id = f.company_id
+        join synergymed.pharmacy p on p.company_id = c.id
+        where p.id = :pharmacyId
+        """, nativeQuery = true)
+    List<Brandedmedicine> findAllAvailableForPharmacy(@Param("pharmacyId") Integer pharmacyId);
 }
Index: src/main/java/mk/ukim/finki/synergymed/repositories/ClientRepository.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/repositories/ClientRepository.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/repositories/ClientRepository.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -20,4 +20,6 @@
     Optional<Client> findByUsers(User user);
 
+    boolean existsById(Integer userId);
+
 
 
Index: src/main/java/mk/ukim/finki/synergymed/repositories/InventoryBrandedmedicineRepository.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/repositories/InventoryBrandedmedicineRepository.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/repositories/InventoryBrandedmedicineRepository.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -10,5 +10,7 @@
 import org.springframework.data.repository.query.Param;
 
+import java.util.Collection;
 import java.util.List;
+import java.util.Map;
 
 public interface InventoryBrandedmedicineRepository extends JpaRepository<InventoryBrandedmedicine, InventoryBrandedmedicineId> {
@@ -49,3 +51,30 @@
     List<InventoryBrandedmedicine> lockAllByMedicineInPharmacies(@Param("bmId") Integer bmId);
 
-}
+        @Query("""
+      select ibm.brandedMedicine.id, coalesce(sum(ibm.quantity), 0)
+      from InventoryBrandedmedicine ibm
+      where ibm.brandedMedicine.id in :ids
+      group by ibm.brandedMedicine.id
+    """)
+        List<Object[]> sumByBrandedMedicineIds(@Param("ids") Collection<Integer> ids);
+
+    @Query("""
+      select new map(ibm.brandedMedicine.id as id, sum(ibm.quantity) as qty)
+      from InventoryBrandedmedicine ibm
+      join ibm.inventory inv
+      join inv.facility f
+      join f.company c
+      where ibm.brandedMedicine.id in :ids
+        and exists (
+          select 1 from Pharmacy ph
+          where ph.id = c.id
+        )
+      group by ibm.brandedMedicine.id
+""")
+    List<Map<String,Object>> sumAsMapForPharmacies(@Param("ids") Collection<Integer> ids);
+
+
+
+    }
+
+
Index: src/main/java/mk/ukim/finki/synergymed/repositories/PharmacistRepository.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/repositories/PharmacistRepository.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/repositories/PharmacistRepository.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -5,3 +5,5 @@
 
 public interface PharmacistRepository extends JpaRepository<Pharmacist, Integer> {
+    boolean existsById(Integer userId);
+
 }
Index: src/main/java/mk/ukim/finki/synergymed/repositories/PharmacyCatalogRepository.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/repositories/PharmacyCatalogRepository.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/repositories/PharmacyCatalogRepository.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -4,5 +4,18 @@
 import mk.ukim.finki.synergymed.models.PharmacyCatalogId;
 import org.springframework.data.jpa.repository.JpaRepository;
+import org.springframework.data.jpa.repository.Query;
+import org.springframework.data.repository.query.Param;
+
+import java.util.List;
 
 public interface PharmacyCatalogRepository extends JpaRepository<PharmacyCatalog, PharmacyCatalogId> {
+    @Query("select pc from PharmacyCatalog pc join fetch pc.brandedMedicine bm where pc.pharmacy.id = :pharmacyId")
+    List<PharmacyCatalog> findAllByPharmacyIdWithMedicine(@Param("pharmacyId") Integer pharmacyId);
+
+    @Query("select pc.id.brandedMedicineId from PharmacyCatalog pc where pc.pharmacy.id = :pharmacyId")
+    List<Integer> findAllMedicineIdsInCatalog(@Param("pharmacyId") Integer pharmacyId);
+
+    boolean existsByPharmacy_IdAndBrandedMedicine_Id(Integer pharmacyId, Integer brandedMedicineId);
+
+    void deleteByPharmacy_IdAndBrandedMedicine_Id(Integer pharmacyId, Integer brandedMedicineId);
 }
Index: src/main/java/mk/ukim/finki/synergymed/service/BrandedMedicineService.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/service/BrandedMedicineService.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/service/BrandedMedicineService.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -17,7 +17,6 @@
     void deleteById(Integer id) throws IOException;
 
-    // New service methods so controllers don’t call repositories
     List<Brandedmedicineimage> listImages(Integer brandedMedicineId);
-    String cardImageUrl(Integer brandedMedicineId); // main image or fallback
+    String cardImageUrl(Integer brandedMedicineId);
     Map<Integer,String> cardImageUrlsFor(List<Brandedmedicine> medicines);
 
Index: src/main/java/mk/ukim/finki/synergymed/service/CatalogService.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/service/CatalogService.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
+++ src/main/java/mk/ukim/finki/synergymed/service/CatalogService.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -0,0 +1,16 @@
+package mk.ukim.finki.synergymed.service;
+
+import mk.ukim.finki.synergymed.models.Brandedmedicine;
+
+import java.util.Collection;
+import java.util.List;
+import java.util.Set;
+
+public interface CatalogService {
+    // Read
+    List<Brandedmedicine> listCatalogMedicines(Integer pharmacyId);
+    Set<Integer> listCatalogMedicineIds(Integer pharmacyId);
+
+    // Write (replace the catalog with exactly these ids)
+    void setCatalog(Integer pharmacyId, Collection<Integer> brandedMedicineIds);
+}
Index: src/main/java/mk/ukim/finki/synergymed/service/PaymentService.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/service/PaymentService.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/service/PaymentService.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -6,4 +6,7 @@
 
 public interface PaymentService {
+    Clientorder checkout(Client client, Shoppingcart cart,
+                         Integer paymentMethodId, Integer deliveryCompanyId,
+                         boolean useCard);
     Clientorder checkout(Client client, Shoppingcart cart, Integer paymentMethodId, Integer deliveryCompanyId);
 }
Index: src/main/java/mk/ukim/finki/synergymed/service/ShoppingCartService.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/service/ShoppingCartService.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/service/ShoppingCartService.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -6,4 +6,5 @@
 
 import java.math.BigDecimal;
+import java.util.Collection;
 import java.util.Map;
 
@@ -16,3 +17,5 @@
     public void decreaseMedicine(Shoppingcart cart, Brandedmedicine medicine);
     Shoppingcart getOrCreateCart(Client client);
+    Map<Integer, Integer> getMaxAvailableFor(Collection<Integer> brandedMedicineIds);
+
 }
Index: src/main/java/mk/ukim/finki/synergymed/service/impl/BrandedMedicineServiceImpl.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/service/impl/BrandedMedicineServiceImpl.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/service/impl/BrandedMedicineServiceImpl.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -11,4 +11,6 @@
 import org.springframework.beans.factory.annotation.Value;
 import org.springframework.stereotype.Service;
+import org.springframework.transaction.annotation.Isolation;
+import org.springframework.transaction.annotation.Propagation;
 import org.springframework.transaction.annotation.Transactional;
 import org.springframework.web.multipart.MultipartFile;
@@ -78,5 +80,10 @@
 
     @Override
-    @Transactional
+    @Transactional(
+            rollbackFor = { Exception.class, java.io.IOException.class },
+            isolation = Isolation.READ_COMMITTED,
+            propagation = Propagation.REQUIRED,
+            timeout = 30
+    )
     public void saveAll(Integer id,
                         Integer manufacturerId,
Index: src/main/java/mk/ukim/finki/synergymed/service/impl/CatalogServiceImpl.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/service/impl/CatalogServiceImpl.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
+++ src/main/java/mk/ukim/finki/synergymed/service/impl/CatalogServiceImpl.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -0,0 +1,75 @@
+package mk.ukim.finki.synergymed.service.impl;
+
+import org.springframework.transaction.annotation.Transactional;
+import lombok.RequiredArgsConstructor;
+import mk.ukim.finki.synergymed.models.Brandedmedicine;
+import mk.ukim.finki.synergymed.models.Pharmacy;
+import mk.ukim.finki.synergymed.models.PharmacyCatalog;
+import mk.ukim.finki.synergymed.models.PharmacyCatalogId;
+import mk.ukim.finki.synergymed.repositories.BrandedmedicineRepository;
+import mk.ukim.finki.synergymed.repositories.PharmacyCatalogRepository;
+import mk.ukim.finki.synergymed.repositories.PharmacyRepository;
+import mk.ukim.finki.synergymed.service.CatalogService;
+import org.springframework.stereotype.Service;
+
+import java.util.*;
+import java.util.stream.Collectors;
+
+@Service
+@RequiredArgsConstructor
+@Transactional
+public class CatalogServiceImpl implements CatalogService {
+
+    private final PharmacyCatalogRepository catalogRepo;
+    private final BrandedmedicineRepository bmRepo;
+    private final PharmacyRepository pharmacyRepo;
+
+    @Override
+    public List<Brandedmedicine> listCatalogMedicines(Integer pharmacyId) {
+        return catalogRepo.findAllByPharmacyIdWithMedicine(pharmacyId)
+                .stream()
+                .map(PharmacyCatalog::getBrandedMedicine)
+                .collect(Collectors.toList());
+    }
+
+    @Override
+    public Set<Integer> listCatalogMedicineIds(Integer pharmacyId) {
+        return new HashSet<>(catalogRepo.findAllMedicineIdsInCatalog(pharmacyId));
+    }
+
+    @Override
+    public void setCatalog(Integer pharmacyId, Collection<Integer> brandedMedicineIds) {
+        Set<Integer> desired = brandedMedicineIds == null ? Set.of() : new HashSet<>(brandedMedicineIds);
+
+        // Current
+        Set<Integer> current = listCatalogMedicineIds(pharmacyId);
+
+        // To add and to remove
+        Set<Integer> toAdd = new HashSet<>(desired);
+        toAdd.removeAll(current);
+
+        Set<Integer> toRemove = new HashSet<>(current);
+        toRemove.removeAll(desired);
+
+        // Add
+        if (!toAdd.isEmpty()) {
+            Pharmacy pharmacy = pharmacyRepo.findById(pharmacyId)
+                    .orElseThrow(() -> new IllegalArgumentException("Pharmacy not found: " + pharmacyId));
+            List<Brandedmedicine> addEntities = bmRepo.findAllById(toAdd);
+            List<PharmacyCatalog> newLinks = new ArrayList<>(addEntities.size());
+            for (Brandedmedicine bm : addEntities) {
+                PharmacyCatalog pc = new PharmacyCatalog();
+                pc.setId(new PharmacyCatalogId(pharmacy.getId(), bm.getId()));
+                pc.setPharmacy(pharmacy);
+                pc.setBrandedMedicine(bm);
+                newLinks.add(pc);
+            }
+            catalogRepo.saveAll(newLinks);
+        }
+
+        // Remove
+        for (Integer bmId : toRemove) {
+            catalogRepo.deleteByPharmacy_IdAndBrandedMedicine_Id(pharmacyId, bmId);
+        }
+    }
+}
Index: src/main/java/mk/ukim/finki/synergymed/service/impl/FacilityServiceImpl.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/service/impl/FacilityServiceImpl.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/service/impl/FacilityServiceImpl.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -1,5 +1,5 @@
 package mk.ukim.finki.synergymed.service.impl;
 
-import jakarta.transaction.Transactional;
+import org.springframework.transaction.annotation.Transactional;
 import mk.ukim.finki.synergymed.models.*;
 import mk.ukim.finki.synergymed.repositories.FacilityRepository;
Index: src/main/java/mk/ukim/finki/synergymed/service/impl/InventoryServiceImpl.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/service/impl/InventoryServiceImpl.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/service/impl/InventoryServiceImpl.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -1,5 +1,5 @@
 package mk.ukim.finki.synergymed.service.impl;
 
-import jakarta.transaction.Transactional;
+import org.springframework.transaction.annotation.Transactional;
 import mk.ukim.finki.synergymed.models.Facility;
 import mk.ukim.finki.synergymed.models.Inventory;
Index: src/main/java/mk/ukim/finki/synergymed/service/impl/PaymentServiceImpl.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/service/impl/PaymentServiceImpl.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/service/impl/PaymentServiceImpl.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -1,5 +1,5 @@
 package mk.ukim.finki.synergymed.service.impl;
 
-import jakarta.transaction.Transactional;
+import org.springframework.transaction.annotation.Transactional;
 import lombok.RequiredArgsConstructor;
 import mk.ukim.finki.synergymed.models.*;
@@ -7,5 +7,7 @@
 import mk.ukim.finki.synergymed.service.PaymentService;
 import mk.ukim.finki.synergymed.service.ShoppingCartService;
+import mk.ukim.finki.synergymed.service.ClubCardService; // NEW
 import org.springframework.stereotype.Service;
+import org.springframework.transaction.annotation.Isolation;
 
 import java.math.BigDecimal;
@@ -15,5 +17,4 @@
 @Service
 @RequiredArgsConstructor
-@Transactional
 public class PaymentServiceImpl implements PaymentService {
 
@@ -24,9 +25,31 @@
     private final DeliverycompanyRepository deliveryRepo;
     private final InventoryBrandedmedicineRepository inventoryBrandedmedicineRepository;
+    private final ClubCardService clubCardService; // NEW
 
     @Override
     public Clientorder checkout(Client client, Shoppingcart cart, Integer paymentMethodId, Integer deliveryCompanyId) {
+        return checkout(client, cart, paymentMethodId, deliveryCompanyId, false);
+    }
 
+    @Override
+    @Transactional(rollbackFor = Exception.class, isolation = Isolation.READ_COMMITTED, timeout = 30)
+    public Clientorder checkout(Client client, Shoppingcart cart, Integer paymentMethodId, Integer deliveryCompanyId, boolean useCard) {
         BigDecimal total = shoppingCartService.getTotal(cart);
+
+        int baseAmount = total.intValue();
+        int discount = 0;
+        if (useCard) {
+            var cardOpt = clubCardService.getByClientId(client.getId());
+            if (cardOpt.isPresent()) {
+                Clubcard card = cardOpt.get();
+                Integer pts = card.getPoints();
+                int points = pts == null ? 0 : pts;
+                discount = Math.min(points / 2, baseAmount);
+                if (discount > 0) {
+                    card.setPoints(0);
+                }
+            }
+        }
+        int finalAmount = Math.max(0, baseAmount - discount);
 
         Paymentmethod method = paymentmethodRepo.findById(paymentMethodId)
@@ -37,12 +60,10 @@
         payment.setPaymentMethod(method);
         payment.setPaymentDate(LocalDate.now());
-        payment.setAmount(total.intValue());
-        payment.setStatus("во тек");
+        payment.setAmount(finalAmount);
+        //payment.setStatus("во тек");
         paymentRepo.save(payment);
-
 
         Deliverycompany deliveryCompany = deliveryRepo.findById(deliveryCompanyId)
                 .orElseThrow(() -> new IllegalArgumentException("Delivery company not found"));
-
 
         Clientorder order = new Clientorder();
@@ -53,5 +74,5 @@
         order.setExpectedArrivalDate(LocalDate.now().plusDays(7));
         order.setStatus("во тек");
-        order.setTotalPrice(total.intValue());
+        order.setTotalPrice(finalAmount);
 
         shoppingCartService.getMedicinesInCart(cart).forEach((medicine, qty) -> {
@@ -59,12 +80,11 @@
             ClientorderBrandedmedicineId id = new ClientorderBrandedmedicineId();
             id.setBrandedMedicineId(medicine.getId());
-
             line.setId(id);
             line.setOrder(order);
             line.setBrandedMedicine(medicine);
             line.setQuantity(qty);
-
             order.getItems().add(line);
         });
+
         for (ClientorderBrandedmedicine line : order.getItems()) {
             int remaining = line.getQuantity();
@@ -84,5 +104,4 @@
 
                 remaining -= take;
-
             }
 
Index: src/main/java/mk/ukim/finki/synergymed/service/impl/PrescriptionServiceImpl.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/service/impl/PrescriptionServiceImpl.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/service/impl/PrescriptionServiceImpl.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -1,5 +1,5 @@
 package mk.ukim.finki.synergymed.service.impl;
 
-import jakarta.transaction.Transactional;
+import org.springframework.transaction.annotation.Transactional;
 import lombok.RequiredArgsConstructor;
 import mk.ukim.finki.synergymed.models.Prescription;
Index: src/main/java/mk/ukim/finki/synergymed/service/impl/ShoppingCartServiceImpl.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/service/impl/ShoppingCartServiceImpl.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/service/impl/ShoppingCartServiceImpl.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -1,7 +1,8 @@
 package mk.ukim.finki.synergymed.service.impl;
 
-import jakarta.transaction.Transactional;
+import org.springframework.transaction.annotation.Transactional;
 import lombok.RequiredArgsConstructor;
 import mk.ukim.finki.synergymed.models.*;
+import mk.ukim.finki.synergymed.repositories.InventoryBrandedmedicineRepository;
 import mk.ukim.finki.synergymed.repositories.ShoppingcartBrandedmedicineRepository;
 import mk.ukim.finki.synergymed.repositories.ShoppingcartRepository;
@@ -10,4 +11,5 @@
 
 import java.math.BigDecimal;
+import java.util.Collection;
 import java.util.HashMap;
 import java.util.List;
@@ -21,4 +23,5 @@
     private final ShoppingcartBrandedmedicineRepository cartMedicineRepo;
     private final ShoppingcartRepository shoppingcartRepo;
+    private final InventoryBrandedmedicineRepository inventoryBrandedmedicineRepository;
 
     @Override
@@ -97,3 +100,31 @@
         cartMedicineRepo.deleteAllByShoppingCart(cart);
     }
-}
+
+
+
+    @Override
+    public Map<Integer, Integer> getMaxAvailableFor(Collection<Integer> brandedMedicineIds) {
+        if (brandedMedicineIds == null || brandedMedicineIds.isEmpty()) {
+            return Map.of();
+        }
+
+        List<Map<String, Object>> rows =
+                inventoryBrandedmedicineRepository.sumAsMapForPharmacies(brandedMedicineIds);
+
+        Map<Integer, Integer> out = new HashMap<>(rows.size());
+        for (Map<String, Object> m : rows) {
+            Number idNum = (Number) m.get("id");
+            Number qtyNum = (Number) m.get("qty");
+            if (idNum != null) {
+                int id = idNum.intValue();
+                int qty = (qtyNum == null) ? 0
+                        : Math.toIntExact(qtyNum.longValue());
+                out.put(id, qty);
+            }
+        }
+        for (Integer id : brandedMedicineIds) {
+            out.putIfAbsent(id, 0);
+        }
+        return out;
+    }
+    }
Index: src/main/java/mk/ukim/finki/synergymed/service/impl/VerificationReviewServiceImpl.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/service/impl/VerificationReviewServiceImpl.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/service/impl/VerificationReviewServiceImpl.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -11,4 +11,6 @@
 import org.springframework.stereotype.Service;
 import org.springframework.transaction.annotation.Transactional;
+import org.springframework.transaction.annotation.Isolation;
+
 
 import java.util.List;
@@ -17,5 +19,4 @@
 @Service
 @RequiredArgsConstructor
-@Transactional
 public class VerificationReviewServiceImpl implements VerificationReviewService {
 
@@ -23,10 +24,10 @@
     private final ClientRepository clientRepo;
 
-    @Override @Transactional(readOnly = true)
+    @Override
     public List<Sensitiveclientdata> listPending() {
         return sensitiveRepo.findByVerificationStatusOrderByIdAsc("во тек");
     }
 
-    @Override @Transactional(readOnly = true)
+    @Override
     public Optional<Sensitiveclientdata> get(Integer id) {
         return sensitiveRepo.findById(id);
@@ -34,4 +35,5 @@
 
     @Override
+    @Transactional(rollbackFor = Exception.class, isolation = Isolation.READ_COMMITTED, timeout = 10)
     public void approve(Integer id) {
         Sensitiveclientdata row = sensitiveRepo.findById(id)
Index: src/main/java/mk/ukim/finki/synergymed/web/CatalogController.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/web/CatalogController.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
+++ src/main/java/mk/ukim/finki/synergymed/web/CatalogController.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -0,0 +1,50 @@
+package mk.ukim.finki.synergymed.web;
+
+import jakarta.servlet.http.HttpSession;
+import lombok.RequiredArgsConstructor;
+import mk.ukim.finki.synergymed.service.BrandedMedicineService;
+import mk.ukim.finki.synergymed.service.CatalogService;
+import org.springframework.beans.factory.annotation.Value;
+import org.springframework.stereotype.Controller;
+import org.springframework.ui.Model;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.PostMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RequestParam;
+
+@RequiredArgsConstructor
+@Controller
+@RequestMapping("/catalog")
+public class CatalogController {
+
+    private final CatalogService catalogService;
+    private final BrandedMedicineService brandedMedicineService;
+
+
+
+    @GetMapping
+    public String catalog(Model model, HttpSession session) {
+        var listed = catalogService.listCatalogMedicines(3);
+        var firstImageById = brandedMedicineService.cardImageUrlsFor(listed);
+        model.addAttribute("medicines", listed);
+        model.addAttribute("firstImageById", firstImageById);
+        model.addAttribute("username", session.getAttribute("username"));
+        return "catalog";
+    }
+
+    @GetMapping("/edit")
+    public String edit(Model model, HttpSession session) {
+        var all = brandedMedicineService.findAll();
+        var selectedIds = catalogService.listCatalogMedicineIds(3);
+        model.addAttribute("medicines", all);
+        model.addAttribute("selectedIds", selectedIds);
+        model.addAttribute("username", session.getAttribute("username"));
+        return "catalog-edit";
+    }
+
+    @PostMapping("/edit")
+    public String saveEdit(@RequestParam(name="ids", required=false) java.util.List<Integer> ids) {
+        catalogService.setCatalog(3, ids);
+        return "redirect:/catalog";
+    }
+}
Index: src/main/java/mk/ukim/finki/synergymed/web/LoginController.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/web/LoginController.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/web/LoginController.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -22,5 +22,5 @@
     private final AuthenticationManager authenticationManager;
     private final JwtService jwtService;
-    private final UserRepository userRepository; // Add this
+    private final UserRepository userRepository;
 
     @GetMapping
Index: src/main/java/mk/ukim/finki/synergymed/web/PaymentController.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/web/PaymentController.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/web/PaymentController.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -8,4 +8,5 @@
 import mk.ukim.finki.synergymed.models.User;
 import mk.ukim.finki.synergymed.service.ClientService;
+import mk.ukim.finki.synergymed.service.ClubCardService;
 import mk.ukim.finki.synergymed.service.DeliveryCompanyService;
 import mk.ukim.finki.synergymed.service.PaymentMethodService;
@@ -14,8 +15,7 @@
 import org.springframework.stereotype.Controller;
 import org.springframework.ui.Model;
-import org.springframework.web.bind.annotation.GetMapping;
-import org.springframework.web.bind.annotation.PostMapping;
-import org.springframework.web.bind.annotation.RequestMapping;
-import org.springframework.web.bind.annotation.RequestParam;
+import org.springframework.web.bind.annotation.*;
+
+import java.math.BigDecimal;
 
 @Controller
@@ -29,32 +29,45 @@
     private final DeliveryCompanyService deliveryCompanyService;
     private final ClientService clientService;
+    private final ClubCardService clubCardService; // NEW
 
     @GetMapping
-    public String getPaymentPage(Model model, HttpSession session) {
-
+    public String getPaymentPage(@RequestParam(name="useCard", defaultValue="false") boolean useCard,
+                                 Model model, HttpSession session) {
         model.addAttribute("methods", paymentMethodService.findAll());
         model.addAttribute("deliveryCompanies", deliveryCompanyService.findAll());
+
         Client client = getClientFromSession(session);
         Shoppingcart cart = shoppingCartService.getOrCreateCart(client);
 
-        model.addAttribute("total", shoppingCartService.getTotal(cart));
+        int base = shoppingCartService.getTotal(cart).intValue();
+        int discount = 0;
+        if (useCard) {
+            var card = clubCardService.getByClientId(client.getId());
+            if (card.isPresent()) {
+                Integer pts = card.get().getPoints();
+                int points = pts == null ? 0 : pts;
+                discount = Math.min(points / 2, base);
+            }
+        }
+        int shown = Math.max(0, base - discount);
 
+        model.addAttribute("total", BigDecimal.valueOf(shown));
+        model.addAttribute("discount", discount);
+        model.addAttribute("useCard", useCard);
+        model.addAttribute("username", session.getAttribute("username"));
         return "payment";
     }
-
-
 
     @PostMapping
     public String processPayment(@RequestParam Integer paymentMethodId,
                                  @RequestParam Integer deliveryCompanyId,
-                                 HttpSession session,
-                                 Model model) {
+                                 @RequestParam(name="useCard", defaultValue="false") boolean useCard,
+                                 HttpSession session, Model model) {
         Client client = getClientFromSession(session);
         Shoppingcart cart = shoppingCartService.getOrCreateCart(client);
-
-        Clientorder order = paymentService.checkout(client, cart, paymentMethodId, deliveryCompanyId);
-
+        Clientorder order = paymentService.checkout(client, cart, paymentMethodId, deliveryCompanyId, useCard);
         model.addAttribute("order", order);
         model.addAttribute("payment", order.getPayment());
+        model.addAttribute("username", session.getAttribute("username"));
         return "payment-success";
     }
@@ -63,9 +76,7 @@
         User user = (User) session.getAttribute("user");
         String username = (String) session.getAttribute("username");
-
         if (user == null || username == null) {
             throw new IllegalStateException("No user in session. Please login first.");
         }
-
         return clientService.findClientById(user.getId());
     }
Index: src/main/java/mk/ukim/finki/synergymed/web/ProfileController.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/web/ProfileController.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/web/ProfileController.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -3,4 +3,6 @@
 import jakarta.servlet.http.HttpSession;
 import lombok.RequiredArgsConstructor;
+import mk.ukim.finki.synergymed.models.Client;
+import mk.ukim.finki.synergymed.models.Clubcard;
 import mk.ukim.finki.synergymed.models.Contactinformation;
 import mk.ukim.finki.synergymed.models.Healthprofile;
@@ -25,4 +27,7 @@
     private final ClientService clientService;
 
+    // NEW: Inject the ClubCardService
+    private final ClubCardService clubCardService;
+
     @GetMapping
     public String getProfilePage(HttpSession session, Model model) {
@@ -40,4 +45,14 @@
             model.addAttribute("hasHealthProfile", false);
         }
+
+        // NEW: Load club card for the profile landing page
+        try {
+            Optional<Clubcard> clubcard = clubCardService.getByClientId(user.getId());
+            model.addAttribute("clubcard", clubcard.orElse(null));
+            model.addAttribute("hasClubcard", clubcard.isPresent());
+        } catch (Exception e) {
+            model.addAttribute("hasClubcard", false);
+        }
+
         model.addAttribute("activeTab", "profile");
         return "profile";
@@ -93,5 +108,4 @@
     }
 
-    /* GET /profile/prescriptions */
     @GetMapping("/prescriptions")
     public String prescriptions(jakarta.servlet.http.HttpSession session,
@@ -99,5 +113,5 @@
         var user = (mk.ukim.finki.synergymed.models.User) session.getAttribute("user");
         if (user == null) return "redirect:/login";
-        Integer clientId = user.getId(); // Client.id == User.id via @MapsId
+        Integer clientId = user.getId();
 
         boolean verified = isVerified(clientId);
@@ -114,3 +128,27 @@
         return "profile-prescriptions";
     }
+
+    @GetMapping("/clubcard")
+    public String profileClubcard(HttpSession session, Model model) {
+        User user = (User) session.getAttribute("user");
+        if (user == null) return "redirect:/login";
+
+        Optional<Clubcard> clubcard = clubCardService.getByClientId(user.getId());
+        model.addAttribute("clubcard", clubcard.orElse(null));
+        model.addAttribute("hasClubcard", clubcard.isPresent());
+        model.addAttribute("activeTab", "clubcard");
+        return "profile-clubcard";
+    }
+
+    @PostMapping("/clubcard/create")
+    public String createClubcard(HttpSession session) {
+        User user = (User) session.getAttribute("user");
+        if (user == null) return "redirect:/login";
+
+        if (clubCardService.getByClientId(user.getId()).isEmpty()) {
+            Client client = clientService.findClientById(user.getId());
+            clubCardService.createForClient(client);
+        }
+        return "redirect:/profile/clubcard";
+    }
 }
Index: src/main/java/mk/ukim/finki/synergymed/web/ShoppingCartController.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/web/ShoppingCartController.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/web/ShoppingCartController.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -11,4 +11,5 @@
 import mk.ukim.finki.synergymed.service.BrandedMedicineService;
 import mk.ukim.finki.synergymed.service.ShoppingCartService;
+import mk.ukim.finki.synergymed.service.ClubCardService; // NEW
 import org.springframework.stereotype.Controller;
 import org.springframework.ui.Model;
@@ -24,4 +25,5 @@
     private final ClientRepository clientRepository;
     private final ShoppingcartRepository shoppingcartRepository;
+    private final ClubCardService clubCardService;
 
     @PostMapping("/add/{medicineId}")
@@ -83,7 +85,9 @@
         model.addAttribute("total", shoppingCartService.getTotal(cart));
         model.addAttribute("username", session.getAttribute("username"));
+        // Images not yet available as per original TODO
+        model.addAttribute("firstImageById", null);
 
-        // TODO: 30.8.2025 FIX AFTER GETTING IMAGES IN DB 
-        model.addAttribute("firstImageById", null);
+        clubCardService.getByClientId(client.getId())
+                .ifPresent(card -> model.addAttribute("clubCard", card));
 
         return "cart";
Index: src/main/java/mk/ukim/finki/synergymed/web/VerificationController.java
===================================================================
--- src/main/java/mk/ukim/finki/synergymed/web/VerificationController.java	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/java/mk/ukim/finki/synergymed/web/VerificationController.java	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -16,6 +16,4 @@
 
     private final VerificationReviewService reviewService;
-
-    // Grid of pending applications
     @GetMapping
     public String list(Model model) {
@@ -25,5 +23,4 @@
     }
 
-    // Detail page
     @GetMapping("/{id}")
     public String detail(@PathVariable Integer id, Model model) {
@@ -33,5 +30,4 @@
     }
 
-    // Approve
     @PostMapping("/{id}/approve")
     public String approve(@PathVariable Integer id) {
@@ -40,5 +36,4 @@
     }
 
-    // Deny
     @PostMapping("/{id}/deny")
     public String deny(@PathVariable Integer id) {
Index: src/main/resources/application.properties
===================================================================
--- src/main/resources/application.properties	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/resources/application.properties	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -2,7 +2,7 @@
 
 # Database connection
-spring.datasource.url=jdbc:postgresql://localhost:5432/synergymed
+spring.datasource.url=jdbc:postgresql://localhost:5432/SynergyMed
 spring.datasource.username=postgres
-spring.datasource.password=postgres
+spring.datasource.password=1234
 spring.jpa.properties.hibernate.default_schema=synergymed
 spring.datasource.driver-class-name=org.postgresql.Driver
Index: src/main/resources/templates/branded-medicine-form.html
===================================================================
--- src/main/resources/templates/branded-medicine-form.html	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/resources/templates/branded-medicine-form.html	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -3,13 +3,76 @@
 <head>
     <meta charset="UTF-8">
-    <title th:text="${mode=='create' ? 'Create Branded Medicine' : 'Edit Branded Medicine'}">Form</title>
+    <title th:text="${mode=='create' ? 'Create Branded Medicine' : 'Edit Branded Medicine'}">SynergyMed – Branded Medicine</title>
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+    <!-- Global header styles (fragment) -->
+    <th:block th:replace="fragments/header :: headerStyles"></th:block>
+
     <style>
-        :root{--teal-1:#20b2aa;--teal-2:#48d1cc;--bg:#fefeff;--card:#ffffff;--muted:#6c757d;--shadow:0 20px 40px rgba(0,0,0,.1)}
+        :root {
+            --teal-1:#20b2aa; --teal-2:#48d1cc;
+            --bg:#fefeff; --card:#ffffff;
+            --muted:#6c757d; --text:#1f2937;
+            --shadow:0 20px 40px rgba(0,0,0,0.10);
+            --shadow-sm:0 6px 18px rgba(0,0,0,0.08);
+        }
         *{margin:0;padding:0;box-sizing:border-box}
-        body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;min-height:100vh;display:flex;align-items:flex-start;justify-content:center;background:linear-gradient(135deg,#a4ecba 0%,#fefeff 100%);padding:24px}
-        .wrap{width:100%;max-width:900px;background:#fff;border-radius:20px;overflow:hidden;box-shadow:var(--shadow)}
-        .head{background:linear-gradient(135deg,var(--teal-1),var(--teal-2));color:#fff;padding:26px 24px}
-        .body{padding:26px 24px}
+
+        body{
+            font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;
+            min-height:100vh;
+            background:linear-gradient(135deg,#a4ecba 0%,#fefeff 100%);
+            color:var(--text);
+        }
+
+        /* Full-width global header - FIXED STYLING (override fragment defaults) */
+        .site-header{
+            position:sticky;
+            top:0;
+            left:0;
+            right:0;
+            width:100%;
+            border-radius:0;
+            margin:0;
+            z-index:1000;
+            background:#ffffff !important;
+            box-shadow:0 2px 10px rgba(0,0,0,0.1);
+        }
+
+        .page{width:100%; max-width:1200px; padding:28px; margin:0 auto}
+
+        /* Card wrapper */
+        .card{
+            background:var(--card);
+            border-radius:18px;
+            box-shadow:var(--shadow);
+            margin-bottom:28px;
+            overflow:hidden;
+        }
+        .card-header{
+            background:linear-gradient(135deg,var(--teal-1),var(--teal-2));
+            color:#fff;
+            padding:20px 24px;
+            display:flex; justify-content:space-between; align-items:center;
+            font-size:1.3rem; font-weight:600;
+        }
+        .card-body{padding:22px}
+
+        .btn{
+            display:inline-block; border:none; cursor:pointer; text-decoration:none;
+            padding:12px 16px; border-radius:12px; font-weight:600;
+            letter-spacing:.5px; transition:.2s ease;
+        }
+        .btn-primary{
+            background:linear-gradient(135deg,var(--teal-1),var(--teal-2));
+            color:#fff;
+            box-shadow:0 10px 20px rgba(32,178,170,.25);
+        }
+        .btn-primary:hover{transform:translateY(-2px)}
+        .btn-secondary{
+            background:#fff; color:#111; border:2px solid rgba(32,178,170,.25);
+        }
+
+        /* Form layout */
         .row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
         .row-1{display:grid;grid-template-columns:1fr;gap:16px;margin-bottom:6px}
@@ -20,264 +83,273 @@
         .hint{color:var(--muted);font-size:.86rem;margin-top:4px}
         .actions{display:flex;gap:12px;padding-top:12px;flex-wrap:wrap}
-        .btn{border:none;padding:12px 16px;border-radius:12px;cursor:pointer;font-weight:700;letter-spacing:.4px}
-        .btn-primary{background:linear-gradient(135deg,var(--teal-1),var(--teal-2));color:#fff;box-shadow:0 10px 20px rgba(32,178,170,.25)}
-        .btn-secondary{background:#fff;color:#111;border:2px solid rgba(32,178,170,.25)}
+
+        /* Images grid */
         .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px}
         .img-card{position:relative;background:#f8fafc;border:1px solid #e6ebf0;border-radius:12px;padding:8px}
         .thumb{width:100%;height:110px;object-fit:cover;border-radius:8px;display:block}
+
         @media (max-width:720px){.row{grid-template-columns:1fr}}
+        @media (max-width:560px){.page{padding:16px}}
     </style>
 </head>
 <body>
-<div th:replace="fragments/header :: siteHeader"></div>
-<div class="wrap">
-    <div class="head">
-        <h2 th:text="${mode=='create' ? 'Create Branded Medicine' : 'Edit Branded Medicine'}">Form</h2>
-    </div>
-
-    <div class="body">
-        <!-- Single SAVE form for both create and edit -->
-        <form th:action="@{/branded-medicines/save}" method="post" enctype="multipart/form-data" id="saveForm">
-            <input type="hidden" name="id" th:if="${mode=='edit'}" th:value="${bm.id}"/>
-
-            <div class="row">
-                <div>
-                    <label>Manufacturer</label>
-                    <select name="manufacturerId" required>
-                        <option th:if="${mode=='create'}" value="" disabled selected>Select manufacturer</option>
-                        <option th:each="m : ${manufacturers}"
-                                th:value="${m.id}"
-                                th:text="${m.company.companyName}"
-                                th:selected="${mode=='edit' and bm.manufacturer != null and m.id == bm.manufacturer.id}">
-                            Manufacturer
-                        </option>
-                    </select>
-                    <div class="hint">Pick the company that manufactured this medicine.</div>
-                </div>
-                <div>
-                    <label>Price</label>
-                    <input type="number" step="0.01" name="price" th:value="${mode=='edit' ? bm.price : ''}" required/>
-                </div>
-            </div>
-
-            <div class="row">
-                <div>
-                    <label>Dosage Form</label>
-                    <input type="text" name="dosageForm" th:value="${mode=='edit' ? bm.dosageForm : ''}" required/>
-                </div>
-                <div>
-                    <label>Strength</label>
-                    <input type="text" name="strength" th:value="${mode=='edit' ? bm.strength : ''}" required/>
-                </div>
-            </div>
-
-            <div class="row">
-                <div>
-                    <label>Origin Country</label>
-                    <input type="text" name="originCountry" th:value="${mode=='edit' ? bm.originCountry : ''}"/>
-                </div>
-                <div>
-                    <label>Name</label>
-                    <input type="text" name="name" th:value="${mode=='edit' ? bm.name : ''}" required/>
-                </div>
-            </div>
-
-            <div class="row-1">
-                <div>
-                    <label>Description</label>
-                    <textarea name="description" th:text="${mode=='edit' ? bm.description : ''}"></textarea>
-                </div>
-                <div>
-                    <label>New Images (preview only until Save)</label>
-                    <input type="file" id="newImages" name="images" multiple accept="image/*"/>
-                    <div class="hint">Choose multiple images to preview; they are saved only when Save is clicked.</div>
-                    <div id="preview" class="grid" style="margin-top:12px;"></div>
-                </div>
-            </div>
-
-            <!-- Existing images (edit mode) -->
-            <div th:if="${mode=='edit' and images != null and !images.isEmpty()}" style="margin-top:18px;">
-                <div class="grid">
-                    <div class="img-card" th:each="img : ${images}">
-                        <img class="thumb" th:src="@{${img.image}}" alt="image">
-                        <input type="hidden" name="removeImageIds" th:value="${img.id}" disabled>
-                        <div style="display:flex;justify-content:space-between;align-items:center;margin-top:6px;">
-                            <button type="button" class="btn-remove-existing"
-                                    th:attr="data-id=${img.id}"
-                                    style="background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:4px 8px;cursor:pointer;">
-                                Remove
-                            </button>
-                            <label style="margin-left:8px;">
-                                <input type="radio" name="mainPick" th:value="${'existing:'+img.id}"
-                                       th:checked="${img.mainImage}">
-                                Main
-                            </label>
+
+<!-- Global header (fragment with parameters) -->
+<th:block th:replace="fragments/header :: siteHeader('medicines', ${username})"></th:block>
+
+<div class="page">
+    <div class="card">
+        <div class="card-header">
+            <span th:text="${mode=='create' ? 'Create Branded Medicine' : 'Edit Branded Medicine'}">Form</span>
+        </div>
+
+        <div class="card-body">
+            <!-- Single SAVE form for both create and edit -->
+            <form th:action="@{/branded-medicines/save}" method="post" enctype="multipart/form-data" id="saveForm">
+                <input type="hidden" name="id" th:if="${mode=='edit'}" th:value="${bm.id}"/>
+
+                <div class="row">
+                    <div>
+                        <label>Manufacturer</label>
+                        <select name="manufacturerId" required>
+                            <option th:if="${mode=='create'}" value="" disabled selected>Select manufacturer</option>
+                            <option th:each="m : ${manufacturers}"
+                                    th:value="${m.id}"
+                                    th:text="${m.company.companyName}"
+                                    th:selected="${mode=='edit' and bm.manufacturer != null and m.id == bm.manufacturer.id}">
+                                Manufacturer
+                            </option>
+                        </select>
+                        <div class="hint">Pick the company that manufactured this medicine.</div>
+                    </div>
+                    <div>
+                        <label>Price</label>
+                        <input type="number" step="0.01" name="price" th:value="${mode=='edit' ? bm.price : ''}" required/>
+                    </div>
+                </div>
+
+                <div class="row">
+                    <div>
+                        <label>Dosage Form</label>
+                        <input type="text" name="dosageForm" th:value="${mode=='edit' ? bm.dosageForm : ''}" required/>
+                    </div>
+                    <div>
+                        <label>Strength</label>
+                        <input type="text" name="strength" th:value="${mode=='edit' ? bm.strength : ''}" required/>
+                    </div>
+                </div>
+
+                <div class="row">
+                    <div>
+                        <label>Origin Country</label>
+                        <input type="text" name="originCountry" th:value="${mode=='edit' ? bm.originCountry : ''}"/>
+                    </div>
+                    <div>
+                        <label>Name</label>
+                        <input type="text" name="name" th:value="${mode=='edit' ? bm.name : ''}" required/>
+                    </div>
+                </div>
+
+                <div class="row-1">
+                    <div>
+                        <label>Description</label>
+                        <textarea name="description" th:text="${mode=='edit' ? bm.description : ''}"></textarea>
+                    </div>
+                    <div>
+                        <label>New Images (preview only until Save)</label>
+                        <input type="file" id="newImages" name="images" multiple accept="image/*"/>
+                        <div class="hint">Choose multiple images to preview; they are saved only when Save is clicked.</div>
+                        <div id="preview" class="grid" style="margin-top:12px;"></div>
+                    </div>
+                </div>
+
+                <!-- Existing images (edit mode) -->
+                <div th:if="${mode=='edit' and images != null and !images.isEmpty()}" style="margin-top:18px;">
+                    <div class="grid">
+                        <div class="img-card" th:each="img : ${images}">
+                            <img class="thumb" th:src="@{${img.image}}" alt="image">
+                            <input type="hidden" name="removeImageIds" th:value="${img.id}" disabled>
+                            <div style="display:flex;justify-content:space-between;align-items:center;margin-top:6px;">
+                                <button type="button" class="btn-remove-existing"
+                                        th:attr="data-id=${img.id}"
+                                        style="background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:4px 8px;cursor:pointer;">
+                                    Remove
+                                </button>
+                                <label style="margin-left:8px;">
+                                    <input type="radio" name="mainPick" th:value="${'existing:'+img.id}"
+                                           th:checked="${img.mainImage}">
+                                    Main
+                                </label>
+                            </div>
                         </div>
                     </div>
                 </div>
-            </div>
-
-            <!-- Hidden fields managed by JS (never "undefined") -->
-            <input type="hidden" id="mainExistingId" name="mainExistingId">
-            <input type="hidden" id="mainNewIndex"   name="mainNewIndex">
-
-            <div class="actions">
-                <button class="btn btn-primary" type="submit">Save</button>
-                <a class="btn btn-secondary" th:href="@{/}">Cancel</a>
-            </div>
-        </form>
-    </div>
-</div>
-
-<script>
-    // Hidden fields for the server (avoid "undefined")
-    const mainExistingId = document.getElementById('mainExistingId');
-    const mainNewIndex   = document.getElementById('mainNewIndex');
-
-    // 1) Existing remove buttons toggle hidden remove ids
-    function wireExistingRemoveButtons() {
-        document.querySelectorAll('.btn-remove-existing').forEach(btn => {
-            btn.addEventListener('click', () => {
-                const card = btn.closest('.img-card');
-                const hidden = card.querySelector('input[type="hidden"][name="removeImageIds"]');
-                const wasEnabled = !hidden.disabled;
-                hidden.disabled = wasEnabled ? true : false;
-                btn.textContent = wasEnabled ? 'Remove' : 'Undo';
-                btn.style.borderColor = wasEnabled ? '#e5e7eb' : '#f0caca';
-                btn.style.color = wasEnabled ? '#111' : '#b3261e';
-
-                // If this was main and now removed, clear main and pick a fallback below
-                const radio = card.querySelector('input[type="radio"][name="mainPick"]');
-                if (!hidden.disabled && radio && radio.checked) {
-                    radio.checked = false;
-                    mainExistingId.value = '';
-                    chooseFallbackMain();
-                }
-            });
-        });
-    }
-    wireExistingRemoveButtons();
-
-    // 2) One radio group across existing and new
-    document.addEventListener('change', (e) => {
-        const t = e.target;
-        if (t && t.name === 'mainPick' && t.type === 'radio') {
-            const v = String(t.value || '');
-            if (v.startsWith('existing:')) {
-                mainExistingId.value = v.split(':')[1] || '';
-                mainNewIndex.value = '';
-            } else if (v.startsWith('new:')) {
-                mainNewIndex.value = v.split(':')[1] || '';
-                mainExistingId.value = '';
-            }
-        }
-    });
-
-    // 3) Aggregate multiple selections with DataTransfer + FileReader previews
-    const fileInput = document.getElementById('newImages');
-    const preview   = document.getElementById('preview');
-    const saveForm  = document.getElementById('saveForm');
-    let aggregated  = [];
-
-    function syncInputFiles() {
-        const dt = new DataTransfer();
-        aggregated.forEach(f => dt.items.add(f));
-        fileInput.files = dt.files;
-    }
-
-    function buildPreviewCard(dataUrl, fileName, idx) {
-        const card = document.createElement('div');
-        card.className = 'img-card';
-        card.innerHTML = `
-    <img class="thumb" src="${dataUrl}" alt="${fileName}">
-    <div style="display:flex;justify-content:space-between;align-items:center;margin-top:6px;">
-      <label>
-        <input type="radio" name="mainPick" value="new:${idx}"> Main (new)
-      </label>
-      <button type="button" class="remove-new-btn" data-index="${idx}"
-              style="background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:4px 8px;cursor:pointer;">
-        Remove
-      </button>
-    </div>
-  `;
-        return card;
-    }
-
-    function renderPreview() {
-        preview.innerHTML = '';
-        aggregated.forEach((file, idx) => {
-            const reader = new FileReader();
-            reader.onload = e => {
-                const card = buildPreviewCard(e.target.result, file.name, idx);
-                preview.appendChild(card);
-                const removeBtn = card.querySelector('.remove-new-btn');
-                removeBtn.addEventListener('click', () => {
-                    const i = parseInt(removeBtn.getAttribute('data-index'), 10);
-                    if (mainNewIndex.value === String(i)) mainNewIndex.value = '';
-                    aggregated.splice(i, 1);
+
+                <!-- Hidden fields managed by JS -->
+                <input type="hidden" id="mainExistingId" name="mainExistingId">
+                <input type="hidden" id="mainNewIndex"   name="mainNewIndex">
+
+                <div class="actions">
+                    <button class="btn btn-primary" type="submit">Save</button>
+                    <a class="btn btn-secondary" th:href="@{/}">Cancel</a>
+                </div>
+            </form>
+
+            <script>
+                // Hidden fields for the server (avoid "undefined")
+                const mainExistingId = document.getElementById('mainExistingId');
+                const mainNewIndex   = document.getElementById('mainNewIndex');
+
+                // 1) Existing remove buttons toggle hidden remove ids
+                function wireExistingRemoveButtons() {
+                    document.querySelectorAll('.btn-remove-existing').forEach(btn => {
+                        btn.addEventListener('click', () => {
+                            const card = btn.closest('.img-card');
+                            const hidden = card.querySelector('input[type="hidden"][name="removeImageIds"]');
+                            const wasEnabled = !hidden.disabled;
+                            hidden.disabled = wasEnabled ? true : false;
+                            btn.textContent = wasEnabled ? 'Remove' : 'Undo';
+                            btn.style.borderColor = wasEnabled ? '#e5e7eb' : '#f0caca';
+                            btn.style.color = wasEnabled ? '#111' : '#b3261e';
+
+                            // If this was main and now removed, clear main and pick a fallback below
+                            const radio = card.querySelector('input[type="radio"][name="mainPick"]');
+                            if (!hidden.disabled && radio && radio.checked) {
+                                radio.checked = false;
+                                mainExistingId.value = '';
+                                chooseFallbackMain();
+                            }
+                        });
+                    });
+                }
+                wireExistingRemoveButtons();
+
+                // 2) One radio group across existing and new
+                document.addEventListener('change', (e) => {
+                    const t = e.target;
+                    if (t && t.name === 'mainPick' && t.type === 'radio') {
+                        const v = String(t.value || '');
+                        if (v.startsWith('existing:')) {
+                            mainExistingId.value = v.split(':')[1] || '';
+                            mainNewIndex.value = '';
+                        } else if (v.startsWith('new:')) {
+                            mainNewIndex.value = v.split(':')[1] || '';
+                            mainExistingId.value = '';
+                        }
+                    }
+                });
+
+                // 3) Aggregate multiple selections with DataTransfer + FileReader previews
+                const fileInput = document.getElementById('newImages');
+                const preview   = document.getElementById('preview');
+                const saveForm  = document.getElementById('saveForm');
+                let aggregated  = [];
+
+                function syncInputFiles() {
+                    const dt = new DataTransfer();
+                    aggregated.forEach(f => dt.items.add(f));
+                    fileInput.files = dt.files;
+                }
+
+                function buildPreviewCard(dataUrl, fileName, idx) {
+                    const card = document.createElement('div');
+                    card.className = 'img-card';
+                    card.innerHTML = `
+        <img class="thumb" src="${dataUrl}" alt="${fileName}">
+        <div style="display:flex;justify-content:space-between;align-items:center;margin-top:6px;">
+          <label>
+            <input type="radio" name="mainPick" value="new:${idx}"> Main (new)
+          </label>
+          <button type="button" class="remove-new-btn" data-index="${idx}"
+                  style="background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:4px 8px;cursor:pointer;">
+            Remove
+          </button>
+        </div>
+      `;
+                    return card;
+                }
+
+                function renderPreview() {
+                    preview.innerHTML = '';
+                    aggregated.forEach((file, idx) => {
+                        const reader = new FileReader();
+                        reader.onload = e => {
+                            const card = buildPreviewCard(e.target.result, file.name, idx);
+                            preview.appendChild(card);
+                            const removeBtn = card.querySelector('.remove-new-btn');
+                            removeBtn.addEventListener('click', () => {
+                                const i = parseInt(removeBtn.getAttribute('data-index'), 10);
+                                if (mainNewIndex.value === String(i)) mainNewIndex.value = '';
+                                aggregated.splice(i, 1);
+                                syncInputFiles();
+                                renderPreview();
+                                if (!mainExistingId.value && !mainNewIndex.value) chooseFallbackMain();
+                            });
+                        };
+                        reader.readAsDataURL(file);
+                    });
+
+                    if (!mainExistingId.value && !mainNewIndex.value && aggregated.length > 0) {
+                        mainNewIndex.value = '0';
+                        const first = preview.querySelector('input[type="radio"][name="mainPick"][value="new:0"]');
+                        if (first) first.checked = true;
+                    }
+                }
+
+                function chooseFallbackMain() {
+                    const existingCards = document.querySelectorAll('.img-card input[type="hidden"][name="removeImageIds"]');
+                    for (const hidden of existingCards) {
+                        if (hidden.disabled) {
+                            const card = hidden.closest('.img-card');
+                            const r = card.querySelector('input[type="radio"][name="mainPick"][value^="existing:"]');
+                            if (r) {
+                                r.checked = true;
+                                const v = r.value.split(':')[1] || '';
+                                mainExistingId.value = v;
+                                mainNewIndex.value = '';
+                                return;
+                            }
+                        }
+                    }
+                    const newRadio = preview.querySelector('input[type="radio"][name="mainPick"][value^="new:"]');
+                    if (newRadio) {
+                        newRadio.checked = true;
+                        mainExistingId.value = '';
+                        mainNewIndex.value = newRadio.value.split(':')[1] || '';
+                    } else {
+                        mainExistingId.value = '';
+                        mainNewIndex.value = '';
+                    }
+                }
+
+                fileInput?.addEventListener('change', function () {
+                    const files = Array.from(this.files || []);
+                    files.forEach(f => { if (/^image\//.test(f.type)) aggregated.push(f); });
+                    this.value = ''; // allow re-selecting same file
                     syncInputFiles();
                     renderPreview();
                     if (!mainExistingId.value && !mainNewIndex.value) chooseFallbackMain();
                 });
-            };
-            reader.readAsDataURL(file);
-        });
-
-        if (!mainExistingId.value && !mainNewIndex.value && aggregated.length > 0) {
-            mainNewIndex.value = '0';
-            const first = preview.querySelector('input[type="radio"][name="mainPick"][value="new:0"]');
-            if (first) first.checked = true;
-        }
-    }
-
-    function chooseFallbackMain() {
-        const existingCards = document.querySelectorAll('.img-card input[type="hidden"][name="removeImageIds"]');
-        for (const hidden of existingCards) {
-            if (hidden.disabled) {
-                const card = hidden.closest('.img-card');
-                const r = card.querySelector('input[type="radio"][name="mainPick"][value^="existing:"]');
-                if (r) {
-                    r.checked = true;
-                    const v = r.value.split(':')[1] || '';
-                    mainExistingId.value = v;
-                    mainNewIndex.value = '';
-                    return;
-                }
-            }
-        }
-        const newRadio = preview.querySelector('input[type="radio"][name="mainPick"][value^="new:"]');
-        if (newRadio) {
-            newRadio.checked = true;
-            mainExistingId.value = '';
-            mainNewIndex.value = newRadio.value.split(':')[1] || '';
-        } else {
-            mainExistingId.value = '';
-            mainNewIndex.value = '';
-        }
-    }
-
-    fileInput?.addEventListener('change', function () {
-        const files = Array.from(this.files || []);
-        files.forEach(f => { if (/^image\//.test(f.type)) aggregated.push(f); });
-        this.value = ''; // allow re-selecting same file
-        syncInputFiles();
-        renderPreview();
-        if (!mainExistingId.value && !mainNewIndex.value) chooseFallbackMain();
-    });
-
-    (function initMainFromExisting() {
-        const checked = document.querySelector('input[type="radio"][name="mainPick"]:checked');
-        if (checked) {
-            const v = checked.value || '';
-            if (v.startsWith('existing:')) mainExistingId.value = v.split(':')[1] || '';
-            if (v.startsWith('new:'))      mainNewIndex.value   = v.split(':')[1] || '';
-        }
-    })();
-
-    saveForm?.addEventListener('submit', () => {
-        if (mainExistingId.value === 'undefined') mainExistingId.value = '';
-        if (mainNewIndex.value   === 'undefined') mainNewIndex.value   = '';
-    });
-</script>
+
+                (function initMainFromExisting() {
+                    const checked = document.querySelector('input[type="radio"][name="mainPick"]:checked');
+                    if (checked) {
+                        const v = checked.value || '';
+                        if (v.startsWith('existing:')) mainExistingId.value = v.split(':')[1] || '';
+                        if (v.startsWith('new:'))      mainNewIndex.value   = v.split(':')[1] || '';
+                    }
+                })();
+
+                saveForm?.addEventListener('submit', () => {
+                    if (mainExistingId.value === 'undefined') mainExistingId.value = '';
+                    if (mainNewIndex.value   === 'undefined') mainNewIndex.value   = '';
+                });
+            </script>
+        </div>
+    </div>
+</div>
+
+<!-- Header dropdown behavior (fragment) -->
+<th:block th:replace="fragments/header :: headerScripts"></th:block>
 </body>
 </html>
Index: src/main/resources/templates/cart.html
===================================================================
--- src/main/resources/templates/cart.html	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/resources/templates/cart.html	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -5,34 +5,11 @@
     <title>SynergyMed – Shopping Cart</title>
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-
     <th:block th:replace="fragments/header :: headerStyles"></th:block>
-
     <style>
-        :root{
-            --teal-1:#20b2aa; --teal-2:#48d1cc; --muted:#6c757d;
-        }
+        :root{ --teal-1:#20b2aa; --teal-2:#48d1cc; --muted:#6c757d; }
         *{margin:0;padding:0;box-sizing:border-box}
-
-        body{
-            font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;
-            min-height:100vh;
-            background:linear-gradient(135deg,#a4ecba 0%,#fefeff 100%);
-            color:#1f2937;
-        }
-
-        /* Full-width global header - FIXED STYLING */
-        .site-header{
-            position:sticky;
-            top:0;
-            left:0;
-            right:0;
-            width:100%;
-            border-radius:0;
-            margin:0;
-            z-index:1000;
-            background:white !important;
-            box-shadow:0 2px 10px rgba(0,0,0,0.1);
-        }
-
+        body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;min-height:100vh;
+            background:linear-gradient(135deg,#a4ecba 0%,#fefeff 100%);color:#1f2937}
+        .site-header{position:sticky;top:0;left:0;right:0;width:100%;border-radius:0;margin:0;z-index:1000;background:white !important;box-shadow:0 2px 10px rgba(0,0,0,0.1)}
         .cart-container{max-width:1000px;margin:28px auto;padding:20px;background:white;border-radius:18px;box-shadow:0 12px 30px rgba(0,0,0,0.1)}
         .cart-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}
@@ -48,4 +25,7 @@
         .btn-checkout{margin-top:20px;display:inline-block;background:linear-gradient(135deg,#20b2aa,#48d1cc);color:#fff;padding:12px 20px;border-radius:12px;text-decoration:none;font-weight:600;transition:.2s ease}
         .btn-checkout:hover{transform:translateY(-2px)}
+        .loyalty{margin-top:12px;padding:12px;border:1px solid #e5e7eb;border-radius:12px;background:#f9fafb}
+        .loyalty h4{margin:0 0 6px 0}
+        .muted{color:#6c757d}
     </style>
 </head>
@@ -64,5 +44,4 @@
 
     <div th:each="entry : ${items}" class="cart-item">
-        <!-- Safe image rendering -->
         <img th:if="${firstImageById != null}"
              th:src="@{${firstImageById[entry.key.id]}}" alt="medicine">
@@ -74,13 +53,10 @@
             <div class="muted" th:text="${entry.key.dosageForm}">Dosage</div>
             <div class="cart-qty">
-                <!-- Minus button -->
                 <form th:action="@{/cart/minus/{id}(id=${entry.key.id})}" method="post" style="display:inline">
                     <button type="submit" class="btn-outline">−</button>
                 </form>
-                <!-- Plus button -->
                 <form th:action="@{/cart/plus/{id}(id=${entry.key.id})}" method="post" style="display:inline">
                     <button type="submit" class="btn-outline">＋</button>
                 </form>
-                <!-- Remove button -->
                 <form th:action="@{/cart/remove/{id}(id=${entry.key.id})}" method="post" style="display:inline">
                     <button type="submit" class="btn-outline btn-remove">Remove</button>
@@ -88,15 +64,72 @@
             </div>
         </div>
+
         <div th:text="${#numbers.formatDecimal(entry.key.price * entry.value, 1, 'COMMA', 2, 'POINT') + ' ден.'}">0 ден.</div>
     </div>
 
-    <div class="cart-total">
-        Total: <span th:text="${#numbers.formatDecimal(total, 1, 'COMMA', 2, 'POINT') + ' ден.'}">0.00 ден.</span>
+    <!-- Loyalty card panel (rendered if controller added 'clubCard') -->
+    <div class="loyalty" th:if="${clubCard != null}">
+        <h4>Клуб карта</h4>
+        <div class="muted">
+            Програма: <span th:text="${clubCard.clubProgram}">Default Program</span> •
+            Поени: <span id="cardPoints" th:text="${clubCard.points}">0</span>
+        </div>
+        <label style="display:flex;align-items:center;gap:8px;margin-top:6px;">
+            <input type="checkbox" id="usePointsChk">
+            <span>Искористете поени (−1 денар за секои 2 поени)</span>
+        </label>
+        <div class="muted" id="pointsNote" style="margin-top:6px;"></div>
     </div>
 
-    <a class="btn-checkout" th:href="@{/payment}">Proceed to Payment</a>
+    <div class="cart-total">
+        Total:
+        <span id="totalValue"
+              th:data-basetotal="${total.intValue()}"
+              th:text="${#numbers.formatDecimal(total, 1, 'COMMA', 2, 'POINT') + ' ден.'}">0.00 ден.</span>
+        <div class="muted" id="discountLine" style="display:none;">Discount: <span id="discountValue">0</span> ден.</div>
+    </div>
+
+    <a class="btn-checkout" id="proceedLink" th:href="@{/payment}">Proceed to Payment</a>
 </div>
 
 <th:block th:replace="fragments/header :: headerScripts"></th:block>
+<script>
+    (function(){
+        const chk = document.getElementById('usePointsChk');
+        const totalEl = document.getElementById('totalValue');
+        const discountLine = document.getElementById('discountLine');
+        const discountValue = document.getElementById('discountValue');
+        const pointsEl = document.getElementById('cardPoints');
+        const proceed = document.getElementById('proceedLink');
+        const baseHref = proceed ? (proceed.getAttribute('href') || '/payment') : '/payment';
+        if (!totalEl) return;
+
+        const baseTotal = parseInt(totalEl.getAttribute('data-basetotal') || '0', 10);
+
+        function recompute(){
+            const pts = parseInt(pointsEl ? pointsEl.textContent : '0', 10);
+            const maxDiscount = Math.floor(pts / 2); // 1 ден. per 2 points
+            const apply = !!(chk && chk.checked);
+            const applied = apply ? Math.min(maxDiscount, baseTotal) : 0;
+            const newTotal = Math.max(0, baseTotal - applied);
+
+            totalEl.textContent = newTotal.toFixed(2) + ' ден.';
+            discountLine.style.display = applied > 0 ? 'block' : 'none';
+            discountValue.textContent = applied.toString();
+
+            // carry the choice to payment
+            if (proceed) {
+                proceed.setAttribute('href', apply ? (baseHref + '?useCard=true') : baseHref);
+            }
+
+            // note
+            const note = document.getElementById('pointsNote');
+            if (note) note.textContent = 'Достапен попуст: ' + maxDiscount + ' ден. (од ' + pts + ' поени)';
+        }
+
+        if (chk) chk.addEventListener('change', recompute);
+        recompute();
+    })();
+</script>
 </body>
 </html>
Index: src/main/resources/templates/catalog-edit.html
===================================================================
--- src/main/resources/templates/catalog-edit.html	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
+++ src/main/resources/templates/catalog-edit.html	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<html xmlns:th="http://www.thymeleaf.org" lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>SynergyMed – Edit Catalog</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <th:block th:replace="fragments/header :: headerStyles"></th:block>
+    <style>
+        :root { --teal-1:#20b2aa; --teal-2:#48d1cc; --muted:#6c757d; --text:#1f2937;
+            --shadow:0 20px 40px rgba(0,0,0,0.10); --shadow-sm:0 6px 18px rgba(0,0,0,0.08); }
+        *{margin:0;padding:0;box-sizing:border-box}
+        body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;min-height:100vh;
+            background:linear-gradient(135deg,#a4ecba 0%,#fefeff 100%);color:var(--text)}
+        .site-header{position:sticky;top:0;left:0;right:0;width:100%;border-radius:0;z-index:1000;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.1)}
+        .page{width:100%;max-width:1200px;margin:0 auto;padding:24px}
+        .card{background:#fff;border-radius:18px;box-shadow:var(--shadow);overflow:hidden;margin-bottom:28px}
+        .card-header{background:linear-gradient(135deg,var(--teal-1),var(--teal-2));color:#fff;padding:20px 24px;
+            display:flex;align-items:center;justify-content:space-between}
+        .card-body{padding:22px}
+        .actions{display:flex;gap:12px;flex-wrap:wrap}
+        .btn{display:inline-block;border:none;cursor:pointer;text-decoration:none;padding:10px 16px;border-radius:12px;font-weight:600}
+        .btn-primary{background:linear-gradient(135deg,var(--teal-1),var(--teal-2));color:#fff;box-shadow:0 10px 20px rgba(32,178,170,.25)}
+        .btn-secondary{background:#fff;color:#111;border:2px solid rgba(32,178,170,.25)}
+        table{width:100%;border-collapse:collapse}
+        th, td{padding:12px 10px;border-bottom:1px solid #eef2f7;text-align:left}
+        th{font-weight:700}
+        .muted{color:var(--muted)}
+    </style>
+</head>
+<body>
+<th:block th:replace="fragments/header :: siteHeader('medicines', ${username})"></th:block>
+
+<div class="page">
+    <div class="card">
+        <div class="card-header">
+            <span>Edit Catalog</span>
+            <div class="actions">
+                <a class="btn btn-secondary" th:href="@{/catalog}">Back</a>
+            </div>
+        </div>
+        <div class="card-body">
+            <form th:action="@{/catalog/edit}" method="post">
+                <input type="hidden" th:if="${_csrf != null}" th:name="${_csrf.parameterName}" th:value="${_csrf.token}">
+                <table>
+                    <thead>
+                    <tr>
+                        <th style="width:48px;">Show</th>
+                        <th>Name</th>
+                        <th class="muted">Dosage</th>
+                        <th class="muted">Price</th>
+                    </tr>
+                    </thead>
+                    <tbody>
+                    <tr th:each="m : ${medicines}">
+                        <td>
+                            <input type="checkbox" name="ids" th:value="${m.id}"
+                                   th:checked="${selectedIds != null and selectedIds.contains(m.id)}">
+                        </td>
+                        <td th:text="${m.name}">Medicine</td>
+                        <td class="muted" th:text="${m.dosageForm}">Dosage</td>
+                        <td class="muted" th:text="${#numbers.formatDecimal(m.price, 1, 'COMMA', 2, 'POINT') + ' ден.'}">0.00 ден.</td>
+                    </tr>
+                    </tbody>
+                </table>
+                <div class="actions" style="margin-top:16px;">
+                    <button type="submit" class="btn btn-primary">Save</button>
+                    <a class="btn btn-secondary" th:href="@{/catalog}">Cancel</a>
+                </div>
+            </form>
+        </div>
+    </div>
+</div>
+
+<th:block th:replace="fragments/header :: headerScripts"></th:block>
+</body>
+</html>
Index: src/main/resources/templates/catalog.html
===================================================================
--- src/main/resources/templates/catalog.html	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
+++ src/main/resources/templates/catalog.html	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -0,0 +1,110 @@
+<!DOCTYPE html>
+<html xmlns:th="http://www.thymeleaf.org" lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>SynergyMed – Catalog</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <th:block th:replace="fragments/header :: headerStyles"></th:block>
+    <style>
+        :root { --teal-1:#20b2aa; --teal-2:#48d1cc; --muted:#6c757d; --text:#1f2937;
+            --shadow:0 20px 40px rgba(0,0,0,0.10); --shadow-sm:0 6px 18px rgba(0,0,0,0.08); }
+        *{margin:0;padding:0;box-sizing:border-box}
+        body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;min-height:100vh;
+            background:linear-gradient(135deg,#a4ecba 0%,#fefeff 100%);color:var(--text)}
+        .site-header{position:sticky;top:0;left:0;right:0;width:100%;border-radius:0;z-index:1000;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.1)}
+        .page{width:100%;max-width:1200px;margin:0 auto;padding:24px}
+        .card{background:#fff;border-radius:18px;box-shadow:var(--shadow);overflow:hidden;margin-bottom:28px}
+        .card-header{background:linear-gradient(135deg,var(--teal-1),var(--teal-2));color:#fff;padding:20px 24px;
+            display:flex;align-items:center;justify-content:space-between}
+        .card-body{padding:22px}
+        .btn{display:inline-block;border:none;cursor:pointer;text-decoration:none;padding:10px 16px;border-radius:12px;font-weight:600}
+        .btn-primary{background:linear-gradient(135deg,var(--teal-1),var(--teal-2));color:#fff;box-shadow:0 10px 20px rgba(32,178,170,.25)}
+        .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px}
+        .item{background:#fff;border-radius:16px;box-shadow:var(--shadow-sm);overflow:hidden;display:flex;flex-direction:column}
+        .thumb{width:100%;height:160px;object-fit:cover;display:block}
+        .content{padding:14px 16px;display:flex;flex-direction:column;gap:10px}
+        .title{font-weight:700;margin-bottom:4px}
+        .muted{color:var(--muted);font-size:.92rem;margin-bottom:6px}
+        .price{font-weight:800}
+        .btn-outline{background:#fff;border:2px solid rgba(32,178,170,.25);color:#20b2aa;padding:10px 14px;border-radius:10px;text-decoration:none;font-weight:600;transition:.2s ease;text-align:center}
+        .btn-outline:hover{border-color:#20b2aa;box-shadow:0 6px 14px rgba(32,178,170,.18);background:#f8fffe}
+        .toast-container{position:fixed;top:80px;right:20px;z-index:9999;display:flex;flex-direction:column;gap:10px}
+        .toast{background:linear-gradient(135deg,var(--teal-1),var(--teal-2));color:#fff;padding:16px 20px;border-radius:12px;box-shadow:var(--shadow);min-width:300px;transform:translateX(400px);opacity:0;transition:all .3s ease;display:flex;align-items:center;gap:10px}
+        .toast.show{transform:translateX(0);opacity:1}
+        .toast-close{background:none;border:none;color:#fff;font-size:1.2rem;cursor:pointer;padding:0;opacity:.8;transition:opacity .2s ease}
+        .toast-close:hover{opacity:1}
+        @media (max-width:560px){.page{padding:16px}.grid{grid-template-columns:1fr}.toast-container{right:10px;left:10px}.toast{min-width:auto}}
+    </style>
+</head>
+<body>
+<th:block th:replace="fragments/header :: siteHeader('medicines', ${username})"></th:block>
+
+<div class="toast-container" id="toastContainer"></div>
+
+<div class="page">
+    <div class="card">
+        <div class="card-header">
+            <span>Branded Medicines</span>
+            <a class="btn btn-primary" th:href="@{/catalog/edit}">Edit</a>
+        </div>
+        <div class="card-body">
+            <div th:if="${#lists.isEmpty(medicines)}" class="muted">No items in the catalog.</div>
+            <div class="grid" th:unless="${#lists.isEmpty(medicines)}">
+                <div class="item" th:each="m : ${medicines}">
+                    <img class="thumb" th:if="${firstImageById != null}" th:src="${firstImageById[m.id]}" alt="image">
+                    <img class="thumb" th:if="${firstImageById == null}" src="/images/default-medicine.png" alt="image">
+                    <div class="content">
+                        <div>
+                            <div class="title" th:text="${m.name}">Medicine</div>
+                            <div class="muted" th:text="${m.dosageForm}">Dosage</div>
+                        </div>
+                        <div class="price" th:text="${#numbers.formatDecimal(m.price, 1, 'COMMA', 2, 'POINT') + ' ден.'}">0.00 ден.</div>
+                        <form th:action="@{/cart/add/{id}(id=${m.id})}" method="post" style="display:inline;">
+                            <input type="hidden" th:if="${_csrf != null}" th:name="${_csrf.parameterName}" th:value="${_csrf.token}">
+                            <button type="submit" class="btn-outline add-to-cart-btn" th:data-name="${m.name}">Add to Cart</button>
+                        </form>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<th:block th:replace="fragments/header :: headerScripts"></th:block>
+<script>
+    function showToast(title, message, type = 'success') {
+        const toastContainer = document.getElementById('toastContainer');
+        const toast = document.createElement('div');
+        toast.className = 'toast';
+        const icon = type === 'success' ? '✅' : '❌';
+        toast.innerHTML = `
+          <div>${icon}</div>
+          <div style="flex:1">
+            <div style="font-weight:700;margin-bottom:2px;">${title}</div>
+            <div style="opacity:.9">${message}</div>
+          </div>
+          <button class="toast-close" onclick="removeToast(this.parentElement)">×</button>
+        `;
+        toastContainer.appendChild(toast);
+        setTimeout(() => toast.classList.add('show'), 100);
+        setTimeout(() => removeToast(toast), 4000);
+    }
+    function removeToast(t){ t.classList.remove('show'); setTimeout(()=>t?.parentElement?.removeChild(t),300); }
+    document.addEventListener('DOMContentLoaded', function() {
+        document.querySelectorAll('form[action*="/cart/add/"]').forEach(form => {
+            form.addEventListener('submit', function(e) {
+                e.preventDefault();
+                const button = form.querySelector('.add-to-cart-btn');
+                const name = button.getAttribute('data-name');
+                const original = button.textContent;
+                button.textContent = 'Adding...'; button.disabled = true;
+                fetch(form.action, { method:'POST', headers:{'Content-Type':'application/x-www-form-urlencoded'} })
+                    .then(r => { if (!r.ok) throw new Error('Add failed'); showToast('Added to Cart!', `${name} has been added to your cart.`,'success'); })
+                    .catch(() => showToast('Error','Failed to add item to cart. Please try again.','error'))
+                    .finally(() => { button.textContent = original; button.disabled = false; });
+            });
+        });
+    });
+</script>
+</body>
+</html>
Index: src/main/resources/templates/index.html
===================================================================
--- src/main/resources/templates/index.html	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/resources/templates/index.html	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -249,9 +249,4 @@
 
                     <div class="button-group">
-                        <form th:action="@{/cart/add/{id}(id=${bm.id})}" method="post" style="display:inline;flex:1">
-                            <button type="submit" class="btn-outline add-to-cart-btn"
-                                    th:data-name="${bm.name}"
-                                    style="width:100%">Add to Cart</button>
-                        </form>
                         <a class="btn-outline" th:href="@{/branded-medicines/{id}/edit(id=${bm.id})}">Edit</a>
                     </div>
Index: src/main/resources/templates/payment.html
===================================================================
--- src/main/resources/templates/payment.html	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/resources/templates/payment.html	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -5,7 +5,5 @@
   <title>SynergyMed – Payment</title>
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-
   <th:block th:replace="fragments/header :: headerStyles"></th:block>
-
   <style>
     * { margin:0; padding:0; box-sizing:border-box; }
@@ -16,46 +14,17 @@
       color:#1f2937;
     }
-
-    .site-header {
-      position: sticky; top:0; left:0; right:0;
-      width:100%; border-radius:0; z-index:1000;
-      background:white !important; box-shadow:0 2px 10px rgba(0,0,0,0.1);
-    }
-
+    .site-header { position: sticky; top:0; left:0; right:0; width:100%; border-radius:0; z-index:1000; background:white !important; box-shadow:0 2px 10px rgba(0,0,0,0.1); }
     .container { max-width:800px; margin:40px auto; padding:20px; }
-
-    .card {
-      background:white; border-radius:20px; box-shadow:0 10px 30px rgba(0,0,0,.1);
-      overflow:hidden; margin-bottom:30px;
-    }
-    .card-header {
-      background:linear-gradient(135deg,#20b2aa,#48d1cc);
-      color:white; padding:25px 30px; font-size:1.3rem; font-weight:600;
-    }
+    .card { background:white; border-radius:20px; box-shadow:0 10px 30px rgba(0,0,0,.1); overflow:hidden; margin-bottom:30px; }
+    .card-header { background:linear-gradient(135deg,#20b2aa,#48d1cc); color:white; padding:25px 30px; font-size:1.3rem; font-weight:600; }
     .card-body { padding:30px; }
-
     .form-group { margin-bottom:25px; }
     .form-group label { display:block; margin-bottom:8px; color:#555; font-weight:500; font-size:.9rem; }
-    .form-control {
-      width:100%; padding:15px 20px; border:2px solid #e1e5e9; border-radius:12px;
-      font-size:1rem; transition:all .3s ease; background:#f8f9fa;
-    }
-    .form-control:focus {
-      outline:none; border-color:#20b2aa; background:white;
-      box-shadow:0 0 0 3px rgba(32,178,170,.1);
-    }
-
-    .btn-submit {
-      width:100%; padding:15px; background:linear-gradient(135deg,#20b2aa,#48d1cc);
-      color:white; border:none; border-radius:12px;
-      font-size:1rem; font-weight:600; cursor:pointer; transition:.3s;
-      text-transform:uppercase; letter-spacing:1px;
-    }
+    .form-control { width:100%; padding:15px 20px; border:2px solid #e1e5e9; border-radius:12px; font-size:1rem; transition:all .3s ease; background:#f8f9fa; }
+    .form-control:focus { outline:none; border-color:#20b2aa; background:white; box-shadow:0 0 0 3px rgba(32,178,170,.1); }
+    .btn-submit { width:100%; padding:15px; background:linear-gradient(135deg,#20b2aa,#48d1cc); color:white; border:none; border-radius:12px; font-size:1rem; font-weight:600; cursor:pointer; transition:.3s; text-transform:uppercase; letter-spacing:1px; }
     .btn-submit:hover { transform:translateY(-2px); box-shadow:0 10px 20px rgba(32,178,170,.3); }
-
-    .cart-total {
-      text-align:right; font-size:1.3rem; font-weight:700;
-      margin-top:20px; color:#20b2aa;
-    }
+    .cart-total { text-align:right; font-size:1.1rem; font-weight:700; margin-top:10px; }
+    .muted { color:#6c757d }
   </style>
 </head>
@@ -68,32 +37,28 @@
     <div class="card-body">
       <form th:action="@{/payment}" method="post">
-        <!-- Payment Method -->
+        <input type="hidden" name="useCard" th:value="${useCard}">
         <div class="form-group">
           <label for="paymentMethodId">Select Payment Method</label>
           <select id="paymentMethodId" name="paymentMethodId" class="form-control" required>
             <option value="">Choose a payment method...</option>
-            <option th:each="pm : ${methods}"
-                    th:value="${pm.id}"
-                    th:text="${pm.methodName}">Credit Card</option>
+            <option th:each="pm : ${methods}" th:value="${pm.id}" th:text="${pm.methodName}">Card</option>
           </select>
         </div>
 
-        <!-- Delivery Company -->
         <div class="form-group">
           <label for="deliveryCompanyId">Select Delivery Company</label>
           <select id="deliveryCompanyId" name="deliveryCompanyId" class="form-control" required>
             <option value="">Choose a delivery company...</option>
-            <option th:each="dc : ${deliveryCompanies}"
-                    th:value="${dc.id}"
-                    th:text="${dc.company.companyName}">FedEx</option>
+            <option th:each="dc : ${deliveryCompanies}" th:value="${dc.id}" th:text="${dc.company.companyName}">Courier</option>
           </select>
         </div>
 
-        <!-- Total -->
         <div class="cart-total">
+          <div class="muted" th:if="${discount != null && discount > 0}">
+            Discount: <span th:text="${discount + ' ден.'}">0 ден.</span>
+          </div>
           Total: <span th:text="${#numbers.formatDecimal(total, 1, 'COMMA', 2, 'POINT') + ' ден.'}">0.00 ден.</span>
         </div>
 
-        <!-- Submit -->
         <button type="submit" class="btn-submit">Pay Now</button>
       </form>
Index: src/main/resources/templates/profile-clubcard.html
===================================================================
--- src/main/resources/templates/profile-clubcard.html	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
+++ src/main/resources/templates/profile-clubcard.html	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -0,0 +1,225 @@
+<!DOCTYPE html>
+<html lang="en" xmlns:th="http://www.thymeleaf.org">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>SynergyMed - Club Card</title>
+
+    <!-- Shared header styles -->
+    <th:block th:replace="fragments/header :: headerStyles"></th:block>
+
+    <style>
+        * { margin: 0; padding: 0; box-sizing: border-box; }
+        body {
+            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+            background: linear-gradient(135deg, #a4ecba 0%, #f7f7f8 100%);
+            min-height: 100vh;
+        }
+
+        /* Full-width sticky header (same look as examples) */
+        .site-header {
+            position: sticky; top: 0; left: 0; right: 0;
+            width: 100%;
+            border-radius: 0;
+            z-index: 1000;
+        }
+
+        /* container same size as examples */
+        .container {
+            max-width: 1200px;
+            margin: 0 auto;
+            padding: 20px;
+        }
+
+        .header {
+            background: white;
+            border-radius: 20px;
+            box-shadow: 0 10px 30px rgba(0, 0, 0, .1);
+            margin-bottom: 30px;
+            overflow: hidden;
+        }
+
+        .header-content {
+            background: linear-gradient(135deg, #20b2aa, #48d1cc);
+            color: white;
+            padding: 30px;
+            display: flex;
+            align-items: center;
+            gap: 30px;
+        }
+
+        .profile-picture {
+            width: 120px; height: 120px; border-radius: 50%;
+            background: #888; display: flex; align-items: center; justify-content: center;
+            font-size: 48px; font-weight: bold; color: white;
+            border: 4px solid rgba(255,255,255,.3);
+        }
+
+        .profile-info h1 { font-size: 2.5rem; font-weight: 300; margin-bottom: 10px; }
+        .profile-info p { font-size: 1.1rem; opacity: .9; margin-bottom: 5px; }
+
+        .profile-meta { display: flex; gap: 30px; margin-top: 15px; flex-wrap: wrap; }
+        .meta-item { background: rgba(255,255,255,.2); padding: 8px 16px; border-radius: 20px; font-size: .9rem; }
+
+        .nav-bar {
+            background: white; border-radius: 15px;
+            box-shadow: 0 5px 15px rgba(0,0,0,.1);
+            margin-bottom: 30px; padding: 20px 30px;
+        }
+        .nav-links { display: flex; gap: 20px; align-items: center; flex-wrap: wrap; }
+        .nav-link { color:#20b2aa; text-decoration:none; padding:10px 20px; border-radius:25px; transition:.3s; font-weight:500; }
+        .nav-link:hover, .nav-link.active { background:linear-gradient(135deg,#20b2aa,#48d1cc); color:white; }
+
+        /* Ensure logout looks identical to examples */
+        .logout-btn {
+            margin-left:auto;
+            background:linear-gradient(135deg,#ff6b6b,#ee5a24);
+            color:#fff;
+            padding:10px 20px;
+            border-radius:25px;
+            text-decoration:none;
+            font-weight:600;
+            border:none;
+            box-shadow: 0 5px 15px rgba(238,90,36,.30);
+            transition: transform .2s ease, box-shadow .2s ease;
+            display:inline-flex; align-items:center; justify-content:center;
+        }
+        .logout-btn:hover { transform:translateY(-2px); box-shadow:0 10px 20px rgba(238,90,36,.35); }
+
+        .main-content { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
+
+        .card {
+            background: white; border-radius: 20px;
+            box-shadow: 0 10px 30px rgba(0,0,0,.1);
+            overflow: hidden;
+        }
+        .card-header { background: linear-gradient(135deg,#20b2aa,#48d1cc); color:white; padding:25px 30px; font-size:1.3rem; font-weight:600; }
+        .card-body { padding: 30px; }
+
+        .info-grid { display: grid; gap: 20px; }
+        .info-item { display: flex; justify-content: space-between; padding: 15px 0; border-bottom: 1px solid #f0f0f0; }
+        .info-item:last-child { border-bottom: none; }
+
+        .info-label { font-weight: 600; color: #555; font-size: .95rem; }
+        .info-value { color: #333; font-size: 1rem; }
+
+        /* Club card form styles (right column) */
+        .row { display:flex; justify-content:space-between; align-items:center; padding:10px 0; border-bottom:1px solid #f0f0f0; gap:12px; }
+        label { font-weight:600; color:#374151; min-width:140px; }
+        select, input[type=text] { padding:10px 12px; border:1px solid #e5e7eb; border-radius:10px; flex:1; background:#fff; }
+        .actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:16px; }
+        .btn { display:inline-block; padding:10px 16px; border-radius:10px; border:1px solid #e5e7eb; background:#fff; font-weight:600; cursor:pointer; }
+        .btn-primary { background:linear-gradient(135deg,#20b2aa,#48d1cc); color:#fff; border:none; }
+        .muted { color:#6b7280; }
+
+        .stat {
+            display:flex; align-items:center; justify-content:space-between;
+            padding:14px 16px; border:1px solid #eef2f7; border-radius:12px; margin-bottom:12px;
+            background:#f9fafb;
+        }
+        .stat-label { color:#6b7280; font-weight:600; }
+        .stat-value { color:#111827; font-weight:700; }
+
+        @media(max-width: 992px) { .main-content { grid-template-columns: 1fr; } }
+    </style>
+</head>
+<body>
+
+<!-- Top site header; activePage null for profile area -->
+<th:block th:replace="fragments/header :: siteHeader(${null}, ${username})"></th:block>
+
+<div class="container">
+    <!-- Profile Header (same as profile) -->
+    <div class="header">
+        <div class="header-content">
+            <div class="profile-picture">
+                <span th:text="${user.firstName.substring(0,1).toUpperCase() + user.lastName.substring(0,1).toUpperCase()}">AB</span>
+            </div>
+            <div class="profile-info">
+                <h1 th:text="${user.firstName + ' ' + user.lastName}">John Doe</h1>
+                <p th:text="'@' + ${username}">@johndoe</p>
+                <p th:text="${user.email}">john.doe@email.com</p>
+                <div class="profile-meta">
+                    <div class="meta-item" th:text="'Member since ' + ${#temporals.format(user.dateCreated, 'MMM yyyy')}">Member since Jan 2024</div>
+                    <div class="meta-item" th:text="'Age ' + ${T(java.time.Period).between(user.dateOfBirth, T(java.time.LocalDate).now()).getYears()}">Age 30</div>
+                    <div class="meta-item" th:text="${user.gender ?: 'Not specified'}">Male</div>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <!-- Navigation with Club Card active -->
+    <div class="nav-bar">
+        <div class="nav-links">
+            <a th:href="@{/profile}" class="nav-link" th:classappend="${activeTab}=='profile' ? ' active'">Profile</a>
+            <a th:href="@{/profile/prescriptions}" class="nav-link" th:classappend="${activeTab}=='prescriptions' ? ' active'">Prescriptions</a>
+            <a th:href="@{/profile/clubcard}" class="nav-link" th:classappend="${activeTab}=='clubcard' ? ' active'">Club Card</a>
+            <a th:href="@{/allergies/manage}" class="nav-link">Manage Allergies</a>
+            <a th:href="@{/profile/contacts}" class="nav-link" th:classappend="${activeTab}=='contacts' ? ' active'">Contact Info</a>
+            <a th:href="@{/logout}" class="logout-btn">Logout</a>
+        </div>
+    </div>
+
+    <!-- Main Content -->
+    <div class="main-content">
+        <!-- Left: Personal information (same as profile) -->
+        <div class="card">
+            <div class="card-header">Personal Information</div>
+            <div class="card-body">
+                <div class="info-grid">
+                    <div class="info-item"><span class="info-label">Full Name</span><span class="info-value" th:text="${user.firstName + ' ' + user.lastName}">John Doe</span></div>
+                    <div class="info-item"><span class="info-label">Username</span><span class="info-value" th:text="${username}">johndoe</span></div>
+                    <div class="info-item"><span class="info-label">Email</span><span class="info-value" th:text="${user.email}">john@email.com</span></div>
+                    <div class="info-item"><span class="info-label">Date of Birth</span><span class="info-value" th:text="${#temporals.format(user.dateOfBirth, 'dd MMM yyyy')}">15 Jan 1990</span></div>
+                    <div class="info-item"><span class="info-label">Gender</span><span class="info-value" th:text="${user.gender ?: 'Not specified'}">Male</span></div>
+                    <div class="info-item"><span class="info-label">Member Since</span><span class="info-value" th:text="${#temporals.format(user.dateCreated, 'dd MMM yyyy')}">01 Jan 2024</span></div>
+                </div>
+            </div>
+        </div>
+
+        <!-- Right: Club Card -->
+        <div class="card">
+            <div class="card-header">Club Card</div>
+            <div class="card-body">
+                <!-- If user already has a club card, show its data -->
+                <div th:if="${hasClubcard}">
+                    <div class="stat">
+                        <span class="stat-label">Program</span>
+                        <span class="stat-value" th:text="${clubcard.clubProgram}">Default Loyalty Program</span>
+                    </div>
+                    <div class="stat">
+                        <span class="stat-label">Points</span>
+                        <span class="stat-value" th:text="${clubcard.points}">0</span>
+                    </div>
+                    <p class="muted" style="margin-top:10px;">Earn points with purchases and enjoy benefits under your current program.</p>
+                </div>
+
+                <!-- Otherwise, allow creating a new card and choosing a program -->
+                <div th:unless="${hasClubcard}">
+                    <p class="muted" style="margin-bottom:14px;">No club card found. Choose a program and create a new card to start earning points.</p>
+                    <form th:action="@{/profile/clubcard/create}" method="post">
+                        <div class="row">
+                            <label for="program">Program</label>
+                            <select id="program" name="program" required>
+                                <option value="Default Loyalty Program" selected>Default Loyalty Program</option>
+                                <option value="Silver Rewards">Silver Rewards</option>
+                                <option value="Gold Rewards">Gold Rewards</option>
+                                <option value="Platinum Elite">Platinum Elite</option>
+                            </select>
+                        </div>
+
+                        <div class="actions" style="align-items:center;">
+                            <button type="submit" class="btn btn-primary">Create Club Card</button>
+                        </div>
+                    </form>
+                    <p class="muted" style="margin-top:10px;">Program benefits and point accrual may vary by tier.</p>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<!-- Shared header behavior scripts -->
+<th:block th:replace="fragments/header :: headerScripts"></th:block>
+</body>
+</html>
Index: src/main/resources/templates/profile-contacts.html
===================================================================
--- src/main/resources/templates/profile-contacts.html	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/resources/templates/profile-contacts.html	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -133,7 +133,6 @@
         <div class="nav-links">
             <a th:href="@{/profile}" class="nav-link" th:classappend="${activeTab}=='profile' ? ' active'">Profile</a>
-            <a href="#" class="nav-link">Medical History</a>
             <a th:href="@{/profile/prescriptions}" class="nav-link" th:classappend="${activeTab}=='prescriptions' ? ' active'">Prescriptions</a>
-            <a href="#" class="nav-link">Club Card</a>
+            <a th:href="@{/profile/clubcard}" class="nav-link" th:classappend="${activeTab}=='clubcard' ? ' active'">Club Card</a>
             <a th:href="@{/allergies/manage}" class="nav-link">Manage Allergies</a>
             <a th:href="@{/profile/contacts}" class="nav-link" th:classappend="${activeTab}=='contacts' ? ' active'">Contact Info</a>
Index: src/main/resources/templates/profile-prescriptions.html
===================================================================
--- src/main/resources/templates/profile-prescriptions.html	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/resources/templates/profile-prescriptions.html	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -83,7 +83,6 @@
         <div class="nav-links">
             <a th:href="@{/profile}" class="nav-link">Profile</a>
-            <a href="#" class="nav-link">Medical History</a>
             <a th:href="@{/profile/prescriptions}" class="nav-link active">Prescriptions</a>
-            <a href="#" class="nav-link">Club Card</a>
+            <a th:href="@{/profile/clubcard}" class="nav-link" th:classappend="${activeTab}=='clubcard' ? ' active'">Club Card</a>
             <a th:href="@{/allergies/manage}" class="nav-link">Manage Allergies</a>
             <a th:href="@{/profile/contacts}" class="nav-link">Contact Info</a>
Index: src/main/resources/templates/profile.html
===================================================================
--- src/main/resources/templates/profile.html	(revision a2fc3d8fd7c3365edd220ed4fa0e7e857b76899e)
+++ src/main/resources/templates/profile.html	(revision ac37cef6bb4b48a8e9af88acbdc4a18271b99765)
@@ -142,7 +142,6 @@
         <div class="nav-links">
             <a th:href="@{/profile}" class="nav-link" th:classappend="${activeTab}=='profile' ? ' active'">Profile</a>
-            <a href="#" class="nav-link">Medical History</a>
             <a th:href="@{/profile/prescriptions}" class="nav-link" th:classappend="${activeTab}=='prescriptions' ? ' active'">Prescriptions</a>
-            <a href="#" class="nav-link">Club Card</a>
+            <a th:href="@{/profile/clubcard}" class="nav-link" th:classappend="${activeTab}=='clubcard' ? ' active'">Club Card</a>
             <a th:href="@{/allergies/manage}" class="nav-link">Manage Allergies</a>
             <a th:href="@{/profile/contacts}" class="nav-link" th:classappend="${activeTab}=='contacts' ? ' active'">Contact Info</a>