/*
 * Tema editorial — design tokens.
 *
 * Valores medidos na loja de referência do cliente (computed styles), não
 * estimados: container 1230px, cápsula do header 26px de raio, mídia do card
 * 22px, título de seção 31px/500 com -0.03em.
 *
 * O painel admin sobrescreve só o que o cliente customizar, via
 * <style id="t2-tokens"> injetado depois deste arquivo.
 */
:root {
    /* Marca */
    --t2-primary: #0b6542;
    --t2-primary-hover: #095339;
    --t2-primary-ink: #0b3a27;
    --t2-lime: #afe263;
    --t2-on-accent: #fcfcfc;

    /* Superfícies */
    --t2-bg: #fcfcfc;
    --t2-surface: #ffffff;
    --t2-surface-soft: #f4f8ec;
    --t2-border: #e8efe0;

    /* Texto */
    --t2-text: #0b3a27;
    --t2-text-muted: #6e7f72;

    /* Formas */
    --t2-radius-pill: 999px;
    --t2-radius-header: 26px;
    --t2-radius-card: 22px;
    --t2-radius-badge: 15px;

    /* Tipografia */
    --t2-font: "Geologica", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --t2-text-base: 15px;
    --t2-title-size: 31px;
    --t2-title-weight: 500;
    --t2-title-tracking: -0.03em;

    /* Layout */
    --t2-container: 1230px;
    --t2-gutter: 15px;
    --t2-header-h: 72px;
    --t2-bottom-nav-h: 62px;

    /* Barra de anúncios e rodapé têm token próprio: na página de produto a
       paleta vem do produto e essas duas peças mudam de tom junto. */
    --t2-announce-bg: var(--t2-primary);
    --t2-announce-color: var(--t2-lime);
    --t2-footer-bg: var(--t2-primary-ink);

    /* "Paleta matriz": tons secundários da marca. Na página de produto,
       t2_product_palette_style() reencaixa todos no matiz do produto. */
    --t2-deep: #0b6542;            /* rótulos, selos escuros, ícones */
    --t2-tag-fg: #0b6542;          /* etiquetas da caixa de compra (rosa nos cosméticos) */
    --t2-pix-bg: #1b6149;          /* selo "N%OFF no PIX" */
    --t2-off-bg: #afe263;          /* selo "-N% no kit" */
    --t2-off-fg: #176049;
    --t2-on-lime: #0b3a27;         /* texto sobre a cor lima */
    --t2-line-soft: #c9d6b6;       /* borda de chips e do rádio dos kits */
    --t2-line-mid: #d9e2ce;        /* borda de botões brancos */
    --t2-line-faint: #e4ebd9;      /* borda de cartões claros */
    --t2-primary-rgb: 11, 101, 66;
    --t2-ink-rgb: 11, 58, 39;
    --t2-muted-rgb: 110, 127, 114;
    --t2-lime-rgb: 175, 226, 99;

    /* Topo da página de produto: faixa atrás da cápsula com a trilha dentro
       (produto sem cor própria: verde escuro da marca, como um produto sem paleta própria). */
    --t2-header-bg: var(--t2-primary-ink);
    --t2-crumb: #8fbf9f;
    --t2-crumb-active: #fcfcfc;

    /* Tons das seções da página de produto ("paleta matriz" da referência):
       --t2-p-* é o jogo dos suplementos (matriz da marca), --t2-h-* o dos
       cosméticos. Na página de produto, t2_product_palette_style() reencaixa
       todos no matiz do produto (t2_palette_tones). Valores da marca aqui. */
    --t2-p-ink900: #0b3a27;
    --t2-p-deep: #0b6542;
    --t2-p-body: #4a5c4f;
    --t2-p-muted: #6e7f72;
    --t2-p-label: #8a9b8d;
    --t2-p-wash: #f4f8ec;
    --t2-p-wash2: #f2faf4;
    --t2-p-card-line: #dcebe1;
    --t2-p-line: #e7ede1;
    --t2-p-dark-soft: #3b5240;
    --t2-p-on-dark: #c6d6c4;
    --t2-p-ghost: #c3d8c9;
    --t2-p-media: #9cce58;
    --t2-p-kicker: #3f6b1a;
    --t2-p-faq-card: #f7fbf0;
    --t2-h-title: #2b3b35;
    --t2-h-text: #4b5d56;
    --t2-h-sub: #677972;
    --t2-h-note: #8a9993;
    --t2-h-item: #5f6d68;
    --t2-h-tint: #e9fbf4;
    --t2-h-tint2: #f5fffb;
    --t2-h-deep: #24b27b;
    --t2-h-rail: #ddeee7;
    --t2-h-sq: #e3f2ec;
    --t2-h-bullet: #b5c9c2;
    --t2-h-tab-border: #d4f2e6;
    --t2-h-dot-border: #d0e7de;
    --t2-h-label-off: #94a8a0;
    --t2-h-tag-bg: #f0fff9;
    --t2-h-ico: #a9f9da;
    --t2-h-on-card: #e7fdf5;

    /* Pílulas do header (na home: lima; na página de produto: cor do produto). */
    --t2-quiz-bg: var(--t2-lime);
    --t2-quiz-fg: var(--t2-primary-ink);
    --t2-offer-bg: var(--t2-primary);
    --t2-offer-bg-h: var(--t2-primary-ink);
    --t2-offer-fg: var(--t2-on-accent);
    --t2-offer-chip-bg: var(--t2-lime);
    --t2-offer-chip-fg: var(--t2-primary-ink);
    --t2-offer-shine: rgba(var(--t2-lime-rgb), .32);

    /* Gaveta do carrinho: sempre na cor da loja, mesmo na página de produto com
       paleta própria. Valores fixos de propósito (não var(--t2-primary), que a
       paleta do produto troca no <body>): layouts/t2/cms-colors os reescreve com
       a cor da marca de cada loja. */
    --t2-cart-deep: #0b6542;
    --t2-cart-deep-dark: #0b3a27;
    --t2-cart-accent: #afe263;

    --t2-shadow-header: 0 12px 40px rgba(var(--t2-ink-rgb), .14);
    --t2-shadow-soft: 0 6px 24px rgba(var(--t2-ink-rgb), .08);
}
