adds color themeing support to the site

src/app/services/station-config.service.ts

@@ -4,6 +4,7 @@ import { firstValueFrom } from 'rxjs';
 
 import { StationConfig } from '../interfaces/station-config';
 import { getAppConfig } from './app-config.service';
+import { ThemeService } from './theme.service';
 
 /** Hardcoded defaults — used when the API is unavailable (dev fallback). */
 const DEFAULT_CONFIG: StationConfig = {
@@ -31,6 +32,20 @@ const DEFAULT_CONFIG: StationConfig = {
   play_store_icon_url: '',
   play_store_url: '',
   app_store_embed_html: '',
+  // Color theme defaults (match _variables.scss)
+  color_primary: '#1a3a5c',
+  color_primary_light: '#2a5a8c',
+  color_primary_dark: '#0e2440',
+  color_primary_muted: '#3a6a9c',
+  color_accent: '#e87a2e',
+  color_accent_light: '#f09a4e',
+  color_accent_dark: '#c85a1e',
+  color_accent_muted: '#f0a86a',
+  color_background: '#faf6f0',
+  color_text: '#3a3632',
+  color_success: '#4a9e4f',
+  color_danger: '#c83030',
+  color_info: '#3a8abf',
 };
 
 @Injectable({
@@ -38,6 +53,7 @@ const DEFAULT_CONFIG: StationConfig = {
 })
 export class StationConfigService {
   private http = inject(HttpClient);
+  private themeService = inject(ThemeService);
   private baseUrl = `${getAppConfig().apiBaseUrl}/api/station-config`;
 
   readonly config = signal<StationConfig>(DEFAULT_CONFIG);
@@ -47,6 +63,7 @@ export class StationConfigService {
     try {
       const data = await firstValueFrom(this.http.get<StationConfig>(this.baseUrl));
       this.config.set(data);
+      this.themeService.apply(data);
     } catch {
       // Keep the default config if the API is unavailable.
       console.warn('StationConfigService: Failed to load config, using defaults.');
@@ -59,6 +76,7 @@ export class StationConfigService {
       this.http.put<StationConfig>(this.baseUrl, payload),
     );
     this.config.set(data);
+    this.themeService.apply(data);
   }
 
   /** Upload an image file for station branding (admin only). Returns the relative URL. */