/* ---------------------------------------------------------------------------
   TEMA ANOVA — ÁREA DO CLIENTE.
   (21/08, pedido da dona) Extraído de css/tema-anova.css quando aquele passou
   de 400 linhas (CONVENCOES.md: 1 arquivo = 1 responsabilidade, >400 = dividir).
   Movimento VERBATIM: nenhuma regra mudou na extração.

   Carrega DEPOIS de tema-anova.css no index.html — usa os tokens declarados lá
   (--anova-verde-*, --anova-ouro, --anova-creme, --anova-linha).
   Sozinho este arquivo não funciona: os tokens moram no outro.
   --------------------------------------------------------------------------- */


/* Cartão da carteira — é o maior bloco de cor da tela. O gradiente do app.css
   é #00543d -> #087657 (verde Zeleno); aqui vira o verde ANOVA, com o brilho
   quente no canto que o key visual usa. */
.client-wallet-hero {
  background:
    radial-gradient(circle at top right, rgba(227, 210, 162, 0.20) 0%, rgba(255, 255, 255, 0) 38%),
    linear-gradient(135deg, var(--anova-verde-700) 0%, var(--anova-verde-900) 100%);
  box-shadow: 0 2px 6px rgba(15, 50, 38, 0.10), 0 26px 56px rgba(15, 50, 38, 0.20);
  border-radius: 28px;
}

/* O rótulo em cima do saldo: caixa alta espaçada em peso médio (era 900, que
   no tamanho pequeno vira mancha) e um fio dourado de contorno. */
.client-wallet-kicker {
  font-weight: 600;
  letter-spacing: 0.08em;
  border-color: rgba(227, 210, 162, 0.45);
  background: rgba(255, 255, 255, 0.12);
}

/* Saldo em serifa: é o número que a pessoa vem ver aqui.
   O nome do cliente, ao lado, acompanha — são os dois destaques do bloco. */
.client-wallet-balance-value,
.client-wallet-side-value {
  font-family: 'The Seasons', 'Playfair Display', 'Georgia', serif;
  font-optical-sizing: auto;
  font-weight: 600;
  letter-spacing: -0.02em;
}

/* Rótulos do bloco em caixa alta espaçada, discretos, para o número dominar. */
.client-wallet-balance-label,
.client-wallet-side-label {
  text-transform: uppercase;
  letter-spacing: 0.09em;
  font-weight: 600;
  font-size: 11px;
  opacity: 0.86;
}

/* Cartão do "indique e ganhe" e os de estatística, dentro do bloco verde. */
.client-wallet-referral-card,
.client-wallet-stat-card {
  background: #fffdf9;
  border-color: var(--anova-linha);
  border-radius: 20px;
}

.client-wallet-referral-label,
.client-wallet-stat-label {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 600;
  color: var(--anova-tinta-2);
}

.client-wallet-referral-link {
  color: var(--anova-verde-700);
  text-decoration-color: var(--anova-ouro);
  text-underline-offset: 3px;
}

/* Menu lateral: item ativo em verde ANOVA, os demais discretos. */
.client-menu-card {
  background: #fffdf9;
  border: 1px solid var(--anova-linha);
  border-radius: 22px;
  box-shadow: var(--shadow-soft);
}

.client-menu-btn.active,
.client-menu-btn[aria-current="page"] {
  background: var(--anova-verde-700);
  color: #fff;
}

.client-menu-user-name,
.client-menu-hello {
  color: var(--anova-verde-800);
}

.client-menu-avatar {
  background: var(--anova-creme-2);
  color: var(--anova-verde-700);
  border: 1px solid var(--anova-linha);
}

/* Títulos de seção da área do cliente na mesma serifa do resto da loja. */
.client-page-section-title {
  font-family: 'The Seasons', 'Playfair Display', 'Georgia', serif;
  font-optical-sizing: auto;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--anova-verde-800);
}

/* Cartões internos (extrato, indique e ganhe, documentos, endereços). */
.client-card,
.client-doc-card,
.client-address-card-v {
  background: #fffdf9;
  border-color: var(--anova-linha);
  border-radius: 20px;
}

/* Balão de ajuda dos documentos — trazia verde fixo. */
.client-doc-info-bubble {
  background: var(--anova-verde-800);
}

.client-doc-info-bubble::after {
  border-top-color: var(--anova-verde-800);
}

/* Cartão salvo (bandeira/validade) — os dois traziam verde fixo. */
.client-card-brand,
.client-card-exp {
  color: var(--anova-ouro);
}