From 9012795973b94d0359476059a52da55320df3a5c Mon Sep 17 00:00:00 2001
From: Gustavo <eric.fullmetal@gmail.com>
Date: Fri, 14 Aug 2026 00:48:12 -0300
Subject: [PATCH] fix: corrige contraste AA do laranja de acento no tema claro

- --cor-acento-contraste passa de branco pra #17171a (texto escuro sobre
  fundo laranja em botoes, unificando com o tema escuro) - contraste ~7:1
- novo token --cor-acento-texto (#B3510C no tema claro, #F5821F no
  tema escuro) usado para laranja como cor de TEXTO sobre fundo claro
  (link padrao, badge-acento, item ativo da sidebar, chave gerada em
  gerador_chave.html) - contraste 5.12:1 contra branco, acima do
  minimo AA de 4.5:1

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 app/static/estilo.css            | 11 +++++++----
 app/templates/gerador_chave.html |  2 +-
 2 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/app/static/estilo.css b/app/static/estilo.css
index e3a68a2..d8f4193 100644
--- a/app/static/estilo.css
+++ b/app/static/estilo.css
@@ -8,8 +8,9 @@
   --cor-texto-secundario: #6b6b74;
   --cor-borda: #e4e4e9;
   --cor-acento: #F5821F;
-  --cor-acento-contraste: #ffffff;
+  --cor-acento-contraste: #17171a;
   --cor-acento-suave: #fff1e4;
+  --cor-acento-texto: #B3510C;
   --cor-sucesso: #15803d;
   --cor-sucesso-fundo: #dcfce7;
   --cor-perigo: #b91c1c;
@@ -30,6 +31,7 @@
     --cor-borda: #2e2e33;
     --cor-acento-contraste: #17171a;
     --cor-acento-suave: rgba(245,130,31,0.16);
+    --cor-acento-texto: #F5821F;
     --cor-sucesso: #4ade80;
     --cor-sucesso-fundo: rgba(74,222,128,0.14);
     --cor-perigo: #f87171;
@@ -49,6 +51,7 @@
   --cor-borda: #2e2e33;
   --cor-acento-contraste: #17171a;
   --cor-acento-suave: rgba(245,130,31,0.16);
+  --cor-acento-texto: #F5821F;
   --cor-sucesso: #4ade80;
   --cor-sucesso-fundo: rgba(74,222,128,0.14);
   --cor-perigo: #f87171;
@@ -72,7 +75,7 @@ h1, h2, h3 { font-weight: 700; line-height: 1.25; }
 h1 { font-size: 1.5rem; margin: 0 0 16px; }
 h2 { font-size: 1.15rem; margin: 28px 0 12px; }
 
-a { color: var(--cor-acento); }
+a { color: var(--cor-acento-texto); }
 
 /* ---------- layout raiz: sidebar + área de conteúdo ---------- */
 
@@ -106,7 +109,7 @@ a { color: var(--cor-acento); }
   transition: background var(--transicao), color var(--transicao);
 }
 .sidebar-nav a:hover { background: var(--cor-superficie-alt); }
-.sidebar-nav a.ativo { background: var(--cor-acento-suave); color: var(--cor-acento); font-weight: 600; }
+.sidebar-nav a.ativo { background: var(--cor-acento-suave); color: var(--cor-acento-texto); font-weight: 600; }
 .sidebar-nav svg { flex-shrink: 0; width: 20px; height: 20px; }
 .sidebar-nav span { overflow: hidden; text-overflow: ellipsis; }
 
@@ -214,7 +217,7 @@ a.botao:hover { border-color: var(--cor-acento); color: var(--cor-acento); }
 .mensagem.warning { background: var(--cor-aviso-fundo); color: var(--cor-aviso); }
 
 .badge { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 0.78rem; font-weight: 600; }
-.badge-acento { background: var(--cor-acento-suave); color: var(--cor-acento); }
+.badge-acento { background: var(--cor-acento-suave); color: var(--cor-acento-texto); }
 .badge-neutro { background: var(--cor-superficie-alt); color: var(--cor-texto-secundario); }
 .badge-sucesso { background: var(--cor-sucesso-fundo); color: var(--cor-sucesso); }
 
diff --git a/app/templates/gerador_chave.html b/app/templates/gerador_chave.html
index aa4bfb9..6ef7b84 100644
--- a/app/templates/gerador_chave.html
+++ b/app/templates/gerador_chave.html
@@ -29,7 +29,7 @@
   <button id="gerar">Gerar chave</button>
 
   <div id="erro" style="color:var(--cor-perigo);margin-top:14px;display:none;"></div>
-  <div id="resultado" style="margin-top:20px;padding:14px;border-radius:8px;background:var(--cor-superficie-alt);border:1px solid var(--cor-borda);border-left:3px solid var(--cor-acento);word-break:break-all;font-family:'Courier New',monospace;color:var(--cor-acento);display:none;"></div>
+  <div id="resultado" style="margin-top:20px;padding:14px;border-radius:8px;background:var(--cor-superficie-alt);border:1px solid var(--cor-borda);border-left:3px solid var(--cor-acento);word-break:break-all;font-family:'Courier New',monospace;color:var(--cor-acento-texto);display:none;"></div>
   <button id="copiar" style="display:none;background:transparent;border:1px solid var(--cor-borda);color:var(--cor-texto-secundario);width:auto;padding:6px 10px;">Copiar</button>
 </div>