/**
 * Theme Name: Blocksy Child
 * Description: Apolice Gamer Child Theme
 * Author: Creative Themes & Apolice Team
 * Template: blocksy
 * Text Domain: blocksy
 */

/* ==========================================================================
   APÓLICE GAMER — DESIGN TOKENS (DNA GLOBAL)
   Objetivo: Centralizar cores, espaçamentos, tipografia, efeitos e SVGs
   para usar em layout.css / woocommerce.css / dokan.css sem repetir código.
   ========================================================================== */

:root {
  /* =========================================================
     1) BRAND COLORS (Identidade e Ações)
     ========================================================= */
  --ag-primary:         #1285fa; /* Azul Neon Principal (Botões Salvar/Enviar) */
  --ag-primary-hover:   #0b6bcb; /* Azul Neon Escuro (Hover) */
  
  --ag-danger:          #d9534f; /* Vermelho (Botões Cancelar/Desconectar) */
  --ag-danger-hover:    #c9302c; /* Vermelho Escuro (Hover) */
  
  --ag-warning:         #f39c12; /* Laranja/Amarelo (Botões Editar/Aviso) */
  --ag-warning-hover:   #e67e22; /* Laranja Escuro (Hover) */

  --ag-success:         #4ade80; /* Verde Claro (Status Concluído) */
  --ag-success-bg:      #064e3b; /* Verde Escuro (Fundo Pílula Status) */

  /* =========================================================
     2) NEUTRALS (Paleta Base do Dark Mode)
     ========================================================= */
  --ag-black-pure:      #000000; /* Fundo mais escuro (Inputs, Selects, Textareas) */
  --ag-black-base:      #050505; /* Fundo base da página e Editor de Texto */
  --ag-black-dark:      #0a0a0a; /* Fundo de tabelas e listas zebradas */
  --ag-black-card:      #111111; /* Fundo dos painéis e cards principais (Caixas) */
  --ag-black-hover:     #1a1a1a; /* Fundo de hover, cabeçalhos de tabela, submenus */
  
  --ag-gray-border:     #333333; /* Bordas padrão de todas as caixas e linhas */
  --ag-gray-dark:       #444444; /* Bordas secundárias (botões inativos) */
  --ag-gray-muted:      #888888; /* Textos secundários, dicas, placeholders */
  --ag-gray-light:      #cccccc; /* Labels de formulários, texto padrão */
  
  --ag-white:           #ffffff; /* Títulos, valores de saldo, ícones ativos */

  /* =========================================================
     3) SEMANTIC TOKENS (Mapeamento Funcional para uso no CSS)
     ========================================================= */
  /* Fundos */
  --bg-body:            var(--ag-black-base);
  --bg-card:            var(--ag-black-card);
  --bg-header:          var(--ag-black-hover);
  --bg-input:           var(--ag-black-pure);
  --bg-hover:           var(--ag-black-hover);

  /* Textos */
  --text-title:         var(--ag-white);
  --text-body:          var(--ag-gray-light);
  --text-muted:         var(--ag-gray-muted);

  /* Bordas */
  --border-main:        var(--ag-gray-border);

  /* =========================================================
     4) LIGHT SURFACE TOKENS (Painéis Claros: Pix, Banco, Saque)
     ========================================================= */
  --light-bg:           #ffffff; /* Fundo da caixa principal */
  --light-bg-input:     #f8f9fa; /* Fundo claro para inputs de texto */
  --light-bg-disabled:  #e9ecef; /* Fundo de campos bloqueados (Taxas) */
  
  --light-text-main:    #000000; /* Texto digitado pelo usuário */
  --light-text-label:   #333333; /* Labels (Ex: "Retirar valor") */
  --light-text-muted:   #888888; /* Placeholders escuros */
  
  --light-border:       #cccccc; /* Borda dos inputs claros */
  --light-border-soft:  #eeeeee; /* Linhas divisórias suaves */

  /* =========================================================
     5) UI ELEMENTS (Bordas, Sombras e Transições)
     ========================================================= */
  --radius-sm:          4px;  /* Inputs e Botões Pequenos */
  --radius-md:          6px;  /* Botões Padrão e Dropdowns */
  --radius-lg:          8px;  /* Cards Menores e Painéis Secundários */
  --radius-xl:          12px; /* Cards Principais e Modais Gigantes */
  
  --shadow-none:        none;
  --shadow-modal:       0 0 50px rgba(0, 0, 0, 0.9);
  
  --transition-fast:    all 0.2s ease;
  --transition-main:    all 0.3s ease;

  /* =========================================================
     6) ASSETS & ICONS (Evita repetição de código Base64 enorme)
     ========================================================= */
  /* Seta branca para Selects no Dark Mode */
  --svg-arrow-light:    url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23FFFFFF%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E');
  
  /* Seta escura para Selects no Light Mode (Configurações Banco) */
  --svg-arrow-dark:     url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23333333%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E');

  /* =========================================================
     7) TIPOGRAFIA RESPONSIVA
     ========================================================= */
  --fs-12: 0.75rem;
  --fs-13: 0.8125rem;
  --fs-14: 0.875rem;
  --fs-16: 1rem;
  --fs-18: 1.125rem;
  --fs-20: 1.25rem;
  --fs-h1: clamp(1.6rem, 2.4vw, 2.2rem);
  --fs-h2: clamp(1.3rem, 2vw, 1.8rem);
  --fs-h3: clamp(1.1rem, 1.6vw, 1.4rem);
}