quill editor

assets/css/app.css

@@ -77,3 +77,108 @@
 
 /* Hide Alpine x-cloak elements until Alpine initializes. */
 [x-cloak] { display: none !important; }
+
+/* === Rich text editor (Quill "snow") =======================
+ * Vendored Quill (assets/static/vendor/quill) drives the admin
+ * product short/long description fields. Stock snow already suits
+ * the light theme; the admin panel is locked to data-theme="dark",
+ * so the rules below repaint the toolbar/editor for dark. Editor
+ * height is per-instance via the --rich-min-height custom prop set
+ * by the ui::rich_editor macro.
+ * ============================================================ */
+.rich-editor .ql-editor {
+  min-height: var(--rich-min-height, 12rem);
+  font-size: 0.95rem;
+  line-height: 1.6;
+}
+.ql-editor.ql-blank::before { font-style: normal; }
+
+[data-theme="dark"] .rich-editor { background: var(--color-surface-dark-alt); }
+[data-theme="dark"] .ql-toolbar.ql-snow,
+[data-theme="dark"] .ql-container.ql-snow { border-color: var(--color-outline-dark); }
+[data-theme="dark"] .ql-toolbar.ql-snow { background: var(--color-surface-dark); }
+[data-theme="dark"] .ql-container.ql-snow { color: var(--color-on-surface-dark); }
+[data-theme="dark"] .ql-snow .ql-stroke,
+[data-theme="dark"] .ql-snow .ql-stroke-miter { stroke: var(--color-on-surface-dark); }
+[data-theme="dark"] .ql-snow .ql-fill,
+[data-theme="dark"] .ql-snow .ql-stroke.ql-fill { fill: var(--color-on-surface-dark); }
+[data-theme="dark"] .ql-snow .ql-picker { color: var(--color-on-surface-dark); }
+[data-theme="dark"] .ql-snow .ql-picker-options {
+  background: var(--color-surface-dark);
+  border-color: var(--color-outline-dark);
+}
+/* active / hover toolbar state -> primary accent */
+[data-theme="dark"] .ql-snow.ql-toolbar button:hover,
+[data-theme="dark"] .ql-snow.ql-toolbar button.ql-active,
+[data-theme="dark"] .ql-snow.ql-toolbar .ql-picker-label:hover,
+[data-theme="dark"] .ql-snow.ql-toolbar .ql-picker-label.ql-active,
+[data-theme="dark"] .ql-snow.ql-toolbar .ql-picker-item:hover,
+[data-theme="dark"] .ql-snow.ql-toolbar .ql-picker-item.ql-selected { color: var(--color-primary-dark); }
+[data-theme="dark"] .ql-snow.ql-toolbar button:hover .ql-stroke,
+[data-theme="dark"] .ql-snow.ql-toolbar button.ql-active .ql-stroke,
+[data-theme="dark"] .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,
+[data-theme="dark"] .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke { stroke: var(--color-primary-dark); }
+[data-theme="dark"] .ql-snow.ql-toolbar button:hover .ql-fill,
+[data-theme="dark"] .ql-snow.ql-toolbar button.ql-active .ql-fill { fill: var(--color-primary-dark); }
+[data-theme="dark"] .ql-snow .ql-tooltip {
+  background-color: var(--color-surface-dark);
+  border-color: var(--color-outline-dark);
+  color: var(--color-on-surface-dark);
+  box-shadow: 0 2px 8px rgb(0 0 0 / 0.45);
+}
+[data-theme="dark"] .ql-snow .ql-tooltip input[type=text] {
+  background: var(--color-surface-dark-alt);
+  border-color: var(--color-outline-dark);
+  color: var(--color-on-surface-dark);
+}
+[data-theme="dark"] .ql-snow .ql-editor a,
+[data-theme="dark"] .ql-snow .ql-tooltip a { color: var(--color-primary-dark); }
+
+/* Image size controls under the editor. */
+.rich-image-size-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
+.rich-image-size-controls.hidden { display: none; }
+.rich-image-size-controls button {
+  border: 1px solid var(--color-outline);
+  border-radius: var(--radius-radius);
+  padding: 0.3rem 0.65rem;
+  line-height: 1;
+  font-size: 0.8rem;
+}
+.rich-image-size-controls button:hover { border-color: var(--color-primary); color: var(--color-primary); }
+[data-theme="dark"] .rich-image-size-controls button { border-color: var(--color-outline-dark); }
+[data-theme="dark"] .rich-image-size-controls button:hover {
+  border-color: var(--color-primary-dark);
+  color: var(--color-primary-dark);
+}
+
+/* Image sizing classes shared by the editor and rendered output. */
+.rich-editor img, .rich-content img {
+  display: block;
+  max-width: 100%;
+  height: auto;
+  margin: 1rem auto;
+  border-radius: var(--radius-radius);
+}
+.rich-editor img { cursor: pointer; }
+.rich-image-small { width: min(100%, 18rem); }
+.rich-image-medium { width: min(100%, 34rem); }
+.rich-image-full { width: 100%; }
+
+/* === Rendered rich content (storefront product description) =
+ * Inherits text color from context so it works in both themes;
+ * only structural spacing + link/heading treatment is set here. */
+.rich-content { line-height: 1.7; }
+.rich-content h2 { margin: 1.25rem 0 0.6rem; font-size: 1.3rem; font-weight: 700; }
+.rich-content h3 { margin: 1rem 0 0.5rem; font-size: 1.1rem; font-weight: 700; }
+.rich-content p, .rich-content ul, .rich-content ol { margin: 0.6rem 0; }
+.rich-content ul { list-style: disc; padding-left: 1.4rem; }
+.rich-content ol { list-style: decimal; padding-left: 1.4rem; }
+.rich-content a { color: var(--color-primary); text-decoration: underline; }
+[data-theme="dark"] .rich-content a { color: var(--color-primary-dark); }
+.rich-content :first-child { margin-top: 0; }
+.rich-content :last-child { margin-bottom: 0; }
+
+/* Compact rich blurb for product cards: neutralize block spacing so the
+ * line-clamp truncation stays tidy regardless of the authored markup. */
+.rich-blurb :where(p, ul, ol, h2, h3) { margin: 0; }
+.rich-blurb :where(ul, ol) { padding-left: 1.1rem; }

assets/i18n/en/main.ftl

@@ -171,6 +171,8 @@ artist = Artist
 release-date = Release date
 cover-image = Cover image
 description = Description
+short-description = Short description
+short-description-hint = Shown on product cards. Keep it short.
 songs-in-album = Songs in this album
 admin-new-album-desc = Fill in the details, then tick the songs to include.
 cover-help = Optional - png, jpg, webp or gif; shown on the album page.
@@ -308,7 +310,29 @@ shop-title = Shop
 shop-subtitle = browse our products.
 shop-empty = There are no products here yet.
 search-placeholder = Search products…
+order-search-placeholder = Search orders…
 search-empty = Nothing matched your search:
+results-count = { $count } products
+sort-label = Sort
+sort-relevance = Relevance
+sort-newest = Newest
+sort-price_asc = Price: low to high
+sort-price_desc = Price: high to low
+sort-name_asc = Name: A–Z
+sort-name_desc = Name: Z–A
+filter-category = Category
+filter-all-categories = All categories
+filter-uncategorized = Uncategorized
+filter-price = Price
+filter-price-from = Price from
+filter-price-to = Price to
+filter-in-stock = In stock only
+filter-apply = Apply
+filter-clear = Clear
+pagination = Pagination
+page-of = Page { $page } of { $pages }
+prev = Previous
+next = Next
 view-grid = Grid view
 view-list = List view
 categories = Categories

assets/i18n/sk/main.ftl

@@ -171,6 +171,8 @@ artist = Interpret
 release-date = Dátum vydania
 cover-image = Obrázok obalu
 description = Popis
+short-description = Krátky popis
+short-description-hint = Zobrazuje sa na kartách produktov. Najlepšie krátke.
 songs-in-album = Skladby v albume
 admin-new-album-desc = Vyplň údaje a potom označ skladby, ktoré chceš zahrnúť.
 cover-help = Voliteľné - png, jpg, webp alebo gif; zobrazí sa na stránke albumu.
@@ -308,7 +310,29 @@ shop-title = Obchod
 shop-subtitle = prezrite si našu ponuku produktov.
 shop-empty = Zatiaľ tu nie sú žiadne produkty.
 search-placeholder = Hľadať produkty…
+order-search-placeholder = Hľadať objednávky…
 search-empty = Pre váš výraz sme nič nenašli:
+results-count = { $count } produktov
+sort-label = Zoradiť
+sort-relevance = Relevancia
+sort-newest = Najnovšie
+sort-price_asc = Cena: od najnižšej
+sort-price_desc = Cena: od najvyššej
+sort-name_asc = Názov: A–Z
+sort-name_desc = Názov: Z–A
+filter-category = Kategória
+filter-all-categories = Všetky kategórie
+filter-uncategorized = Bez kategórie
+filter-price = Cena
+filter-price-from = Cena od
+filter-price-to = Cena do
+filter-in-stock = Len skladom
+filter-apply = Použiť
+filter-clear = Zrušiť
+pagination = Stránkovanie
+page-of = Strana { $page } z { $pages }
+prev = Predchádzajúce
+next = Ďalšie
 view-grid = Zobrazenie v mriežke
 view-list = Zobrazenie v zozname
 categories = Kategórie

assets/static/js/rich-editor.js

@@ -0,0 +1,174 @@
+// Quill-based rich text editor, ported from the universal_web blog editor and
+// adapted to this shop: each editor lives in a `[data-rich-field]` wrapper so a
+// single form can host several (e.g. short + long description); image uploads go
+// to this app's /images/upload and carry the CSRF token the middleware expects.
+(function () {
+  function setImageSize(image, size) {
+    image.classList.remove('rich-image-small', 'rich-image-medium', 'rich-image-full');
+    image.style.removeProperty('width');
+    image.style.removeProperty('height');
+    image.classList.add('rich-image-' + size);
+  }
+
+  function setImageWidth(image, width) {
+    var px = parseInt(width, 10);
+    if (!Number.isFinite(px) || px < 40) return;
+    image.classList.remove('rich-image-small', 'rich-image-medium', 'rich-image-full');
+    image.style.width = Math.min(px, 1200) + 'px';
+    image.style.height = 'auto';
+  }
+
+  function normalizeEditorImages(root) {
+    root.querySelectorAll('img').forEach(function (image) {
+      if (
+        !image.classList.contains('rich-image-small')
+        && !image.classList.contains('rich-image-medium')
+        && !image.classList.contains('rich-image-full')
+      ) {
+        image.classList.add('rich-image-full');
+      }
+    });
+  }
+
+  // The CSRF middleware accepts the token as an X-CSRF-Token header; read it from
+  // the form's hidden _csrf field (rendered by ui::csrf_field()).
+  function csrfToken(field) {
+    var form = field.closest('form');
+    var input = form && form.querySelector('input[name="_csrf"]');
+    return input ? input.value : '';
+  }
+
+  function initField(field) {
+    var editorEl = field.querySelector('[data-rich-editor]');
+    var contentInput = field.querySelector('[data-rich-content]');
+    var status = field.querySelector('[data-rich-status]');
+    var imageControls = field.querySelector('[data-image-size-controls]');
+    var imageWidthInput = field.querySelector('[data-image-width]');
+    if (!editorEl || !contentInput || !window.Quill) return;
+
+    var selectedImage = null;
+    var toolbar = [
+      [{ header: [2, 3, false] }],
+      ['bold', 'italic'],
+      [{ list: 'ordered' }, { list: 'bullet' }],
+      ['link', 'image'],
+      ['clean']
+    ];
+    var editor = new Quill(editorEl, {
+      modules: { toolbar: toolbar },
+      placeholder: editorEl.dataset.placeholder || '',
+      theme: 'snow'
+    });
+
+    var initialContent = contentInput.value.trim();
+    if (initialContent) {
+      if (initialContent.indexOf('<') >= 0) editor.clipboard.dangerouslyPasteHTML(initialContent);
+      else editor.setText(initialContent);
+      normalizeEditorImages(editor.root);
+    }
+
+    function syncContent() {
+      normalizeEditorImages(editor.root);
+      // Quill leaves an empty editor as "<p><br></p>"; store empty instead so the
+      // server sees a blank (nullable) value rather than stray markup.
+      var html = editor.root.innerHTML;
+      contentInput.value = editor.getText().trim() === '' && !editor.root.querySelector('img')
+        ? ''
+        : html;
+    }
+
+    function setStatus(message) {
+      if (status) status.textContent = message || '';
+    }
+
+    function chooseImageFile() {
+      var input = document.createElement('input');
+      input.type = 'file';
+      input.accept = 'image/jpeg,image/png,image/webp,image/gif';
+      input.addEventListener('change', function () {
+        var file = input.files && input.files[0];
+        if (!file) return;
+        uploadImage(file);
+      });
+      input.click();
+    }
+
+    async function uploadImage(file) {
+      var formData = new FormData();
+      formData.append('file', file);
+      setStatus(status ? status.dataset.uploading : '');
+      try {
+        var response = await fetch('/images/upload', {
+          method: 'POST',
+          body: formData,
+          credentials: 'same-origin',
+          headers: { 'X-CSRF-Token': csrfToken(field) }
+        });
+        if (!response.ok) throw new Error('upload failed');
+        var result = await response.json();
+        var range = editor.getSelection(true);
+        editor.insertEmbed(range.index, 'image', result.url, 'user');
+        editor.setSelection(range.index + 1, 0, 'silent');
+        window.setTimeout(function () {
+          var images = editor.root.querySelectorAll('img');
+          var image = images[images.length - 1];
+          if (image) {
+            setImageSize(image, 'full');
+            selectedImage = image;
+            if (imageControls) imageControls.classList.remove('hidden');
+          }
+          syncContent();
+        }, 0);
+        setStatus(status ? status.dataset.uploaded : '');
+      } catch (_error) {
+        setStatus(status ? status.dataset.error : '');
+      }
+    }
+
+    editor.getModule('toolbar').addHandler('image', chooseImageFile);
+
+    editor.root.addEventListener('click', function (event) {
+      if (event.target && event.target.tagName === 'IMG') {
+        selectedImage = event.target;
+        if (imageWidthInput) imageWidthInput.value = parseInt(selectedImage.style.width, 10) || '';
+        if (imageControls) imageControls.classList.remove('hidden');
+      }
+    });
+
+    if (imageControls) {
+      imageControls.addEventListener('click', function (event) {
+        var button = event.target.closest('[data-image-size]');
+        if (button && selectedImage) {
+          setImageSize(selectedImage, button.dataset.imageSize);
+          if (imageWidthInput) imageWidthInput.value = '';
+          syncContent();
+        }
+      });
+    }
+
+    if (imageWidthInput) {
+      imageWidthInput.addEventListener('change', function () {
+        if (!selectedImage) return;
+        setImageWidth(selectedImage, imageWidthInput.value);
+        syncContent();
+      });
+    }
+
+    editor.on('text-change', syncContent);
+    var form = field.closest('form');
+    if (form) form.addEventListener('submit', syncContent);
+    syncContent();
+  }
+
+  function initAll(root) {
+    (root || document).querySelectorAll('[data-rich-field]').forEach(function (field) {
+      if (field.dataset.richReady) return;
+      field.dataset.richReady = '1';
+      initField(field);
+    });
+  }
+
+  document.addEventListener('DOMContentLoaded', function () { initAll(document); });
+  // Re-init after htmx swaps a fragment containing an editor into the page.
+  document.addEventListener('htmx:afterSwap', function (event) { initAll(event.target); });
+})();

assets/static/vendor/quill/LICENSE

@@ -0,0 +1,31 @@
+Copyright (c) 2017-2024, Slab
+Copyright (c) 2014, Jason Chen
+Copyright (c) 2013, salesforce.com
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions
+are met:
+
+1. Redistributions of source code must retain the above copyright
+   notice, this list of conditions and the following disclaimer.
+
+2. Redistributions in binary form must reproduce the above copyright
+   notice, this list of conditions and the following disclaimer in the
+   documentation and/or other materials provided with the distribution.
+
+3. Neither the name of the copyright holder nor the names of its
+   contributors may be used to endorse or promote products derived from
+   this software without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS
+IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED
+TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A
+PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

assets/static/vendor/quill/quill.js.LICENSE.txt

@@ -0,0 +1,7 @@
+/*!
+ * Quill Editor v2.0.3
+ * https://quilljs.com
+ * Copyright (c) 2017-2024, Slab
+ * Copyright (c) 2014, Jason Chen
+ * Copyright (c) 2013, salesforce.com
+ */

assets/views/admin/catalog/discount_form.html

@@ -15,82 +15,80 @@
   {{ ui::button(variant="outline-secondary", label=t(key="cancel", lang=lang | default(value='sk')), href="/admin/catalog/products?audience=" ~ audience, size="px-3 py-2 text-sm") }}
 </div>
 
+{# One discount row per option (variant). Each row picks a fixed sale price or a   #}
+{# percentage off its own regular price; a blank input clears that option's        #}
+{# discount. Both the fixed and percent inputs always submit (the server reads the #}
+{# active mode); rows are pre-filled from `rows` (DB values, or submitted values   #}
+{# when repainting after a validation error) and indexed as v[<variant id>][...].  #}
+<script id="discount-data" type="application/json">{{ rows | json_encode() | safe }}</script>
+
 <form method="post" action="/admin/catalog/products/{{ product.id }}/discount?audience={{ audience }}"
-  x-data="{
-    mode: '{{ mode }}',
-    fixed: '{{ fixed }}',
-    percent: '{{ percent }}',
-    regular: {{ product.regular_cents }},
-    num(v) { let n = parseFloat(String(v).replace(',', '.')); return isFinite(n) ? n : null; },
-    get afterCents() {
-      if (this.mode === 'percent') {
-        let p = this.num(this.percent); if (p === null) return null;
-        return this.regular - Math.round(this.regular * p / 100);
-      }
-      let f = this.num(this.fixed); if (f === null) return null;
-      return Math.round(f * 100);
-    },
-    money(c) { return (c / 100).toFixed(2); },
-    get valid() { let a = this.afterCents; return a !== null && a > 0 && a < this.regular; },
-    get percentOff() { let a = this.afterCents; return (a === null || this.regular <= 0) ? null : Math.round((this.regular - a) / this.regular * 100); }
-  }"
-  class="mt-6 max-w-md space-y-5 rounded-radius border border-outline bg-surface p-6 dark:border-outline-dark dark:bg-surface-dark-alt">
+  x-data="discountEditor(JSON.parse(document.getElementById('discount-data').textContent))"
+  class="mt-6 max-w-2xl space-y-5">
   {{ ui::csrf_field() }}
 
   {% if error %}
   {{ ui::alert_danger(message=t(key=error, lang=lang | default(value='sk'))) }}
   {% endif %}
 
-  <div class="flex items-center justify-between gap-3 rounded-radius bg-surface-alt px-4 py-3 dark:bg-surface-dark/40">
-    <span class="text-sm text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="price", lang=lang | default(value='sk')) }}</span>
-    <span class="font-semibold tabular-nums text-on-surface-strong dark:text-on-surface-dark-strong">{{ product.regular_price }} {{ product.currency }}</span>
-  </div>
+  <template x-for="row in rows" :key="row.id">
+    <div class="space-y-4 rounded-radius border border-outline bg-surface p-5 dark:border-outline-dark dark:bg-surface-dark-alt">
+      <div class="flex items-center justify-between gap-3">
+        <span class="font-semibold text-on-surface-strong dark:text-on-surface-dark-strong"
+          x-text="row.label || ('#' + row.id)"></span>
+        <span class="text-sm tabular-nums text-on-surface/70 dark:text-on-surface-dark/70">
+          {{ t(key="price", lang=lang | default(value='sk')) }}:
+          <span x-text="row.regular_price"></span> <span x-text="row.currency"></span>
+        </span>
+      </div>
 
-  <!-- mode toggle -->
-  <div class="grid grid-cols-2 gap-2">
-    <label class="flex cursor-pointer items-center justify-center gap-2 rounded-radius border px-3 py-2 text-sm transition"
-      :class="mode === 'fixed' ? 'border-primary bg-primary/10 text-on-surface-strong dark:border-primary-dark dark:bg-primary-dark/10 dark:text-on-surface-dark-strong' : 'border-outline text-on-surface dark:border-outline-dark dark:text-on-surface-dark'">
-      <input type="radio" name="mode" value="fixed" x-model="mode" class="sr-only">
-      {{ t(key="discount-mode-fixed", lang=lang | default(value='sk')) }}
-    </label>
-    <label class="flex cursor-pointer items-center justify-center gap-2 rounded-radius border px-3 py-2 text-sm transition"
-      :class="mode === 'percent' ? 'border-primary bg-primary/10 text-on-surface-strong dark:border-primary-dark dark:bg-primary-dark/10 dark:text-on-surface-dark-strong' : 'border-outline text-on-surface dark:border-outline-dark dark:text-on-surface-dark'">
-      <input type="radio" name="mode" value="percent" x-model="mode" class="sr-only">
-      {{ t(key="discount-mode-percent", lang=lang | default(value='sk')) }}
-    </label>
-  </div>
+      <input type="hidden" :name="`v[${row.id}][mode]`" :value="row.mode">
 
-  <!-- fixed price input -->
-  <div class="space-y-1.5" x-show="mode === 'fixed'">
-    <label for="sale_price" class="text-sm font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="sale-price", lang=lang | default(value='sk')) }}</label>
-    {{ ui::input(name="sale_price", id="sale_price", value=fixed, placeholder="0.00", attrs='inputmode="decimal" x-model="fixed"') }}
-  </div>
+      <div class="grid gap-4 sm:grid-cols-2">
+        <!-- mode toggle -->
+        <div class="grid grid-cols-2 gap-2">
+          <label class="flex cursor-pointer items-center justify-center gap-2 rounded-radius border px-3 py-2 text-sm transition"
+            :class="row.mode === 'fixed' ? 'border-primary bg-primary/10 text-on-surface-strong dark:border-primary-dark dark:bg-primary-dark/10 dark:text-on-surface-dark-strong' : 'border-outline text-on-surface dark:border-outline-dark dark:text-on-surface-dark'">
+            <input type="radio" :name="`mode-ui-${row.id}`" value="fixed" x-model="row.mode" class="sr-only">
+            {{ t(key="discount-mode-fixed", lang=lang | default(value='sk')) }}
+          </label>
+          <label class="flex cursor-pointer items-center justify-center gap-2 rounded-radius border px-3 py-2 text-sm transition"
+            :class="row.mode === 'percent' ? 'border-primary bg-primary/10 text-on-surface-strong dark:border-primary-dark dark:bg-primary-dark/10 dark:text-on-surface-dark-strong' : 'border-outline text-on-surface dark:border-outline-dark dark:text-on-surface-dark'">
+            <input type="radio" :name="`mode-ui-${row.id}`" value="percent" x-model="row.mode" class="sr-only">
+            {{ t(key="discount-mode-percent", lang=lang | default(value='sk')) }}
+          </label>
+        </div>
 
-  <!-- percentage input -->
-  <div class="space-y-1.5" x-show="mode === 'percent'">
-    <label for="percent" class="text-sm font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="discount-percent", lang=lang | default(value='sk')) }}</label>
-    {{ ui::input(name="percent", id="percent", value=percent, placeholder="0", attrs='inputmode="decimal" min="0" max="100" x-model="percent"') }}
-  </div>
+        <!-- value input: both fields stay in the DOM and submit; the server reads
+             whichever matches the row's mode -->
+        <div class="space-y-1.5">
+          <div x-show="row.mode === 'fixed'">
+            <label class="text-sm font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="sale-price", lang=lang | default(value='sk')) }}</label>
+            <input :name="`v[${row.id}][fixed]`" x-model="row.fixed" inputmode="decimal" placeholder="0.00"
+              class="w-full rounded-radius border border-outline bg-surface-alt px-4 py-2 text-sm text-on-surface focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark-alt/50 dark:text-on-surface-dark dark:focus-visible:outline-primary-dark">
+          </div>
+          <div x-show="row.mode === 'percent'">
+            <label class="text-sm font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="discount-percent", lang=lang | default(value='sk')) }}</label>
+            <input :name="`v[${row.id}][percent]`" x-model="row.percent" inputmode="decimal" min="0" max="100" placeholder="0"
+              class="w-full rounded-radius border border-outline bg-surface-alt px-4 py-2 text-sm text-on-surface focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark-alt/50 dark:text-on-surface-dark dark:focus-visible:outline-primary-dark">
+          </div>
+        </div>
+      </div>
 
-  <!-- live preview -->
-  <div x-show="afterCents !== null" x-cloak
-    class="space-y-2 rounded-radius border border-outline bg-surface-alt px-4 py-3 dark:border-outline-dark dark:bg-surface-dark/40">
-    <div class="flex items-center justify-between gap-3 text-sm">
-      <span class="text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="discount-preview-before", lang=lang | default(value='sk')) }}</span>
-      <span class="tabular-nums text-on-surface/60 line-through dark:text-on-surface-dark/60"><span x-text="money(regular)"></span> {{ product.currency }}</span>
+      <!-- live preview -->
+      <div x-show="afterCents(row) !== null" x-cloak
+        class="flex flex-wrap items-center justify-between gap-3 rounded-radius border border-outline bg-surface-alt px-4 py-2.5 text-sm dark:border-outline-dark dark:bg-surface-dark/40">
+        <span class="text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="discount-preview-after", lang=lang | default(value='sk')) }}</span>
+        <span class="flex items-center gap-2">
+          <span class="tabular-nums text-on-surface/50 line-through dark:text-on-surface-dark/50" x-text="money(row.regular_cents) + ' ' + row.currency"></span>
+          <span class="text-base font-semibold tabular-nums" :class="valid(row) ? 'text-danger' : 'text-on-surface/40 dark:text-on-surface-dark/40'"
+            x-text="money(afterCents(row)) + ' ' + row.currency"></span>
+          <span x-show="valid(row)" class="text-xs text-on-surface/60 dark:text-on-surface-dark/60" x-text="'(−' + percentOff(row) + '%)'"></span>
+        </span>
+      </div>
+      <p x-show="afterCents(row) !== null && !valid(row)" class="text-xs text-danger">{{ t(key="discount-below-regular", lang=lang | default(value='sk')) }}</p>
     </div>
-    <div class="flex items-center justify-between gap-3">
-      <span class="text-sm text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="discount-preview-after", lang=lang | default(value='sk')) }}</span>
-      <span class="text-lg font-semibold tabular-nums" :class="valid ? 'text-danger' : 'text-on-surface/40 dark:text-on-surface-dark/40'">
-        <span x-text="money(afterCents)"></span> {{ product.currency }}
-      </span>
-    </div>
-    <div x-show="valid" class="flex items-center justify-between gap-3 text-xs text-on-surface/60 dark:text-on-surface-dark/60">
-      <span>{{ t(key="discount-preview-save", lang=lang | default(value='sk')) }}</span>
-      <span class="tabular-nums"><span x-text="money(regular - afterCents)"></span> {{ product.currency }} (−<span x-text="percentOff"></span>%)</span>
-    </div>
-    <p x-show="!valid" class="text-xs text-danger">{{ t(key="discount-below-regular", lang=lang | default(value='sk')) }}</p>
-  </div>
+  </template>
 
   <div class="flex flex-wrap gap-3 pt-2">
     {{ ui::button(label=t(key="save", lang=lang | default(value='sk')), type="submit", attrs=`onclick="return confirm('` ~ t(key="discount-apply-confirm", lang=lang | default(value='sk')) ~ `')"`) }}
@@ -99,4 +97,36 @@
     {% endif %}
   </div>
 </form>
+
+<script>
+  function discountEditor(initial) {
+    return {
+      rows: (initial || []).map(r => ({
+        id: r.id,
+        label: r.label || '',
+        regular_cents: r.regular_cents,
+        regular_price: r.regular_price,
+        currency: r.currency,
+        mode: r.mode || 'fixed',
+        fixed: r.fixed || '',
+        percent: r.percent || '',
+      })),
+      num(v) { let n = parseFloat(String(v).replace(',', '.')); return isFinite(n) ? n : null; },
+      money(c) { return (c / 100).toFixed(2); },
+      afterCents(row) {
+        if (row.mode === 'percent') {
+          let p = this.num(row.percent); if (p === null) return null;
+          return row.regular_cents - Math.round(row.regular_cents * p / 100);
+        }
+        let f = this.num(row.fixed); if (f === null) return null;
+        return Math.round(f * 100);
+      },
+      valid(row) { let a = this.afterCents(row); return a !== null && a > 0 && a < row.regular_cents; },
+      percentOff(row) {
+        let a = this.afterCents(row);
+        return (a === null || row.regular_cents <= 0) ? null : Math.round((row.regular_cents - a) / row.regular_cents * 100);
+      },
+    };
+  }
+</script>
 {% endblock content %}

assets/views/admin/catalog/product_form.html

@@ -3,6 +3,9 @@
 
 {% block title %}{% if product %}{{ t(key="edit-product", lang=lang | default(value='sk')) }}{% else %}{{ t(key="new-product", lang=lang | default(value='sk')) }}{% endif %}{% endblock title %}
 {% block crumb %}{{ t(key="admin-products", lang=lang | default(value='sk')) }}{% endblock crumb %}
+{% block head %}
+<link href="/static/vendor/quill/quill.snow.css" rel="stylesheet" type="text/css">
+{% endblock head %}
 
 {% block content %}
 <div class="flex items-center justify-between gap-3">
@@ -18,9 +21,9 @@
   {{ ui::csrf_field() }}
 
   {% if product %}
-    {% set v_name = product.name %}{% set v_currency = product.currency %}{% set v_desc = product.description | default(value="") %}{% set v_pub = product.published %}
+    {% set v_name = product.name %}{% set v_currency = product.currency %}{% set v_desc = product.description | default(value="") %}{% set v_short = product.short_description | default(value="") %}{% set v_pub = product.published %}
   {% else %}
-    {% set v_name = "" %}{% set v_currency = "EUR" %}{% set v_desc = "" %}{% set v_pub = false %}
+    {% set v_name = "" %}{% set v_currency = "EUR" %}{% set v_desc = "" %}{% set v_short = "" %}{% set v_pub = false %}
   {% endif %}
   {% set inp = "w-full rounded-radius border border-outline bg-surface-alt px-3 py-2 text-sm text-on-surface focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark-alt/50 dark:text-on-surface-dark dark:focus-visible:outline-primary-dark" %}
   {% set sublabel = "text-xs font-medium text-on-surface/70 dark:text-on-surface-dark/70" %}
@@ -60,7 +63,7 @@
         {# items-end bottom-aligns every input regardless of how many lines each
            label takes, so the row stays aligned even with the "(optional)" notes. #}
         <div class="grid flex-1 grid-cols-2 gap-3 sm:grid-cols-12 sm:items-end">
-          <div class="space-y-1 col-span-2 sm:col-span-4">
+          <div class="space-y-1 col-span-2 sm:col-span-6">
             <label class="{{ sublabel }} block truncate">{{ t(key="option-label", lang=lang | default(value='sk')) }}{{ opt }}</label>
             <input :name="`variants[${i}][label]`" x-model="row.label" class="{{ inp }}" placeholder="napr. 10cm x 13cm">
           </div>
@@ -76,10 +79,6 @@
             <label class="{{ sublabel }} block truncate">{{ t(key="price", lang=lang | default(value='sk')) }}</label>
             <input :name="`variants[${i}][price]`" x-model="row.price" inputmode="decimal" required class="{{ inp }}" placeholder="0.00">
           </div>
-          <div class="space-y-1 sm:col-span-2">
-            <label class="{{ sublabel }} block truncate">{{ t(key="business-price", lang=lang | default(value='sk')) }}{{ opt }}</label>
-            <input :name="`variants[${i}][business_sale]`" x-model="row.business_sale" inputmode="decimal" class="{{ inp }}" placeholder="—">
-          </div>
         </div>
 
         <button type="button" @click="remove(i)"
@@ -90,7 +89,7 @@
 
   <script>
     function variantEditor(initial) {
-      const blank = () => ({ id: '', label: '', sku: '', stock: '', price: '', business_sale: '' });
+      const blank = () => ({ id: '', label: '', sku: '', stock: '', price: '' });
       return {
         rows: (initial || []).map(r => ({
           id: r.id || '',
@@ -98,7 +97,6 @@
           sku: r.sku || '',
           stock: (r.stock === null || r.stock === undefined) ? '' : r.stock,
           price: r.price || '',
-          business_sale: r.business_sale || '',
         })),
         init() { if (this.rows.length === 0) this.add(); },
         add() { this.rows.push(blank()); },
@@ -122,8 +120,14 @@
   </div>
 
   <div class="space-y-1.5">
-    <label for="description" class="text-sm font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="description", lang=lang | default(value='sk')) }}</label>
-    {{ ui::textarea(name="description", id="description", rows="5", value=v_desc) }}
+    <span class="text-sm font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="short-description", lang=lang | default(value='sk')) }}</span>
+    <p class="{{ sublabel }}">{{ t(key="short-description-hint", lang=lang | default(value='sk')) }}</p>
+    {{ ui::rich_editor(name="short_description", lang=lang | default(value='sk'), value=v_short, min_height="6rem") }}
+  </div>
+
+  <div class="space-y-1.5">
+    <span class="text-sm font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="description", lang=lang | default(value='sk')) }}</span>
+    {{ ui::rich_editor(name="description", lang=lang | default(value='sk'), value=v_desc, min_height="16rem") }}
   </div>
 
   {# --- Images gallery ------------------------------------------------------- #}
@@ -215,4 +219,6 @@
     {{ ui::button(variant="outline-secondary", label=t(key="cancel", lang=lang | default(value='sk')), href="/admin/catalog/products") }}
   </div>
 </form>
+<script src="/static/vendor/quill/quill.js"></script>
+<script src="/static/js/rich-editor.js"></script>
 {% endblock content %}

assets/views/admin/catalog/products.html

@@ -7,6 +7,8 @@
 
 {% block content %}
 {% set business = audience == "business" %}
+{% set L = lang | default(value='sk') %}
+{% set q_enc = query | default(value='') | urlencode %}
 <div class="flex flex-wrap items-end justify-between gap-3">
   <div>
     <h1 class="text-2xl font-bold text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="admin-products", lang=lang | default(value='sk')) }}</h1>
@@ -15,20 +17,34 @@
   {{ ui::button(label=t(key="new-product", lang=lang | default(value='sk')), href="/admin/catalog/products/new") }}
 </div>
 
-<!-- audience tabs -->
-<div class="mt-4 inline-flex rounded-radius border border-outline p-1 dark:border-outline-dark">
-  <a href="/admin/catalog/products?audience=personal"
-    class="rounded-radius px-4 py-1.5 text-sm font-medium {% if not business %}bg-primary/10 text-on-surface-strong dark:bg-primary-dark/10 dark:text-on-surface-dark-strong{% else %}text-on-surface/70 dark:text-on-surface-dark/70{% endif %}">
-    {{ t(key="audience-personal", lang=lang | default(value='sk')) }}
-  </a>
-  <a href="/admin/catalog/products?audience=business"
-    class="rounded-radius px-4 py-1.5 text-sm font-medium {% if business %}bg-primary/10 text-on-surface-strong dark:bg-primary-dark/10 dark:text-on-surface-dark-strong{% else %}text-on-surface/70 dark:text-on-surface-dark/70{% endif %}">
-    {{ t(key="audience-business", lang=lang | default(value='sk')) }}
-  </a>
+<div class="mt-4 flex flex-wrap items-center justify-between gap-3">
+  <!-- audience tabs -->
+  <div class="inline-flex rounded-radius border border-outline p-1 dark:border-outline-dark">
+    <a href="/admin/catalog/products?audience=personal&q={{ q_enc }}"
+      class="rounded-radius px-4 py-1.5 text-sm font-medium {% if not business %}bg-primary/10 text-on-surface-strong dark:bg-primary-dark/10 dark:text-on-surface-dark-strong{% else %}text-on-surface/70 dark:text-on-surface-dark/70{% endif %}">
+      {{ t(key="audience-personal", lang=L) }}
+    </a>
+    <a href="/admin/catalog/products?audience=business&q={{ q_enc }}"
+      class="rounded-radius px-4 py-1.5 text-sm font-medium {% if business %}bg-primary/10 text-on-surface-strong dark:bg-primary-dark/10 dark:text-on-surface-dark-strong{% else %}text-on-surface/70 dark:text-on-surface-dark/70{% endif %}">
+      {{ t(key="audience-business", lang=L) }}
+    </a>
+  </div>
+
+  <!-- product search (drafts included); keeps the active audience + category -->
+  <form method="get" action="/admin/catalog/products" role="search" class="relative w-full max-w-xs">
+    <input type="hidden" name="audience" value="{{ audience }}">
+    <input type="hidden" name="category" value="{{ selected_category }}">
+    <span class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3 text-on-surface/50 dark:text-on-surface-dark/50">
+      {{ ui::icon(name="search", size="size-5") }}
+    </span>
+    <input type="search" name="q" value="{{ query | default(value='') }}" autocomplete="off"
+      placeholder="{{ t(key='search-placeholder', lang=L) }}" aria-label="{{ t(key='search-placeholder', lang=L) }}"
+      class="w-full rounded-radius border border-outline bg-surface py-2 pl-10 pr-3 text-sm text-on-surface placeholder:text-on-surface/50 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark-alt dark:text-on-surface-dark dark:placeholder:text-on-surface-dark/50 dark:focus-visible:outline-primary-dark">
+  </form>
 </div>
 
 {% set category_base = "/admin/catalog/products" %}
-{% set category_suffix = "&audience=" ~ audience %}
+{% set category_suffix = "&audience=" ~ audience ~ "&q=" ~ q_enc %}
 <div class="mt-4 flex flex-col gap-6 md:flex-row md:items-start">
   {% include "admin/partials/category_filter.html" %}
 
@@ -122,6 +138,14 @@
         <td class="px-4 py-3">
           <div class="flex flex-wrap justify-end gap-2">
             {{ ui::button(variant="outline-secondary", label=t(key="edit", lang=lang | default(value='sk')), href="/admin/catalog/products/" ~ product.id ~ "/edit", size="px-3 py-1.5 text-xs") }}
+            {{ ui::button(variant="outline-secondary", label=t(key="set-discount", lang=lang | default(value='sk')), href="/admin/catalog/products/" ~ product.id ~ "/discount/edit?audience=" ~ audience, size="px-3 py-1.5 text-xs") }}
+            {% if product.on_sale %}
+            <form method="post" action="/admin/catalog/products/{{ product.id }}/discount/remove?audience={{ audience }}"
+              onsubmit="return confirm('{{ t(key="discount-remove-confirm", lang=lang | default(value='sk')) }}')">
+              {{ ui::csrf_field() }}
+              {{ ui::button(variant="outline-danger", label=t(key="remove-discount", lang=lang | default(value='sk')), type="submit", size="px-3 py-1.5 text-xs") }}
+            </form>
+            {% endif %}
             {{ ui::button(variant="outline-secondary", label=t(key="view", lang=lang | default(value='sk')), href="/shop/" ~ product.slug, size="px-3 py-1.5 text-xs") }}
             <form method="post" action="/admin/catalog/products/{{ product.id }}/delete"
               onsubmit="return confirm('{{ t(key="confirm-delete", lang=lang | default(value='sk')) }}')">

assets/views/admin/customers/show.html

@@ -5,6 +5,8 @@
 {% block crumb %}{{ t(key="admin-customers", lang=lang | default(value='sk')) }}{% endblock crumb %}
 
 {% block content %}
+{% set L = lang | default(value='sk') %}
+{% set q_enc = query | default(value='') | urlencode %}
 <div class="flex items-center justify-between gap-3">
   <div>
     <h1 class="text-2xl font-bold text-on-surface-strong dark:text-on-surface-dark-strong">{{ customer.name }}</h1>
@@ -41,10 +43,23 @@
   {% endif %}
 </section>
 
-<p class="mt-6 text-sm text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="negotiated-prices-hint", lang=lang | default(value='sk')) }}</p>
+<div class="mt-6 flex flex-wrap items-center justify-between gap-3">
+  <p class="text-sm text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="negotiated-prices-hint", lang=L) }}</p>
+
+  <!-- product search (drafts included); keeps the active category -->
+  <form method="get" action="/admin/customers/{{ customer.id }}" role="search" class="relative w-full max-w-xs">
+    <input type="hidden" name="category" value="{{ selected_category }}">
+    <span class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3 text-on-surface/50 dark:text-on-surface-dark/50">
+      {{ ui::icon(name="search", size="size-5") }}
+    </span>
+    <input type="search" name="q" value="{{ query | default(value='') }}" autocomplete="off"
+      placeholder="{{ t(key='search-placeholder', lang=L) }}" aria-label="{{ t(key='search-placeholder', lang=L) }}"
+      class="w-full rounded-radius border border-outline bg-surface py-2 pl-10 pr-3 text-sm text-on-surface placeholder:text-on-surface/50 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark-alt dark:text-on-surface-dark dark:placeholder:text-on-surface-dark/50 dark:focus-visible:outline-primary-dark">
+  </form>
+</div>
 
 {% set category_base = "/admin/customers/" ~ customer.id %}
-{% set category_suffix = "" %}
+{% set category_suffix = "&q=" ~ q_enc %}
 <div class="mt-3 flex flex-col gap-6 md:flex-row md:items-start">
   {% include "admin/partials/category_filter.html" %}
   <div class="min-w-0 flex-1 {{ ui::table_wrap_cls() }}">

assets/views/admin/orders/index.html

@@ -5,7 +5,24 @@
 {% block crumb %}{{ t(key="admin-orders", lang=lang | default(value='sk')) }}{% endblock crumb %}
 
 {% block content %}
-<h1 class="text-2xl font-bold text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="admin-orders", lang=lang | default(value='sk')) }}</h1>
+{% set L = lang | default(value='sk') %}
+<div class="flex flex-wrap items-center justify-between gap-3">
+  <h1 class="text-2xl font-bold text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="admin-orders", lang=L) }}</h1>
+
+  <!-- order search: order number, customer, email, company, phone, tracking -->
+  <form method="get" action="/admin/orders" role="search" class="relative w-full max-w-xs">
+    <span class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3 text-on-surface/50 dark:text-on-surface-dark/50">
+      {{ ui::icon(name="search", size="size-5") }}
+    </span>
+    <input type="search" name="q" value="{{ query | default(value='') }}" autocomplete="off"
+      placeholder="{{ t(key='order-search-placeholder', lang=L) }}" aria-label="{{ t(key='order-search-placeholder', lang=L) }}"
+      class="w-full rounded-radius border border-outline bg-surface py-2 pl-10 pr-3 text-sm text-on-surface placeholder:text-on-surface/50 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark-alt dark:text-on-surface-dark dark:placeholder:text-on-surface-dark/50 dark:focus-visible:outline-primary-dark">
+  </form>
+</div>
+
+{% if query and query != "" %}
+<p class="mt-2 text-sm text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="results-count", lang=L, count=total) }} · “{{ query }}”</p>
+{% endif %}
 
 <div class="mt-6 {{ ui::table_wrap_cls() }}">
   {% if orders | length > 0 %}

assets/views/home/index.html

@@ -19,7 +19,7 @@
       <h2 class="text-2xl font-bold text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="shop-title", lang=lang | default(value='sk')) }}</h2>
       <a href="/shop" class="text-sm font-medium text-primary dark:text-primary-dark">{{ t(key="cart-continue", lang=lang | default(value='sk')) }} →</a>
     </div>
-    <div class="grid grid-cols-2 gap-5 sm:grid-cols-3 lg:grid-cols-4">
+    <div x-data="{ view: 'grid' }" class="grid grid-cols-2 gap-5 sm:grid-cols-3 lg:grid-cols-4">
       {% for product in products %}
       {% include "shop/_card.html" %}
       {% endfor %}

assets/views/macros/ui.html

@@ -153,6 +153,34 @@
 <textarea {% if id %}id="{{ id }}" {% endif %}name="{{ name }}" rows="{{ rows }}"{% if placeholder %} placeholder="{{ placeholder }}"{% endif %}{% if required %} required{% endif %} class="w-full rounded-radius border border-outline bg-surface-alt px-2.5 py-2 text-sm text-on-surface focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary disabled:cursor-not-allowed disabled:opacity-75 dark:border-outline-dark dark:bg-surface-dark-alt/50 dark:text-on-surface-dark dark:focus-visible:outline-primary-dark {{ extra }}" {{ attrs | safe }}>{{ value }}</textarea>
 {%- endmacro textarea %}
 
+{# Quill rich-text editor (see /static/js/rich-editor.js + /static/vendor/quill).
+   The real value rides in a hidden <textarea> the editor keeps in sync, so it
+   submits like any other field. `value` pre-fills (HTML or plain text). Several
+   editors may share one form — each is scoped to its own [data-rich-field].
+   Requires the page to load quill.js + quill.snow.css + rich-editor.js (the
+   product form does so) and a _csrf field in the form for image uploads. #}
+{% macro rich_editor(name, lang, value="", placeholder="", min_height="12rem") -%}
+<div data-rich-field>
+  <textarea name="{{ name }}" data-rich-content class="hidden">{{ value }}</textarea>
+  <div data-rich-editor class="rich-editor" style="--rich-min-height: {{ min_height }};"{% if placeholder %} data-placeholder="{{ placeholder }}"{% endif %}></div>
+  <div data-image-size-controls class="rich-image-size-controls mt-2 hidden">
+    <span class="text-xs font-medium text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="image-size", lang=lang) }}</span>
+    <button type="button" data-image-size="small">{{ t(key="image-size-small", lang=lang) }}</button>
+    <button type="button" data-image-size="medium">{{ t(key="image-size-medium", lang=lang) }}</button>
+    <button type="button" data-image-size="full">{{ t(key="image-size-full", lang=lang) }}</button>
+    <label class="inline-flex items-center gap-1.5">
+      <span class="text-xs text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="image-width-px", lang=lang) }}</span>
+      <input type="number" min="40" max="1200" step="10" data-image-width
+        class="w-20 rounded-radius border border-outline bg-surface-alt px-2 py-1 text-sm text-on-surface dark:border-outline-dark dark:bg-surface-dark-alt/50 dark:text-on-surface-dark">
+    </label>
+  </div>
+  <p class="mt-1 text-xs text-on-surface/60 dark:text-on-surface-dark/60" data-rich-status
+    data-uploading="{{ t(key='image-uploading', lang=lang) }}"
+    data-uploaded="{{ t(key='image-uploaded', lang=lang) }}"
+    data-error="{{ t(key='image-upload-error', lang=lang) }}"></p>
+</div>
+{%- endmacro rich_editor %}
+
 {# File input. #}
 {% macro file_input(name, id="", accept="", attrs="", extra="") -%}
 <input {% if id %}id="{{ id }}" {% endif %}name="{{ name }}" type="file"{% if accept %} accept="{{ accept }}"{% endif %} class="w-full overflow-clip rounded-radius border border-outline bg-surface-alt/50 text-sm text-on-surface file:mr-4 file:border-none file:bg-surface-alt file:px-4 file:py-2 file:font-medium file:text-on-surface-strong focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary disabled:cursor-not-allowed disabled:opacity-75 dark:border-outline-dark dark:bg-surface-dark-alt/50 dark:text-on-surface-dark dark:file:bg-surface-dark-alt dark:file:text-on-surface-dark-strong dark:focus-visible:outline-primary-dark {{ extra }}" {{ attrs | safe }}/>

assets/views/shop/_card.html

@@ -27,6 +27,15 @@
       :class="view === 'list' ? 'p-4 sm:p-5' : 'p-6 pb-2'">
       <!-- Header: Title & Price (stacked so neither overflows the narrow card) -->
       <h3 class="break-words text-lg font-bold text-on-surface-strong dark:text-on-surface-dark-strong">{{ product.name }}</h3>
+      {# Short blurb for the card; falls back to the full description (clamped)
+         for products without a dedicated short one. Both are authored as rich
+         text (Quill), so render the stored HTML — `.rich-blurb` strips block
+         spacing so the line-clamp stays tidy. Overflow is truncated with an
+         ellipsis: 2 lines in the grid, 3 in the roomier list row. #}
+      {% if product.short_description or product.description %}
+      <div class="rich-blurb line-clamp-2 break-words text-sm text-on-surface/70 dark:text-on-surface-dark/70"
+        :class="view === 'list' && 'line-clamp-3'">{% if product.short_description %}{{ product.short_description | safe }}{% else %}{{ product.description | safe }}{% endif %}</div>
+      {% endif %}
       {% if product.on_sale %}
       <div class="flex flex-wrap items-baseline gap-x-2 leading-tight">
         <span class="text-xl font-semibold text-danger"><span class="sr-only">Price</span>{% if product.has_options %}{{ t(key="from-price", price=product.price, lang=lang | default(value='sk')) }}{% else %}{{ product.price }}{% endif %} {{ product.currency }}</span>

assets/views/shop/_results.html

@@ -1,13 +1,46 @@
-{# Search / listing results, swapped in by htmx on each query and rendered
-   server-side on first load. Mirrors the empty-state handling of index.html. #}
-{% if products | length > 0 %}
-{% include "shop/_product_grid.html" %}
-{% elif query and query != "" %}
-<div class="rounded-radius border border-outline px-6 py-16 text-center text-on-surface/70 dark:border-outline-dark dark:text-on-surface-dark/70">
-  {{ t(key="search-empty", lang=lang | default(value='sk')) }} <span class="font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ query }}</span>
+{# Results region: swapped in by htmx on each query/filter change and rendered
+   server-side on first load. Holds the result summary, the product grid and
+   pagination. #}
+{% set L = lang | default(value='sk') %}
+<div class="space-y-4">
+  <p class="text-sm text-on-surface/70 dark:text-on-surface-dark/70" aria-live="polite">
+    {{ t(key="results-count", lang=L, count=total) }}{% if query and query != "" %} · “{{ query }}”{% endif %}
+  </p>
+
+  {% if products | length > 0 %}
+  {% include "shop/_product_grid.html" %}
+
+  {% if pages > 1 %}
+  <nav class="flex items-center justify-center gap-2 pt-2" aria-label="{{ t(key='pagination', lang=L) }}">
+    {% if has_prev %}
+    <button type="button"
+      hx-get="/search?{% if query_base %}{{ query_base }}&{% endif %}page={{ prev_page }}"
+      hx-target="#shop-results" hx-swap="innerHTML" hx-push-url="true"
+      class="rounded-radius border border-outline px-3 py-1.5 text-sm font-medium text-on-surface transition hover:bg-primary/5 hover:text-primary dark:border-outline-dark dark:text-on-surface-dark dark:hover:text-primary-dark">
+      {{ t(key="prev", lang=L) }}
+    </button>
+    {% endif %}
+    <span class="px-2 text-sm text-on-surface/70 dark:text-on-surface-dark/70">
+      {{ t(key="page-of", lang=L, page=page, pages=pages) }}
+    </span>
+    {% if has_next %}
+    <button type="button"
+      hx-get="/search?{% if query_base %}{{ query_base }}&{% endif %}page={{ next_page }}"
+      hx-target="#shop-results" hx-swap="innerHTML" hx-push-url="true"
+      class="rounded-radius border border-outline px-3 py-1.5 text-sm font-medium text-on-surface transition hover:bg-primary/5 hover:text-primary dark:border-outline-dark dark:text-on-surface-dark dark:hover:text-primary-dark">
+      {{ t(key="next", lang=L) }}
+    </button>
+    {% endif %}
+  </nav>
+  {% endif %}
+
+  {% elif query and query != "" %}
+  <div class="rounded-radius border border-outline px-6 py-16 text-center text-on-surface/70 dark:border-outline-dark dark:text-on-surface-dark/70">
+    {{ t(key="search-empty", lang=L) }} <span class="font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ query }}</span>
+  </div>
+  {% else %}
+  <div class="rounded-radius border border-outline px-6 py-16 text-center text-on-surface/70 dark:border-outline-dark dark:text-on-surface-dark/70">
+    {{ t(key="shop-empty", lang=L) }}
+  </div>
+  {% endif %}
 </div>
-{% else %}
-<div class="rounded-radius border border-outline px-6 py-16 text-center text-on-surface/70 dark:border-outline-dark dark:text-on-surface-dark/70">
-  {{ t(key="shop-empty", lang=lang | default(value='sk')) }}
-</div>
-{% endif %}

assets/views/shop/_search.html

@@ -0,0 +1,102 @@
+{# Shared storefront search + filter toolbar and results region, used by the shop
+   index and every category page. One form drives the whole listing: htmx re-runs
+   /search and swaps only #shop-results; the toolbar keeps its own DOM state.
+   Triggers: live (debounced) typing in the search box, immediate on any
+   select/checkbox change, and submit (Enter / Apply) for the price band. Degrades
+   to a plain GET form without JS.
+   Expects: query, category_groups, selected_category, selected_category_id,
+   uncategorized_count, sort, min_price, max_price, price_floor, price_ceil,
+   in_stock, plus the result vars consumed by _results.html. #}
+{% set L = lang | default(value='sk') %}
+<div class="space-y-6">
+  <form action="/search" method="get" role="search"
+    hx-get="/search" hx-target="#shop-results" hx-swap="innerHTML"
+    hx-push-url="true" hx-indicator="#search-spinner"
+    hx-trigger="submit, change, keyup changed delay:350ms from:input[name='q']"
+    class="space-y-3">
+
+    <!-- search box -->
+    <div class="relative max-w-xl">
+      <span class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3 text-on-surface/50 dark:text-on-surface-dark/50">
+        {{ ui::icon(name="search", size="size-5") }}
+      </span>
+      <input type="search" name="q" value="{{ query | default(value='') }}" autocomplete="off"
+        placeholder="{{ t(key='search-placeholder', lang=L) }}"
+        aria-label="{{ t(key='search-placeholder', lang=L) }}"
+        class="w-full rounded-radius border border-outline bg-surface py-2 pl-10 pr-10 text-sm text-on-surface placeholder:text-on-surface/50 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark-alt dark:text-on-surface-dark dark:placeholder:text-on-surface-dark/50 dark:focus-visible:outline-primary-dark" />
+      <span id="search-spinner" class="htmx-indicator pointer-events-none absolute inset-y-0 right-0 flex items-center pr-3 text-on-surface/50 dark:text-on-surface-dark/50">
+        <svg class="size-4 animate-spin" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" aria-hidden="true">
+          <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
+          <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 0 1 8-8V0C5.4 0 0 5.4 0 12h4Z"></path>
+        </svg>
+      </span>
+    </div>
+
+    <!-- filter toolbar -->
+    <div class="flex flex-wrap items-end gap-3 rounded-radius border border-outline bg-surface-alt p-3 dark:border-outline-dark dark:bg-surface-dark-alt">
+      <!-- category -->
+      <label class="flex flex-col gap-1 text-xs font-medium text-on-surface/70 dark:text-on-surface-dark/70">
+        {{ t(key="filter-category", lang=L) }}
+        <select name="category"
+          class="rounded-radius border border-outline bg-surface px-2 py-1.5 text-sm text-on-surface focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark dark:text-on-surface-dark">
+          <option value="all"{% if selected_category == "all" %} selected{% endif %}>{{ t(key="filter-all-categories", lang=L) }}</option>
+          {% for g in category_groups %}
+          <option value="{{ g.id }}"{% if selected_category_id == g.id %} selected{% endif %}>{{ g.name }} ({{ g.count }})</option>
+          {% for ch in g.children %}
+          <option value="{{ ch.id }}"{% if selected_category_id == ch.id %} selected{% endif %}>&nbsp;&nbsp;— {{ ch.name }} ({{ ch.count }})</option>
+          {% endfor %}
+          {% endfor %}
+          {% if uncategorized_count > 0 %}
+          <option value="none"{% if selected_category == "none" %} selected{% endif %}>{{ t(key="filter-uncategorized", lang=L) }} ({{ uncategorized_count }})</option>
+          {% endif %}
+        </select>
+      </label>
+
+      <!-- sort -->
+      <label class="flex flex-col gap-1 text-xs font-medium text-on-surface/70 dark:text-on-surface-dark/70">
+        {{ t(key="sort-label", lang=L) }}
+        <select name="sort"
+          class="rounded-radius border border-outline bg-surface px-2 py-1.5 text-sm text-on-surface focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark dark:text-on-surface-dark">
+          {% for opt in ["newest", "relevance", "price_asc", "price_desc", "name_asc", "name_desc"] %}
+          <option value="{{ opt }}"{% if sort == opt %} selected{% endif %}>{{ t(key="sort-" ~ opt, lang=L) }}</option>
+          {% endfor %}
+        </select>
+      </label>
+
+      <!-- price band -->
+      <label class="flex flex-col gap-1 text-xs font-medium text-on-surface/70 dark:text-on-surface-dark/70">
+        {{ t(key="filter-price", lang=L) }}
+        <span class="flex items-center gap-1">
+          <input type="number" name="min_price" min="0" step="0.01" inputmode="decimal"
+            value="{{ min_price | default(value='') }}" placeholder="{{ price_floor }}"
+            aria-label="{{ t(key='filter-price-from', lang=L) }}"
+            class="w-24 rounded-radius border border-outline bg-surface px-2 py-1.5 text-sm text-on-surface dark:border-outline-dark dark:bg-surface-dark dark:text-on-surface-dark" />
+          <span class="text-on-surface/50 dark:text-on-surface-dark/50">–</span>
+          <input type="number" name="max_price" min="0" step="0.01" inputmode="decimal"
+            value="{{ max_price | default(value='') }}" placeholder="{{ price_ceil }}"
+            aria-label="{{ t(key='filter-price-to', lang=L) }}"
+            class="w-24 rounded-radius border border-outline bg-surface px-2 py-1.5 text-sm text-on-surface dark:border-outline-dark dark:bg-surface-dark dark:text-on-surface-dark" />
+        </span>
+      </label>
+
+      <!-- in stock -->
+      <label class="flex items-center gap-2 pb-1.5 text-sm text-on-surface dark:text-on-surface-dark">
+        <input type="checkbox" name="in_stock" value="1"{% if in_stock %} checked{% endif %}
+          class="size-4 rounded border-outline text-primary focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:text-primary-dark" />
+        {{ t(key="filter-in-stock", lang=L) }}
+      </label>
+
+      <div class="ml-auto flex items-end gap-2">
+        {{ ui::button(label=t(key="filter-apply", lang=L), type="submit", variant="secondary") }}
+        <a href="/shop" hx-get="/search" hx-target="#shop-results" hx-push-url="true"
+          class="self-end pb-1.5 text-sm font-medium text-on-surface/70 underline-offset-2 transition hover:text-primary hover:underline dark:text-on-surface-dark/70 dark:hover:text-primary-dark">
+          {{ t(key="filter-clear", lang=L) }}
+        </a>
+      </div>
+    </div>
+  </form>
+
+  <div id="shop-results">
+    {% include "shop/_results.html" %}
+  </div>
+</div>

assets/views/shop/category.html

@@ -4,10 +4,11 @@
 {% block title %}{{ category.name }}{% endblock title %}
 
 {% block content %}
-<div class="space-y-8">
+{% set L = lang | default(value='sk') %}
+<div class="space-y-6">
   <header class="space-y-2">
     <nav class="text-sm text-on-surface/60 dark:text-on-surface-dark/60">
-      <a href="/shop" class="hover:text-primary dark:hover:text-primary-dark">{{ t(key="nav-shop", lang=lang | default(value='sk')) }}</a>
+      <a href="/shop" class="hover:text-primary dark:hover:text-primary-dark">{{ t(key="nav-shop", lang=L) }}</a>
       {% for crumb in breadcrumbs %}
       <span class="px-1">/</span>
       <a href="/category/{{ crumb.slug }}" class="hover:text-primary dark:hover:text-primary-dark">{{ crumb.name }}</a>
@@ -28,12 +29,7 @@
     {% endif %}
   </header>
 
-  {% if products | length > 0 %}
-  {% include "shop/_product_grid.html" %}
-  {% else %}
-  <div class="rounded-radius border border-outline px-6 py-16 text-center text-on-surface/70 dark:border-outline-dark dark:text-on-surface-dark/70">
-    {{ t(key="shop-empty", lang=lang | default(value='sk')) }}
-  </div>
-  {% endif %}
+  {# Same search + filters as the shop, with this category preselected. #}
+  {% include "shop/_search.html" %}
 </div>
 {% endblock content %}

assets/views/shop/index.html

@@ -4,42 +4,13 @@
 {% block title %}{{ t(key="nav-shop", lang=lang | default(value='sk')) }}{% endblock title %}
 
 {% block content %}
-<div class="space-y-8">
-  <header class="space-y-4">
-    <div class="space-y-2">
-      <h1 class="text-3xl font-bold text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="shop-title", lang=lang | default(value='sk')) }}</h1>
-      <p class="text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="shop-subtitle", lang=lang | default(value='sk')) }}</p>
-    </div>
-
-    {# Live search: htmx GETs /search as the customer types (debounced) and
-       swaps only the results below. hx-push-url keeps the URL shareable; the
-       spinner shows while a request is in flight. Degrades to a normal GET form
-       submit when JS/htmx is unavailable. #}
-    <form action="/search" method="get" role="search"
-      class="relative max-w-md"
-      hx-get="/search" hx-target="#shop-results" hx-swap="innerHTML"
-      hx-trigger="input changed delay:300ms from:input[name='q'], submit"
-      hx-push-url="true" hx-indicator="#search-spinner">
-      <span class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3 text-on-surface/50 dark:text-on-surface-dark/50">
-        {{ ui::icon(name="search", size="size-5") }}
-      </span>
-      <input type="search" name="q" value="{{ query | default(value='') }}"
-        autocomplete="off"
-        placeholder="{{ t(key='search-placeholder', lang=lang | default(value='sk')) }}"
-        aria-label="{{ t(key='search-placeholder', lang=lang | default(value='sk')) }}"
-        class="w-full rounded-radius border border-outline bg-surface py-2 pl-10 pr-10 text-sm text-on-surface placeholder:text-on-surface/50 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark-alt dark:text-on-surface-dark dark:placeholder:text-on-surface-dark/50 dark:focus-visible:outline-primary-dark" />
-      <span id="search-spinner"
-        class="htmx-indicator pointer-events-none absolute inset-y-0 right-0 flex items-center pr-3 text-on-surface/50 dark:text-on-surface-dark/50">
-        <svg class="size-4 animate-spin" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" aria-hidden="true">
-          <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
-          <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 0 1 8-8V0C5.4 0 0 5.4 0 12h4Z"></path>
-        </svg>
-      </span>
-    </form>
+{% set L = lang | default(value='sk') %}
+<div class="space-y-6">
+  <header class="space-y-1">
+    <h1 class="text-3xl font-bold text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="shop-title", lang=L) }}</h1>
+    <p class="text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="shop-subtitle", lang=L) }}</p>
   </header>
 
-  <div id="shop-results">
-    {% include "shop/_results.html" %}
-  </div>
+  {% include "shop/_search.html" %}
 </div>
 {% endblock content %}

assets/views/shop/show.html

@@ -83,7 +83,8 @@
         </div>
 
         {% if product.description %}
-        <div class="whitespace-pre-line leading-relaxed text-on-surface/80 dark:text-on-surface-dark/80">{{ product.description }}</div>
+        {# Authored as rich text (Quill) in the admin; render the stored HTML. #}
+        <div class="rich-content text-on-surface/80 dark:text-on-surface-dark/80">{{ product.description | safe }}</div>
         {% endif %}
 
         <template x-if="current.in_stock">

migration/src/lib.rs

@@ -44,6 +44,9 @@ mod m20260622_000002_product_variants;
 mod m20260622_000003_variant_stock_nullable;
 mod m20260622_000004_product_search;
 mod m20260622_000005_product_search_aggregate;
+mod m20260622_000006_order_search_indexes;
+mod m20260623_000001_add_short_description_to_products;
+mod m20260623_000002_strip_html_from_product_search;
 pub struct Migrator;
 
 #[async_trait::async_trait]
@@ -92,6 +95,9 @@ impl MigratorTrait for Migrator {
             Box::new(m20260622_000003_variant_stock_nullable::Migration),
             Box::new(m20260622_000004_product_search::Migration),
             Box::new(m20260622_000005_product_search_aggregate::Migration),
+            Box::new(m20260622_000006_order_search_indexes::Migration),
+            Box::new(m20260623_000001_add_short_description_to_products::Migration),
+            Box::new(m20260623_000002_strip_html_from_product_search::Migration),
             // inject-above (do not remove this comment)
         ]
     }

migration/src/m20260622_000006_order_search_indexes.rs

@@ -0,0 +1,48 @@
+//! Trigram indexes so the admin order search stays fast as orders pile up.
+//!
+//! Order search is a plain substring (`ILIKE`) match over the high-signal,
+//! free-text order fields — order number, email, customer/company name — run
+//! through `f_unaccent` so diacritics and case never matter (see
+//! `orders::Entity::search`). These `pg_trgm` GIN indexes let those `ILIKE`
+//! lookups use an index instead of scanning every row. `pg_trgm` + `f_unaccent`
+//! already exist from the product-search migration.
+
+use sea_orm_migration::prelude::*;
+
+#[derive(DeriveMigrationName)]
+pub struct Migration;
+
+#[async_trait::async_trait]
+impl MigrationTrait for Migration {
+    async fn up(&self, m: &SchemaManager) -> Result<(), DbErr> {
+        m.get_connection()
+            .execute_unprepared(
+                r#"
+                CREATE INDEX idx_orders_number_trgm
+                    ON orders USING GIN (f_unaccent(order_number) gin_trgm_ops);
+                CREATE INDEX idx_orders_email_trgm
+                    ON orders USING GIN (f_unaccent(email) gin_trgm_ops);
+                CREATE INDEX idx_orders_customer_name_trgm
+                    ON orders USING GIN (f_unaccent(COALESCE(customer_name, '')) gin_trgm_ops);
+                CREATE INDEX idx_orders_company_name_trgm
+                    ON orders USING GIN (f_unaccent(COALESCE(company_name, '')) gin_trgm_ops);
+                "#,
+            )
+            .await?;
+        Ok(())
+    }
+
+    async fn down(&self, m: &SchemaManager) -> Result<(), DbErr> {
+        m.get_connection()
+            .execute_unprepared(
+                r#"
+                DROP INDEX IF EXISTS idx_orders_company_name_trgm;
+                DROP INDEX IF EXISTS idx_orders_customer_name_trgm;
+                DROP INDEX IF EXISTS idx_orders_email_trgm;
+                DROP INDEX IF EXISTS idx_orders_number_trgm;
+                "#,
+            )
+            .await?;
+        Ok(())
+    }
+}

migration/src/m20260623_000001_add_short_description_to_products.rs

@@ -0,0 +1,18 @@
+use loco_rs::schema::*;
+use sea_orm_migration::prelude::*;
+
+#[derive(DeriveMigrationName)]
+pub struct Migration;
+
+#[async_trait::async_trait]
+impl MigrationTrait for Migration {
+    async fn up(&self, m: &SchemaManager) -> Result<(), DbErr> {
+        // A short blurb shown on product cards (grid/list), distinct from the full
+        // `description` rendered on the product detail page.
+        add_column(m, "products", "short_description", ColType::TextNull).await
+    }
+
+    async fn down(&self, m: &SchemaManager) -> Result<(), DbErr> {
+        remove_column(m, "products", "short_description").await
+    }
+}

migration/src/m20260623_000002_strip_html_from_product_search.rs

@@ -0,0 +1,94 @@
+//! Product descriptions are now authored as rich text (Quill) and stored as
+//! HTML. The product search vector (see m20260622_000005) tokenizes the raw
+//! description, so without this the markup itself (`p`, `strong`, `li`, `href`,
+//! `class`, `ql`, …) would land in the index and pollute matches.
+//!
+//! Redefine `kompress_build_product_search` so the description is run through a
+//! tag-stripping `regexp_replace` before `to_tsvector`, then backfill every
+//! product's stored vector. Everything else about the function is unchanged.
+
+use sea_orm_migration::prelude::*;
+
+#[derive(DeriveMigrationName)]
+pub struct Migration;
+
+#[async_trait::async_trait]
+impl MigrationTrait for Migration {
+    async fn up(&self, m: &SchemaManager) -> Result<(), DbErr> {
+        let db = m.get_connection();
+        db.execute_unprepared(
+            r#"
+            CREATE OR REPLACE FUNCTION kompress_build_product_search(
+                p_name text, p_description text, p_id integer
+            ) RETURNS tsvector
+            LANGUAGE sql STABLE AS $func$
+                SELECT
+                    setweight(to_tsvector('sk_unaccent', COALESCE(p_name, '')), 'A')
+                  || setweight(to_tsvector('sk_unaccent', COALESCE((
+                        SELECT string_agg(t.name, ' ')
+                        FROM product_product_tags ppt
+                        JOIN product_tags t ON t.id = ppt.product_tag_id
+                        WHERE ppt.product_id = p_id
+                     ), '')), 'B')
+                  || setweight(to_tsvector('sk_unaccent', COALESCE((
+                        SELECT string_agg(v.label, ' ')
+                        FROM product_variants v
+                        WHERE v.product_id = p_id
+                     ), '')), 'B')
+                  || setweight(to_tsvector('sk_unaccent',
+                        regexp_replace(COALESCE(p_description, ''), '<[^>]+>', ' ', 'g')
+                     ), 'C')
+                  || setweight(to_tsvector('sk_unaccent', COALESCE((
+                        SELECT string_agg(v.sku, ' ')
+                        FROM product_variants v
+                        WHERE v.product_id = p_id AND v.sku IS NOT NULL
+                     ), '')), 'C');
+            $func$;
+
+            -- Backfill: recompute every product's vector with the new definition.
+            UPDATE products
+               SET search_vector = kompress_build_product_search(name, description, id);
+            "#,
+        )
+        .await?;
+        Ok(())
+    }
+
+    async fn down(&self, m: &SchemaManager) -> Result<(), DbErr> {
+        // Restore the prior definition (raw, un-stripped description).
+        let db = m.get_connection();
+        db.execute_unprepared(
+            r#"
+            CREATE OR REPLACE FUNCTION kompress_build_product_search(
+                p_name text, p_description text, p_id integer
+            ) RETURNS tsvector
+            LANGUAGE sql STABLE AS $func$
+                SELECT
+                    setweight(to_tsvector('sk_unaccent', COALESCE(p_name, '')), 'A')
+                  || setweight(to_tsvector('sk_unaccent', COALESCE((
+                        SELECT string_agg(t.name, ' ')
+                        FROM product_product_tags ppt
+                        JOIN product_tags t ON t.id = ppt.product_tag_id
+                        WHERE ppt.product_id = p_id
+                     ), '')), 'B')
+                  || setweight(to_tsvector('sk_unaccent', COALESCE((
+                        SELECT string_agg(v.label, ' ')
+                        FROM product_variants v
+                        WHERE v.product_id = p_id
+                     ), '')), 'B')
+                  || setweight(to_tsvector('sk_unaccent', COALESCE(p_description, '')), 'C')
+                  || setweight(to_tsvector('sk_unaccent', COALESCE((
+                        SELECT string_agg(v.sku, ' ')
+                        FROM product_variants v
+                        WHERE v.product_id = p_id AND v.sku IS NOT NULL
+                     ), '')), 'C');
+            $func$;
+
+            UPDATE products
+               SET search_vector = kompress_build_product_search(name, description, id);
+            "#,
+        )
+        .await?;
+        Ok(())
+    }
+}

src/controllers/admin_customers.rs

@@ -138,10 +138,17 @@ async fn show(
         .all(&ctx.db)
         .await?;
 
-    let list = products::Entity::find()
-        .order_by_asc(products::Column::Name)
-        .all(&ctx.db)
-        .await?;
+    // Optional text search (drafts included), otherwise the whole catalog by
+    // name. Reuses the storefront's hybrid full-text + fuzzy product search.
+    let query = params.get("q").map(String::as_str).unwrap_or("").trim().to_string();
+    let list = if query.is_empty() {
+        products::Entity::find()
+            .order_by_asc(products::Column::Name)
+            .all(&ctx.db)
+            .await?
+    } else {
+        products::Entity::search(&ctx.db, &query, 1000, false).await?
+    };
 
     // Category sidebar tree (counts over the full, unfiltered product list) plus
     // the active `?category=` filter applied to the rows.
@@ -212,6 +219,7 @@ async fn show(
             "products": rows,
             "category_groups": category_groups,
             "selected_category": selected_category,
+            "query": query,
             "total_count": list.len(),
             "uncategorized_count": category_ids.iter().filter(|c| c.is_none()).count(),
             "error": params.get("error"),

src/controllers/admin_orders.rs

@@ -1,5 +1,8 @@
 //! Admin order list, detail, status updates, and manual carrier dispatch.
 
+use std::collections::HashMap;
+
+use axum::extract::Query;
 use axum_extra::extract::cookie::CookieJar;
 use loco_rs::prelude::*;
 use sea_orm::{ActiveModelTrait, ColumnTrait, EntityTrait, QueryFilter, QueryOrder, Set};
@@ -30,18 +33,31 @@ async fn index(
     auth: auth::JWT,
     jar: CookieJar,
     ViewEngine(v): ViewEngine<TeraView>,
+    Query(params): Query<HashMap<String, String>>,
     State(ctx): State<AppContext>,
 ) -> Result<Response> {
     guard::current_admin(auth, &ctx).await?;
-    let list = orders::Entity::find()
-        .order_by_desc(orders::Column::CreatedAt)
-        .all(&ctx.db)
-        .await?;
+    // Optional search over order number / customer / email / etc., otherwise the
+    // full list newest first.
+    let query = params.get("q").map(String::as_str).unwrap_or("").trim().to_string();
+    let list = if query.is_empty() {
+        orders::Entity::find()
+            .order_by_desc(orders::Column::CreatedAt)
+            .all(&ctx.db)
+            .await?
+    } else {
+        orders::Entity::search(&ctx.db, &query, 500).await?
+    };
     let rows: Vec<serde_json::Value> = list.iter().map(view::summary).collect();
     format::view(
         &v,
         "admin/orders/index.html",
-        json!({ "orders": rows, "lang": current_lang(&jar) }),
+        json!({
+            "orders": rows,
+            "query": query,
+            "total": list.len(),
+            "lang": current_lang(&jar),
+        }),
     )
 }
 

src/controllers/admin_products.rs

@@ -26,7 +26,7 @@ use crate::{
     },
     shared::{
         guard,
-        money::{format_bp, format_price, parse_price_to_cents},
+        money::{format_bp, format_price, parse_percent, parse_price_to_cents},
         pricing,
         slug::{slugify, unique_slug},
     },
@@ -52,6 +52,7 @@ struct ProductFields {
     name: String,
     slug: String,
     description: Option<String>,
+    short_description: Option<String>,
     currency: String,
     category_id: Option<i32>,
     published: bool,
@@ -67,6 +68,7 @@ async fn parse_product_fields(
         .ok_or_else(|| Error::BadRequest("product name is required".to_string()))?;
     let currency = form.text("currency").unwrap_or_else(|| "EUR".to_string());
     let description = form.text("description");
+    let short_description = form.text("short_description");
     let category_id = form.text("category_id").and_then(|s| s.parse::<i32>().ok());
     let published = form.checked("published");
 
@@ -91,6 +93,7 @@ async fn parse_product_fields(
         name,
         slug,
         description,
+        short_description,
         currency,
         category_id,
         published,
@@ -105,30 +108,9 @@ struct VariantInput {
     /// `None` = available but not inventory-tracked.
     stock: Option<i32>,
     price_cents: i64,
-    business_sale_cents: Option<i64>,
     position: i32,
 }
 
-/// The optional business-sale price field on a variant row: blank means "no
-/// business quick-sale", a value must parse and be below the regular price.
-fn parse_optional_sale(
-    form: &MultipartForm,
-    i: usize,
-    key: &str,
-    price_cents: i64,
-) -> Result<Option<i64>> {
-    let Some(raw) = form.text(&format!("variants[{i}][{key}]")) else {
-        return Ok(None);
-    };
-    let cents = parse_price_to_cents(&raw)?;
-    if cents <= 0 || cents >= price_cents {
-        return Err(Error::BadRequest(
-            "a sale price must be positive and below the regular price".to_string(),
-        ));
-    }
-    Ok(Some(cents))
-}
-
 /// Parse the repeated variant rows from the form, in submission order. Blank
 /// rows (no price and no label) are skipped; at least one valid row is required.
 fn parse_variants(form: &MultipartForm) -> Result<Vec<VariantInput>> {
@@ -168,7 +150,6 @@ fn parse_variants(form: &MultipartForm) -> Result<Vec<VariantInput>> {
                     .ok_or_else(|| Error::BadRequest("stock must be 0 or more".to_string()))?,
             ),
         };
-        let business_sale_cents = parse_optional_sale(form, i, "business_sale", price_cents)?;
         let id = form
             .text(&format!("variants[{i}][id]"))
             .and_then(|s| s.parse::<i32>().ok());
@@ -179,7 +160,6 @@ fn parse_variants(form: &MultipartForm) -> Result<Vec<VariantInput>> {
             sku,
             stock,
             price_cents,
-            business_sale_cents,
             position: out.len() as i32,
         });
     }
@@ -197,9 +177,9 @@ fn apply_variant(active: &mut product_variants::ActiveModel, input: &VariantInpu
     active.sku = Set(input.sku.clone());
     active.stock = Set(input.stock);
     active.price_cents = Set(input.price_cents);
-    // The per-variant public sale price was removed from the UI; keep it cleared.
-    active.sale_price_cents = Set(None);
-    active.business_sale_price_cents = Set(input.business_sale_cents);
+    // Discounts (public + business sale) are owned by the discount page and keyed
+    // per option/audience; the product form must leave those columns untouched so
+    // it never clobbers a discount. New variants default them to NULL.
     active.position = Set(input.position);
 }
 
@@ -257,7 +237,6 @@ fn variant_form_json(variant: &product_variants::Model) -> serde_json::Value {
         "sku": variant.sku,
         "stock": variant.stock,
         "price": format_price(variant.price_cents),
-        "business_sale": variant.business_sale_price_cents.map(format_price),
     })
 }
 
@@ -281,10 +260,17 @@ async fn index(
         .map(|c| (c.id, c.name.clone()))
         .collect();
 
-    let list = products::Entity::find()
-        .order_by_desc(products::Column::CreatedAt)
-        .all(&ctx.db)
-        .await?;
+    // Optional text search (drafts included), otherwise the full catalog newest
+    // first. Reuses the storefront's hybrid full-text + fuzzy product search.
+    let query = params.get("q").map(String::as_str).unwrap_or("").trim().to_string();
+    let list = if query.is_empty() {
+        products::Entity::find()
+            .order_by_desc(products::Column::CreatedAt)
+            .all(&ctx.db)
+            .await?
+    } else {
+        products::Entity::search(&ctx.db, &query, 1000, false).await?
+    };
     let ids: Vec<i32> = list.iter().map(|p| p.id).collect();
     let grouped = product_variants::Entity::grouped_for_products(&ctx.db, &ids).await?;
 
@@ -333,9 +319,13 @@ async fn index(
                 .sum::<i32>()
                 .to_string()
         };
+        // The product is "on sale" for this audience if any option carries a
+        // discount; the per-option amounts live on the discount page.
+        let on_sale = variants.iter().any(|v| current_value(v, audience).is_some());
         rows.push(product_row(
             product,
             priced,
+            on_sale,
             variants.len(),
             stock_display,
             image,
@@ -352,6 +342,7 @@ async fn index(
             "audience": audience,
             "category_groups": category_groups,
             "selected_category": selected_category,
+            "query": query,
             "total_count": list.len(),
             "uncategorized_count": category_ids.iter().filter(|c| c.is_none()).count(),
             "lang": current_lang(&jar),
@@ -365,6 +356,7 @@ async fn index(
 fn product_row(
     product: &products::Model,
     effective: &pricing::PricedProduct,
+    on_sale: bool,
     variant_count: usize,
     stock_display: String,
     image: Option<String>,
@@ -382,6 +374,7 @@ fn product_row(
         "image": image,
         "category_name": category_name,
         "regular_price": format_price(effective.regular_cents),
+        "on_sale": on_sale,
         "effective_price": format_price(effective.price_cents),
         "effective_reduced": effective.is_reduced(),
         "effective_percent_off": percent_off(effective.regular_cents, effective.price_cents),
@@ -448,6 +441,7 @@ async fn create(
         name: Set(fields.name),
         slug: Set(fields.slug),
         description: Set(fields.description),
+        short_description: Set(fields.short_description),
         currency: Set(fields.currency),
         view_count: Set(0),
         published: Set(fields.published),
@@ -562,6 +556,7 @@ async fn update(
     product.name = Set(fields.name);
     product.slug = Set(fields.slug);
     product.description = Set(fields.description);
+    product.short_description = Set(fields.short_description);
     product.currency = Set(fields.currency);
     product.category_id = Set(fields.category_id);
     product.published = Set(fields.published);
@@ -611,6 +606,30 @@ fn list_redirect(audience: &str) -> Result<Response> {
     format::redirect(&format!("/admin/catalog/products?audience={audience}"))
 }
 
+/// Resolve a percentage off the regular price into a fixed sale price in cents.
+fn percent_to_sale_cents(regular_cents: i64, percent: f64) -> i64 {
+    let off = (regular_cents as f64 * percent / 100.0).round() as i64;
+    regular_cents - off
+}
+
+/// Which discount value an audience tab sees on a variant.
+fn current_value(variant: &product_variants::Model, audience: &str) -> Option<i64> {
+    if audience == BUSINESS {
+        variant.business_sale_price_cents
+    } else {
+        variant.sale_price_cents
+    }
+}
+
+/// Set the discount column on a variant for a given audience.
+fn set_value(active: &mut product_variants::ActiveModel, audience: &str, value: Option<i64>) {
+    if audience == BUSINESS {
+        active.business_sale_price_cents = Set(value);
+    } else {
+        active.sale_price_cents = Set(value);
+    }
+}
+
 /// Percent off the regular price, rounded to a whole number.
 fn percent_off(regular_cents: i64, sale_cents: i64) -> i64 {
     if regular_cents <= 0 {
@@ -734,6 +753,231 @@ async fn sync_profiles(
     list_redirect(audience)
 }
 
+// --- Per-variant discounts ---------------------------------------------------
+//
+// Each product is sold as one or more options (variants). A discount can be set
+// on every option individually, for the active audience: personal writes the
+// public `sale_price_cents`, business writes `business_sale_price_cents`. Per
+// option the admin picks a fixed sale price or a percentage off the regular
+// price; an empty value clears that option's discount.
+
+/// One option row in the discount form. Carries enough to pre-fill the editor
+/// and to survive a validation-error round-trip.
+struct DiscountRow {
+    id: i32,
+    label: String,
+    regular_cents: i64,
+    mode: String,
+    fixed: String,
+    percent: String,
+    has_discount: bool,
+}
+
+impl DiscountRow {
+    /// Pre-fill from the discount stored for this audience.
+    fn from_db(v: &product_variants::Model, audience: &str) -> Self {
+        let sale = current_value(v, audience);
+        DiscountRow {
+            id: v.id,
+            label: v.label.clone(),
+            regular_cents: v.price_cents,
+            mode: "fixed".to_string(),
+            fixed: sale.map(format_price).unwrap_or_default(),
+            percent: String::new(),
+            has_discount: sale.is_some(),
+        }
+    }
+
+    /// Pre-fill from the submitted values, to repaint the form after an error.
+    fn from_submitted(
+        v: &product_variants::Model,
+        audience: &str,
+        pairs: &HashMap<String, String>,
+    ) -> Self {
+        let get = |key: &str| {
+            pairs
+                .get(&format!("v[{}][{key}]", v.id))
+                .map(|s| s.trim().to_string())
+                .unwrap_or_default()
+        };
+        let mode = get("mode");
+        DiscountRow {
+            id: v.id,
+            label: v.label.clone(),
+            regular_cents: v.price_cents,
+            mode: if mode == "percent" {
+                mode
+            } else {
+                "fixed".to_string()
+            },
+            fixed: get("fixed"),
+            percent: get("percent"),
+            has_discount: current_value(v, audience).is_some(),
+        }
+    }
+
+    fn to_json(&self, currency: &str) -> serde_json::Value {
+        json!({
+            "id": self.id,
+            "label": self.label,
+            "regular_cents": self.regular_cents,
+            "regular_price": format_price(self.regular_cents),
+            "currency": currency,
+            "mode": self.mode,
+            "fixed": self.fixed,
+            "percent": self.percent,
+            "has_discount": self.has_discount,
+        })
+    }
+}
+
+/// Resolve one submitted option into the sale price to store. `Ok(None)` clears
+/// the discount; `Err` is an i18n key for the validation message.
+fn resolve_row(
+    regular_cents: i64,
+    mode: &str,
+    fixed: &str,
+    percent: &str,
+) -> std::result::Result<Option<i64>, &'static str> {
+    let sale_cents = if mode == "percent" {
+        if percent.is_empty() {
+            return Ok(None);
+        }
+        let pct = parse_percent(percent).ok_or("discount-invalid")?;
+        if pct <= 0.0 || pct >= 100.0 {
+            return Err("discount-percent-range");
+        }
+        percent_to_sale_cents(regular_cents, pct)
+    } else {
+        if fixed.is_empty() {
+            return Ok(None);
+        }
+        parse_price_to_cents(fixed).map_err(|_| "discount-invalid")?
+    };
+    if sale_cents <= 0 {
+        return Err("discount-must-be-positive");
+    }
+    if sale_cents >= regular_cents {
+        return Err("discount-below-regular");
+    }
+    Ok(Some(sale_cents))
+}
+
+async fn discount_view(
+    v: &TeraView,
+    jar: &CookieJar,
+    product: &products::Model,
+    rows: &[DiscountRow],
+    audience: &str,
+    error: Option<&str>,
+) -> Result<Response> {
+    let rows_json: Vec<_> = rows.iter().map(|r| r.to_json(&product.currency)).collect();
+    let has_discount = rows.iter().any(|r| r.has_discount);
+    format::view(
+        v,
+        "admin/catalog/discount_form.html",
+        json!({
+            "product": {
+                "id": product.id,
+                "name": product.name,
+                "currency": product.currency,
+            },
+            "rows": rows_json,
+            "audience": audience,
+            "has_discount": has_discount,
+            "error": error.map(|e| e.to_string()),
+            "lang": current_lang(jar),
+        }),
+    )
+}
+
+#[debug_handler]
+async fn discount_show(
+    auth: auth::JWT,
+    jar: CookieJar,
+    ViewEngine(v): ViewEngine<TeraView>,
+    Path(id): Path<i32>,
+    Query(params): Query<HashMap<String, String>>,
+    State(ctx): State<AppContext>,
+) -> Result<Response> {
+    guard::current_admin(auth, &ctx).await?;
+    let audience = read_audience(&params);
+    let product = product_by_id(&ctx, id).await?;
+    let variants = product_variants::Entity::for_product(&ctx.db, id).await?;
+    let rows: Vec<DiscountRow> = variants
+        .iter()
+        .map(|variant| DiscountRow::from_db(variant, audience))
+        .collect();
+    discount_view(&v, &jar, &product, &rows, audience, None).await
+}
+
+#[debug_handler]
+async fn discount_update(
+    auth: auth::JWT,
+    jar: CookieJar,
+    ViewEngine(v): ViewEngine<TeraView>,
+    Path(id): Path<i32>,
+    Query(params): Query<HashMap<String, String>>,
+    State(ctx): State<AppContext>,
+    body: String,
+) -> Result<Response> {
+    guard::current_admin(auth, &ctx).await?;
+    let audience = read_audience(&params);
+    let product = product_by_id(&ctx, id).await?;
+    let variants = product_variants::Entity::for_product(&ctx.db, id).await?;
+
+    let pairs: HashMap<String, String> = form_urlencoded::parse(body.as_bytes())
+        .into_owned()
+        .collect();
+
+    // Resolve every option before persisting anything, so one bad row can't leave
+    // the product half-discounted. On the first error, repaint with the inputs.
+    let mut resolved: Vec<(product_variants::Model, Option<i64>)> = Vec::new();
+    for variant in &variants {
+        let row = DiscountRow::from_submitted(variant, audience, &pairs);
+        match resolve_row(variant.price_cents, &row.mode, &row.fixed, &row.percent) {
+            Ok(value) => resolved.push((variant.clone(), value)),
+            Err(key) => {
+                let rows: Vec<DiscountRow> = variants
+                    .iter()
+                    .map(|v| DiscountRow::from_submitted(v, audience, &pairs))
+                    .collect();
+                return discount_view(&v, &jar, &product, &rows, audience, Some(key)).await;
+            }
+        }
+    }
+
+    let txn = ctx.db.begin().await?;
+    for (variant, value) in &resolved {
+        let mut active = variant.clone().into_active_model();
+        set_value(&mut active, audience, *value);
+        active.update(&txn).await?;
+    }
+    txn.commit().await?;
+    list_redirect(audience)
+}
+
+#[debug_handler]
+async fn discount_remove(
+    auth: auth::JWT,
+    Path(id): Path<i32>,
+    Query(params): Query<HashMap<String, String>>,
+    State(ctx): State<AppContext>,
+) -> Result<Response> {
+    guard::current_admin(auth, &ctx).await?;
+    let audience = read_audience(&params);
+    let _product = product_by_id(&ctx, id).await?;
+    let variants = product_variants::Entity::for_product(&ctx.db, id).await?;
+    let txn = ctx.db.begin().await?;
+    for variant in &variants {
+        let mut active = variant.clone().into_active_model();
+        set_value(&mut active, audience, None);
+        active.update(&txn).await?;
+    }
+    txn.commit().await?;
+    list_redirect(audience)
+}
+
 pub fn routes() -> Routes {
     // Several images may be uploaded in one submission; allow a generous total
     // (per-file size is still capped at IMAGE_MAX_BYTES while reading).
@@ -756,4 +1000,16 @@ pub fn routes() -> Routes {
             post(update).layer(image_limit),
         )
         .add("/admin/catalog/products/{id}/delete", post(delete))
+        .add(
+            "/admin/catalog/products/{id}/discount/edit",
+            get(discount_show),
+        )
+        .add(
+            "/admin/catalog/products/{id}/discount",
+            post(discount_update),
+        )
+        .add(
+            "/admin/catalog/products/{id}/discount/remove",
+            post(discount_remove),
+        )
 }

src/controllers/shop.rs

@@ -1,6 +1,8 @@
 //! Public storefront: product listings, product detail, category pages and the
 //! lazily-loaded category sidebar.
 
+use std::collections::HashMap;
+
 use axum::extract::Query;
 use axum::http::HeaderMap;
 use axum_extra::extract::cookie::CookieJar;
@@ -10,15 +12,224 @@ use serde_json::json;
 
 use crate::{
     controllers::i18n::current_lang,
-    shared::{guard, pricing},
+    shared::{
+        guard,
+        money::{format_price, parse_price_to_cents},
+        pricing,
+    },
     models::{categories, product_images, product_variants, products, users},
     views::shop as view,
 };
 
-/// Query string for the storefront search box.
-#[derive(Debug, serde::Deserialize)]
+/// Results per page in the storefront listing/search.
+const PER_PAGE: usize = 24;
+/// Hard cap on candidates a single text search considers before faceting; well
+/// above any realistic page of results for this catalog.
+const SEARCH_CAP: u64 = 1000;
+
+/// All storefront listing controls: free-text query, category, price band,
+/// stock, sort and page. Everything is optional so `/shop` and `/search` share
+/// one shape.
+#[derive(Debug, Default, serde::Deserialize)]
 struct SearchParams {
     q: Option<String>,
+    category: Option<String>,
+    min_price: Option<String>,
+    max_price: Option<String>,
+    in_stock: Option<String>,
+    sort: Option<String>,
+    page: Option<u32>,
+}
+
+/// A candidate product with everything the listing needs to filter, sort and
+/// render it: its representative (first) variant, the resolved price for the
+/// viewer, stock, variant count and original search rank (for relevance order).
+struct Candidate {
+    product: products::Model,
+    rep: product_variants::Model,
+    priced: pricing::PricedProduct,
+    in_stock: bool,
+    count: usize,
+    rank: usize,
+}
+
+/// Whether a checkbox-style param is on (present and not an explicit "off"/"0").
+fn is_on(v: &Option<String>) -> bool {
+    matches!(v.as_deref(), Some(s) if !s.is_empty() && s != "0" && s != "false" && s != "off")
+}
+
+/// Rebuild the query string from `params` minus `page`, so pagination links can
+/// preserve the active query + filters + sort.
+fn query_base(params: &SearchParams) -> String {
+    let mut ser = form_urlencoded::Serializer::new(String::new());
+    if let Some(q) = params.q.as_deref().filter(|s| !s.is_empty()) {
+        ser.append_pair("q", q);
+    }
+    if let Some(c) = params.category.as_deref().filter(|s| !s.is_empty() && *s != "all") {
+        ser.append_pair("category", c);
+    }
+    if let Some(p) = params.min_price.as_deref().filter(|s| !s.is_empty()) {
+        ser.append_pair("min_price", p);
+    }
+    if let Some(p) = params.max_price.as_deref().filter(|s| !s.is_empty()) {
+        ser.append_pair("max_price", p);
+    }
+    if is_on(&params.in_stock) {
+        ser.append_pair("in_stock", "1");
+    }
+    if let Some(s) = params.sort.as_deref().filter(|s| !s.is_empty()) {
+        ser.append_pair("sort", s);
+    }
+    ser.finish()
+}
+
+/// Run the full faceted listing pipeline for `params` and shape the template
+/// context (results page + facet data + pagination). Reused by `/shop` and
+/// `/search`; the caller adds chrome and picks the template.
+async fn run_search(
+    ctx: &AppContext,
+    user: Option<&users::Model>,
+    params: &SearchParams,
+) -> Result<serde_json::Value> {
+    let q = params.q.clone().unwrap_or_default();
+    let q_trim = q.trim().to_string();
+
+    // 1. Base candidates: ranked search hits, or the full published listing.
+    let base: Vec<products::Model> = if q_trim.is_empty() {
+        products::Entity::find()
+            .filter(products::Column::Published.eq(true))
+            .order_by_desc(products::Column::PublishedAt)
+            .all(&ctx.db)
+            .await?
+    } else {
+        products::Entity::search(&ctx.db, &q_trim, SEARCH_CAP, true).await?
+    };
+
+    // 2. Attach representative variant + resolved price to each (drop products
+    //    with no purchasable variant).
+    let ids: Vec<i32> = base.iter().map(|p| p.id).collect();
+    let grouped = product_variants::Entity::grouped_for_products(&ctx.db, &ids).await?;
+    let mut staged: Vec<(products::Model, product_variants::Model, usize, usize)> = Vec::new();
+    for (rank, product) in base.into_iter().enumerate() {
+        if let Some(vs) = grouped.get(&product.id) {
+            if let Some(rep) = vs.first() {
+                staged.push((product, rep.clone(), vs.len(), rank));
+            }
+        }
+    }
+    let reps: Vec<product_variants::Model> = staged.iter().map(|(_, r, _, _)| r.clone()).collect();
+    let priced = pricing::price_variants(ctx, &reps, user).await?;
+    let mut items: Vec<Candidate> = staged
+        .into_iter()
+        .zip(priced.iter())
+        .map(|((product, rep, count, rank), p)| Candidate {
+            in_stock: rep.in_stock(),
+            product,
+            rep,
+            priced: *p,
+            count,
+            rank,
+        })
+        .collect();
+
+    // Price band bounds across all matches, to hint the filter UI.
+    let price_floor = items.iter().map(|i| i.priced.price_cents).min().unwrap_or(0);
+    let price_ceil = items.iter().map(|i| i.priced.price_cents).max().unwrap_or(0);
+
+    // 3. Non-category filters: price band + in-stock.
+    let min_c = params.min_price.as_deref().and_then(|s| parse_price_to_cents(s).ok());
+    let max_c = params.max_price.as_deref().and_then(|s| parse_price_to_cents(s).ok());
+    let in_stock_only = is_on(&params.in_stock);
+    items.retain(|i| {
+        min_c.is_none_or(|m| i.priced.price_cents >= m)
+            && max_c.is_none_or(|m| i.priced.price_cents <= m)
+            && (!in_stock_only || i.in_stock)
+    });
+
+    // 4. Category facets: counts computed over the price/stock-filtered set
+    //    (i.e. before applying the category choice itself).
+    let all_categories = categories::published(ctx).await?;
+    let cat_ids: Vec<Option<i32>> = items.iter().map(|i| i.product.category_id).collect();
+    let category_groups = view::admin_category_groups(&all_categories, &cat_ids);
+    let uncategorized_count = cat_ids.iter().filter(|c| c.is_none()).count();
+    let category_name: HashMap<i32, String> =
+        all_categories.iter().map(|c| (c.id, c.name.clone())).collect();
+
+    // 5. Apply the category filter.
+    let selected_category = params
+        .category
+        .clone()
+        .filter(|s| !s.is_empty())
+        .unwrap_or_else(|| "all".to_string());
+    let filter = view::category_filter_ids(&all_categories, &selected_category);
+    items.retain(|i| view::category_filter_keep(&filter, i.product.category_id));
+
+    // 6. Sort. Newest-first is the default; relevance (the ranked search order)
+    //    is available explicitly via the sort control.
+    let sort = params
+        .sort
+        .clone()
+        .filter(|s| !s.is_empty())
+        .unwrap_or_else(|| "newest".to_string());
+    match sort.as_str() {
+        "price_asc" => items.sort_by(|a, b| a.priced.price_cents.cmp(&b.priced.price_cents)),
+        "price_desc" => items.sort_by(|a, b| b.priced.price_cents.cmp(&a.priced.price_cents)),
+        "name_asc" => items.sort_by(|a, b| {
+            a.product.name.to_lowercase().cmp(&b.product.name.to_lowercase())
+        }),
+        "name_desc" => items.sort_by(|a, b| {
+            b.product.name.to_lowercase().cmp(&a.product.name.to_lowercase())
+        }),
+        "newest" => items.sort_by(|a, b| b.product.published_at.cmp(&a.product.published_at)),
+        // "relevance" and anything unknown: original search rank.
+        _ => items.sort_by_key(|i| i.rank),
+    }
+
+    // 7. Paginate.
+    let total = items.len();
+    let pages = total.div_ceil(PER_PAGE).max(1);
+    let page = params.page.unwrap_or(1).clamp(1, pages as u32);
+    let start = (page as usize - 1) * PER_PAGE;
+
+    // 8. Render only the current page's cards (images fetched per row).
+    let mut rows = Vec::new();
+    for item in items.iter().skip(start).take(PER_PAGE) {
+        let image = product_images::first_for(ctx, item.product.id).await?;
+        let cat_name = item.product.category_id.and_then(|id| category_name.get(&id).cloned());
+        rows.push(view::product_card(
+            &item.product,
+            &item.rep,
+            &item.priced,
+            item.count,
+            image,
+            cat_name,
+        ));
+    }
+
+    Ok(json!({
+        "products": rows,
+        "query": q,
+        "category_groups": category_groups,
+        "selected_category": selected_category,
+        // Numeric form so the <select> can mark the active option (Tera can't
+        // compare a string param against a numeric category id).
+        "selected_category_id": selected_category.parse::<i32>().unwrap_or(-1),
+        "uncategorized_count": uncategorized_count,
+        "sort": sort,
+        "in_stock": in_stock_only,
+        "min_price": params.min_price.clone().unwrap_or_default(),
+        "max_price": params.max_price.clone().unwrap_or_default(),
+        "price_floor": format_price(price_floor),
+        "price_ceil": format_price(price_ceil),
+        "total": total,
+        "page": page,
+        "pages": pages,
+        "has_prev": page > 1,
+        "has_next": (page as usize) < pages,
+        "prev_page": page.saturating_sub(1).max(1),
+        "next_page": page + 1,
+        "query_base": query_base(params),
+    }))
 }
 
 /// Shape a list of products into card rows for `user` (None = public). Each card
@@ -90,39 +301,36 @@ async fn category_sidebar(
     )
 }
 
+/// Fold the page chrome (login state, names) and language into a `run_search`
+/// context so the full page can render the layout.
+fn add_chrome(ctx_value: &mut serde_json::Value, c: &guard::Chrome, lang: &str) {
+    if let Some(map) = ctx_value.as_object_mut() {
+        map.insert("logged_in_admin".into(), json!(c.logged_in_admin));
+        map.insert("logged_in_customer".into(), json!(c.logged_in_customer));
+        map.insert("customer_name".into(), json!(c.customer_name));
+        map.insert("customer_account_type".into(), json!(c.customer_account_type));
+        map.insert("lang".into(), json!(lang));
+    }
+}
+
 #[debug_handler]
 async fn index(
     jar: CookieJar,
     ViewEngine(v): ViewEngine<TeraView>,
     State(ctx): State<AppContext>,
 ) -> Result<Response> {
-    let list = products::Entity::find()
-        .filter(products::Column::Published.eq(true))
-        .order_by_desc(products::Column::PublishedAt)
-        .all(&ctx.db)
-        .await?;
-
     let user = guard::current_user(&ctx, &jar).await;
+    let mut context = run_search(&ctx, user.as_ref(), &SearchParams::default()).await?;
     let c = guard::chrome_from(&ctx, user.as_ref());
-    format::view(
-        &v,
-        "shop/index.html",
-        json!({
-            "products": product_rows(&ctx, user.as_ref(), list).await?,
-            "query": "",
-            "logged_in_admin": c.logged_in_admin,
-            "logged_in_customer": c.logged_in_customer,
-            "customer_name": c.customer_name,
-            "customer_account_type": c.customer_account_type,
-            "lang": current_lang(&jar),
-        }),
-    )
+    add_chrome(&mut context, &c, &current_lang(&jar));
+    format::view(&v, "shop/index.html", context)
 }
 
-/// Storefront search. Reuses the shop listing's card shaping, ranking results by
-/// the hybrid full-text + fuzzy query in [`products::Entity::search`]. A blank
-/// query falls back to the full published listing (so clearing the box restores
-/// the shop). htmx requests get just the results fragment for live updates;
+/// Storefront search + faceted browse. Combines the hybrid full-text/fuzzy query
+/// ([`products::Entity::search`]) with category, price-band, in-stock and sort
+/// filters, ranked and paginated by [`run_search`]. A blank query falls back to
+/// the full published listing, so the same endpoint powers both "browse" and
+/// "search". htmx requests get just the results fragment (for live updates);
 /// direct navigation (or no-JS) renders the whole page.
 #[debug_handler]
 async fn search(
@@ -132,44 +340,20 @@ async fn search(
     Query(params): Query<SearchParams>,
     State(ctx): State<AppContext>,
 ) -> Result<Response> {
-    let q = params.q.unwrap_or_default();
-    let trimmed = q.trim();
-    let list = if trimmed.is_empty() {
-        products::Entity::find()
-            .filter(products::Column::Published.eq(true))
-            .order_by_desc(products::Column::PublishedAt)
-            .all(&ctx.db)
-            .await?
-    } else {
-        products::Entity::search(&ctx.db, trimmed).await?
-    };
-
     let user = guard::current_user(&ctx, &jar).await;
-    let rows = product_rows(&ctx, user.as_ref(), list).await?;
+    let mut context = run_search(&ctx, user.as_ref(), &params).await?;
     let lang = current_lang(&jar);
 
     if headers.contains_key("HX-Request") {
-        return format::view(
-            &v,
-            "shop/_results.html",
-            json!({ "products": rows, "query": q, "lang": lang }),
-        );
+        if let Some(map) = context.as_object_mut() {
+            map.insert("lang".into(), json!(lang));
+        }
+        return format::view(&v, "shop/_results.html", context);
     }
 
     let c = guard::chrome_from(&ctx, user.as_ref());
-    format::view(
-        &v,
-        "shop/index.html",
-        json!({
-            "products": rows,
-            "query": q,
-            "logged_in_admin": c.logged_in_admin,
-            "logged_in_customer": c.logged_in_customer,
-            "customer_name": c.customer_name,
-            "customer_account_type": c.customer_account_type,
-            "lang": lang,
-        }),
-    )
+    add_chrome(&mut context, &c, &lang);
+    format::view(&v, "shop/index.html", context)
 }
 
 #[debug_handler]
@@ -250,11 +434,17 @@ async fn show(
     )
 }
 
+/// Category page: the same faceted search as the shop, but with this category
+/// preselected as the default filter (plus breadcrumbs and subcategory chips).
+/// Any other filters/sort/query on the URL are honoured; the category itself is
+/// always forced to this page's category. Interacting with the toolbar navigates
+/// to `/search` (the category stays selected there too).
 #[debug_handler]
 async fn category(
     jar: CookieJar,
     ViewEngine(v): ViewEngine<TeraView>,
     Path(slug): Path<String>,
+    Query(params): Query<SearchParams>,
     State(ctx): State<AppContext>,
 ) -> Result<Response> {
     let published = categories::published(&ctx).await?;
@@ -267,36 +457,22 @@ async fn category(
     let breadcrumbs = categories::ancestors(&published, category.parent_id);
     let children = categories::children_of(&published, category.id);
 
-    // Products listed here span this category and all of its descendants, so a
-    // parent category is never empty just because its products live in leaves.
-    let mut category_ids: Vec<i32> = categories::descendant_ids(&published, category.id)
-        .into_iter()
-        .collect();
-    category_ids.push(category.id);
-    let list = products::Entity::find()
-        .filter(products::Column::CategoryId.is_in(category_ids))
-        .filter(products::Column::Published.eq(true))
-        .order_by_desc(products::Column::PublishedAt)
-        .all(&ctx.db)
-        .await?;
+    // Force the category filter to this page's category, keeping any other params.
+    let params = SearchParams {
+        category: Some(category.id.to_string()),
+        ..params
+    };
 
     let user = guard::current_user(&ctx, &jar).await;
+    let mut context = run_search(&ctx, user.as_ref(), &params).await?;
+    if let Some(map) = context.as_object_mut() {
+        map.insert("category".into(), serde_json::to_value(&category)?);
+        map.insert("breadcrumbs".into(), serde_json::to_value(&breadcrumbs)?);
+        map.insert("children".into(), serde_json::to_value(&children)?);
+    }
     let c = guard::chrome_from(&ctx, user.as_ref());
-    format::view(
-        &v,
-        "shop/category.html",
-        json!({
-            "category": category,
-            "breadcrumbs": breadcrumbs,
-            "children": children,
-            "products": product_rows(&ctx, user.as_ref(), list).await?,
-            "logged_in_admin": c.logged_in_admin,
-            "logged_in_customer": c.logged_in_customer,
-            "customer_name": c.customer_name,
-            "customer_account_type": c.customer_account_type,
-            "lang": current_lang(&jar),
-        }),
-    )
+    add_chrome(&mut context, &c, &current_lang(&jar));
+    format::view(&v, "shop/category.html", context)
 }
 
 pub fn routes() -> Routes {

src/models/_entities/products.rs

@@ -15,6 +15,8 @@ pub struct Model {
     pub slug: String,
     #[sea_orm(column_type = "Text", nullable)]
     pub description: Option<String>,
+    #[sea_orm(column_type = "Text", nullable)]
+    pub short_description: Option<String>,
     pub currency: String,
     pub view_count: i32,
     pub published: bool,

src/models/orders.rs

@@ -163,4 +163,45 @@ impl Model {}
 impl ActiveModel {}
 
 // implement your custom finders, selectors oriented logic here
-impl Entity {}
+impl Entity {
+    /// Admin order search: a diacritic- and case-insensitive substring match over
+    /// the free-text order fields an admin would actually type — order number,
+    /// email, customer name, company name, phone and tracking number. Backed by
+    /// the trigram indexes from the `order_search_indexes` migration. Newest
+    /// first, capped at `limit`. A blank query returns nothing (callers fall back
+    /// to the full list).
+    pub async fn search<C: sea_orm::ConnectionTrait>(
+        db: &C,
+        query: &str,
+        limit: u64,
+    ) -> Result<Vec<Model>, DbErr> {
+        let q = query.trim();
+        if q.is_empty() {
+            return Ok(Vec::new());
+        }
+        // Treat the query literally: escape LIKE wildcards, then wrap in %…%.
+        let escaped = q.replace('\\', "\\\\").replace('%', "\\%").replace('_', "\\_");
+        let pattern = format!("%{escaped}%");
+
+        let sql = r#"
+            SELECT * FROM orders o
+            WHERE f_unaccent(o.order_number)               ILIKE f_unaccent($1)
+               OR f_unaccent(o.email)                      ILIKE f_unaccent($1)
+               OR f_unaccent(COALESCE(o.customer_name,'')) ILIKE f_unaccent($1)
+               OR f_unaccent(COALESCE(o.company_name,''))  ILIKE f_unaccent($1)
+               OR f_unaccent(COALESCE(o.phone,''))         ILIKE f_unaccent($1)
+               OR f_unaccent(COALESCE(o.tracking_number,'')) ILIKE f_unaccent($1)
+            ORDER BY o.created_at DESC
+            LIMIT $2
+        "#;
+
+        Entity::find()
+            .from_raw_sql(sea_orm::Statement::from_sql_and_values(
+                db.get_database_backend(),
+                sql,
+                [pattern.into(), (limit as i64).into()],
+            ))
+            .all(db)
+            .await
+    }
+}

src/models/products.rs

@@ -37,7 +37,14 @@ impl Entity {
     /// `f_unaccent`, so diacritics never matter. Results are ranked by full-text
     /// rank, then trigram closeness of the name, then recency. An empty/blank
     /// query returns nothing — callers fall back to the plain listing.
-    pub async fn search<C: ConnectionTrait>(db: &C, query: &str) -> Result<Vec<Model>, DbErr> {
+    /// `published_only` filters to the storefront-visible set; pass `false` for
+    /// admin tools that also need to find drafts.
+    pub async fn search<C: ConnectionTrait>(
+        db: &C,
+        query: &str,
+        limit: u64,
+        published_only: bool,
+    ) -> Result<Vec<Model>, DbErr> {
         let q = query.trim();
         if q.is_empty() {
             return Ok(Vec::new());
@@ -45,13 +52,14 @@ impl Entity {
 
         // Only the model's own columns are selected; the generated `search_vector`
         // is left out so the row maps cleanly back onto `Model`. `$1` is reused
-        // for every occurrence of the query term.
-        let sql = r#"
+        // for every occurrence of the query term; `$2` caps the result set.
+        let published_clause = if published_only { "p.published = TRUE AND" } else { "" };
+        let sql = format!(
+            r#"
             SELECT p.created_at, p.updated_at, p.id, p.name, p.slug, p.description,
                    p.currency, p.view_count, p.published, p.published_at, p.category_id
             FROM products p
-            WHERE p.published = TRUE
-              AND (
+            WHERE {published_clause} (
                   p.search_vector @@ websearch_to_tsquery('sk_unaccent', $1)
                   OR word_similarity(f_unaccent($1), f_unaccent(p.name)) > 0.3
                   OR word_similarity(f_unaccent($1), f_unaccent(COALESCE(p.description, ''))) > 0.3
@@ -60,14 +68,15 @@ impl Entity {
                 ts_rank(p.search_vector, websearch_to_tsquery('sk_unaccent', $1)) DESC,
                 word_similarity(f_unaccent($1), f_unaccent(p.name)) DESC,
                 p.published_at DESC NULLS LAST
-            LIMIT 60
-        "#;
+            LIMIT $2
+        "#
+        );
 
         Entity::find()
             .from_raw_sql(Statement::from_sql_and_values(
                 db.get_database_backend(),
-                sql,
-                [q.into()],
+                &sql,
+                [q.into(), (limit as i64).into()],
             ))
             .all(db)
             .await

src/views/shop.rs

@@ -27,6 +27,7 @@ pub fn product_card(
         "name": product.name,
         "slug": product.slug,
         "description": product.description,
+        "short_description": product.short_description,
         "price": format_price(priced.price_cents),
         "on_sale": priced.is_reduced(),
         "is_business": priced.is_business,
@@ -69,6 +70,7 @@ pub fn product_form(product: &products::Model, images: &[product_images::Model])
         "name": product.name,
         "slug": product.slug,
         "description": product.description,
+        "short_description": product.short_description,
         "currency": product.currency,
         "published": product.published,
         "category_id": product.category_id,