/* ============================================================
   DS BALANÇAS — DESIGN TOKENS
   Identidade: Verde esmeralda (logo) + cinza metálico / grafite.
   Tema claro com acentos metálicos. Nomes de variáveis herdados
   do design system (Equipmax) para compatibilidade dos componentes.
   ============================================================ */

/* ----------------------------------------------------------------
   1) TOKENS DE COMPATIBILIDADE (mesmos nomes, valores DS)
   ---------------------------------------------------------------- */
:root {
  /* Marca / ação (verde esmeralda da logo) */
  --color_primary:            #2E8B3D;  /* Verde esmeralda oficial DS */
  --color_primary_contrast:   #1F6B2E;  /* Verde escuro p/ contraste WCAG AA >= 4.5:1 */
  --color_primary_medium:     #2E8B3D;
  --color_secondary_medium:   #2E8B3D;
  --color_button_menu:        #1F6B2E;
  --color_button_menu_text:   #ffffff;
  --color_news_text:          #1F6B2E;

  /* Confiança / status */
  --color_pay_list_bg:        #2E9E3F;
  --color_seals_shipping_bg:  #2E9E3F;
  --color_whats_bg:           #25b830;

  /* Header / barra superior — agora grafite metálico */
  --color_header_bg:          #2B2F33;  /* Grafite metálico (header principal) */
  --color_header_highlight:   #f2f2f2;
  --color_header_second_font: #C9CDD1;  /* Prata (texto secundário sobre grafite) */
  --color_top_header_bg:      #1F2225;  /* Barra utilitária do topo (grafite escuro) */
  --color_top_header_font:    #ffffff;
  --color_text_icon_head:     #E8EAEC;  /* Ícones/textos claros sobre grafite (alto contraste) */

  /* Menu / dropdown */
  --color_menu:               #ffffff;
  --color_menu_text:          #000000;

  /* Selos / etiquetas */
  --color_seal:               #1F6B2E;
  --color_seals_bg:           #1F6B2E;
  --color_seals_discount_bg:  #1F6B2E;
  --color_seals_discount_text:#ffffff;
  --color_seals_text:         #ffffff;
  --color_bg_seal:            #ffffff;

  /* Texto / neutros */
  --color_text_global:        #23272A;  /* Corpo de texto (grafite escuro) */
  --color_font_medium:        #242424;  /* Títulos / ênfases */
  --color_font_inverted:      #ffffff;
  --color_gray_medium:        #F4F5F6;  /* Fundo de seções / cards neutros */
  --color_news:               #f2f2f2;

  /* Diversos */
  --color_countdown_bg:       #000000;
  --color_countdown_text:     #ffffff;
  --color_bg_button_newsletter:#2B2F33;
  --color_text_button_newsletter:#ffffff;
  --color_footer_button:      #1F6B2E;
  --color_footer_button_text: #ffffff;
  --color_footer_highlight:   #5FBF5A;

  /* Tipografia */
  --font_family:              'Montserrat', system-ui, sans-serif;
}

/* ----------------------------------------------------------------
   2) TOKENS NORMALIZADOS (nomenclatura semântica)
   ---------------------------------------------------------------- */
:root {
  /* — Cor de marca — */
  --eqx-primary:          #2E8B3D;  /* DS brand emerald */
  --eqx-primary-contrast: #1F6B2E;  /* Darker emerald for text/buttons on light */
  --eqx-primary-hover:    #267A34;  /* Hover state */
  --eqx-primary-light:    #5FBF5A;  /* Lighter emerald accent */
  --eqx-success:          #2E9E3F;
  --eqx-whatsapp:         #25b830;

  /* — Metálicos (nova identidade) — */
  --eqx-graphite:         #2B2F33;  /* Grafite (header, top-bar, rodapé) */
  --eqx-graphite-dark:    #1F2225;  /* Grafite escuro (barra utilitária, bloco da logo) */
  --eqx-silver:           #B8BEC4;  /* Prata (bordas/detalhes metálicos) */
  --eqx-steel:            #5A6068;  /* Cinza aço (texto de apoio) */

  /* — Neutros / superfície — */
  --eqx-ink:              #242424;  /* Títulos / texto pesado */
  --eqx-text:             #33383D;  /* Corpo de texto padrão */
  --eqx-surface:          #ffffff;  /* Cards e seções brancas */
  --eqx-surface-alt:      #F4F5F6;  /* Fundo neutro de alternância */
  --eqx-surface-warm:     #EAF4E9;  /* Superfície verde clara */
  --eqx-on-primary:       #ffffff;  /* Texto sobre botão primário */
  --eqx-on-primary-dark:  #ffffff;  /* Texto sobre grafite */
  --eqx-utility-bar:      #1F2225;  /* Barra superior/elementos utilitários */
  --eqx-overlay-dark:     #000000;

  /* — Tipografia — (base densa ~14px, root 16px) */
  --eqx-font:             'Montserrat', system-ui, sans-serif;
  --eqx-fs-2xs:           0.75rem;
  --eqx-fs-xs:            0.825rem;
  --eqx-fs-sm:            0.875rem;
  --eqx-fs-md:            1rem;
  --eqx-fs-lg:            1.125rem;
  --eqx-fs-xl:            1.25rem;
  --eqx-fs-2xl:           1.5rem;
  --eqx-fs-3xl:           1.75rem;
  --eqx-fw-regular:       400;
  --eqx-fw-medium:        500;
  --eqx-fw-semibold:      600;
  --eqx-fw-bold:          700;

  /* — Raio — */
  --eqx-radius-sm:        4px;
  --eqx-radius:           6px;
  --eqx-radius-md:        8px;
  --eqx-radius-lg:        10px;
  --eqx-radius-pill:      50px;
  --eqx-radius-circle:    50%;

  /* — Sombra — */
  --eqx-shadow-sm:        0 2px 6px rgba(0,0,0,0.07);
  --eqx-shadow:           0 4px 8px rgba(0,0,0,0.11);
  --eqx-shadow-md:        0 3px 5px rgba(0,0,0,0.15);

  /* — Layout — */
  --eqx-container:        1300px;
  --eqx-container-wide:   1450px;

  /* — Movimento — */
  --eqx-transition:       0.2s ease-out;
  --eqx-transition-slow:  0.3s ease-out;
}