From dcb716cbc3672f317fa607fda1bc7d81c06f1a10 Mon Sep 17 00:00:00 2001
From: freetlab <freetlab@gmail.com>
Date: Wed, 29 Jul 2026 23:27:28 +0200
Subject: [PATCH] fix(alarma-sonando): restyle Stop as a neutral translucent
 surface

Audit 9.11 (t4 line 434): the Stop button was a FilledButton in
colorScheme.primary (brand cyan), the wrong colour family for the
largest element on the ringing screen. The prototype draws a neutral
rgba(255,255,255,.08) surface with a rgba(255,255,255,.16) border and
radius 24 (none of PluriWaveTokens' three named radii).
---
 lib/pantallas/pantalla_alarma_sonando.dart    | 21 ++++++++-
 .../pantalla_alarma_sonando_test.dart         | 47 +++++++++++++++++++
 2 files changed, 67 insertions(+), 1 deletion(-)

diff --git a/lib/pantallas/pantalla_alarma_sonando.dart b/lib/pantallas/pantalla_alarma_sonando.dart
index 112dd0f..7dbde60 100644
--- a/lib/pantallas/pantalla_alarma_sonando.dart
+++ b/lib/pantallas/pantalla_alarma_sonando.dart
@@ -283,9 +283,22 @@ class _PantallaAlarmaSonandoState extends State<PantallaAlarmaSonando> {
                     child: FilledButton.icon(
                       key: const ValueKey('ringing-stop-button'),
                       style: FilledButton.styleFrom(
+                        // Audit 9.11 (t4 line 434): the prototype's Stop is a
+                        // NEUTRAL translucent surface — not the brand cyan
+                        // `colorScheme.primary` this used to render in. It is
+                        // the largest element on a full-screen surface, so
+                        // the wrong colour family was maximally visible.
+                        backgroundColor: Colors.white.withValues(alpha: 0.08),
+                        foregroundColor:
+                            Theme.of(context).colorScheme.onSurface,
+                        side: BorderSide(
+                          color: Colors.white.withValues(alpha: 0.16),
+                        ),
                         minimumSize: const Size.fromHeight(76),
                         shape: RoundedRectangleBorder(
-                          borderRadius: BorderRadius.circular(tokens.radiusLg),
+                          borderRadius: BorderRadius.circular(
+                            _stopButtonRadius,
+                          ),
                         ),
                       ),
                       onPressed: _detener,
@@ -341,6 +354,12 @@ class _PantallaAlarmaSonandoState extends State<PantallaAlarmaSonando> {
 String _hora(AlarmaMusical alarma) =>
     '${alarma.hora.toString().padLeft(2, '0')}:${alarma.minuto.toString().padLeft(2, '0')}';
 
+/// Audit 9.11 (t4 line 434): the Stop button's radius — doesn't match any of
+/// [PluriWaveTokens]'s three named radii (14/18/30), so it stays a local
+/// constant here rather than growing the shared token surface for a single
+/// call site (mirrors `_ArteEscuchar._radio` in `pantalla_inicio.dart`).
+const _stopButtonRadius = 24.0;
+
 /// Full-bleed blurred backdrop (WU11, replaces the `PluriGlassSurface` card
 /// container per task 11.3). This app has no per-station artwork/favicon
 /// safe to render here: `Emisora.favicon` is a network URL, and rendering
diff --git a/test/pantallas/pantalla_alarma_sonando_test.dart b/test/pantallas/pantalla_alarma_sonando_test.dart
index 1cf8b56..8d1e56e 100644
--- a/test/pantallas/pantalla_alarma_sonando_test.dart
+++ b/test/pantallas/pantalla_alarma_sonando_test.dart
@@ -235,6 +235,53 @@ void main() {
     });
   });
 
+  group('visual fidelity (audit 9.11, proto t4 line 434): Detener es una '
+      'superficie neutra translucida, no cian', () {
+    testWidgets(
+      'fondo blanco 8%, borde blanco 16%, radio 24 — no colorScheme.primary/'
+      'radiusLg',
+      (tester) async {
+        await _montarPantalla(tester);
+
+        final elemento = find.byKey(const ValueKey('ringing-stop-button'));
+        final boton = tester.widget<FilledButton>(elemento);
+        final contexto = tester.element(elemento);
+        final primary = Theme.of(contexto).colorScheme.primary;
+
+        final fondo = boton.style?.backgroundColor?.resolve(<WidgetState>{});
+        final borde = boton.style?.side?.resolve(<WidgetState>{});
+        final forma =
+            boton.style?.shape?.resolve(<WidgetState>{})
+                as RoundedRectangleBorder?;
+
+        expect(
+          fondo,
+          Colors.white.withValues(alpha: 0.08),
+          reason:
+              'prototype t4 line 434: rgba(255,255,255,.08) — a neutral '
+              'translucent surface',
+        );
+        expect(
+          fondo,
+          isNot(primary),
+          reason:
+              'the largest element on a full-screen surface must not stay '
+              'the brand cyan colorScheme.primary (PluriWaveTokens.brand)',
+        );
+        expect(
+          borde?.color,
+          Colors.white.withValues(alpha: 0.16),
+          reason: 'prototype t4 line 434 border: rgba(255,255,255,.16)',
+        );
+        expect(
+          forma?.borderRadius,
+          BorderRadius.circular(24),
+          reason: 'prototype t4 line 434: radius 24 (was radiusLg — 30)',
+        );
+      },
+    );
+  });
+
   group('WU11 — estado estatico de subida de volumen (resolucion 4, sin '
       'contador en vivo)', () {
     testWidgets(