diff --git a/spa/src/components/ProductImageSwiper.vue b/spa/src/components/ProductImageSwiper.vue
index 97bae48..b62a366 100644
--- a/spa/src/components/ProductImageSwiper.vue
+++ b/spa/src/components/ProductImageSwiper.vue
@@ -1,10 +1,6 @@
 <template>
   <div class="aspect-w-4 aspect-h-3">
     <swiper
-        :style="{
-      '--swiper-navigation-color': '#fff',
-      '--swiper-pagination-color': '#fff',
-    }"
         :lazy="true"
         :pagination="pagination"
         :navigation="true"
@@ -80,7 +76,7 @@ export default {
         dynamicBullets: true,
       },
       modules: [Pagination],
-      onTouchMove, // ← вот это добавь
+      onTouchMove,
     };
   },
 };
diff --git a/spa/src/style.css b/spa/src/style.css
index 7e48648..42b4524 100644
--- a/spa/src/style.css
+++ b/spa/src/style.css
@@ -8,6 +8,16 @@ html, body, #app {
     height: 100%;
 }
 
+html {
+    --swiper-pagination-color: var(--color-primary);
+    --swiper-pagination-bullet-inactive-color: var(--color-base-content);
+}
+
+.swiper-pagination-bullets {
+    border-radius: var(--radius-selector);
+    padding: 5px 0;
+}
+
 #app {
     position: relative;
     padding-top: var(--tg-content-safe-area-inset-top);