/*
 * Design tokens do Blazerd Store Theme.
 * Ponto único pra trocar cor/spacing/fontes do site inteiro.
 * Antes: cores #22d3ee, #a855f7, etc. estavam hardcoded em 6 snippets diferentes.
 * Agora: muda aqui, reflete em header/footer/home/product/refund/thank-you.
 */

:root {
    /* === Cores principais === */
    --blz-cyan: #22d3ee;              /* Ciano neon — botões "View", links, accent principal */
    --blz-cyan-dark: #06b6d4;         /* Ciano mais escuro — usado em gradientes (135deg, cyan → cyan-dark) */
    --blz-purple: #a855f7;            /* Roxo — botões "Activate Key", badges premium */
    --blz-purple-dark: #7e22ce;       /* Roxo escuro — final dos gradientes (135deg, purple → purple-dark) */
    --blz-discord: #5865f2;           /* Azul oficial do Discord — usado nos botões "Join Discord" */
    --blz-discord-light: #7289da;     /* Discord mais claro — final do gradient */

    /* === Cores de status === */
    --blz-success: #22c55e;           /* Verde — status "online", lifetime access */
    --blz-warning: #fbbf24;           /* Amarelo — avisos importantes (ex: payment reference) */
    --blz-danger: #ef4444;            /* Vermelho — botões de delete, alerts críticos */

    /* === Backgrounds (escuros) === */
    --blz-bg-deep: #020817;           /* Fundo principal (mais escuro) — page background */
    --blz-bg-darker: #0a0e1a;         /* Fundo de cards principais */
    --blz-bg-dark: #0f172a;           /* Fundo de cards secundários */
    --blz-bg-card: rgba(15, 23, 42, 0.6);    /* Card translúcido sobre o fundo (com blur) */
    --blz-bg-overlay: rgba(2, 6, 23, 0.85);  /* Overlay de modais (com blur backdrop) */

    /* === Texto === */
    --blz-text: #cbd5e1;              /* Texto padrão (claro mas não branco — descansa o olho) */
    --blz-text-muted: #94a3b8;        /* Texto secundário (descrições, labels) */
    --blz-text-dim: #64748b;          /* Texto terciário (timestamps, hints) */
    --blz-text-faded: #475569;        /* Texto mais apagado (placeholders) */
    --blz-text-white: #fff;           /* Branco puro — só pra títulos */

    /* === Bordas === */
    --blz-border: rgba(255, 255, 255, 0.08);          /* Borda padrão entre seções */
    --blz-border-cyan: rgba(34, 211, 238, 0.2);       /* Borda ciano sutil (cards de ação) */
    --blz-border-cyan-strong: rgba(34, 211, 238, 0.5); /* Borda ciano em hover */
    --blz-border-purple: rgba(168, 85, 247, 0.3);     /* Borda roxa */

    /* === Gradientes prontos === */
    --blz-gradient-cyan: linear-gradient(135deg, #22d3ee, #06b6d4);              /* Botões View/Checkout */
    --blz-gradient-purple: linear-gradient(135deg, #a855f7, #7e22ce);            /* Botões Activate Key */
    --blz-gradient-cyan-purple: linear-gradient(135deg, #22d3ee, #a855f7);       /* Logo, títulos premium */
    --blz-gradient-discord: linear-gradient(135deg, #5865f2, #7289da);           /* Botão Discord */

    /* === Tipografia === */
    --blz-font-main: 'Inter', sans-serif;             /* Texto corpo (corpo + UI) */
    --blz-font-display: 'Orbitron', sans-serif;       /* Logo "BLAZERD" e elementos display (peso 900) */
    --blz-font-heading: 'Rajdhani', sans-serif;       /* Títulos H1/H2 grandes (uppercase + letter-spacing) */
    --blz-font-mono: 'JetBrains Mono', 'Fira Code', monospace; /* Inputs de código/chave */

    /* === Espaçamento === */
    --blz-radius-sm: 6px;             /* Bordas pequenas (badges, copy button) */
    --blz-radius-md: 10px;            /* Bordas médias (botões padrão, inputs) */
    --blz-radius-lg: 12px;            /* Bordas grandes (cards) */
    --blz-radius-xl: 20px;            /* Bordas extra (modais) */
    --blz-radius-pill: 100px;         /* Pills (badge "5,000+ Happy Customers") */

    /* === Sombras === */
    --blz-shadow-card: 0 8px 32px rgba(0, 0, 0, 0.3);            /* Sombra padrão de card */
    --blz-shadow-glow-cyan: 0 0 25px rgba(34, 211, 238, 0.4);    /* Glow ciano (hover de botões View) */
    --blz-shadow-glow-purple: 0 8px 25px rgba(168, 85, 247, 0.3); /* Glow roxo (hover de Activate Key) */

    /* === Transições === */
    --blz-transition: all 0.3s ease;                              /* Padrão pra hovers */
    --blz-transition-smooth: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); /* Mais suave pra elementos grandes (modais) */

    /* === Z-index === */
    --blz-z-header: 999;              /* Header fica acima do conteúdo normal */
    --blz-z-overlay: 99998;           /* Overlay do mini-cart */
    --blz-z-sidebar: 99999;           /* Mini-cart sidebar (acima do overlay) */
    --blz-z-modal: 999999;            /* Modais (acima de tudo) */
}
