docs: Add comprehensive invoice system implementation guide

- Document various invoice generation approaches (PDF, HTML-to-PDF, Stripe)
- Compare Stripe Payment Intents vs Invoicing vs Checkout Sessions
- Provide complete code implementation with models, controllers, services
- Include phase-by-phase implementation strategy for current use case
- Add testing, security, and deployment guidelines
- Recommend hybrid approach: keep current checkout + post-payment invoices

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

app/assets/stylesheets/components/footer.css

@@ -1,82 +0,0 @@
-
-.footer {
-  background: var(--color-neutral-800);
-  color: var(--color-neutral-300);
-  padding: var(--space-8) 0 var(--space-4);
-}
-
-.footer-content {
-  display: grid;
-  gap: var(--space-6);
-  margin-bottom: var(--space-6);
-}
-
-@media (min-width: 768px) {
-  .footer-content {
-    grid-template-columns: repeat(2, 1fr);
-  }
-}
-
-@media (min-width: 1024px) {
-  .footer-content {
-    grid-template-columns: repeat(4, 1fr);
-  }
-}
-
-.footer-section h3 {
-  font-family: var(--font-display);
-  font-weight: 700;
-  margin-bottom: var(--space-3);
-  color: white;
-  font-size: var(--text-lg);
-}
-
-.footer-links {
-  list-style: none;
-}
-
-.footer-links li {
-  margin-bottom: var(--space-2);
-}
-
-.footer-links a {
-  color: var(--color-neutral-400);
-  text-decoration: none;
-  transition: color var(--duration-normal);
-  font-size: var(--text-sm);
-}
-
-.footer-links a:hover {
-  color: var(--color-accent-400);
-}
-
-.footer-bottom {
-  border-top: 1px solid var(--color-neutral-700);
-  padding-top: var(--space-4);
-  text-align: center;
-  color: var(--color-neutral-400);
-  font-size: var(--text-sm);
-}
-
-@media (max-width: 768px) {
-  .hero {
-    padding: var(--space-8) 0 var(--space-6);
-  }
-
-  .cta-group {
-    flex-direction: column;
-    align-items: center;
-  }
-
-  .hero-stats {
-    gap: var(--space-4);
-  }
-
-  .features-grid {
-    grid-template-columns: 1fr;
-  }
-
-  .stats-grid {
-    grid-template-columns: repeat(2, 1fr);
-  }
-}

app/views/components/_header.html.erb

@@ -1,18 +1,18 @@
 <header class="bg-neutral-800 border-b border-neutral-700">
   <nav data-controller="header" class="container mx-auto px-4 sm:px-6 lg:px-8">
-    <div class="flex justify-between h-16">
+    <div class="flex items-center h-16 justify-between">
       <!-- Logo -->
-      <div class="flex items-center">
+      <div class="flex-shrink-0 flex items-center">
         <%= link_to Rails.application.config.app_name, current_user ? "/dashboard" : "/",
             class: "text-xl font-bold text-white" %>
       </div>
 
       <!-- Desktop Navigation -->
-      <div class="hidden sm:flex items-center space-x-6">
+      <div class="hidden sm:flex items-center space-x-6 w-full justify-start">
         <%= link_to t("header.parties"), events_path,
-            class: "text-gray-100 hover:text-purple-200 py-2 rounded-md text-sm font-medium transition-colors duration-200" %>
+            class: "mx-4 text-gray-100 hover:text-purple-200 py-2 rounded-md text-sm font-medium transition-colors duration-200" %>
         <%= link_to t("header.concerts"), "#",
-            class: "text-gray-100 hover:text-purple-200 py-2 rounded-md text-sm font-medium transition-colors duration-200" %>
+            class: "mx-4 text-gray-100 hover:text-purple-200 py-2 rounded-md text-sm font-medium transition-colors duration-200" %>
       </div>
 
       <!-- Authentication -->
@@ -26,17 +26,6 @@
                 <path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd" />
               </svg>
             </button>
-
-            <div data-header-target="userMenu" class="absolute right-0 mt-2 w-48 rounded-md shadow-lg z-50 hidden">
-              <%= link_to t("header.profile"), edit_user_registration_path,
-                  class: "block px-4 py-2 text-sm text-gray-100 hover:bg-purple-700 first:rounded-t-md" %>
-              <%= link_to t("header.reservations"), "#",
-                  class: "block px-4 py-2 text-sm text-gray-100 hover:bg-purple-700" %>
-              <%= link_to t("header.logout"), destroy_user_session_path,
-                  data: { controller: "logout", action: "click->logout#signOut",
-                         logout_url_value: destroy_user_session_path, redirect_url_value: "/", turbo: false },
-                  class: "block px-4 py-2 text-sm text-gray-100 hover:bg-purple-700 last:rounded-b-md" %>
-            </div>
           </div>
         <% else %>
           <%= link_to t("header.login"), new_user_session_path,
@@ -47,7 +36,7 @@
       </div>
 
       <!-- Mobile menu button -->
-      <div class="flex items-center sm:hidden">
+      <div class="flex-shrink-0 sm:hidden">
         <button data-action="click->header#toggleMobileMenu" data-header-target="mobileMenuButton" class="p-2 rounded-md text-neutral-300 hover:text-white hover:bg-purple-700">
           <svg data-menu-icon="open" class="h-6 w-6" stroke="currentColor" fill="none" viewBox="0 0 24 24">
             <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />

app/views/events/index.html.erb

@@ -6,6 +6,7 @@
       événements trouvés
     </div>
   </div>
+
   <!-- Breadcrumb -->
   <nav class="mb-6" aria-label="Breadcrumb">
     <ol class="flex items-center space-x-2 text-sm">