diff --git a/.mailmap b/.mailmap
index 6bd29747..33469c51 100644
--- a/.mailmap
+++ b/.mailmap
@@ -15,4 +15,5 @@ Vial <robin.trioux@utbm.fr>
 Zar <antoine.charmeau@utbm.fr> <antoine.charmeau@laposte.net>
 root <root@localhost.localdomain>
 tleb <tleb@openmailbox.org> <theo.lebrun@live.fr>
-tleb <tleb@openmailbox.org> <theo.lebrun@utbm.fr>
\ No newline at end of file
+tleb <tleb@openmailbox.org> <theo.lebrun@utbm.fr>
+Maréchal <thgirod@hotmail.com>
\ No newline at end of file
diff --git a/core/management/commands/populate.py b/core/management/commands/populate.py
index 0c661b1d..130a139d 100644
--- a/core/management/commands/populate.py
+++ b/core/management/commands/populate.py
@@ -505,6 +505,8 @@ Welcome to the wiki page!
             refound.save()
 
             # Counters
+            subscribers = Group.objects.get(name="Subscribers")
+            old_subscribers = Group.objects.get(name="Old subscribers")
             Customer(user=skia, account_id="6568j", amount=0).save()
             Customer(user=r, account_id="4000k", amount=0).save()
             p = ProductType(name="Bières bouteilles")
@@ -525,6 +527,9 @@ Welcome to the wiki page!
                 club=main_club,
             )
             cotis.save()
+            cotis.buying_groups.add(subscribers)
+            cotis.buying_groups.add(old_subscribers)
+            cotis.save()
             cotis2 = Product(
                 name="Cotis 2 semestres",
                 code="2SCOTIZ",
@@ -535,6 +540,9 @@ Welcome to the wiki page!
                 club=main_club,
             )
             cotis2.save()
+            cotis2.buying_groups.add(subscribers)
+            cotis2.buying_groups.add(old_subscribers)
+            cotis2.save()
             refill = Product(
                 name="Rechargement 15 €",
                 code="15REFILL",
@@ -545,6 +553,8 @@ Welcome to the wiki page!
                 club=main_club,
             )
             refill.save()
+            refill.buying_groups.add(subscribers)
+            refill.save()
             barb = Product(
                 name="Barbar",
                 code="BARB",
@@ -553,8 +563,11 @@ Welcome to the wiki page!
                 selling_price="1.7",
                 special_selling_price="1.6",
                 club=main_club,
+                limit_age=18,
             )
             barb.save()
+            barb.buying_groups.add(subscribers)
+            barb.save()
             cble = Product(
                 name="Chimay Bleue",
                 code="CBLE",
@@ -563,8 +576,11 @@ Welcome to the wiki page!
                 selling_price="1.7",
                 special_selling_price="1.6",
                 club=main_club,
+                limit_age=18,
             )
             cble.save()
+            cble.buying_groups.add(subscribers)
+            cble.save()
             cons = Product(
                 name="Consigne Eco-cup",
                 code="CONS",
@@ -574,7 +590,6 @@ Welcome to the wiki page!
                 special_selling_price="1",
                 club=main_club,
             )
-            cons.id = 1152
             cons.save()
             dcons = Product(
                 name="Déconsigne Eco-cup",
@@ -585,9 +600,8 @@ Welcome to the wiki page!
                 special_selling_price="-1",
                 club=main_club,
             )
-            dcons.id = 1151
             dcons.save()
-            Product(
+            cors = Product(
                 name="Corsendonk",
                 code="CORS",
                 product_type=p,
@@ -595,8 +609,12 @@ Welcome to the wiki page!
                 selling_price="1.7",
                 special_selling_price="1.6",
                 club=main_club,
-            ).save()
-            Product(
+                limit_age=18,
+            )
+            cors.save()
+            cors.buying_groups.add(subscribers)
+            cors.save()
+            carolus = Product(
                 name="Carolus",
                 code="CARO",
                 product_type=p,
@@ -604,7 +622,11 @@ Welcome to the wiki page!
                 selling_price="1.7",
                 special_selling_price="1.6",
                 club=main_club,
-            ).save()
+                limit_age=18,
+            )
+            carolus.save()
+            carolus.buying_groups.add(subscribers)
+            carolus.save()
             mde = Counter.objects.filter(name="MDE").first()
             mde.products.add(barb)
             mde.products.add(cble)
diff --git a/core/models.py b/core/models.py
index 1d1d4266..0d0dc0b7 100644
--- a/core/models.py
+++ b/core/models.py
@@ -325,6 +325,13 @@ class User(AbstractBaseUser):
         )
         return s.exists()
 
+    @cached_property
+    def account_balance(self):
+        if hasattr(self, "customer"):
+            return self.customer.amount
+        else:
+            return 0
+
     _club_memberships = {}
     _group_names = {}
     _group_ids = {}
@@ -459,6 +466,20 @@ class User(AbstractBaseUser):
     def is_banned_counter(self):
         return self.is_in_group(settings.SITH_GROUP_BANNED_COUNTER_ID)
 
+    @cached_property
+    def age(self) -> int:
+        """
+        Return the age this user has the day the method is called.
+        """
+        today = timezone.now()
+        age = today.year - self.date_of_birth.year
+        # remove a year if this year's birthday is yet to come
+        age -= (today.month, today.day) < (
+            self.date_of_birth.month,
+            self.date_of_birth.day,
+        )
+        return age
+
     def save(self, *args, **kwargs):
         create = False
         with transaction.atomic():
diff --git a/core/static/core/js/alpinejs.min.js b/core/static/core/js/alpinejs.min.js
new file mode 100644
index 00000000..b1337926
--- /dev/null
+++ b/core/static/core/js/alpinejs.min.js
@@ -0,0 +1,5 @@
+(()=>{var We=!1,Ge=!1,B=[];function $t(e){an(e)}function an(e){B.includes(e)||B.push(e),cn()}function he(e){let t=B.indexOf(e);t!==-1&&B.splice(t,1)}function cn(){!Ge&&!We&&(We=!0,queueMicrotask(ln))}function ln(){We=!1,Ge=!0;for(let e=0;e<B.length;e++)B[e]();B.length=0,Ge=!1}var A,K,Y,Ye,Je=!0;function Lt(e){Je=!1,e(),Je=!0}function jt(e){A=e.reactive,Y=e.release,K=t=>e.effect(t,{scheduler:r=>{Je?$t(r):r()}}),Ye=e.raw}function Ze(e){K=e}function Ft(e){let t=()=>{};return[n=>{let i=K(n);return e._x_effects||(e._x_effects=new Set,e._x_runEffects=()=>{e._x_effects.forEach(o=>o())}),e._x_effects.add(i),t=()=>{i!==void 0&&(e._x_effects.delete(i),Y(i))},i},()=>{t()}]}var Bt=[],Kt=[],zt=[];function Vt(e){zt.push(e)}function _e(e,t){typeof t=="function"?(e._x_cleanups||(e._x_cleanups=[]),e._x_cleanups.push(t)):(t=e,Kt.push(t))}function Ht(e){Bt.push(e)}function qt(e,t,r){e._x_attributeCleanups||(e._x_attributeCleanups={}),e._x_attributeCleanups[t]||(e._x_attributeCleanups[t]=[]),e._x_attributeCleanups[t].push(r)}function Qe(e,t){!e._x_attributeCleanups||Object.entries(e._x_attributeCleanups).forEach(([r,n])=>{(t===void 0||t.includes(r))&&(n.forEach(i=>i()),delete e._x_attributeCleanups[r])})}var et=new MutationObserver(Xe),tt=!1;function rt(){et.observe(document,{subtree:!0,childList:!0,attributes:!0,attributeOldValue:!0}),tt=!0}function fn(){un(),et.disconnect(),tt=!1}var te=[],nt=!1;function un(){te=te.concat(et.takeRecords()),te.length&&!nt&&(nt=!0,queueMicrotask(()=>{dn(),nt=!1}))}function dn(){Xe(te),te.length=0}function m(e){if(!tt)return e();fn();let t=e();return rt(),t}var it=!1,ge=[];function Ut(){it=!0}function Wt(){it=!1,Xe(ge),ge=[]}function Xe(e){if(it){ge=ge.concat(e);return}let t=[],r=[],n=new Map,i=new Map;for(let o=0;o<e.length;o++)if(!e[o].target._x_ignoreMutationObserver&&(e[o].type==="childList"&&(e[o].addedNodes.forEach(s=>s.nodeType===1&&t.push(s)),e[o].removedNodes.forEach(s=>s.nodeType===1&&r.push(s))),e[o].type==="attributes")){let s=e[o].target,a=e[o].attributeName,c=e[o].oldValue,l=()=>{n.has(s)||n.set(s,[]),n.get(s).push({name:a,value:s.getAttribute(a)})},u=()=>{i.has(s)||i.set(s,[]),i.get(s).push(a)};s.hasAttribute(a)&&c===null?l():s.hasAttribute(a)?(u(),l()):u()}i.forEach((o,s)=>{Qe(s,o)}),n.forEach((o,s)=>{Bt.forEach(a=>a(s,o))});for(let o of r)if(!t.includes(o)&&(Kt.forEach(s=>s(o)),o._x_cleanups))for(;o._x_cleanups.length;)o._x_cleanups.pop()();t.forEach(o=>{o._x_ignoreSelf=!0,o._x_ignore=!0});for(let o of t)r.includes(o)||!o.isConnected||(delete o._x_ignoreSelf,delete o._x_ignore,zt.forEach(s=>s(o)),o._x_ignore=!0,o._x_ignoreSelf=!0);t.forEach(o=>{delete o._x_ignoreSelf,delete o._x_ignore}),t=null,r=null,n=null,i=null}function xe(e){return D(k(e))}function C(e,t,r){return e._x_dataStack=[t,...k(r||e)],()=>{e._x_dataStack=e._x_dataStack.filter(n=>n!==t)}}function ot(e,t){let r=e._x_dataStack[0];Object.entries(t).forEach(([n,i])=>{r[n]=i})}function k(e){return e._x_dataStack?e._x_dataStack:typeof ShadowRoot=="function"&&e instanceof ShadowRoot?k(e.host):e.parentNode?k(e.parentNode):[]}function D(e){let t=new Proxy({},{ownKeys:()=>Array.from(new Set(e.flatMap(r=>Object.keys(r)))),has:(r,n)=>e.some(i=>i.hasOwnProperty(n)),get:(r,n)=>(e.find(i=>{if(i.hasOwnProperty(n)){let o=Object.getOwnPropertyDescriptor(i,n);if(o.get&&o.get._x_alreadyBound||o.set&&o.set._x_alreadyBound)return!0;if((o.get||o.set)&&o.enumerable){let s=o.get,a=o.set,c=o;s=s&&s.bind(t),a=a&&a.bind(t),s&&(s._x_alreadyBound=!0),a&&(a._x_alreadyBound=!0),Object.defineProperty(i,n,{...c,get:s,set:a})}return!0}return!1})||{})[n],set:(r,n,i)=>{let o=e.find(s=>s.hasOwnProperty(n));return o?o[n]=i:e[e.length-1][n]=i,!0}});return t}function ye(e){let t=n=>typeof n=="object"&&!Array.isArray(n)&&n!==null,r=(n,i="")=>{Object.entries(Object.getOwnPropertyDescriptors(n)).forEach(([o,{value:s,enumerable:a}])=>{if(a===!1||s===void 0)return;let c=i===""?o:`${i}.${o}`;typeof s=="object"&&s!==null&&s._x_interceptor?n[o]=s.initialize(e,c,o):t(s)&&s!==n&&!(s instanceof Element)&&r(s,c)})};return r(e)}function be(e,t=()=>{}){let r={initialValue:void 0,_x_interceptor:!0,initialize(n,i,o){return e(this.initialValue,()=>pn(n,i),s=>st(n,i,s),i,o)}};return t(r),n=>{if(typeof n=="object"&&n!==null&&n._x_interceptor){let i=r.initialize.bind(r);r.initialize=(o,s,a)=>{let c=n.initialize(o,s,a);return r.initialValue=c,i(o,s,a)}}else r.initialValue=n;return r}}function pn(e,t){return t.split(".").reduce((r,n)=>r[n],e)}function st(e,t,r){if(typeof t=="string"&&(t=t.split(".")),t.length===1)e[t[0]]=r;else{if(t.length===0)throw error;return e[t[0]]||(e[t[0]]={}),st(e[t[0]],t.slice(1),r)}}var Gt={};function x(e,t){Gt[e]=t}function re(e,t){return Object.entries(Gt).forEach(([r,n])=>{Object.defineProperty(e,`$${r}`,{get(){let[i,o]=at(t);return i={interceptor:be,...i},_e(t,o),n(t,i)},enumerable:!1})}),e}function Yt(e,t,r,...n){try{return r(...n)}catch(i){J(i,e,t)}}function J(e,t,r=void 0){Object.assign(e,{el:t,expression:r}),console.warn(`Alpine Expression Error: ${e.message}
+
+${r?'Expression: "'+r+`"
+
+`:""}`,t),setTimeout(()=>{throw e},0)}var ve=!0;function Jt(e){let t=ve;ve=!1,e(),ve=t}function P(e,t,r={}){let n;return g(e,t)(i=>n=i,r),n}function g(...e){return Zt(...e)}var Zt=ct;function Qt(e){Zt=e}function ct(e,t){let r={};re(r,e);let n=[r,...k(e)];if(typeof t=="function")return mn(n,t);let i=hn(n,t,e);return Yt.bind(null,e,t,i)}function mn(e,t){return(r=()=>{},{scope:n={},params:i=[]}={})=>{let o=t.apply(D([n,...e]),i);we(r,o)}}var lt={};function _n(e,t){if(lt[e])return lt[e];let r=Object.getPrototypeOf(async function(){}).constructor,n=/^[\n\s]*if.*\(.*\)/.test(e)||/^(let|const)\s/.test(e)?`(() => { ${e} })()`:e,o=(()=>{try{return new r(["__self","scope"],`with (scope) { __self.result = ${n} }; __self.finished = true; return __self.result;`)}catch(s){return J(s,t,e),Promise.resolve()}})();return lt[e]=o,o}function hn(e,t,r){let n=_n(t,r);return(i=()=>{},{scope:o={},params:s=[]}={})=>{n.result=void 0,n.finished=!1;let a=D([o,...e]);if(typeof n=="function"){let c=n(n,a).catch(l=>J(l,r,t));n.finished?(we(i,n.result,a,s,r),n.result=void 0):c.then(l=>{we(i,l,a,s,r)}).catch(l=>J(l,r,t)).finally(()=>n.result=void 0)}}}function we(e,t,r,n,i){if(ve&&typeof t=="function"){let o=t.apply(r,n);o instanceof Promise?o.then(s=>we(e,s,r,n)).catch(s=>J(s,i,t)):e(o)}else e(t)}var ut="x-";function E(e=""){return ut+e}function Xt(e){ut=e}var er={};function d(e,t){er[e]=t}function ne(e,t,r){if(t=Array.from(t),e._x_virtualDirectives){let o=Object.entries(e._x_virtualDirectives).map(([a,c])=>({name:a,value:c})),s=ft(o);o=o.map(a=>s.find(c=>c.name===a.name)?{name:`x-bind:${a.name}`,value:`"${a.value}"`}:a),t=t.concat(o)}let n={};return t.map(tr((o,s)=>n[o]=s)).filter(rr).map(xn(n,r)).sort(yn).map(o=>gn(e,o))}function ft(e){return Array.from(e).map(tr()).filter(t=>!rr(t))}var dt=!1,ie=new Map,nr=Symbol();function ir(e){dt=!0;let t=Symbol();nr=t,ie.set(t,[]);let r=()=>{for(;ie.get(t).length;)ie.get(t).shift()();ie.delete(t)},n=()=>{dt=!1,r()};e(r),n()}function at(e){let t=[],r=a=>t.push(a),[n,i]=Ft(e);return t.push(i),[{Alpine:I,effect:n,cleanup:r,evaluateLater:g.bind(g,e),evaluate:P.bind(P,e)},()=>t.forEach(a=>a())]}function gn(e,t){let r=()=>{},n=er[t.type]||r,[i,o]=at(e);qt(e,t.original,o);let s=()=>{e._x_ignore||e._x_ignoreSelf||(n.inline&&n.inline(e,t,i),n=n.bind(n,e,t,i),dt?ie.get(nr).push(n):n())};return s.runCleanups=o,s}var Ee=(e,t)=>({name:r,value:n})=>(r.startsWith(e)&&(r=r.replace(e,t)),{name:r,value:n}),Se=e=>e;function tr(e=()=>{}){return({name:t,value:r})=>{let{name:n,value:i}=or.reduce((o,s)=>s(o),{name:t,value:r});return n!==t&&e(n,t),{name:n,value:i}}}var or=[];function Z(e){or.push(e)}function rr({name:e}){return sr().test(e)}var sr=()=>new RegExp(`^${ut}([^:^.]+)\\b`);function xn(e,t){return({name:r,value:n})=>{let i=r.match(sr()),o=r.match(/:([a-zA-Z0-9\-:]+)/),s=r.match(/\.[^.\]]+(?=[^\]]*$)/g)||[],a=t||e[r]||r;return{type:i?i[1]:null,value:o?o[1]:null,modifiers:s.map(c=>c.replace(".","")),expression:n,original:a}}}var pt="DEFAULT",Ae=["ignore","ref","data","id","bind","init","for","mask","model","modelable","transition","show","if",pt,"teleport"];function yn(e,t){let r=Ae.indexOf(e.type)===-1?pt:e.type,n=Ae.indexOf(t.type)===-1?pt:t.type;return Ae.indexOf(r)-Ae.indexOf(n)}function z(e,t,r={}){e.dispatchEvent(new CustomEvent(t,{detail:r,bubbles:!0,composed:!0,cancelable:!0}))}var mt=[],ht=!1;function Te(e=()=>{}){return queueMicrotask(()=>{ht||setTimeout(()=>{Oe()})}),new Promise(t=>{mt.push(()=>{e(),t()})})}function Oe(){for(ht=!1;mt.length;)mt.shift()()}function ar(){ht=!0}function R(e,t){if(typeof ShadowRoot=="function"&&e instanceof ShadowRoot){Array.from(e.children).forEach(i=>R(i,t));return}let r=!1;if(t(e,()=>r=!0),r)return;let n=e.firstElementChild;for(;n;)R(n,t,!1),n=n.nextElementSibling}function O(e,...t){console.warn(`Alpine Warning: ${e}`,...t)}function lr(){document.body||O("Unable to initialize. Trying to load Alpine before `<body>` is available. Did you forget to add `defer` in Alpine's `<script>` tag?"),z(document,"alpine:init"),z(document,"alpine:initializing"),rt(),Vt(t=>w(t,R)),_e(t=>bn(t)),Ht((t,r)=>{ne(t,r).forEach(n=>n())});let e=t=>!V(t.parentElement,!0);Array.from(document.querySelectorAll(cr())).filter(e).forEach(t=>{w(t)}),z(document,"alpine:initialized")}var _t=[],ur=[];function fr(){return _t.map(e=>e())}function cr(){return _t.concat(ur).map(e=>e())}function Ce(e){_t.push(e)}function Re(e){ur.push(e)}function V(e,t=!1){return Q(e,r=>{if((t?cr():fr()).some(i=>r.matches(i)))return!0})}function Q(e,t){if(!!e){if(t(e))return e;if(e._x_teleportBack&&(e=e._x_teleportBack),!!e.parentElement)return Q(e.parentElement,t)}}function dr(e){return fr().some(t=>e.matches(t))}function w(e,t=R){ir(()=>{t(e,(r,n)=>{ne(r,r.attributes).forEach(i=>i()),r._x_ignore&&n()})})}function bn(e){R(e,t=>Qe(t))}function oe(e,t){return Array.isArray(t)?pr(e,t.join(" ")):typeof t=="object"&&t!==null?vn(e,t):typeof t=="function"?oe(e,t()):pr(e,t)}function pr(e,t){let r=o=>o.split(" ").filter(Boolean),n=o=>o.split(" ").filter(s=>!e.classList.contains(s)).filter(Boolean),i=o=>(e.classList.add(...o),()=>{e.classList.remove(...o)});return t=t===!0?t="":t||"",i(n(t))}function vn(e,t){let r=a=>a.split(" ").filter(Boolean),n=Object.entries(t).flatMap(([a,c])=>c?r(a):!1).filter(Boolean),i=Object.entries(t).flatMap(([a,c])=>c?!1:r(a)).filter(Boolean),o=[],s=[];return i.forEach(a=>{e.classList.contains(a)&&(e.classList.remove(a),s.push(a))}),n.forEach(a=>{e.classList.contains(a)||(e.classList.add(a),o.push(a))}),()=>{s.forEach(a=>e.classList.add(a)),o.forEach(a=>e.classList.remove(a))}}function H(e,t){return typeof t=="object"&&t!==null?wn(e,t):En(e,t)}function wn(e,t){let r={};return Object.entries(t).forEach(([n,i])=>{r[n]=e.style[n],n.startsWith("--")||(n=Sn(n)),e.style.setProperty(n,i)}),setTimeout(()=>{e.style.length===0&&e.removeAttribute("style")}),()=>{H(e,r)}}function En(e,t){let r=e.getAttribute("style",t);return e.setAttribute("style",t),()=>{e.setAttribute("style",r||"")}}function Sn(e){return e.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase()}function se(e,t=()=>{}){let r=!1;return function(){r?t.apply(this,arguments):(r=!0,e.apply(this,arguments))}}d("transition",(e,{value:t,modifiers:r,expression:n},{evaluate:i})=>{typeof n=="function"&&(n=i(n)),n?An(e,n,t):On(e,r,t)});function An(e,t,r){mr(e,oe,""),{enter:i=>{e._x_transition.enter.during=i},"enter-start":i=>{e._x_transition.enter.start=i},"enter-end":i=>{e._x_transition.enter.end=i},leave:i=>{e._x_transition.leave.during=i},"leave-start":i=>{e._x_transition.leave.start=i},"leave-end":i=>{e._x_transition.leave.end=i}}[r](t)}function On(e,t,r){mr(e,H);let n=!t.includes("in")&&!t.includes("out")&&!r,i=n||t.includes("in")||["enter"].includes(r),o=n||t.includes("out")||["leave"].includes(r);t.includes("in")&&!n&&(t=t.filter((h,b)=>b<t.indexOf("out"))),t.includes("out")&&!n&&(t=t.filter((h,b)=>b>t.indexOf("out")));let s=!t.includes("opacity")&&!t.includes("scale"),a=s||t.includes("opacity"),c=s||t.includes("scale"),l=a?0:1,u=c?ae(t,"scale",95)/100:1,p=ae(t,"delay",0),y=ae(t,"origin","center"),N="opacity, transform",W=ae(t,"duration",150)/1e3,pe=ae(t,"duration",75)/1e3,f="cubic-bezier(0.4, 0.0, 0.2, 1)";i&&(e._x_transition.enter.during={transformOrigin:y,transitionDelay:p,transitionProperty:N,transitionDuration:`${W}s`,transitionTimingFunction:f},e._x_transition.enter.start={opacity:l,transform:`scale(${u})`},e._x_transition.enter.end={opacity:1,transform:"scale(1)"}),o&&(e._x_transition.leave.during={transformOrigin:y,transitionDelay:p,transitionProperty:N,transitionDuration:`${pe}s`,transitionTimingFunction:f},e._x_transition.leave.start={opacity:1,transform:"scale(1)"},e._x_transition.leave.end={opacity:l,transform:`scale(${u})`})}function mr(e,t,r={}){e._x_transition||(e._x_transition={enter:{during:r,start:r,end:r},leave:{during:r,start:r,end:r},in(n=()=>{},i=()=>{}){Me(e,t,{during:this.enter.during,start:this.enter.start,end:this.enter.end},n,i)},out(n=()=>{},i=()=>{}){Me(e,t,{during:this.leave.during,start:this.leave.start,end:this.leave.end},n,i)}})}window.Element.prototype._x_toggleAndCascadeWithTransitions=function(e,t,r,n){let i=document.visibilityState==="visible"?requestAnimationFrame:setTimeout,o=()=>i(r);if(t){e._x_transition&&(e._x_transition.enter||e._x_transition.leave)?e._x_transition.enter&&(Object.entries(e._x_transition.enter.during).length||Object.entries(e._x_transition.enter.start).length||Object.entries(e._x_transition.enter.end).length)?e._x_transition.in(r):o():e._x_transition?e._x_transition.in(r):o();return}e._x_hidePromise=e._x_transition?new Promise((s,a)=>{e._x_transition.out(()=>{},()=>s(n)),e._x_transitioning.beforeCancel(()=>a({isFromCancelledTransition:!0}))}):Promise.resolve(n),queueMicrotask(()=>{let s=hr(e);s?(s._x_hideChildren||(s._x_hideChildren=[]),s._x_hideChildren.push(e)):i(()=>{let a=c=>{let l=Promise.all([c._x_hidePromise,...(c._x_hideChildren||[]).map(a)]).then(([u])=>u());return delete c._x_hidePromise,delete c._x_hideChildren,l};a(e).catch(c=>{if(!c.isFromCancelledTransition)throw c})})})};function hr(e){let t=e.parentNode;if(!!t)return t._x_hidePromise?t:hr(t)}function Me(e,t,{during:r,start:n,end:i}={},o=()=>{},s=()=>{}){if(e._x_transitioning&&e._x_transitioning.cancel(),Object.keys(r).length===0&&Object.keys(n).length===0&&Object.keys(i).length===0){o(),s();return}let a,c,l;Tn(e,{start(){a=t(e,n)},during(){c=t(e,r)},before:o,end(){a(),l=t(e,i)},after:s,cleanup(){c(),l()}})}function Tn(e,t){let r,n,i,o=se(()=>{m(()=>{r=!0,n||t.before(),i||(t.end(),Oe()),t.after(),e.isConnected&&t.cleanup(),delete e._x_transitioning})});e._x_transitioning={beforeCancels:[],beforeCancel(s){this.beforeCancels.push(s)},cancel:se(function(){for(;this.beforeCancels.length;)this.beforeCancels.shift()();o()}),finish:o},m(()=>{t.start(),t.during()}),ar(),requestAnimationFrame(()=>{if(r)return;let s=Number(getComputedStyle(e).transitionDuration.replace(/,.*/,"").replace("s",""))*1e3,a=Number(getComputedStyle(e).transitionDelay.replace(/,.*/,"").replace("s",""))*1e3;s===0&&(s=Number(getComputedStyle(e).animationDuration.replace("s",""))*1e3),m(()=>{t.before()}),n=!0,requestAnimationFrame(()=>{r||(m(()=>{t.end()}),Oe(),setTimeout(e._x_transitioning.finish,s+a),i=!0)})})}function ae(e,t,r){if(e.indexOf(t)===-1)return r;let n=e[e.indexOf(t)+1];if(!n||t==="scale"&&isNaN(n))return r;if(t==="duration"){let i=n.match(/([0-9]+)ms/);if(i)return i[1]}return t==="origin"&&["top","right","left","center","bottom"].includes(e[e.indexOf(t)+2])?[n,e[e.indexOf(t)+2]].join(" "):n}var gt=!1;function $(e,t=()=>{}){return(...r)=>gt?t(...r):e(...r)}function _r(e,t){t._x_dataStack||(t._x_dataStack=e._x_dataStack),gt=!0,Rn(()=>{Cn(t)}),gt=!1}function Cn(e){let t=!1;w(e,(n,i)=>{R(n,(o,s)=>{if(t&&dr(o))return s();t=!0,i(o,s)})})}function Rn(e){let t=K;Ze((r,n)=>{let i=t(r);return Y(i),()=>{}}),e(),Ze(t)}function ce(e,t,r,n=[]){switch(e._x_bindings||(e._x_bindings=A({})),e._x_bindings[t]=r,t=n.includes("camel")?Dn(t):t,t){case"value":Mn(e,r);break;case"style":Pn(e,r);break;case"class":Nn(e,r);break;default:kn(e,t,r);break}}function Mn(e,t){if(e.type==="radio")e.attributes.value===void 0&&(e.value=t),window.fromModel&&(e.checked=gr(e.value,t));else if(e.type==="checkbox")Number.isInteger(t)?e.value=t:!Number.isInteger(t)&&!Array.isArray(t)&&typeof t!="boolean"&&![null,void 0].includes(t)?e.value=String(t):Array.isArray(t)?e.checked=t.some(r=>gr(r,e.value)):e.checked=!!t;else if(e.tagName==="SELECT")In(e,t);else{if(e.value===t)return;e.value=t}}function Nn(e,t){e._x_undoAddedClasses&&e._x_undoAddedClasses(),e._x_undoAddedClasses=oe(e,t)}function Pn(e,t){e._x_undoAddedStyles&&e._x_undoAddedStyles(),e._x_undoAddedStyles=H(e,t)}function kn(e,t,r){[null,void 0,!1].includes(r)&&Ln(t)?e.removeAttribute(t):(xr(t)&&(r=t),$n(e,t,r))}function $n(e,t,r){e.getAttribute(t)!=r&&e.setAttribute(t,r)}function In(e,t){let r=[].concat(t).map(n=>n+"");Array.from(e.options).forEach(n=>{n.selected=r.includes(n.value)})}function Dn(e){return e.toLowerCase().replace(/-(\w)/g,(t,r)=>r.toUpperCase())}function gr(e,t){return e==t}function xr(e){return["disabled","checked","required","readonly","hidden","open","selected","autofocus","itemscope","multiple","novalidate","allowfullscreen","allowpaymentrequest","formnovalidate","autoplay","controls","loop","muted","playsinline","default","ismap","reversed","async","defer","nomodule"].includes(e)}function Ln(e){return!["aria-pressed","aria-checked","aria-expanded","aria-selected"].includes(e)}function yr(e,t,r){if(e._x_bindings&&e._x_bindings[t]!==void 0)return e._x_bindings[t];let n=e.getAttribute(t);return n===null?typeof r=="function"?r():r:xr(t)?!![t,"true"].includes(n):n===""?!0:n}function Ne(e,t){var r;return function(){var n=this,i=arguments,o=function(){r=null,e.apply(n,i)};clearTimeout(r),r=setTimeout(o,t)}}function Pe(e,t){let r;return function(){let n=this,i=arguments;r||(e.apply(n,i),r=!0,setTimeout(()=>r=!1,t))}}function br(e){e(I)}var q={},vr=!1;function wr(e,t){if(vr||(q=A(q),vr=!0),t===void 0)return q[e];q[e]=t,typeof t=="object"&&t!==null&&t.hasOwnProperty("init")&&typeof t.init=="function"&&q[e].init(),ye(q[e])}function Er(){return q}var Sr={};function Ar(e,t){let r=typeof t!="function"?()=>t:t;e instanceof Element?xt(e,r()):Sr[e]=r}function Or(e){return Object.entries(Sr).forEach(([t,r])=>{Object.defineProperty(e,t,{get(){return(...n)=>r(...n)}})}),e}function xt(e,t,r){let n=[];for(;n.length;)n.pop()();let i=Object.entries(t).map(([s,a])=>({name:s,value:a})),o=ft(i);i=i.map(s=>o.find(a=>a.name===s.name)?{name:`x-bind:${s.name}`,value:`"${s.value}"`}:s),ne(e,i,r).map(s=>{n.push(s.runCleanups),s()})}var Tr={};function Cr(e,t){Tr[e]=t}function Rr(e,t){return Object.entries(Tr).forEach(([r,n])=>{Object.defineProperty(e,r,{get(){return(...i)=>n.bind(t)(...i)},enumerable:!1})}),e}var jn={get reactive(){return A},get release(){return Y},get effect(){return K},get raw(){return Ye},version:"3.10.3",flushAndStopDeferringMutations:Wt,dontAutoEvaluateFunctions:Jt,disableEffectScheduling:Lt,setReactivityEngine:jt,closestDataStack:k,skipDuringClone:$,addRootSelector:Ce,addInitSelector:Re,addScopeToNode:C,deferMutations:Ut,mapAttributes:Z,evaluateLater:g,setEvaluator:Qt,mergeProxies:D,findClosest:Q,closestRoot:V,interceptor:be,transition:Me,setStyles:H,mutateDom:m,directive:d,throttle:Pe,debounce:Ne,evaluate:P,initTree:w,nextTick:Te,prefixed:E,prefix:Xt,plugin:br,magic:x,store:wr,start:lr,clone:_r,bound:yr,$data:xe,data:Cr,bind:Ar},I=jn;function yt(e,t){let r=Object.create(null),n=e.split(",");for(let i=0;i<n.length;i++)r[n[i]]=!0;return t?i=>!!r[i.toLowerCase()]:i=>!!r[i]}var ns={[1]:"TEXT",[2]:"CLASS",[4]:"STYLE",[8]:"PROPS",[16]:"FULL_PROPS",[32]:"HYDRATE_EVENTS",[64]:"STABLE_FRAGMENT",[128]:"KEYED_FRAGMENT",[256]:"UNKEYED_FRAGMENT",[512]:"NEED_PATCH",[1024]:"DYNAMIC_SLOTS",[2048]:"DEV_ROOT_FRAGMENT",[-1]:"HOISTED",[-2]:"BAIL"},is={[1]:"STABLE",[2]:"DYNAMIC",[3]:"FORWARDED"};var Fn="itemscope,allowfullscreen,formnovalidate,ismap,nomodule,novalidate,readonly";var os=yt(Fn+",async,autofocus,autoplay,controls,default,defer,disabled,hidden,loop,open,required,reversed,scoped,seamless,checked,muted,multiple,selected");var Mr=Object.freeze({}),ss=Object.freeze([]);var bt=Object.assign;var Bn=Object.prototype.hasOwnProperty,le=(e,t)=>Bn.call(e,t),L=Array.isArray,X=e=>Nr(e)==="[object Map]";var Kn=e=>typeof e=="string",ke=e=>typeof e=="symbol",ue=e=>e!==null&&typeof e=="object";var zn=Object.prototype.toString,Nr=e=>zn.call(e),vt=e=>Nr(e).slice(8,-1);var De=e=>Kn(e)&&e!=="NaN"&&e[0]!=="-"&&""+parseInt(e,10)===e;var Ie=e=>{let t=Object.create(null);return r=>t[r]||(t[r]=e(r))},Vn=/-(\w)/g,as=Ie(e=>e.replace(Vn,(t,r)=>r?r.toUpperCase():"")),Hn=/\B([A-Z])/g,cs=Ie(e=>e.replace(Hn,"-$1").toLowerCase()),wt=Ie(e=>e.charAt(0).toUpperCase()+e.slice(1)),ls=Ie(e=>e?`on${wt(e)}`:""),Et=(e,t)=>e!==t&&(e===e||t===t);var St=new WeakMap,fe=[],M,U=Symbol("iterate"),At=Symbol("Map key iterate");function qn(e){return e&&e._isEffect===!0}function Pr(e,t=Mr){qn(e)&&(e=e.raw);let r=Un(e,t);return t.lazy||r(),r}function Dr(e){e.active&&(kr(e),e.options.onStop&&e.options.onStop(),e.active=!1)}var Wn=0;function Un(e,t){let r=function(){if(!r.active)return e();if(!fe.includes(r)){kr(r);try{return Gn(),fe.push(r),M=r,e()}finally{fe.pop(),Ir(),M=fe[fe.length-1]}}};return r.id=Wn++,r.allowRecurse=!!t.allowRecurse,r._isEffect=!0,r.active=!0,r.raw=e,r.deps=[],r.options=t,r}function kr(e){let{deps:t}=e;if(t.length){for(let r=0;r<t.length;r++)t[r].delete(e);t.length=0}}var ee=!0,Ot=[];function Yn(){Ot.push(ee),ee=!1}function Gn(){Ot.push(ee),ee=!0}function Ir(){let e=Ot.pop();ee=e===void 0?!0:e}function T(e,t,r){if(!ee||M===void 0)return;let n=St.get(e);n||St.set(e,n=new Map);let i=n.get(r);i||n.set(r,i=new Set),i.has(M)||(i.add(M),M.deps.push(i),M.options.onTrack&&M.options.onTrack({effect:M,target:e,type:t,key:r}))}function j(e,t,r,n,i,o){let s=St.get(e);if(!s)return;let a=new Set,c=u=>{u&&u.forEach(p=>{(p!==M||p.allowRecurse)&&a.add(p)})};if(t==="clear")s.forEach(c);else if(r==="length"&&L(e))s.forEach((u,p)=>{(p==="length"||p>=n)&&c(u)});else switch(r!==void 0&&c(s.get(r)),t){case"add":L(e)?De(r)&&c(s.get("length")):(c(s.get(U)),X(e)&&c(s.get(At)));break;case"delete":L(e)||(c(s.get(U)),X(e)&&c(s.get(At)));break;case"set":X(e)&&c(s.get(U));break}let l=u=>{u.options.onTrigger&&u.options.onTrigger({effect:u,target:e,key:r,type:t,newValue:n,oldValue:i,oldTarget:o}),u.options.scheduler?u.options.scheduler(u):u()};a.forEach(l)}var Jn=yt("__proto__,__v_isRef,__isVue"),$r=new Set(Object.getOwnPropertyNames(Symbol).map(e=>Symbol[e]).filter(ke)),Zn=$e(),Qn=$e(!1,!0),Xn=$e(!0),ei=$e(!0,!0),Le={};["includes","indexOf","lastIndexOf"].forEach(e=>{let t=Array.prototype[e];Le[e]=function(...r){let n=_(this);for(let o=0,s=this.length;o<s;o++)T(n,"get",o+"");let i=t.apply(n,r);return i===-1||i===!1?t.apply(n,r.map(_)):i}});["push","pop","shift","unshift","splice"].forEach(e=>{let t=Array.prototype[e];Le[e]=function(...r){Yn();let n=t.apply(this,r);return Ir(),n}});function $e(e=!1,t=!1){return function(n,i,o){if(i==="__v_isReactive")return!e;if(i==="__v_isReadonly")return e;if(i==="__v_raw"&&o===(e?t?ri:jr:t?ti:Lr).get(n))return n;let s=L(n);if(!e&&s&&le(Le,i))return Reflect.get(Le,i,o);let a=Reflect.get(n,i,o);return(ke(i)?$r.has(i):Jn(i))||(e||T(n,"get",i),t)?a:Tt(a)?!s||!De(i)?a.value:a:ue(a)?e?Fr(a):je(a):a}}var ni=Br(),ii=Br(!0);function Br(e=!1){return function(r,n,i,o){let s=r[n];if(!e&&(i=_(i),s=_(s),!L(r)&&Tt(s)&&!Tt(i)))return s.value=i,!0;let a=L(r)&&De(n)?Number(n)<r.length:le(r,n),c=Reflect.set(r,n,i,o);return r===_(o)&&(a?Et(i,s)&&j(r,"set",n,i,s):j(r,"add",n,i)),c}}function oi(e,t){let r=le(e,t),n=e[t],i=Reflect.deleteProperty(e,t);return i&&r&&j(e,"delete",t,void 0,n),i}function si(e,t){let r=Reflect.has(e,t);return(!ke(t)||!$r.has(t))&&T(e,"has",t),r}function ai(e){return T(e,"iterate",L(e)?"length":U),Reflect.ownKeys(e)}var Kr={get:Zn,set:ni,deleteProperty:oi,has:si,ownKeys:ai},zr={get:Xn,set(e,t){return console.warn(`Set operation on key "${String(t)}" failed: target is readonly.`,e),!0},deleteProperty(e,t){return console.warn(`Delete operation on key "${String(t)}" failed: target is readonly.`,e),!0}},hs=bt({},Kr,{get:Qn,set:ii}),_s=bt({},zr,{get:ei}),Ct=e=>ue(e)?je(e):e,Rt=e=>ue(e)?Fr(e):e,Mt=e=>e,Fe=e=>Reflect.getPrototypeOf(e);function Be(e,t,r=!1,n=!1){e=e.__v_raw;let i=_(e),o=_(t);t!==o&&!r&&T(i,"get",t),!r&&T(i,"get",o);let{has:s}=Fe(i),a=n?Mt:r?Rt:Ct;if(s.call(i,t))return a(e.get(t));if(s.call(i,o))return a(e.get(o));e!==i&&e.get(t)}function Ke(e,t=!1){let r=this.__v_raw,n=_(r),i=_(e);return e!==i&&!t&&T(n,"has",e),!t&&T(n,"has",i),e===i?r.has(e):r.has(e)||r.has(i)}function ze(e,t=!1){return e=e.__v_raw,!t&&T(_(e),"iterate",U),Reflect.get(e,"size",e)}function Vr(e){e=_(e);let t=_(this);return Fe(t).has.call(t,e)||(t.add(e),j(t,"add",e,e)),this}function qr(e,t){t=_(t);let r=_(this),{has:n,get:i}=Fe(r),o=n.call(r,e);o?Hr(r,n,e):(e=_(e),o=n.call(r,e));let s=i.call(r,e);return r.set(e,t),o?Et(t,s)&&j(r,"set",e,t,s):j(r,"add",e,t),this}function Ur(e){let t=_(this),{has:r,get:n}=Fe(t),i=r.call(t,e);i?Hr(t,r,e):(e=_(e),i=r.call(t,e));let o=n?n.call(t,e):void 0,s=t.delete(e);return i&&j(t,"delete",e,void 0,o),s}function Wr(){let e=_(this),t=e.size!==0,r=X(e)?new Map(e):new Set(e),n=e.clear();return t&&j(e,"clear",void 0,void 0,r),n}function Ve(e,t){return function(n,i){let o=this,s=o.__v_raw,a=_(s),c=t?Mt:e?Rt:Ct;return!e&&T(a,"iterate",U),s.forEach((l,u)=>n.call(i,c(l),c(u),o))}}function He(e,t,r){return function(...n){let i=this.__v_raw,o=_(i),s=X(o),a=e==="entries"||e===Symbol.iterator&&s,c=e==="keys"&&s,l=i[e](...n),u=r?Mt:t?Rt:Ct;return!t&&T(o,"iterate",c?At:U),{next(){let{value:p,done:y}=l.next();return y?{value:p,done:y}:{value:a?[u(p[0]),u(p[1])]:u(p),done:y}},[Symbol.iterator](){return this}}}}function F(e){return function(...t){{let r=t[0]?`on key "${t[0]}" `:"";console.warn(`${wt(e)} operation ${r}failed: target is readonly.`,_(this))}return e==="delete"?!1:this}}var Gr={get(e){return Be(this,e)},get size(){return ze(this)},has:Ke,add:Vr,set:qr,delete:Ur,clear:Wr,forEach:Ve(!1,!1)},Yr={get(e){return Be(this,e,!1,!0)},get size(){return ze(this)},has:Ke,add:Vr,set:qr,delete:Ur,clear:Wr,forEach:Ve(!1,!0)},Jr={get(e){return Be(this,e,!0)},get size(){return ze(this,!0)},has(e){return Ke.call(this,e,!0)},add:F("add"),set:F("set"),delete:F("delete"),clear:F("clear"),forEach:Ve(!0,!1)},Zr={get(e){return Be(this,e,!0,!0)},get size(){return ze(this,!0)},has(e){return Ke.call(this,e,!0)},add:F("add"),set:F("set"),delete:F("delete"),clear:F("clear"),forEach:Ve(!0,!0)},ci=["keys","values","entries",Symbol.iterator];ci.forEach(e=>{Gr[e]=He(e,!1,!1),Jr[e]=He(e,!0,!1),Yr[e]=He(e,!1,!0),Zr[e]=He(e,!0,!0)});function qe(e,t){let r=t?e?Zr:Yr:e?Jr:Gr;return(n,i,o)=>i==="__v_isReactive"?!e:i==="__v_isReadonly"?e:i==="__v_raw"?n:Reflect.get(le(r,i)&&i in n?r:n,i,o)}var li={get:qe(!1,!1)},gs={get:qe(!1,!0)},ui={get:qe(!0,!1)},xs={get:qe(!0,!0)};function Hr(e,t,r){let n=_(r);if(n!==r&&t.call(e,n)){let i=vt(e);console.warn(`Reactive ${i} contains both the raw and reactive versions of the same object${i==="Map"?" as keys":""}, which can lead to inconsistencies. Avoid differentiating between the raw and reactive versions of an object and only use the reactive version if possible.`)}}var Lr=new WeakMap,ti=new WeakMap,jr=new WeakMap,ri=new WeakMap;function fi(e){switch(e){case"Object":case"Array":return 1;case"Map":case"Set":case"WeakMap":case"WeakSet":return 2;default:return 0}}function di(e){return e.__v_skip||!Object.isExtensible(e)?0:fi(vt(e))}function je(e){return e&&e.__v_isReadonly?e:Qr(e,!1,Kr,li,Lr)}function Fr(e){return Qr(e,!0,zr,ui,jr)}function Qr(e,t,r,n,i){if(!ue(e))return console.warn(`value cannot be made reactive: ${String(e)}`),e;if(e.__v_raw&&!(t&&e.__v_isReactive))return e;let o=i.get(e);if(o)return o;let s=di(e);if(s===0)return e;let a=new Proxy(e,s===2?n:r);return i.set(e,a),a}function _(e){return e&&_(e.__v_raw)||e}function Tt(e){return Boolean(e&&e.__v_isRef===!0)}x("nextTick",()=>Te);x("dispatch",e=>z.bind(z,e));x("watch",(e,{evaluateLater:t,effect:r})=>(n,i)=>{let o=t(n),s=!0,a,c=r(()=>o(l=>{JSON.stringify(l),s?a=l:queueMicrotask(()=>{i(l,a),a=l}),s=!1}));e._x_effects.delete(c)});x("store",Er);x("data",e=>xe(e));x("root",e=>V(e));x("refs",e=>(e._x_refs_proxy||(e._x_refs_proxy=D(pi(e))),e._x_refs_proxy));function pi(e){let t=[],r=e;for(;r;)r._x_refs&&t.push(r._x_refs),r=r.parentNode;return t}var Nt={};function Pt(e){return Nt[e]||(Nt[e]=0),++Nt[e]}function Xr(e,t){return Q(e,r=>{if(r._x_ids&&r._x_ids[t])return!0})}function en(e,t){e._x_ids||(e._x_ids={}),e._x_ids[t]||(e._x_ids[t]=Pt(t))}x("id",e=>(t,r=null)=>{let n=Xr(e,t),i=n?n._x_ids[t]:Pt(t);return r?`${t}-${i}-${r}`:`${t}-${i}`});x("el",e=>e);tn("Focus","focus","focus");tn("Persist","persist","persist");function tn(e,t,r){x(t,n=>O(`You can't use [$${directiveName}] without first installing the "${e}" plugin here: https://alpinejs.dev/plugins/${r}`,n))}d("modelable",(e,{expression:t},{effect:r,evaluateLater:n})=>{let i=n(t),o=()=>{let l;return i(u=>l=u),l},s=n(`${t} = __placeholder`),a=l=>s(()=>{},{scope:{__placeholder:l}}),c=o();a(c),queueMicrotask(()=>{if(!e._x_model)return;e._x_removeModelListeners.default();let l=e._x_model.get,u=e._x_model.set;r(()=>a(l())),r(()=>u(o()))})});d("teleport",(e,{expression:t},{cleanup:r})=>{e.tagName.toLowerCase()!=="template"&&O("x-teleport can only be used on a <template> tag",e);let n=document.querySelector(t);n||O(`Cannot find x-teleport element for selector: "${t}"`);let i=e.content.cloneNode(!0).firstElementChild;e._x_teleport=i,i._x_teleportBack=e,e._x_forwardEvents&&e._x_forwardEvents.forEach(o=>{i.addEventListener(o,s=>{s.stopPropagation(),e.dispatchEvent(new s.constructor(s.type,s))})}),C(i,{},e),m(()=>{n.appendChild(i),w(i),i._x_ignore=!0}),r(()=>i.remove())});var rn=()=>{};rn.inline=(e,{modifiers:t},{cleanup:r})=>{t.includes("self")?e._x_ignoreSelf=!0:e._x_ignore=!0,r(()=>{t.includes("self")?delete e._x_ignoreSelf:delete e._x_ignore})};d("ignore",rn);d("effect",(e,{expression:t},{effect:r})=>r(g(e,t)));function de(e,t,r,n){let i=e,o=c=>n(c),s={},a=(c,l)=>u=>l(c,u);if(r.includes("dot")&&(t=mi(t)),r.includes("camel")&&(t=hi(t)),r.includes("passive")&&(s.passive=!0),r.includes("capture")&&(s.capture=!0),r.includes("window")&&(i=window),r.includes("document")&&(i=document),r.includes("prevent")&&(o=a(o,(c,l)=>{l.preventDefault(),c(l)})),r.includes("stop")&&(o=a(o,(c,l)=>{l.stopPropagation(),c(l)})),r.includes("self")&&(o=a(o,(c,l)=>{l.target===e&&c(l)})),(r.includes("away")||r.includes("outside"))&&(i=document,o=a(o,(c,l)=>{e.contains(l.target)||l.target.isConnected!==!1&&(e.offsetWidth<1&&e.offsetHeight<1||e._x_isShown!==!1&&c(l))})),r.includes("once")&&(o=a(o,(c,l)=>{c(l),i.removeEventListener(t,o,s)})),o=a(o,(c,l)=>{_i(t)&&gi(l,r)||c(l)}),r.includes("debounce")){let c=r[r.indexOf("debounce")+1]||"invalid-wait",l=kt(c.split("ms")[0])?Number(c.split("ms")[0]):250;o=Ne(o,l)}if(r.includes("throttle")){let c=r[r.indexOf("throttle")+1]||"invalid-wait",l=kt(c.split("ms")[0])?Number(c.split("ms")[0]):250;o=Pe(o,l)}return i.addEventListener(t,o,s),()=>{i.removeEventListener(t,o,s)}}function mi(e){return e.replace(/-/g,".")}function hi(e){return e.toLowerCase().replace(/-(\w)/g,(t,r)=>r.toUpperCase())}function kt(e){return!Array.isArray(e)&&!isNaN(e)}function xi(e){return e.replace(/([a-z])([A-Z])/g,"$1-$2").replace(/[_\s]/,"-").toLowerCase()}function _i(e){return["keydown","keyup"].includes(e)}function gi(e,t){let r=t.filter(o=>!["window","document","prevent","stop","once"].includes(o));if(r.includes("debounce")){let o=r.indexOf("debounce");r.splice(o,kt((r[o+1]||"invalid-wait").split("ms")[0])?2:1)}if(r.length===0||r.length===1&&nn(e.key).includes(r[0]))return!1;let i=["ctrl","shift","alt","meta","cmd","super"].filter(o=>r.includes(o));return r=r.filter(o=>!i.includes(o)),!(i.length>0&&i.filter(s=>((s==="cmd"||s==="super")&&(s="meta"),e[`${s}Key`])).length===i.length&&nn(e.key).includes(r[0]))}function nn(e){if(!e)return[];e=xi(e);let t={ctrl:"control",slash:"/",space:"-",spacebar:"-",cmd:"meta",esc:"escape",up:"arrow-up",down:"arrow-down",left:"arrow-left",right:"arrow-right",period:".",equal:"="};return t[e]=e,Object.keys(t).map(r=>{if(t[r]===e)return r}).filter(r=>r)}d("model",(e,{modifiers:t,expression:r},{effect:n,cleanup:i})=>{let o=g(e,r),s=`${r} = rightSideOfExpression($event, ${r})`,a=g(e,s);var c=e.tagName.toLowerCase()==="select"||["checkbox","radio"].includes(e.type)||t.includes("lazy")?"change":"input";let l=yi(e,t,r),u=de(e,c,t,y=>{a(()=>{},{scope:{$event:y,rightSideOfExpression:l}})});e._x_removeModelListeners||(e._x_removeModelListeners={}),e._x_removeModelListeners.default=u,i(()=>e._x_removeModelListeners.default());let p=g(e,`${r} = __placeholder`);e._x_model={get(){let y;return o(N=>y=N),y},set(y){p(()=>{},{scope:{__placeholder:y}})}},e._x_forceModelUpdate=()=>{o(y=>{y===void 0&&r.match(/\./)&&(y=""),window.fromModel=!0,m(()=>ce(e,"value",y)),delete window.fromModel})},n(()=>{t.includes("unintrusive")&&document.activeElement.isSameNode(e)||e._x_forceModelUpdate()})});function yi(e,t,r){return e.type==="radio"&&m(()=>{e.hasAttribute("name")||e.setAttribute("name",r)}),(n,i)=>m(()=>{if(n instanceof CustomEvent&&n.detail!==void 0)return n.detail||n.target.value;if(e.type==="checkbox")if(Array.isArray(i)){let o=t.includes("number")?Dt(n.target.value):n.target.value;return n.target.checked?i.concat([o]):i.filter(s=>!bi(s,o))}else return n.target.checked;else{if(e.tagName.toLowerCase()==="select"&&e.multiple)return t.includes("number")?Array.from(n.target.selectedOptions).map(o=>{let s=o.value||o.text;return Dt(s)}):Array.from(n.target.selectedOptions).map(o=>o.value||o.text);{let o=n.target.value;return t.includes("number")?Dt(o):t.includes("trim")?o.trim():o}}})}function Dt(e){let t=e?parseFloat(e):null;return vi(t)?t:e}function bi(e,t){return e==t}function vi(e){return!Array.isArray(e)&&!isNaN(e)}d("cloak",e=>queueMicrotask(()=>m(()=>e.removeAttribute(E("cloak")))));Re(()=>`[${E("init")}]`);d("init",$((e,{expression:t},{evaluate:r})=>typeof t=="string"?!!t.trim()&&r(t,{},!1):r(t,{},!1)));d("text",(e,{expression:t},{effect:r,evaluateLater:n})=>{let i=n(t);r(()=>{i(o=>{m(()=>{e.textContent=o})})})});d("html",(e,{expression:t},{effect:r,evaluateLater:n})=>{let i=n(t);r(()=>{i(o=>{m(()=>{e.innerHTML=o,e._x_ignoreSelf=!0,w(e),delete e._x_ignoreSelf})})})});Z(Ee(":",Se(E("bind:"))));d("bind",(e,{value:t,modifiers:r,expression:n,original:i},{effect:o})=>{if(!t){let a={};Or(a),g(e,n)(l=>{xt(e,l,i)},{scope:a});return}if(t==="key")return wi(e,n);let s=g(e,n);o(()=>s(a=>{a===void 0&&n.match(/\./)&&(a=""),m(()=>ce(e,t,a,r))}))});function wi(e,t){e._x_keyExpression=t}Ce(()=>`[${E("data")}]`);d("data",$((e,{expression:t},{cleanup:r})=>{t=t===""?"{}":t;let n={};re(n,e);let i={};Rr(i,n);let o=P(e,t,{scope:i});o===void 0&&(o={}),re(o,e);let s=A(o);ye(s);let a=C(e,s);s.init&&P(e,s.init),r(()=>{s.destroy&&P(e,s.destroy),a()})}));d("show",(e,{modifiers:t,expression:r},{effect:n})=>{let i=g(e,r);e._x_doHide||(e._x_doHide=()=>{m(()=>{e.style.setProperty("display","none",t.includes("important")?"important":void 0)})}),e._x_doShow||(e._x_doShow=()=>{m(()=>{e.style.length===1&&e.style.display==="none"?e.removeAttribute("style"):e.style.removeProperty("display")})});let o=()=>{e._x_doHide(),e._x_isShown=!1},s=()=>{e._x_doShow(),e._x_isShown=!0},a=()=>setTimeout(s),c=se(p=>p?s():o(),p=>{typeof e._x_toggleAndCascadeWithTransitions=="function"?e._x_toggleAndCascadeWithTransitions(e,p,s,o):p?a():o()}),l,u=!0;n(()=>i(p=>{!u&&p===l||(t.includes("immediate")&&(p?a():o()),c(p),l=p,u=!1)}))});d("for",(e,{expression:t},{effect:r,cleanup:n})=>{let i=Si(t),o=g(e,i.items),s=g(e,e._x_keyExpression||"index");e._x_prevKeys=[],e._x_lookup={},r(()=>Ei(e,i,o,s)),n(()=>{Object.values(e._x_lookup).forEach(a=>a.remove()),delete e._x_prevKeys,delete e._x_lookup})});function Ei(e,t,r,n){let i=s=>typeof s=="object"&&!Array.isArray(s),o=e;r(s=>{Ai(s)&&s>=0&&(s=Array.from(Array(s).keys(),f=>f+1)),s===void 0&&(s=[]);let a=e._x_lookup,c=e._x_prevKeys,l=[],u=[];if(i(s))s=Object.entries(s).map(([f,h])=>{let b=on(t,h,f,s);n(v=>u.push(v),{scope:{index:f,...b}}),l.push(b)});else for(let f=0;f<s.length;f++){let h=on(t,s[f],f,s);n(b=>u.push(b),{scope:{index:f,...h}}),l.push(h)}let p=[],y=[],N=[],W=[];for(let f=0;f<c.length;f++){let h=c[f];u.indexOf(h)===-1&&N.push(h)}c=c.filter(f=>!N.includes(f));let pe="template";for(let f=0;f<u.length;f++){let h=u[f],b=c.indexOf(h);if(b===-1)c.splice(f,0,h),p.push([pe,f]);else if(b!==f){let v=c.splice(f,1)[0],S=c.splice(b-1,1)[0];c.splice(f,0,S),c.splice(b,0,v),y.push([v,S])}else W.push(h);pe=h}for(let f=0;f<N.length;f++){let h=N[f];a[h]._x_effects&&a[h]._x_effects.forEach(he),a[h].remove(),a[h]=null,delete a[h]}for(let f=0;f<y.length;f++){let[h,b]=y[f],v=a[h],S=a[b],G=document.createElement("div");m(()=>{S.after(G),v.after(S),S._x_currentIfEl&&S.after(S._x_currentIfEl),G.before(v),v._x_currentIfEl&&v.after(v._x_currentIfEl),G.remove()}),ot(S,l[u.indexOf(b)])}for(let f=0;f<p.length;f++){let[h,b]=p[f],v=h==="template"?o:a[h];v._x_currentIfEl&&(v=v._x_currentIfEl);let S=l[b],G=u[b],me=document.importNode(o.content,!0).firstElementChild;C(me,A(S),o),m(()=>{v.after(me),w(me)}),typeof G=="object"&&O("x-for key cannot be an object, it must be a string or an integer",o),a[G]=me}for(let f=0;f<W.length;f++)ot(a[W[f]],l[u.indexOf(W[f])]);o._x_prevKeys=u})}function Si(e){let t=/,([^,\}\]]*)(?:,([^,\}\]]*))?$/,r=/^\s*\(|\)\s*$/g,n=/([\s\S]*?)\s+(?:in|of)\s+([\s\S]*)/,i=e.match(n);if(!i)return;let o={};o.items=i[2].trim();let s=i[1].replace(r,"").trim(),a=s.match(t);return a?(o.item=s.replace(t,"").trim(),o.index=a[1].trim(),a[2]&&(o.collection=a[2].trim())):o.item=s,o}function on(e,t,r,n){let i={};return/^\[.*\]$/.test(e.item)&&Array.isArray(t)?e.item.replace("[","").replace("]","").split(",").map(s=>s.trim()).forEach((s,a)=>{i[s]=t[a]}):/^\{.*\}$/.test(e.item)&&!Array.isArray(t)&&typeof t=="object"?e.item.replace("{","").replace("}","").split(",").map(s=>s.trim()).forEach(s=>{i[s]=t[s]}):i[e.item]=t,e.index&&(i[e.index]=r),e.collection&&(i[e.collection]=n),i}function Ai(e){return!Array.isArray(e)&&!isNaN(e)}function sn(){}sn.inline=(e,{expression:t},{cleanup:r})=>{let n=V(e);n._x_refs||(n._x_refs={}),n._x_refs[t]=e,r(()=>delete n._x_refs[t])};d("ref",sn);d("if",(e,{expression:t},{effect:r,cleanup:n})=>{let i=g(e,t),o=()=>{if(e._x_currentIfEl)return e._x_currentIfEl;let a=e.content.cloneNode(!0).firstElementChild;return C(a,{},e),m(()=>{e.after(a),w(a)}),e._x_currentIfEl=a,e._x_undoIf=()=>{R(a,c=>{c._x_effects&&c._x_effects.forEach(he)}),a.remove(),delete e._x_currentIfEl},a},s=()=>{!e._x_undoIf||(e._x_undoIf(),delete e._x_undoIf)};r(()=>i(a=>{a?o():s()})),n(()=>e._x_undoIf&&e._x_undoIf())});d("id",(e,{expression:t},{evaluate:r})=>{r(t).forEach(i=>en(e,i))});Z(Ee("@",Se(E("on:"))));d("on",$((e,{value:t,modifiers:r,expression:n},{cleanup:i})=>{let o=n?g(e,n):()=>{};e.tagName.toLowerCase()==="template"&&(e._x_forwardEvents||(e._x_forwardEvents=[]),e._x_forwardEvents.includes(t)||e._x_forwardEvents.push(t));let s=de(e,t,r,a=>{o(()=>{},{scope:{$event:a},params:[a]})});i(()=>s())}));Ue("Collapse","collapse","collapse");Ue("Intersect","intersect","intersect");Ue("Focus","trap","focus");Ue("Mask","mask","mask");function Ue(e,t,r){d(t,n=>O(`You can't use [x-${t}] without first installing the "${e}" plugin here: https://alpinejs.dev/plugins/${r}`,n))}I.setEvaluator(ct);I.setReactivityEngine({reactive:je,effect:Pr,release:Dr,raw:_});var It=I;window.Alpine=It;queueMicrotask(()=>{It.start()});})();
diff --git a/core/static/core/style.scss b/core/static/core/style.scss
index e1c4da47..76b5ceab 100644
--- a/core/static/core/style.scss
+++ b/core/static/core/style.scss
@@ -154,20 +154,23 @@ a {
 
 header {
   width: 90%;
-  margin: 0px auto;
+  margin: 0 auto;
   display: flex;
-  box-shadow: $shadow-color 0px 0px 15px;
+  box-shadow: $shadow-color 0 0 15px;
   border-top: none;
-  background-color: $primary-neutral-dark-color;
+  //background-color: $primary-neutral-dark-color;
   border-radius: 0px 0px 10px 10px;
 
   #header_logo {
     background-color: $white-color;
     padding: 0.2em;
-    border-radius: 0px 0px 0px 9px;
+    border-bottom: 5px solid $shadow-color;
+    border-radius: 0px 0px 0px 5px;
+    margin-bottom: -5px;
 
     a {
-      display: inline-block;
+      display: flex;
+      align-items: center;
       margin: 0px;
       width: 100%;
       height: 100%;
@@ -182,7 +185,7 @@ header {
   }
 
   #header_connect_links {
-    margin: 0.6em 0.6em 0em auto;
+    margin: 0.6em 0.6em 0 auto;
     padding: 0.2em;
     color: $white-color;
     form {
@@ -205,7 +208,7 @@ header {
 
     a {
       text-decoration: none;
-      margin: 0em 1em;
+      margin: 0 1em;
       font-weight: bold;
       color: $white-color;
       &:hover {
@@ -222,7 +225,7 @@ header {
     #header_search {
       display: inline-block;
       flex: auto;
-      margin: 0.8em 0em;
+      margin: 0.8em 0;
       input {
           width: 14ch;
       }
@@ -233,10 +236,10 @@ header {
       flex: initial;
       flex-wrap: wrap;
       text-align: right;
-      margin: 0em;
+      margin: 0;
       div {
         display: inline;
-        padding: 1.2em 0em;
+        padding: 1.2em 0;
         &:first-child {
           flex: auto;
         }
@@ -258,7 +261,7 @@ header {
         background: white;
         text-align: left;
         font-size: 80%;
-        margin: 1.5em 0em 0em -14em;
+        margin: 1.5em 0 0em -14em;
         .header_notif_date {
           font-weight: bold;
         }
@@ -266,7 +269,7 @@ header {
           color: grey;
         }
         a {
-          margin: 0em;
+          margin: 0;
           color: $black-color;
           &:hover {
             color: $primary-dark-color;
@@ -294,7 +297,7 @@ header {
 
 #popupheader {
   width: 88%;
-  margin: 0px auto;
+  margin: 0 auto;
   padding: 0.3em 1%;
 }
 
@@ -337,15 +340,15 @@ header {
 
 #page {
   width: 90%;
-  margin: 0em auto;
-/*---------------------------------NAV---------------------------------*/
+  margin: 20px auto 0;
+  /*---------------------------------NAV---------------------------------*/
   nav {
     display: flex;
     flex-wrap: wrap;
     background-color: $primary-dark-color;
     color: $white-color;
-    border-radius: 6px 6px 0px 0px;
-    box-shadow: $shadow-color 0px 0px 15px;
+    border-radius: 6px 6px 0 0;
+    box-shadow: $shadow-color 0 0 15px;
 
     a {
       flex: auto;
@@ -360,10 +363,10 @@ header {
         background: $secondary-neutral-color;
         color: $white-color;
         &:first-of-type {
-          border-radius: 6px 0px 0px 0px;
+          border-radius: 6px 0 0 0;
         }
         &:last-of-type {
-          border-radius: 0px 6px 0px 0px;
+          border-radius: 0 6px 0 0;
         }
       }
     }
@@ -386,7 +389,7 @@ header {
       overflow: auto;
       width: 100%;
       background-color: #f9f9f9;
-      box-shadow: 3px 3px 3px 0px $shadow-color;
+      box-shadow: 3px 3px 3px 0 $shadow-color;
       z-index: 1;
     }
 
@@ -411,7 +414,7 @@ header {
 /*--------------------------------CONTENT------------------------------*/
   #quick_notif {
     width: 100%;
-    margin: 0px auto;
+    margin: 0 auto;
     list-style-type: none;
     background: $second-color;
     li {
@@ -422,7 +425,7 @@ header {
 
   #content {
     padding: 1em 1%;
-    box-shadow: $shadow-color 0px 5px 10px;
+    box-shadow: $shadow-color 0 5px 10px;
     background: $white-color;
     overflow: auto;
   }
@@ -467,7 +470,7 @@ header {
     flex-wrap: wrap;
     .news_column {
       display: inline-block;
-      margin: 0px;
+      margin: 0;
       vertical-align: top;
     }
     #news_admin {
@@ -508,7 +511,7 @@ header {
       margin-bottom: 1em;
       #agenda_title,#birthdays_title {
         margin: 0em;
-        border-radius: 5px 5px 0px 0px;
+        border-radius: 5px 5px 0 0;
         box-shadow: $shadow-color 1px 1px 1px;
         padding: 0.5em;
         font-weight: bold;
@@ -577,10 +580,10 @@ header {
         font-weight: bold;
         font-family: monospace;
         font-size: 1.4em;
-        border-radius: 7px 0px 0px 7px;
+        border-radius: 7px 0 0 7px;
 
         div {
-          margin: 0px auto;
+          margin: 0 auto;
           .day {
             font-size: 1.5em;
           }
@@ -665,7 +668,7 @@ header {
       padding: 0.4em;
       padding-left: 1em;
       background: $secondary-neutral-light-color;
-      box-shadow: $shadow-color 0px 0px 2px;
+      box-shadow: $shadow-color 0 0 2px;
       border-radius: 18px 5px 18px 5px;
       h4 {
         margin: 0em;
@@ -998,7 +1001,7 @@ h1, h2, h3, h4, h5, h6 {
 
 h1 {
   font-size: 160%;
-  margin-left: 0px;
+  margin-left: 0;
 }
 
 h2 {
@@ -1028,7 +1031,7 @@ h6 {
 
 p, pre {
   margin-top: 0.8em;
-  margin-left: 0px;
+  margin-left: 0;
 }
 
 ul, ol, dl {
@@ -1086,7 +1089,7 @@ td {
   overflow: hidden;
   text-overflow: ellipsis;
   > ul {
-    margin-top: 0px;
+    margin-top: 0;
   }
 }
 
@@ -1439,7 +1442,7 @@ textarea {
   }
 
   .search_bar {
-    margin: 10px 0px;
+    margin: 10px 0;
     display: flex;
     flex-wrap: wrap;
     height: 20p;
@@ -1455,7 +1458,7 @@ textarea {
     margin-top: 5px;
     background: $secondary-color;
     color: white;
-    border-radius: 10px 10px 0px 0px;
+    border-radius: 10px 10px 0 0;
     .title {
       text-transform: uppercase;
     }
@@ -1495,7 +1498,7 @@ textarea {
     text-align: center;
     img {
       max-width: 70%;
-      margin: 0px auto;
+      margin: 0 auto;
     }
   }
 
@@ -1583,7 +1586,7 @@ footer {
     display: flex;
     flex-wrap: wrap;
     background-color: $primary-neutral-dark-color;
-    box-shadow: $shadow-color 0px 0px 15px;
+    box-shadow: $shadow-color 0 0 15px;
     a {
       padding: 0.8em;
       flex: 1;
@@ -1599,7 +1602,7 @@ footer {
 /*---------------------------------FORMS-------------------------------*/
 
 form {
-  margin: 0px auto;
+  margin: 0 auto;
   margin-bottom: 10px;
 }
 
@@ -1613,7 +1616,7 @@ label {
 }
 
 .ui-dialog .ui-dialog-buttonpane {
-  bottom: 0px;
+  bottom: 0;
   position: absolute;
   width: 97%;
 }
@@ -1658,8 +1661,8 @@ label {
 /*-------------------------------MARKDOWN------------------------------*/
 
 .markdown {
-  margin: 0px;
-  padding: 0px;
+  margin: 0;
+  padding: 0;
   code {
     font-family: monospace;
     color: $white-color;
@@ -1690,7 +1693,7 @@ label {
 }
 .ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-top,
 .ui-corner-left {
-  border-radius: 0px;
+  border-radius: 0;
 }
 
 #club_detail {
@@ -1716,13 +1719,13 @@ $pedagogy-white-text: #f0f0f0;
 .pedagogy {
     &.star-not-checked {
       color : #f7f7f7;
-      margin-bottom: 0px;
-      margin-top: 0px;
+      margin-bottom: 0;
+      margin-top: 0;
     }
     &.star-checked {
       color: $pedagogy-orange;
-      margin-bottom: 0px;
-      margin-top: 0px;
+      margin-bottom: 0;
+      margin-top: 0;
     }
 
     &.grade-without-star {
@@ -2094,8 +2097,8 @@ $pedagogy-white-text: #f0f0f0;
           grid-area: markdown;
 
           min-height: 139px;
-          margin-top: 0px;
-          margin-right: 0px;
+          margin-top: 0;
+          margin-right: 0;
           padding: 10px;
           text-align: justify;
           overflow: auto;
@@ -2141,7 +2144,7 @@ $pedagogy-white-text: #f0f0f0;
             "report"
             "date"
             "author";
-          margin-top: 0px;
+          margin-top: 0;
           text-align: center;
         }
 
@@ -2156,7 +2159,7 @@ $pedagogy-white-text: #f0f0f0;
 
           @media screen and (max-width: $large-devices){
             clip-path: none;
-            padding: 0px;
+            padding: 0;
             padding-bottom: 7px;
           }
 
diff --git a/core/static/eboutic/css/eboutic.css b/core/static/eboutic/css/eboutic.css
new file mode 100644
index 00000000..d27319cd
--- /dev/null
+++ b/core/static/eboutic/css/eboutic.css
@@ -0,0 +1,191 @@
+#eboutic {
+    display: flex;
+    flex-direction: row-reverse;
+    align-items: flex-start;
+    column-gap: 20px;
+    margin: 0 20px 20px;
+}
+
+#eboutic-title {
+    margin-left: 20px;
+}
+
+#eboutic h3 {
+    margin-left: 0;
+    margin-right: 0;
+}
+
+#basket {
+    width: 300px;
+    border-radius: 8px;
+    box-shadow: rgb(60 64 67 / 30%) 0 1px 3px 0, rgb(60 64 67 / 15%) 0 4px 8px 3px;
+    padding: 10px;
+}
+
+#basket h3 {
+    margin-top: 0;
+}
+
+@media screen and (max-width: 765px) {
+    #eboutic {
+        flex-direction: column;
+        align-items: center;
+        margin: 10px;
+        row-gap: 20px;
+    }
+    #eboutic-title {
+        margin-bottom: 20px;
+        margin-top: 4px;
+    }
+    #basket {
+    }
+}
+
+#eboutic #basket .error-message {
+    margin-top: 5px;
+    background-color: #f8d7da;
+    border: #f5c6cb 1px solid;
+    border-radius: 4px;
+    padding: 10px;
+    display: flex;
+    flex-direction: column;
+    row-gap: 7px;
+}
+#eboutic #basket .error-message p {
+    margin: 0;
+}
+
+#eboutic .item-list {
+    margin-left: 0;
+    list-style: none;
+}
+
+#eboutic .item-list li {
+    display: flex;
+    align-items: center;
+    margin-bottom: 10px
+}
+
+#eboutic .item-name {
+    flex: 1;
+}
+
+#eboutic .item-price, #eboutic .item-quantity {
+    width: 65px;
+}
+
+#eboutic .item-quantity {
+    text-align: center;
+}
+
+#eboutic .fa-plus, #eboutic .fa-minus {
+    cursor: pointer;
+}
+
+#eboutic .item-price {
+    text-align: right;
+}
+
+/*  CSS du catalogue  */
+
+#eboutic #catalog {
+    display: flex;
+    flex-grow: 1;
+    flex-direction: column;
+    row-gap: 30px;
+}
+
+#eboutic .category-header {
+    margin-bottom: 15px;
+}
+
+#eboutic .product-group {
+    display: flex;
+    flex-wrap: wrap;
+    column-gap: 15px;
+    row-gap: 15px;
+}
+
+@media screen and (max-width: 765px) {
+    #eboutic #catalog {
+        row-gap: 15px;
+    }
+
+    #eboutic section {
+        text-align: center;
+    }
+
+    #eboutic .product-group {
+        justify-content: space-around;
+    }
+}
+
+#eboutic .product-button {
+    position: relative;
+    box-sizing: border-box;
+    min-width: 120px;
+    max-width: 150px;
+    padding: 10px;
+    overflow: hidden;
+    box-shadow: rgb(60 64 67 / 30%) 0 1px 3px 0, rgb(60 64 67 / 15%) 0 4px 8px 3px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    row-gap: 5px;
+}
+
+#eboutic .product-button:active {
+    box-shadow: none;
+}
+
+#eboutic .product-button img, #eboutic .product-button .fa {
+    margin: 0;
+    border-radius: 4px;
+    height: 40px;
+    line-height: 40px;
+}
+
+#eboutic .product-button p {
+    font-size: 13px;
+    margin: 0;
+}
+
+#eboutic .catalog-buttons {
+    display: flex;
+    justify-content: center;
+    column-gap: 30px;
+    margin: 30px 0 0;
+}
+
+#eboutic input {
+    all: unset;
+}
+
+#eboutic .catalog-buttons button {
+    font-size: 15px;
+    font-weight: normal;
+    color: white;
+    min-width: 60px;
+    padding: 5px 10px;
+}
+#eboutic .catalog-buttons .validate {
+    background-color: #354a5f;
+}
+#eboutic .catalog-buttons .clear {
+    background-color: gray;
+}
+#eboutic .catalog-buttons button i {
+    margin-right: 4px;
+}
+
+#eboutic .catalog-buttons button.validate:hover {
+    background-color: #2c3646;
+}
+
+#eboutic .catalog-buttons button.clear:hover {
+    background-color:hsl(210,5%,30%);
+}
+
+#eboutic .catalog-buttons form {
+    margin: 0;
+}
\ No newline at end of file
diff --git a/core/static/eboutic/js/eboutic.js b/core/static/eboutic/js/eboutic.js
new file mode 100644
index 00000000..4df6b02e
--- /dev/null
+++ b/core/static/eboutic/js/eboutic.js
@@ -0,0 +1,104 @@
+function getCookie(name) {
+    let cookieValue = null;
+    if (document.cookie && document.cookie !== '') {
+        const cookies = document.cookie.split(';');
+        for (let i = 0; i < cookies.length; i++) {
+            const cookie = cookies[i].trim();
+            // Does this cookie string begin with the name we want?
+            if (cookie.substring(0, name.length + 1) === (name + '=')) {
+                cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
+                break;
+            }
+        }
+    }
+    return cookieValue;
+}
+
+function get_starting_items() {
+    const cookie = getCookie("basket_items")
+    try {
+        // django cookie backend does an utter mess on non-trivial data types
+        // so we must perform a conversion of our own
+        const biscuit = JSON.parse(JSON.parse(cookie.replace(/\\054/g, ',')));
+        if (Array.isArray(biscuit)) {
+            return biscuit;
+        }
+        return [];
+    } catch (e) {
+        return [];
+    }
+}
+
+document.addEventListener('alpine:init', () => {
+    Alpine.data('basket', () => ({
+        items: get_starting_items(),
+
+        get_total() {
+            let total = 0;
+            for (const item of this.items) {
+                total += item["quantity"] * item["unit_price"];
+            }
+            return total;
+        },
+
+        add(item) {
+            item.quantity++;
+            this.edit_cookies()
+        },
+
+        remove(item_id) {
+            const index = this.items.findIndex(e => e.id === item_id);
+            if (index < 0) return;
+            this.items[index].quantity -= 1;
+            if (this.items[index].quantity === 0) {
+                this.items = this.items.filter((e) => e.id !== this.items[index].id);
+            }
+            this.edit_cookies();
+        },
+
+        clear_basket() {
+            this.items = []
+            this.edit_cookies();
+        },
+
+        edit_cookies() {
+            // a cookie survives an hour
+            document.cookie = "basket_items=" + JSON.stringify(this.items) + ";Max-Age=3600";
+        },
+
+        /**
+         * Create an item in the basket if it was not already in
+         * @param id : int the id of the product to add
+         * @param name : String the name of the product
+         * @param price : number the unit price of the product
+         */
+        create_item(id, name, price) {
+            let new_item = {
+                id: id,
+                name: name,
+                quantity: 0,
+                unit_price: price
+            };
+            this.items.push(new_item);
+            this.add(new_item);
+        },
+
+        /**
+         * add an item to the basket.
+         * This is called when the user click
+         * on a button in the catalog (left side of the page)
+         * @param id : int the id of the product to add
+         * @param name : String the name of the product
+         * @param price : number the unit price of the product
+         */
+        add_from_catalog(id, name, price) {
+            const item = this.items.find(e => e.id === id)
+            if (item === undefined) {
+                this.create_item(id, name, price);
+            } else {
+                // the user clicked on an item which is already in the basket
+                this.add(item);
+            }
+        },
+    }))
+})
\ No newline at end of file
diff --git a/core/templates/core/base.jinja b/core/templates/core/base.jinja
index dec428c3..b6abf2c8 100644
--- a/core/templates/core/base.jinja
+++ b/core/templates/core/base.jinja
@@ -9,7 +9,10 @@
         <link rel="stylesheet" href="{{ static('core/jquery.datetimepicker.min.css') }}">
         <link rel="stylesheet" href="{{ static('ajax_select/css/ajax_select.css') }}">
         <link rel="stylesheet" href="{{ scss('core/style.scss') }}">
-        <link rel="stylesheet" href="{{ static('core/js/ui/jquery-ui.min.css') }}">
+        {% block jquery_css %}
+            {# Thile file is quite heavy (around 250kb), so declaring it in a block allows easy removal #}
+            <link rel="stylesheet" href="{{ static('core/js/ui/jquery-ui.min.css') }}">
+        {% endblock %}
         <link rel="preload" as="style" href="{{ static('core/font-awesome/css/font-awesome.min.css') }}" onload="this.onload=null;this.rel='stylesheet'">
         <noscript><link rel="stylesheet" href="{{ static('core/font-awesome/css/font-awesome.min.css') }}"></noscript>
         <script defer href="{{ static('core/font-awesome/js/fontawesone.min.js') }}"></script>
@@ -18,6 +21,8 @@
         <script src="{{ static('core/js/jquery-3.1.0.min.js') }}"></script>
         <!-- Put here to always have acces to those functions on django widgets -->
         <script src="{{ static('core/js/script.js') }}"></script>
+        {% block additional_css %}{% endblock %}
+        {% block additional_js %}{% endblock %}
         {% endblock %}
     </head>
 
@@ -39,13 +44,12 @@
             </form>
             {% endfor %}
         </div>
-
-            {% if not user.is_authenticated %}
             <div id="header_logo">
                 <a href="{{ url('core:index') }}">
                     <img src="{{ static('core/img/logo.png') }}" alt="AE logo">
                 </a>
             </div>
+            {% if not user.is_authenticated %}
             <div id="header_connect_links">
                 <form method="post" action="{{ url('core:login') }}">
                 {% csrf_token %}
@@ -58,11 +62,6 @@
                 <a href="{{ url('core:register') }}"><button type="button">{% trans %}Register{% endtrans %}</button></a>
             </div>
             {% else %}
-            <div id="header_logo">
-                <a href="{{ url('core:index') }}">
-                    <img src="{{ static('core/img/logo.png') }}" alt="AE logo">
-                </a>
-            </div>
             <div id="header_bar">
                 <ul id="header_bars_infos">
                 {% cache 100 "counters_activity" %}
@@ -185,7 +184,9 @@
               </div>
               <a href="{{ url('forum:main') }}">{% trans %}Forum{% endtrans %}</a>
               <a href="{{ url('sas:main') }}">{% trans %}Gallery{% endtrans %}</a>
-              <a href="{{ url('eboutic:main') }}">{% trans %}Eboutic{% endtrans %}</a>
+              {% if request.user.is_authenticated %}
+                  <a href="{{ url('eboutic:main') }}">{% trans %}Eboutic{% endtrans %}</a>
+              {% endif %}
               <div class="dropdown">
                 <button class="dropbtn">{% trans %}Services{% endtrans %}
                 <i class="fa fa-caret-down"></i>
diff --git a/counter/models.py b/counter/models.py
index 8523555c..e3c0c515 100644
--- a/counter/models.py
+++ b/counter/models.py
@@ -31,7 +31,6 @@ from django.urls import reverse
 from django.core.validators import MinLengthValidator
 from django.forms import ValidationError
 from django.utils.functional import cached_property
-from django.core.exceptions import PermissionDenied
 
 from datetime import timedelta, date
 import random
@@ -73,7 +72,16 @@ class Customer(models.Model):
         return self.recorded_products - number >= -settings.SITH_ECOCUP_LIMIT
 
     @property
-    def can_buy(self):
+    def can_buy(self) -> bool:
+        """
+        Check if whether this customer has the right to
+        purchase any item.
+        This must be not confused with the Product.can_be_sold_to(user)
+        method as the present method returns an information
+        about a customer whereas the other tells something
+        about the relation between a User (not a Customer,
+        don't mix them) and a Product.
+        """
         return self.user.subscriptions.last() and (
             date.today()
             - self.user.subscriptions.order_by("subscription_end")
@@ -81,6 +89,7 @@ class Customer(models.Model):
             .subscription_end
         ) < timedelta(days=90)
 
+    @staticmethod
     def generate_account_id(number):
         number = str(number)
         letter = random.choice(string.ascii_lowercase)
@@ -203,12 +212,32 @@ class Product(models.Model):
             return True
         return False
 
-    def __str__(self):
-        return "%s (%s)" % (self.name, self.code)
-
     def get_absolute_url(self):
         return reverse("counter:product_list")
 
+    def can_be_sold_to(self, user: User) -> bool:
+        """
+        Check if whether the user given in parameter has the right to buy
+        this product or not.
+
+        This must be not confused with the Customer.can_buy()
+        method as the present method returns an information
+        about the relation between a User and a Product,
+        whereas the other tells something about a Customer
+        (and not a user, they are not the same model).
+
+        :return: True if the user can buy this product else False
+        """
+        if not self.buying_groups.exists():
+            return True
+        for group in self.buying_groups.all():
+            if user.is_in_group(group.name):
+                return True
+        return False
+
+    def __str__(self):
+        return "%s (%s)" % (self.name, self.code)
+
 
 class Counter(models.Model):
     name = models.CharField(_("name"), max_length=30)
diff --git a/eboutic/README.md b/eboutic/README.md
new file mode 100644
index 00000000..a4feb639
--- /dev/null
+++ b/eboutic/README.md
@@ -0,0 +1,94 @@
+Eboutic
+=======
+
+# Aperçu général
+
+L'application eboutic contient les vues, les templates et les modèles
+nécessaires pour le fonctionnement de la boutique en ligne.
+L'utilisateur peut acheter des produits en ligne et payer soit 
+par carte bancaire soit avec l'argent qu'il possède sur son compte AE.
+
+On effectue ici une séparation entre plusieurs types de produits : 
+- les recharges de compte (``Refilling``) qui permettent de rajouter de 
+l'argent sur le compte. Un panier contenant un élément de ce type ne pourra être
+payé que par carte bancaire.
+- Les cotisations (``Subscription``) qui permettent à un utilisateur de cotiser
+à l'AE. Seul un utilisateur ayant déjà été cotisant pourra acheter ce produit.
+Les primo-cotisants doivent s'adresser directement à un membre du bureau.
+- Les produits normaux (badges, écussons, billets pour les soirées...)
+
+Les utilisateurs cotisants ne peuvent pas voir les produits des non-cotisants
+et vice-versa. Ce n'est pas la manière la plus satisfaisante de procéder, mais
+c'est celle qui touchait le moins aux tables déjà en place.
+Les produits avec une limite d'âge ne seront pas visibles par les utilisateurs ayant
+un âge inférieur.
+
+Le comportement de cette application dépend directement de celui des applications
+``core`` et ``counter``. Les modèles de l'application ``Subscription`` sont
+également utilisés. N'hésitez donc pas à vous pencher sur le fonctionnement des modules
+susnommés afin de comprendre comment celui-ci marche.
+
+# Les vues
+
+Cette application contient les vues suivantes : 
+
+- `eboutic_main` (GET) : la vue retournant la page principale de la boutique en ligne.
+Cette vue effectue un filtrage des produits à montrer à l'utilisateur en
+fonction de ce qu'il a le droit d'acheter.
+Si cette vue est appelée lors d'une redirection parce qu'une erreur 
+est survenue au cours de la navigation sur la boutique, il est possible
+de donner les messages d'erreur à donner à l'utilisateur dans la session 
+avec la clef ``"errors"``.
+- ``payment_result`` (GET) : retourne une page assez simple disant à l'utilisateur
+si son paiement a échoué ou réussi. Cette vue est appelée par redirection
+lorsque l'utilisateur paye son panier avec son argent du compte AE.
+- ``EbouticCommand`` (POST) : traite la soumission d'un panier par l'utilisateur.
+Lors de l'appel de cette vue, la requête doit contenir un cookie avec l'état
+du panier à valider. Ce panier doit strictement être de la forme : 
+```
+[
+  {"id": <int>, "name": <str>, "quantity": <int>, "unit_price": <float>},
+  {"id": <int>, "name": <str>, "quantity": <int>, "unit_price": <float>},
+  <etc.>
+]
+```
+Si le panier est mal formaté ou contient des valeurs invalides, 
+une redirection est faite vers `eboutic_main`.
+- ``pay_with_sith`` (POST) : paie le panier avec l'argent présent sur le compte
+AE. Redirige vers `payment_result`.
+- ``ETransactionAutoAnswer`` (GET) : vue destinée à communiquer avec le service 
+de paiement bancaire pour valider ou non le paiement de l'utilisateur.
+
+# Les templates
+
+- ``eboutic_payment_result.jinja`` : très court template contenant juste
+un message pour dire à l'utilisateur si son achat s'est bien déroulé.
+Retourné par la vue ``payment_result``.
+- ``eboutic_makecommand.jinja`` : template contenant un résumé du panier et deux
+boutons, un pour payer avec le site AE et l'autre pour payer par carte bancaire.
+Retourné par la vue ``EbouticCommand``
+- ``eboutic_main.jinja`` : le plus gros template de cette application. Contient
+une interface pour que l'utilisateur puisse consulter les produits et remplir
+son panier. Les opérations de remplissage du panier se font entièrement côté client.
+À chaque clic pour ajouter ou retirer un élément du panier, le script JS
+  (AlpineJS, plus précisément) édite en même temps un cookie. 
+Au moment de la validation du panier, ce cookie est envoyé au serveur pour
+vérifier que la commande est valide et payer.
+
+# Les modèles
+
+- ``Basket`` : représente le panier d'un utilisateur. Un objet ``Basket`` est créé
+quand l'utilisateur soumet son panier et supprimé quand le paiement est validé.
+Si le paiement n'est pas validé, le panier est conservé en base de données
+afin d'avoir une trace si l'utilisateur a quand même été débité et qu'il n'a pas
+reçu ses produits à cause d'une erreur de synchronisation.
+- ``Invoice`` : Un peu comme un panier, mais pour quand une transaction
+a été validée.
+- ``AbstractBaseItem`` : modèle utilisé pour être hérité par ``BasketItem`` et ``InvoiceItem``.
+Me demandez pas pourquoi ``product_id`` est un IntegerField plutôt qu'une clef étrangère,
+moi aussi je trouve ça complètement con. 
+Le prix unitaire est indiqué dans ce modèle même si ça fait une redondance avec le modèle
+``Product`` afin de garder le prix que l'élément avait au moment de sa vente,
+même si le prix du produit de base est modifié.
+- ``BasketItem`` : représente un élément présent dans le panier de l'utilisateur.
+- ``InvoiceItem`` : représente un élément vendu.
diff --git a/eboutic/admin.py b/eboutic/admin.py
index 324a0175..d420e280 100644
--- a/eboutic/admin.py
+++ b/eboutic/admin.py
@@ -28,3 +28,4 @@ from eboutic.models import *
 
 admin.site.register(Basket)
 admin.site.register(Invoice)
+admin.site.register(BasketItem)
diff --git a/eboutic/converters.py b/eboutic/converters.py
new file mode 100644
index 00000000..a757a25c
--- /dev/null
+++ b/eboutic/converters.py
@@ -0,0 +1,39 @@
+# -*- coding:utf-8 -*
+#
+# Copyright 2022
+# - Maréchal <thgirod@hotmail.com
+#
+# Ce fichier fait partie du site de l'Association des Étudiants de l'UTBM,
+# http://ae.utbm.fr.
+#
+# This program is free software; you can redistribute it and/or modify it under
+# the terms of the GNU General Public License a published by the Free Software
+# Foundation; either version 3 of the License, or (at your option) any later
+# version.
+#
+# This program is distributed in the hope that it will be useful, but WITHOUT
+# ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
+# FOR A PARTICULAR PURPOSE.  See the GNU General Public License for more
+# details.
+#
+# You should have received a copy of the GNU General Public License along with
+# this program; if not, write to the Free Sofware Foundation, Inc., 59 Temple
+# Place - Suite 330, Boston, MA 02111-1307, USA.
+
+
+class PaymentResultConverter:
+    """
+    Converter used for url mapping of the ``eboutic.views.payment_result``
+    view.
+    It's meant to build an url that can match
+    either ``/eboutic/pay/success/`` or ``/eboutic/pay/failure/``
+    but nothing else.
+    """
+
+    regex = "(success|failure)"
+
+    def to_python(self, value):
+        return str(value)
+
+    def to_url(self, value):
+        return str(value)
diff --git a/eboutic/forms.py b/eboutic/forms.py
new file mode 100644
index 00000000..8f1ddaf1
--- /dev/null
+++ b/eboutic/forms.py
@@ -0,0 +1,175 @@
+# -*- coding:utf-8 -*
+#
+# Copyright 2022
+# - Maréchal <thgirod@hotmail.com
+#
+# Ce fichier fait partie du site de l'Association des Étudiants de l'UTBM,
+# http://ae.utbm.fr.
+#
+# This program is free software; you can redistribute it and/or modify it under
+# the terms of the GNU General Public License a published by the Free Software
+# Foundation; either version 3 of the License, or (at your option) any later
+# version.
+#
+# This program is distributed in the hope that it will be useful, but WITHOUT
+# ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
+# FOR A PARTICULAR PURPOSE.  See the GNU General Public License for more
+# details.
+#
+# You should have received a copy of the GNU General Public License along with
+# this program; if not, write to the Free Sofware Foundation, Inc., 59 Temple
+# Place - Suite 330, Boston, MA 02111-1307, USA.
+#
+#
+
+import json
+import re
+import typing
+
+from django.http import HttpRequest
+from django.utils.translation import gettext as _
+
+from eboutic.models import get_eboutic_products
+
+
+class BasketForm:
+    """
+    Class intended to perform checks on the request sended to the server when
+    the user submits his basket from /eboutic/
+
+    Because it must check an unknown number of fields, coming from a cookie
+    and needing some databases checks to be performed, inheriting from forms.Form
+    or using formset would have been likely to end in a big ball of wibbly-wobbly hacky stuff.
+    Thus this class is a pure standalone and performs its operations by its own means.
+    However, it still tries to share some similarities with a standard django Form.
+
+    Example:
+        ::
+
+            def my_view(request):
+                form = BasketForm(request)
+                form.clean()
+                if form.is_valid():
+                    # perform operations
+                else:
+                    errors = form.get_error_messages()
+
+                    # return the cookie that was in the request, but with all
+                    # incorrects elements removed
+                    cookie = form.get_cleaned_cookie()
+
+    You can also use a little shortcut by directly calling `form.is_valid()`
+    without calling `form.clean()`. In this case, the latter method shall be
+    implicitly called.
+    """
+
+    # check the json is an array containing non-nested objects.
+    # values must be strings or numbers
+    # this is matched :
+    # [{"id": 4, "name": "[PROMO 22] badges", "unit_price": 2.3, "quantity": 2}]
+    # but this is not :
+    # [{"id": {"nested_id": 10}, "name": "[PROMO 22] badges", "unit_price": 2.3, "quantity": 2}]
+    # and neither does this :
+    # [{"id": ["nested_id": 10], "name": "[PROMO 22] badges", "unit_price": 2.3, "quantity": 2}]
+    # and neither does that :
+    # [{"id": null, "name": "[PROMO 22] badges", "unit_price": 2.3, "quantity": 2}]
+    json_cookie_re = re.compile(
+        r"^\[\s*(\{\s*(\"[^\"]*\":\s*(\"[^\"]{0,64}\"|\d{0,5}\.?\d+),?\s*)*\},?\s*)*\s*\]$"
+    )
+
+    def __init__(self, request: HttpRequest):
+        self.user = request.user
+        self.cookies = request.COOKIES
+        self.error_messages = set()
+        self.correct_cookie = []
+
+    def clean(self) -> None:
+        """
+        Perform all the checks, but return nothing.
+        To know if the form is valid, the `is_valid()` method must be used.
+
+        The form shall be considered as valid if it meets all the following conditions :
+            - it contains a "basket_items" key in the cookies of the request given in the constructor
+            - this cookie is a list of objects formatted this way : `[{'id': <int>, 'quantity': <int>,
+             'name': <str>, 'unit_price': <float>}, ...]`. The order of the fields in each object does not matter
+            - all the ids are positive integers
+            - all the ids refer to products available in the EBOUTIC
+            - all the ids refer to products the user is allowed to buy
+            - all the quantities are positive integers
+        """
+        basket = self.cookies.get("basket_items", None)
+        if basket is None or basket in ("[]", ""):
+            self.error_messages.add(_("You have no basket."))
+            return
+        # check that the json is not nested before parsing it to make sure
+        # malicious user can't ddos the server with deeply nested json
+        if not BasketForm.json_cookie_re.match(basket):
+            self.error_messages.add(_("The request was badly formatted."))
+            return
+        try:
+            basket = json.loads(basket)
+        except json.JSONDecodeError:
+            self.error_messages.add(_("The basket cookie was badly formatted."))
+            return
+        if type(basket) is not list or len(basket) == 0:
+            self.error_messages.add(_("Your basket is empty."))
+            return
+        for item in basket:
+            expected_keys = {"id", "quantity", "name", "unit_price"}
+            if type(item) is not dict or set(item.keys()) != expected_keys:
+                self.error_messages.add("One or more items are badly formatted.")
+                continue
+            # check the id field is a positive integer
+            if type(item["id"]) is not int or item["id"] < 0:
+                self.error_messages.add(
+                    _("%(name)s : this product does not exist.")
+                    % {"name": item["name"]}
+                )
+                continue
+            # check a product with this id does exist
+            ids = {product.id for product in get_eboutic_products(self.user)}
+            if not item["id"] in ids:
+                self.error_messages.add(
+                    _(
+                        "%(name)s : this product does not exist or may no longer be available."
+                    )
+                    % {"name": item["name"]}
+                )
+                continue
+            if type(item["quantity"]) is not int or item["quantity"] < 0:
+                self.error_messages.add(
+                    _("You cannot buy %(nbr)d %(name)%s.")
+                    % {"nbr": item["quantity"], "name": item["name"]}
+                )
+                continue
+
+            # if we arrive here, it means this item has passed all tests
+            self.correct_cookie.append(item)
+        # for loop for item checking ends here
+
+        # this function does not return anything.
+        # instead, it fills a set containing the collected error messages
+        # an empty set means that no error was seen thus everything is ok
+        # and the form is valid.
+        # a non-empty set means there was at least one error thus
+        # the form is invalid
+
+    def is_valid(self) -> bool:
+        """
+        return True if the form is correct else False.
+        If the `clean()` method has not been called beforehand, call it
+        """
+        if self.error_messages == set() and self.correct_cookie == []:
+            self.clean()
+        if self.error_messages:
+            return False
+        return True
+
+    def get_error_messages(self) -> typing.List[str]:
+        # return [msg for msg in self.error_messages]
+        return list(self.error_messages)
+
+    def get_cleaned_cookie(self) -> str:
+        if not self.correct_cookie:
+            return ""
+        return json.dumps(self.correct_cookie)
diff --git a/eboutic/migrations/0002_auto_20221005_2243.py b/eboutic/migrations/0002_auto_20221005_2243.py
new file mode 100644
index 00000000..2c1138ae
--- /dev/null
+++ b/eboutic/migrations/0002_auto_20221005_2243.py
@@ -0,0 +1,23 @@
+# Generated by Django 3.2.15 on 2022-10-05 20:43
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ("eboutic", "0001_initial"),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name="basketitem",
+            name="quantity",
+            field=models.PositiveIntegerField(verbose_name="quantity"),
+        ),
+        migrations.AlterField(
+            model_name="invoiceitem",
+            name="quantity",
+            field=models.PositiveIntegerField(verbose_name="quantity"),
+        ),
+    ]
diff --git a/eboutic/models.py b/eboutic/models.py
index b69f70c0..59952751 100644
--- a/eboutic/models.py
+++ b/eboutic/models.py
@@ -21,15 +21,29 @@
 # Place - Suite 330, Boston, MA 02111-1307, USA.
 #
 #
+import typing
+from typing import List
 
-from django.db import models, DataError
-from django.utils.translation import gettext_lazy as _
-from django.utils.functional import cached_property
 from django.conf import settings
+from django.db import models, DataError
+from django.db.models import Sum, F
+from django.utils.functional import cached_property
+from django.utils.translation import gettext_lazy as _
 
 from accounting.models import CurrencyField
+from core.models import Group, User
 from counter.models import Counter, Product, Selling, Refilling
-from core.models import User
+
+
+def get_eboutic_products(user: User) -> List[Product]:
+    products = (
+        Counter.objects.get(type="EBOUTIC")
+        .products.filter(product_type__isnull=False)
+        .filter(archived=False)
+        .filter(limit_age__lte=user.age)
+        .annotate(category=F("product_type__name"))
+    )
+    return [p for p in products if p.can_be_sold_to(user)]
 
 
 class Basket(models.Model):
@@ -46,7 +60,13 @@ class Basket(models.Model):
     )
     date = models.DateTimeField(_("date"), auto_now=True)
 
-    def add_product(self, p, q=1):
+    def add_product(self, p: Product, q: int = 1):
+        """
+        Given p an object of the Product model and q an integer,
+        add q items corresponding to this Product from the basket.
+
+        If this function is called with a product not in the basket, no error will be raised
+        """
         item = self.items.filter(product_id=p.id).first()
         if item is None:
             BasketItem(
@@ -61,25 +81,52 @@ class Basket(models.Model):
             item.quantity += q
             item.save()
 
-    def del_product(self, p, q=1):
-        item = self.items.filter(product_id=p.id).first()
-        if item is not None:
-            item.quantity -= q
-            item.save()
+    def del_product(self, p: Product, q: int = 1):
+        """
+        Given p an object of the Product model and q an integer,
+        remove q items corresponding to this Product from the basket.
+
+        If this function is called with a product not in the basket, no error will be raised
+        """
+        try:
+            item = self.items.get(product_id=p.id)
+        except BasketItem.DoesNotExist:
+            return
+        item.quantity -= q
+        item.save()
         if item.quantity <= 0:
             item.delete()
 
+    def clear(self) -> None:
+        """
+        Remove all items from this basket without deleting the basket
+        """
+        BasketItem.objects.filter(basket=self).delete()
+
     @cached_property
-    def contains_refilling_item(self):
+    def contains_refilling_item(self) -> bool:
         return self.items.filter(
             type_id=settings.SITH_COUNTER_PRODUCTTYPE_REFILLING
         ).exists()
 
-    def get_total(self):
-        total = 0
-        for i in self.items.all():
-            total += i.quantity * i.product_unit_price
-        return total
+    def get_total(self) -> float:
+        total = self.items.aggregate(
+            total=Sum(F("quantity") * F("product_unit_price"))
+        )["total"]
+        return float(total) if total is not None else 0
+
+    @classmethod
+    def from_session(cls, session) -> typing.Union["Basket", None]:
+        """
+        Given an HttpRequest django object, return the basket used in the current session
+        if it exists else create a new one and return it
+        """
+        if "basket_id" in session:
+            try:
+                return cls.objects.get(id=session["basket_id"])
+            except cls.DoesNotExist:
+                return None
+        return None
 
     def __str__(self):
         return "%s's basket (%d items)" % (self.user, self.items.all().count())
@@ -100,14 +147,11 @@ class Invoice(models.Model):
     date = models.DateTimeField(_("date"), auto_now=True)
     validated = models.BooleanField(_("validated"), default=False)
 
-    def __str__(self):
-        return "%s - %s - %s" % (self.user, self.get_total(), self.date)
-
-    def get_total(self):
-        total = 0
-        for i in self.items.all():
-            total += i.quantity * i.product_unit_price
-        return total
+    def get_total(self) -> float:
+        total = self.items.aggregate(
+            total=Sum(F("quantity") * F("product_unit_price"))
+        )["total"]
+        return float(total) if total is not None else 0
 
     def validate(self, *args, **kwargs):
         if self.validated:
@@ -153,13 +197,16 @@ class Invoice(models.Model):
         self.validated = True
         self.save()
 
+    def __str__(self):
+        return "%s - %s - %s" % (self.user, self.get_total(), self.date)
+
 
 class AbstractBaseItem(models.Model):
     product_id = models.IntegerField(_("product id"))
     product_name = models.CharField(_("product name"), max_length=255)
     type_id = models.IntegerField(_("product type id"))
     product_unit_price = CurrencyField(_("unit price"))
-    quantity = models.IntegerField(_("quantity"))
+    quantity = models.PositiveIntegerField(_("quantity"))
 
     class Meta:
         abstract = True
diff --git a/eboutic/templates/eboutic/eboutic_main.jinja b/eboutic/templates/eboutic/eboutic_main.jinja
index 38a212b1..0323967d 100644
--- a/eboutic/templates/eboutic/eboutic_main.jinja
+++ b/eboutic/templates/eboutic/eboutic_main.jinja
@@ -1,80 +1,110 @@
 {% extends "core/base.jinja" %}
 
 {% block title %}
-{% trans %}Eboutic{% endtrans %}
+    {% trans %}Eboutic{% endtrans %}
 {% endblock %}
 
-{% macro add_product(id, content, class="") %}
-<form method="post" action="{{ url('eboutic:main') }}" class="inline {{ class }}">
-    {% csrf_token %}
-    <input type="hidden" name="action" value="add_product">
-    <button type="submit" name="product_id" value="{{ id }}"> {{ content|safe }} </button>
-</form>
-{% endmacro %}
+{% block jquery_css %}
+    {#  Remove jquery css  #}
+{% endblock %}
 
-{% macro del_product(id, content) %}
-<form method="post" action="{{ url('eboutic:main') }}" class="inline" style="display:inline">
-    {% csrf_token %}
-    <input type="hidden" name="action" value="del_product">
-    <button type="submit" name="product_id" value="{{ id }}"> {{ content }} </button>
-</form>
-{% endmacro %}
+{% block additional_js %}
+    {# This script contains the code to perform requests to manipulate the
+    user basket without having to reload the page #}
+    <script src="{{ static('eboutic/js/eboutic.js') }}"></script>
+    <script src="{{ static('core/js/alpinejs.min.js') }}" defer></script>
+{% endblock %}
+
+{% block additional_css %}
+    <link rel="stylesheet" href="{{ static('eboutic/css/eboutic.css') }}">
+{% endblock %}
 
 {% block content %}
-<h3>{% trans %}Eboutic{% endtrans %}</h3>
-
-<div id="basket">
-    <p>{% trans %}Basket: {% endtrans %}</p>
-    <ul>
-        {% for i in basket.items.all()|sort(attribute='id') %}
-        <li>{{ del_product(i.product_id, '-') }} {{ i.quantity }}
-        {{ add_product(i.product_id, '+') }} {{ i.product_name }}: {{ "%0.2f"|format(i.product_unit_price*i.quantity) }} €</li>
-        {% endfor %}
-    </ul>
-    <p>
-        <strong>{% trans %}Basket amount: {% endtrans %}{{ "%0.2f"|format(basket.get_total()) }} €</strong>
-
-        {% if customer_amount != None %}
-            <br>
-            {% trans %}Current account amount: {% endtrans %}<strong>{{ "%0.2f"|format(customer_amount) }} €</strong>
-
-            {% if not basket.contains_refilling_item %}
-            <br>
-            {% trans %}Remaining account amount: {% endtrans %}<strong>{{ "%0.2f"|format(customer_amount - basket.get_total()) }} €</strong>
+    <h1 id="eboutic-title">{% trans %}Eboutic{% endtrans %}</h1>
+    <div id="eboutic" x-data="basket">
+        <div id="basket">
+            <h3>Panier</h3>
+            {% if errors %}
+                <div class="error-message">
+                    {% for error in errors %}
+                        <p>{{ error }}</p>
+                    {% endfor %}
+                {% trans %}Your basket has been cleaned accordingly to those errors.{% endtrans %}
+                </div>
             {% endif %}
-        {% endif %}
-    </p>
-
-    <form method="post" action="{{ url('eboutic:command') }}">
-        {% csrf_token %}
-        <p>
-        <input type="submit" value="{% trans %}Proceed to command{% endtrans %}" />
-        </p>
-    </form>
-</div>
-<div>
-    {% for t in categories %}
-    {% if eboutic.products.filter(product_type=t).exists() %}
-        <h5>{{ t }}</h5>
-        {% if t.comment %}
-        <p>{{ t.comment }}</p>
-        {% endif %}
-        <br />
-        {% for p in eboutic.products.filter(product_type=t).all() %}
-            {% set file = None %}
-            {% if p.icon %}
-                {% set file = p.icon.url %}
-            {% else %}
-                {% set file = static('core/img/na.gif') %}
-            {% endif %}
-            {% set prod = '<strong>%s</strong><hr><img src="%s" /><span>%s €</span>' % (p.name, file, p.selling_price) %}
-        {{ add_product(p.id, prod, "form_button") }}
-        {% endfor %}
-    {% endif %}
-    {% endfor %}
-</div>
-
+            <ul class="item-list">
+                {# Starting money #}
+                <li>
+                    <span class="item-name">
+                        <strong>{% trans %}Current account amount: {% endtrans %}</strong>
+                    </span>
+                    <span class="item-price">
+                        <strong>{{ "%0.2f"|format(customer_amount) }} €</strong>
+                    </span>
+                </li>
+                <template x-for="item in items" :key="item.id">
+                    <li class="item-row" x-show="item.quantity > 0">
+                        <span class="item-name" x-text="item.name"></span>
+                        <div class="item-quantity">
+                            <i class="fa fa-minus fa-xs" @click="remove(item.id)"></i>
+                            <span x-text="item.quantity"></span>
+                            <i class="fa fa-plus" @click="add(item)"></i>
+                        </div>
+                        <span class="item-price" x-text="(item.unit_price * item.quantity).toFixed(2) + ' €'"></span>
+                    </li>
+                </template>
+                {# Total price #}
+                <li style="margin-top: 20px">
+                    <span class="item-name"><strong>{% trans %}Basket amount: {% endtrans %}</strong></span>
+                    <span x-text="get_total().toFixed(2) + ' €'" class="item-price"></span>
+                </li>
+            </ul>
+            <div class="catalog-buttons">
+                <button @click="clear_basket()" class="clear">
+                    <i class="fa fa-trash"></i>
+                    {% trans %}Clear{% endtrans %}
+                </button>
+                <form method="post" action="{{ url('eboutic:command') }}">
+                    {% csrf_token %}
+                    <button class="validate">
+                        <i class="fa fa-check"></i>
+                        <input type="submit" value="{% trans %}Validate{% endtrans %}"/>
+                    </button>
+                </form>
+            </div>
+        </div>
+        <div id="catalog">
+            {% for category, items in products|groupby('category') %}
+                {% if items|count > 0 %}
+                    <section>
+                        {# I would have wholeheartedly directly used the header element instead
+                        but it has already been made messy in core/style.scss #}
+                        <div class="category-header">
+                            <h3>{{ category }}</h3>
+                            {% if category.comment %}
+                                <p>{{ category.comment }}</p>
+                            {% endif %}
+                        </div>
+                        <div class="product-group">
+                            {% for p in items %}
+                                <button class="product-button"
+                                        @click="add_from_catalog({{ p.id }}, '{{ p.name }}', {{ p.selling_price }})">
+                                    {% if p.icon %}
+                                        <img src="{{ p.icon.url }}" alt="image de {{ p.product_name }}" width="40px"
+                                             height="40px">
+                                    {% else %}
+                                        <i class="fa fa-2x fa-picture-o"></i>
+                                    {% endif %}
+                                    <p><strong>{{ p.name }}</strong></p>
+                                    <p>{{ p.selling_price }} €</p>
+                                </button>
+                            {% endfor %}
+                        </div>
+                    </section>
+                {% endif %}
+                {% else %}
+                <p>{% trans %}There are no items available for sale{% endtrans %}</p>
+            {% endfor %}
+        </div>
+    </div>
 {% endblock %}
-
-
-
diff --git a/eboutic/templates/eboutic/eboutic_makecommand.jinja b/eboutic/templates/eboutic/eboutic_makecommand.jinja
index aab34d46..837c1295 100644
--- a/eboutic/templates/eboutic/eboutic_makecommand.jinja
+++ b/eboutic/templates/eboutic/eboutic_makecommand.jinja
@@ -37,7 +37,8 @@
 
             {% if not basket.contains_refilling_item %}
             <br>
-            {% trans %}Remaining account amount: {% endtrans %}<strong>{{ "%0.2f"|format(customer_amount - basket.get_total()) }} €</strong>
+            {% trans %}Remaining account amount: {% endtrans %}
+                <strong>{{ "%0.2f"|format(customer_amount|float - basket.get_total()) }} €</strong>
             {% endif %}
         {% endif %}
     </p>
@@ -61,7 +62,6 @@
     </form>
     {% endif %}
 </div>
-
 {% endblock %}
 
 
diff --git a/eboutic/templates/eboutic/eboutic_payment_result.jinja b/eboutic/templates/eboutic/eboutic_payment_result.jinja
index d78e01a3..39d9277a 100644
--- a/eboutic/templates/eboutic/eboutic_payment_result.jinja
+++ b/eboutic/templates/eboutic/eboutic_payment_result.jinja
@@ -4,14 +4,16 @@
 <h3>{% trans %}Eboutic{% endtrans %}</h3>
 
 <div>
-    {% if not_enough %}
-    {% trans %}Payment failed{% endtrans %}
-    {% else %}
+    {% if success %}
     {% trans %}Payment successful{% endtrans %}
+    {% else %}
+    {% trans %}Payment failed{% endtrans %}
     {% endif %}
     <p><a href="{{ url('eboutic:main') }}">{% trans %}Return to eboutic{% endtrans %}</a></p>
 </div>
 
+
+
 {% endblock %}
 
 
diff --git a/eboutic/tests.py b/eboutic/tests.py
index 6435f49b..98b73014 100644
--- a/eboutic/tests.py
+++ b/eboutic/tests.py
@@ -2,6 +2,7 @@
 #
 # Copyright 2016,2017
 # - Skia <skia@libskia.so>
+# - Maréchal <thgirod@hotmail.com
 #
 # Ce fichier fait partie du site de l'Association des Étudiants de l'UTBM,
 # http://ae.utbm.fr.
@@ -21,20 +22,21 @@
 # Place - Suite 330, Boston, MA 02111-1307, USA.
 #
 #
-from datetime import datetime
-
-import re
 import base64
+import json
+import re
 import urllib
-from OpenSSL import crypto
 
+from OpenSSL import crypto
+from django.conf import settings
+from django.core.management import call_command
+from django.db.models import Max
 from django.test import TestCase
 from django.urls import reverse
-from django.core.management import call_command
-from django.conf import settings
 
 from core.models import User
-from counter.models import Product, Counter, Refilling
+from counter.models import Product, Counter, Customer, Selling
+from eboutic.models import Basket
 
 
 class EbouticTest(TestCase):
@@ -49,6 +51,19 @@ class EbouticTest(TestCase):
         self.cotis = Product.objects.filter(code="1SCOTIZ").first()
         self.eboutic = Counter.objects.filter(name="Eboutic").first()
 
+    def get_busy_basket(self, user):
+        """
+        Create and return a basket with 3 barbar and 1 cotis in it.
+        Edit the client session to store the basket id in it
+        """
+        session = self.client.session
+        basket = Basket.objects.create(user=user)
+        session["basket_id"] = basket.id
+        session.save()
+        basket.add_product(self.barbar, 3)
+        basket.add_product(self.cotis)
+        return basket
+
     def generate_bank_valid_answer_from_page_content(self, content):
         content = str(content)
         basket_id = re.search(r"PBX_CMD\" value=\"(\d*)\"", content).group(1)
@@ -69,177 +84,99 @@ class EbouticTest(TestCase):
         response = self.client.get(url)
         return response
 
-    def test_buy_simple_product_with_sith_account(self):
+    def test_buy_with_sith_account(self):
         self.client.login(username="subscriber", password="plop")
-        Refilling(
-            amount=10,
-            counter=self.eboutic,
-            operator=self.skia,
-            customer=self.subscriber.customer,
-        ).save()
-        response = self.client.post(
-            reverse("eboutic:main"),
-            {"action": "add_product", "product_id": self.barbar.id},
-        )
-        self.assertTrue(
-            '<input type="hidden" name="action" value="add_product">\\n'
-            '    <button type="submit" name="product_id" value="4"> + </button>\\n'
-            "</form>\\n Barbar: 1.70 \\xe2\\x82\\xac</li>" in str(response.content)
-        )
-        response = self.client.post(reverse("eboutic:command"))
-        self.assertTrue(
-            "<tr>\\n                <td>Barbar</td>\\n                <td>1</td>\\n"
-            "                <td>1.70 \\xe2\\x82\\xac</td>\\n            </tr>"
-            in str(response.content)
-        )
-        response = self.client.post(
-            reverse("eboutic:pay_with_sith"), {"action": "pay_with_sith_account"}
-        )
-        self.assertTrue(
-            "Le paiement a \\xc3\\xa9t\\xc3\\xa9 effectu\\xc3\\xa9\\n"
-            in str(response.content)
-        )
-        response = self.client.get(
-            reverse(
-                "core:user_account_detail",
-                kwargs={
-                    "user_id": self.subscriber.id,
-                    "year": datetime.now().year,
-                    "month": datetime.now().month,
-                },
-            )
-        )
-        self.assertTrue(
-            'class="selected_tab">Compte (8.30 \\xe2\\x82\\xac)</a>'
-            in str(response.content)
-        )
-        self.assertTrue(
-            '<td>Eboutic</td>\\n        <td><a href="/user/3/">Subscribed User</a></td>\\n'
-            "        <td>Barbar</td>\\n        <td>1</td>\\n        <td>1.70 \\xe2\\x82\\xac</td>\\n"
-            "        <td>Compte utilisateur</td>" in str(response.content)
+        self.subscriber.customer.amount = 100  # give money before test
+        self.subscriber.customer.save()
+        basket = self.get_busy_basket(self.subscriber)
+        amount = basket.get_total()
+        response = self.client.post(reverse("eboutic:pay_with_sith"))
+        self.assertRedirects(response, "/eboutic/pay/success/")
+        new_balance = Customer.objects.get(user=self.subscriber).amount
+        self.assertEqual(float(new_balance), 100 - amount)
+        self.assertEqual(
+            'basket_items=""; expires=Thu, 01 Jan 1970 00:00:00 GMT; Max-Age=0; Path=/eboutic',
+            self.client.cookies["basket_items"].OutputString(),
         )
 
-    def test_buy_simple_product_with_credit_card(self):
+    def test_buy_with_sith_account_no_money(self):
         self.client.login(username="subscriber", password="plop")
-        response = self.client.post(
-            reverse("eboutic:main"),
-            {"action": "add_product", "product_id": self.barbar.id},
-        )
-        self.assertTrue(
-            '<input type="hidden" name="action" value="add_product">\\n'
-            '    <button type="submit" name="product_id" value="4"> + </button>\\n'
-            "</form>\\n Barbar: 1.70 \\xe2\\x82\\xac</li>" in str(response.content)
-        )
-        response = self.client.post(reverse("eboutic:command"))
-        self.assertTrue(
-            "<tr>\\n                <td>Barbar</td>\\n                <td>1</td>\\n"
-            "                <td>1.70 \\xe2\\x82\\xac</td>\\n            </tr>"
-            in str(response.content)
-        )
+        basket = self.get_busy_basket(self.subscriber)
+        initial = basket.get_total() - 1
+        self.subscriber.customer.amount = initial
+        self.subscriber.customer.save()
+        response = self.client.post(reverse("eboutic:pay_with_sith"))
+        self.assertRedirects(response, "/eboutic/pay/failure/")
+        new_balance = Customer.objects.get(user=self.subscriber).amount
+        self.assertEqual(float(new_balance), initial)
+        self.assertEqual(
+            'basket_items=""; expires=Thu, 01 Jan 1970 00:00:00 GMT; Max-Age=0; Path=/eboutic',
+            self.client.cookies["basket_items"].OutputString(),
+        )  # this cookie should be removed after payment
 
-        response = self.generate_bank_valid_answer_from_page_content(response.content)
-        self.assertTrue(response.status_code == 200)
-        self.assertTrue(response.content.decode("utf-8") == "")
-
-        response = self.client.get(
-            reverse(
-                "core:user_account_detail",
-                kwargs={
-                    "user_id": self.subscriber.id,
-                    "year": datetime.now().year,
-                    "month": datetime.now().month,
-                },
-            )
-        )
-        self.assertTrue(
-            'class="selected_tab">Compte (0.00 \\xe2\\x82\\xac)</a>'
-            in str(response.content)
-        )
-        self.assertTrue(
-            '<td>Eboutic</td>\\n        <td><a href="/user/3/">Subscribed User</a></td>\\n'
-            "        <td>Barbar</td>\\n        <td>1</td>\\n        <td>1.70 \\xe2\\x82\\xac</td>\\n"
-            "        <td>Carte bancaire</td>" in str(response.content)
-        )
-
-    def test_alter_basket_with_credit_card(self):
+    def test_submit_basket(self):
         self.client.login(username="subscriber", password="plop")
-        response = self.client.post(
-            reverse("eboutic:main"),
-            {"action": "add_product", "product_id": self.barbar.id},
-        )
-        self.assertTrue(
-            '<input type="hidden" name="action" value="add_product">\\n'
-            '    <button type="submit" name="product_id" value="4"> + </button>\\n'
-            "</form>\\n Barbar: 1.70 \\xe2\\x82\\xac</li>" in str(response.content)
-        )
+        self.client.cookies[
+            "basket_items"
+        ] = """[
+            {"id": 2, "name": "Cotis 2 semestres", "quantity": 1, "unit_price": 28},
+            {"id": 4, "name": "Barbar", "quantity": 3, "unit_price": 1.7}
+        ]"""
         response = self.client.post(reverse("eboutic:command"))
-        self.assertTrue(
-            "<tr>\\n                <td>Barbar</td>\\n                <td>1</td>\\n"
-            "                <td>1.70 \\xe2\\x82\\xac</td>\\n            </tr>"
-            in str(response.content)
+        self.assertEqual(response.status_code, 200)
+        self.assertInHTML(
+            "<tr><td>Cotis 2 semestres</td><td>1</td><td>28.00 €</td></tr>",
+            response.content.decode(),
         )
+        self.assertInHTML(
+            "<tr><td>Barbar</td><td>3</td><td>1.70 €</td></tr>",
+            response.content.decode(),
+        )
+        self.assertIn("basket_id", self.client.session)
+        basket = Basket.objects.get(id=self.client.session["basket_id"])
+        self.assertEqual(basket.items.count(), 2)
+        barbar = basket.items.filter(product_name="Barbar").first()
+        self.assertIsNotNone(barbar)
+        self.assertEqual(barbar.quantity, 3)
+        cotis = basket.items.filter(product_name="Cotis 2 semestres").first()
+        self.assertIsNotNone(cotis)
+        self.assertEqual(cotis.quantity, 1)
+        self.assertEqual(basket.get_total(), 3 * 1.7 + 28)
 
-        response_altered = self.client.post(
-            reverse("eboutic:main"),
-            {"action": "add_product", "product_id": self.barbar.id},
-        )
-        self.assertTrue(
-            '<input type="hidden" name="action" value="add_product">\\n'
-            '    <button type="submit" name="product_id" value="4"> + </button>\\n'
-            "</form>\\n Barbar: 3.40 \\xe2\\x82\\xac</li>"
-            in str(response_altered.content)
-        )
+    def test_submit_empty_basket(self):
+        self.client.login(username="subscriber", password="plop")
+        self.client.cookies["basket_items"] = "[]"
+        response = self.client.post(reverse("eboutic:command"))
+        self.assertRedirects(response, "/eboutic/")
 
-        response = self.generate_bank_valid_answer_from_page_content(response.content)
-        self.assertEqual(response.status_code, 500)
+    def test_submit_invalid_basket(self):
+        self.client.login(username="subscriber", password="plop")
+        max_id = Product.objects.aggregate(res=Max("id"))["res"]
+        self.client.cookies[
+            "basket_items"
+        ] = f"""[
+            {{"id": {max_id + 1}, "name": "", "quantity": 1, "unit_price": 28}}
+        ]"""
+        response = self.client.post(reverse("eboutic:command"))
         self.assertIn(
-            "Basket processing failed with error: SuspiciousOperation('Basket total and amount do not match'",
-            response.content.decode("utf-8"),
+            'basket_items=""',
+            self.client.cookies["basket_items"].OutputString(),
         )
+        self.assertIn(
+            "Path=/eboutic",
+            self.client.cookies["basket_items"].OutputString(),
+        )
+        self.assertRedirects(response, "/eboutic/")
 
-    def test_buy_refill_product_with_credit_card(self):
+    def test_submit_basket_illegal_quantity(self):
         self.client.login(username="subscriber", password="plop")
-        response = self.client.post(
-            reverse("eboutic:main"),
-            {"action": "add_product", "product_id": self.refill.id},
-        )
-        self.assertTrue(
-            '<input type="hidden" name="action" value="add_product">\\n'
-            '    <button type="submit" name="product_id" value="3"> + </button>\\n'
-            "</form>\\n Rechargement 15 \\xe2\\x82\\xac: 15.00 \\xe2\\x82\\xac</li>"
-            in str(response.content)
-        )
+        self.client.cookies[
+            "basket_items"
+        ] = """[
+            {"id": 4, "name": "Barbar", "quantity": -1, "unit_price": 1.7}
+        ]"""
         response = self.client.post(reverse("eboutic:command"))
-        self.assertTrue(
-            "<tr>\\n                <td>Rechargement 15 \\xe2\\x82\\xac</td>\\n                <td>1</td>\\n"
-            "                <td>15.00 \\xe2\\x82\\xac</td>\\n            </tr>"
-            in str(response.content)
-        )
-
-        response = self.generate_bank_valid_answer_from_page_content(response.content)
-        self.assertTrue(response.status_code == 200)
-        self.assertTrue(response.content.decode("utf-8") == "")
-
-        response = self.client.get(
-            reverse(
-                "core:user_account_detail",
-                kwargs={
-                    "user_id": self.subscriber.id,
-                    "year": datetime.now().year,
-                    "month": datetime.now().month,
-                },
-            )
-        )
-        self.assertTrue(
-            'class="selected_tab">Compte (15.00 \\xe2\\x82\\xac)</a>'
-            in str(response.content)
-        )
-        self.assertTrue(
-            "<td>\\n            <ul>\\n                \\n                "
-            "<li>1 x Rechargement 15 \\xe2\\x82\\xac - 15.00 \\xe2\\x82\\xac</li>\\n"
-            "                \\n            </ul>\\n        </td>\\n"
-            "        <td>15.00 \\xe2\\x82\\xac</td>" in str(response.content)
-        )
+        self.assertRedirects(response, "/eboutic/")
 
     def test_buy_subscribe_product_with_credit_card(self):
         self.client.login(username="old_subscriber", password="plop")
@@ -247,48 +184,81 @@ class EbouticTest(TestCase):
             reverse("core:user_profile", kwargs={"user_id": self.old_subscriber.id})
         )
         self.assertTrue("Non cotisant" in str(response.content))
-        response = self.client.post(
-            reverse("eboutic:main"),
-            {"action": "add_product", "product_id": self.cotis.id},
-        )
-        self.assertTrue(
-            '<input type="hidden" name="action" value="add_product">\\n'
-            '    <button type="submit" name="product_id" value="1"> + </button>\\n'
-            "</form>\\n Cotis 1 semestre: 15.00 \\xe2\\x82\\xac</li>"
-            in str(response.content)
-        )
+        self.client.cookies[
+            "basket_items"
+        ] = """[
+            {"id": 2, "name": "Cotis 2 semestres", "quantity": 1, "unit_price": 28}
+        ]"""
         response = self.client.post(reverse("eboutic:command"))
-        self.assertTrue(
-            "<tr>\\n                <td>Cotis 1 semestre</td>\\n                <td>1</td>\\n"
-            "                <td>15.00 \\xe2\\x82\\xac</td>\\n            </tr>"
-            in str(response.content)
+        self.assertInHTML(
+            "<tr><td>Cotis 2 semestres</td><td>1</td><td>28.00 €</td></tr>",
+            response.content.decode(),
         )
+        basket = Basket.objects.get(id=self.client.session["basket_id"])
+        self.assertEqual(basket.items.count(), 1)
+        response = self.generate_bank_valid_answer_from_page_content(response.content)
+        self.assertTrue(response.status_code == 200)
+        self.assertTrue(response.content.decode("utf-8") == "Payment successful")
+
+        subscriber = User.objects.get(id=self.old_subscriber.id)
+        self.assertEqual(subscriber.subscriptions.count(), 2)
+        sub = subscriber.subscriptions.order_by("-subscription_end").first()
+        self.assertTrue(sub.is_valid_now())
+        self.assertEqual(sub.member, subscriber)
+        self.assertEqual(sub.subscription_type, "deux-semestres")
+        self.assertEqual(sub.location, "EBOUTIC")
+
+    def test_buy_refill_product_with_credit_card(self):
+        self.client.login(username="subscriber", password="plop")
+        # basket contains 1 refill item worth 15€
+        self.client.cookies["basket_items"] = json.dumps(
+            [{"id": 3, "name": "Rechargement 15 €", "quantity": 1, "unit_price": 15}]
+        )
+        initial_balance = self.subscriber.customer.amount
+        response = self.client.post(reverse("eboutic:command"))
 
         response = self.generate_bank_valid_answer_from_page_content(response.content)
         self.assertTrue(response.status_code == 200)
-        self.assertTrue(response.content.decode("utf-8") == "")
+        self.assertTrue(response.content.decode() == "Payment successful")
+        new_balance = Customer.objects.get(user=self.subscriber).amount
+        self.assertEqual(new_balance, initial_balance + 15)
 
-        response = self.client.get(
-            reverse(
-                "core:user_account_detail",
-                kwargs={
-                    "user_id": self.old_subscriber.id,
-                    "year": datetime.now().year,
-                    "month": datetime.now().month,
-                },
-            )
+    def test_alter_basket_after_submission(self):
+        self.client.login(username="subscriber", password="plop")
+        self.client.cookies["basket_items"] = json.dumps(
+            [{"id": 4, "name": "Barbar", "quantity": 1, "unit_price": 1.7}]
         )
-        self.assertTrue(
-            'class="selected_tab">Compte (0.00 \\xe2\\x82\\xac)</a>'
-            in str(response.content)
+        response = self.client.post(reverse("eboutic:command"))
+        self.client.cookies["basket_items"] = json.dumps(
+            [  # alter basket
+                {"id": 4, "name": "Barbar", "quantity": 3, "unit_price": 1.7}
+            ]
         )
-        self.assertTrue(
-            "<td>\\n            <ul>\\n                \\n                "
-            "<li>1 x Cotis 1 semestre - 15.00 \\xe2\\x82\\xac</li>\\n"
-            "                \\n            </ul>\\n        </td>\\n"
-            "        <td>15.00 \\xe2\\x82\\xac</td>" in str(response.content)
+        self.client.post(reverse("eboutic:command"))
+        response = self.generate_bank_valid_answer_from_page_content(response.content)
+        self.assertEqual(response.status_code, 500)
+        self.assertIn(
+            "Basket processing failed with error: SuspiciousOperation('Basket total and amount do not match'",
+            response.content.decode("utf-8"),
         )
-        response = self.client.get(
-            reverse("core:user_profile", kwargs={"user_id": self.old_subscriber.id})
+
+    def test_buy_simple_product_with_credit_card(self):
+        self.client.login(username="subscriber", password="plop")
+        self.client.cookies["basket_items"] = json.dumps(
+            [{"id": 4, "name": "Barbar", "quantity": 1, "unit_price": 1.7}]
         )
-        self.assertTrue("Cotisant jusqu\\'au" in str(response.content))
+        response = self.client.post(reverse("eboutic:command"))
+        response = self.generate_bank_valid_answer_from_page_content(response.content)
+        self.assertTrue(response.status_code == 200)
+        self.assertTrue(response.content.decode("utf-8") == "Payment successful")
+
+        selling = (
+            Selling.objects.filter(customer=self.subscriber.customer)
+            .order_by("-date")
+            .first()
+        )
+        self.assertEqual(selling.payment_method, "CARD")
+        self.assertEqual(selling.quantity, 1)
+        self.assertEqual(selling.unit_price, self.barbar.selling_price)
+        self.assertEqual(selling.counter.type, "EBOUTIC")
+        self.assertEqual(selling.product, self.barbar)
diff --git a/eboutic/urls.py b/eboutic/urls.py
index a072efb4..f1d882e7 100644
--- a/eboutic/urls.py
+++ b/eboutic/urls.py
@@ -1,7 +1,8 @@
 # -*- coding:utf-8 -*
 #
-# Copyright 2016,2017
+# Copyright 2016,2017, 2022
 # - Skia <skia@libskia.so>
+# - Maréchal <thgirod@hotmail.com>
 #
 # Ce fichier fait partie du site de l'Association des Étudiants de l'UTBM,
 # http://ae.utbm.fr.
@@ -22,17 +23,21 @@
 #
 #
 
-from django.urls import re_path
+from django.urls import path, register_converter
 
 from eboutic.views import *
+from eboutic.converters import PaymentResultConverter
+
+register_converter(PaymentResultConverter, "res")
 
 urlpatterns = [
     # Subscription views
-    re_path(r"^$", EbouticMain.as_view(), name="main"),
-    re_path(r"^command$", EbouticCommand.as_view(), name="command"),
-    re_path(r"^pay$", EbouticPayWithSith.as_view(), name="pay_with_sith"),
-    re_path(
-        r"^et_autoanswer$",
+    path("", eboutic_main, name="main"),
+    path("command/", EbouticCommand.as_view(), name="command"),
+    path("pay/", pay_with_sith, name="pay_with_sith"),
+    path("pay/<res:result>/", payment_result, name="payment_result"),
+    path(
+        "et_autoanswer/",
         EtransactionAutoAnswer.as_view(),
         name="etransation_autoanswer",
     ),
diff --git a/eboutic/views.py b/eboutic/views.py
index 3f2ef6cb..b478397a 100644
--- a/eboutic/views.py
+++ b/eboutic/views.py
@@ -22,134 +22,99 @@
 #
 #
 
+import base64
+import hmac
+import json
 from collections import OrderedDict
 from datetime import datetime
-import hmac
-import base64
+import sentry_sdk
+
+
 from OpenSSL import crypto
-
-from django.urls import reverse_lazy
-from django.views.generic import TemplateView, View
-from django.http import HttpResponse, HttpResponseRedirect
-from django.core.exceptions import SuspiciousOperation
-from django.db import transaction, DataError
-from django.utils.translation import gettext as _
 from django.conf import settings
+from django.contrib.auth.decorators import login_required
+from django.core.exceptions import SuspiciousOperation
+from django.db import transaction, DatabaseError
+from django.http import HttpResponse, HttpRequest
+from django.shortcuts import render, redirect
+from django.utils.decorators import method_decorator
+from django.views.decorators.http import require_GET, require_POST
+from django.views.generic import TemplateView, View
 
-from counter.models import Customer, Counter, ProductType, Selling
-from eboutic.models import Basket, Invoice, InvoiceItem
+from counter.models import Customer, Counter, Selling
+from eboutic.forms import BasketForm
+from eboutic.models import Basket, Invoice, InvoiceItem, get_eboutic_products
 
 
-class EbouticMain(TemplateView):
-    template_name = "eboutic/eboutic_main.jinja"
+@login_required
+@require_GET
+def eboutic_main(request: HttpRequest) -> HttpResponse:
+    """
+    Main view of the eboutic application.
+    Return an Http response whose content is of type text/html.
+    The latter represents the page from which a user can see
+    the catalogue of products that he can buy and fill
+    his shopping cart.
 
-    def make_basket(self, request):
-        if "basket_id" not in request.session.keys():  # Init the basket session entry
-            self.basket = Basket(user=request.user)
-            self.basket.save()
-        else:
-            self.basket = Basket.objects.filter(id=request.session["basket_id"]).first()
-            if self.basket is None:
-                self.basket = Basket(user=request.user)
-                self.basket.save()
-        request.session["basket_id"] = self.basket.id
-        request.session.modified = True
+    The purchasable products are those of the eboutic which
+    belong to a category of products of a product category
+    (orphan products are inaccessible).
 
-    def get(self, request, *args, **kwargs):
-        if not request.user.is_authenticated:
-            return HttpResponseRedirect(
-                reverse_lazy("core:login", args=self.args, kwargs=kwargs)
-                + "?next="
-                + request.path
-            )
-        self.object = Counter.objects.filter(type="EBOUTIC").first()
-        self.make_basket(request)
-        return super(EbouticMain, self).get(request, *args, **kwargs)
+    If the session contains a key-value pair that associates "errors"
+    with a list of strings, this pair is removed from the session
+    and its value displayed to the user when the page is rendered.
+    """
+    errors = request.session.pop("errors", None)
+    products = get_eboutic_products(request.user)
+    context = {
+        "errors": errors,
+        "products": products,
+        "customer_amount": request.user.account_balance,
+    }
+    return render(request, "eboutic/eboutic_main.jinja", context)
 
-    def post(self, request, *args, **kwargs):
-        if not request.user.is_authenticated:
-            return HttpResponseRedirect(
-                reverse_lazy("core:login", args=self.args, kwargs=kwargs)
-                + "?next="
-                + request.path
-            )
-        self.object = Counter.objects.filter(type="EBOUTIC").first()
-        self.make_basket(request)
-        if "add_product" in request.POST["action"]:
-            self.add_product(request)
-        elif "del_product" in request.POST["action"]:
-            self.del_product(request)
-        return self.render_to_response(self.get_context_data(**kwargs))
 
-    def add_product(self, request):
-        """Add a product to the basket"""
-        try:
-            p = self.object.products.filter(id=int(request.POST["product_id"])).first()
-            if not p.buying_groups.exists():
-                self.basket.add_product(p)
-            for g in p.buying_groups.all():
-                if request.user.is_in_group(g.name):
-                    self.basket.add_product(p)
-                    break
-        except:
-            pass
-
-    def del_product(self, request):
-        """Delete a product from the basket"""
-        try:
-            p = self.object.products.filter(id=int(request.POST["product_id"])).first()
-            self.basket.del_product(p)
-        except:
-            pass
-
-    def get_context_data(self, **kwargs):
-        kwargs = super(EbouticMain, self).get_context_data(**kwargs)
-        kwargs["basket"] = self.basket
-        kwargs["eboutic"] = Counter.objects.filter(type="EBOUTIC").first()
-        kwargs["categories"] = ProductType.objects.all()
-        if hasattr(self.request.user, "customer"):
-            kwargs["customer_amount"] = self.request.user.customer.amount
-        else:
-            kwargs["customer_amount"] = None
-        if not self.request.user.was_subscribed:
-            kwargs["categories"] = kwargs["categories"].exclude(
-                id=settings.SITH_PRODUCTTYPE_SUBSCRIPTION
-            )
-        return kwargs
+@require_GET
+@login_required
+def payment_result(request, result: str) -> HttpResponse:
+    context = {"success": result == "success"}
+    return render(request, "eboutic/eboutic_payment_result.jinja", context)
 
 
 class EbouticCommand(TemplateView):
     template_name = "eboutic/eboutic_makecommand.jinja"
 
+    @method_decorator(login_required)
     def get(self, request, *args, **kwargs):
-        if not request.user.is_authenticated:
-            return HttpResponseRedirect(
-                reverse_lazy("core:login", args=self.args, kwargs=kwargs)
-                + "?next="
-                + request.path
-            )
-        return HttpResponseRedirect(
-            reverse_lazy("eboutic:main", args=self.args, kwargs=kwargs)
-        )
+        return redirect("eboutic:main")
 
-    def post(self, request, *args, **kwargs):
-        if not request.user.is_authenticated:
-            return HttpResponseRedirect(
-                reverse_lazy("core:login", args=self.args, kwargs=kwargs)
-                + "?next="
-                + request.path
-            )
-        if "basket_id" not in request.session.keys():
-            return HttpResponseRedirect(
-                reverse_lazy("eboutic:main", args=self.args, kwargs=kwargs)
-            )
-        self.basket = Basket.objects.filter(id=request.session["basket_id"]).first()
-        if self.basket is None:
-            return HttpResponseRedirect(
-                reverse_lazy("eboutic:main", args=self.args, kwargs=kwargs)
+    @method_decorator(login_required)
+    def post(self, request: HttpRequest, *args, **kwargs):
+        form = BasketForm(request)
+        if not form.is_valid():
+            request.session["errors"] = form.get_error_messages()
+            request.session.modified = True
+            res = redirect("eboutic:main")
+            res.set_cookie("basket_items", form.get_cleaned_cookie(), path="/eboutic")
+            return res
+
+        if "basket_id" in request.session:
+            basket, _ = Basket.objects.get_or_create(
+                id=request.session["basket_id"], user=request.user
             )
+            basket.clear()
         else:
-            kwargs["basket"] = self.basket
+            basket = Basket.objects.create(user=request.user)
+
+        basket.save()
+        eboutique = Counter.objects.get(type="EBOUTIC")
+        for item in json.loads(request.COOKIES["basket_items"]):
+            basket.add_product(
+                eboutique.products.get(id=(item["id"])), item["quantity"]
+            )
+        request.session["basket_id"] = basket.id
+        request.session.modified = True
+        kwargs["basket"] = basket
         return self.render_to_response(self.get_context_data(**kwargs))
 
     def get_context_data(self, **kwargs):
@@ -162,12 +127,12 @@ class EbouticCommand(TemplateView):
         kwargs["et_request"]["PBX_SITE"] = settings.SITH_EBOUTIC_PBX_SITE
         kwargs["et_request"]["PBX_RANG"] = settings.SITH_EBOUTIC_PBX_RANG
         kwargs["et_request"]["PBX_IDENTIFIANT"] = settings.SITH_EBOUTIC_PBX_IDENTIFIANT
-        kwargs["et_request"]["PBX_TOTAL"] = int(self.basket.get_total() * 100)
+        kwargs["et_request"]["PBX_TOTAL"] = int(kwargs["basket"].get_total() * 100)
         kwargs["et_request"][
             "PBX_DEVISE"
         ] = 978  # This is Euro. ET support only this value anyway
-        kwargs["et_request"]["PBX_CMD"] = self.basket.id
-        kwargs["et_request"]["PBX_PORTEUR"] = self.basket.user.email
+        kwargs["et_request"]["PBX_CMD"] = kwargs["basket"].id
+        kwargs["et_request"]["PBX_PORTEUR"] = kwargs["basket"].user.email
         kwargs["et_request"]["PBX_RETOUR"] = "Amount:M;BasketID:R;Auto:A;Error:E;Sig:K"
         kwargs["et_request"]["PBX_HASH"] = "SHA512"
         kwargs["et_request"]["PBX_TYPEPAIEMENT"] = "CARTE"
@@ -192,62 +157,53 @@ class EbouticCommand(TemplateView):
         return kwargs
 
 
-class EbouticPayWithSith(TemplateView):
-    template_name = "eboutic/eboutic_payment_result.jinja"
-
-    def post(self, request, *args, **kwargs):
+@login_required
+@require_POST
+def pay_with_sith(request):
+    basket = Basket.from_session(request.session)
+    refilling = settings.SITH_COUNTER_PRODUCTTYPE_REFILLING
+    if basket is None or basket.items.filter(type_id=refilling).exists():
+        return redirect("eboutic:main")
+    c = Customer.objects.filter(user__id=basket.user.id).first()
+    if c is None:
+        return redirect("eboutic:main")
+    if c.amount < basket.get_total():
+        res = redirect("eboutic:payment_result", "failure")
+    else:
+        eboutic = Counter.objects.filter(type="EBOUTIC").first()
         try:
             with transaction.atomic():
-                if (
-                    "basket_id" not in request.session.keys()
-                    or not request.user.is_authenticated
-                ):
-                    return HttpResponseRedirect(
-                        reverse_lazy("eboutic:main", args=self.args, kwargs=kwargs)
-                    )
-                b = Basket.objects.filter(id=request.session["basket_id"]).first()
-                if (
-                    b is None
-                    or b.items.filter(
-                        type_id=settings.SITH_COUNTER_PRODUCTTYPE_REFILLING
-                    ).exists()
-                ):
-                    return HttpResponseRedirect(
-                        reverse_lazy("eboutic:main", args=self.args, kwargs=kwargs)
-                    )
-                c = Customer.objects.filter(user__id=b.user.id).first()
-                if c is None:
-                    return HttpResponseRedirect(
-                        reverse_lazy("eboutic:main", args=self.args, kwargs=kwargs)
-                    )
-                kwargs["not_enough"] = True
-                if c.amount < b.get_total():
-                    raise DataError(_("You do not have enough money to buy the basket"))
-                else:
-                    eboutic = Counter.objects.filter(type="EBOUTIC").first()
-                    for it in b.items.all():
-                        product = eboutic.products.filter(id=it.product_id).first()
-                        Selling(
-                            label=it.product_name,
-                            counter=eboutic,
-                            club=product.club,
-                            product=product,
-                            seller=c.user,
-                            customer=c,
-                            unit_price=it.product_unit_price,
-                            quantity=it.quantity,
-                            payment_method="SITH_ACCOUNT",
-                        ).save()
-                    b.delete()
-                    kwargs["not_enough"] = False
-                    request.session.pop("basket_id", None)
-        except DataError as e:
-            kwargs["not_enough"] = True
-        return self.render_to_response(self.get_context_data(**kwargs))
+                for it in basket.items.all():
+                    product = eboutic.products.get(id=it.product_id)
+                    Selling(
+                        label=it.product_name,
+                        counter=eboutic,
+                        club=product.club,
+                        product=product,
+                        seller=c.user,
+                        customer=c,
+                        unit_price=it.product_unit_price,
+                        quantity=it.quantity,
+                        payment_method="SITH_ACCOUNT",
+                    ).save()
+                basket.delete()
+                request.session.pop("basket_id", None)
+                res = redirect("eboutic:payment_result", "success")
+        except DatabaseError as e:
+            with sentry_sdk.push_scope() as scope:
+                scope.user = {"username": request.user.username}
+                scope.set_extra("someVariable", e.__repr__())
+                sentry_sdk.capture_message(
+                    f"Erreur le {datetime.now()} dans eboutic.pay_with_sith"
+                )
+            res = redirect("eboutic:payment_result", "failure")
+    res.delete_cookie("basket_items", "/eboutic")
+    return res
 
 
 class EtransactionAutoAnswer(View):
-    # Response documentation http://www1.paybox.com/espace-integrateur-documentation/la-solution-paybox-system/gestion-de-la-reponse/
+    # Response documentation http://www1.paybox.com/espace-integrateur-documentation
+    # /la-solution-paybox-system/gestion-de-la-reponse/
     def get(self, request, *args, **kwargs):
         if (
             not "Amount" in request.GET.keys()
@@ -305,7 +261,7 @@ class EtransactionAutoAnswer(View):
                 return HttpResponse(
                     "Basket processing failed with error: " + repr(e), status=500
                 )
-            return HttpResponse()
+            return HttpResponse("Payment successful", status=200)
         else:
             return HttpResponse(
                 "Payment failed with error: " + request.GET["Error"], status=202
diff --git a/locale/fr/LC_MESSAGES/django.po b/locale/fr/LC_MESSAGES/django.po
index 9881cb3c..aeb2777a 100644
--- a/locale/fr/LC_MESSAGES/django.po
+++ b/locale/fr/LC_MESSAGES/django.po
@@ -6,7 +6,7 @@
 msgid ""
 msgstr ""
 "Report-Msgid-Bugs-To: \n"
-"POT-Creation-Date: 2022-08-07 16:44+0200\n"
+"POT-Creation-Date: 2022-10-10 18:47+0200\n"
 "PO-Revision-Date: 2016-07-18\n"
 "Last-Translator: Skia <skia@libskia.so>\n"
 "Language-Team: AE info <ae.info@utbm.fr>\n"
@@ -18,8 +18,8 @@ msgstr ""
 
 #: accounting/models.py:61 accounting/models.py:110 accounting/models.py:143
 #: accounting/models.py:216 club/models.py:48 com/models.py:279
-#: com/models.py:296 counter/models.py:122 counter/models.py:150
-#: counter/models.py:214 forum/models.py:58 launderette/models.py:38
+#: com/models.py:296 counter/models.py:131 counter/models.py:159
+#: counter/models.py:243 forum/models.py:58 launderette/models.py:38
 #: launderette/models.py:93 launderette/models.py:131 stock/models.py:40
 #: stock/models.py:63 stock/models.py:105 stock/models.py:133
 msgid "name"
@@ -66,8 +66,8 @@ msgid "account number"
 msgstr "numero de compte"
 
 #: accounting/models.py:116 accounting/models.py:147 club/models.py:275
-#: com/models.py:75 com/models.py:266 com/models.py:302 counter/models.py:168
-#: counter/models.py:216 trombi/models.py:217
+#: com/models.py:75 com/models.py:266 com/models.py:302 counter/models.py:177
+#: counter/models.py:245 trombi/models.py:217
 msgid "club"
 msgstr "club"
 
@@ -88,12 +88,12 @@ msgstr "Compte club"
 msgid "%(club_account)s on %(bank_account)s"
 msgstr "%(club_account)s sur %(bank_account)s"
 
-#: accounting/models.py:214 club/models.py:281 counter/models.py:650
+#: accounting/models.py:214 club/models.py:281 counter/models.py:679
 #: election/models.py:18 launderette/models.py:194
 msgid "start date"
 msgstr "date de début"
 
-#: accounting/models.py:215 club/models.py:282 counter/models.py:651
+#: accounting/models.py:215 club/models.py:282 counter/models.py:680
 #: election/models.py:19
 msgid "end date"
 msgstr "date de fin"
@@ -106,8 +106,8 @@ msgstr "est fermé"
 msgid "club account"
 msgstr "compte club"
 
-#: accounting/models.py:225 accounting/models.py:289 counter/models.py:57
-#: counter/models.py:372
+#: accounting/models.py:225 accounting/models.py:289 counter/models.py:56
+#: counter/models.py:401
 msgid "amount"
 msgstr "montant"
 
@@ -127,20 +127,20 @@ msgstr "numéro"
 msgid "journal"
 msgstr "classeur"
 
-#: accounting/models.py:290 core/models.py:850 core/models.py:1388
-#: core/models.py:1436 core/models.py:1465 core/models.py:1489
-#: counter/models.py:382 counter/models.py:475 counter/models.py:680
-#: eboutic/models.py:47 eboutic/models.py:100 forum/models.py:311
+#: accounting/models.py:290 core/models.py:889 core/models.py:1427
+#: core/models.py:1475 core/models.py:1504 core/models.py:1528
+#: counter/models.py:411 counter/models.py:504 counter/models.py:709
+#: eboutic/models.py:76 eboutic/models.py:162 forum/models.py:311
 #: forum/models.py:408 stock/models.py:104
 msgid "date"
 msgstr "date"
 
-#: accounting/models.py:291 counter/models.py:124 counter/models.py:681
+#: accounting/models.py:291 counter/models.py:133 counter/models.py:710
 #: pedagogy/models.py:219 stock/models.py:107
 msgid "comment"
 msgstr "commentaire"
 
-#: accounting/models.py:293 counter/models.py:384 counter/models.py:477
+#: accounting/models.py:293 counter/models.py:413 counter/models.py:506
 #: subscription/models.py:66
 msgid "payment method"
 msgstr "méthode de paiement"
@@ -149,7 +149,7 @@ msgstr "méthode de paiement"
 msgid "cheque number"
 msgstr "numéro de chèque"
 
-#: accounting/models.py:303 eboutic/models.py:185
+#: accounting/models.py:303 eboutic/models.py:247
 msgid "invoice"
 msgstr "facture"
 
@@ -166,8 +166,8 @@ msgid "accounting type"
 msgstr "type comptable"
 
 #: accounting/models.py:328 accounting/models.py:475 accounting/models.py:510
-#: accounting/models.py:545 core/models.py:1464 core/models.py:1490
-#: counter/models.py:441
+#: accounting/models.py:545 core/models.py:1503 core/models.py:1529
+#: counter/models.py:470
 msgid "label"
 msgstr "étiquette"
 
@@ -266,7 +266,7 @@ msgstr ""
 "Vous devez fournir soit un type comptable simplifié ou un type comptable "
 "standard"
 
-#: accounting/models.py:467 counter/models.py:160 pedagogy/models.py:46
+#: accounting/models.py:467 counter/models.py:169 pedagogy/models.py:46
 msgid "code"
 msgstr "code"
 
@@ -1045,8 +1045,8 @@ msgstr "Vous ne pouvez pas faire de boucles dans les clubs"
 msgid "A club with that unix_name already exists"
 msgstr "Un club avec ce nom UNIX existe déjà."
 
-#: club/models.py:267 counter/models.py:641 counter/models.py:671
-#: eboutic/models.py:43 eboutic/models.py:96 election/models.py:192
+#: club/models.py:267 counter/models.py:670 counter/models.py:700
+#: eboutic/models.py:72 eboutic/models.py:158 election/models.py:192
 #: launderette/models.py:145 launderette/models.py:213 sas/models.py:244
 #: trombi/models.py:213
 msgid "user"
@@ -1057,8 +1057,8 @@ msgstr "nom d'utilisateur"
 msgid "role"
 msgstr "rôle"
 
-#: club/models.py:289 core/models.py:81 counter/models.py:123
-#: counter/models.py:151 election/models.py:15 election/models.py:120
+#: club/models.py:289 core/models.py:81 counter/models.py:132
+#: counter/models.py:160 election/models.py:15 election/models.py:120
 #: election/models.py:197 forum/models.py:59 forum/models.py:240
 msgid "description"
 msgstr "description"
@@ -1076,7 +1076,7 @@ msgid "Enter a valid address. Only the root of the address is needed."
 msgstr ""
 "Entrez une adresse valide. Seule la racine de l'adresse est nécessaire."
 
-#: club/models.py:353 com/models.py:83 com/models.py:312 core/models.py:851
+#: club/models.py:353 com/models.py:83 com/models.py:312 core/models.py:890
 msgid "is moderated"
 msgstr "est modéré"
 
@@ -1427,7 +1427,7 @@ msgstr "résumé"
 msgid "content"
 msgstr "contenu"
 
-#: com/models.py:72 core/models.py:1434 launderette/models.py:101
+#: com/models.py:72 core/models.py:1473 launderette/models.py:101
 #: launderette/models.py:139 launderette/models.py:196 stock/models.py:80
 #: stock/models.py:137
 msgid "type"
@@ -1478,7 +1478,7 @@ msgstr "weekmail"
 msgid "rank"
 msgstr "rang"
 
-#: com/models.py:298 core/models.py:816 core/models.py:866
+#: com/models.py:298 core/models.py:855 core/models.py:905
 msgid "file"
 msgstr "fichier"
 
@@ -2186,11 +2186,11 @@ msgstr "adresse des parents"
 msgid "is subscriber viewable"
 msgstr "profil visible par les cotisants"
 
-#: core/models.py:505
+#: core/models.py:540
 msgid "A user with that username already exists"
 msgstr "Un utilisateur de ce nom d'utilisateur existe déjà"
 
-#: core/models.py:643 core/templates/core/macros.jinja:75
+#: core/models.py:678 core/templates/core/macros.jinja:75
 #: core/templates/core/macros.jinja:77 core/templates/core/macros.jinja:78
 #: core/templates/core/user_detail.jinja:87
 #: core/templates/core/user_detail.jinja:88
@@ -2209,109 +2209,109 @@ msgstr "Un utilisateur de ce nom d'utilisateur existe déjà"
 msgid "Profile"
 msgstr "Profil"
 
-#: core/models.py:767
+#: core/models.py:806
 msgid "Visitor"
 msgstr "Visiteur"
 
-#: core/models.py:775
+#: core/models.py:814
 msgid "do you want to receive the weekmail"
 msgstr "voulez-vous recevoir le Weekmail"
 
-#: core/models.py:777
+#: core/models.py:816
 msgid "show your stats to others"
 msgstr "montrez vos statistiques aux autres"
 
-#: core/models.py:779
+#: core/models.py:818
 msgid "get a notification for every click"
 msgstr "recevez une notification pour chaque click"
 
-#: core/models.py:782
+#: core/models.py:821
 msgid "get a notification for every refilling"
 msgstr "recevez une notification pour chaque rechargement"
 
-#: core/models.py:805
+#: core/models.py:844
 msgid "file name"
 msgstr "nom du fichier"
 
-#: core/models.py:809 core/models.py:1157
+#: core/models.py:848 core/models.py:1196
 msgid "parent"
 msgstr "parent"
 
-#: core/models.py:823
+#: core/models.py:862
 msgid "compressed file"
 msgstr "version allégée"
 
-#: core/models.py:830
+#: core/models.py:869
 msgid "thumbnail"
 msgstr "miniature"
 
-#: core/models.py:838 core/models.py:855
+#: core/models.py:877 core/models.py:894
 msgid "owner"
 msgstr "propriétaire"
 
-#: core/models.py:842 core/models.py:1177 core/views/files.py:193
+#: core/models.py:881 core/models.py:1216 core/views/files.py:193
 msgid "edit group"
 msgstr "groupe d'édition"
 
-#: core/models.py:845 core/models.py:1180 core/views/files.py:196
+#: core/models.py:884 core/models.py:1219 core/views/files.py:196
 msgid "view group"
 msgstr "groupe de vue"
 
-#: core/models.py:847
+#: core/models.py:886
 msgid "is folder"
 msgstr "est un dossier"
 
-#: core/models.py:848
+#: core/models.py:887
 msgid "mime type"
 msgstr "type mime"
 
-#: core/models.py:849
+#: core/models.py:888
 msgid "size"
 msgstr "taille"
 
-#: core/models.py:860
+#: core/models.py:899
 msgid "asked for removal"
 msgstr "retrait demandé"
 
-#: core/models.py:862
+#: core/models.py:901
 msgid "is in the SAS"
 msgstr "est dans le SAS"
 
-#: core/models.py:904
+#: core/models.py:943
 msgid "Character '/' not authorized in name"
 msgstr "Le caractère '/' n'est pas autorisé dans les noms de fichier"
 
-#: core/models.py:906 core/models.py:910
+#: core/models.py:945 core/models.py:949
 msgid "Loop in folder tree"
 msgstr "Boucle dans l'arborescence des dossiers"
 
-#: core/models.py:913
+#: core/models.py:952
 msgid "You can not make a file be a children of a non folder file"
 msgstr ""
 "Vous ne pouvez pas mettre un fichier enfant de quelque chose qui n'est pas "
 "un dossier"
 
-#: core/models.py:924
+#: core/models.py:963
 msgid "Duplicate file"
 msgstr "Un fichier de ce nom existe déjà"
 
-#: core/models.py:941
+#: core/models.py:980
 msgid "You must provide a file"
 msgstr "Vous devez fournir un fichier"
 
-#: core/models.py:1081
+#: core/models.py:1120
 msgid "Folder: "
 msgstr "Dossier : "
 
-#: core/models.py:1083
+#: core/models.py:1122
 msgid "File: "
 msgstr "Fichier : "
 
-#: core/models.py:1140
+#: core/models.py:1179
 msgid "page unix name"
 msgstr "nom unix de la page"
 
-#: core/models.py:1146
+#: core/models.py:1185
 msgid ""
 "Enter a valid page name. This value may contain only unaccented letters, "
 "numbers and ./+/-/_ characters."
@@ -2319,55 +2319,55 @@ msgstr ""
 "Entrez un nom de page correct. Uniquement des lettres non accentuées, "
 "numéros, et ./+/-/_"
 
-#: core/models.py:1164
+#: core/models.py:1203
 msgid "page name"
 msgstr "nom de la page"
 
-#: core/models.py:1172
+#: core/models.py:1211
 msgid "owner group"
 msgstr "groupe propriétaire"
 
-#: core/models.py:1185
+#: core/models.py:1224
 msgid "lock user"
 msgstr "utilisateur bloquant"
 
-#: core/models.py:1192
+#: core/models.py:1231
 msgid "lock_timeout"
 msgstr "décompte du déblocage"
 
-#: core/models.py:1222
+#: core/models.py:1261
 msgid "Duplicate page"
 msgstr "Une page de ce nom existe déjà"
 
-#: core/models.py:1225
+#: core/models.py:1264
 msgid "Loop in page tree"
 msgstr "Boucle dans l'arborescence des pages"
 
-#: core/models.py:1385
+#: core/models.py:1424
 msgid "revision"
 msgstr "révision"
 
-#: core/models.py:1386
+#: core/models.py:1425
 msgid "page title"
 msgstr "titre de la page"
 
-#: core/models.py:1387
+#: core/models.py:1426
 msgid "page content"
 msgstr "contenu de la page"
 
-#: core/models.py:1431
+#: core/models.py:1470
 msgid "url"
 msgstr "url"
 
-#: core/models.py:1432
+#: core/models.py:1471
 msgid "param"
 msgstr "param"
 
-#: core/models.py:1437
+#: core/models.py:1476
 msgid "viewed"
 msgstr "vue"
 
-#: core/models.py:1495
+#: core/models.py:1534
 msgid "operation type"
 msgstr "type d'opération"
 
@@ -2379,7 +2379,7 @@ msgstr "403, Non autorisé"
 msgid "404, Not Found"
 msgstr "404. Non trouvé"
 
-#: core/templates/core/500.jinja:8
+#: core/templates/core/500.jinja:12
 msgid "500, Server Error"
 msgstr "500, Erreur Serveur"
 
@@ -2387,20 +2387,20 @@ msgstr "500, Erreur Serveur"
 msgid "Welcome!"
 msgstr "Bienvenue !"
 
-#: core/templates/core/base.jinja:52
+#: core/templates/core/base.jinja:57
 msgid "Username"
 msgstr "Nom d'utilisateur"
 
-#: core/templates/core/base.jinja:54
+#: core/templates/core/base.jinja:59
 msgid "Password"
 msgstr "Mot de passe"
 
-#: core/templates/core/base.jinja:56 core/templates/core/login.jinja:4
+#: core/templates/core/base.jinja:61 core/templates/core/login.jinja:4
 #: core/templates/core/password_reset_complete.jinja:5
 msgid "Login"
 msgstr "Connexion"
 
-#: core/templates/core/base.jinja:58 core/templates/core/register.jinja:18
+#: core/templates/core/base.jinja:63 core/templates/core/register.jinja:18
 msgid "Register"
 msgstr "S'enregister"
 
@@ -2463,9 +2463,9 @@ msgstr "Doceo"
 msgid "Positions"
 msgstr "Postes à pourvoir"
 
-#: core/templates/core/base.jinja:182
-msgid "Calendar"
-msgstr "Calendrier"
+#: core/templates/core/base.jinja:182 core/templates/core/user_tools.jinja:118
+msgid "Elections"
+msgstr "Élections"
 
 #: core/templates/core/base.jinja:183
 msgid "Big event"
@@ -2484,85 +2484,85 @@ msgstr "Forum"
 msgid "Gallery"
 msgstr "Photos"
 
-#: core/templates/core/base.jinja:188 counter/models.py:224
+#: core/templates/core/base.jinja:189 counter/models.py:253
 #: counter/templates/counter/counter_list.jinja:11
 #: eboutic/templates/eboutic/eboutic_main.jinja:4
-#: eboutic/templates/eboutic/eboutic_main.jinja:24
+#: eboutic/templates/eboutic/eboutic_main.jinja:23
 #: eboutic/templates/eboutic/eboutic_makecommand.jinja:8
 #: eboutic/templates/eboutic/eboutic_payment_result.jinja:4
 #: sith/settings.py:379 sith/settings.py:387
 msgid "Eboutic"
 msgstr "Eboutic"
 
-#: core/templates/core/base.jinja:190
+#: core/templates/core/base.jinja:192
 msgid "Services"
 msgstr "Services"
 
-#: core/templates/core/base.jinja:194
+#: core/templates/core/base.jinja:196
 msgid "Matmatronch"
 msgstr "Matmatronch"
 
-#: core/templates/core/base.jinja:195 launderette/models.py:47
+#: core/templates/core/base.jinja:197 launderette/models.py:47
 #: launderette/templates/launderette/launderette_book.jinja:5
 #: launderette/templates/launderette/launderette_book_choose.jinja:4
 #: launderette/templates/launderette/launderette_main.jinja:4
 msgid "Launderette"
 msgstr "Laverie"
 
-#: core/templates/core/base.jinja:196 core/templates/core/file.jinja:20
+#: core/templates/core/base.jinja:198 core/templates/core/file.jinja:20
 #: core/views/files.py:86
 msgid "Files"
 msgstr "Fichiers"
 
-#: core/templates/core/base.jinja:197 core/templates/core/user_tools.jinja:109
+#: core/templates/core/base.jinja:199 core/templates/core/user_tools.jinja:109
 msgid "Pedagogy"
 msgstr "Pédagogie"
 
-#: core/templates/core/base.jinja:201
+#: core/templates/core/base.jinja:203
 msgid "My Benefits"
 msgstr "Mes Avantages"
 
-#: core/templates/core/base.jinja:205
+#: core/templates/core/base.jinja:207
 msgid "Sponsors"
 msgstr "Partenaires"
 
-#: core/templates/core/base.jinja:206
+#: core/templates/core/base.jinja:208
 msgid "Subscriber benefits"
 msgstr "Les avantages cotisants"
 
-#: core/templates/core/base.jinja:210
+#: core/templates/core/base.jinja:212
 msgid "Help"
 msgstr "Aide"
 
-#: core/templates/core/base.jinja:214
+#: core/templates/core/base.jinja:216
 msgid "FAQ"
 msgstr "FAQ"
 
-#: core/templates/core/base.jinja:215 core/templates/core/base.jinja:257
+#: core/templates/core/base.jinja:217 core/templates/core/base.jinja:259
 msgid "Contacts"
 msgstr "Contacts"
 
-#: core/templates/core/base.jinja:216
+#: core/templates/core/base.jinja:218
 msgid "Wiki"
 msgstr "Wiki"
 
-#: core/templates/core/base.jinja:258
+#: core/templates/core/base.jinja:260
 msgid "Legal notices"
 msgstr "Mentions légales"
 
-#: core/templates/core/base.jinja:259
+#: core/templates/core/base.jinja:261
 msgid "Intellectual property"
 msgstr "Propriété intellectuelle"
 
-#: core/templates/core/base.jinja:260
+#: core/templates/core/base.jinja:262
 msgid "Help & Documentation"
 msgstr "Aide & Documentation"
 
-#: core/templates/core/base.jinja:261
+#: core/templates/core/base.jinja:263
 msgid "R&D"
 msgstr "R&D"
 
-#: core/templates/core/base.jinja:263
+#: core/templates/core/base.jinja:265
 msgid "Site made by good people"
 msgstr "Site réalisé par des gens bons"
 
@@ -3323,7 +3323,7 @@ msgstr "Photos de %(user_name)s"
 msgid "Download all my pictures"
 msgstr "Télécharger toutes mes photos"
 
-#: core/templates/core/user_pictures.jinja:81
+#: core/templates/core/user_pictures.jinja:83
 msgid "Error downloading your pictures"
 msgstr "Erreur de téléchargement de vos photos"
 
@@ -3523,10 +3523,6 @@ msgstr "Créer UV"
 msgid "Moderate comments"
 msgstr "Modérer les commentaires"
 
-#: core/templates/core/user_tools.jinja:118
-msgid "Elections"
-msgstr "Élections"
-
 #: core/templates/core/user_tools.jinja:120
 msgid "See available elections"
 msgstr "Voir les élections disponibles"
@@ -3717,8 +3713,8 @@ msgstr "Photos"
 msgid "User already has a profile picture"
 msgstr "L'utilisateur a déjà une photo de profil"
 
-#: counter/app.py:31 counter/models.py:238 counter/models.py:647
-#: counter/models.py:677 launderette/models.py:41 stock/models.py:43
+#: counter/app.py:31 counter/models.py:267 counter/models.py:676
+#: counter/models.py:706 launderette/models.py:41 stock/models.py:43
 msgid "counter"
 msgstr "comptoir"
 
@@ -3726,137 +3722,137 @@ msgstr "comptoir"
 msgid "Ecocup regularization"
 msgstr "Régularization des ecocups"
 
-#: counter/models.py:56
+#: counter/models.py:55
 msgid "account id"
 msgstr "numéro de compte"
 
-#: counter/models.py:58
+#: counter/models.py:57
 msgid "recorded product"
 msgstr "produits consignés"
 
-#: counter/models.py:61
+#: counter/models.py:60
 msgid "customer"
 msgstr "client"
 
-#: counter/models.py:62
+#: counter/models.py:61
 msgid "customers"
 msgstr "clients"
 
-#: counter/models.py:98 counter/views.py:377
+#: counter/models.py:107 counter/views.py:377
 msgid "Not enough money"
 msgstr "Solde insuffisant"
 
-#: counter/models.py:128 counter/models.py:155
+#: counter/models.py:137 counter/models.py:164
 msgid "product type"
 msgstr "type du produit"
 
-#: counter/models.py:161
+#: counter/models.py:170
 msgid "purchase price"
 msgstr "prix d'achat"
 
-#: counter/models.py:162
+#: counter/models.py:171
 msgid "selling price"
 msgstr "prix de vente"
 
-#: counter/models.py:163
+#: counter/models.py:172
 msgid "special selling price"
 msgstr "prix de vente spécial"
 
-#: counter/models.py:165
+#: counter/models.py:174
 msgid "icon"
 msgstr "icône"
 
-#: counter/models.py:170
+#: counter/models.py:179
 msgid "limit age"
 msgstr "âge limite"
 
-#: counter/models.py:171
+#: counter/models.py:180
 msgid "tray price"
 msgstr "prix plateau"
 
-#: counter/models.py:175
+#: counter/models.py:184
 msgid "parent product"
 msgstr "produit parent"
 
-#: counter/models.py:181
+#: counter/models.py:190
 msgid "buying groups"
 msgstr "groupe d'achat"
 
-#: counter/models.py:183 election/models.py:52
+#: counter/models.py:192 election/models.py:52
 msgid "archived"
 msgstr "archivé"
 
-#: counter/models.py:186 counter/models.py:772
+#: counter/models.py:195 counter/models.py:801
 msgid "product"
 msgstr "produit"
 
-#: counter/models.py:219
+#: counter/models.py:248
 msgid "products"
 msgstr "produits"
 
-#: counter/models.py:222
+#: counter/models.py:251
 msgid "counter type"
 msgstr "type de comptoir"
 
-#: counter/models.py:224
+#: counter/models.py:253
 msgid "Bar"
 msgstr "Bar"
 
-#: counter/models.py:224
+#: counter/models.py:253
 msgid "Office"
 msgstr "Bureau"
 
-#: counter/models.py:227
+#: counter/models.py:256
 msgid "sellers"
 msgstr "vendeurs"
 
-#: counter/models.py:235 launderette/models.py:207
+#: counter/models.py:264 launderette/models.py:207
 msgid "token"
 msgstr "jeton"
 
-#: counter/models.py:390
+#: counter/models.py:419
 msgid "bank"
 msgstr "banque"
 
-#: counter/models.py:392 counter/models.py:482
+#: counter/models.py:421 counter/models.py:511
 msgid "is validated"
 msgstr "est validé"
 
-#: counter/models.py:395
+#: counter/models.py:424
 msgid "refilling"
 msgstr "rechargement"
 
-#: counter/models.py:459 eboutic/models.py:161
+#: counter/models.py:488 eboutic/models.py:223
 msgid "unit price"
 msgstr "prix unitaire"
 
-#: counter/models.py:460 counter/models.py:757 eboutic/models.py:162
+#: counter/models.py:489 counter/models.py:786 eboutic/models.py:224
 msgid "quantity"
 msgstr "quantité"
 
-#: counter/models.py:479
+#: counter/models.py:508
 msgid "Sith account"
 msgstr "Compte utilisateur"
 
-#: counter/models.py:479 sith/settings.py:372 sith/settings.py:377
+#: counter/models.py:508 sith/settings.py:372 sith/settings.py:377
 #: sith/settings.py:397
 msgid "Credit card"
 msgstr "Carte bancaire"
 
-#: counter/models.py:485
+#: counter/models.py:514
 msgid "selling"
 msgstr "vente"
 
-#: counter/models.py:512
+#: counter/models.py:541
 msgid "Unknown event"
 msgstr "Événement inconnu"
 
-#: counter/models.py:513
+#: counter/models.py:542
 #, python-format
 msgid "Eticket bought for the event %(event)s"
 msgstr "Eticket acheté pour l'événement %(event)s"
 
-#: counter/models.py:515 counter/models.py:538
+#: counter/models.py:544 counter/models.py:567
 #, python-format
 msgid ""
 "You bought an eticket for the event %(event)s.\n"
@@ -3868,59 +3864,59 @@ msgstr ""
 "Vous pouvez également retrouver tous vos e-tickets sur votre page de compte "
 "%(url)s."
 
-#: counter/models.py:652
+#: counter/models.py:681
 msgid "last activity date"
 msgstr "dernière activité"
 
-#: counter/models.py:655
+#: counter/models.py:684
 msgid "permanency"
 msgstr "permanence"
 
-#: counter/models.py:682
+#: counter/models.py:711
 msgid "emptied"
 msgstr "coffre vidée"
 
-#: counter/models.py:685
+#: counter/models.py:714
 msgid "cash register summary"
 msgstr "relevé de caisse"
 
-#: counter/models.py:753
+#: counter/models.py:782
 msgid "cash summary"
 msgstr "relevé"
 
-#: counter/models.py:756
+#: counter/models.py:785
 msgid "value"
 msgstr "valeur"
 
-#: counter/models.py:758
+#: counter/models.py:787
 msgid "check"
 msgstr "chèque"
 
-#: counter/models.py:761
+#: counter/models.py:790
 msgid "cash register summary item"
 msgstr "élément de relevé de caisse"
 
-#: counter/models.py:776
+#: counter/models.py:805
 msgid "banner"
 msgstr "bannière"
 
-#: counter/models.py:778
+#: counter/models.py:807
 msgid "event date"
 msgstr "date de l'événement"
 
-#: counter/models.py:780
+#: counter/models.py:809
 msgid "event title"
 msgstr "titre de l'événement"
 
-#: counter/models.py:782
+#: counter/models.py:811
 msgid "secret"
 msgstr "secret"
 
-#: counter/models.py:838
+#: counter/models.py:867
 msgid "uid"
 msgstr "uid"
 
-#: counter/models.py:843
+#: counter/models.py:872
 msgid "student cards"
 msgstr "cartes étudiante"
 
@@ -4017,7 +4013,6 @@ msgid "Selling"
 msgstr "Vente"
 
 #: counter/templates/counter/counter_click.jinja:65
-#: eboutic/templates/eboutic/eboutic_main.jinja:27
 #: eboutic/templates/eboutic/eboutic_makecommand.jinja:11
 msgid "Basket: "
 msgstr "Panier : "
@@ -4323,84 +4318,120 @@ msgstr "Nombre de chèque"
 msgid "people(s)"
 msgstr "personne(s)"
 
-#: eboutic/models.py:101
+#: eboutic/forms.py:105
+msgid "You have no basket."
+msgstr "Vous n'avez pas de panier."
+
+#: eboutic/forms.py:110
+msgid "The request was badly formatted."
+msgstr "La requête a été mal formatée."
+
+#: eboutic/forms.py:115
+msgid "The basket cookie was badly formatted."
+msgstr "Le cookie du panier a été mal formaté."
+
+#: eboutic/forms.py:118
+msgid "Your basket is empty."
+msgstr "Votre panier est vide"
+
+#: eboutic/forms.py:130
+#, python-format
+msgid "%(name)s : this product does not exist."
+msgstr "%(name)s : ce produit n'existe pas."
+
+#: eboutic/forms.py:139
+#, fuzzy, python-format
+#| msgid "%(name)s : this product does not exist."
+msgid "%(name)s : this product does not exist or may no longer be available."
+msgstr "%(name)s : ce produit n'existe pas ou n'est peut-être plus disponnible."
+
+#: eboutic/forms.py:146
+#, fuzzy, python-format
+#| msgid "You cannot buy %(nbr)d %(name)%s."
+msgid "You cannot buy %(nbr)d %(name)%s."
+msgstr "Vous ne pouvez pas acheter %(nbr)d %(name)s."
+
+#: eboutic/models.py:163
 msgid "validated"
 msgstr "validé"
 
-#: eboutic/models.py:114
+#: eboutic/models.py:173
 msgid "Invoice already validated"
 msgstr "Facture déjà validée"
 
-#: eboutic/models.py:158
+#: eboutic/models.py:220
 msgid "product id"
 msgstr "ID du produit"
 
-#: eboutic/models.py:159
+#: eboutic/models.py:221
 msgid "product name"
 msgstr "nom du produit"
 
-#: eboutic/models.py:160
+#: eboutic/models.py:222
 msgid "product type id"
 msgstr "id du type du produit"
 
-#: eboutic/models.py:177
+#: eboutic/models.py:239
 msgid "basket"
 msgstr "panier"
 
-#: eboutic/templates/eboutic/eboutic_main.jinja:35
-#: eboutic/templates/eboutic/eboutic_makecommand.jinja:32
-msgid "Basket amount: "
-msgstr "Valeur du panier : "
+#: eboutic/templates/eboutic/eboutic_main.jinja:32
+msgid "Your basket has been cleaned accordingly to those errors."
+msgstr "Votre panier a été nettoyé en fonction de ces erreurs."
 
 #: eboutic/templates/eboutic/eboutic_main.jinja:39
 #: eboutic/templates/eboutic/eboutic_makecommand.jinja:36
 msgid "Current account amount: "
 msgstr "Solde actuel : "
 
-#: eboutic/templates/eboutic/eboutic_main.jinja:43
-#: eboutic/templates/eboutic/eboutic_makecommand.jinja:40
-msgid "Remaining account amount: "
-msgstr "Solde restant : "
+#: eboutic/templates/eboutic/eboutic_main.jinja:58
+#: eboutic/templates/eboutic/eboutic_makecommand.jinja:32
+msgid "Basket amount: "
+msgstr "Valeur du panier : "
 
-#: eboutic/templates/eboutic/eboutic_main.jinja:51
-msgid "Proceed to command"
-msgstr "Procéder à la commande"
+#: eboutic/templates/eboutic/eboutic_main.jinja:65
+msgid "Clear"
+msgstr "Vider"
+
+#: eboutic/templates/eboutic/eboutic_main.jinja:71
+msgid "Validate"
+msgstr "Valider"
 
 #: eboutic/templates/eboutic/eboutic_makecommand.jinja:4
 msgid "Basket state"
 msgstr "État du panier"
 
-#: eboutic/templates/eboutic/eboutic_makecommand.jinja:50
+#: eboutic/templates/eboutic/eboutic_makecommand.jinja:40
+msgid "Remaining account amount: "
+msgstr "Solde restant : "
+
+#: eboutic/templates/eboutic/eboutic_makecommand.jinja:51
 msgid "Pay with credit card"
 msgstr "Payer avec une carte bancaire"
 
-#: eboutic/templates/eboutic/eboutic_makecommand.jinja:55
+#: eboutic/templates/eboutic/eboutic_makecommand.jinja:56
 msgid ""
 "AE account payment disabled because your basket contains refilling items."
 msgstr ""
 "Paiement par compte AE désactivé parce que votre panier contient des bons de "
 "rechargement."
 
-#: eboutic/templates/eboutic/eboutic_makecommand.jinja:60
+#: eboutic/templates/eboutic/eboutic_makecommand.jinja:61
 msgid "Pay with Sith account"
 msgstr "Payer avec un compte AE"
 
 #: eboutic/templates/eboutic/eboutic_payment_result.jinja:8
-msgid "Payment failed"
-msgstr "Le paiement a échoué"
-
-#: eboutic/templates/eboutic/eboutic_payment_result.jinja:10
 msgid "Payment successful"
 msgstr "Le paiement a été effectué"
 
+#: eboutic/templates/eboutic/eboutic_payment_result.jinja:10
+msgid "Payment failed"
+msgstr "Le paiement a échoué"
+
 #: eboutic/templates/eboutic/eboutic_payment_result.jinja:12
 msgid "Return to eboutic"
 msgstr "Retourner à l'eboutic"
 
-#: eboutic/views.py:225
-msgid "You do not have enough money to buy the basket"
-msgstr "Vous n'avez pas assez d'argent pour acheter le panier"
-
 #: election/models.py:16
 msgid "start candidature"
 msgstr "début des candidatures"
@@ -4775,12 +4806,12 @@ msgid "Washing and drying"
 msgstr "Lavage et séchage"
 
 #: launderette/templates/launderette/launderette_book.jinja:27
-#: sith/settings.py:603
+#: sith/settings.py:609
 msgid "Washing"
 msgstr "Lavage"
 
 #: launderette/templates/launderette/launderette_book.jinja:31
-#: sith/settings.py:603
+#: sith/settings.py:609
 msgid "Drying"
 msgstr "Séchage"
 
@@ -5440,204 +5471,204 @@ msgstr "Suppression de vente"
 msgid "Refilling deletion"
 msgstr "Suppression de rechargement"
 
-#: sith/settings.py:483
+#: sith/settings.py:489
 msgid "One semester"
 msgstr "Un semestre, 20 €"
 
-#: sith/settings.py:484
+#: sith/settings.py:490
 msgid "Two semesters"
 msgstr "Deux semestres, 35 €"
 
-#: sith/settings.py:486
+#: sith/settings.py:492
 msgid "Common core cursus"
 msgstr "Cursus tronc commun, 60 €"
 
-#: sith/settings.py:490
+#: sith/settings.py:496
 msgid "Branch cursus"
 msgstr "Cursus branche, 60 €"
 
-#: sith/settings.py:491
+#: sith/settings.py:497
 msgid "Alternating cursus"
 msgstr "Cursus alternant, 30 €"
 
-#: sith/settings.py:492
+#: sith/settings.py:498
 msgid "Honorary member"
 msgstr "Membre honoraire, 0 €"
 
-#: sith/settings.py:493
+#: sith/settings.py:499
 msgid "Assidu member"
 msgstr "Membre d'Assidu, 0 €"
 
-#: sith/settings.py:494
+#: sith/settings.py:500
 msgid "Amicale/DOCEO member"
 msgstr "Membre de l'Amicale/DOCEO, 0 €"
 
-#: sith/settings.py:495
+#: sith/settings.py:501
 msgid "UT network member"
 msgstr "Cotisant du réseau UT, 0 €"
 
-#: sith/settings.py:496
+#: sith/settings.py:502
 msgid "CROUS member"
 msgstr "Membres du CROUS, 0 €"
 
-#: sith/settings.py:497
+#: sith/settings.py:503
 msgid "Sbarro/ESTA member"
 msgstr "Membre de Sbarro ou de l'ESTA, 20 €"
 
-#: sith/settings.py:499
+#: sith/settings.py:505
 msgid "One semester Welcome Week"
 msgstr "Un semestre Welcome Week"
 
-#: sith/settings.py:503
+#: sith/settings.py:509
 msgid "One month for free"
 msgstr "Un mois gratuit"
 
-#: sith/settings.py:504
+#: sith/settings.py:510
 msgid "Two months for free"
 msgstr "Deux mois gratuits"
 
-#: sith/settings.py:505
+#: sith/settings.py:511
 msgid "Eurok's volunteer"
 msgstr "Bénévole Eurockéennes"
 
-#: sith/settings.py:507
+#: sith/settings.py:513
 msgid "Six weeks for free"
 msgstr "6 semaines gratuites"
 
-#: sith/settings.py:511
+#: sith/settings.py:517
 msgid "One day"
 msgstr "Un jour"
 
-#: sith/settings.py:512
+#: sith/settings.py:518
 msgid "GA staff member"
 msgstr "Membre staff GA (2 semaines), 1 €"
 
-#: sith/settings.py:515
+#: sith/settings.py:521
 msgid "One semester (-20%)"
 msgstr "Un semestre (-20%), 12 €"
 
-#: sith/settings.py:520
+#: sith/settings.py:526
 msgid "Two semesters (-20%)"
 msgstr "Deux semestres (-20%), 22 €"
 
-#: sith/settings.py:525
+#: sith/settings.py:531
 msgid "Common core cursus (-20%)"
 msgstr "Cursus tronc commun (-20%), 36 €"
 
-#: sith/settings.py:530
+#: sith/settings.py:536
 msgid "Branch cursus (-20%)"
 msgstr "Cursus branche (-20%), 36 €"
 
-#: sith/settings.py:535
+#: sith/settings.py:541
 msgid "Alternating cursus (-20%)"
 msgstr "Cursus alternant (-20%), 24 €"
 
-#: sith/settings.py:541
+#: sith/settings.py:547
 msgid "One year for free(CA offer)"
 msgstr "Une année offerte (Offre CA)"
 
-#: sith/settings.py:563
+#: sith/settings.py:569
 msgid "President"
 msgstr "Président⸱e"
 
-#: sith/settings.py:564
+#: sith/settings.py:570
 msgid "Vice-President"
 msgstr "Vice-Président⸱e"
 
-#: sith/settings.py:565
+#: sith/settings.py:571
 msgid "Treasurer"
 msgstr "Trésorier⸱e"
 
-#: sith/settings.py:566
+#: sith/settings.py:572
 msgid "Communication supervisor"
 msgstr "Responsable communication"
 
-#: sith/settings.py:567
+#: sith/settings.py:573
 msgid "Secretary"
 msgstr "Secrétaire"
 
-#: sith/settings.py:568
+#: sith/settings.py:574
 msgid "IT supervisor"
 msgstr "Responsable info"
 
-#: sith/settings.py:569
+#: sith/settings.py:575
 msgid "Board member"
 msgstr "Membre du bureau"
 
-#: sith/settings.py:570
+#: sith/settings.py:576
 msgid "Active member"
 msgstr "Membre actif⸱ve"
 
-#: sith/settings.py:571
+#: sith/settings.py:577
 msgid "Curious"
 msgstr "Curieux⸱euse"
 
-#: sith/settings.py:607
+#: sith/settings.py:613
 msgid "A new poster needs to be moderated"
 msgstr "Une nouvelle affiche a besoin d'être modérée"
 
-#: sith/settings.py:608
+#: sith/settings.py:614
 msgid "A new mailing list needs to be moderated"
 msgstr "Une nouvelle mailing list a besoin d'être modérée"
 
-#: sith/settings.py:611
+#: sith/settings.py:617
 msgid "A new pedagogy comment has been signaled for moderation"
 msgstr ""
 "Un nouveau commentaire de la pédagogie a été signalé pour la modération"
 
-#: sith/settings.py:613
+#: sith/settings.py:619
 #, python-format
 msgid "There are %s fresh news to be moderated"
 msgstr "Il y a %s nouvelles toutes fraîches à modérer"
 
-#: sith/settings.py:614
+#: sith/settings.py:620
 msgid "New files to be moderated"
 msgstr "Nouveaux fichiers à modérer"
 
-#: sith/settings.py:615
+#: sith/settings.py:621
 #, python-format
 msgid "There are %s pictures to be moderated in the SAS"
 msgstr "Il y a %s photos à modérer dans le SAS"
 
-#: sith/settings.py:616
+#: sith/settings.py:622
 msgid "You've been identified on some pictures"
 msgstr "Vous avez été identifié sur des photos"
 
-#: sith/settings.py:617
+#: sith/settings.py:623
 #, python-format
 msgid "You just refilled of %s €"
 msgstr "Vous avez rechargé votre compte de %s€"
 
-#: sith/settings.py:618
+#: sith/settings.py:624
 #, python-format
 msgid "You just bought %s"
 msgstr "Vous avez acheté %s"
 
-#: sith/settings.py:619
+#: sith/settings.py:625
 msgid "You have a notification"
 msgstr "Vous avez une notification"
 
-#: sith/settings.py:631
+#: sith/settings.py:637
 msgid "Success!"
 msgstr "Succès !"
 
-#: sith/settings.py:632
+#: sith/settings.py:638
 msgid "Fail!"
 msgstr "Échec !"
 
-#: sith/settings.py:633
+#: sith/settings.py:639
 msgid "You successfully posted an article in the Weekmail"
 msgstr "Article posté avec succès dans le Weekmail"
 
-#: sith/settings.py:634
+#: sith/settings.py:640
 msgid "You successfully edited an article in the Weekmail"
 msgstr "Article édité avec succès dans le Weekmail"
 
-#: sith/settings.py:635
+#: sith/settings.py:641
 msgid "You successfully sent the Weekmail"
 msgstr "Weekmail envoyé avec succès"
 
-#: sith/settings.py:643
+#: sith/settings.py:649
 msgid "AE tee-shirt"
 msgstr "Tee-shirt AE"
 
@@ -5880,11 +5911,11 @@ msgid "Eboutic is reserved to specific users. In doubt, don't use it."
 msgstr ""
 "Eboutic est réservé à des cas particuliers. Dans le doute, ne l'utilisez pas."
 
-#: subscription/views.py:96
+#: subscription/views.py:104
 msgid "A user with that email address already exists"
 msgstr "Un utilisateur avec cette adresse email existe déjà"
 
-#: subscription/views.py:119
+#: subscription/views.py:127
 msgid "You must either choose an existing user or create a new one properly"
 msgstr ""
 "Vous devez soit choisir un utilisateur existant, soit en créer un proprement"
@@ -6189,8 +6220,6 @@ msgstr "Vous ne pouvez plus écrire de commentaires, la date est passée."
 msgid "Maximum characters: %(max_length)s"
 msgstr "Nombre de caractères max: %(max_length)s"
 
-#~ msgid "Indifferent"
-#~ msgstr "Indifferent"
-
-#~ msgid "Sex"
-#~ msgstr "Sexe"
+#: eboutic/templates/eboutic/eboutic_main.jinja
+msgid "There are no items available for sale"
+msgstr "Aucun article n'est disponible à la vente"
diff --git a/sith/settings.py b/sith/settings.py
index 74331540..7418a5fc 100644
--- a/sith/settings.py
+++ b/sith/settings.py
@@ -703,4 +703,5 @@ SITH_FRONT_DEP_VERSIONS = {
     "https://github.com/getsentry/sentry-javascript/": "4.0.6",
     "https://github.com/jhuckaby/webcamjs/": "1.0.0",
     "https://github.com/vuejs/vue-next": "3.2.18",
+    "https://github.com/alpinejs/alpine": "3.10.3",
 }