feat: Add colored category badges to B2B classifieds

- Usługi: blue
- Produkty: amber
- Współpraca: green
- Praca: pink
- Inne: gray
- Nieruchomości: indigo

templates/classifieds/index.html

@@ -102,11 +102,44 @@
     }
 
     .classified-category {
+        display: inline-block;
+        padding: 2px 10px;
+        border-radius: var(--radius-sm);
         font-size: var(--font-size-xs);
-        color: var(--text-secondary);
+        font-weight: 500;
         text-transform: uppercase;
     }
 
+    .category-uslugi {
+        background: #dbeafe;
+        color: #1e40af;
+    }
+
+    .category-produkty {
+        background: #fef3c7;
+        color: #92400e;
+    }
+
+    .category-wspolpraca {
+        background: #dcfce7;
+        color: #166534;
+    }
+
+    .category-praca {
+        background: #fce7f3;
+        color: #9d174d;
+    }
+
+    .category-inne {
+        background: #f3f4f6;
+        color: #374151;
+    }
+
+    .category-nieruchomosci {
+        background: #e0e7ff;
+        color: #3730a3;
+    }
+
     .classified-title {
         font-size: var(--font-size-lg);
         font-weight: 600;
@@ -215,7 +248,7 @@
         <div class="classified-card {{ classified.listing_type }}">
             <div class="classified-header">
                 <span class="classified-type {{ classified.listing_type }}">{{ 'Szukam' if classified.listing_type == 'szukam' else 'Oferuje' }}</span>
-                <span class="classified-category">{{ classified.category }}</span>
+                <span class="classified-category category-{{ classified.category }}">{{ classified.category|replace('uslugi', 'Usługi')|replace('produkty', 'Produkty')|replace('wspolpraca', 'Współpraca')|replace('praca', 'Praca')|replace('inne', 'Inne')|replace('nieruchomosci', 'Nieruchomości') }}</span>
             </div>
             <div class="classified-title">
                 <a href="{{ url_for('classifieds_view', classified_id=classified.id) }}">{{ classified.title }}</a>

templates/classifieds/view.html

@@ -52,12 +52,45 @@
     }
 
     .classified-category {
+        display: inline-block;
+        padding: 4px 12px;
+        border-radius: var(--radius-sm);
         font-size: var(--font-size-sm);
-        color: var(--text-secondary);
+        font-weight: 500;
         text-transform: uppercase;
         margin-left: var(--spacing-sm);
     }
 
+    .category-uslugi {
+        background: #dbeafe;
+        color: #1e40af;
+    }
+
+    .category-produkty {
+        background: #fef3c7;
+        color: #92400e;
+    }
+
+    .category-wspolpraca {
+        background: #dcfce7;
+        color: #166534;
+    }
+
+    .category-praca {
+        background: #fce7f3;
+        color: #9d174d;
+    }
+
+    .category-inne {
+        background: #f3f4f6;
+        color: #374151;
+    }
+
+    .category-nieruchomosci {
+        background: #e0e7ff;
+        color: #3730a3;
+    }
+
     .classified-title {
         font-size: var(--font-size-2xl);
         font-weight: 600;
@@ -185,7 +218,7 @@
         <div class="classified-header">
             <div>
                 <span class="classified-type {{ classified.listing_type }}">{{ 'Szukam' if classified.listing_type == 'szukam' else 'Oferuje' }}</span>
-                <span class="classified-category">{{ classified.category }}</span>
+                <span class="classified-category category-{{ classified.category }}">{{ classified.category|replace('uslugi', 'Usługi')|replace('produkty', 'Produkty')|replace('wspolpraca', 'Współpraca')|replace('praca', 'Praca')|replace('inne', 'Inne')|replace('nieruchomosci', 'Nieruchomości') }}</span>
             </div>
             {% if classified.author_id == current_user.id %}
             <button class="btn btn-secondary btn-sm close-btn" onclick="closeClassified()">Zamknij ogloszenie</button>