Merge branch 'cart-temp' into box-now-test-

.env.example

@@ -59,6 +59,10 @@ MAIL_USERNAME=null
 MAIL_PASSWORD=null
 MAIL_FROM_ADDRESS="hello@example.com"
 MAIL_FROM_NAME="${APP_NAME}"
+CONTACT_EMAIL=
+
+HCAPTCHA_SITEKEY=
+HCAPTCHA_SECRET=
 
 AWS_ACCESS_KEY_ID=
 AWS_SECRET_ACCESS_KEY=

README.md

@@ -0,0 +1,29 @@
+# 3dealer
+
+Storefront for 3dealer.gr: Laravel 12 + Lunar PHP (headless), on top of `boboko/core`. Front-end conventions are in [CLAUDE.md](CLAUDE.md).
+
+## Scheduled jobs
+
+These run in the `scheduler` container (`php artisan schedule:work`).
+
+| Command | When | What it does |
+|---|---|---|
+| `custom-fields:prune-uploads` | Daily, 04:00 | Deletes custom-field photo uploads older than 24 h that no cart line or order line references. |
+| `lunar:search:index` | Daily, 03:00 | Full product reindex. Registered by `boboko/core`. |
+
+## Product custom fields
+
+Admins can add custom fields to a product in the Lunar admin (the product's **Custom Fields** section, from `boboko/core`). The customer fills them in on the product page before adding the product to the cart. The answers are stored on the cart line (`meta.custom_fields`) and carried over to the order line.
+
+| Field type | Storefront input | Limit |
+|---|---|---|
+| Short text | text input | 255 characters |
+| Long text | textarea | 2,000 characters |
+| File upload | photo upload | JPG, PNG, WEBP, HEIC/HEIF, up to 10 MB |
+
+- **Photos upload as soon as they're picked.** They go to `POST /{locale}/custom-field-uploads`, which is limited to 20 per minute per client. They're stored on the private `local` disk under `storage/app/private/custom-field-uploads/`. Only an encrypted reference is sent with add-to-cart. The allowed types and size are set in `App\Http\Controllers\CustomFieldUploadController`.
+- **Photos are never public.** The cart drawer, checkout summary and order confirmation link to a photo through a signed URL that expires after 2 hours.
+- **Emails show text answers only**, never photos.
+- **Photos are cleaned up automatically.** Photos never added to a cart are deleted by `custom-fields:prune-uploads` (see above). A photo on a cart line is kept as long as that cart line exists, and a photo on an order is kept indefinitely.
+- **Products with custom fields can't be quick-added.** On product cards, the "add to cart" button becomes a link to the product page.
+- Field labels are entered once in the admin and aren't translated, so they appear as entered in both `/el` and `/en`.

app/Catalog/ProductCard.php

@@ -19,7 +19,7 @@ final class ProductCard
 {
     /**
      * @param  array<string, mixed>  $product  one item from ProductService's localized array shape
-     * @return array{name: ?string, price: ?string, image: ?string, href: string}
+     * @return array{name: ?string, price: ?string, image: ?string, href: string, variantId: ?int, hasCustomFields: bool, soldOut: bool}
      */
     public static function fromIndexed(array $product): array
     {
@@ -28,6 +28,20 @@ public static function fromIndexed(array $product): array
             'price' => $product['price'],
             'image' => $product['media'][0]['url'] ?? null,
             'href' => route('product.show', ['id' => $product['id']]),
+            // The card's quick "Add to cart" always adds this variant, same
+            // default Modules\Core\Catalog\Services\ProductService::
+            // variantSummaries() and product/show.blade.php both use — no
+            // picker at listing-grid scope, unlike the product page's own
+            // color swatches.
+            'variantId' => $product['variants'][0]['id'] ?? null,
+            // A product with custom fields (photo upload, engraving text…)
+            // can't be quick-added from a card — the card links to the
+            // product page instead, even when every field is optional.
+            'hasCustomFields' => ! empty($product['custom_fields']),
+            // Index-time stock (see boboko-core's ProductIndexer `in_stock`),
+            // so only as fresh as the last reindex. A document missing the
+            // field is treated as in stock rather than hiding its cart button.
+            'soldOut' => ! ($product['in_stock'] ?? true),
         ];
     }
 }

app/Catalog/ProductListingPage.php

@@ -17,7 +17,14 @@
  */
 final class ProductListingPage
 {
-    private const PER_PAGE = 12;
+    private const PER_PAGE = 40;
+
+    /** Category pages rarely have enough products to fill a page, so this
+     * ceiling is high enough to act as "no pagination" in practice — the
+     * pagination component self-hides via hasPages() when everything fits.
+     * If a category ever exceeds it, pagination reappears as a safety net
+     * rather than silently truncating results. */
+    private const CATEGORY_PER_PAGE = 200;
 
     public function __construct(
         private readonly ProductService $products,
@@ -33,6 +40,7 @@ public function __construct(
     public function build(ProductListing $listing, Closure $url, ?int $collectionId = null, ?string $query = null): array
     {
         $filters = $listing->filters($collectionId);
+        $perPage = $collectionId !== null ? self::CATEGORY_PER_PAGE : self::PER_PAGE;
 
         // Listing reads from the Meilisearch index via ProductService/
         // ProductSearchService, not Eloquent. Both return a
@@ -45,12 +53,12 @@ public function build(ProductListing $listing, Closure $url, ?int $collectionId
                 query: $query,
                 filters: $filters,
                 sort: $listing->sort,
-                perPage: self::PER_PAGE,
+                perPage: $perPage,
                 page: $listing->page,
             )
             : $this->products->list(
                 filters: $filters,
-                perPage: self::PER_PAGE,
+                perPage: $perPage,
                 page: $listing->page,
                 sort: $listing->sort,
             );

app/Http/Controllers/Account/AccountController.php

@@ -0,0 +1,156 @@
+<?php
+
+namespace App\Http\Controllers\Account;
+
+use App\Http\Controllers\Controller;
+use Illuminate\Http\RedirectResponse;
+use Illuminate\Http\Request;
+use Illuminate\Support\Facades\Auth;
+use Illuminate\Validation\Rule;
+use Illuminate\View\View;
+use Lunar\Models\Country;
+use Lunar\Models\State;
+use Modules\Core\Cart\Services\CartService;
+use Modules\Core\Checkout\Services\CheckoutService;
+use Modules\Core\Customer\Services\CustomerAccountService;
+use Modules\Core\Privacy\Services\PrivacyService;
+
+/**
+ * The profile page: name, invoice details, the one address, and account
+ * deletion. The customer keeps a single address, flagged as both the
+ * shipping and billing default, so allowing several later is a UI change
+ * only (the data is already Lunar's own addresses table).
+ */
+class AccountController extends Controller
+{
+    // Single-country store, same as CheckoutController::STORE_COUNTRY_ISO3.
+    private const STORE_COUNTRY_ISO3 = 'GRC';
+
+    private const ADDRESS_FIELDS = ['line_one', 'city', 'postcode', 'state', 'contact_phone'];
+
+    public function __construct(
+        private readonly CustomerAccountService $account,
+    ) {}
+
+    public function show(string $locale, Request $request): View
+    {
+        $user = $request->user();
+        $customer = $this->account->customer($user);
+
+        return view('account.show', [
+            'user' => $user,
+            'customer' => $customer,
+            'address' => $this->defaultAddress($user),
+            'regions' => State::where('country_id', $this->storeCountry()->id)->orderBy('name')->get(['id', 'name']),
+        ]);
+    }
+
+    public function update(string $locale, Request $request): RedirectResponse
+    {
+        $user = $request->user();
+        $country = $this->storeCountry();
+
+        // The address is all-or-nothing: typing any part of it makes the rest
+        // (and the name, which Lunar requires on every address) required.
+        $anyAddressField = implode(',', self::ADDRESS_FIELDS);
+
+        $data = $request->validate([
+            'first_name' => ['nullable', 'string', 'max:255', 'required_with:'.$anyAddressField],
+            'last_name' => ['nullable', 'string', 'max:255', 'required_with:'.$anyAddressField],
+            'invoice' => ['boolean'],
+            'company_name' => ['nullable', 'string', 'max:255', 'required_if_accepted:invoice'],
+            'tax_identifier' => ['nullable', 'digits:9', 'required_if_accepted:invoice'],
+            'line_one' => ['nullable', 'string', 'max:255', 'required_with:'.$anyAddressField],
+            'city' => ['nullable', 'string', 'max:255', 'required_with:'.$anyAddressField],
+            'postcode' => ['nullable', 'regex:/^\d{3}\s?\d{2}$/', 'required_with:'.$anyAddressField],
+            'state' => [
+                'nullable',
+                'string',
+                'required_with:'.$anyAddressField,
+                Rule::exists((new State)->getTable(), 'name')->where('country_id', $country->id),
+            ],
+            'contact_phone' => ['nullable', 'string', 'max:30'],
+            'recovery_consent' => ['boolean'],
+        ]);
+
+        $invoice = $request->boolean('invoice');
+
+        $this->account->updateProfile($user, [
+            'first_name' => $data['first_name'] ?? null,
+            'last_name' => $data['last_name'] ?? null,
+            'company_name' => $invoice ? $data['company_name'] : null,
+            'tax_identifier' => $invoice ? $data['tax_identifier'] : null,
+        ]);
+
+        if (filled($data['line_one'] ?? null)) {
+            $addressData = [
+                ...collect($data)->only(self::ADDRESS_FIELDS)->all(),
+                'first_name' => $data['first_name'],
+                'last_name' => $data['last_name'],
+                'country_id' => $country->id,
+                'contact_email' => $user->email,
+                'shipping_default' => true,
+                'billing_default' => true,
+            ];
+
+            $existing = $this->defaultAddress($user);
+
+            $existing
+                ? $this->account->updateAddress($user, $existing->id, $addressData)
+                : $this->account->createAddress($user, $addressData);
+        }
+
+        $this->updateRecoveryConsent($user, $request->boolean('recovery_consent'));
+
+        return redirect()->route('account')->with('status', __('storefront.account.saved'));
+    }
+
+    /**
+     * "Email me a reminder if I don't finish my order", as a standing
+     * choice — stored on the customer via boboko-core's
+     * CustomerAccountService::setRecoveryConsent(), and applied to the
+     * current cart too, so opting out stops reminders for it right away.
+     */
+    private function updateRecoveryConsent($user, bool $consent): void
+    {
+        $this->account->setRecoveryConsent($user, $consent);
+
+        // Only an existing cart; never create one just to record this.
+        $cart = app(CartService::class)->current();
+
+        if ($cart && (bool) data_get($cart, 'meta.recovery_consent') !== $consent) {
+            app(CheckoutService::class)->setRecoveryConsent($consent);
+        }
+    }
+
+    /**
+     * Self-service deletion: opens core's 30-day grace-period erasure request
+     * (which blocks the login right away) and logs out. Logging back in within
+     * the grace period cancels it; see core's docs/privacy.md.
+     */
+    public function destroy(string $locale, Request $request, PrivacyService $privacy): RedirectResponse
+    {
+        $user = $request->user();
+
+        $privacy->requestErasureForUser($user, $user);
+
+        Auth::logout();
+
+        $request->session()->invalidate();
+        $request->session()->regenerateToken();
+
+        return redirect()->route('login')->with('status', __('storefront.account.deletion_requested'));
+    }
+
+    private function defaultAddress($user)
+    {
+        $addresses = collect($this->account->addresses($user));
+
+        return $addresses->firstWhere('shipping_default', true) ?? $addresses->first();
+    }
+
+    private function storeCountry(): Country
+    {
+        return Country::where('iso3', self::STORE_COUNTRY_ISO3)->firstOrFail();
+    }
+}

app/Http/Controllers/Account/EmailController.php

@@ -0,0 +1,123 @@
+<?php
+
+namespace App\Http\Controllers\Account;
+
+use App\Http\Controllers\Controller;
+use Illuminate\Http\RedirectResponse;
+use Illuminate\Http\Request;
+use Illuminate\Support\Str;
+use Illuminate\Validation\Rule;
+use Illuminate\View\View;
+use Modules\Core\Auth\Exceptions\OtpThrottledException;
+use Modules\Core\Customer\Exceptions\EmailAlreadyTakenException;
+use Modules\Core\Customer\Exceptions\InvalidEmailChangeCodeException;
+use Modules\Core\Customer\Services\CustomerEmailChangeService;
+
+/**
+ * Changing the login email — a thin wrapper over boboko-core's
+ * Customer\Services\CustomerEmailChangeService, which owns the actual
+ * request/confirm mechanics, throttling, pending-change storage, and
+ * mailables. This controller's own job is just the storefront's session-
+ * scoped "which email did I just ask to switch to" UI state (so the
+ * .code/.resend pages know which address to show/resend to) and
+ * translating the service's exceptions into the flash-message flow the
+ * views expect.
+ */
+class EmailController extends Controller
+{
+    private const SESSION_KEY = 'pending_email_change';
+
+    public function edit(string $locale, Request $request): View
+    {
+        return view('account.email', ['user' => $request->user()]);
+    }
+
+    public function send(string $locale, Request $request, CustomerEmailChangeService $emailChange): RedirectResponse
+    {
+        $user = $request->user();
+
+        $request->merge(['email' => Str::lower(trim((string) $request->input('email')))]);
+
+        $validated = $request->validate([
+            'email' => [
+                'required',
+                'email',
+                'max:255',
+                Rule::notIn([$user->email]),
+            ],
+        ], [
+            'email.not_in' => __('storefront.account.email_same'),
+        ]);
+
+        try {
+            $emailChange->request($user, $validated['email']);
+        } catch (EmailAlreadyTakenException) {
+            return back()->withInput()->withErrors(['email' => __('storefront.account.email_taken')]);
+        } catch (OtpThrottledException) {
+            return back()->withInput()->withErrors(['email' => __('storefront.auth.too_many_codes')]);
+        }
+
+        $request->session()->put(self::SESSION_KEY, $validated['email']);
+
+        return redirect()->route('account.email.code');
+    }
+
+    public function code(string $locale, Request $request): View|RedirectResponse
+    {
+        $pendingEmail = $request->session()->get(self::SESSION_KEY);
+
+        if (! $pendingEmail) {
+            return redirect()->route('account.email.edit');
+        }
+
+        return view('account.email-code', ['email' => $pendingEmail]);
+    }
+
+    public function resend(string $locale, Request $request, CustomerEmailChangeService $emailChange): RedirectResponse
+    {
+        $pendingEmail = $request->session()->get(self::SESSION_KEY);
+
+        if (! $pendingEmail) {
+            return redirect()->route('account.email.edit');
+        }
+
+        try {
+            $emailChange->request($request->user(), $pendingEmail);
+        } catch (EmailAlreadyTakenException) {
+            $request->session()->forget(self::SESSION_KEY);
+
+            return redirect()->route('account.email.edit')
+                ->withErrors(['email' => __('storefront.account.email_taken')]);
+        } catch (OtpThrottledException) {
+            return back()->withErrors(['code' => __('storefront.auth.too_many_codes')]);
+        }
+
+        return back()->with('status', __('storefront.auth.code_resent'));
+    }
+
+    public function verify(string $locale, Request $request, CustomerEmailChangeService $emailChange): RedirectResponse
+    {
+        $pendingEmail = $request->session()->get(self::SESSION_KEY);
+
+        if (! $pendingEmail) {
+            return redirect()->route('account.email.edit');
+        }
+
+        $validated = $request->validate(['code' => ['required', 'digits:6']]);
+
+        try {
+            $emailChange->confirm($request->user(), $validated['code']);
+        } catch (EmailAlreadyTakenException) {
+            $request->session()->forget(self::SESSION_KEY);
+
+            return redirect()->route('account.email.edit')
+                ->withErrors(['email' => __('storefront.account.email_taken')]);
+        } catch (InvalidEmailChangeCodeException) {
+            return back()->withErrors(['code' => __('storefront.auth.invalid_code')]);
+        }
+
+        $request->session()->forget(self::SESSION_KEY);
+
+        return redirect()->route('account')->with('status', __('storefront.account.email_changed'));
+    }
+}

app/Http/Controllers/Account/OrderController.php

@@ -0,0 +1,50 @@
+<?php
+
+namespace App\Http\Controllers\Account;
+
+use App\Http\Controllers\Controller;
+use Illuminate\Http\Request;
+use Illuminate\View\View;
+use Modules\Core\Payment\Models\PaymentMethod;
+use Modules\Core\Customer\Exceptions\OrderNotFoundException;
+use Modules\Core\Customer\Services\CustomerAccountService;
+
+/**
+ * Order history. Every lookup goes through CustomerAccountService, which only
+ * ever returns the logged-in user's own placed orders, so an order id from
+ * the URL can't reach someone else's order.
+ */
+class OrderController extends Controller
+{
+    public function __construct(
+        private readonly CustomerAccountService $account,
+    ) {}
+
+    public function index(string $locale, Request $request): View
+    {
+        return view('account.orders.index', [
+            'orders' => $this->account->orders($request->user(), 15),
+        ]);
+    }
+
+    public function show(string $locale, Request $request, int $orderId): View
+    {
+        try {
+            $order = $this->account->order($request->user(), $orderId);
+        } catch (OrderNotFoundException) {
+            abort(404);
+        }
+
+        // By type, like the checkout confirmation: the method may since have
+        // been disabled, but the order still shows what was used.
+        $paymentMethodName = PaymentMethod::where('type', $order->meta['payment_method'] ?? null)
+            ->first()
+            ?->translate('name');
+
+        return view('account.orders.show', [
+            'order' => $order,
+            'paymentMethodName' => $paymentMethodName,
+            'shipments' => $order->shipments->whereNull('cancelled_at')->whereNotNull('tracking_reference'),
+        ]);
+    }
+}

app/Http/Controllers/Auth/LoginController.php

@@ -0,0 +1,135 @@
+<?php
+
+namespace App\Http\Controllers\Auth;
+
+use App\Http\Controllers\Controller;
+use App\Rules\HCaptcha;
+use Illuminate\Http\RedirectResponse;
+use Illuminate\Http\Request;
+use Illuminate\Support\Facades\Auth;
+use Illuminate\Support\Str;
+use Illuminate\View\View;
+use Modules\Core\Auth\Exceptions\OtpThrottledException;
+use Modules\Core\Auth\Services\UserOtpService;
+
+/**
+ * Passwordless customer login: email → emailed 6-digit code → logged in.
+ * Login and registration are the same flow — UserOtpService::generateAndSend()
+ * find-or-creates the user (and its Customer).
+ *
+ * All the security lives in UserOtpService: per-email code-request throttling
+ * (OtpThrottledException), wrong-guess lockout, the Auth::login() itself (which
+ * also regenerates the session and merges the guest cart via Lunar's Login
+ * listener) and the session-registry record. This controller only moves the
+ * shopper between the two steps, carrying the email in the session rather
+ * than the URL.
+ */
+class LoginController extends Controller
+{
+    /**
+     * `?redirect=/el/checkout` (e.g. from the checkout's login tab) becomes the
+     * intended URL that verify() returns to. Only a same-site path is accepted:
+     * no scheme, no protocol-relative `//host`, so it can't redirect off-site.
+     */
+    public function create(string $locale, Request $request): View
+    {
+        $redirect = (string) $request->query('redirect', '');
+
+        if (preg_match('#^/(?![/\\\\])#', $redirect)) {
+            $request->session()->put('url.intended', url($redirect));
+        }
+
+        return view('auth.login');
+    }
+
+    public function send(string $locale, Request $request, UserOtpService $otp): RedirectResponse
+    {
+        // Captcha only here: verify() and resend() need the email this step
+        // puts in the session, so they can't be reached without passing it.
+        $validated = $request->validate([
+            'email' => ['required', 'email', 'max:255'],
+            'h-captcha-response' => ['bail', 'required', new HCaptcha],
+        ], [
+            'h-captcha-response.required' => __('storefront.auth.captcha_failed'),
+        ]);
+
+        $email = Str::lower(trim($validated['email']));
+
+        try {
+            $otp->generateAndSend($email);
+        } catch (OtpThrottledException) {
+            return back()->withInput()->withErrors([
+                'email' => __('storefront.auth.too_many_codes'),
+            ]);
+        }
+
+        $request->session()->put('login.email', $email);
+
+        return redirect()->route('login.code');
+    }
+
+    public function code(string $locale, Request $request): View|RedirectResponse
+    {
+        $email = $request->session()->get('login.email');
+
+        if (! $email) {
+            return redirect()->route('login');
+        }
+
+        return view('auth.login-code', ['email' => $email]);
+    }
+
+    public function resend(string $locale, Request $request, UserOtpService $otp): RedirectResponse
+    {
+        $email = $request->session()->get('login.email');
+
+        if (! $email) {
+            return redirect()->route('login');
+        }
+
+        try {
+            $otp->generateAndSend($email);
+        } catch (OtpThrottledException) {
+            return back()->withErrors([
+                'code' => __('storefront.auth.too_many_codes'),
+            ]);
+        }
+
+        return back()->with('status', __('storefront.auth.code_resent'));
+    }
+
+    public function verify(string $locale, Request $request, UserOtpService $otp): RedirectResponse
+    {
+        $email = $request->session()->get('login.email');
+
+        if (! $email) {
+            return redirect()->route('login');
+        }
+
+        $validated = $request->validate([
+            'code' => ['required', 'digits:6'],
+        ]);
+
+        // Wrong, expired, or locked out after too many guesses — core doesn't
+        // say which, so neither do we; the page offers "resend code" for all three.
+        if (! $otp->validate($email, $validated['code'], $request)) {
+            return back()->withErrors([
+                'code' => __('storefront.auth.invalid_code'),
+            ]);
+        }
+
+        $request->session()->forget('login.email');
+
+        return redirect()->intended(route('home'));
+    }
+
+    public function destroy(string $locale, Request $request): RedirectResponse
+    {
+        Auth::logout();
+
+        $request->session()->invalidate();
+        $request->session()->regenerateToken();
+
+        return redirect()->route('home');
+    }
+}

app/Http/Controllers/ContactController.php

@@ -2,10 +2,71 @@
 
 namespace App\Http\Controllers;
 
+use App\Http\Requests\ContactRequest;
+use App\Mail\ContactConfirmationMail;
+use App\Mail\ContactMessageMail;
+use Illuminate\Http\RedirectResponse;
+use Illuminate\Support\Facades\Log;
+use Illuminate\Support\Facades\Mail;
+use Illuminate\Support\Facades\RateLimiter;
+use Illuminate\View\View;
+use Throwable;
+
+/**
+ * Contact form. Nothing is stored: the message is emailed to the store
+ * (CONTACT_EMAIL) and the sender gets a generic confirmation. Both are sent
+ * synchronously so a failed store email can be reported back on the form.
+ *
+ * Limited per IP in here rather than with throttle middleware, so the limit
+ * shows as a message on the form instead of a bare 429 page.
+ */
 class ContactController extends Controller
 {
-    public function index(string $locale)
+    private const SEND_LIMIT = 3;
+    private const SEND_DECAY_SECONDS = 600;
+
+    public function index(string $locale): View
     {
         return view('contact');
     }
+
+    public function send(string $locale, ContactRequest $request): RedirectResponse
+    {
+        $key = 'contact:'.$request->ip();
+
+        if (RateLimiter::tooManyAttempts($key, self::SEND_LIMIT)) {
+            return back()->withInput()->with('contact_error', __('storefront.contact.too_many'));
+        }
+
+        RateLimiter::hit($key, self::SEND_DECAY_SECONDS);
+
+        $data = $request->validated();
+        $to = config('services.contact.email');
+
+        try {
+            if (blank($to)) {
+                throw new \RuntimeException('CONTACT_EMAIL is not set.');
+            }
+
+            Mail::to($to)->send(new ContactMessageMail(
+                $data['name'],
+                $data['email'],
+                $data['message'],
+                $locale,
+            ));
+        } catch (Throwable $e) {
+            Log::error('Contact form: store email failed', ['exception' => $e]);
+
+            return back()->withInput()->with('contact_error', __('storefront.contact.send_failed'));
+        }
+
+        // The store already has the message, so a failed confirmation is only logged.
+        try {
+            Mail::to($data['email'])->locale($locale)->send(new ContactConfirmationMail);
+        } catch (Throwable $e) {
+            Log::warning('Contact form: confirmation email failed', ['exception' => $e]);
+        }
+
+        return redirect()->route('contact')->with('status', __('storefront.contact.sent'));
+    }
 }

app/Http/Controllers/CustomFieldUploadController.php

@@ -0,0 +1,62 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use Illuminate\Http\Request;
+use Modules\Core\File\Http\Controllers\UploadFileController;
+
+/**
+ * Stores the shopper's photo for a product custom field of type `file` (see
+ * boboko-core's Product::$custom_fields) the moment it's picked on the product
+ * page — before add-to-cart, see custom-field-upload-controller.js.
+ *
+ * Which files are acceptable (extensions, size) is a per-site decision — this
+ * site: photographs — so it lives here as this app's own policy, extending
+ * boboko-core's Modules\Core\File\Http\Controllers\UploadFileController for
+ * the actual store()/validate()/respond() mechanics. The module's add-to-cart
+ * endpoint only ever receives the stored File row's own `id` — FileService is
+ * the single source of truth for disk/path/name/mime, never duplicated into
+ * cart/order line meta (see Checkout\CartController::customFieldsMeta()). A
+ * shopper can't point a cart line at someone else's file: CartController only
+ * accepts an id that is both unowned and tagged with this exact PURPOSE.
+ *
+ * Stored on the private `local` disk: these are customers' personal photos,
+ * never reachable by a public URL except through FileService's own signed
+ * download route. Uploads nobody adds to a cart are removed by core's
+ * `boboko:file:prune-unowned custom-field-upload` command.
+ */
+class CustomFieldUploadController extends UploadFileController
+{
+    public const PURPOSE = 'custom-field-upload';
+
+    public const MAX_KILOBYTES = 10240;
+
+    public const EXTENSIONS = ['jpg', 'jpeg', 'png', 'webp', 'heic', 'heif'];
+
+    /**
+     * For the file input's `accept` attribute — same list the server enforces.
+     */
+    public static function accept(): string
+    {
+        return '.'.implode(',.', self::EXTENSIONS);
+    }
+
+    protected function purpose(): string
+    {
+        return self::PURPOSE;
+    }
+
+    protected function validationRules(Request $request): array
+    {
+        return [
+            'file' => ['required', 'file', 'mimes:'.implode(',', self::EXTENSIONS), 'max:'.self::MAX_KILOBYTES],
+        ];
+    }
+
+    // `label` is the admin-authored field label, only used as the
+    // :attribute in the validation message shown next to that field.
+    protected function validationAttributes(Request $request): array
+    {
+        return ['file' => (string) $request->input('label', 'file')];
+    }
+}

app/Http/Controllers/ProductController.php

@@ -4,8 +4,15 @@
 
 use App\Catalog\ProductListing;
 use App\Catalog\ProductListingPage;
+use Illuminate\Http\JsonResponse;
+use Illuminate\Http\RedirectResponse;
+use Illuminate\Http\Request;
 use Illuminate\Http\Response;
+use Illuminate\Support\Facades\Validator;
+use Lunar\Models\Product;
+use Lunar\Models\ProductVariant;
 use Modules\Core\Catalog\Services\ProductService;
+use Modules\Core\Review\Models\ProductReview;
 
 class ProductController extends Controller
 {
@@ -35,18 +42,208 @@ public function show(string $locale, int $id)
         $product = $this->products->getById($id);
         abort_if($product === null, Response::HTTP_NOT_FOUND);
 
+        $product = $this->mergeJustSubmittedReview($product);
+
         $collection = $product['collections'][0] ?? null;
-
-        $variantsData = $this->products->variantSummaries($product);
-
-        $firstVariant = $product['variants'][0] ?? null;
-        $option = $firstVariant['options'][0]['option'] ?? null;
+        // dd($product);
+        [$productOptions, $variantsData] = $this->buildOptionPicker($id);
 
         return view('product.show', [
             'collection' => $collection,
             'product' => $product,
-            'option' => $option,
+            'productOptions' => $productOptions,
             'variantsData' => $variantsData,
         ]);
     }
+
+    /**
+     * One button/swatch group per product option (a product can have several
+     * — e.g. a custom-photo product with size + style + person-count, each
+     * combination resolved client-side to one exact ProductVariant, see
+     * product-form-controller.js) plus the per-variant data the picker
+     * resolves a selection against.
+     *
+     * Reads live Eloquent rather than the Meilisearch-indexed $product array
+     * the rest of the page uses (same reasoning as checkStock() below): the
+     * index has no concept of option/value display order (Lunar's
+     * `position` column) or a stable value id, both of which the picker
+     * needs — to render values in the merchant's intended order, and to
+     * match a combination back to one exact variant without relying on
+     * translated label strings staying unique.
+     *
+     * @return array{0: array, 1: array}
+     */
+    private function buildOptionPicker(int $productId): array
+    {
+        $variants = ProductVariant::query()
+            ->where('product_id', $productId)
+            ->with(['values.option', 'prices', 'images'])
+            ->get();
+
+        $productOptions = $variants
+            ->flatMap(fn (ProductVariant $variant) => $variant->values)
+            ->unique('id')
+            ->groupBy(fn ($value) => $value->option->handle)
+            ->map(function ($values, $handle) {
+                $sorted = $values->sortBy([['position', 'asc'], ['id', 'asc']]);
+
+                return [
+                    'handle' => $handle,
+                    'label' => $sorted->first()->option->translate('name'),
+                    // The "Color" option type is the only one that writes a
+                    // hex code into meta (see boboko/core's ColorOptionType)
+                    // — its presence is how we tell a color option (swatches)
+                    // from any other option (buttons).
+                    'isColor' => $sorted->contains(fn ($v) => !empty($v->meta['hex'] ?? null)),
+                    'values' => $sorted->map(fn ($v) => [
+                        'id' => $v->id,
+                        'label' => $v->translate('name'),
+                        'hex' => $v->meta['hex'] ?? null,
+                    ])->values()->all(),
+                ];
+            })
+            ->values()
+            ->all();
+
+        $variantsData = $variants->map(fn (ProductVariant $variant) => [
+            'id' => $variant->id,
+            'price' => $variant->prices->first()?->price?->decimal(),
+            'image' => $variant->images->first()?->getUrl(),
+            // Live from the DB (not the index's in_stock), with Lunar's own
+            // purchasability rule — drives the disabled add-to-cart button.
+            'inStock' => $variant->canBeFulfilledAtQuantity(1),
+            // handle => selected value id, for matching a combination of
+            // selections back to this variant — see selectVariant() in
+            // product-form-controller.js.
+            'options' => $variant->values->mapWithKeys(fn ($v) => [$v->option->handle => $v->id])->all(),
+        ])->values()->all();
+
+        return [$productOptions, $variantsData];
+    }
+
+    /**
+     * Meilisearch's own write API is itself async — addDocuments() enqueues an
+     * indexing task and returns immediately, and Laravel\Scout\Engines\
+     * MeilisearchEngine::update() never waits on that task, so even
+     * $product->searchableSync() (which only skips OUR queue) can still land
+     * the shopper back on this page before Meilisearch has actually processed
+     * the write. storeReview() flashes the review it just created for exactly
+     * this one next request; splice it in here rather than trust the index is
+     * already caught up. Guarded by id so a race the other way — the index
+     * DID catch up in time — doesn't show the same review twice.
+     */
+    private function mergeJustSubmittedReview(array $product): array
+    {
+        $justSubmitted = session('justSubmittedReview');
+
+        if (! $justSubmitted || (string) ($justSubmitted['product_id'] ?? null) !== (string) $product['id']) {
+            return $product;
+        }
+
+        $items = $product['reviews']['items'] ?? [];
+
+        if (collect($items)->contains('id', $justSubmitted['id'])) {
+            return $product;
+        }
+
+        $items = [$justSubmitted, ...$items];
+
+        $product['reviews']['items'] = $items;
+        $product['reviews']['count'] = count($items);
+        $product['reviews']['average_rating'] = round(collect($items)->avg('rating'), 1);
+
+        return $product;
+    }
+
+    /**
+     * A storefront-owned, checkout-module-independent stock check — the
+     * product page's "Add to cart" calls this first and only submits to the
+     * checkout module's own add-to-cart endpoint once this says `ok`. Reads
+     * the live Eloquent ProductVariant directly (not the Meilisearch index
+     * ProductService otherwise reads from, which can lag behind an actual
+     * sale until the next reindex) via the SAME method Lunar's own
+     * CartLineStock validator calls, so this can never disagree with what
+     * the module's own server-side check would decide.
+     */
+    public function checkStock(string $locale, Request $request): JsonResponse
+    {
+        $data = $request->validate([
+            'variant' => ['required', 'integer'],
+            'quantity' => ['nullable', 'integer', 'min:1'],
+        ]);
+
+        $variant = ProductVariant::find($data['variant']);
+        $quantity = $data['quantity'] ?? 1;
+
+        if ($variant === null) {
+            return response()->json(['ok' => true]);
+        }
+
+        return response()->json([
+            'ok' => $variant->canBeFulfilledAtQuantity($quantity),
+            'stock' => $variant->purchasable === 'always' ? null : $variant->getTotalInventory(),
+        ]);
+    }
+
+    /**
+     * boboko/core's product_reviews table has no moderation/status column, so
+     * this goes live immediately — no approval queue to land in.
+     */
+    public function storeReview(string $locale, Request $request, Product $product): RedirectResponse
+    {
+        $reviewsUrl = route('product.show', [
+            'locale' => $locale,
+            'id' => $product->id,
+            'tab' => 'reviews',
+        ]).'#product-tabs';
+
+        $validator = Validator::make($request->all(), [
+            'rating' => ['required', 'integer', 'between:1,5'],
+            'content' => ['required', 'string'],
+            'name' => ['nullable', 'string', 'max:255'],
+            'email' => ['required', 'email'],
+        ]);
+
+        if ($validator->fails()) {
+            return redirect($reviewsUrl)->withErrors($validator)->withInput();
+        }
+
+        $data = $validator->validated();
+
+        // Not $product->reviews()->create(...): that relation only exists via a
+        // Product::macro() registered in CorePlugin::register(Panel $panel), which
+        // Filament calls solely when the /boboko admin panel boots — never on a
+        // plain storefront request, where the macro is simply undefined.
+        $review = ProductReview::create([
+            'product_id' => $product->id,
+            'rating' => $data['rating'],
+            'body' => $data['content'],
+            'reviewer_name' => $data['name'] ?? null,
+            'reviewer_email' => $data['email'],
+            'reviewed_at' => now(),
+            'source' => 'storefront',
+        ]);
+
+        // ReviewServiceProvider also reindexes on the model's `created` event, but
+        // queued (SCOUT_QUEUE=true) — it wouldn't land before this redirect's page
+        // load. Syncing here skips our queue too, but Meilisearch's own write API
+        // is itself async on top of that (see mergeJustSubmittedReview()), so this
+        // alone still isn't a guarantee — it's the flash below that actually is.
+        $product->searchableSync();
+
+        return redirect($reviewsUrl)
+            ->with('reviewSubmitted', true)
+            ->with('justSubmittedReview', [
+                'id' => $review->id,
+                'product_id' => $review->product_id,
+                'title' => $review->title,
+                'body' => $review->body,
+                'rating' => $review->rating,
+                'reviewed_at' => $review->reviewed_at?->timestamp,
+                'reviewer_name' => $review->reviewer_name,
+                'reply' => null,
+                'replied_at' => null,
+                'media' => [],
+            ]);
+    }
 }

app/Http/Controllers/WishlistController.php

@@ -0,0 +1,72 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use App\Catalog\ProductCard;
+use App\Services\Wishlist;
+use Illuminate\Http\JsonResponse;
+use Illuminate\Http\RedirectResponse;
+use Illuminate\Http\Request;
+use Illuminate\Support\Collection;
+use Illuminate\View\View;
+use Lunar\Models\Product;
+use Modules\Core\Catalog\Services\ProductService;
+
+class WishlistController extends Controller
+{
+    public function __construct(
+        private readonly Wishlist $wishlist,
+    ) {}
+
+    /**
+     * The account's wishlist page.
+     */
+    public function index(string $locale, ProductService $products): View
+    {
+        return view('account.wishlist', ['products' => $this->products($products)]);
+    }
+
+    /**
+     * The same list for a guest, from their cookie. Logged-in users are sent
+     * to the account version.
+     */
+    public function guest(string $locale, ProductService $products): View|RedirectResponse
+    {
+        if (auth()->check()) {
+            return redirect()->route('account.wishlist');
+        }
+
+        return view('wishlist.guest', ['products' => $this->products($products)]);
+    }
+
+    /**
+     * Adds or removes a product, for guests and logged-in shoppers alike. The
+     * heart button's Stimulus controller asks for JSON; without JS the form
+     * posts normally and comes back to the same page.
+     */
+    public function toggle(string $locale, Request $request, int $productId): JsonResponse|RedirectResponse
+    {
+        abort_unless(Product::whereKey($productId)->exists(), 404);
+
+        $active = $this->wishlist->toggle($productId);
+
+        if ($request->expectsJson()) {
+            return response()->json(['active' => $active]);
+        }
+
+        return back();
+    }
+
+    /**
+     * Product cards for the current wishlist, newest first. Products no longer
+     * in the search index (deleted, unpublished) are simply skipped.
+     */
+    private function products(ProductService $products): Collection
+    {
+        return collect($this->wishlist->ids())
+            ->map(fn (int $id) => $products->getById($id))
+            ->filter()
+            ->map(fn (array $product) => ['id' => $product['id'], ...ProductCard::fromIndexed($product)])
+            ->values();
+    }
+}

app/Http/Requests/ContactRequest.php

@@ -0,0 +1,31 @@
+<?php
+
+namespace App\Http\Requests;
+
+use App\Rules\HCaptcha;
+use Illuminate\Foundation\Http\FormRequest;
+
+class ContactRequest extends FormRequest
+{
+    public function authorize(): bool
+    {
+        return true;
+    }
+
+    public function rules(): array
+    {
+        return [
+            'name' => ['required', 'string', 'max:100'],
+            'email' => ['required', 'email', 'max:255'],
+            'message' => ['required', 'string', 'max:5000'],
+            'h-captcha-response' => ['bail', 'required', new HCaptcha],
+        ];
+    }
+
+    public function messages(): array
+    {
+        return [
+            'h-captcha-response.required' => __('storefront.auth.captcha_failed'),
+        ];
+    }
+}

app/Listeners/MergeGuestWishlistOnLogin.php

@@ -0,0 +1,23 @@
+<?php
+
+namespace App\Listeners;
+
+use App\Services\Wishlist;
+use Modules\Core\Auth\Events\UserAuthenticated;
+
+/**
+ * Picked up by Laravel's listener discovery (app/Listeners), no manual
+ * registration. Runs inside the login request, so it can read the guest
+ * wishlist cookie and queue its removal.
+ */
+class MergeGuestWishlistOnLogin
+{
+    public function __construct(
+        private readonly Wishlist $wishlist,
+    ) {}
+
+    public function handle(UserAuthenticated $event): void
+    {
+        $this->wishlist->mergeGuestInto($event->user);
+    }
+}

app/Listeners/SaveAddressFromFirstOrder.php

@@ -0,0 +1,57 @@
+<?php
+
+namespace App\Listeners;
+
+use Lunar\Models\Order;
+use Modules\Core\Checkout\Events\OrderPlaced;
+use Modules\Core\Customer\Services\CustomerAccountService;
+
+/**
+ * When a logged-in shopper places an order and their account has no saved
+ * address yet, the order's shipping address (and their name, if the profile
+ * has none) becomes the account's. Never overwrites anything already saved.
+ *
+ * Uses the order's own user, not Auth: OrderPlaced can fire from a payment
+ * webhook, where nobody is logged in. Picked up by listener discovery.
+ */
+class SaveAddressFromFirstOrder
+{
+    public function __construct(
+        private readonly CustomerAccountService $account,
+    ) {}
+
+    public function handle(OrderPlaced $event): void
+    {
+        $order = $event->order;
+        $user = $order->user;
+        $shipping = $order->shippingAddress;
+
+        if (! $user || ! $shipping || ! $shipping->line_one) {
+            return;
+        }
+
+        $customer = $this->account->customer($user);
+
+        if (! $customer) {
+            return;
+        }
+
+        if (! $customer->first_name && ! $customer->last_name) {
+            $this->account->updateProfile($user, [
+                'first_name' => $shipping->first_name,
+                'last_name' => $shipping->last_name,
+            ]);
+        }
+
+        if (collect($this->account->addresses($user))->isNotEmpty()) {
+            return;
+        }
+
+        $this->account->createAddress($user, [
+            ...$shipping->only(['first_name', 'last_name', 'line_one', 'city', 'state', 'postcode', 'country_id', 'contact_phone']),
+            'contact_email' => $user->email,
+            'shipping_default' => true,
+            'billing_default' => true,
+        ]);
+    }
+}

app/Mail/ContactConfirmationMail.php

@@ -0,0 +1,25 @@
+<?php
+
+namespace App\Mail;
+
+use Illuminate\Mail\Mailable;
+use Illuminate\Mail\Mailables\Content;
+use Illuminate\Mail\Mailables\Envelope;
+
+/**
+ * Sent to whoever submitted the contact form. Deliberately generic: it never
+ * repeats what they wrote, so the form can't be used to deliver arbitrary text
+ * to someone else's inbox.
+ */
+class ContactConfirmationMail extends Mailable
+{
+    public function envelope(): Envelope
+    {
+        return new Envelope(subject: __('storefront.contact.confirmation_subject'));
+    }
+
+    public function content(): Content
+    {
+        return new Content(view: 'emails.contact-confirmation');
+    }
+}

app/Mail/ContactMessageMail.php

@@ -0,0 +1,35 @@
+<?php
+
+namespace App\Mail;
+
+use Illuminate\Mail\Mailable;
+use Illuminate\Mail\Mailables\Address;
+use Illuminate\Mail\Mailables\Content;
+use Illuminate\Mail\Mailables\Envelope;
+
+/**
+ * A contact-form message, sent to the store's CONTACT_EMAIL. Reply-To is the
+ * sender, so replying from the inbox goes straight to them.
+ */
+class ContactMessageMail extends Mailable
+{
+    public function __construct(
+        public readonly string $senderName,
+        public readonly string $senderEmail,
+        public readonly string $body,
+        public readonly string $senderLocale,
+    ) {}
+
+    public function envelope(): Envelope
+    {
+        return new Envelope(
+            replyTo: [new Address($this->senderEmail, $this->senderName)],
+            subject: "Νέο μήνυμα επικοινωνίας από {$this->senderName}",
+        );
+    }
+
+    public function content(): Content
+    {
+        return new Content(view: 'emails.contact-message');
+    }
+}

app/Models/User.php

@@ -18,10 +18,6 @@ class User extends Authenticatable implements LunarUserInterface
     /** @use HasFactory<UserFactory> */
     use HasFactory, Notifiable;
 
-    protected $dispatchesEvents = [
-        'created' => UserCreated::class,
-    ];
-
     /**
      * The attributes that are mass assignable.
      *

app/Models/WishlistItem.php

@@ -0,0 +1,14 @@
+<?php
+
+namespace App\Models;
+
+use Illuminate\Database\Eloquent\Model;
+
+/**
+ * One product on a logged-in user's wishlist. Guests' wishlists live in a
+ * cookie instead — see App\Services\Wishlist.
+ */
+class WishlistItem extends Model
+{
+    protected $fillable = ['user_id', 'product_id'];
+}

app/Providers/AppServiceProvider.php

@@ -17,6 +17,13 @@
 
 class AppServiceProvider extends ServiceProvider
 {
+    public function register(): void
+    {
+        // One instance per request: it caches the guest cookie's ids, so a
+        // toggle and a later has() in the same request agree.
+        $this->app->scoped(\App\Services\Wishlist::class);
+    }
+
     public function boot(): void
     {
         Telemetry::optOut();

app/Rules/HCaptcha.php

@@ -0,0 +1,66 @@
+<?php
+
+namespace App\Rules;
+
+use Closure;
+use Illuminate\Contracts\Validation\ValidationRule;
+use Illuminate\Http\Client\ConnectionException;
+use Illuminate\Support\Facades\Http;
+use Illuminate\Support\Facades\Log;
+
+/**
+ * Verifies the `h-captcha-response` token the hCaptcha widget adds to a form.
+ * Use it as `'h-captcha-response' => ['required', new HCaptcha]`.
+ *
+ * Fails closed: if hCaptcha can't be reached the submission is rejected, since
+ * letting it through would reopen the hole this exists to close (bots making
+ * us send email to arbitrary addresses).
+ */
+class HCaptcha implements ValidationRule
+{
+    public function validate(string $attribute, mixed $value, Closure $fail): void
+    {
+        if (! is_string($value) || $value === '') {
+            $fail(__('storefront.auth.captcha_failed'));
+
+            return;
+        }
+
+        try {
+            $response = Http::asForm()
+                ->timeout(5)
+                ->post('https://api.hcaptcha.com/siteverify', [
+                    'secret' => config('services.hcaptcha.secret'),
+                    'response' => $value,
+                    // Rejects tokens solved against someone else's sitekey.
+                    'sitekey' => config('services.hcaptcha.sitekey'),
+                    'remoteip' => request()->ip(),
+                ]);
+        } catch (ConnectionException $e) {
+            Log::warning('hCaptcha siteverify unreachable', ['error' => $e->getMessage()]);
+            $fail(__('storefront.auth.captcha_failed'));
+
+            return;
+        }
+
+        if (! $response->successful() || $response->json('success') !== true) {
+            // A bad/missing secret or sitekey would otherwise look like every
+            // shopper failing the captcha.
+            $configErrors = array_intersect((array) $response->json('error-codes'), [
+                'missing-input-secret',
+                'invalid-input-secret',
+                'sitekey-secret-mismatch',
+                'invalid-sitekey',
+            ]);
+
+            if ($response->failed() || $configErrors) {
+                Log::warning('hCaptcha siteverify error', [
+                    'status' => $response->status(),
+                    'error-codes' => $response->json('error-codes'),
+                ]);
+            }
+
+            $fail(__('storefront.auth.captcha_failed'));
+        }
+    }
+}

app/Services/Wishlist.php

@@ -0,0 +1,126 @@
+<?php
+
+namespace App\Services;
+
+use App\Models\WishlistItem;
+use Illuminate\Contracts\Auth\Authenticatable;
+use Illuminate\Support\Facades\Auth;
+use Illuminate\Support\Facades\Cookie;
+
+/**
+ * The current shopper's wishlist, product ids only.
+ *
+ * Logged in: rows in wishlist_items. Guest: a 1-year cookie holding the ids
+ * (encrypted like every cookie, by the web group's EncryptCookies), so nothing
+ * is written to the database for anonymous visitors. On login the cookie is
+ * merged into the account and cleared (MergeGuestWishlistOnLogin).
+ */
+class Wishlist
+{
+    public const COOKIE = 'wishlist';
+
+    private const COOKIE_MINUTES = 60 * 24 * 365;
+
+    // Keeps the cookie well under the 4KB browser limit.
+    private const GUEST_MAX = 100;
+
+    /** @var array<int>|null ids for this request, including a toggle just made */
+    private ?array $guestIds = null;
+
+    /** @return array<int> newest first */
+    public function ids(): array
+    {
+        if ($user = Auth::user()) {
+            return WishlistItem::where('user_id', $user->id)
+                ->latest('id')
+                ->pluck('product_id')
+                ->all();
+        }
+
+        return $this->guestIds();
+    }
+
+    public function has(int $productId): bool
+    {
+        return in_array($productId, $this->ids(), true);
+    }
+
+    /**
+     * @return bool whether the product is on the wishlist afterwards
+     */
+    public function toggle(int $productId): bool
+    {
+        if ($user = Auth::user()) {
+            $deleted = WishlistItem::where('user_id', $user->id)->where('product_id', $productId)->delete();
+
+            if ($deleted) {
+                return false;
+            }
+
+            WishlistItem::create(['user_id' => $user->id, 'product_id' => $productId]);
+
+            return true;
+        }
+
+        $ids = $this->guestIds();
+
+        if (in_array($productId, $ids, true)) {
+            $this->storeGuestIds(array_values(array_diff($ids, [$productId])));
+
+            return false;
+        }
+
+        $this->storeGuestIds(array_slice([$productId, ...$ids], 0, self::GUEST_MAX));
+
+        return true;
+    }
+
+    public function remove(int $productId): void
+    {
+        if ($this->has($productId)) {
+            $this->toggle($productId);
+        }
+    }
+
+    /**
+     * Moves the guest cookie's products onto $user's wishlist and clears it.
+     */
+    public function mergeGuestInto(Authenticatable $user): void
+    {
+        $ids = $this->guestIds();
+
+        if ($ids === []) {
+            return;
+        }
+
+        // Oldest first, so the newest cookie item also ends up newest here.
+        foreach (array_reverse($ids) as $productId) {
+            WishlistItem::firstOrCreate(['user_id' => $user->id, 'product_id' => $productId]);
+        }
+
+        $this->guestIds = [];
+        Cookie::queue(Cookie::forget(self::COOKIE));
+    }
+
+    /** @return array<int> */
+    private function guestIds(): array
+    {
+        if ($this->guestIds !== null) {
+            return $this->guestIds;
+        }
+
+        $decoded = json_decode((string) request()->cookie(self::COOKIE), true);
+
+        return $this->guestIds = is_array($decoded)
+            ? array_values(array_unique(array_filter(array_map('intval', $decoded))))
+            : [];
+    }
+
+    /** @param  array<int>  $ids */
+    private function storeGuestIds(array $ids): void
+    {
+        $this->guestIds = $ids;
+
+        Cookie::queue(self::COOKIE, json_encode($ids), self::COOKIE_MINUTES);
+    }
+}

bootstrap/app.php

@@ -11,7 +11,18 @@
         health: '/up',
     )
     ->withMiddleware(function (Middleware $middleware): void {
-        //
+        // Laravel's priority list would otherwise run `auth` before core's
+        // `locale` middleware, so the redirects below would build URLs before
+        // URL::defaults(['locale' => …]) is set, throwing a missing-parameter error.
+        $middleware->prependToPriorityList(
+            before: \Illuminate\Contracts\Auth\Middleware\AuthenticatesRequests::class,
+            prepend: \Modules\Core\Localization\Middleware\LocaleMiddleware::class,
+        );
+
+        // Both resolve inside the {locale} group, after the `locale` middleware
+        // has set URL::defaults(['locale' => …]), so route() needs no locale arg.
+        $middleware->redirectGuestsTo(fn () => route('login'));
+        $middleware->redirectUsersTo(fn () => route('home'));
     })
     ->withExceptions(function (Exceptions $exceptions): void {
         //

config/catalog.php

@@ -0,0 +1,25 @@
+<?php
+
+use Modules\Core\Catalog\Recommendations\RandomRule;
+use Modules\Core\Catalog\Recommendations\SameCategoryRule;
+
+return [
+    /*
+    |--------------------------------------------------------------------------
+    | Product recommendation rules
+    |--------------------------------------------------------------------------
+    |
+    | Tried in order by Modules\Core\Catalog\Services\RecommendationService —
+    | the first rule that returns at least one product wins. The order here IS
+    | the fallback chain: SameCategoryRule first, then RandomRule as a
+    | last-resort so a product page is never left with zero recommendations
+    | (as long as the store has more than one product). A consuming app can
+    | reorder, add, or remove rules freely — nothing about the chain shape is
+    | hardcoded in the service itself.
+    |
+    */
+    'recommendation_rules' => [
+        SameCategoryRule::class,
+        RandomRule::class,
+    ],
+];

config/checkout.php

@@ -0,0 +1,44 @@
+<?php
+
+/*
+ * Per-site settings for the cart + checkout module (see
+ * Modules\Core\Providers\CheckoutModuleServiceProvider). Publishable —
+ * artisan vendor:publish --tag=core-config.
+ */
+return [
+
+    /*
+     * Name of the storefront's login route. The checkout's login tab and the
+     * confirmation page link to it with `?redirect=<checkout path>`, so the
+     * login page must send the shopper back there afterwards. null: no login
+     * offered in checkout at all.
+     */
+    'login_route' => 'login',
+
+    /*
+     * Name of the storefront's product-listing route — where confirmation()
+     * redirects a visit with no placed order to look at (session expired,
+     * direct navigation, a bookmark). route($this, $locale) must resolve.
+     */
+    'products_route' => 'products',
+
+    /*
+     * ISO 3166-1 alpha-3 code fixing checkout to a single country (a hidden
+     * field, forced server-side — no country picker shown at all). null (the
+     * default) gives the full country/region picker, for a multi-country
+     * store. 3dealer is Greece-only for now.
+     */
+    'store_country_iso3' => 'GRC',
+
+    /*
+     * The `purpose` tag CartController expects a product custom field's
+     * `file` answer to already carry (see Modules\Core\File\Models\File) —
+     * matches whatever purpose string the host's own upload endpoint
+     * (extending Modules\Core\File\Http\Controllers\UploadFileController)
+     * tags its stored files with. This module never reaches into that
+     * host controller directly; this config value is the one shared
+     * source of truth between the two.
+     */
+    'custom_field_upload_purpose' => 'custom-field-upload',
+
+];

config/core.php

@@ -16,4 +16,126 @@
 
     'auto_create_customer_for_user' => true,
 
+    /*
+    |--------------------------------------------------------------------------
+    | Privacy / GDPR data-subject requests
+    |--------------------------------------------------------------------------
+    |
+    | 'providers' lists every Modules\Core\Privacy\Contracts\PersonalDataProvider
+    | that should be consulted for right-of-access/right-of-erasure requests. A
+    | module never needs to be known to core in advance — it just adds its own
+    | provider class here, the same way config('lunar.search.indexers') maps a
+    | model to its indexer. See docs/privacy.md.
+    |
+    | 'grace_period_days' is how long an erasure request stays cancellable
+    | (account deactivated, not yet erased) before it's actually processed by
+    | the privacy:process-erasure-requests scheduled command.
+    |
+    */
+
+    'privacy' => [
+        'providers' => [
+            // ActivityLogDataProvider MUST run before AddressDataProvider —
+            // it resolves which activity_log rows belong to this customer
+            // (including ones keyed by an Address id) before
+            // AddressDataProvider hard-deletes those Address rows. See that
+            // provider's own class docblock.
+            \Modules\Core\Logging\Privacy\ActivityLogDataProvider::class,
+            \Modules\Core\Customer\Privacy\CustomerDataProvider::class,
+            \Modules\Core\Customer\Privacy\AddressDataProvider::class,
+            \Modules\Core\Order\Privacy\OrderDataProvider::class,
+            \Modules\Core\Cart\Privacy\CartDataProvider::class,
+            \Modules\Core\Review\Privacy\ReviewDataProvider::class,
+            \Modules\Core\Payment\Privacy\PaymentDataProvider::class,
+            \Modules\Core\Auth\Privacy\UserSessionDataProvider::class,
+        ],
+
+        'grace_period_days' => 30,
+    ],
+
+    /*
+    |--------------------------------------------------------------------------
+    | Cart Abandonment Threshold
+    |--------------------------------------------------------------------------
+    |
+    | How long a cart (that hasn't converted to a placed order) can go without
+    | activity before Modules\Core\Cart\Filament\Resources\CartResource treats
+    | it as "Abandoned" rather than "Ongoing". Anything DateInterval::createFromDateString()
+    | accepts works, e.g. '1 hour', '30 minutes', '2 days'.
+    |
+    */
+
+    'cart' => [
+        'abandoned_after' => '1 hour',
+
+        /*
+        |----------------------------------------------------------------------
+        | Unrecoverable Cap
+        |----------------------------------------------------------------------
+        |
+        | Beyond this age, a stale cart stops being treated as an active
+        | "Abandoned Cart"/"Abandoned Checkout" (Modules\Core\Cart\Services\
+        | CartLifecycleService) — too old to be a realistic recovery target
+        | (pricing/stock/tax likely stale by then). This is about the
+        | abandoned-cart pipeline only, not data retention — no rows are
+        | deleted or pruned based on this value.
+        |
+        */
+
+        'unrecoverable_after' => '90 days',
+    ],
+
+    /*
+    |--------------------------------------------------------------------------
+    | Order Return Window
+    |--------------------------------------------------------------------------
+    |
+    | How many days after a carrier order is delivered (Order::fulfillment_status
+    | becomes 'return_window_open') before Modules\Core\Order\Commands\
+    | CloseExpiredReturnWindows auto-completes it, if no return was requested.
+    | Store-pickup orders have no return-window step and are unaffected by
+    | this value (see Modules\Core\Order\Listeners\CompleteOrderOnPickedUp).
+    |
+    */
+
+    'order' => [
+        'return_window_days' => 14,
+    ],
+
+    /*
+    |--------------------------------------------------------------------------
+    | Storefront OTP Login
+    |--------------------------------------------------------------------------
+    |
+    | Modules\Core\Auth\Services\UserOtpService's passwordless login.
+    | max_attempts caps how many wrong codes a shopper can guess against ONE
+    | generated code before it's invalidated outright. generation_limit/
+    | generation_decay_minutes cap how often a NEW code can be requested for
+    | the same email — independent of max_attempts, since generating a fresh
+    | code also resets the guess count, so an attempt cap alone doesn't stop
+    | an attacker from just requesting a new code every few tries. This same
+    | limit is also what stands between a malicious/careless caller and
+    | mail-bombing one inbox.
+    |
+    */
+
+    'auth' => [
+        'otp' => [
+            'max_attempts' => 5,
+            'generation_limit' => 3,
+            'generation_decay_minutes' => 10,
+        ],
+
+        // Modules\Core\Customer\Services\CustomerEmailChangeService — same
+        // shape/reasoning as auth.otp above, independent limits since this
+        // is a separate flow (changing an existing account's login email,
+        // not logging in).
+        'email_change' => [
+            'max_attempts' => 5,
+            'generation_limit' => 3,
+            'generation_decay_minutes' => 10,
+            'expiry_minutes' => 10,
+        ],
+    ],
+
 ];

config/lunar/orders.php

@@ -58,11 +58,23 @@
     | make sense for the store you're building.
     |
     */
-    'draft_status' => 'awaiting-payment',
+    'draft_status' => 'awaiting_payment',
 
+    // Two sequences — carrier and store-pickup — see Modules\Core\Order\
+    // Services\OrderStatusFlow, the single source of truth for which
+    // transitions are actually offered from a given status. Payment
+    // timing (prepaid vs. cash-on-delivery) does not affect this
+    // sequence at all — see Order::paid/paid_at instead, an entirely
+    // independent field with no status value of its own.
+    //
+    // 'favourite' controls whether a status gets its own tab in the order
+    // list topbar (Lunar\Admin\...\ListOrders::getDefaultTabs()) — set
+    // only on the main-journey statuses so the topbar isn't cluttered
+    // with every branch/exception value; every status (favourite or not)
+    // remains reachable via the table's own status filter/search.
     'statuses' => [
 
-        'awaiting-payment' => [
+        'awaiting_payment' => [
             'label' => 'Awaiting Payment',
             'color' => '#848a8c',
             'mailers' => [],
@@ -70,17 +82,25 @@
             'favourite' => true,
         ],
 
-        'payment-offline' => [
-            'label' => 'Payment Offline',
+        'processing' => [
+            'label' => 'Processing',
             'color' => '#0A81D7',
             'mailers' => [],
             'notifications' => [],
             'favourite' => true,
         ],
 
-        'payment-received' => [
-            'label' => 'Payment Received',
-            'color' => '#6a67ce',
+        'ready_for_dispatch' => [
+            'label' => 'Ready for Dispatch',
+            'color' => '#c98a2e',
+            'mailers' => [],
+            'notifications' => [],
+            'favourite' => true,
+        ],
+
+        'ready_for_pickup' => [
+            'label' => 'Ready for Pickup',
+            'color' => '#c98a2e',
             'mailers' => [],
             'notifications' => [],
             'favourite' => true,
@@ -88,11 +108,78 @@
 
         'dispatched' => [
             'label' => 'Dispatched',
+            'color' => '#0A81D7',
             'mailers' => [],
             'notifications' => [],
             'favourite' => true,
         ],
 
+        'delivery_failed' => [
+            'label' => 'Delivery Failed',
+            'color' => '#c0392b',
+            'mailers' => [],
+            'notifications' => [],
+            'favourite' => false,
+        ],
+
+        'picked_up' => [
+            'label' => 'Picked Up',
+            'color' => '#3f7a5c',
+            'mailers' => [],
+            'notifications' => [],
+            'favourite' => true,
+        ],
+
+        // The parcel arriving and the return window opening are the same
+        // moment — one status value covers both.
+        'delivered' => [
+            'label' => 'Delivered',
+            'color' => '#c98a2e',
+            'mailers' => [],
+            'notifications' => [],
+            'favourite' => true,
+        ],
+
+        'completed' => [
+            'label' => 'Completed',
+            'color' => '#3f7a5c',
+            'mailers' => [],
+            'notifications' => [],
+            'favourite' => true,
+        ],
+
+        'return_requested' => [
+            'label' => 'Return Requested',
+            'color' => '#c98a2e',
+            'mailers' => [],
+            'notifications' => [],
+            'favourite' => false,
+        ],
+
+        'returned' => [
+            'label' => 'Returned',
+            'color' => '#c0392b',
+            'mailers' => [],
+            'notifications' => [],
+            'favourite' => false,
+        ],
+
+        'partially_refunded' => [
+            'label' => 'Partially Refunded',
+            'color' => '#c98a2e',
+            'mailers' => [],
+            'notifications' => [],
+            'favourite' => false,
+        ],
+
+        'refunded' => [
+            'label' => 'Refunded',
+            'color' => '#c0392b',
+            'mailers' => [],
+            'notifications' => [],
+            'favourite' => false,
+        ],
+
     ],
 
     /*

config/lunar/panel.php

@@ -46,6 +46,6 @@
     | to include in the count below.
     |
     */
-    'order_count_statuses' => ['payment-received'],
+    'order_count_statuses' => ['processing'],
 
 ];

config/lunar/search.php

@@ -20,7 +20,17 @@
         Lunar\Models\Collection::class,
         Lunar\Models\Customer::class,
         Lunar\Models\Order::class,
-        Lunar\Models\Product::class,
+        // Modules\Core\Catalog\Models\Product, not Lunar\Models\Product —
+        // both share the same underlying Meilisearch index name, so
+        // listing the base class here too would make every reindex
+        // (this default list is always merged in, even when a specific
+        // model is passed on the CLI — see Lunar\Console\Commands\
+        // ScoutIndexerCommand::handle()) run the base class's indexing a
+        // second time right after the subclass's, silently overwriting
+        // every document with one missing custom_fields/order_count
+        // (the whole reason Modules\Core\Catalog\Models\Product exists —
+        // see its own docblock). Caught in practice.
+        Modules\Core\Catalog\Models\Product::class,
         Lunar\Models\ProductOption::class,
 
         /*
@@ -49,6 +59,20 @@
         Lunar\Models\Collection::class => Modules\Core\Catalog\Services\CollectionIndexer::class,
         Lunar\Models\Customer::class => Lunar\Search\CustomerIndexer::class,
         Lunar\Models\Order::class => Lunar\Search\OrderIndexer::class,
+        // Lunar\Models\Product::class, NOT Modules\Core\Catalog\Models\
+        // Product::class — Lunar\Base\Traits\Searchable::indexer() (and
+        // getFilterableAttributes()/getSortableAttributes(), same trait)
+        // reads `$config[self::class]`, and `self::class` inside a TRAIT
+        // METHOD is a compile-time literal bound to whichever class first
+        // `use`s the trait — Lunar\Models\Product, since the subclass
+        // never re-declares indexer() itself — regardless of which
+        // instance actually calls the method at runtime. Keying this by
+        // the subclass here made the lookup miss entirely, silently
+        // falling back to Lunar\Search\ScoutIndexer's own near-empty
+        // filterable/sortable field list — confirmed live: it wiped every
+        // real filterable/sortable attribute the index had (including
+        // ones that already worked, like collection_ids), not just the
+        // new order_count one. Caught in practice, reverted.
         Lunar\Models\Product::class => Modules\Core\Catalog\Services\ProductIndexer::class,
         Lunar\Models\ProductOption::class => Lunar\Search\ProductOptionIndexer::class,
     ],

config/services.php

@@ -35,9 +35,36 @@
         ],
     ],
 
+    // Where contact-form messages are sent (ContactController).
+    'contact' => [
+        'email' => env('CONTACT_EMAIL'),
+    ],
+
+    // Bot check on guest forms (login, contact), verified by App\Rules\HCaptcha. For
+    // local dev use hCaptcha's test keys, the real ones reject localhost:
+    // sitekey 10000000-ffff-ffff-ffff-000000000001,
+    // secret 0x0000000000000000000000000000000000000000.
+    'hcaptcha' => [
+        'sitekey' => env('HCAPTCHA_SITEKEY'),
+        'secret' => env('HCAPTCHA_SECRET'),
+    ],
+
     'stoic' => [
         'sso_secret' => env('STOIC_SSO_SECRET'),
         'host' => env('STOIC_HOST'),
     ],
 
+    // Keys read by lunarphp/stripe + Modules\Core\Payment\Drivers\StripePaymentDriver.
+    // `key` is the SECRET key (this ecosystem's convention — StripeManager calls
+    // Stripe::setApiKey(config('services.stripe.key'))); `public_key` is the
+    // publishable key for Stripe.js; `webhooks.lunar` is the signing secret the
+    // webhook route verifies against.
+    'stripe' => [
+        'key' => env('STRIPE_SECRET'),
+        'public_key' => env('STRIPE_PUBLIC_KEY'),
+        'webhooks' => [
+            'lunar' => env('STRIPE_WEBHOOK_SECRET'),
+        ],
+    ],
+
 ];

config/shippingCarriers/acs.php

@@ -0,0 +1,50 @@
+<?php
+
+/*
+|--------------------------------------------------------------------------
+| ACS Courier credentials
+|--------------------------------------------------------------------------
+|
+| ACS requires two credential mechanisms simultaneously: an AcsApiKey
+| HTTP header (gates the REST gateway itself) and four account fields
+| (Company_ID/Company_Password/User_ID/User_Password) sent in every
+| request body. Both are supplied by ACS when your account is set up.
+|
+| Set these via environment variables — never commit real values.
+|
+| ACS_BASE_URL           Root REST endpoint (unversioned, single URL for
+|                        every ACSAlias call).
+| ACS_API_KEY            The AcsApiKey header value.
+| ACS_COMPANY_ID         Company_ID body field.
+| ACS_COMPANY_PASSWORD   Company_Password body field.
+| ACS_USER_ID            User_ID body field.
+| ACS_USER_PASSWORD      User_Password body field.
+| ACS_BILLING_CODE       Your ACS credit/billing code, used for price
+|                        calculation and voucher creation.
+| ACS_SENDER_*           Static sender details reused on every voucher.
+|
+*/
+
+return [
+
+    'base_url' => env('ACS_BASE_URL', 'https://webservices.acscourier.net/ACSRestServices/api/ACSAutoRest'),
+
+    'api_key' => env('ACS_API_KEY'),
+
+    'company_id' => env('ACS_COMPANY_ID'),
+    'company_password' => env('ACS_COMPANY_PASSWORD'),
+    'user_id' => env('ACS_USER_ID'),
+    'user_password' => env('ACS_USER_PASSWORD'),
+
+    'billing_code' => env('ACS_BILLING_CODE'),
+
+    'sender' => [
+        'name' => env('ACS_SENDER_NAME'),
+        'address' => env('ACS_SENDER_ADDRESS'),
+        'zip_code' => env('ACS_SENDER_ZIP'),
+        'phone' => env('ACS_SENDER_PHONE'),
+    ],
+
+    'timeout' => env('ACS_HTTP_TIMEOUT', 10),
+
+];

config/shippingCarriers/boxnow.php

@@ -0,0 +1,61 @@
+<?php
+
+/*
+|--------------------------------------------------------------------------
+| Box Now credentials
+|--------------------------------------------------------------------------
+|
+| Box Now uses OAuth2 client-credentials: exchange BOXNOW_CLIENT_ID /
+| BOXNOW_CLIENT_SECRET for a Bearer access token (POST /auth-sessions,
+| ~1hr expiry), then attach it as an Authorization header on every call.
+| Unlike ACS, there is no separate per-request credential body — the
+| token alone authorizes all calls once obtained.
+|
+| Set these via environment variables — never commit real values.
+|
+| Box Now has two environments (see their Partner API manual, section 2):
+| Stage/Sandbox for testing, Production once live. Each has its own
+| client_id/client_secret pair and its own base_url/location_api_url —
+| there is no shared "switch an env var" flag, since stage credentials
+| don't work against the production host or vice versa.
+|
+| BOXNOW_BASE_URL         Root REST endpoint for delivery-requests/parcels.
+| BOXNOW_LOCATION_API_URL Separate, faster endpoint for origins/destinations
+|                         lookups (Box Now recommends this over the main
+|                         base URL for those two calls specifically).
+| BOXNOW_CLIENT_ID        OAuth2 client id.
+| BOXNOW_CLIENT_SECRET    OAuth2 client secret.
+| BOXNOW_PARTNER_ID       Numeric partnerId Box Now issues alongside your
+|                         credentials. NOT used for REST API authentication
+|                         (BoxNowClient authenticates with client_id/
+|                         client_secret alone) — this is only consumed by
+|                         the client-side Destination Map widget config
+|                         (_bn_map_widget_config.partnerId), confirmed
+|                         against Box Now's own WooCommerce plugin source.
+| BOXNOW_ORIGIN_LOCATION_ID  Your warehouse's Box Now locationId, used as
+|                            the pickup origin on every delivery request.
+| BOXNOW_SENDER_*         Static sender contact details reused on every
+|                         delivery request.
+|
+*/
+
+return [
+
+    'base_url' => env('BOXNOW_BASE_URL', 'https://api-production.boxnow.gr/api/v1'),
+    'location_api_url' => env('BOXNOW_LOCATION_API_URL', 'https://locationapi-production.boxnow.gr/api/v1'),
+
+    'client_id' => env('BOXNOW_CLIENT_ID'),
+    'client_secret' => env('BOXNOW_CLIENT_SECRET'),
+    'partner_id' => env('BOXNOW_PARTNER_ID'),
+
+    'origin_location_id' => env('BOXNOW_ORIGIN_LOCATION_ID'),
+
+    'sender' => [
+        'name' => env('BOXNOW_SENDER_NAME'),
+        'email' => env('BOXNOW_SENDER_EMAIL'),
+        'phone' => env('BOXNOW_SENDER_PHONE'),
+    ],
+
+    'timeout' => env('BOXNOW_HTTP_TIMEOUT', 10),
+
+];

database/migrations/2026_09_24_000001_create_wishlist_items_table.php

@@ -0,0 +1,25 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    public function up(): void
+    {
+        Schema::create('wishlist_items', function (Blueprint $table) {
+            $table->id();
+            $table->foreignId('user_id')->constrained()->cascadeOnDelete();
+            $table->foreignId('product_id')->constrained('lunar_products')->cascadeOnDelete();
+            $table->timestamps();
+
+            $table->unique(['user_id', 'product_id']);
+        });
+    }
+
+    public function down(): void
+    {
+        Schema::dropIfExists('wishlist_items');
+    }
+};

database/seeders/ValidationTranslationsSeeder.php

@@ -0,0 +1,115 @@
+<?php
+
+namespace Database\Seeders;
+
+use Illuminate\Database\Seeder;
+use Modules\Core\Localization\Services\TranslationService;
+use Spatie\TranslationLoader\LanguageLine;
+
+/**
+ * Default `validation` translation lines — Laravel's own error-message group
+ * (`validation.required`, `validation.email`, `validation.attributes.*`, …),
+ * resolved by every `Validator::make()`/`$request->validate()` call in the app
+ * (see CheckoutController::saveAddress(), CartController, ProductController),
+ * not just the checkout module.
+ *
+ * Spatie's DB loader (spatie/laravel-translation-loader, wired in boboko-core's
+ * LocalizationServiceProvider) merges this group over Laravel's file-based
+ * validation.php, which the project doesn't ship a `lang/` copy of — so without
+ * this, Greek requests fall back to Laravel's untranslated English defaults.
+ * Only the rule keys and field attributes actually in use are seeded; add more
+ * as new rules/fields show up.
+ *
+ * Additive and idempotent: a key that already exists is left untouched, so
+ * anything edited in the Filament Language Lines UI wins on a re-run. Runs
+ * explicitly — `php artisan db:seed --class=ValidationTranslationsSeeder` — it
+ * is not wired into DatabaseSeeder.
+ *
+ * Greek copy uses the project's informal register (εσύ/σου).
+ */
+class ValidationTranslationsSeeder extends Seeder
+{
+    public function run(): void
+    {
+        $translations = app(TranslationService::class);
+
+        foreach ($this->lines() as $key => [$en, $el]) {
+            $exists = LanguageLine::query()
+                ->where('group', 'validation')
+                ->where('key', $key)
+                ->exists();
+
+            if ($exists) {
+                $this->command?->warn("validation.{$key} already exists — skipped");
+
+                continue;
+            }
+
+            $translations->create('validation', $key, ['en' => $en, 'el' => $el]);
+            $this->command?->info("validation.{$key} added");
+        }
+    }
+
+    /**
+     * key => [English, Greek].
+     *
+     * @return array<string, array{0: string, 1: string}>
+     */
+    private function lines(): array
+    {
+        return [
+            // ── Rule messages ─────────────────────────────────────────────
+            'required' => ['The :attribute field is required.', 'Το πεδίο :attribute είναι υποχρεωτικό.'],
+            'email' => ['The :attribute field must be a valid email address.', 'Το πεδίο :attribute πρέπει να είναι έγκυρη διεύθυνση email.'],
+            'string' => ['The :attribute field must be a string.', 'Το πεδίο :attribute πρέπει να είναι κείμενο.'],
+            'integer' => ['The :attribute field must be an integer.', 'Το πεδίο :attribute πρέπει να είναι ακέραιος αριθμός.'],
+            'boolean' => ['The :attribute field must be true or false.', 'Το πεδίο :attribute πρέπει να είναι true ή false.'],
+            'min.numeric' => ['The :attribute field must be at least :min.', 'Το πεδίο :attribute πρέπει να είναι τουλάχιστον :min.'],
+            'max.string' => ['The :attribute field must not be greater than :max characters.', 'Το πεδίο :attribute δεν πρέπει να ξεπερνά τους :max χαρακτήρες.'],
+            'between.numeric' => ['The :attribute field must be between :min and :max.', 'Το πεδίο :attribute πρέπει να είναι μεταξύ :min και :max.'],
+            'exists' => ['The selected :attribute is invalid.', 'Η επιλεγμένη τιμή για το πεδίο :attribute δεν είναι έγκυρη.'],
+            // Product custom-field photo uploads (CustomFieldUploadController, CartController).
+            'file' => ['The :attribute field must be a file.', 'Το πεδίο :attribute πρέπει να είναι αρχείο.'],
+            'mimes' => ['The :attribute field must be a file of type: :values.', 'Το πεδίο :attribute πρέπει να είναι αρχείο τύπου: :values.'],
+            'max.file' => ['The :attribute field must not be greater than :max kilobytes.', 'Το αρχείο στο πεδίο :attribute δεν πρέπει να ξεπερνά τα :max kilobytes.'],
+            'uploaded' => ['The :attribute failed to upload.', 'Η μεταφόρτωση στο πεδίο :attribute απέτυχε.'],
+
+            // ── Field names (checkout: billing/shipping address) ──────────
+            'attributes.contact_email' => ['email', 'email'],
+            'attributes.billing_first_name' => ['first name', 'όνομα'],
+            'attributes.billing_last_name' => ['last name', 'επώνυμο'],
+            'attributes.billing_company_name' => ['company name', 'επωνυμία εταιρείας'],
+            'attributes.billing_tax_identifier' => ['tax ID', 'ΑΦΜ'],
+            'attributes.billing_line_one' => ['address', 'διεύθυνση'],
+            'attributes.billing_line_two' => ['address line 2', 'διεύθυνση (γραμμή 2)'],
+            'attributes.billing_city' => ['city', 'πόλη'],
+            'attributes.billing_state' => ['region', 'νομό / περιοχή'],
+            'attributes.billing_postcode' => ['postcode', 'ταχυδρομικό κώδικα'],
+            'attributes.billing_country_id' => ['country', 'χώρα'],
+            'attributes.billing_contact_phone' => ['phone', 'τηλέφωνο'],
+            'attributes.shipping_first_name' => ['first name', 'όνομα'],
+            'attributes.shipping_last_name' => ['last name', 'επώνυμο'],
+            'attributes.shipping_company_name' => ['company name', 'επωνυμία εταιρείας'],
+            'attributes.shipping_line_one' => ['address', 'διεύθυνση'],
+            'attributes.shipping_line_two' => ['address line 2', 'διεύθυνση (γραμμή 2)'],
+            'attributes.shipping_city' => ['city', 'πόλη'],
+            'attributes.shipping_state' => ['region', 'νομό / περιοχή'],
+            'attributes.shipping_postcode' => ['postcode', 'ταχυδρομικό κώδικα'],
+            'attributes.shipping_country_id' => ['country', 'χώρα'],
+            'attributes.shipping_contact_phone' => ['phone', 'τηλέφωνο'],
+            'attributes.shipping_delivery_instructions' => ['delivery notes', 'σχόλια για την παράδοση'],
+
+            // ── Field names (cart) ─────────────────────────────────────────
+            'attributes.purchasable_id' => ['product', 'προϊόν'],
+            'attributes.quantity' => ['quantity', 'ποσότητα'],
+            'attributes.code' => ['coupon code', 'κωδικό κουπονιού'],
+
+            // ── Field names (product reviews / stock check) ────────────────
+            'attributes.variant' => ['variant', 'παραλλαγή'],
+            'attributes.rating' => ['rating', 'βαθμολογία'],
+            'attributes.content' => ['review text', 'κείμενο κριτικής'],
+            'attributes.name' => ['name', 'όνομα'],
+            'attributes.email' => ['email', 'email'],
+        ];
+    }
+}

package-lock.json

@@ -1,5 +1,5 @@
 {
-    "name": "boboko-starter",
+    "name": "app",
     "lockfileVersion": 3,
     "requires": true,
     "packages": {
@@ -7,9 +7,8 @@
             "dependencies": {
                 "@hotwired/stimulus": "^3.2.2",
                 "@hotwired/turbo": "^8.0.23",
-                "@phosphor-icons/web": "^2.1.2",
                 "axios": "^1.15.2",
-                "flatpickr": "^4.6.13"
+                "leaflet": "^1.9.4"
             },
             "devDependencies": {
                 "@tailwindcss/vite": "^4.0.0",
@@ -147,12 +146,6 @@
                 "url": "https://github.com/sponsors/Boshen"
             }
         },
-        "node_modules/@phosphor-icons/web": {
-            "version": "2.1.2",
-            "resolved": "https://registry.npmjs.org/@phosphor-icons/web/-/web-2.1.2.tgz",
-            "integrity": "sha512-rPAR9o/bEcp4Cw4DEeZHXf+nlGCMNGkNDRizYHM47NLxz9vvEHp/Tt6FMK1NcWadzw/pFDPnRBGi/ofRya958A==",
-            "license": "MIT"
-        },
         "node_modules/@rolldown/binding-android-arm64": {
             "version": "1.1.4",
             "resolved": "https://registry.npmjs.org/@rolldown/binding-android-arm64/-/binding-android-arm64-1.1.4.tgz",
@@ -1015,12 +1008,6 @@
                 }
             }
         },
-        "node_modules/flatpickr": {
-            "version": "4.6.13",
-            "resolved": "https://registry.npmjs.org/flatpickr/-/flatpickr-4.6.13.tgz",
-            "integrity": "sha512-97PMG/aywoYpB4IvbvUJi0RQi8vearvU0oov1WW3k0WZPBMrTQVqekSX5CjSG/M4Q3i6A/0FKXC7RyAoAUUSPw==",
-            "license": "MIT"
-        },
         "node_modules/follow-redirects": {
             "version": "1.16.0",
             "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.16.0.tgz",
@@ -1256,6 +1243,12 @@
                 }
             }
         },
+        "node_modules/leaflet": {
+            "version": "1.9.4",
+            "resolved": "https://registry.npmjs.org/leaflet/-/leaflet-1.9.4.tgz",
+            "integrity": "sha512-nxS1ynzJOmOlHp+iL3FyWqK89GtNL8U8rvlMOsQdTTssxZwCXh8N2NB3GDQOL+YR3XnWyZAxwQixURb+FA74PA==",
+            "license": "BSD-2-Clause"
+        },
         "node_modules/lightningcss": {
             "version": "1.32.0",
             "resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.32.0.tgz",

package.json

@@ -16,6 +16,7 @@
     "dependencies": {
         "@hotwired/stimulus": "^3.2.2",
         "@hotwired/turbo": "^8.0.23",
-        "axios": "^1.15.2"
+        "axios": "^1.15.2",
+        "leaflet": "^1.9.4"
     }
 }

public/site.webmanifest

@@ -0,0 +1,21 @@
+{
+  "name": "3dealer",
+  "short_name": "3dealer",
+  "icons": [
+    {
+      "src": "/web-app-manifest-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png",
+      "purpose": "maskable"
+    },
+    {
+      "src": "/web-app-manifest-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png",
+      "purpose": "maskable"
+    }
+  ],
+  "theme_color": "#ffffff",
+  "background_color": "#ffffff",
+  "display": "standalone"
+}

resources/css/app.css

@@ -1,6 +1,12 @@
 @import "tailwindcss";
 @import "./fonts.css";
 @import "./dropdown.css";
+
+/* Note for anyone theming the checkout module (resources/css/checkout.css,
+   .bbk-* classes): it's deliberately plain, unlayered CSS, not inside any
+   @layer — so override it with plain rules here too, not from inside
+   @layer components/utilities, which would lose to it. See checkout.css's
+   file-level comment for why. */
 @source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
 @source '../../storage/framework/views/*.php';
 @source '../**/*.blade.php';
@@ -325,7 +331,7 @@ @layer components {
         transition: transform 0.35s cubic-bezier(0.2, 0.78, 0.12, 0.86);
     }
 
-    .btn-primary:hover::after {
+    .btn-primary:not(:disabled):hover::after {
         transform: translate(0, 0);
     }
 

resources/css/checkout.css

@@ -0,0 +1,991 @@
+/*
+ * Cart + checkout module — generic default styling.
+ *
+ * Deliberately NOT wrapped in a Tailwind-style `@layer`. An earlier version
+ * put these rules in `@layer bbk-checkout`, positioned (via a cross-file
+ * @layer ordering statement) to sit between Tailwind's `base` and
+ * `components` — in theory enough to beat Preflight's element resets while
+ * still losing to a host override. In practice a build tool processing each
+ * CSS file in isolation (Vite/Lightning CSS here) optimizes away exactly the
+ * cross-file ordering information that trick depends on, so it silently
+ * didn't work: Preflight's `button { background-color: transparent }`,
+ * `* { border-width: 0 }` etc. (layered, in `base`) were beating every
+ * `.bbk-*` rule below regardless of specificity — buttons with no
+ * background, no border, wrong font-size.
+ *
+ * Plain, unlayered CSS sidesteps the whole problem: an unlayered rule always
+ * beats ANY layered rule (Preflight included), full stop, no ordering tricks,
+ * nothing a bundler can silently invalidate. This file is loaded BEFORE the
+ * host's own stylesheet (see the @vite call in the layout <head>), so:
+ *
+ *   - a later PLAIN (unlayered) `.bbk-*` rule in the host stylesheet wins —
+ *     same specificity, later in source order
+ *   - a later host rule with a MORE specific selector wins regardless
+ *   - a host rule inside `@layer components`/`@layer utilities` does NOT
+ *     win — unlayered always beats layered. Theme this module from plain
+ *     rules in app.css, not from inside a Tailwind layer.
+ *
+ * Two ways to theme this, cheapest first:
+ *
+ *   1. Redefine the --bbk-* custom properties below (from :root, or scoped to
+ *      .bbk-cart for a cart-only override) — covers colour, radius, shadow,
+ *      font without touching a single selector below.
+ *
+ *        :root { --bbk-color-accent: var(--color-brand); --bbk-radius: 0; }
+ *
+ *   2. Override individual `.bbk-*` rules directly (as plain rules, per
+ *      above) for anything structural (spacing, layout) the variables don't
+ *      cover.
+ *
+ * This file's own look is a deliberately neutral placeholder — inoffensive,
+ * not "designed" — so a project always has something reasonable before it
+ * themes; it is not meant to be edited per project.
+ */
+
+:root {
+    --bbk-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+
+    --bbk-color-text: #18181b;
+    --bbk-color-muted: #71717a;
+    --bbk-color-bg: #ffffff;
+    --bbk-color-bg-muted: #f4f4f5;
+    --bbk-color-border: #e4e4e7;
+    --bbk-color-accent: #18181b;
+    --bbk-color-accent-text: #ffffff;
+    --bbk-color-danger: #dc2626;
+
+    --bbk-radius: 8px;
+    --bbk-radius-sm: 4px;
+    --bbk-shadow: 0 12px 32px rgba(0, 0, 0, 0.16);
+}
+
+.bbk-cart[hidden] { display: none; }
+
+.bbk-cart {
+    position: fixed;
+    inset: 0;
+    z-index: 1000;
+    font-family: var(--bbk-font);
+    font-size: 0.9375rem;
+    line-height: 1.4;
+    color: var(--bbk-color-text);
+}
+
+.bbk-cart-backdrop {
+    position: absolute;
+    inset: 0;
+    background: rgba(0, 0, 0, 0.4);
+    opacity: 0;
+    transition: opacity 0.25s ease;
+}
+
+.bbk-cart[data-bbk-cart-state="open"] .bbk-cart-backdrop { opacity: 1; }
+
+.bbk-cart-panel {
+    position: absolute;
+    top: 0;
+    right: 0;
+    display: flex;
+    flex-direction: column;
+    width: min(420px, 100vw);
+    height: 100%;
+    background: var(--bbk-color-bg);
+    box-shadow: var(--bbk-shadow);
+    transform: translateX(100%);
+    transition: transform 0.25s ease;
+}
+
+.bbk-cart[data-bbk-cart-state="open"] .bbk-cart-panel { transform: translateX(0); }
+
+.bbk-cart-panel-header {
+    flex: 0 0 auto;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 1rem;
+    padding: 1.5rem 1.5rem 1.25rem;
+    border-bottom: 1px solid var(--bbk-color-border);
+}
+
+.bbk-cart-heading {
+    margin: 0;
+    font-size: 1.375rem;
+    font-weight: 700;
+}
+
+.bbk-cart-dismiss,
+.bbk-cart-item-remove,
+.bbk-cart-qty-btn {
+    cursor: pointer;
+    background: none;
+    border: 0;
+    padding: 0;
+    font: inherit;
+    line-height: 1;
+    color: var(--bbk-color-muted);
+    transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease;
+}
+
+.bbk-cart-dismiss {
+    font-size: 1.75rem;
+    width: 2.5rem;
+    height: 2.5rem;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: var(--bbk-radius-sm);
+    flex-shrink: 0;
+}
+
+.bbk-cart-dismiss:hover { color: var(--bbk-color-text); background: var(--bbk-color-bg-muted); }
+
+.bbk-cart-item-remove:hover { color: var(--bbk-color-danger); }
+
+.bbk-cart-dismiss:focus-visible,
+.bbk-cart-item-remove:focus-visible,
+.bbk-cart-qty-btn:focus-visible,
+.bbk-cart-qty-input:focus-visible,
+.bbk-cart-checkout:focus-visible,
+.bbk-cart-coupon-input:focus-visible,
+.bbk-cart-coupon-submit:focus-visible,
+.bbk-cart-coupon-remove:focus-visible {
+    outline: 2px solid var(--bbk-color-accent);
+    outline-offset: 2px;
+}
+
+.bbk-visually-hidden {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    padding: 0;
+    margin: -1px;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+    border: 0;
+}
+
+.bbk-cart-panel-body {
+    flex: 1 1 auto;
+    overflow-y: auto;
+    overscroll-behavior: contain;
+    padding: 1.5rem;
+}
+
+.bbk-cart-items {
+    list-style: none;
+    margin: 0 0 2rem;
+    padding: 0;
+    display: flex;
+    flex-direction: column;
+    gap: 1.5rem;
+}
+
+.bbk-cart-item {
+    display: grid;
+    grid-template-columns: 72px 1fr auto;
+    gap: 0.875rem;
+    align-items: start;
+}
+
+.bbk-cart-item-media img {
+    display: block;
+    width: 72px;
+    height: 72px;
+    object-fit: cover;
+    border-radius: var(--bbk-radius-sm);
+    background: var(--bbk-color-bg-muted);
+}
+
+.bbk-cart-item-detail { min-width: 0; }
+
+.bbk-cart-item-title {
+    display: block;
+    margin: 0 0 0.25rem;
+    font-weight: 600;
+    color: inherit;
+    text-decoration: none;
+}
+
+a.bbk-cart-item-title:hover { text-decoration: underline; }
+
+.bbk-cart-item-variant {
+    margin: 0 0 0.25rem;
+    font-size: 0.8125rem;
+    color: var(--bbk-color-muted);
+}
+
+/* A line's custom-field answers (checkout::partials.line-custom-fields). */
+.bbk-line-fields {
+    display: grid;
+    gap: 0.25rem;
+    margin: 0 0 0.5rem;
+    font-size: 0.8125rem;
+}
+
+.bbk-line-field dt {
+    color: var(--bbk-color-muted);
+}
+
+.bbk-line-field dd {
+    margin: 0;
+    white-space: pre-line;
+    overflow-wrap: anywhere;
+}
+
+.bbk-line-field-file {
+    display: inline-flex;
+    align-items: center;
+    gap: 0.5rem;
+    color: inherit;
+}
+
+.bbk-line-field-file img {
+    width: 40px;
+    height: 40px;
+    object-fit: cover;
+    border-radius: 0;
+}
+
+.bbk-cart-item-unit {
+    margin: 0 0 0.625rem;
+    color: var(--bbk-color-muted);
+}
+
+.bbk-cart-item-aside {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-end;
+    gap: 0.5rem;
+}
+
+.bbk-cart-item-total { margin: 0; font-weight: 600; }
+
+.bbk-cart-item-remove {
+    font-size: 1.125rem;
+    width: 1.5rem;
+    height: 1.5rem;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.bbk-cart-qty {
+    display: inline-flex;
+    align-items: center;
+    gap: 0;
+    border: 1px solid var(--bbk-color-border);
+    border-radius: var(--bbk-radius-sm);
+    overflow: hidden;
+}
+
+.bbk-cart-qty-btn {
+    width: 1.75rem;
+    height: 1.75rem;
+    background: var(--bbk-color-bg-muted);
+}
+
+.bbk-cart-qty-btn:hover { background: var(--bbk-color-border); color: var(--bbk-color-text); }
+
+.bbk-cart-qty-input {
+    width: 2.25rem;
+    height: 1.75rem;
+    border: 0;
+    border-left: 1px solid var(--bbk-color-border);
+    border-right: 1px solid var(--bbk-color-border);
+    text-align: center;
+    font: inherit;
+    color: inherit;
+    background: var(--bbk-color-bg);
+    appearance: textfield;
+    -moz-appearance: textfield;
+}
+
+.bbk-cart-qty-input::-webkit-outer-spin-button,
+.bbk-cart-qty-input::-webkit-inner-spin-button {
+    -webkit-appearance: none;
+    margin: 0;
+}
+
+.bbk-cart-summary {
+    padding-top: 1.25rem;
+    border-top: 1px solid var(--bbk-color-border);
+    display: flex;
+    flex-direction: column;
+    gap: 0.625rem;
+}
+
+.bbk-cart-summary-row {
+    display: flex;
+    justify-content: space-between;
+    gap: 1rem;
+}
+
+.bbk-cart-summary-row--discount { color: var(--bbk-color-danger); }
+
+.bbk-cart-summary-pending {
+    color: var(--bbk-color-muted);
+    font-size: 0.8125rem;
+}
+
+.bbk-cart-summary-row--total {
+    margin-top: 0.375rem;
+    padding-top: 0.875rem;
+    border-top: 1px solid var(--bbk-color-border);
+    font-size: 1.0625rem;
+    font-weight: 700;
+}
+
+.bbk-cart-coupon-form {
+    display: flex;
+    gap: 0.5rem;
+}
+
+.bbk-cart-coupon-input {
+    flex: 1 1 auto;
+    min-width: 0;
+    padding: 0.5rem 0.75rem;
+    border: 1px solid var(--bbk-color-border);
+    border-radius: var(--bbk-radius-sm);
+    font: inherit;
+    color: inherit;
+    background: var(--bbk-color-bg);
+}
+
+.bbk-cart-coupon-submit {
+    flex: 0 0 auto;
+    padding: 0.5rem 0.875rem;
+    border: 1px solid var(--bbk-color-border);
+    border-radius: var(--bbk-radius-sm);
+    background: var(--bbk-color-bg-muted);
+    font: inherit;
+    font-weight: 600;
+    cursor: pointer;
+    transition: background-color 0.15s ease, border-color 0.15s ease;
+}
+
+.bbk-cart-coupon-submit:hover { background: var(--bbk-color-border); }
+
+.bbk-cart-coupon-applied {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 0.75rem;
+    padding: 0.625rem 0.875rem;
+    border: 1px solid var(--bbk-color-border);
+    border-radius: var(--bbk-radius-sm);
+    background: var(--bbk-color-bg-muted);
+}
+
+.bbk-cart-coupon-code {
+    font-weight: 600;
+    text-transform: uppercase;
+    letter-spacing: 0.02em;
+}
+
+.bbk-cart-coupon-remove {
+    flex: 0 0 auto;
+    background: none;
+    border: 0;
+    padding: 0;
+    font: inherit;
+    font-size: 0.8125rem;
+    color: var(--bbk-color-muted);
+    text-decoration: underline;
+    cursor: pointer;
+    transition: color 0.15s ease;
+}
+
+.bbk-cart-coupon-remove:hover { color: var(--bbk-color-danger); }
+
+.bbk-cart-coupon-error {
+    margin: 0.5rem 0 0;
+    font-size: 0.8125rem;
+    color: var(--bbk-color-danger);
+}
+
+.bbk-cart-error {
+    margin: 0;
+    padding: 0.75rem 1.5rem 0;
+    font-size: 0.8125rem;
+    color: var(--bbk-color-danger);
+}
+
+.bbk-add-to-cart-error {
+    margin: 0.375rem 0 0;
+    font-size: 0.8125rem;
+    color: var(--bbk-color-danger);
+}
+
+.bbk-cart-checkout {
+    display: block;
+    width: 100%;
+    padding: 0.875rem 1.25rem;
+    border: 1px solid var(--bbk-color-accent);
+    border-radius: var(--bbk-radius);
+    background: var(--bbk-color-accent);
+    color: var(--bbk-color-accent-text);
+    font: inherit;
+    font-weight: 600;
+    text-align: center;
+    text-decoration: none;
+    cursor: pointer;
+    transition: opacity 0.15s ease;
+}
+
+.bbk-cart-checkout:hover { opacity: 0.85; }
+
+.bbk-cart-checkout:disabled {
+    cursor: not-allowed;
+    opacity: 0.4;
+}
+
+.bbk-cart-empty {
+    text-align: center;
+    color: var(--bbk-color-muted);
+    padding: 2.5rem 0;
+}
+
+/* ───────────────────────────────────────────────────────────────────
+   Checkout page — two columns: fields on the left, order summary (the
+   same cart-body partial the drawer uses) on the right.
+   ─────────────────────────────────────────────────────────────────── */
+
+.bbk-checkout-page {
+    max-width: 1100px;
+    margin: 0 auto;
+    padding: 2.5rem 1.5rem 5rem;
+    font-family: var(--bbk-font);
+    font-size: 0.9375rem;
+    line-height: 1.4;
+    color: var(--bbk-color-text);
+}
+
+.bbk-checkout-heading {
+    margin: 0 0 2rem;
+    font-size: 1.75rem;
+    font-weight: 700;
+}
+
+.bbk-checkout {
+    display: grid;
+    grid-template-columns: 1fr 380px;
+    gap: 3rem;
+    align-items: start;
+}
+
+@media (max-width: 860px) {
+    .bbk-checkout { grid-template-columns: 1fr; }
+}
+
+.bbk-checkout-main {
+    display: flex;
+    flex-direction: column;
+    gap: 2rem;
+}
+
+.bbk-checkout-section {
+    padding-bottom: 2rem;
+    border-bottom: 1px solid var(--bbk-color-border);
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+}
+
+.bbk-checkout-section-heading {
+    margin: 0;
+    font-size: 1.125rem;
+    font-weight: 700;
+}
+
+.bbk-checkout-note {
+    margin: 0;
+    color: var(--bbk-color-muted);
+    font-size: 0.875rem;
+}
+
+/* Contact: "logged in as" line, or the guest login prompt */
+
+.bbk-checkout-logged-in,
+.bbk-checkout-login-prompt { margin: 0; }
+
+.bbk-checkout-login-prompt a { color: inherit; font-weight: 600; }
+
+/* Fields */
+
+.bbk-field { display: flex; flex-direction: column; gap: 0.375rem; }
+
+.bbk-field-row {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 1rem;
+}
+
+@media (max-width: 480px) {
+    .bbk-field-row { grid-template-columns: 1fr; }
+}
+
+.bbk-field-label {
+    font-size: 0.8125rem;
+    font-weight: 600;
+    color: var(--bbk-color-muted);
+}
+
+.bbk-field-input {
+    padding: 0.625rem 0.75rem;
+    border: 1px solid var(--bbk-color-border);
+    border-radius: var(--bbk-radius-sm);
+    font: inherit;
+    color: inherit;
+    background: var(--bbk-color-bg);
+}
+
+.bbk-field-input:focus-visible {
+    outline: 2px solid var(--bbk-color-accent);
+    outline-offset: 2px;
+}
+
+.bbk-field-input:disabled {
+    background: var(--bbk-color-bg-muted);
+    color: var(--bbk-color-muted);
+}
+
+.bbk-field-input--error { border-color: var(--bbk-color-danger); }
+
+.bbk-field-error {
+    margin: 0;
+    font-size: 0.8125rem;
+    color: var(--bbk-color-danger);
+}
+
+/* A fixed, non-editable field value (e.g. the store's single country). */
+.bbk-field-static {
+    margin: 0;
+    padding: 0.625rem 0.75rem;
+    border: 1px solid var(--bbk-color-border);
+    border-radius: var(--bbk-radius-sm);
+    background: var(--bbk-color-bg-muted);
+    color: var(--bbk-color-muted);
+}
+
+textarea.bbk-field-input { resize: vertical; }
+
+.bbk-checkbox {
+    display: inline-flex;
+    align-items: center;
+    gap: 0.5rem;
+    font-size: 0.875rem;
+    cursor: pointer;
+}
+
+/* For a full-sentence label that can wrap — align the box to the first line. */
+/* "I want an invoice": company/ΑΦΜ only while ticked */
+
+.bbk-invoice { display: flex; flex-direction: column; gap: 1rem; }
+
+.bbk-invoice:not(:has(input[name="wants_invoice"]:checked)) .bbk-invoice-fields { display: none; }
+
+.bbk-checkbox--stacked {
+    display: flex;
+    align-items: flex-start;
+    margin-top: 0.75rem;
+    color: var(--bbk-color-muted);
+}
+
+.bbk-checkbox--stacked input { margin-top: 0.15rem; flex-shrink: 0; }
+
+.bbk-checkout-shipping-fields {
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+}
+
+/* Shipping method */
+
+.bbk-checkout-shipping-options {
+    display: flex;
+    flex-direction: column;
+    gap: 0.75rem;
+}
+
+.bbk-checkout-shipping-option {
+    display: flex;
+    align-items: center;
+    gap: 0.75rem;
+    padding: 0.875rem 1rem;
+    border: 1px solid var(--bbk-color-border);
+    border-radius: var(--bbk-radius-sm);
+    cursor: pointer;
+    transition: border-color 0.15s ease;
+}
+
+.bbk-checkout-shipping-option:has(input:checked) { border-color: var(--bbk-color-accent); }
+
+.bbk-checkout-shipping-option-detail {
+    flex: 1 1 auto;
+    display: flex;
+    flex-direction: column;
+    gap: 0.125rem;
+}
+
+.bbk-checkout-shipping-option-name { font-weight: 600; }
+
+.bbk-checkout-shipping-option-description {
+    font-size: 0.8125rem;
+    color: var(--bbk-color-muted);
+}
+
+.bbk-checkout-shipping-option-price { font-weight: 600; }
+
+/* The single auto-selected option — a fixed line, not a choosable radio. */
+.bbk-checkout-shipping-confirmed {
+    display: flex;
+    align-items: center;
+    gap: 0.75rem;
+    padding: 0.875rem 1rem;
+    border: 1px solid var(--bbk-color-accent);
+    border-radius: var(--bbk-radius-sm);
+}
+
+/* Autosave status line under the address form. */
+.bbk-checkout-status {
+    margin: 0;
+    font-size: 0.8125rem;
+    color: var(--bbk-color-muted);
+}
+
+.bbk-checkout-status[data-state="error"] { color: var(--bbk-color-danger); }
+
+/* Dummy Box Now locker picker — see shipping-options.blade.php. */
+.bbk-checkout-box-now-locker {
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+    margin-top: 0.75rem;
+    padding: 0.875rem 1rem;
+    border: 1px solid var(--bbk-color-border);
+    border-radius: var(--bbk-radius-sm);
+}
+
+.bbk-checkout-box-now-locker-label {
+    font-weight: 600;
+    font-size: 0.8125rem;
+}
+
+.bbk-checkout-box-now-locker-map {
+    width: 100%;
+    height: 480px;
+    border-radius: var(--bbk-radius-sm);
+    z-index: 0;
+}
+
+.bbk-checkout-box-now-locker-search {
+    width: 100%;
+    padding: 0.625rem 0.875rem;
+    border: 1px solid var(--bbk-color-border);
+    border-radius: var(--bbk-radius-sm);
+    font-size: 0.875rem;
+}
+
+.bbk-checkout-box-now-locker-search:focus {
+    outline: none;
+    border-color: var(--bbk-color-accent);
+}
+
+.bbk-checkout-box-now-locker-chosen {
+    margin: 0;
+    font-size: 0.8125rem;
+    font-weight: 600;
+    color: var(--bbk-color-accent);
+}
+
+/* Custom SVG pin (see bbk-box-now-locker-controller.js pinIcon()) — no
+   default Leaflet drop-shadow image, so a CSS shadow stands in for it. */
+.bbk-box-now-pin svg {
+    filter: drop-shadow(0 2px 3px rgb(0 0 0 / 0.35));
+}
+
+/* Leaflet's own popup chrome, restyled to match the checkout's cards
+   instead of the library's square-cornered default. */
+.leaflet-popup-content-wrapper {
+    border-radius: 0.75rem;
+    box-shadow: 0 8px 24px rgb(0 0 0 / 0.18);
+}
+
+.leaflet-popup-content {
+    margin: 0.875rem;
+}
+
+.bbk-box-now-popup {
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+    min-width: 220px;
+}
+
+.bbk-box-now-popup-image {
+    width: calc(100% + 1.75rem);
+    margin: -0.875rem -0.875rem 0.125rem;
+    height: 110px;
+    object-fit: cover;
+    border-radius: 0.75rem 0.75rem 0 0;
+}
+
+.bbk-box-now-popup-name {
+    display: flex;
+    align-items: center;
+    gap: 0.375rem;
+    margin: 0;
+    font-weight: 700;
+    font-size: 0.9375rem;
+}
+
+.bbk-box-now-popup-name::before {
+    content: '';
+    flex: 0 0 auto;
+    width: 0.5rem;
+    height: 0.5rem;
+    border-radius: 999px;
+    background: #00c389;
+}
+
+.bbk-box-now-popup-address {
+    margin: 0;
+    padding-left: 0.875rem;
+    font-size: 0.8125rem;
+    line-height: 1.4;
+    color: var(--bbk-color-muted);
+}
+
+.bbk-box-now-popup-note {
+    margin: 0 0 0 0.875rem;
+    padding: 0.5rem 0.625rem;
+    background: color-mix(in srgb, #00c389 8%, transparent);
+    border-radius: var(--bbk-radius-sm);
+    font-size: 0.75rem;
+    font-style: italic;
+    color: var(--bbk-color-muted);
+}
+
+.bbk-box-now-popup-select {
+    margin-top: 0.25rem;
+    padding: 0.625rem 0.875rem;
+    width: 100%;
+    border: none;
+    border-radius: var(--bbk-radius-sm);
+    background: #00c389;
+    color: #ffffff;
+    font-weight: 700;
+    font-size: 0.8125rem;
+    letter-spacing: 0.01em;
+    cursor: pointer;
+    transition: background-color 0.15s ease, transform 0.1s ease;
+}
+
+.bbk-box-now-popup-select:hover { background: #00a876; transform: translateY(-1px); }
+.bbk-box-now-popup-select:active { transform: translateY(0); }
+
+.bbk-box-now-popup-select--selected,
+.bbk-box-now-popup-select--selected:hover {
+    background: var(--bbk-color-muted);
+    cursor: default;
+}
+
+/* Continue / submit buttons — same look as the drawer's checkout CTA */
+
+.bbk-checkout-continue {
+    display: block;
+    width: 100%;
+    padding: 0.875rem 1.25rem;
+    border: 1px solid var(--bbk-color-accent);
+    border-radius: var(--bbk-radius);
+    background: var(--bbk-color-accent);
+    color: var(--bbk-color-accent-text);
+    font: inherit;
+    font-weight: 600;
+    text-align: center;
+    text-decoration: none;
+    box-sizing: border-box;
+    cursor: pointer;
+    transition: opacity 0.15s ease;
+}
+
+.bbk-checkout-continue:hover { opacity: 0.85; }
+
+.bbk-checkout-continue:disabled {
+    cursor: not-allowed;
+    opacity: 0.4;
+}
+
+/* Order summary column */
+
+.bbk-checkout-aside { position: sticky; top: 1.5rem; }
+
+.bbk-checkout-summary {
+    padding: 1.5rem;
+    border: 1px solid var(--bbk-color-border);
+    border-radius: var(--bbk-radius);
+    background: var(--bbk-color-bg);
+}
+
+.bbk-checkout-summary-heading {
+    margin: 0 0 1.25rem;
+    font-size: 1.125rem;
+    font-weight: 700;
+}
+
+/* Already on the checkout page — the drawer's own "go to checkout" CTA has
+   nowhere further to send you from here. */
+.bbk-checkout-summary .bbk-cart-checkout { display: none; }
+
+/* ── Payment ───────────────────────────────────────────────────────── */
+
+.bbk-checkout-payment-options {
+    display: flex;
+    flex-direction: column;
+    gap: 0.75rem;
+}
+
+.bbk-checkout-payment-option {
+    display: flex;
+    align-items: center;
+    gap: 0.75rem;
+    padding: 0.875rem 1rem;
+    border: 1px solid var(--bbk-color-border);
+    border-radius: var(--bbk-radius-sm);
+    cursor: pointer;
+    transition: border-color 0.15s ease;
+}
+
+.bbk-checkout-payment-option:has(input:checked) { border-color: var(--bbk-color-accent); }
+
+.bbk-checkout-payment-option-name { font-weight: 600; }
+
+.bbk-payment-element { margin: 0.25rem 0; }
+
+.bbk-checkout-withdrawal {
+    margin: 0;
+    font-size: 0.8125rem;
+    color: var(--bbk-color-muted);
+}
+
+.bbk-checkout-withdrawal a { color: inherit; }
+
+.bbk-checkout-error {
+    margin: 0;
+    font-size: 0.875rem;
+    color: var(--bbk-color-danger);
+}
+
+/* Processing overlay — fixed, covers the page while a payment confirms. */
+.bbk-checkout-processing {
+    position: fixed;
+    inset: 0;
+    z-index: 1100;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 1rem;
+    background: color-mix(in srgb, var(--bbk-color-bg) 92%, transparent);
+    text-align: center;
+    padding: 1.5rem;
+}
+
+.bbk-spinner {
+    width: 2rem;
+    height: 2rem;
+    border: 3px solid var(--bbk-color-border);
+    border-top-color: var(--bbk-color-accent);
+    border-radius: 50%;
+    animation: bbk-spin 0.8s linear infinite;
+}
+
+@keyframes bbk-spin {
+    to { transform: rotate(360deg); }
+}
+
+/* ── Confirmation page ─────────────────────────────────────────────── */
+
+.bbk-confirmation {
+    max-width: 720px;
+    margin: 0 auto;
+    padding: 3rem 1.5rem 5rem;
+    font-family: var(--bbk-font);
+    color: var(--bbk-color-text);
+}
+
+.bbk-confirmation-heading {
+    margin: 0 0 1rem;
+    font-size: 1.75rem;
+    font-weight: 700;
+}
+
+.bbk-confirmation-ref { margin: 0 0 0.25rem; }
+
+.bbk-confirmation-meta {
+    margin: 0 0 1rem;
+    display: flex;
+    flex-direction: column;
+    gap: 0.25rem;
+}
+
+.bbk-confirmation-meta-row {
+    display: flex;
+    justify-content: space-between;
+    gap: 1rem;
+    font-size: 0.9375rem;
+}
+
+.bbk-confirmation-meta-row dt { color: var(--bbk-color-muted); }
+.bbk-confirmation-meta-row dd { margin: 0; font-weight: 600; }
+
+.bbk-confirmation-body {
+    margin: 2rem 0;
+    display: grid;
+    gap: 2.5rem;
+}
+
+@media (min-width: 640px) {
+    .bbk-confirmation-body { grid-template-columns: 1fr 1fr; }
+}
+
+.bbk-confirmation-lines {
+    display: flex;
+    flex-direction: column;
+    gap: 0.75rem;
+}
+
+.bbk-confirmation-line {
+    display: grid;
+    grid-template-columns: 72px 1fr auto;
+    align-items: start;
+    gap: 0.875rem;
+}
+
+.bbk-confirmation-line-detail { min-width: 0; }
+
+.bbk-confirmation-line-qty { color: var(--bbk-color-muted); }
+
+.bbk-confirmation-lines .bbk-cart-summary { margin-top: 0.75rem; }
+
+.bbk-confirmation-addresses {
+    display: flex;
+    flex-direction: column;
+    gap: 1.5rem;
+}
+
+.bbk-confirmation-address-heading {
+    margin: 0 0 0.5rem;
+    font-size: 0.9375rem;
+    font-weight: 700;
+}
+
+.bbk-address-lines {
+    font-style: normal;
+    display: flex;
+    flex-direction: column;
+    gap: 0.125rem;
+    font-size: 0.875rem;
+    color: var(--bbk-color-muted);
+}

resources/js/app.js

@@ -10,8 +10,13 @@ window.Turbo.session.drive = false;
 
 import { Application } from "@hotwired/stimulus";
 import { registerControllers } from "./stimulus/index";
+import { registerCheckout } from "./checkout";
 
 const application = Application.start();
 application.debug = false;
 
 registerControllers(application);
+
+// Portable cart + checkout module (destined for boboko-core). Owns its own
+// bbk-* Stimulus controllers; this is the only wiring line it needs here.
+registerCheckout(application);

resources/js/checkout/bbk-add-to-cart-controller.js

@@ -0,0 +1,57 @@
+import { Controller } from '@hotwired/stimulus'
+import { csrfToken } from './csrf'
+
+// Sits on an <x-checkout::add-to-cart> <form>. Submits the line to the cart
+// via fetch and hands the server-rendered cart body to the drawer through the
+// `bbk-cart:changed` window event. No DOM building here — the drawer
+// (bbk-cart-controller) owns rendering.
+export default class extends Controller {
+    static targets = ['error']
+
+    async add(event) {
+        event.preventDefault()
+
+        const form = this.element
+        const submit = form.querySelector('[type="submit"]')
+
+        this.clearError()
+        form.setAttribute('data-bbk-add-to-cart-state', 'loading')
+        if (submit) submit.disabled = true
+
+        try {
+            const response = await fetch(form.action, {
+                method: 'POST',
+                headers: {
+                    'X-CSRF-TOKEN': csrfToken(),
+                    'X-Requested-With': 'XMLHttpRequest',
+                    Accept: 'application/json',
+                },
+                body: new FormData(form),
+            })
+
+            if (!response.ok) {
+                const data = await response.json().catch(() => null)
+                this.showError(data?.error)
+                return
+            }
+
+            window.dispatchEvent(new CustomEvent('bbk-cart:changed', {
+                detail: { html: await response.text() },
+            }))
+        } finally {
+            form.removeAttribute('data-bbk-add-to-cart-state')
+            if (submit) submit.disabled = false
+        }
+    }
+
+    showError(message) {
+        if (!this.hasErrorTarget || !message) return
+        this.errorTarget.textContent = message
+        this.errorTarget.hidden = false
+    }
+
+    clearError() {
+        if (!this.hasErrorTarget) return
+        this.errorTarget.hidden = true
+    }
+}

resources/js/checkout/bbk-box-now-locker-controller.js

@@ -0,0 +1,220 @@
+import { Controller } from '@hotwired/stimulus'
+import L from 'leaflet'
+import 'leaflet/dist/leaflet.css'
+import { csrfToken } from './csrf'
+
+// Box Now's own brand green, used for the pin instead of Leaflet's default
+// blue teardrop — a small SVG data URI rather than another bundled asset.
+const PIN_COLOR = '#00c389'
+const PIN_COLOR_SELECTED = '#0a7a52'
+
+function pinIcon(color) {
+    const svg = `
+        <svg xmlns="http://www.w3.org/2000/svg" width="34" height="46" viewBox="0 0 34 46">
+            <path
+                d="M17 0C7.6 0 0 7.6 0 17c0 12.75 17 29 17 29s17-16.25 17-29C34 7.6 26.4 0 17 0Z"
+                fill="${color}"
+                stroke="#ffffff"
+                stroke-width="1.5"
+            />
+            <circle cx="17" cy="17" r="7" fill="#ffffff" />
+        </svg>
+    `
+
+    return L.divIcon({
+        className: 'bbk-box-now-pin',
+        html: svg,
+        iconSize: [34, 46],
+        iconAnchor: [17, 46],
+        popupAnchor: [0, -40],
+    })
+}
+
+const ICON = pinIcon(PIN_COLOR)
+const ICON_SELECTED = pinIcon(PIN_COLOR_SELECTED)
+
+// A self-hosted Leaflet map standing in for Box Now's own Destination Map
+// JS widget — that widget only talks to Box Now's Production API (see
+// their Partner API manual §4.1), so it can't be used while developing
+// against Stage credentials. Same underlying /destinations data, rendered
+// with OpenStreetMap tiles instead of Box Now's map.
+//
+// Visibility is toggled by bbk-checkout-form (see its own
+// toggleBoxNowLocker()) whenever the "box-now" shipping option becomes
+// selected/deselected — this controller only owns loading the locker list
+// once visible, rendering pins, and autosaving the chosen one.
+export default class extends Controller {
+    static targets = ['map', 'search', 'status', 'chosen']
+
+    static values = {
+        lockersUrl: String,
+        selectUrl: String,
+        loading: String,
+        selectLabel: String,
+        selectedLabel: String,
+        noResults: String,
+    }
+
+    // Athens — a reasonable default center before any locker is loaded.
+    static DEFAULT_CENTER = [37.9838, 23.7275]
+
+    connect() {
+        this.map = null
+        this.markers = new Map()
+        this.selectedId = null
+        this.loaded = false
+
+        if (!this.element.hidden) this.show()
+    }
+
+    disconnect() {
+        this.map?.remove()
+        this.map = null
+    }
+
+    // Called by bbk-checkout-form right after it un-hides this element.
+    show() {
+        this.element.hidden = false
+
+        // Leaflet measures its container's size on init — doing that while
+        // the element (or an ancestor) is still `hidden` produces a
+        // collapsed/blank map, so this is deferred to the same tick `hidden`
+        // is cleared, then Leaflet is nudged once more via invalidateSize().
+        requestAnimationFrame(() => {
+            if (!this.map) this.initMap()
+            this.map.invalidateSize()
+
+            if (!this.loaded) this.loadLockers()
+        })
+    }
+
+    hide() {
+        this.element.hidden = true
+    }
+
+    initMap() {
+        this.map = L.map(this.mapTarget).setView(this.constructor.DEFAULT_CENTER, 10)
+
+        L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
+            attribution: '&copy; OpenStreetMap contributors',
+            maxZoom: 19,
+        }).addTo(this.map)
+
+        // Delegated: popup content is re-inserted by Leaflet on every open,
+        // so a listener bound once on the map's container beats binding (and
+        // losing) one on the button each time a popup renders.
+        this.map.getContainer().addEventListener('click', (event) => {
+            const button = event.target.closest('[data-locker-id]')
+            if (button) this.select(button.dataset.lockerId)
+        })
+    }
+
+    async loadLockers() {
+        this.setStatus(this.loadingValue)
+
+        try {
+            const response = await fetch(this.lockersUrlValue, {
+                headers: { Accept: 'application/json' },
+            })
+
+            if (!response.ok) return
+
+            const { lockers } = await response.json()
+            this.loaded = true
+            this.lockers = new Map(lockers.map((locker) => [String(locker.id), locker]))
+            this.renderMarkers(lockers)
+            this.setStatus('')
+        } catch {
+            this.setStatus('')
+        }
+    }
+
+    renderMarkers(lockers) {
+        this.markers.forEach((marker) => marker.remove())
+        this.markers = new Map(lockers.map((locker) => {
+            const marker = L.marker([locker.lat, locker.lng], { icon: ICON })
+                .addTo(this.map)
+                .bindPopup(this.popupHtml(locker), { maxWidth: 260 })
+
+            return [String(locker.id), marker]
+        }))
+
+        if (this.markers.size) {
+            this.map.fitBounds(L.featureGroup([...this.markers.values()]).getBounds().pad(0.2))
+        }
+    }
+
+    popupHtml(locker) {
+        const isSelected = String(locker.id) === this.selectedId
+
+        return `
+            <div class="bbk-box-now-popup">
+                ${locker.image ? `<img class="bbk-box-now-popup-image" src="${locker.image}" alt="">` : ''}
+                <p class="bbk-box-now-popup-name">${locker.name}</p>
+                <p class="bbk-box-now-popup-address">
+                    ${[locker.addressLine1, locker.addressLine2].filter(Boolean).join(', ')}
+                    ${locker.postalCode ? ` ${locker.postalCode}` : ''}
+                </p>
+                ${locker.note ? `<p class="bbk-box-now-popup-note">${locker.note}</p>` : ''}
+                <button
+                    type="button"
+                    class="bbk-box-now-popup-select${isSelected ? ' bbk-box-now-popup-select--selected' : ''}"
+                    data-locker-id="${locker.id}"
+                    ${isSelected ? 'disabled' : ''}
+                >
+                    ${isSelected ? this.selectedLabelValue : this.selectLabelValue}
+                </button>
+            </div>
+        `
+    }
+
+    async select(lockerId) {
+        const locker = this.lockers?.get(String(lockerId))
+        if (!locker) return
+
+        const previousId = this.selectedId
+        this.selectedId = String(lockerId)
+
+        this.restyleMarker(previousId, ICON)
+        this.restyleMarker(this.selectedId, ICON_SELECTED)
+        this.markers.get(this.selectedId)?.setPopupContent(this.popupHtml(locker))
+
+        this.chosenTarget.hidden = false
+        this.chosenTarget.textContent = locker.addressLine1
+            ? `${locker.name} — ${locker.addressLine1}`
+            : locker.name
+
+        const body = new FormData()
+        body.append('locker_id', locker.id)
+        body.append('locker_name', locker.name ?? '')
+        body.append('locker_address', locker.addressLine1 ?? '')
+
+        try {
+            await fetch(this.selectUrlValue, {
+                method: 'POST',
+                headers: {
+                    'X-CSRF-TOKEN': csrfToken(),
+                    'X-Requested-With': 'XMLHttpRequest',
+                    Accept: 'application/json',
+                },
+                body,
+            })
+        } catch {
+            // Best-effort autosave, same as the rest of checkout — a failed
+            // save here surfaces later at place-order time via the normal
+            // shipment-creation error path, not as an inline field error.
+        }
+    }
+
+    restyleMarker(lockerId, icon) {
+        if (!lockerId) return
+        this.markers.get(lockerId)?.setIcon(icon)
+    }
+
+    setStatus(text) {
+        if (!this.hasStatusTarget) return
+
+        this.statusTarget.textContent = text
+        this.statusTarget.hidden = !text
+    }
+}

resources/js/checkout/bbk-cart-controller.js

@@ -0,0 +1,161 @@
+import { Controller } from '@hotwired/stimulus'
+import { csrfToken } from './csrf'
+
+// Drives the slide-in cart drawer. One instance, on the drawer root in
+// checkout/drawer.blade.php.
+//
+// - listens on window for `bbk-cart:changed` (from bbk-add-to-cart and from
+//   this drawer's own line forms) and swaps in the server-rendered cart body
+// - handles the in-drawer quantity / remove forms (fetch + method spoofing)
+// - re-emits `bbk-cart:updated` {count, total} after every render so the host
+//   (e.g. the header bag icon) can react
+//
+// Appearance is entirely CSS-driven: open state is the data-bbk-cart-state
+// attribute on the root, nothing here touches styles or class lists.
+export default class extends Controller {
+    static targets = ['panel', 'body', 'error']
+
+    connect() {
+        this.onChanged = this.onChanged.bind(this)
+        this.onKeydown = this.onKeydown.bind(this)
+        this.updateTimers = new Map() // line id -> pending debounce timer
+
+        window.addEventListener('bbk-cart:changed', this.onChanged)
+        window.addEventListener('bbk-cart:open', this.open.bind(this))
+        document.addEventListener('keydown', this.onKeydown)
+
+        // Prime the host with the count rendered server-side on page load.
+        this.emitUpdated(this.element.querySelector('[data-bbk-cart-count]'))
+    }
+
+    disconnect() {
+        window.removeEventListener('bbk-cart:changed', this.onChanged)
+        document.removeEventListener('keydown', this.onKeydown)
+        this.updateTimers.forEach((timer) => clearTimeout(timer))
+    }
+
+    onChanged(event) {
+        if (event.detail?.html) this.replaceBody(event.detail.html)
+        this.open()
+    }
+
+    onKeydown(event) {
+        if (event.key === 'Escape' && !this.element.hidden) this.close()
+    }
+
+    open() {
+        if (!this.element.hidden) return
+        this.element.hidden = false
+        // Next frame, so the panel transitions from its off-canvas start.
+        requestAnimationFrame(() => this.element.setAttribute('data-bbk-cart-state', 'open'))
+    }
+
+    close() {
+        this.element.removeAttribute('data-bbk-cart-state')
+
+        const panel = this.panelTarget
+        const done = () => {
+            this.element.hidden = true
+            panel.removeEventListener('transitionend', done)
+        }
+        panel.addEventListener('transitionend', done)
+    }
+
+    // change on a line quantity input, or submit of a line's remove form
+    submit(event) {
+        event.preventDefault()
+        const form = event.target.closest('form')
+        if (!form) return
+
+        // A remove is a deliberate, one-shot action — only the quantity form
+        // (typing, or the +/- stepper below) benefits from debouncing.
+        form.classList.contains('bbk-cart-qty') ? this.scheduleSend(form) : this.send(form)
+    }
+
+    // +/- stepper buttons inside a line
+    step(event) {
+        event.preventDefault()
+        const form = event.target.closest('form')
+        const input = form.querySelector('input[type="number"]')
+        const next = Math.max(0, parseInt(input.value || '0', 10) + Number(event.params.dir))
+        input.value = String(next)
+        this.scheduleSend(form)
+    }
+
+    // Repeated clicks (or spinner nudges) update the input instantly but only
+    // send once they settle for 300ms — sending on every single click was
+    // firing overlapping requests that raced each other and made the drawer
+    // visibly flicker/lag under quick clicking.
+    scheduleSend(form) {
+        const lineId = form.closest('[data-bbk-line-id]')?.dataset.bbkLineId
+        if (!lineId) return this.send(form)
+
+        clearTimeout(this.updateTimers.get(lineId))
+        this.updateTimers.set(lineId, setTimeout(() => {
+            this.updateTimers.delete(lineId)
+            this.send(form)
+        }, 300))
+    }
+
+    async send(form) {
+        this.bodyTarget.setAttribute('aria-busy', 'true')
+        this.clearError()
+
+        try {
+            const response = await fetch(form.action, {
+                method: 'POST',
+                headers: {
+                    'X-CSRF-TOKEN': csrfToken(),
+                    'X-Requested-With': 'XMLHttpRequest',
+                    Accept: 'application/json',
+                },
+                body: new FormData(form),
+            })
+
+            if (response.ok) {
+                this.replaceBody(await response.text())
+                return
+            }
+
+            const data = await response.json().catch(() => null)
+            this.showError(data?.error)
+
+            // The rejected quantity (typed, or from a +/- click) is left
+            // sitting in the input with nothing to correct it — the update
+            // never reached the cart, so the input must be put back to what
+            // the cart actually still holds, not just left showing whatever
+            // was rejected.
+            const input = form.querySelector('[data-bbk-cart-confirmed-quantity]')
+            if (input) input.value = input.dataset.bbkCartConfirmedQuantity
+        } finally {
+            this.bodyTarget.removeAttribute('aria-busy')
+        }
+    }
+
+    showError(message) {
+        if (!this.hasErrorTarget || !message) return
+        this.errorTarget.textContent = message
+        this.errorTarget.hidden = false
+    }
+
+    clearError() {
+        if (!this.hasErrorTarget) return
+        this.errorTarget.hidden = true
+    }
+
+    replaceBody(html) {
+        this.bodyTarget.innerHTML = html
+        this.emitUpdated(this.bodyTarget.querySelector('[data-bbk-cart-count]'))
+    }
+
+    emitUpdated(node) {
+        if (!node) return
+
+        window.dispatchEvent(new CustomEvent('bbk-cart:updated', {
+            detail: {
+                count: parseInt(node.dataset.bbkCartCount || '0', 10),
+                total: parseInt(node.dataset.bbkCartTotal || '0', 10),
+            },
+        }))
+    }
+}

resources/js/checkout/bbk-checkout-form-controller.js

@@ -0,0 +1,226 @@
+import { Controller } from '@hotwired/stimulus'
+import { csrfToken } from './csrf'
+
+// Drives the checkout page's left column: contact tabs, the same-as-billing
+// toggle, and — the bulk of it — autosaving the address form and the shipping
+// method with no submit buttons.
+//
+// Flow: any `change` in the address form is debounced ~400ms, then the whole
+// form is POSTed to saveUrl. The server persists leniently and returns
+// { errors, shippingOptionsHtml, summaryHtml }. We swap the shipping-options
+// block in place and hand the summary fragment to the drawer's bbk-cart
+// controller via the `bbk-cart:changed` window event (same mechanism the drawer
+// already uses). Shipping-method radios post to selectShippingUrl the same way.
+export default class extends Controller {
+    static targets = [
+        'sameAsBilling', 'shippingFields',
+        'form', 'shippingOptions', 'status',
+    ]
+
+    static values = {
+        saveUrl: String,
+        selectShippingUrl: String,
+        statusSaving: String,
+        statusSaved: String,
+        statusError: String,
+    }
+
+    connect() {
+        this.saveTimer = null
+        this.saveController = null
+        this.statusTimer = null
+        this.shippingPromise = null
+
+        if (this.hasSameAsBillingTarget) this.applySameAsBilling()
+    }
+
+    disconnect() {
+        clearTimeout(this.saveTimer)
+        clearTimeout(this.statusTimer)
+        this.saveController?.abort()
+    }
+
+    // ── Same as billing ────────────────────────────────────────────────
+
+    toggleSameAsBilling() {
+        this.applySameAsBilling()
+    }
+
+    applySameAsBilling() {
+        const on = this.sameAsBillingTarget.checked
+
+        // Checked: shipping *is* billing — copy every value across, then hide +
+        // disable so the browser doesn't submit them; the server reuses billing.
+        // Unchecked: reveal them pre-filled from billing wherever still empty.
+        this.element.querySelectorAll('[name^="billing_"]').forEach((billingField) => {
+            const shippingField = this.element.querySelector(
+                `[name="${billingField.name.replace(/^billing_/, 'shipping_')}"]`,
+            )
+            if (shippingField && (on || !shippingField.value)) {
+                shippingField.value = billingField.value
+            }
+        })
+
+        this.shippingFieldsTarget.hidden = on
+        this.shippingFieldsTarget.querySelectorAll('input, select, textarea').forEach((field) => {
+            field.disabled = on
+        })
+    }
+
+    // ── Autosave ───────────────────────────────────────────────────────
+
+    scheduleSave(event) {
+        // The shipping-method and payment radios live inside this controller's
+        // element too, and this action is bound on .bbk-checkout-main to also
+        // catch the contact email/consent that sit outside the <form>. Only
+        // react to fields that actually belong to the address form.
+        const el = event.target
+        const belongsToForm = el.form?.id === 'bbk-address-form'
+        if (!belongsToForm) return
+
+        // No status during the wait — it only shows once the request is in flight,
+        // so the indicator isn't flickering "saving" on every keystroke.
+        clearTimeout(this.saveTimer)
+        this.saveTimer = setTimeout(() => this.save(), 700)
+    }
+
+    // Called by bbk-payment right before place-order — a debounced save (and
+    // the shipping-option auto-select that happens as part of it) might still
+    // be pending when the shopper clicks "place order"; this guarantees the
+    // server has processed the current form state first.
+    async flush() {
+        clearTimeout(this.saveTimer)
+        await this.save()
+        // A shipping-method radio click fires its own (undebounced) request —
+        // still async, still racy against an immediate "place order" click.
+        if (this.shippingPromise) await this.shippingPromise
+    }
+
+    async save() {
+        this.saveController?.abort()
+        this.saveController = new AbortController()
+        this.setStatus('saving')
+
+        try {
+            const response = await fetch(this.saveUrlValue, {
+                method: 'POST',
+                headers: {
+                    'X-CSRF-TOKEN': csrfToken(),
+                    'X-Requested-With': 'XMLHttpRequest',
+                    Accept: 'application/json',
+                },
+                body: new FormData(this.formTarget),
+                signal: this.saveController.signal,
+            })
+
+            if (!response.ok) return this.setStatus('error')
+
+            this.applyResult(await response.json())
+            this.setStatus('saved')
+        } catch (error) {
+            if (error.name !== 'AbortError') this.setStatus('error')
+        }
+    }
+
+    async selectShipping(event) {
+        this.toggleBoxNowLocker(event.target.value)
+
+        // Tracked so flush() can await it — nothing else stops "place order"
+        // (a separate, unrelated click) from racing ahead of this request.
+        this.shippingPromise = this.doSelectShipping(event.target.value)
+        await this.shippingPromise
+    }
+
+    // The dummy Box Now locker <select> (see shipping-options.blade.php)
+    // lives inside the #bbk-shipping-options fragment this controller
+    // re-renders wholesale on every shipping-option change — so its own
+    // Stimulus controller reconnects fresh each time and has no memory of
+    // which option was previously selected. This is the one place that
+    // knows the newly-chosen option's identifier, so it also owns
+    // showing/hiding the picker.
+    toggleBoxNowLocker(identifier) {
+        const picker = this.shippingOptionsTarget.querySelector('#bbk-box-now-locker')
+        if (!picker) return
+
+        const controller = this.application.getControllerForElementAndIdentifier(picker, 'bbk-box-now-locker')
+
+        if (identifier === 'box-now') {
+            controller?.show()
+        } else {
+            controller?.hide()
+        }
+    }
+
+    async doSelectShipping(value) {
+        this.saveController?.abort()
+        this.setStatus('saving')
+
+        const body = new FormData()
+        body.append('shipping_option', value)
+
+        try {
+            const response = await fetch(this.selectShippingUrlValue, {
+                method: 'POST',
+                headers: {
+                    'X-CSRF-TOKEN': csrfToken(),
+                    'X-Requested-With': 'XMLHttpRequest',
+                    Accept: 'application/json',
+                },
+                body,
+            })
+
+            if (!response.ok) return this.setStatus('error')
+
+            this.applyResult(await response.json())
+            this.setStatus('saved')
+        } catch {
+            this.setStatus('error')
+        } finally {
+            this.shippingPromise = null
+        }
+    }
+
+    applyResult(data) {
+        this.applyErrors(data.errors || {})
+
+        if (data.shippingOptionsHtml != null) {
+            this.shippingOptionsTarget.innerHTML = data.shippingOptionsHtml
+        }
+
+        if (data.summaryHtml != null) {
+            window.dispatchEvent(new CustomEvent('bbk-cart:changed', {
+                detail: { html: data.summaryHtml },
+            }))
+        }
+    }
+
+    applyErrors(errors) {
+        this.element.querySelectorAll('[data-bbk-field-error]').forEach((el) => {
+            const message = errors[el.dataset.bbkFieldError]
+            el.textContent = message || ''
+            el.hidden = !message
+
+            const field = this.element.querySelector(`[name="${el.dataset.bbkFieldError}"]`)
+            field?.classList.toggle('bbk-field-input--error', Boolean(message))
+        })
+    }
+
+    setStatus(state) {
+        if (!this.hasStatusTarget) return
+
+        const text = {
+            saving: this.statusSavingValue,
+            saved: this.statusSavedValue,
+            error: this.statusErrorValue,
+        }[state]
+
+        this.statusTarget.textContent = text
+        this.statusTarget.hidden = false
+        this.statusTarget.dataset.state = state
+
+        clearTimeout(this.statusTimer)
+        if (state === 'saved') {
+            this.statusTimer = setTimeout(() => { this.statusTarget.hidden = true }, 2000)
+        }
+    }
+}

resources/js/checkout/bbk-payment-controller.js

@@ -0,0 +1,289 @@
+import { Controller } from '@hotwired/stimulus'
+import { csrfToken } from './csrf'
+
+const STRIPE_JS = 'https://js.stripe.com/v3/'
+const POLL_INTERVAL = 1500
+const POLL_TIMEOUT = 30000
+
+// The payment step of the checkout page. Sits alongside bbk-checkout-form on
+// .bbk-checkout-main.
+//
+// - selectMethod: radio change -> persist via /payment-method, refresh the
+//   summary (COD fee), mount/unmount the Stripe Payment Element
+// - placeOrder: the real submit. For Stripe, builds a PaymentMethod client-side
+//   and POSTs it to /place-order, then routes on the JSON result:
+//     { redirect }                 -> order placed, go to confirmation
+//     { status:'pending', clientSecret } -> 3-D Secure: handleNextAction, then
+//                                    poll /order-status until the webhook places it
+//     { status:'failed'|'invalid'|'stale', message } -> show inline, re-enable
+export default class extends Controller {
+    static targets = ['element', 'terms', 'error', 'submit', 'processing', 'processingText']
+
+    static values = {
+        selectUrl: String,
+        placeOrderUrl: String,
+        orderStatusUrl: String,
+        stripeKey: String,
+        amount: Number,
+        currency: String,
+        termsRequired: String,
+        chooseMethod: String,
+        genericError: String,
+        processingSlow: String,
+    }
+
+    connect() {
+        this.stripe = null
+        this.elements = null
+        this.paymentElement = null
+
+        this.onSummaryUpdate = (event) => {
+            const total = event.detail?.total
+            if (typeof total === 'number' && this.elements) {
+                this.amountValue = total
+                this.elements.update({ amount: Math.max(total, 1) })
+            }
+
+            // Removing the last line while sitting on the checkout page (via
+            // the order summary's own remove form) must not leave "place
+            // order" clickable with nothing left to charge for — this fires
+            // from both the drawer and the checkout page's own summary
+            // instance, whichever the shopper actually used.
+            const count = event.detail?.count
+            if (typeof count === 'number' && this.hasSubmitTarget) {
+                this.submitTarget.disabled = count === 0
+            }
+        }
+        window.addEventListener('bbk-cart:updated', this.onSummaryUpdate)
+
+        if (this.selectedIsStripe()) this.mountStripe()
+    }
+
+    disconnect() {
+        window.removeEventListener('bbk-cart:updated', this.onSummaryUpdate)
+        this.unmountStripe()
+    }
+
+    // ── Method selection ──────────────────────────────────────────────
+
+    async selectMethod(event) {
+        const isStripe = event.target.dataset.paymentDriver === 'stripe'
+
+        try {
+            const response = await fetch(this.selectUrlValue, {
+                method: 'POST',
+                headers: {
+                    'X-CSRF-TOKEN': csrfToken(),
+                    'X-Requested-With': 'XMLHttpRequest',
+                    Accept: 'application/json',
+                },
+                body: new URLSearchParams({ payment_type: event.target.value }),
+            })
+            if (response.ok) {
+                const data = await response.json()
+                if (data.summaryHtml != null) {
+                    window.dispatchEvent(new CustomEvent('bbk-cart:changed', { detail: { html: data.summaryHtml } }))
+                }
+            }
+        } catch {
+            // summary just won't refresh — non-fatal
+        }
+
+        isStripe ? this.mountStripe() : this.unmountStripe()
+    }
+
+    selectedRadio() {
+        return this.element.querySelector('input[name="payment_type"]:checked')
+    }
+
+    selectedIsStripe() {
+        return this.selectedRadio()?.dataset.paymentDriver === 'stripe'
+    }
+
+    // ── Stripe Payment Element ────────────────────────────────────────
+
+    async loadStripe() {
+        if (window.Stripe) return window.Stripe
+
+        await new Promise((resolve, reject) => {
+            const existing = document.querySelector(`script[src="${STRIPE_JS}"]`)
+            if (existing) {
+                existing.addEventListener('load', resolve)
+                existing.addEventListener('error', reject)
+                return
+            }
+            const script = document.createElement('script')
+            script.src = STRIPE_JS
+            script.onload = resolve
+            script.onerror = reject
+            document.head.appendChild(script)
+        })
+
+        return window.Stripe
+    }
+
+    async mountStripe() {
+        if (this.paymentElement || !this.stripeKeyValue) return
+
+        const Stripe = await this.loadStripe()
+        this.stripe = this.stripe || Stripe(this.stripeKeyValue)
+
+        this.elements = this.stripe.elements({
+            mode: 'payment',
+            amount: Math.max(this.amountValue, 1),
+            currency: this.currencyValue,
+            paymentMethodCreation: 'manual',
+            // Card only — matches the server confirming with
+            // automatic_payment_methods.allow_redirects = 'never' (no
+            // return_url in our flow: 3-D Secure resolves in-page via
+            // handleNextAction, never a full-page redirect).
+            paymentMethodTypes: ['card'],
+        })
+        this.paymentElement = this.elements.create('payment')
+        this.paymentElement.mount(this.elementTarget)
+        this.elementTarget.hidden = false
+    }
+
+    unmountStripe() {
+        this.paymentElement?.unmount()
+        this.paymentElement = null
+        this.elements = null
+
+        if (this.hasElementTarget) {
+            this.elementTarget.innerHTML = ''
+            this.elementTarget.hidden = true
+        }
+    }
+
+    // ── Place order ──────────────────────────────────────────────────
+
+    // Sibling controller on the same element (.bbk-checkout-main) — used to
+    // flush a pending debounced address autosave before placing the order.
+    get checkoutForm() {
+        return this.application.getControllerForElementAndIdentifier(this.element, 'bbk-checkout-form')
+    }
+
+    async placeOrder() {
+        this.clearError()
+        this.submitTarget.disabled = true
+
+        // A debounced address save (and the shipping-option auto-select that
+        // happens as part of it) might still be pending — make sure the
+        // server has the latest state before we ask it to place the order.
+        await this.checkoutForm?.flush()
+
+        if (!this.termsTarget.checked) {
+            this.submitTarget.disabled = false
+            this.showError(this.termsRequiredValue)
+            return
+        }
+
+        const radio = this.selectedRadio()
+        if (!radio) {
+            this.submitTarget.disabled = false
+            this.showError(this.chooseMethodValue)
+            return
+        }
+
+        let paymentMethodId = null
+        if (radio.dataset.paymentDriver === 'stripe') {
+            const { error: submitError } = await this.elements.submit()
+            if (submitError) return this.fail(submitError.message)
+
+            const { error: pmError, paymentMethod } = await this.stripe.createPaymentMethod({ elements: this.elements })
+            if (pmError) return this.fail(pmError.message)
+            paymentMethodId = paymentMethod.id
+        }
+
+        let data
+        try {
+            const response = await fetch(this.placeOrderUrlValue, {
+                method: 'POST',
+                headers: {
+                    'X-CSRF-TOKEN': csrfToken(),
+                    'X-Requested-With': 'XMLHttpRequest',
+                    Accept: 'application/json',
+                },
+                body: new URLSearchParams({
+                    payment_type: radio.value,
+                    payment_method: paymentMethodId ?? '',
+                    terms_accepted: '1',
+                }),
+            })
+            data = await response.json()
+        } catch {
+            return this.fail(this.genericErrorValue)
+        }
+
+        if (data.redirect) {
+            window.location.assign(data.redirect)
+            return
+        }
+
+        if (data.status === 'pending' && data.clientSecret) {
+            await this.resolvePending(data.clientSecret)
+            return
+        }
+
+        // Points at the section that actually needs attention, rather than
+        // leaving a generic error and making the shopper hunt for it — e.g. a
+        // region with 2+ shipping methods needs an explicit pick, easy to miss.
+        if (data.field === 'shipping_option') {
+            document.getElementById('bbk-shipping-options')?.scrollIntoView({ block: 'center', behavior: 'smooth' })
+            this.fail(data.message || data.error || this.genericErrorValue, { scroll: false })
+            return
+        }
+
+        this.fail(data.message || data.error || this.genericErrorValue)
+    }
+
+    async resolvePending(clientSecret) {
+        this.processingTarget.hidden = false
+
+        const { error } = await this.stripe.handleNextAction({ clientSecret })
+        if (error) {
+            this.processingTarget.hidden = true
+            return this.fail(error.message)
+        }
+
+        // 3-D Secure cleared client-side — the webhook places the order. Poll.
+        const startedAt = Date.now()
+        const tick = async () => {
+            try {
+                const response = await fetch(this.orderStatusUrlValue, { headers: { Accept: 'application/json' } })
+                const data = await response.json()
+                if (data.placed && data.redirect) {
+                    window.location.assign(data.redirect)
+                    return
+                }
+            } catch {
+                // keep polling
+            }
+
+            if (Date.now() - startedAt > POLL_TIMEOUT) {
+                this.processingTextTarget.textContent = this.processingSlowValue
+                return
+            }
+            setTimeout(tick, POLL_INTERVAL)
+        }
+        tick()
+    }
+
+    // ── helpers ──────────────────────────────────────────────────────
+
+    fail(message, { scroll = true } = {}) {
+        this.showError(message, { scroll })
+        this.submitTarget.disabled = false
+    }
+
+    showError(message, { scroll = true } = {}) {
+        this.errorTarget.textContent = message
+        this.errorTarget.hidden = false
+        if (scroll) this.errorTarget.scrollIntoView({ block: 'center', behavior: 'smooth' })
+    }
+
+    clearError() {
+        this.errorTarget.textContent = ''
+        this.errorTarget.hidden = true
+    }
+}

resources/js/checkout/csrf.js

@@ -0,0 +1,6 @@
+// Reads the CSRF token from the standard <meta name="csrf-token"> tag every
+// boboko host renders in its layout <head>. Kept as its own module so both
+// checkout controllers share one source.
+export function csrfToken() {
+    return document.querySelector('meta[name="csrf-token"]')?.getAttribute('content') || ''
+}

resources/js/checkout/index.js

@@ -0,0 +1,21 @@
+import BbkAddToCartController from './bbk-add-to-cart-controller'
+import BbkBoxNowLockerController from './bbk-box-now-locker-controller'
+import BbkCartController from './bbk-cart-controller'
+import BbkCheckoutFormController from './bbk-checkout-form-controller'
+import BbkPaymentController from './bbk-payment-controller'
+
+// Registers the checkout module's Stimulus controllers onto the host app's
+// Stimulus application. Call once from the host's JS entry point:
+//
+//     import { registerCheckout } from './checkout'
+//     registerCheckout(application)
+//
+// When this module moves to boboko-core this file ships with it unchanged;
+// only that one import line in the host entry point differs per project.
+export function registerCheckout(application) {
+    application.register('bbk-add-to-cart', BbkAddToCartController)
+    application.register('bbk-box-now-locker', BbkBoxNowLockerController)
+    application.register('bbk-cart', BbkCartController)
+    application.register('bbk-checkout-form', BbkCheckoutFormController)
+    application.register('bbk-payment', BbkPaymentController)
+}

resources/js/stimulus/cart-count-controller.js

@@ -0,0 +1,31 @@
+import { Controller } from '@hotwired/stimulus'
+
+// 3dealer-side glue for the checkout module. The module owns the cart and emits
+// `bbk-cart:updated` {count, total} on window after every change; this reflects
+// the line count on the header bag icon. How (or whether) that count is shown
+// is the host's call — hence this lives here, not in the module.
+export default class extends Controller {
+    static targets = ['badge']
+
+    connect() {
+        this.onUpdate = (event) => this.render(event.detail?.count ?? 0)
+        window.addEventListener('bbk-cart:updated', this.onUpdate)
+    }
+
+    disconnect() {
+        window.removeEventListener('bbk-cart:updated', this.onUpdate)
+    }
+
+    // Header cart icon click — there's no separate cart page, the drawer IS
+    // the cart. `bbk-cart:open` is the module's own event, already listened
+    // for by bbk-cart-controller.
+    open() {
+        window.dispatchEvent(new CustomEvent('bbk-cart:open'))
+    }
+
+    render(count) {
+        if (!this.hasBadgeTarget) return
+        this.badgeTarget.textContent = String(count)
+        this.badgeTarget.hidden = count < 1
+    }
+}

resources/js/stimulus/custom-field-upload-controller.js

@@ -0,0 +1,108 @@
+import { Controller } from '@hotwired/stimulus'
+
+// One product custom field of type `file` (see x-product-custom-fields).
+// Uploads the photo to the storefront's own endpoint (CustomFieldUploadController)
+// as soon as it's picked, then writes the returned File row's id (boboko-core's
+// Modules\Core\File\Models\File) into the hidden input the add-to-cart form
+// actually submits — the checkout module never receives the file itself.
+//
+// While uploading, the file input is marked invalid via setCustomValidity(),
+// so the browser's own form validation blocks add-to-cart until the id is in
+// place. A failed upload clears the input, so `required` blocks it too.
+export default class extends Controller {
+    static targets = ['file', 'reference', 'preview', 'error']
+    static values  = {
+        url: String,
+        label: String,
+        uploadingMessage: String,
+        failedMessage: String,
+    }
+
+    disconnect() {
+        this.abortController?.abort()
+        this.revokePreview()
+    }
+
+    async upload() {
+        this.reset()
+
+        const file = this.fileTarget.files[0]
+        if (!file) return
+
+        const abortController = new AbortController()
+        this.abortController = abortController
+
+        this.fileTarget.setCustomValidity(this.uploadingMessageValue)
+        this.fileTarget.setAttribute('aria-busy', 'true')
+
+        const body = new FormData()
+        body.append('file', file)
+        body.append('label', this.labelValue)
+
+        try {
+            const response = await fetch(this.urlValue, {
+                method: 'POST',
+                headers: {
+                    'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]')?.content ?? '',
+                    'X-Requested-With': 'XMLHttpRequest',
+                    Accept: 'application/json',
+                },
+                body,
+                signal: abortController.signal,
+            })
+            const data = await response.json().catch(() => null)
+
+            if (!response.ok || !data?.file_id) {
+                this.fail(data?.error)
+                return
+            }
+
+            this.referenceTarget.value = data.file_id
+            this.showPreview(file)
+        } catch (error) {
+            // A newer pick superseded this upload — reset() already handled it.
+            if (error.name === 'AbortError') return
+            this.fail()
+        } finally {
+            if (!abortController.signal.aborted) this.markIdle()
+        }
+    }
+
+    reset() {
+        this.abortController?.abort()
+        this.referenceTarget.value = ''
+        this.errorTarget.hidden = true
+        this.markIdle()
+        this.revokePreview()
+    }
+
+    fail(message) {
+        this.fileTarget.value = ''
+        this.errorTarget.textContent = message || this.failedMessageValue
+        this.errorTarget.hidden = false
+    }
+
+    markIdle() {
+        this.fileTarget.setCustomValidity('')
+        this.fileTarget.removeAttribute('aria-busy')
+    }
+
+    showPreview(file) {
+        this.previewUrl = URL.createObjectURL(file)
+        this.previewTarget.src = this.previewUrl
+        this.previewTarget.hidden = false
+    }
+
+    // Formats the browser can't render (HEIC outside Safari) — the file
+    // input's own filename is enough there.
+    hidePreview() {
+        this.previewTarget.hidden = true
+    }
+
+    revokePreview() {
+        if (this.previewUrl) URL.revokeObjectURL(this.previewUrl)
+        this.previewUrl = null
+        this.previewTarget.removeAttribute('src')
+        this.previewTarget.hidden = true
+    }
+}

resources/js/stimulus/index.js

@@ -6,7 +6,9 @@
 import AppearController         from './appear-controller'
 import AutoSubmitController     from './auto-submit-controller'
 import BackToTopController      from './back-to-top-controller'
+import CartCountController      from './cart-count-controller'
 import CarouselController       from './carousel-controller'
+import CustomFieldUploadController from './custom-field-upload-controller'
 import DropdownController       from './dropdown-controller'
 import FrameScrollController    from './frame-scroll-controller'
 import NavSearchController      from './nav-search-controller'
@@ -15,13 +17,17 @@ import ProductGalleryController from './product-gallery-controller'
 import QuantityController      from './quantity-controller'
 import RangeSliderController   from './range-slider-controller'
 import StarRatingController    from './star-rating-controller'
+import TabLinkController       from './tab-link-controller'
 import TabsController          from './tabs-controller'
+import WishlistController      from './wishlist-controller'
 
 export function registerControllers(application) {
     application.register('appear',           AppearController)
     application.register('auto-submit',      AutoSubmitController)
     application.register('back-to-top',      BackToTopController)
+    application.register('cart-count',       CartCountController)
     application.register('carousel',         CarouselController)
+    application.register('custom-field-upload', CustomFieldUploadController)
     application.register('dropdown',         DropdownController)
     application.register('frame-scroll',     FrameScrollController)
     application.register('nav-search',       NavSearchController)
@@ -30,5 +36,7 @@ export function registerControllers(application) {
     application.register('quantity',         QuantityController)
     application.register('range-slider',     RangeSliderController)
     application.register('star-rating',      StarRatingController)
+    application.register('tab-link',         TabLinkController)
     application.register('tabs',             TabsController)
+    application.register('wishlist',         WishlistController)
 }

resources/js/stimulus/product-form-controller.js

@@ -2,25 +2,138 @@ import { Controller } from '@hotwired/stimulus'
 import { formatPrice } from '../utils/format-price'
 
 export default class extends Controller {
-    static targets = ['price', 'image', 'swatch', 'colorName']
-    static values  = { variants: Array, selected: Number }
+    static targets = ['price', 'image', 'swatch', 'colorName', 'stockError', 'submit']
+    static values  = {
+        variants: Array,
+        selected: Number,
+        stockCheckUrl: String,
+        // Two pre-rendered translated templates (see product/show.blade.php)
+        // rather than one — this controller doesn't reimplement Laravel's
+        // pluralization rules, it just picks whichever of these two the
+        // count actually needs and fills in the number.
+        stockErrorOne: String,
+        stockErrorMany: String,
+    }
 
     connect() {
-        const params    = new URLSearchParams(window.location.search)
-        const urlId     = parseInt(params.get('variant'))
-        const defaultId = this.variantsValue[0]?.id
+        const params      = new URLSearchParams(window.location.search)
+        const urlId       = parseInt(params.get('variant'))
+        const urlVariant  = this.variantsValue.find(v => v.id === urlId)
+        const initial     = urlVariant ?? this.variantsValue[0]
 
-        this.selectedValue = urlId && this.variantsValue.find(v => v.id === urlId)
-            ? urlId
-            : defaultId
+        // A product can have several independent options (e.g. size + style
+        // + person-count) — this tracks the currently-picked value id per
+        // option handle, and selectVariant() below resolves the full
+        // combination back to one exact variant on every change.
+        this.selections = { ...initial?.options }
+        this.selectedValue = initial?.id
+
+        // Capture phase, on this controller's own root element (an ancestor
+        // of the checkout module's add-to-cart <form>) — runs BEFORE that
+        // form's own bubble-phase submit handler (bbk-add-to-cart#add), so a
+        // failed check can stop it from ever reaching the module at all. The
+        // module itself is never touched or modified for this: it keeps
+        // validating server-side regardless, this is purely an up-front,
+        // storefront-owned check (see [[project_checkout_module]] for why
+        // that split matters — stock UX is a catalog concern, not something
+        // the portable checkout module should own) — and a REAL, live check
+        // against the backend (ProductController::checkStock(), reading the
+        // Eloquent model directly), not page-load data that can go stale.
+        this.onSubmitCapture = this.checkStock.bind(this)
+        this.element.addEventListener('submit', this.onSubmitCapture, true)
+    }
+
+    disconnect() {
+        this.element.removeEventListener('submit', this.onSubmitCapture, true)
+    }
+
+    checkStock(event) {
+        const form = event.target
+        if (!form.matches('.bbk-add-to-cart')) return
+
+        // The re-submit this itself triggers below, once the backend has
+        // confirmed the quantity is fine — let that one through to the
+        // module's own submit handler instead of checking a second time.
+        if (form.dataset.bbkStockChecked) {
+            delete form.dataset.bbkStockChecked
+            return
+        }
+
+        event.preventDefault()
+        event.stopPropagation()
+        this.verifyStock(form)
+    }
+
+    async verifyStock(form) {
+        this.clearStockError()
+
+        const submit = form.querySelector('[type="submit"]')
+        if (submit) submit.disabled = true
+
+        const purchasableId = form.querySelector('[data-bbk-purchasable-input]')?.value
+        const quantity = form.querySelector('[name="quantity"]')?.value || '1'
+
+        try {
+            const url = new URL(this.stockCheckUrlValue, window.location.origin)
+            url.searchParams.set('variant', purchasableId)
+            url.searchParams.set('quantity', quantity)
+
+            const response = await fetch(url, { headers: { Accept: 'application/json' } })
+            const data = await response.json()
+
+            if (!data.ok) {
+                this.showStockError(data.stock)
+                return
+            }
+        } catch {
+            // Network hiccup — fall through and let the checkout module's
+            // own server-side check have the final word rather than
+            // silently blocking the shopper here.
+        } finally {
+            if (submit) submit.disabled = !this.selectedVariant?.inStock
+        }
+
+        form.dataset.bbkStockChecked = 'true'
+        form.requestSubmit()
+    }
+
+    showStockError(available) {
+        if (!this.hasStockErrorTarget) return
+
+        this.stockErrorTarget.textContent = available === 1
+            ? this.stockErrorOneValue
+            : this.stockErrorManyValue.replace(':count', String(available))
+        this.stockErrorTarget.hidden = false
+    }
+
+    clearStockError() {
+        if (!this.hasStockErrorTarget) return
+        this.stockErrorTarget.hidden = true
+    }
+
+    get selectedVariant() {
+        return this.variantsValue.find(v => v.id === this.selectedValue)
     }
 
     selectVariant(event) {
-        const id = parseInt(event.currentTarget.dataset.variantId)
-        this.selectedValue = id
+        const option = event.currentTarget.dataset.option
+        const valueId = parseInt(event.currentTarget.dataset.valueId)
+        this.selections = { ...this.selections, [option]: valueId }
+
+        const match = this.variantsValue.find(variant =>
+            Object.keys(this.selections).every(key => variant.options?.[key] === this.selections[key])
+        )
+
+        // No variant exists for this combination (e.g. an option value that
+        // isn't offered together with another currently-selected value) —
+        // leave the previous selection in place rather than pointing the
+        // add-to-cart form at nothing.
+        if (!match) return
+
+        this.selectedValue = match.id
 
         const url = new URL(window.location)
-        url.searchParams.set('variant', id)
+        url.searchParams.set('variant', match.id)
         window.history.pushState({}, '', url)
     }
 
@@ -30,6 +143,8 @@ export default class extends Controller {
         const variant = this.variantsValue.find(v => v.id === id)
         if (!variant) return
 
+        this.clearStockError()
+
         if (this.hasPriceTarget && variant.price !== null) {
             this.priceTarget.textContent = formatPrice(variant.price)
         }
@@ -38,13 +153,27 @@ export default class extends Controller {
             this.imageTarget.src = variant.image
         }
 
+        // Keep the checkout module's add-to-cart form pointed at the chosen
+        // variant. [data-bbk-purchasable-input] is that module's documented
+        // hook (see resources/views/checkout/components/add-to-cart.blade.php);
+        // this is the one place the two touch.
+        const purchasableInput = this.element.querySelector('[data-bbk-purchasable-input]')
+        if (purchasableInput) purchasableInput.value = id
+
+        // Out-of-stock variant (as of page load) can't be added at all.
+        if (this.hasSubmitTarget) this.submitTarget.disabled = !variant.inStock
+
         this.swatchTargets.forEach(swatch => {
-            const isSelected = parseInt(swatch.dataset.variantId) === id
+            const isSelected = this.selections[swatch.dataset.option] === parseInt(swatch.dataset.valueId)
             swatch.classList.toggle('is-selected', isSelected)
             swatch.setAttribute('aria-pressed', String(isSelected))
 
-            if (isSelected && this.hasColorNameTarget) {
-                this.colorNameTarget.textContent = swatch.getAttribute('aria-label')
+            if (isSelected) {
+                // Each color-option group has its own colorName echo (see
+                // x-ui.color-swatch) — matched by option handle so a swatch
+                // in one group never overwrites another group's label.
+                const colorName = this.colorNameTargets.find(target => target.dataset.option === swatch.dataset.option)
+                if (colorName) colorName.textContent = swatch.getAttribute('aria-label')
             }
         })
     }

resources/js/stimulus/star-rating-controller.js

@@ -1,9 +1,25 @@
 import { Controller } from '@hotwired/stimulus'
 
 export default class extends Controller {
-    static targets = ['star', 'input']
+    static targets = ['star', 'input', 'error']
     static values  = { rating: { type: Number, default: 0 } }
 
+    connect() {
+        this.#fill(this.ratingValue)
+    }
+
+    // Bound to the form's submit event (this controller sits on the <form>
+    // itself, not just the star widget) — a plain `required` on the hidden
+    // rating input would never surface: browsers exclude type="hidden" from
+    // constraint validation entirely, so there'd be nothing to see or hear.
+    validate(event) {
+        if (this.ratingValue < 1) {
+            event.preventDefault()
+            this.errorTarget.hidden = false
+            this.starTargets[0]?.focus()
+        }
+    }
+
     hover(event) {
         this.#fill(parseInt(event.currentTarget.dataset.value))
     }
@@ -16,6 +32,7 @@ export default class extends Controller {
         const val = parseInt(event.currentTarget.dataset.value)
         this.ratingValue = val
         this.inputTarget.value = val
+        this.errorTarget.hidden = true
 
         this.starTargets.forEach(star => {
             star.setAttribute('aria-pressed', String(parseInt(star.dataset.value) === val))

resources/js/stimulus/tab-link-controller.js

@@ -0,0 +1,15 @@
+import { Controller } from '@hotwired/stimulus'
+
+// Jumps to a tab panel from an element outside the tabs' own markup — the
+// review count and the "read more" link both sit elsewhere in the DOM, too
+// far apart from the tabs for a plain data-action, hence the outlet.
+export default class extends Controller {
+    static outlets = ['tabs']
+    static values = { panel: String }
+
+    activate(event) {
+        event?.preventDefault()
+        this.tabsOutlet.activate(this.panelValue)
+        this.tabsOutlet.element.scrollIntoView({ block: 'start', behavior: 'smooth' })
+    }
+}

resources/js/stimulus/tabs-controller.js

@@ -4,10 +4,10 @@ export default class extends Controller {
     static targets = ['button', 'panel']
 
     show(event) {
-        this.#activate(event.currentTarget.dataset.panel)
+        this.activate(event.currentTarget.dataset.panel)
     }
 
-    #activate(panelId) {
+    activate(panelId) {
         this.buttonTargets.forEach(btn => {
             const active = btn.dataset.panel === panelId
             btn.classList.toggle('is-active', active)

resources/js/stimulus/wishlist-controller.js

@@ -0,0 +1,42 @@
+import { Controller } from '@hotwired/stimulus'
+
+// Heart toggle (x-wishlist-button). Posts the form with fetch and reflects the
+// server's answer on aria-pressed, which the CSS uses to swap the outline and
+// filled heart. If the request fails, falls back to a normal form submit.
+export default class extends Controller {
+    static targets = ['button', 'status']
+
+    static values = {
+        addLabel: String,
+        removeLabel: String,
+        addedMessage: String,
+        removedMessage: String,
+    }
+
+    async toggle(event) {
+        event.preventDefault()
+
+        if (this.busy) return
+        this.busy = true
+
+        try {
+            const response = await fetch(this.element.action, {
+                method: 'POST',
+                headers: { Accept: 'application/json', 'X-Requested-With': 'XMLHttpRequest' },
+                body: new FormData(this.element),
+            })
+
+            if (!response.ok) throw new Error(`Wishlist toggle failed: ${response.status}`)
+
+            const { active } = await response.json()
+
+            this.buttonTarget.setAttribute('aria-pressed', active ? 'true' : 'false')
+            this.buttonTarget.setAttribute('aria-label', active ? this.removeLabelValue : this.addLabelValue)
+            this.statusTarget.textContent = active ? this.addedMessageValue : this.removedMessageValue
+        } catch {
+            this.element.submit()
+        } finally {
+            this.busy = false
+        }
+    }
+}

resources/views/account/email-code.blade.php

@@ -0,0 +1,65 @@
+@extends('layouts.account')
+
+@section('title', __('storefront.auth.enter_code'))
+
+@section('account')
+
+    <div class="flex max-w-2xl flex-col gap-12">
+
+        <div class="flex flex-col gap-6">
+            <h1 class="font-display text-h3 font-black tracking-tight sm:text-h2">
+                {{ __('storefront.auth.enter_code') }}
+            </h1>
+
+            <p>
+                {{ __('storefront.auth.code_sent_to') }} <strong class="break-all">{{ $email }}</strong>
+            </p>
+
+            <x-ui.status />
+        </div>
+
+        <form method="POST" action="{{ route('account.email.verify') }}" class="flex flex-col gap-8">
+            @csrf
+
+            <x-ui.field
+                :label="__('storefront.auth.code')"
+                for="account-email-code"
+                :required="true"
+                :error="$errors->first('code')"
+            >
+                <x-ui.input
+                    id="account-email-code"
+                    name="code"
+                    inputmode="numeric"
+                    autocomplete="one-time-code"
+                    pattern="[0-9]{6}"
+                    maxlength="6"
+                    :required="true"
+                    autofocus
+                    class="text-2xl font-bold tracking-[0.5em]"
+                    :aria-invalid="$errors->has('code') ? 'true' : null"
+                    :aria-describedby="$errors->has('code') ? 'account-email-code-error' : null"
+                />
+            </x-ui.field>
+
+            <div>
+                <x-ui.button type="submit">{{ __('storefront.account.email_confirm') }}</x-ui.button>
+            </div>
+        </form>
+
+        <div class="flex flex-wrap items-center gap-x-8 gap-y-4 text-sm">
+            <form method="POST" action="{{ route('account.email.resend') }}">
+                @csrf
+                <button type="submit" class="cursor-pointer underline hover:no-underline">
+                    {{ __('storefront.auth.resend_code') }}
+                </button>
+            </form>
+
+            <a href="{{ route('account.email.edit') }}" class="underline hover:no-underline">
+                {{ __('storefront.auth.change_email') }}
+            </a>
+        </div>
+
+    </div>
+
+@endsection

resources/views/account/email.blade.php

@@ -0,0 +1,53 @@
+@extends('layouts.account')
+
+@section('title', __('storefront.account.email_change_heading'))
+
+@section('account')
+
+    <div class="flex max-w-2xl flex-col gap-12">
+
+        <div class="flex flex-col gap-6">
+            <h1 class="font-display text-h3 font-black tracking-tight sm:text-h2">
+                {{ __('storefront.account.email_change_heading') }}
+            </h1>
+
+            <p>
+                {{ __('storefront.account.email_current') }} <strong class="break-all">{{ $user->email }}</strong>
+            </p>
+        </div>
+
+        <form method="POST" action="{{ route('account.email.send') }}" class="flex flex-col gap-8">
+            @csrf
+
+            <x-ui.field
+                :label="__('storefront.account.email_new')"
+                for="account-new-email"
+                :required="true"
+                :description="__('storefront.account.email_new_hint')"
+                :error="$errors->first('email')"
+            >
+                <x-ui.input
+                    id="account-new-email"
+                    name="email"
+                    type="email"
+                    autocomplete="email"
+                    :value="old('email')"
+                    :required="true"
+                    autofocus
+                    :aria-invalid="$errors->has('email') ? 'true' : null"
+                    :aria-describedby="$errors->has('email') ? 'account-new-email-error' : 'account-new-email-description'"
+                />
+            </x-ui.field>
+
+            <div class="flex flex-wrap items-center gap-8">
+                <x-ui.button type="submit">{{ __('storefront.auth.send_code') }}</x-ui.button>
+
+                <a href="{{ route('account') }}" class="text-sm underline hover:no-underline">
+                    {{ __('storefront.account.delete_cancel') }}
+                </a>
+            </div>
+        </form>
+
+    </div>
+
+@endsection

resources/views/account/orders/index.blade.php

@@ -0,0 +1,67 @@
+@extends('layouts.account')
+
+@section('title', __('storefront.account.nav_orders'))
+
+@section('account')
+
+    <div class="flex max-w-4xl flex-col gap-12">
+
+        <h1 class="font-display text-h3 font-black tracking-tight sm:text-h2">
+            {{ __('storefront.account.nav_orders') }}
+        </h1>
+
+        @if ($orders->isEmpty())
+            <div class="flex flex-col items-start gap-8">
+                <p>{{ __('storefront.orders.empty') }}</p>
+                <x-ui.button :href="route('products')" size="md">{{ __('storefront.orders.shop_now') }}</x-ui.button>
+            </div>
+        @else
+            {{-- A list, not a table, so each order can stack on mobile. The column
+                 headings are visual only; each cell carries its own sr-only label. --}}
+            <div>
+                <div class="hidden grid-cols-[1fr_1fr_1.5fr_1fr_auto] gap-6 border-b border-black pb-3 text-sm uppercase font-display font-extrabold sm:grid" aria-hidden="true">
+                    <span>{{ __('storefront.orders.date') }}</span>
+                    <span>{{ __('storefront.orders.number') }}</span>
+                    <span>{{ __('storefront.orders.status') }}</span>
+                    <span>{{ __('storefront.orders.total') }}</span>
+                    <span class="w-24"></span>
+                </div>
+
+                <ul>
+                    @foreach ($orders as $order)
+                        <li class="grid grid-cols-2 gap-x-6 gap-y-2 border-b border-black py-5 sm:grid-cols-[1fr_1fr_1.5fr_1fr_auto] sm:items-center">
+                            <span>
+                                <span class="sr-only">{{ __('storefront.orders.date') }}:</span>
+                                {{ $order->placed_at->format('d/m/Y') }}
+                            </span>
+                            <span class="text-right font-bold sm:text-left">
+                                <span class="sr-only">{{ __('storefront.orders.number') }}:</span>
+                                #{{ $order->reference }}
+                            </span>
+                            <span>
+                                <span class="sr-only">{{ __('storefront.orders.status') }}:</span>
+                                <x-order-status :status="$order->status" />
+                            </span>
+                            <span class="text-right sm:text-left">
+                                <span class="sr-only">{{ __('storefront.orders.total') }}:</span>
+                                {{ $order->total?->formatted() }}
+                            </span>
+                            <a
+                                href="{{ route('account.orders.show', ['orderId' => $order->id]) }}"
+                                class="col-span-2 mt-2 inline-flex w-24 items-center gap-2 font-bold underline hover:no-underline sm:col-span-1 sm:mt-0"
+                                aria-label="{{ __('storefront.orders.view_order', ['number' => $order->reference]) }}"
+                            >
+                                {{ __('storefront.orders.view') }}
+                                <x-ui.icon name="arrow-right" :size="16" />
+                            </a>
+                        </li>
+                    @endforeach
+                </ul>
+            </div>
+
+            <x-ui.pagination :paginator="$orders" />
+        @endif
+
+    </div>
+
+@endsection

resources/views/account/orders/show.blade.php

@@ -0,0 +1,158 @@
+@extends('layouts.account')
+
+@section('title', __('storefront.orders.order_title', ['number' => $order->reference]))
+
+@php
+    $productLines = $order->lines->where('type', '!=', 'shipping');
+    $shippingLine = $order->lines->firstWhere('type', 'shipping');
+@endphp
+
+@section('account')
+
+    <div class="flex max-w-4xl flex-col gap-12">
+
+        <div class="flex flex-col gap-6">
+            <a href="{{ route('account.orders') }}" class="inline-flex items-center gap-2 self-start text-sm underline hover:no-underline">
+                <x-ui.icon name="arrow-left" :size="16" />
+                {{ __('storefront.orders.back') }}
+            </a>
+
+            <h1 class="font-display text-h3 font-black tracking-tight sm:text-h2">
+                {{ __('storefront.orders.order_title', ['number' => $order->reference]) }}
+            </h1>
+        </div>
+
+        {{-- Summary --}}
+        <dl class="grid grid-cols-1 gap-6 border-y border-black py-6 sm:grid-cols-2 lg:grid-cols-4">
+            <div class="flex flex-col gap-1">
+                <dt class="text-sm text-neutral-500">{{ __('storefront.orders.date') }}</dt>
+                <dd>{{ $order->placed_at->format('d/m/Y') }}</dd>
+            </div>
+
+            <div class="flex flex-col gap-1">
+                <dt class="text-sm text-neutral-500">{{ __('storefront.orders.status') }}</dt>
+                <dd class="font-bold"><x-order-status :status="$order->status" /></dd>
+            </div>
+
+            @if ($paymentMethodName)
+                <div class="flex flex-col gap-1">
+                    <dt class="text-sm text-neutral-500">{{ __('storefront.orders.payment') }}</dt>
+                    <dd>{{ $paymentMethodName }}</dd>
+                </div>
+            @endif
+
+            @if ($shippingLine)
+                <div class="flex flex-col gap-1">
+                    <dt class="text-sm text-neutral-500">{{ __('storefront.orders.shipping_method') }}</dt>
+                    <dd>{{ $shippingLine->description }}</dd>
+                </div>
+            @endif
+
+            @foreach ($shipments as $shipment)
+                <div class="flex flex-col gap-1">
+                    <dt class="text-sm text-neutral-500">{{ __('storefront.orders.tracking') }}</dt>
+                    <dd class="break-all">{{ $shipment->tracking_reference }}</dd>
+                </div>
+            @endforeach
+        </dl>
+
+        {{-- Items + totals --}}
+        <section class="flex flex-col gap-6" aria-labelledby="order-items-heading">
+            <h2 id="order-items-heading" class="font-display text-h4 font-extrabold">{{ __('storefront.orders.items') }}</h2>
+
+            <ul>
+                @foreach ($productLines as $line)
+                    <li class="flex gap-4 border-b border-black py-5 sm:gap-6">
+                        <div class="size-18 shrink-0 bg-neutral-300 sm:size-24">
+                            @if ($thumb = $line->purchasable?->getThumbnailImage())
+                                <img src="{{ $thumb }}" alt="" aria-hidden="true" width="96" height="96" loading="lazy" class="size-full object-cover">
+                            @endif
+                        </div>
+
+                        <div class="flex min-w-0 flex-1 flex-col gap-1">
+                            {{-- Linked only while the product still exists and is published;
+                                 otherwise the name stays plain text (the order keeps it). --}}
+                            @php($lineProduct = $line->purchasable?->product)
+                            <p class="font-bold">
+                                @if ($lineProduct?->status === 'published')
+                                    <a href="{{ route('product.show', ['id' => $lineProduct->id]) }}" class="underline hover:no-underline">{{ $line->description }}</a>
+                                @else
+                                    {{ $line->description }}
+                                @endif
+                                <span class="font-normal">&times; {{ $line->quantity }}</span>
+                            </p>
+
+                            @if ($line->option)
+                                <p class="text-sm text-neutral-500">{{ $line->option }}</p>
+                            @endif
+
+                            @include('checkout::partials.line-custom-fields', ['line' => $line])
+                        </div>
+
+                        <p class="shrink-0 font-bold">{{ $line->sub_total?->formatted() }}</p>
+                    </li>
+                @endforeach
+            </ul>
+
+            <dl class="ml-auto flex w-full max-w-sm flex-col gap-2">
+                <div class="flex justify-between gap-6">
+                    <dt>{{ __('storefront.orders.subtotal') }}</dt>
+                    <dd>{{ $order->sub_total?->formatted() }}</dd>
+                </div>
+
+                @if ($order->discount_total?->value > 0)
+                    <div class="flex justify-between gap-6">
+                        <dt>{{ __('storefront.orders.discount') }}</dt>
+                        <dd>&minus;{{ $order->discount_total->formatted() }}</dd>
+                    </div>
+                @endif
+
+                <div class="flex justify-between gap-6">
+                    <dt>{{ __('storefront.orders.shipping') }}</dt>
+                    <dd>{{ $order->shipping_total?->formatted() }}</dd>
+                </div>
+
+                @if ($order->tax_total?->value > 0)
+                    <div class="flex justify-between gap-6 text-sm text-neutral-500">
+                        <dt>{{ __('storefront.orders.tax') }}</dt>
+                        <dd>{{ $order->tax_total->formatted() }}</dd>
+                    </div>
+                @endif
+
+                <div class="flex justify-between gap-6 border-t border-black pt-3 font-display text-h4 font-extrabold">
+                    <dt>{{ __('storefront.orders.total') }}</dt>
+                    <dd>{{ $order->total?->formatted() }}</dd>
+                </div>
+            </dl>
+        </section>
+
+        {{-- Addresses --}}
+        <div class="grid grid-cols-1 gap-12 sm:grid-cols-2">
+            @foreach ([
+                'shipping_to' => $order->shippingAddress,
+                'billing' => $order->billingAddress,
+            ] as $heading => $address)
+                @if ($address)
+                    <section class="flex flex-col gap-4" aria-labelledby="order-{{ $heading }}-heading">
+                        <h2 id="order-{{ $heading }}-heading" class="font-display text-h4 font-extrabold">{{ __("storefront.orders.{$heading}") }}</h2>
+
+                        <address class="flex flex-col not-italic">
+                            <span>{{ trim($address->first_name.' '.$address->last_name) }}</span>
+                            @if ($address->company_name)<span>{{ $address->company_name }}</span>@endif
+                            @if ($address->tax_identifier)<span>{{ __('storefront.account.tax_identifier') }}: {{ $address->tax_identifier }}</span>@endif
+                            <span>{{ $address->line_one }}</span>
+                            @if ($address->line_two)<span>{{ $address->line_two }}</span>@endif
+                            <span>{{ trim($address->postcode.' '.$address->city) }}</span>
+                            @if ($address->state)
+                                <span>{{ Lang::has("core::states.{$address->state}") ? __("core::states.{$address->state}") : $address->state }}</span>
+                            @endif
+                            @if ($address->contact_phone)<span>{{ $address->contact_phone }}</span>@endif
+                        </address>
+                    </section>
+                @endif
+            @endforeach
+        </div>
+
+    </div>
+
+@endsection

resources/views/account/show.blade.php

@@ -0,0 +1,204 @@
+@extends('layouts.account')
+
+@section('title', __('storefront.account.nav_profile'))
+
+@php
+    $wantsInvoice = (bool) old('invoice', filled($customer?->company_name) || filled($customer?->tax_identifier));
+
+    $regionOptions = $regions->map(fn ($region) => [
+        'value' => $region->name,
+        'label' => Lang::has("core::states.{$region->name}") ? __("core::states.{$region->name}") : $region->name,
+    ])->all();
+
+@endphp
+
+@section('account')
+
+    <div class="flex max-w-2xl flex-col gap-16">
+
+        <div class="flex flex-col gap-6">
+            <h1 class="font-display text-h3 font-black tracking-tight sm:text-h2">
+                {{ __('storefront.account.nav_profile') }}
+            </h1>
+
+            <x-ui.status />
+        </div>
+
+        {{-- Email: the login itself, so it's changed through its own verified flow --}}
+        <section class="flex flex-col gap-6" aria-labelledby="account-email-heading">
+            <h2 id="account-email-heading" class="font-display text-h4 font-extrabold">{{ __('storefront.account.email_heading') }}</h2>
+
+            <div class="flex flex-wrap items-center justify-between gap-x-8 gap-y-2 border-b border-black py-2">
+                <span class="break-all">{{ $user->email }}</span>
+                <a href="{{ route('account.email.edit') }}" class="text-sm underline hover:no-underline">
+                    {{ __('storefront.account.email_change') }}
+                </a>
+            </div>
+        </section>
+
+        <form method="POST" action="{{ route('account.update') }}" class="flex flex-col gap-16">
+            @csrf
+            @method('PUT')
+
+            {{-- Details --}}
+            <section class="flex flex-col gap-8" aria-labelledby="account-details-heading">
+                <h2 id="account-details-heading" class="font-display text-h4 font-extrabold">{{ __('storefront.account.details_heading') }}</h2>
+
+                <div class="grid grid-cols-1 gap-8 sm:grid-cols-2">
+                    <x-ui.field :label="__('storefront.account.first_name')" for="account-first-name" :error="$errors->first('first_name')">
+                        <x-ui.input id="account-first-name" name="first_name" autocomplete="given-name"
+                            :value="old('first_name', $customer?->first_name)"
+                            :aria-invalid="$errors->has('first_name') ? 'true' : null" :aria-describedby="$errors->has('first_name') ? 'account-first-name-error' : null" />
+                    </x-ui.field>
+
+                    <x-ui.field :label="__('storefront.account.last_name')" for="account-last-name" :error="$errors->first('last_name')">
+                        <x-ui.input id="account-last-name" name="last_name" autocomplete="family-name"
+                            :value="old('last_name', $customer?->last_name)"
+                            :aria-invalid="$errors->has('last_name') ? 'true' : null" :aria-describedby="$errors->has('last_name') ? 'account-last-name-error' : null" />
+                    </x-ui.field>
+                </div>
+
+                {{-- Invoice details, revealed by the checkbox (CSS :has(), no JS). Not
+                     `required` in HTML: a hidden required field would block submit, so
+                     the server requires them only when the box is ticked. --}}
+                <div class="group/invoice flex flex-col gap-8">
+                    <input type="hidden" name="invoice" value="0">
+                    <x-ui.checkbox
+                        id="account-invoice"
+                        name="invoice"
+                        :checked="$wantsInvoice"
+                        :label="__('storefront.account.invoice')"
+                        aria-controls="account-invoice-fields"
+                    />
+
+                    <div id="account-invoice-fields" class="hidden grid-cols-1 gap-8 sm:grid-cols-2 group-has-[#account-invoice:checked]/invoice:grid">
+                        <x-ui.field :label="__('storefront.account.company_name')" for="account-company" :error="$errors->first('company_name')">
+                            <x-ui.input id="account-company" name="company_name" autocomplete="organization"
+                                :value="old('company_name', $customer?->company_name)"
+                                :aria-invalid="$errors->has('company_name') ? 'true' : null" :aria-describedby="$errors->has('company_name') ? 'account-company-error' : null" />
+                        </x-ui.field>
+
+                        <x-ui.field :label="__('storefront.account.tax_identifier')" for="account-tax-id" :error="$errors->first('tax_identifier')">
+                            <x-ui.input id="account-tax-id" name="tax_identifier" inputmode="numeric" maxlength="9" pattern="[0-9]{9}"
+                                :value="old('tax_identifier', $customer?->tax_identifier)"
+                                :aria-invalid="$errors->has('tax_identifier') ? 'true' : null" :aria-describedby="$errors->has('tax_identifier') ? 'account-tax-id-error' : null" />
+                        </x-ui.field>
+                    </div>
+                </div>
+            </section>
+
+            {{-- Address: one, used as both shipping and billing default --}}
+            <section class="flex flex-col gap-8" aria-labelledby="account-address-heading">
+                <h2 id="account-address-heading" class="font-display text-h4 font-extrabold">{{ __('storefront.account.address_heading') }}</h2>
+
+                <x-ui.field :label="__('storefront.account.line_one')" for="account-line-one" :error="$errors->first('line_one')">
+                    <x-ui.input id="account-line-one" name="line_one" autocomplete="address-line1"
+                        :value="old('line_one', $address?->line_one)"
+                        :aria-invalid="$errors->has('line_one') ? 'true' : null" :aria-describedby="$errors->has('line_one') ? 'account-line-one-error' : null" />
+                </x-ui.field>
+
+                <div class="grid grid-cols-1 gap-8 sm:grid-cols-2">
+                    <x-ui.field :label="__('storefront.account.city')" for="account-city" :error="$errors->first('city')">
+                        <x-ui.input id="account-city" name="city" autocomplete="address-level2"
+                            :value="old('city', $address?->city)"
+                            :aria-invalid="$errors->has('city') ? 'true' : null" :aria-describedby="$errors->has('city') ? 'account-city-error' : null" />
+                    </x-ui.field>
+
+                    <x-ui.field :label="__('storefront.account.postcode')" for="account-postcode" :error="$errors->first('postcode')">
+                        <x-ui.input id="account-postcode" name="postcode" autocomplete="postal-code" inputmode="numeric"
+                            :value="old('postcode', $address?->postcode)"
+                            :aria-invalid="$errors->has('postcode') ? 'true' : null" :aria-describedby="$errors->has('postcode') ? 'account-postcode-error' : null" />
+                    </x-ui.field>
+                </div>
+
+                <div class="grid grid-cols-1 gap-8 sm:grid-cols-2">
+                    <x-ui.field :label="__('storefront.account.state')" for="account-state" :error="$errors->first('state')">
+                        <x-ui.select
+                            id="account-state"
+                            name="state"
+                            :block="true"
+                            :options="$regionOptions"
+                            :value="old('state', $address?->state)"
+                            :placeholder="__('storefront.account.state_placeholder')"
+                            :aria-invalid="$errors->has('state') ? 'true' : null"
+                            :aria-describedby="$errors->has('state') ? 'account-state-error' : null"
+                        />
+                    </x-ui.field>
+
+                    <x-ui.field :label="__('storefront.account.phone')" for="account-phone" :error="$errors->first('contact_phone')">
+                        <x-ui.input id="account-phone" name="contact_phone" type="tel" autocomplete="tel"
+                            :value="old('contact_phone', $address?->contact_phone)"
+                            :aria-invalid="$errors->has('contact_phone') ? 'true' : null" :aria-describedby="$errors->has('contact_phone') ? 'account-phone-error' : null" />
+                    </x-ui.field>
+                </div>
+            </section>
+
+            {{-- Standing opt-in for abandoned-cart reminders (explicit, off by
+                 default); checkout starts from it and can change it again. --}}
+            <section class="flex flex-col gap-8" aria-labelledby="account-emails-heading">
+                <h2 id="account-emails-heading" class="font-display text-h4 font-extrabold">{{ __('storefront.account.emails_heading') }}</h2>
+
+                <div>
+                    <input type="hidden" name="recovery_consent" value="0">
+                    <x-ui.checkbox
+                        id="account-recovery-consent"
+                        name="recovery_consent"
+                        :checked="(bool) old('recovery_consent', data_get($customer, 'meta.recovery_consent'))"
+                        :label="__('storefront.account.recovery_consent')"
+                    />
+                </div>
+            </section>
+
+            <div>
+                <x-ui.button type="submit">{{ __('storefront.account.save') }}</x-ui.button>
+            </div>
+        </form>
+
+        {{-- Delete account --}}
+        <section class="flex flex-col gap-6 border-t border-black pt-12" aria-labelledby="account-delete-heading">
+            <h2 id="account-delete-heading" class="font-display text-h4 font-extrabold">{{ __('storefront.account.delete_heading') }}</h2>
+
+            <p>{{ __('storefront.account.delete_text') }}</p>
+
+            <div>
+                <x-ui.button
+                    variant="secondary"
+                    size="md"
+                    popovertarget="account-delete-dialog"
+                    aria-haspopup="dialog"
+                >{{ __('storefront.account.delete') }}</x-ui.button>
+            </div>
+
+            <div
+                id="account-delete-dialog"
+                popover
+                role="dialog"
+                aria-modal="true"
+                aria-labelledby="account-delete-dialog-heading"
+                class="m-auto w-[calc(100%-2rem)] max-w-lg border border-black bg-neutral-200 p-8 backdrop:bg-black/50"
+            >
+                <h3 id="account-delete-dialog-heading" class="mb-4 font-display text-h4 font-extrabold">
+                    {{ __('storefront.account.delete_confirm_heading') }}
+                </h3>
+
+                <p class="mb-8">{{ __('storefront.account.delete_confirm_text') }}</p>
+
+                <form method="POST" action="{{ route('account.destroy') }}" class="flex flex-wrap gap-4">
+                    @csrf
+                    @method('DELETE')
+
+                    <x-ui.button type="submit" size="md">{{ __('storefront.account.delete_confirm') }}</x-ui.button>
+
+                    <x-ui.button
+                        variant="secondary"
+                        size="md"
+                        popovertarget="account-delete-dialog"
+                        popovertargetaction="hide"
+                    >{{ __('storefront.account.delete_cancel') }}</x-ui.button>
+                </form>
+            </div>
+        </section>
+
+    </div>
+
+@endsection

resources/views/account/wishlist.blade.php

@@ -0,0 +1,17 @@
+@extends('layouts.account')
+
+@section('title', __('storefront.account.nav_wishlist'))
+
+@section('account')
+
+    <div class="flex flex-col gap-12">
+
+        <h1 class="font-display text-h3 font-black tracking-tight sm:text-h2">
+            {{ __('storefront.account.nav_wishlist') }}
+        </h1>
+
+        @include('wishlist.list')
+
+    </div>
+
+@endsection

resources/views/auth/login-code.blade.php

@@ -0,0 +1,67 @@
+@extends('layouts.app')
+
+@section('title', __('storefront.auth.enter_code'))
+
+@push('seo')
+    <meta name="robots" content="noindex, nofollow">
+@endpush
+
+@section('content')
+
+    <section class="mx-auto max-w-2xl px-4 py-20 sm:px-8 sm:py-32">
+
+        <h1 class="mb-6 font-display text-h3 font-black tracking-tight sm:text-h2">
+            {{ __('storefront.auth.enter_code') }}
+        </h1>
+
+        <p class="mb-12">
+            {{ __('storefront.auth.code_sent_to') }} <strong class="break-all">{{ $email }}</strong>
+        </p>
+
+        <x-ui.status class="mb-8" />
+
+        <form method="POST" action="{{ route('login.verify') }}" class="flex flex-col gap-8">
+            @csrf
+
+            <x-ui.field
+                :label="__('storefront.auth.code')"
+                for="login-code"
+                :required="true"
+                :error="$errors->first('code')"
+            >
+                <x-ui.input
+                    id="login-code"
+                    name="code"
+                    inputmode="numeric"
+                    autocomplete="one-time-code"
+                    pattern="[0-9]{6}"
+                    maxlength="6"
+                    :required="true"
+                    autofocus
+                    class="text-2xl font-bold tracking-[0.5em]"
+                    :aria-invalid="$errors->has('code') ? 'true' : null"
+                    :aria-describedby="$errors->has('code') ? 'login-code-error' : null"
+                />
+            </x-ui.field>
+
+            <div>
+                <x-ui.button type="submit">{{ __('storefront.auth.login') }}</x-ui.button>
+            </div>
+        </form>
+
+        <div class="mt-12 flex flex-wrap items-center gap-x-8 gap-y-4 text-sm">
+            <form method="POST" action="{{ route('login.resend') }}">
+                @csrf
+                <button type="submit" class="cursor-pointer underline hover:no-underline">
+                    {{ __('storefront.auth.resend_code') }}
+                </button>
+            </form>
+
+            <a href="{{ route('login') }}" class="underline hover:no-underline">
+                {{ __('storefront.auth.change_email') }}
+            </a>
+        </div>
+
+    </section>
+
+@endsection

resources/views/auth/login.blade.php

@@ -0,0 +1,79 @@
+@extends('layouts.app')
+
+@section('title', __('storefront.auth.login'))
+
+@push('seo')
+    <meta name="robots" content="noindex, follow">
+@endpush
+
+{{-- Only on pages with a captcha, not in the global layout. --}}
+@push('scripts')
+    <script src="https://js.hcaptcha.com/1/api.js?hl={{ app()->getLocale() }}" async defer></script>
+@endpush
+
+@section('content')
+
+    <section class="mx-auto max-w-2xl px-4 py-20 sm:px-8 sm:py-32">
+
+        <h1 class="mb-6 font-display text-h3 font-black tracking-tight sm:text-h2">
+            {{ __('storefront.auth.login') }}
+        </h1>
+
+        {{-- Unescaped: the label holds a <br /> (edited in Filament › Language Lines, staff only). --}}
+        <p class="mb-12">{!! __('storefront.auth.login_intro') !!}</p>
+
+        {{-- e.g. "account deletion scheduled", after AccountController::destroy() --}}
+        <x-ui.status class="mb-12" />
+
+        <form method="POST" action="{{ route('login.send') }}" class="flex flex-col gap-8">
+            @csrf
+
+            <x-ui.field
+                :label="__('storefront.auth.email')"
+                for="login-email"
+                :required="true"
+                :error="$errors->first('email')"
+            >
+                <x-ui.input
+                    id="login-email"
+                    name="email"
+                    type="email"
+                    autocomplete="email"
+                    :value="old('email')"
+                    :required="true"
+                    autofocus
+                    :aria-invalid="$errors->has('email') ? 'true' : null"
+                    :aria-describedby="$errors->has('email') ? 'login-email-error' : null"
+                />
+            </x-ui.field>
+
+            {{-- Shown to everyone. Recording acceptance for new accounts is a
+                 boboko-core task (UserOtpService). Unescaped: the label holds the
+                 two links (Language Lines, staff only). --}}
+            <p class="text-sm text-neutral-500 [&_a]:underline [&_a:hover]:no-underline">
+                {!! __('storefront.auth.terms_notice', [
+                    'terms' => route('legal.terms'),
+                    'privacy' => route('legal.privacy'),
+                ]) !!}
+            </p>
+
+            {{-- hCaptcha checkbox, verified by App\Rules\HCaptcha. The widget adds
+                 the `h-captcha-response` field itself. Fixed height reserves the
+                 iframe's space so the button doesn't jump when it loads. --}}
+            <x-ui.field for="login-captcha" :error="$errors->first('h-captcha-response')">
+                <div
+                    id="login-captcha"
+                    class="h-captcha min-h-[78px]"
+                    data-sitekey="{{ config('services.hcaptcha.sitekey') }}"
+                    @if ($errors->has('h-captcha-response')) aria-describedby="login-captcha-error" @endif
+                ></div>
+            </x-ui.field>
+
+            <div>
+                <x-ui.button type="submit">{{ __('storefront.auth.send_code') }}</x-ui.button>
+            </div>
+        </form>
+
+    </section>
+
+@endsection

resources/views/category/show.blade.php

@@ -14,7 +14,8 @@
 @endpush
 
 @section('content')
-    <div class="max-w-5xl mx-auto pt-26 pb-12">
+    {{-- <div class="max-w-5xl mx-auto pt-26 pb-12"> --}}
+    <div class="max-w-7xl mx-auto px-4 sm:px-8 pt-26 pb-12">
 
         <div class="flex items-end justify-between gap-6 flex-wrap mb-16">
             <h1 class="font-medium text-h2">{{ $collection['name'] }}</h1>

resources/views/components/header.blade.php

@@ -41,11 +41,42 @@
                 </a>
             @endforeach
 
-            {{-- Cart --}}
-            <a href="{{ url('/'.app()->getLocale().'/cart') }}" class="flex items-center justify-center w-10 h-10 hover:opacity-70 transition-opacity" aria-label="Cart">
-                <x-ui.icon name="bag"  :size="40" />
+            {{-- Wishlist — the account page, or the cookie-based guest page --}}
+            <a
+                href="{{ auth()->check() ? route('account.wishlist') : route('wishlist') }}"
+                class="flex items-center justify-center w-10 h-10 hover:opacity-70 transition-opacity"
+                aria-label="{{ __('storefront.account.nav_wishlist') }}"
+                @if (request()->routeIs('account.wishlist', 'wishlist')) aria-current="page" @endif
+            >
+                <x-ui.icon name="heart" :size="40" />
             </a>
 
+            {{-- Account — the account page, or login for guests --}}
+            <a
+                href="{{ auth()->check() ? route('account') : route('login') }}"
+                class="flex items-center justify-center w-10 h-10 hover:opacity-70 transition-opacity"
+                aria-label="{{ auth()->check() ? __('storefront.nav.account') : __('storefront.auth.login') }}"
+            >
+                <x-ui.icon name="user" :size="40" />
+            </a>
+
+            {{-- Cart — opens the checkout module's drawer, no separate cart page --}}
+            <button
+                type="button"
+                class="relative flex items-center justify-center w-10 h-10 hover:opacity-70 transition-opacity"
+                aria-label="Cart"
+                aria-haspopup="dialog"
+                data-controller="cart-count"
+                data-action="cart-count#open"
+            >
+                <x-ui.icon name="bag"  :size="40" />
+                <span
+                    data-cart-count-target="badge"
+                    class="absolute -top-1 -right-1 min-w-5 h-5 px-1 rounded-full bg-black text-neutral-200 text-xs font-bold flex items-center justify-center"
+                    hidden
+                >0</span>
+            </button>
+
             {{-- Search --}}
             <button
                 type="button"

resources/views/components/newsletter-split.blade.php

@@ -3,10 +3,10 @@
 ])
 
 <section {{ $attributes }}>
-    <div class="max-w-6xl mx-auto grid grid-cols-1 lg:grid-cols-2 border border-black">
-        <div class="flex flex-col justify-center gap-8 px-8 py-16 lg:px-16">
+    <div class="grid grid-cols-1 lg:grid-cols-2">
+        <div class="flex flex-col justify-center gap-8 px-8 py-16 lg:px-16 items-center">
             <h2
-                class="text-h2 leading-tight"
+                class="text-h1 leading-[1.3] max-w-xl text-center"
                 aria-label="Γράψου στο newsletter μας"
                 data-controller="appear"
                 data-appear-visible-class="is-visible"
@@ -17,13 +17,13 @@ class="text-h2 leading-tight"
                 μας
             </h2>
 
-            <p class="max-w-md text-neutral-600">
+            <p class="max-w-xl text-neutral-600 text-center">
                 Γίνε μέλος της λίστας μας και κέρδισε <span class="font-bold">5% έκπτωση</span> στην πρώτη σου παραγγελία, μαζί με αποκλειστικές προσφορές και νέα.
             </p>
 
-            <form method="POST" action="#" class="flex flex-col gap-6 max-w-md">
+            <form method="POST" action="#" class="flex flex-col gap-6 max-w-xl items-center">
                 @csrf
-                <div class="relative">
+                <div class="relative max-w-xs w-full">
                     <x-ui.input
                         name="email"
                         type="email"
@@ -44,7 +44,7 @@ class="absolute right-0 bottom-2 cursor-pointer"
                 </div>
 
                 <x-ui.checkbox name="gdpr_consent" :required="true" id="newsletter_split_gdpr_consent" class="after:mix-blend-multiply">
-                    <span class="text-sm text-left">Επιθυμώ διακαώς 🔥 να εγγραφώ στη λίστα αποστολής ενημερωτικού υλικού</span>
+                    <span class="text-sm">Επιθυμώ διακαώς 🔥 να εγγραφώ στη λίστα αποστολής ενημερωτικού υλικού</span>
                 </x-ui.checkbox>
             </form>
         </div>

resources/views/components/order-status.blade.php

@@ -0,0 +1,13 @@
+{{--
+    An order status as text, e.g. "Σε επεξεργασία". Translated through
+    storefront.order_status.{status}, falling back to Lunar's own (English)
+    label from config('lunar.orders.statuses') when that key doesn't exist.
+--}}
+@props(['status'])
+
+@php
+    $key = "storefront.order_status.{$status}";
+    $label = Lang::has($key) ? __($key) : config("lunar.orders.statuses.{$status}.label", $status);
+@endphp
+
+<span {{ $attributes }}>{{ $label }}</span>

resources/views/components/product-custom-fields.blade.php

@@ -0,0 +1,77 @@
+{{--
+    <x-product-custom-fields :fields="$product['custom_fields']" />
+
+    The product's custom fields (boboko-core's Product::$custom_fields), rendered
+    inside the add-to-cart <form> so their values travel with it as
+    custom_fields[key]. text → input, textarea → textarea, file → photo upload.
+
+    A photo is uploaded as soon as it's picked (custom-field-upload-controller.js)
+    and only the resulting File row's id (boboko-core's Modules\Core\File\
+    Models\File) is submitted with the form — the file input itself has no
+    name. It still carries `required`, so the browser's own validation blocks
+    add-to-cart until a photo is picked, and the controller marks it invalid
+    (setCustomValidity) while the upload is in flight.
+--}}
+@props(['fields' => []])
+
+@use('App\Http\Controllers\CustomFieldUploadController')
+
+<div class="flex flex-col gap-6">
+    @foreach ($fields as $field)
+        @php
+            $id = 'custom-field-'.$field['key'];
+            $name = 'custom_fields['.$field['key'].']';
+            $required = (bool) ($field['required'] ?? false);
+        @endphp
+
+        @switch($field['type'])
+            @case('textarea')
+                <x-ui.field :label="$field['label']" :for="$id" :required="$required">
+                    <x-ui.textarea :id="$id" :name="$name" :required="$required" :rows="4" maxlength="2000" />
+                </x-ui.field>
+                @break
+
+            @case('file')
+                <x-ui.field
+                    :label="$field['label']"
+                    :for="$id"
+                    :required="$required"
+                    :description="__('storefront.product.custom_field_photo_hint', ['size' => CustomFieldUploadController::MAX_KILOBYTES / 1024])"
+                    data-controller="custom-field-upload"
+                    data-custom-field-upload-url-value="{{ route('custom-field-upload.store') }}"
+                    data-custom-field-upload-label-value="{{ $field['label'] }}"
+                    data-custom-field-upload-uploading-message-value="{{ __('storefront.product.custom_field_uploading') }}"
+                    data-custom-field-upload-failed-message-value="{{ __('storefront.product.custom_field_upload_failed') }}"
+                >
+                    <input type="hidden" name="{{ $name }}" data-custom-field-upload-target="reference">
+
+                    <x-ui.file-input
+                        :id="$id"
+                        :accept="CustomFieldUploadController::accept()"
+                        :required="$required"
+                        aria-describedby="{{ $id }}-description {{ $id }}-error"
+                        data-custom-field-upload-target="file"
+                        data-action="change->custom-field-upload#upload"
+                    />
+
+                    <img
+                        alt=""
+                        width="96"
+                        height="96"
+                        hidden
+                        class="w-24 h-24 object-cover border border-black"
+                        data-custom-field-upload-target="preview"
+                        data-action="error->custom-field-upload#hidePreview"
+                    >
+
+                    <p id="{{ $id }}-error" class="text-sm text-red-600" role="alert" hidden data-custom-field-upload-target="error"></p>
+                </x-ui.field>
+                @break
+
+            @default
+                <x-ui.field :label="$field['label']" :for="$id" :required="$required">
+                    <x-ui.input :id="$id" :name="$name" :required="$required" maxlength="255" />
+                </x-ui.field>
+        @endswitch
+    @endforeach
+</div>

resources/views/components/product-grid.blade.php

@@ -24,6 +24,9 @@
                 :price="$product['price'] ?? null"
                 :image="$product['image'] ?? null"
                 :href="$product['href'] ?? '#'"
+                :variant-id="$product['variantId'] ?? null"
+                :has-custom-fields="$product['hasCustomFields'] ?? false"
+                :sold-out="$product['soldOut'] ?? false"
             />
         @endforeach
     </div>

resources/views/components/review-card.blade.php

@@ -1,26 +1,39 @@
 @props(['review'])
 
-<article class="flex flex-col gap-3 py-6 border-b border-black last:border-0">
+<article class="flex flex-col gap-3 py-6">
 
-    <div class="flex items-center justify-between gap-4">
-        <div class="flex items-center gap-4">
-            <x-reviews-stars :rating="$review['rating']" :size="18" />
-            <span class="font-bold">
-                {{ $review['name'] ?? 'Ανώνυμος' }}
-            </span>
-        </div>
-        <time class="text-sm text-neutral-500 shrink-0">{{ $review['date'] }}</time>
+    <x-reviews-stars :rating="$review['rating']" :size="23" />
+
+    <div class="flex items-end gap-4">
+        <span class="text-2xl font-bold leading-none">
+            {{ $review['name'] ?? 'Ανώνυμος' }}
+        </span>
+        <time class="text-sm text-neutral-500 shrink-0 leading-none pb-0.5">{{ $review['date'] }}</time>
     </div>
 
     <p class="leading-relaxed">{{ $review['text'] }}</p>
 
     @if (!empty($review['image']))
         <div class="mt-1">
-            <img
-                src="{{ $review['image'] }}"
-                alt="Φωτογραφία από τον αγοραστή"
-                class="w-24 h-24 object-cover border border-black"
-            >
+            <a href="{{ $review['image'] }}" target="_blank" rel="noopener noreferrer">
+                <img
+                    src="{{ $review['image'] }}"
+                    alt="Φωτογραφία από τον αγοραστή"
+                    class="w-24 h-24 object-cover border border-black"
+                >
+            </a>
+        </div>
+    @endif
+
+    @if (!empty($review['reply']))
+        <div class="mt-2 pl-4 border-l-2 border-neutral-300 flex flex-col gap-1">
+            <p class="text-sm font-bold">
+                {{ __('storefront.review.reply') }}
+                @if (!empty($review['replyDate']))
+                    <span class="font-normal text-neutral-500">— {{ $review['replyDate'] }}</span>
+                @endif
+            </p>
+            <p class="leading-relaxed">{{ $review['reply'] }}</p>
         </div>
     @endif
 

resources/views/components/review-form.blade.php

@@ -1,23 +1,28 @@
 @props(['product'])
 
+@php $oldRating = (int) old('rating', 0); @endphp
+
 <form
     method="POST"
-    action="#"
+    action="{{ route('product.reviews.store', ['locale' => app()->getLocale(), 'product' => $product['id']]) }}"
     class="flex flex-col gap-8 mt-10"
+    data-controller="star-rating"
+    data-star-rating-rating-value="{{ $oldRating }}"
+    data-action="submit->star-rating#validate"
 >
     @csrf
 
     {{-- Rating --}}
-    <x-ui.field :label="__('storefront.review.rating')" for="rating" :required="true">
+    <x-ui.field :label="__('storefront.review.rating')" for="rating" :required="true" :error="$errors->first('rating')">
         <div
             id="rating"
-            data-controller="star-rating"
             class="flex items-center gap-1.5 text-brand"
             role="radiogroup"
             aria-label="{{ __('storefront.review.rating') }}"
             aria-required="true"
+            aria-describedby="rating-client-error"
         >
-            <input type="hidden" name="rating" value="0" data-star-rating-target="input">
+            <input type="hidden" name="rating" value="{{ $oldRating }}" data-star-rating-target="input">
             @for($i = 1; $i <= 5; $i++)
                 <button
                     type="button"
@@ -25,7 +30,7 @@ class="flex items-center gap-1.5 text-brand"
                     data-value="{{ $i }}"
                     data-action="click->star-rating#select mouseenter->star-rating#hover mouseleave->star-rating#leave"
                     aria-label="{{ trans_choice('storefront.review.stars_count', $i, ['count' => $i]) }}"
-                    aria-pressed="false"
+                    aria-pressed="{{ $i === $oldRating ? 'true' : 'false' }}"
                 >
                     <svg
                         xmlns="http://www.w3.org/2000/svg"
@@ -41,24 +46,21 @@ class="w-6 h-6"
                 </button>
             @endfor
         </div>
+        <p id="rating-client-error" data-star-rating-target="error" class="text-sm text-red-600" role="alert" hidden>{{ __('storefront.review.rating_required') }}</p>
     </x-ui.field>
 
-    <x-ui.field :label="__('storefront.review.write_label')" for="review-content" :required="true">
-        <x-ui.textarea id="review-content" name="content" :required="true" />
+    <x-ui.field :label="__('storefront.review.write_label')" for="review-content" :required="true" :error="$errors->first('content')">
+        <x-ui.textarea id="review-content" name="content" :required="true" :rows="6">{{ old('content') }}</x-ui.textarea>
     </x-ui.field>
 
-    <x-ui.field :label="__('storefront.review.name')" for="review-name" :labelDescription="__('storefront.review.name_optional')">
-        <x-ui.input id="review-name" name="name" autocomplete="name" />
+    <x-ui.field :label="__('storefront.review.name')" for="review-name" :labelDescription="__('storefront.review.name_optional')" :error="$errors->first('name')">
+        <x-ui.input id="review-name" name="name" autocomplete="name" :value="old('name')" />
     </x-ui.field>
 
-    <x-ui.field :label="__('storefront.review.email')" for="review-email" :required="true" :labelDescription="__('storefront.review.email_not_published')">
-        <x-ui.input id="review-email" name="email" type="email" :required="true" autocomplete="email" />
+    <x-ui.field :label="__('storefront.review.email')" for="review-email" :required="true" :labelDescription="__('storefront.review.email_not_published')" :error="$errors->first('email')">
+        <x-ui.input id="review-email" name="email" type="email" :required="true" autocomplete="email" :value="old('email')" />
     </x-ui.field>
 
-    <x-ui.checkbox id="review-save-info" name="save_info" >
-        <span class="text-sm">{{ __('storefront.review.save_info') }}</span>
-    </x-ui.checkbox>
-
     <div>
         <x-ui.button type="submit">{{ __('storefront.review.submit') }}</x-ui.button>
     </div>

resources/views/components/reviews-stars.blade.php

@@ -3,6 +3,7 @@
     'count'     => 0,
     'showCount' => false,
     'size'      => 24,
+    'linkable'  => false,
 ])
 
 <div class="flex items-center gap-3" {{ $attributes }}>
@@ -28,9 +29,17 @@ class="flex items-center gap-1.5 text-brand"
     </div>
 
     @if ($showCount && $count > 0)
-        <span class="text-sm text-neutral-500">
-            ({{ trans_choice('storefront.customer_reviews', $count, ['count' => $count]) }})
-        </span>
+        @php $countText = '(' . trans_choice('storefront.customer_reviews', $count, ['count' => $count]) . ')'; @endphp
+        @if ($linkable)
+            <button
+                type="button"
+                data-action="click->tab-link#activate"
+                class="text-sm text-neutral-500 hover:underline cursor-pointer"
+                aria-controls="tab-panel-reviews"
+            >{{ $countText }}</button>
+        @else
+            <span class="text-sm text-neutral-500">{{ $countText }}</span>
+        @endif
     @endif
 
 </div>

resources/views/components/ui/button.blade.php

@@ -3,6 +3,7 @@
     'href'     => null,
     'type'     => 'button',
     'size'     => 'lg',
+    'variant'  => 'primary',
     'position' => 'relative',
 ])
 
@@ -15,6 +16,16 @@
         default => 'py-5 px-[46px] text-[19px]',
     };
 
+    // 'primary' is the CTA look (offset-shadow via .btn-primary's ::before/
+    // ::after, italic, uppercase). 'secondary' is a plain bordered toggle —
+    // no shadow layers, fills solid on hover/aria-pressed=true instead, used
+    // for option pickers (see x-ui.option-buttons) and anywhere else a
+    // secondary/toggle action shouldn't compete visually with the CTA.
+    $variantClasses = match($variant) {
+        'secondary' => 'font-semibold hover:bg-black hover:text-neutral-200 aria-pressed:bg-black aria-pressed:text-neutral-200 transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-black',
+        default     => 'btn-primary font-bold italic uppercase',
+    };
+
     // $position defaults to 'relative' (needed so the ::before/::after layers
     // in .btn-primary position against the button itself), but callers that
     // need to place the button absolutely (e.g. a hover-reveal CTA over a
@@ -22,7 +33,7 @@
     // "absolute" via the class prop — Tailwind's generated stylesheet always
     // orders the "relative" utility after "absolute", so on a class clash
     // "relative" silently wins and the button never actually gets positioned.
-    $class = 'btn-primary '.$position.' isolate inline-flex items-center justify-center border border-black font-display font-bold italic text-black cursor-pointer no-underline uppercase ' . $sizeClasses;
+    $class = trim($position.' isolate inline-flex items-center justify-center border border-black text-black cursor-pointer no-underline disabled:cursor-not-allowed disabled:opacity-50 '.$variantClasses.' '.$sizeClasses);
 
     $attrs = $href
         ? $attributes->merge(['href' => $href, 'class' => $class])

resources/views/components/ui/color-swatch.blade.php

@@ -1,12 +1,11 @@
-{{-- $variants: array of Modules\Core\Catalog\Services\ProductIndexer's mapVariant()
-     shape (id, options: [{option, value, meta}], ...) — plain arrays, not Eloquent
-     models, since this is fed from Modules\Core\Catalog\Services\ProductService. --}}
-@props(['variants', 'option' => null])
+{{-- $values: one product option's de-duplicated, ordered values, as built by
+     ProductController::buildOptionPicker() — [{id, label, hex}]. --}}
+@props(['values', 'option' => null, 'optionHandle' => null])
 
 <div {{ $attributes }}>
     @if($option)
         <p class="font-bold mb-3 text-sm uppercase tracking-wide">
-            {{ $option }}: <span data-product-form-target="colorName" class="font-normal normal-case"></span>
+            {{ $option }}: <span data-product-form-target="colorName" data-option="{{ $optionHandle }}" class="font-normal normal-case"></span>
         </p>
     @endif
 
@@ -15,22 +14,17 @@ class="flex flex-wrap gap-2"
         role="group"
         aria-label="{{ $option ?? 'Color' }}"
     >
-        @foreach($variants as $variant)
-            @php
-                $value = $variant['options'][0] ?? null;
-                $label = $value['value'] ?? '';
-                $bg = $value['meta']['hex'] ?? '#cccccc';
-            @endphp
+        @foreach($values as $value)
             <button
                 type="button"
                 class="color-swatch"
                 data-product-form-target="swatch"
                 data-action="click->product-form#selectVariant"
-                data-variant-id="{{ $variant['id'] }}"
-                style="background-color: {{ $bg }};"
-                aria-label="{{ $label }}"
+                data-option="{{ $optionHandle }}"
+                data-value-id="{{ $value['id'] }}"
+                style="background-color: {{ $value['hex'] ?? '#cccccc' }};"
+                aria-label="{{ $value['label'] }}"
                 aria-pressed="false"
-                title="{{ $label }}"
             ></button>
         @endforeach
     </div>

resources/views/components/ui/file-input.blade.php

@@ -0,0 +1,20 @@
+@props([
+    'accept'   => null,
+    'required' => false,
+    'disabled' => false,
+])
+
+<input
+    type="file"
+    @if ($accept) accept="{{ $accept }}" @endif
+    @required($required)
+    @disabled($disabled)
+    {{ $attributes->merge([
+        'class' => 'w-full py-2 text-sm
+                    file:mr-4 file:py-2 file:px-4 file:rounded-none file:border file:border-black file:bg-transparent
+                    file:font-semibold file:cursor-pointer file:transition-colors
+                    hover:file:bg-black hover:file:text-neutral-200
+                    focus:outline-none focus-visible:ring-2 focus-visible:ring-black
+                    disabled:cursor-not-allowed disabled:opacity-50',
+    ]) }}
+/>

resources/views/components/ui/icon.blade.php

@@ -6,7 +6,7 @@
 ])
 
 @php
-    $fillIcons = ['facebook', 'instagram', 'tiktok', 'search', 'bag'];
+    $fillIcons = ['facebook', 'instagram', 'tiktok', 'search', 'bag', 'user', 'heart', 'heart-fill'];
     $svgStroke = $stroke ?? (in_array($name, $fillIcons) ? 'none' : $color);
 @endphp
 
@@ -16,6 +16,12 @@
 
         'bag'    => '<path stroke-width=0.5 d="M20.0049 22H4.00488C3.4526 22 3.00488 21.5523 3.00488 21V3C3.00488 2.44772 3.4526 2 4.00488 2H20.0049C20.5572 2 21.0049 2.44772 21.0049 3V21C21.0049 21.5523 20.5572 22 20.0049 22ZM19.0049 20V4H5.00488V20H19.0049ZM9.00488 6V8C9.00488 9.65685 10.348 11 12.0049 11C13.6617 11 15.0049 9.65685 15.0049 8V6H17.0049V8C17.0049 10.7614 14.7663 13 12.0049 13C9.24346 13 7.00488 10.7614 7.00488 8V6H9.00488Z"/>',
 
+        'user'   => '<path stroke-width=0.5 d="M4 22C4 17.5817 7.58172 14 12 14C16.4183 14 20 17.5817 20 22H18C18 18.6863 15.3137 16 12 16C8.68629 16 6 18.6863 6 22H4ZM12 13C8.685 13 6 10.315 6 7C6 3.685 8.685 1 12 1C15.315 1 18 3.685 18 7C18 10.315 15.315 13 12 13ZM12 11C14.21 11 16 9.21 16 7C16 4.79 14.21 3 12 3C9.79 3 8 4.79 8 7C8 9.21 9.79 11 12 11Z"/>',
+
+        'heart'  => '<path stroke-width=0.5 d="M12.001 4.52853C14.35 2.42 17.98 2.49 20.2426 4.75736C22.5053 7.02472 22.583 10.637 20.4786 12.993L11.9999 21.485L3.52138 12.993C1.41705 10.637 1.49571 7.01901 3.75736 4.75736C6.02157 2.49315 9.64519 2.41687 12.001 4.52853ZM18.827 6.1701C17.3279 4.66794 14.9076 4.60701 13.337 6.01687L12.0019 7.21524L10.6661 6.01781C9.09098 4.60597 6.67506 4.66808 5.17157 6.17157C3.68183 7.66131 3.60704 10.0473 4.97993 11.6232L11.9999 18.6543L19.0201 11.6232C20.3935 10.0467 20.319 7.66525 18.827 6.1701Z"/>',
+
+        'heart-fill' => '<path stroke-width=2 d="M12.001 4.52853C14.35 2.42 17.98 2.49 20.2426 4.75736C22.5053 7.02472 22.583 10.637 20.4786 12.993L11.9999 21.485L3.52138 12.993C1.41705 10.637 1.49571 7.01901 3.75736 4.75736C6.02157 2.49315 9.64519 2.41687 12.001 4.52853Z"/>',
+
         'close'       => '<path fill="none" stroke-width="1.5" stroke-linecap="round" d="M6 6L18 18M18 6L6 18"/>',
 
         'arrow-left'  => '<path fill="none" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" d="M19 12H5M5 12L11 6M5 12L11 18"/>',

resources/views/components/ui/option-buttons.blade.php

@@ -0,0 +1,32 @@
+{{-- $values: one product option's de-duplicated, ordered values, as built by
+     ProductController::buildOptionPicker() — [{id, label, hex}]. Use this
+     instead of <x-ui.color-swatch> for options that aren't a color (no hex),
+     where a swatch dot has nothing meaningful to show. --}}
+@props(['values', 'option' => null, 'optionHandle' => null])
+
+<div {{ $attributes }}>
+    @if($option)
+        <p class="font-bold mb-3 text-sm uppercase tracking-wide">
+            {{ $option }}
+        </p>
+    @endif
+
+    <div
+        class="flex flex-wrap gap-2"
+        role="group"
+        aria-label="{{ $option ?? 'Option' }}"
+    >
+        @foreach($values as $value)
+            <x-ui.button
+                variant="secondary"
+                size="sm"
+                data-product-form-target="swatch"
+                data-action="click->product-form#selectVariant"
+                data-option="{{ $optionHandle }}"
+                data-value-id="{{ $value['id'] }}"
+                aria-label="{{ $value['label'] }}"
+                aria-pressed="false"
+            >{{ $value['label'] }}</x-ui.button>
+        @endforeach
+    </div>
+</div>

resources/views/components/ui/product-card.blade.php

@@ -1,8 +1,15 @@
 @props([
-    'name'  => '',
-    'price' => null,
-    'image' => null,
-    'href'  => '#',
+    'name'      => '',
+    'price'     => null,
+    'image'     => null,
+    'href'      => '#',
+    'variantId' => null,
+    'hasCustomFields' => false,
+    // Shows the "sold" star and drops the quick add-to-cart/personalize button.
+    'soldOut'   => false,
+    // Heart toggle at the top right of the image; needs productId.
+    'productId' => null,
+    'wishlist'  => false,
 ])
 
 {{-- data-turbo-frame="_top" on the links: this card renders inside the
@@ -27,9 +34,37 @@ class="w-full h-auto block"
             @endif
         </a>
 
-        <x-ui.button size="md" position="absolute" class="opacity-0 group-hover:opacity-100 transition-opacity duration-100">
-            {{ __('storefront.product.add_to_cart') }}
-        </x-ui.button>
+        @if ($wishlist && $productId)
+            <x-wishlist-button :product-id="$productId" class="absolute top-4 right-4 z-10" />
+        @endif
+
+        @if ($soldOut)
+            <x-ui.sold-badge class="absolute top-2 right-2 {{ $wishlist && $productId ? 'mt-12' : '' }}" />
+        @elseif ($hasCustomFields)
+            {{-- Custom fields have to be filled in on the product page. --}}
+            <x-ui.button
+                :href="$href"
+                size="md"
+                position="absolute"
+                data-turbo-frame="_top"
+                class="opacity-0 group-hover:opacity-100 focus-visible:opacity-100 transition-opacity duration-100"
+            >
+                {{ __('storefront.product.personalize') }}
+            </x-ui.button>
+        @elseif ($variantId)
+            {{-- has-[...] forces the button visible while an add-to-cart error
+                 is showing, so it isn't only readable on hover — a shopper who
+                 already moved off the card (mouse or the click itself) must
+                 still see why nothing happened. --}}
+            <x-checkout::add-to-cart
+                :purchasable="$variantId"
+                class="absolute opacity-0 group-hover:opacity-100 has-[.bbk-add-to-cart-error:not([hidden])]:opacity-100 transition-opacity duration-100"
+            >
+                <x-ui.button type="submit" size="md">
+                    {{ __('storefront.product.add_to_cart') }}
+                </x-ui.button>
+            </x-checkout::add-to-cart>
+        @endif
     </div>
 
     <div class="flex items-baseline justify-between gap-4">

resources/views/components/ui/select.blade.php

@@ -1,17 +1,22 @@
 @props([
-    'options'   => [],
-    'value'     => null,
-    'name'      => null,
-    'ariaLabel' => null,
+    'options'     => [],
+    'value'       => null,
+    'name'        => null,
+    'ariaLabel'   => null,
+    'placeholder' => null,
+    'block'       => false,
 ])
 
 
-<div class="relative inline-flex items-center">
+<div @class(['relative items-center', 'flex w-full' => $block, 'inline-flex' => ! $block])>
     <select
         @if($name) name="{{ $name }}" @endif
         @if($ariaLabel) aria-label="{{ $ariaLabel }}" @endif
-        {{ $attributes->merge(['class' => 'appearance-none bg-transparent border-b border-black  pr-10 py-2.5 cursor-pointer focus:outline-none']) }}
+        {{ $attributes->merge(['class' => 'appearance-none bg-transparent border-b border-black  pr-10 py-2.5 cursor-pointer focus:outline-none'.($block ? ' w-full' : '')]) }}
     >
+        @if($placeholder !== null)
+            <option value="" @selected($value === null || $value === '')>{{ $placeholder }}</option>
+        @endif
         @foreach($options as $option)
             <option value="{{ $option['value'] }}" @selected($value === $option['value'])>{{ $option['label'] }}</option>
         @endforeach

resources/views/components/ui/sold-badge.blade.php

@@ -0,0 +1,8 @@
+{{-- Black "sold" star for out-of-stock products. Position it from the caller
+     (e.g. class="absolute top-2 right-2"). --}}
+<div {{ $attributes->class('z-10 flex h-20 w-22 items-center justify-center text-black') }}>
+    <svg viewBox="0 0 87 80" class="absolute inset-0 size-full" fill="currentColor" aria-hidden="true">
+        <path d="M56.942,0l2.607,18.642,19.143-3.363L69.468,31.842,87,40,69.468,48.158l9.224,16.563L59.549,61.358,56.942,80,43.5,66.4,30.058,80,27.451,61.358,8.308,64.721l9.224-16.563L0,40l17.532-8.158L8.308,15.279l19.143,3.363L30.058,0,43.5,13.6Z"/>
+    </svg>
+    <span class="relative text-base italic font-black text-white uppercase">{{ __('storefront.product.sold') }}</span>
+</div>

resources/views/components/ui/status.blade.php

@@ -0,0 +1,11 @@
+{{--
+    Flash confirmation box ("Changes saved." etc.). Renders nothing when there's
+    no message; defaults to session('status'). Spacing comes from the caller.
+--}}
+@props([
+    'message' => session('status'),
+])
+
+@if (filled($message))
+    <p role="status" aria-live="polite" {{ $attributes->merge(['class' => 'border border-black bg-brand p-6 text-black']) }}>{{ $message }}</p>
+@endif

resources/views/components/ui/tabs.blade.php

@@ -1,9 +1,10 @@
-@props(['tabs' => [], 'size' => 'md'])
+@props(['tabs' => [], 'size' => 'md', 'active' => null])
 @php
     $sizeClasses = match($size) {
         'lg'    => 'text-[36px] font-extrabold [--slide-h:5px]',
         default => 'text-xl font-bold [--slide-h:3px]',
     };
+    $activeId = $active ?? ($tabs[0]['id'] ?? null);
 @endphp
 
 {{--
@@ -21,22 +22,22 @@
 
 <div data-controller="tabs" {{ $attributes }}>
     <div class="flex gap-10 mb-8" role="tablist">
-        @foreach($tabs as $i => $tab)
+        @foreach($tabs as $tab)
             <button
                 type="button"
                 role="tab"
                 data-tabs-target="button"
                 data-action="click->tabs#show"
                 data-panel="{{ $tab['id'] }}"
-                class="underline-slide font-display pb-1 {{ $sizeClasses }} {{ $i === 0 ? 'is-active' : '' }}"
-                aria-selected="{{ $i === 0 ? 'true' : 'false' }}"
+                class="underline-slide font-display pb-1 {{ $sizeClasses }} {{ $tab['id'] === $activeId ? 'is-active' : '' }}"
+                aria-selected="{{ $tab['id'] === $activeId ? 'true' : 'false' }}"
                 aria-controls="tab-panel-{{ $tab['id'] }}"
                 id="tab-btn-{{ $tab['id'] }}"
             >{{ $tab['label'] }}</button>
         @endforeach
     </div>
 
-    @foreach($tabs as $i => $tab)
+    @foreach($tabs as $tab)
         @php $panelKey = $tab['id']; $panel = $$panelKey ?? null; @endphp
         <div
             role="tabpanel"
@@ -44,7 +45,7 @@ class="underline-slide font-display pb-1 {{ $sizeClasses }} {{ $i === 0 ? 'is-ac
             id="tab-panel-{{ $tab['id'] }}"
             aria-labelledby="tab-btn-{{ $tab['id'] }}"
             tabindex="0"
-            @if($i !== 0) hidden @endif
+            @if($tab['id'] !== $activeId) hidden @endif
         >{{ $panel }}</div>
     @endforeach
 </div>

resources/views/components/wishlist-button.blade.php

@@ -0,0 +1,41 @@
+{{--
+    Heart toggle for one product. A real form, so it works without JS; the
+    `wishlist` Stimulus controller turns the submit into a fetch and flips
+    aria-pressed, which the CSS (group-aria-pressed) uses to swap the icons.
+
+    Usage: <x-wishlist-button :product-id="$product['id']" class="absolute top-4 right-4" />
+--}}
+@props(['productId'])
+
+@php
+    $active = app(\App\Services\Wishlist::class)->has((int) $productId);
+    $addLabel = __('storefront.wishlist.add');
+    $removeLabel = __('storefront.wishlist.remove');
+@endphp
+
+<form
+    method="POST"
+    action="{{ route('wishlist.toggle', ['productId' => $productId]) }}"
+    data-controller="wishlist"
+    data-action="submit->wishlist#toggle"
+    data-wishlist-add-label-value="{{ $addLabel }}"
+    data-wishlist-remove-label-value="{{ $removeLabel }}"
+    data-wishlist-added-message-value="{{ __('storefront.wishlist.added') }}"
+    data-wishlist-removed-message-value="{{ __('storefront.wishlist.removed') }}"
+    {{ $attributes }}
+>
+    @csrf
+
+    <button
+        type="submit"
+        class="group/heart flex size-12 cursor-pointer items-center justify-center"
+        aria-pressed="{{ $active ? 'true' : 'false' }}"
+        aria-label="{{ $active ? $removeLabel : $addLabel }}"
+        data-wishlist-target="button"
+    >
+        <x-ui.icon name="heart" :size="30" class="group-aria-pressed/heart:hidden" />
+        <x-ui.icon name="heart-fill" :size="28" stroke="#000" class="hidden group-aria-pressed/heart:block text-brand" />
+    </button>
+
+    <span class="sr-only" role="status" aria-live="polite" data-wishlist-target="status"></span>
+</form>

resources/views/contact.blade.php

@@ -3,6 +3,11 @@
 @section('title', __('storefront.nav.contact'))
 @section('description', 'Επικοινώνησε μαζί μας για οποιαδήποτε απορία ή ιδέα έχεις και θα σου απαντήσουμε το συντομότερο δυνατό.')
 
+{{-- Only on pages with a captcha, not in the global layout. --}}
+@push('scripts')
+    <script src="https://js.hcaptcha.com/1/api.js?hl={{ app()->getLocale() }}" async defer></script>
+@endpush
+
 @section('content')
 
     <section class="grid grid-cols-1 lg:grid-cols-2 lg:divide-x lg:divide-black lg:min-h-[calc(100vh-102px)]">
@@ -24,23 +29,45 @@
                 Έχεις απορία, ιδέα ή θες να μας πεις κάτι; Γράψε μας το μήνυμά σου και θα σου απαντήσουμε το συντομότερο δυνατό.
             </p>
 
-            <form method="POST" action="#" class="flex flex-col gap-8 max-w-xl">
+            <x-ui.status class="max-w-xl" />
+
+            <form method="POST" action="{{ route('contact.send') }}" class="flex flex-col gap-8 max-w-xl">
                 @csrf
 
                 <div class="grid grid-cols-1 gap-8 sm:grid-cols-2">
-                    <x-ui.field label="Το όνομά σου" for="contact-name">
-                        <x-ui.input id="contact-name" name="name" autocomplete="name" :required="true" />
+                    <x-ui.field label="Το όνομά σου *" for="contact-name" :error="$errors->first('name')">
+                        <x-ui.input id="contact-name" name="name" autocomplete="name" maxlength="100" :value="old('name')" :required="true"
+                            :aria-invalid="$errors->has('name') ? 'true' : null"
+                            :aria-describedby="$errors->has('name') ? 'contact-name-error' : null" />
                     </x-ui.field>
 
-                    <x-ui.field label="Το email σου" for="contact-email">
-                        <x-ui.input id="contact-email" name="email" type="email" autocomplete="email" :required="true" />
+                    <x-ui.field label="Το email σου *" for="contact-email" :error="$errors->first('email')">
+                        <x-ui.input id="contact-email" name="email" type="email" autocomplete="email" maxlength="255" :value="old('email')" :required="true"
+                            :aria-invalid="$errors->has('email') ? 'true' : null"
+                            :aria-describedby="$errors->has('email') ? 'contact-email-error' : null" />
                     </x-ui.field>
                 </div>
 
-                <x-ui.field label="Το μήνυμά σου" for="contact-message">
-                    <x-ui.textarea id="contact-message" name="message" rows="5" :required="true" />
+                <x-ui.field label="Το μήνυμά σου *" for="contact-message" :error="$errors->first('message')">
+                    <x-ui.textarea id="contact-message" name="message" rows="5" maxlength="5000" :required="true"
+                        :aria-invalid="$errors->has('message') ? 'true' : null"
+                        :aria-describedby="$errors->has('message') ? 'contact-message-error' : null">{{ old('message') }}</x-ui.textarea>
                 </x-ui.field>
 
+                {{-- hCaptcha checkbox, verified by App\Rules\HCaptcha (see auth/login). --}}
+                <x-ui.field for="contact-captcha" :error="$errors->first('h-captcha-response')">
+                    <div
+                        id="contact-captcha"
+                        class="h-captcha min-h-[78px]"
+                        data-sitekey="{{ config('services.hcaptcha.sitekey') }}"
+                        @if ($errors->has('h-captcha-response')) aria-describedby="contact-captcha-error" @endif
+                    ></div>
+                </x-ui.field>
+
+                @if (session('contact_error'))
+                    <p role="alert" class="text-sm text-red-600">{{ session('contact_error') }}</p>
+                @endif
+
                 <div>
                     <x-ui.button type="submit" size="md">Υποβολή</x-ui.button>
                 </div>

resources/views/emails/contact-confirmation.blade.php

@@ -0,0 +1,17 @@
+@extends('emails.layout')
+
+@section('title', __('storefront.contact.confirmation_subject'))
+
+@section('preheader', __('storefront.contact.confirmation_preheader'))
+
+@section('content')
+    <h1 style="margin:0 0 20px;font-family:'Manrope',Arial,Helvetica,sans-serif;font-size:22px;line-height:1.3;font-weight:700;color:#000000;">
+        {{ __('storefront.contact.confirmation_heading') }}
+    </h1>
+
+    <p style="margin:0;">{{ __('storefront.contact.confirmation_body') }}</p>
+@endsection
+
+@section('footer')
+    <p style="margin:0;">{{ __('storefront.contact.confirmation_footer') }}</p>
+@endsection

resources/views/emails/contact-message.blade.php

@@ -0,0 +1,21 @@
+@extends('emails.layout')
+
+@section('title', 'Νέο μήνυμα επικοινωνίας')
+
+@section('preheader', "Από {$senderName} ({$senderEmail})")
+
+@section('content')
+    <h1 style="margin:0 0 20px;font-family:'Manrope',Arial,Helvetica,sans-serif;font-size:22px;line-height:1.3;font-weight:700;color:#000000;">
+        Νέο μήνυμα επικοινωνίας
+    </h1>
+
+    <p style="margin:0 0 4px;"><strong>Όνομα:</strong> {{ $senderName }}</p>
+    <p style="margin:0 0 4px;"><strong>Email:</strong> <a href="mailto:{{ $senderEmail }}" style="color:#000000;">{{ $senderEmail }}</a></p>
+    <p style="margin:0 0 24px;"><strong>Γλώσσα:</strong> {{ strtoupper($senderLocale) }}</p>
+
+    <p style="margin:0;white-space:pre-line;">{{ $body }}</p>
+@endsection
+
+@section('footer')
+    <p style="margin:0;">Στάλθηκε από τη φόρμα επικοινωνίας του 3dealer. Απάντησε σε αυτό το email για να απαντήσεις στον αποστολέα.</p>
+@endsection

resources/views/emails/layout.blade.php

@@ -0,0 +1,98 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" lang="{{ str_replace('_', '-', app()->getLocale()) }}">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<meta http-equiv="X-UA-Compatible" content="IE=edge">
+<meta name="x-apple-disable-message-reformatting">
+<meta name="format-detection" content="telephone=no, date=no, address=no, email=no, url=no">
+<meta name="color-scheme" content="light">
+<meta name="supported-color-schemes" content="light">
+<title>@yield('title', '3Dealer')</title>
+<!--[if mso]>
+<noscript>
+<xml>
+<o:OfficeDocumentSettings>
+<o:PixelsPerInch>96</o:PixelsPerInch>
+<o:AllowPNG/>
+</o:OfficeDocumentSettings>
+</xml>
+</noscript>
+<style>
+  table { border-collapse: collapse !important; }
+  .email-container { width: 600px !important; }
+</style>
+<![endif]-->
+<!--[if !mso]><!-->
+<link href="https://fonts.googleapis.com/css2?family=Manrope:wght@400;600;700;800&display=swap" rel="stylesheet" type="text/css">
+<!--<![endif]-->
+<style>
+  body, table, td, a { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
+  table, td { mso-table-lspace: 0pt; mso-table-rspace: 0pt; }
+  img { -ms-interpolation-mode: bicubic; border: 0; height: auto; line-height: 100%; outline: none; text-decoration: none; }
+  body { height: 100% !important; margin: 0 !important; padding: 0 !important; width: 100% !important; background-color: #e5e5e5; }
+  a[x-apple-data-detectors] {
+    color: inherit !important;
+    text-decoration: none !important;
+    font-size: inherit !important;
+    font-family: inherit !important;
+    font-weight: inherit !important;
+    line-height: inherit !important;
+  }
+  #MessageViewBody, #MessageWebViewDiv { width: 100% !important; }
+  u + #email-body a { color: inherit; text-decoration: none; }
+
+  @media only screen and (max-width: 480px) {
+    .email-container { width: 100% !important; max-width: 100% !important; }
+    .email-header { padding: 24px 20px 12px !important; }
+    .email-gutter { padding: 0 !important; }
+    .email-card { padding: 28px 20px !important; }
+    .email-footer { padding: 0 20px 32px !important; }
+  }
+</style>
+</head>
+<body id="email-body" style="margin:0;padding:0;background-color:#e5e5e5;">
+<div style="display:none;max-height:0;overflow:hidden;mso-hide:all;font-size:1px;line-height:1px;color:#e5e5e5;">
+  @yield('preheader', '')
+  &nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;
+</div>
+
+<center role="article" aria-roledescription="email" style="width:100%;background-color:#e5e5e5;">
+<!--[if mso]>
+<table role="presentation" width="600" align="center" cellpadding="0" cellspacing="0" bgcolor="#e5e5e5"><tr><td>
+<![endif]-->
+<table role="presentation" class="email-container" width="100%" cellpadding="0" cellspacing="0" bgcolor="#e5e5e5" style="max-width:600px;margin:0 auto;">
+  <tr>
+    <td class="email-header" align="center" style="padding:32px 24px 16px;">
+      <a href="{{ url('/') }}" target="_blank" style="text-decoration:none;">
+        <img src="{{ asset('images/logo.png') }}" width="140" height="123" alt="3Dealer" style="display:inline-block;border:0;outline:none;text-decoration:none;height:auto;max-width:140px;width:100%;">
+      </a>
+    </td>
+  </tr>
+  <tr>
+    <td class="email-gutter" style="padding:0 24px;">
+      <table role="presentation" width="100%" cellpadding="0" cellspacing="0" bgcolor="#ffffff" style="background-color:#ffffff;border-radius:0;">
+        <tr>
+          <td class="email-card" style="padding:40px 32px;font-family:'Manrope',Arial,Helvetica,sans-serif;font-size:16px;line-height:1.5;color:#000000;text-align:left;">
+            @yield('content')
+          </td>
+        </tr>
+      </table>
+    </td>
+  </tr>
+  <tr>
+    <td class="email-footer" align="center" style="padding:24px 24px 40px;font-family:'Manrope',Arial,Helvetica,sans-serif;font-size:13px;line-height:1.6;color:#7a7a7a;">
+      @yield('footer')
+      <p style="margin:12px 0 0;">
+        <a href="{{ url('/') }}" style="color:#7a7a7a;text-decoration:underline;">3dealer.gr</a>
+        &nbsp;&middot;&nbsp;&copy; {{ date('Y') }} 3Dealer
+      </p>
+    </td>
+  </tr>
+</table>
+<!--[if mso]>
+</td></tr></table>
+<![endif]-->
+</center>
+</body>
+</html>

resources/views/emails/partials/address.blade.php

@@ -0,0 +1,15 @@
+{{--
+    @include('emails.partials.address', ['address' => $order->shippingAddress])
+
+    An order address, read-only, same fields as the account order page.
+--}}
+<p style="margin:0;font-size:15px;line-height:1.6;">
+    {{ trim($address->first_name.' '.$address->last_name) }}<br>
+    @if ($address->company_name){{ $address->company_name }}<br>@endif
+    @if ($address->tax_identifier)ΑΦΜ: {{ $address->tax_identifier }}<br>@endif
+    {{ $address->line_one }}<br>
+    @if ($address->line_two){{ $address->line_two }}<br>@endif
+    {{ trim($address->postcode.' '.$address->city) }}<br>
+    @if ($address->state){{ Lang::has("core::states.{$address->state}") ? __("core::states.{$address->state}") : $address->state }}<br>@endif
+    @if ($address->contact_phone){{ $address->contact_phone }}@endif
+</p>

resources/views/emails/partials/button.blade.php

@@ -0,0 +1,43 @@
+{{--
+    @include('emails.partials.button', ['url' => ..., 'label' => ...])
+
+    The site's primary button (x-ui.button, .btn-primary): neutral-200 fill,
+    black border, bold italic uppercase, black offset shadow. The shadow is
+    built from table cells, not box-shadow (Gmail and Outlook drop it): a
+    black column on the right starting $offset down, and a black row at the
+    bottom starting $offset in. The button cell spans the first two rows, so
+    the black column always matches its height.
+
+    Uppercased here with the tonos removed, since emails can't run the site's
+    strip-accents script and CSS uppercase would keep the accents.
+--}}
+@php
+    $offset = 8;
+    $label = strtr(mb_strtoupper($label), [
+        'Ά' => 'Α', 'Έ' => 'Ε', 'Ή' => 'Η', 'Ί' => 'Ι', 'Ό' => 'Ο', 'Ύ' => 'Υ', 'Ώ' => 'Ω',
+        'ΐ' => 'Ϊ', 'ΰ' => 'Ϋ',
+    ]);
+    $spacer = "font-size:1px;line-height:1px;mso-line-height-rule:exactly;";
+@endphp
+
+<table role="presentation" cellpadding="0" cellspacing="0" border="0" style="margin:0;border-collapse:separate;">
+    <tr>
+        <td rowspan="2" bgcolor="#e5e5e5" style="background-color:#e5e5e5;border:1px solid #000000;border-radius:0;mso-padding-alt:14px 28px;">
+            <a href="{{ $url }}" target="_blank" style="display:inline-block;padding:14px 28px;font-family:'Manrope',Arial,Helvetica,sans-serif;font-size:16px;line-height:20px;mso-line-height-rule:exactly;font-weight:700;font-style:italic;color:#000000;text-decoration:none;">{{ $label }}</a>
+        </td>
+        <td width="{{ $offset }}" height="{{ $offset }}" style="width:{{ $offset }}px;height:{{ $offset }}px;{{ $spacer }}">&nbsp;</td>
+    </tr>
+    <tr>
+        <td width="{{ $offset }}" bgcolor="#000000" style="width:{{ $offset }}px;background-color:#000000;{{ $spacer }}">&nbsp;</td>
+    </tr>
+    <tr>
+        <td height="{{ $offset }}" style="height:{{ $offset }}px;padding:0 0 0 {{ $offset }}px;{{ $spacer }}">
+            <table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0">
+                <tr>
+                    <td height="{{ $offset }}" bgcolor="#000000" style="height:{{ $offset }}px;background-color:#000000;{{ $spacer }}">&nbsp;</td>
+                </tr>
+            </table>
+        </td>
+        <td width="{{ $offset }}" height="{{ $offset }}" bgcolor="#000000" style="width:{{ $offset }}px;height:{{ $offset }}px;background-color:#000000;{{ $spacer }}">&nbsp;</td>
+    </tr>
+</table>

resources/views/emails/partials/section-heading.blade.php

@@ -0,0 +1,2 @@
+{{-- @include('emails.partials.section-heading', ['text' => ...]) --}}
+<h2 style="margin:0 0 12px;padding:0 0 8px;border-bottom:1px solid #000000;font-family:'Manrope',Arial,Helvetica,sans-serif;font-size:18px;line-height:1.3;font-weight:800;color:#000000;">{{ $text }}</h2>

resources/views/home.blade.php

@@ -43,7 +43,7 @@ class="absolute left-4 lg:left-8 top-1/2 z-10 -translate-y-1/2 hover:-translate-
                                 class="{{ $loop->first ? '' : 'hidden' }} group h-full flex flex-col justify-center pb-8 relative"
                             >
                                 <div class="relative flex items-center justify-center">
-                                    <a href="{{ $product['href'] }}" class="block border border-black bg-white flex items-center justify-center overflow-hidden max-w-xs xl:max-w-sm">
+                                    <a href="{{ $product['href'] }}" class="relative block border border-black bg-white flex items-center justify-center overflow-hidden max-w-xs xl:max-w-sm">
                                         @if($product['image'])
                                             <img
                                                 src="{{ $product['image'] }}"
@@ -58,11 +58,34 @@ class="w-full h-full object-cover"
                                         @else
                                             <span class="text-neutral-500 text-sm">{{ __('storefront.product.no_image') }}</span>
                                         @endif
+
+                                        {{-- Inside the link so it sits on the image's corner, not the full-width slide's. --}}
+                                        @if ($product['soldOut'] ?? false)
+                                            <x-ui.sold-badge class="absolute top-2 right-2" />
+                                        @endif
                                     </a>
 
-                                    <x-ui.button size="md" position="absolute" class="opacity-0 group-hover:opacity-100 transition-opacity duration-100">
-                                        {{ __('storefront.product.add_to_cart') }}
-                                    </x-ui.button>
+                                    @if ($product['soldOut'] ?? false)
+                                        {{-- Sold: no quick add-to-cart/personalize, same as x-ui.product-card. --}}
+                                    @elseif ($product['hasCustomFields'] ?? false)
+                                        <x-ui.button
+                                            :href="$product['href']"
+                                            size="md"
+                                            position="absolute"
+                                            class="opacity-0 group-hover:opacity-100 focus-visible:opacity-100 transition-opacity duration-100"
+                                        >
+                                            {{ __('storefront.product.personalize') }}
+                                        </x-ui.button>
+                                    @elseif ($product['variantId'] ?? null)
+                                        <x-checkout::add-to-cart
+                                            :purchasable="$product['variantId']"
+                                            class="absolute opacity-0 group-hover:opacity-100 has-[.bbk-add-to-cart-error:not([hidden])]:opacity-100 transition-opacity duration-100"
+                                        >
+                                            <x-ui.button type="submit" size="md">
+                                                {{ __('storefront.product.add_to_cart') }}
+                                            </x-ui.button>
+                                        </x-checkout::add-to-cart>
+                                    @endif
                                 </div>
 
                                 <div class="flex items-baseline justify-between gap-4 absolute bottom-0 left-0 w-full">
@@ -155,6 +178,9 @@ class="max-w-xs"
                                 :price="$product['price']"
                                 :image="$product['image']"
                                 :href="$product['href']"
+                                :variant-id="$product['variantId'] ?? null"
+                                :has-custom-fields="$product['hasCustomFields'] ?? false"
+                                :sold-out="$product['soldOut'] ?? false"
                             />
                         @endforeach
                     </div>
@@ -169,7 +195,5 @@ class="max-w-xs"
         </div>
     </div>
 
-    <div class="py-20">
-        <x-newsletter-split />
-    </div>
+    <x-newsletter-split />
 @endsection