From 4bf0e235fbc6a05f1da08b7a384470df864bf255 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D0=90=D0=BD=D1=82=D0=BE=D0=BD=20=D0=A2=D1=80=D0=BE=D1=88?=
 =?UTF-8?q?=D0=B8=D0=BD?= <i@atroshin.ru>
Date: Sat, 1 Aug 2026 22:37:43 +0300
Subject: [PATCH] service chips: match library selection style (border-based)

---
 src/ui/service-view.ts | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/ui/service-view.ts b/src/ui/service-view.ts
index d7b5591..bbdd413 100644
--- a/src/ui/service-view.ts
+++ b/src/ui/service-view.ts
@@ -95,8 +95,8 @@ export class ServiceView {
           <button
             class="service-tab text-sm transition-colors
               ${this.activeService === s.id
-                ? 'bg-navy text-parchment font-medium rounded-full px-3 py-1'
-                : 'text-navy-light hover:bg-navy/10 rounded-full px-3 py-1'}"
+                ? 'border border-gold bg-gold/10 text-navy font-bold rounded-lg px-3 py-1'
+                : 'border border-gold/20 bg-white/50 text-navy hover:border-gold/50 rounded-lg px-3 py-1'}"
             data-service="${s.id}"
           >${s.name}</button>
         `).join('')}
@@ -132,9 +132,9 @@ export class ServiceView {
           this.container.querySelectorAll('.service-tab').forEach(t => {
             const id = t.getAttribute('data-service');
             if (id === serviceId) {
-              t.className = 'service-tab text-sm transition-colors bg-navy text-parchment font-medium rounded-full px-3 py-1';
+              t.className = 'service-tab text-sm transition-colors border border-gold bg-gold/10 text-navy font-bold rounded-lg px-3 py-1';
             } else {
-              t.className = 'service-tab text-sm transition-colors text-navy-light hover:bg-navy/10 rounded-full px-3 py-1';
+              t.className = 'service-tab text-sm transition-colors border border-gold/20 bg-white/50 text-navy hover:border-gold/50 rounded-lg px-3 py-1';
             }
           });
           this.loadService(service);