diff --git a/app/components/ui/SectionSearchHero.vue b/app/components/ui/SectionSearchHero.vue
index 528e859..6979b03 100644
--- a/app/components/ui/SectionSearchHero.vue
+++ b/app/components/ui/SectionSearchHero.vue
@@ -18,36 +18,40 @@ function updateValue(event: Event) {
   <div class="space-y-5">
     <h1 class="text-3xl font-extrabold text-[#0f2f20]">{{ props.title }}</h1>
 
-    <label class="input input-bordered flex w-full items-center gap-3 rounded-full bg-white">
-      <svg
-        class="h-4 w-4 shrink-0 text-base-content/45"
-        viewBox="0 0 20 20"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-      >
-        <path
-          d="M14.1667 14.1667L17.5 17.5"
-          stroke="currentColor"
-          stroke-width="1.6"
-          stroke-linecap="round"
-          stroke-linejoin="round"
-        />
-        <circle
-          cx="8.75"
-          cy="8.75"
-          r="5.83333"
-          stroke="currentColor"
-          stroke-width="1.6"
-        />
-      </svg>
-      <input
-        :value="props.modelValue"
-        type="text"
-        class="grow"
-        :placeholder="props.searchPlaceholder"
-        @input="updateValue"
-      >
-    </label>
+    <div class="flex flex-col gap-3 md:flex-row md:items-center">
+      <label class="input input-bordered flex w-full flex-1 items-center gap-3 rounded-full bg-white">
+        <svg
+          class="h-4 w-4 shrink-0 text-base-content/45"
+          viewBox="0 0 20 20"
+          fill="none"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <path
+            d="M14.1667 14.1667L17.5 17.5"
+            stroke="currentColor"
+            stroke-width="1.6"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+          />
+          <circle
+            cx="8.75"
+            cy="8.75"
+            r="5.83333"
+            stroke="currentColor"
+            stroke-width="1.6"
+          />
+        </svg>
+        <input
+          :value="props.modelValue"
+          type="text"
+          class="grow"
+          :placeholder="props.searchPlaceholder"
+          @input="updateValue"
+        >
+      </label>
+
+      <slot name="controls" />
+    </div>
 
     <slot />
   </div>
diff --git a/app/pages/bonus-system/index.vue b/app/pages/bonus-system/index.vue
index 9a1a677..e81ab9e 100644
--- a/app/pages/bonus-system/index.vue
+++ b/app/pages/bonus-system/index.vue
@@ -45,57 +45,9 @@ const filteredTransactions = computed(() => {
       v-model="search"
       title="Бонусы"
       search-placeholder="Пользователь, причина, заказ или сумма"
-    >
-      <div class="flex flex-wrap gap-2">
-        <NuxtLink to="/bonus-system/referrals/new" class="btn btn-secondary border-0">Создать связь</NuxtLink>
-        <NuxtLink to="/bonus-system/transactions/new" class="btn btn-primary border-0">Добавить бонус</NuxtLink>
-      </div>
-
-      <div class="grid gap-4 lg:grid-cols-3">
-        <div class="manager-stat-card">
-          <p class="manager-stat-label">Баланс</p>
-          <p class="manager-stat-value">{{ bonusQuery.result.value?.referralStats.availableBalance ?? 0 }}</p>
-        </div>
-        <div class="manager-stat-card">
-          <p class="manager-stat-label">Рефералы</p>
-          <p class="manager-stat-value">{{ bonusQuery.result.value?.referralStats.referralsCount ?? 0 }}</p>
-        </div>
-        <div class="manager-stat-card">
-          <p class="manager-stat-label">Заявки на вывод</p>
-          <p class="manager-stat-value">{{ withdrawals.length }}</p>
-        </div>
-      </div>
-    </UiSectionSearchHero>
-
-    <div class="grid gap-4 xl:grid-cols-[1.1fr_0.9fr]">
-      <div class="surface-card rounded-3xl p-5">
-        <h2 class="text-xl font-bold text-[#123824]">История транзакций</h2>
-
-        <div v-if="bonusQuery.loading.value" class="manager-empty-state mt-4">
-          Загружаем историю...
-        </div>
-        <div v-else-if="filteredTransactions.length === 0" class="manager-empty-state mt-4">
-          Транзакции по текущему запросу не найдены.
-        </div>
-        <div v-else class="mt-4 space-y-3">
-          <article v-for="transaction in filteredTransactions" :key="transaction.id" class="surface-subcard p-4">
-            <div class="flex flex-wrap items-start justify-between gap-3">
-              <div>
-                <p class="text-sm font-semibold text-[#123824]">{{ transaction.reason }}</p>
-                <p class="mt-1 text-sm text-[#5c7b69]">Пользователь: {{ transaction.userId }}</p>
-              </div>
-              <div class="manager-mini-card text-sm font-semibold text-[#123824]">
-                {{ transaction.amount }}
-              </div>
-            </div>
-            <div class="mt-3 flex flex-wrap gap-3 text-xs text-[#5c7b69]">
-              <span>{{ new Date(transaction.createdAt).toLocaleString() }}</span>
-              <span v-if="transaction.orderId">Заказ: {{ transaction.orderId }}</span>
-            </div>
-          </article>
-        </div>
-      </div>
+    />
 
+    <div class="space-y-4">
       <div class="surface-card rounded-3xl p-5">
         <h2 class="text-xl font-bold text-[#123824]">Заявки на вывод</h2>
 
@@ -106,16 +58,44 @@ const filteredTransactions = computed(() => {
           Активных заявок на вывод сейчас нет.
         </div>
         <div v-else class="mt-4 space-y-3">
-          <article v-for="withdrawal in withdrawals" :key="withdrawal.id" class="surface-subcard p-4">
-            <div class="space-y-2">
-              <p class="text-sm font-semibold text-[#123824]">Пользователь: {{ withdrawal.requesterId }}</p>
-              <p class="text-sm text-[#355947]">Сумма: {{ withdrawal.amount }}</p>
-              <p class="text-xs text-[#5c7b69]">{{ new Date(withdrawal.createdAt).toLocaleString() }}</p>
+          <article v-for="withdrawal in withdrawals" :key="withdrawal.id" class="rounded-2xl border border-[#d6ebde] bg-white px-4 py-4">
+            <div class="flex flex-col gap-3 md:flex-row md:items-start md:justify-between">
+              <div class="space-y-1">
+                <p class="text-sm font-semibold text-[#123824]">Пользователь: {{ withdrawal.requesterId }}</p>
+                <p class="text-sm text-[#355947]">Сумма: {{ withdrawal.amount }}</p>
+                <p class="text-xs text-[#5c7b69]">{{ new Date(withdrawal.createdAt).toLocaleString() }}</p>
+              </div>
+              <div>
+                <NuxtLink :to="`/bonus-system/withdrawals/${withdrawal.id}`" class="btn btn-accent btn-sm border-0">
+                  Проверить вывод
+                </NuxtLink>
+              </div>
             </div>
-            <div class="mt-4">
-              <NuxtLink :to="`/bonus-system/withdrawals/${withdrawal.id}`" class="btn btn-accent btn-sm border-0">
-                Проверить вывод
-              </NuxtLink>
+          </article>
+        </div>
+      </div>
+
+      <div class="surface-card rounded-3xl p-5">
+        <h2 class="text-xl font-bold text-[#123824]">История транзакций</h2>
+
+        <div v-if="bonusQuery.loading.value" class="manager-empty-state mt-4">
+          Загружаем историю...
+        </div>
+        <div v-else-if="filteredTransactions.length === 0" class="manager-empty-state mt-4">
+          Транзакции по текущему запросу не найдены.
+        </div>
+        <div v-else class="mt-4 space-y-3">
+          <article v-for="transaction in filteredTransactions" :key="transaction.id" class="rounded-2xl border border-[#d6ebde] bg-white px-4 py-4">
+            <div class="flex flex-col gap-2 md:flex-row md:items-start md:justify-between">
+              <div class="space-y-1">
+                <p class="text-sm font-semibold text-[#123824]">{{ transaction.reason }}</p>
+                <p class="text-sm text-[#5c7b69]">Пользователь: {{ transaction.userId }}</p>
+                <p v-if="transaction.orderId" class="text-sm text-[#5c7b69]">Заказ: {{ transaction.orderId }}</p>
+                <p class="text-xs text-[#5c7b69]">{{ new Date(transaction.createdAt).toLocaleString() }}</p>
+              </div>
+              <div class="text-sm font-semibold text-[#123824]">
+                {{ transaction.amount }}
+              </div>
             </div>
           </article>
         </div>
diff --git a/app/pages/client-orders/index.vue b/app/pages/client-orders/index.vue
index d8038ba..6ea1ffd 100644
--- a/app/pages/client-orders/index.vue
+++ b/app/pages/client-orders/index.vue
@@ -59,19 +59,14 @@ const filteredOrders = computed(() => {
       title="Заказы клиентов"
       search-placeholder="Номер заказа, клиент, адрес или товар"
     >
-      <div class="surface-card rounded-3xl p-4 md:p-5">
-        <div class="grid gap-3 md:grid-cols-[1fr_auto]">
-          <label class="form-control md:min-w-60">
-            <span class="label-text">Фильтр</span>
-            <select v-model="statusFilter" class="select manager-field w-full">
-              <option value="ALL">Все заказы</option>
-              <option value="WAITING">Ожидают подтверждения</option>
-              <option value="ACTIVE">Активные</option>
-              <option value="CLOSED">Закрытые</option>
-            </select>
-          </label>
-        </div>
-      </div>
+      <template #controls>
+        <select v-model="statusFilter" class="select select-bordered w-full rounded-full bg-white md:w-64">
+          <option value="ALL">Все заказы</option>
+          <option value="WAITING">Ожидают подтверждения</option>
+          <option value="ACTIVE">Активные</option>
+          <option value="CLOSED">Закрытые</option>
+        </select>
+      </template>
     </UiSectionSearchHero>
 
     <div v-if="ordersQuery.loading.value" class="manager-empty-state">
@@ -91,25 +86,22 @@ const filteredOrders = computed(() => {
         <div class="flex flex-wrap items-start justify-between gap-3">
           <div class="space-y-1">
             <h2 class="text-lg font-bold text-[#123824]">{{ order.code }}</h2>
-            <div class="flex flex-wrap gap-3 text-sm text-[#5c7b69]">
-              <span>Клиент: {{ order.customerId }}</span>
-              <span>{{ new Date(order.createdAt).toLocaleString() }}</span>
-            </div>
+            <p class="text-sm text-[#5c7b69]">Клиент: {{ order.customerId }}</p>
+            <p class="text-sm text-[#5c7b69]">Создан: {{ new Date(order.createdAt).toLocaleString() }}</p>
+            <p v-if="order.deliveryAddress" class="text-sm text-[#5c7b69]">Адрес: {{ order.deliveryAddress }}</p>
           </div>
           <OrderStatusBadge :status="order.status" />
         </div>
 
-        <div class="mt-4 grid gap-3 md:grid-cols-3">
-          <div class="manager-mini-card text-sm text-[#123824]">
-            Позиций: <span class="font-semibold">{{ order.items.length }}</span>
-          </div>
-          <div class="manager-mini-card text-sm text-[#123824]">
-            Итого: <span class="font-semibold">{{ order.totalPrice ?? 'без оффера' }}</span>
-          </div>
-          <div class="manager-mini-card text-sm text-[#123824]">
-            Адрес: <span class="font-semibold">{{ order.deliveryAddress || 'не выбран' }}</span>
-          </div>
-        </div>
+        <ul class="mt-4 grid gap-2 text-sm text-[#214735]">
+          <li
+            v-for="item in order.items"
+            :key="item.id"
+            class="rounded-2xl border border-[#d6ebde] bg-white px-4 py-3"
+          >
+            {{ item.productName }} × {{ item.quantity }}
+          </li>
+        </ul>
       </NuxtLink>
     </div>
   </section>
diff --git a/app/pages/clients/index.vue b/app/pages/clients/index.vue
index bfd0ec7..5045d58 100644
--- a/app/pages/clients/index.vue
+++ b/app/pages/clients/index.vue
@@ -65,15 +65,11 @@ const filteredClients = computed(() => {
       title="Клиенты"
       search-placeholder="Компания, контакт, email или ИНН"
     >
-      <div class="flex flex-col gap-3 md:flex-row md:items-center md:justify-between">
-        <div class="manager-mini-card text-sm text-[#123824] md:w-56">
-          Всего карточек: <span class="font-semibold">{{ filteredClients.length }}</span>
-        </div>
-
+      <template #controls>
         <NuxtLink to="/clients/invite" class="btn btn-primary border-0">
           Пригласить клиента
         </NuxtLink>
-      </div>
+      </template>
     </UiSectionSearchHero>
 
     <div v-if="clientsQuery.loading.value" class="manager-empty-state">
diff --git a/app/pages/orders.vue b/app/pages/orders.vue
index 25501d8..14dc929 100644
--- a/app/pages/orders.vue
+++ b/app/pages/orders.vue
@@ -53,19 +53,14 @@ const filteredOrders = computed(() => {
       title="Мои заказы"
       search-placeholder="Номер заказа или товар"
     >
-      <div class="surface-card rounded-3xl p-4 md:p-5">
-        <div class="grid gap-3 md:grid-cols-[1fr_auto]">
-          <label class="form-control md:min-w-60">
-            <span class="label-text">Фильтр</span>
-            <select v-model="statusFilter" class="select select-bordered w-full">
-              <option value="ALL">Все заказы</option>
-              <option value="WAITING">Ожидают подтверждения</option>
-              <option value="ACTIVE">Активные</option>
-              <option value="CLOSED">Закрытые</option>
-            </select>
-          </label>
-        </div>
-      </div>
+      <template #controls>
+        <select v-model="statusFilter" class="select select-bordered w-full rounded-full bg-white md:w-64">
+          <option value="ALL">Все заказы</option>
+          <option value="WAITING">Ожидают подтверждения</option>
+          <option value="ACTIVE">Активные</option>
+          <option value="CLOSED">Закрытые</option>
+        </select>
+      </template>
     </UiSectionSearchHero>
 
     <div v-if="allOrders.loading.value" class="alert surface-card border-0">Загрузка заказов...</div>
@@ -80,35 +75,26 @@ const filteredOrders = computed(() => {
         class="surface-card rounded-3xl p-4 md:p-5"
       >
         <div class="flex flex-wrap items-start justify-between gap-3">
-          <div>
+          <div class="space-y-1">
             <h2 class="text-lg font-bold text-[#123824]">{{ order.code }}</h2>
-            <p class="text-xs text-[#355947]">{{ new Date(order.createdAt).toLocaleString() }}</p>
+            <p class="text-sm text-[#355947]">Создан: {{ new Date(order.createdAt).toLocaleString() }}</p>
+            <p v-if="order.deliveryAddress" class="text-sm text-[#355947]">Адрес: {{ order.deliveryAddress }}</p>
+            <p v-if="order.deliveryTerms" class="text-sm text-[#355947]">Доставка: {{ order.deliveryTerms }}</p>
+          </div>
+          <div class="flex flex-col items-end gap-2">
+            <OrderStatusBadge :status="order.status" />
           </div>
-          <OrderStatusBadge :status="order.status" />
         </div>
 
         <ul class="mt-4 grid gap-2 text-sm text-[#214735]">
           <li
             v-for="item in order.items"
             :key="item.id"
-            class="rounded-xl border border-[#d6ebde] bg-white/75 px-3 py-2"
+            class="rounded-2xl border border-[#d6ebde] bg-white px-4 py-3"
           >
             {{ item.productName }} × {{ item.quantity }}
           </li>
         </ul>
-
-        <div class="mt-4 grid gap-3 text-sm text-[#214735] md:grid-cols-2">
-          <div class="rounded-xl border border-[#d6ebde] bg-white/75 px-3 py-2">
-            Условия доставки: {{ order.deliveryTerms || 'ожидает обработки менеджером' }}
-          </div>
-          <div class="rounded-xl border border-[#d6ebde] bg-white/75 px-3 py-2">
-            Итого: {{ order.totalPrice ?? 'после обработки менеджером' }}
-          </div>
-        </div>
-
-        <div class="mt-3 rounded-xl border border-[#d6ebde] bg-white/75 px-3 py-2 text-sm text-[#214735]">
-          Адрес доставки: {{ order.deliveryAddress || 'адрес не был выбран' }}
-        </div>
       </article>
     </div>
   </section>