import 'package:flutter/material.dart';

import 'tema.dart';

/// Assinatura da marca nas telas de entrada.
///
/// É a reprodução **tipográfica** do logotipo: a palavra em minúsculas, peso
/// alto, com o ponto na cor da marca. Não é o arquivo oficial do logo — para
/// usar o logo de verdade basta jogar o SVG/PNG em `assets/` e trocar este
/// widget por uma `Image`, sem mexer em mais nada.
///
/// Fica só em login e cadastro de propósito: dentro do bolão, a tela é do
/// participante e do jogo, não da marca. Assinatura repetida em toda tela rouba
/// espaço de quem só quer palpitar antes do apito.
class MarcaRaro extends StatelessWidget {
  const MarcaRaro({this.produto, super.key});

  /// Nome do produto sob a marca, quando ajudar a situar a pessoa.
  final String? produto;

  @override
  Widget build(BuildContext context) {
    final cores = Theme.of(context).colorScheme;

    return Semantics(
      // Leitor de tela anuncia a marca, não a soletra letra por letra.
      label: produto == null ? 'raro' : 'raro — $produto',
      excludeSemantics: true,
      child: Column(
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.end,
            children: [
              Text(
                'raro',
                style: TextStyle(
                  fontSize: 44,
                  height: 1,
                  fontWeight: FontWeight.w800,
                  letterSpacing: -1.5,
                  color: cores.onSurface,
                ),
              ),
              const SizedBox(width: 6),
              // O ponto da marca, no violeta. Retângulo arredondado, como no
              // logotipo — não é um círculo.
              Container(
                width: 14,
                height: 10,
                margin: const EdgeInsets.only(bottom: 8),
                decoration: BoxDecoration(
                  color: CoresDoApp.marca,
                  borderRadius: BorderRadius.circular(4),
                ),
              ),
            ],
          ),
          if (produto != null) ...[
            const SizedBox(height: 4),
            Text(
              produto!,
              style: TextStyle(
                fontSize: 15,
                letterSpacing: 0.5,
                color: cores.onSurfaceVariant,
              ),
            ),
          ],
        ],
      ),
    );
  }
}
