/* V8 Grifes — design tokens v2
   Carregar no child theme DEPOIS do CSS do Woodmart.
   Trocar de loja/tema do template = trocar só este bloco :root. */


:root {
  /* Cor */
  --v8-ink: #111111;        /* texto, TODO botão de compra, header, faixas */
  --v8-white: #FFFFFF;      /* cards, botão invertido sobre foto */
  --v8-paper: #F5F5F3;      /* fundo da página */
  --v8-stone: #E9E5DF;      /* fundo das fotos de catálogo */
  --v8-line: #E3E3E0;       /* bordas e divisórias */
  --v8-muted: #6B6B6B;      /* texto secundário */
  --v8-promo: #D7261E;      /* % OFF, selo PROMO, preço de atacado. NUNCA botão */
  --v8-promo-on-dark: #FF5A50; /* mesmo papel sobre fundo escuro/foto */
  --v8-whatsapp: #1FAF55;   /* só WhatsApp */
  --v8-success: #2B7A3D;    /* "adicionado", atacado atingido */

  /* Tipografia */
  --v8-font-display: "Barlow Condensed", "Arial Narrow", Arial, sans-serif; /* banners, títulos, marcas, % — caixa-alta */
  --v8-font-text: "Barlow", Arial, sans-serif;
  --v8-fs-hero: 76px; --v8-fs-h1: 56px; --v8-fs-h2: 34px; --v8-fs-h3: 24px;
  --v8-fs-body: 15px; --v8-fs-small: 13px; --v8-fs-label: 11px;

  /* Forma e espaço */
  --v8-radius: 4px;         /* botões, cards, banners */
  --v8-radius-pill: 999px;  /* compra rápida, contadores */
  --v8-container: 1360px;
  --v8-gutter: 32px;
  --v8-gap: 16px;           /* entre cards de banner */
  --v8-gap-grid: 20px;      /* grid de produtos */
  --v8-section: 56px;       /* respiro entre blocos da home */
  --v8-btn-h: 48px;

  /* Overrides do Woodmart.
     ATENÇÃO Claude Code: confirmar os nomes exatos dessas variáveis no CSS da
     versão instalada do Woodmart (grep por "--wd-" e "--btn-" em
     wp-content/themes/woodmart/css). Ajustar se algum nome mudou. */
  --wd-primary-color: var(--v8-ink);
  --wd-alternative-color: var(--v8-promo);
  --wd-text-font: var(--v8-font-text);
  --wd-title-font: var(--v8-font-display);
  --wd-entities-title-font: var(--v8-font-text);
  --wd-header-el-font: var(--v8-font-text);
  --btn-default-bgcolor: var(--v8-ink);
  --btn-default-bgcolor-hover: #000000;
  --btn-default-color: var(--v8-white);
  --btn-accented-bgcolor: var(--v8-ink);
  --btn-accented-bgcolor-hover: #000000;
  --wd-brd-radius: var(--v8-radius);
  --wd-form-brd-radius: var(--v8-radius);
}

/* Regra única de CTA */
.v8-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; height:var(--v8-btn-h); padding:0 28px;
  background:var(--v8-ink); color:var(--v8-white); border:1px solid var(--v8-ink); border-radius:var(--v8-radius);
  font:700 13px/1 var(--v8-font-text); letter-spacing:.08em; text-transform:uppercase; text-decoration:none; cursor:pointer; }
.v8-btn:hover { background:#000; }
.v8-btn--inverse { background:var(--v8-white); color:var(--v8-ink); border-color:var(--v8-white); } /* sobre foto/fundo escuro */
.v8-btn--outline { background:transparent; color:var(--v8-ink); }
.v8-btn--whatsapp { background:var(--v8-whatsapp); border-color:var(--v8-whatsapp); }
.v8-btn:focus-visible { outline:2px solid var(--v8-ink); outline-offset:2px; }

/* Preço de atacado: aparece em todo lugar que tem preço */
.v8-price-wholesale { color:var(--v8-promo); font-weight:700; font-size:var(--v8-fs-small); }
