/* ============================================================================
   DueloZone — Design Tokens globais (DZ-307)
   ----------------------------------------------------------------------------
   Fonte unica de verdade da identidade visual: cor, raio, sombra, espacamento
   e tipografia. Nenhuma pagina deve declarar hex proprio; use as variaveis.

   Direcao: gaming competitivo / eSports + fintech.
   - Fundo escuro em azul-marinho/grafite/preto.
   - Cyan deixou de ser cor de preenchimento e virou ACENTO secundario.
   - Verde = ganho/sucesso. Vermelho = perda/alerta. Dourado = DZC/financeiro.
   ========================================================================== */

:root{
  /* ---- Superficies ------------------------------------------------------ */
  --dz-bg:            #070B12;   /* fundo da pagina */
  --dz-bg-deep:       #04070C;   /* fundo de overlay/dock */
  --dz-surface:       #0C1220;   /* card padrao */
  --dz-surface-2:     #111A2B;   /* card interno / input */
  --dz-surface-3:     #162134;   /* hover / elevado */
  --dz-surface-inset: #0A101B;   /* trilhos, tracks, poços */

  --dz-border:        #1C2637;   /* borda fina padrao */
  --dz-border-strong: #27354A;   /* borda de destaque/hover */
  --dz-border-soft:   rgba(255,255,255,.06);

  /* ---- Marca / interacao ------------------------------------------------ */
  --dz-primary:       #3565E3;   /* acao primaria (azul aco) */
  --dz-primary-hover: #4A78F0;
  --dz-primary-deep:  #21489F;
  --dz-primary-soft:  rgba(53,101,227,.14);
  --dz-on-primary:    #F4F8FF;

  --dz-secondary:      #1B2740;  /* acao secundaria (grafite azulado) */
  --dz-secondary-hover:#243352;
  --dz-on-secondary:   #DCE5F2;

  /* Cyan da marca — agora ACENTO, nao preenchimento */
  --dz-accent:        #2FA6B8;
  --dz-accent-hover:  #3BBDD0;
  --dz-accent-soft:   #7FD4DF;
  --dz-accent-deep:   #1D7A88;
  --dz-accent-wash:   rgba(47,166,184,.12);
  --dz-on-accent:     #041519;

  /* ---- Semantica financeira -------------------------------------------- */
  --dz-gold:          #D8A32B;   /* DZC, deposito, recompensa */
  --dz-gold-hover:    #E8B441;
  --dz-gold-soft:     #F0C75E;
  --dz-gold-deep:     #A9761A;
  --dz-gold-wash:     rgba(216,163,43,.12);
  --dz-on-gold:       #140F02;

  --dz-success:       #2FBF71;   /* ganho */
  --dz-success-soft:  #74E0A8;
  --dz-success-wash:  rgba(47,191,113,.12);

  --dz-danger:        #E04B54;   /* perda / alerta */
  --dz-danger-hover:  #EF5C65;
  --dz-danger-soft:   #F58C93;
  --dz-danger-wash:   rgba(224,75,84,.12);

  --dz-warning:       #DDA32B;
  --dz-warning-soft:  #F2C766;
  --dz-warning-wash:  rgba(221,163,43,.12);

  --dz-info:          #5B8DEF;
  --dz-info-wash:     rgba(91,141,239,.12);

  /* ---- Texto ------------------------------------------------------------ */
  --dz-text:          #E7ECF4;
  --dz-text-2:        #9BA9BE;
  --dz-text-muted:    #7A8AA3;   /* contraste 5.2:1 sobre --dz-surface */
  --dz-text-invert:   #05080E;

  /* ---- Raio (discreto) -------------------------------------------------- */
  --dz-r-xs:  4px;
  --dz-r-sm:  6px;
  --dz-r-md:  8px;
  --dz-r-lg:  10px;
  --dz-r-xl:  12px;
  --dz-r-2xl: 16px;
  --dz-r-pill:999px;

  /* ---- Sombra (leve, sem glow colorido) --------------------------------- */
  --dz-shadow-xs: 0 1px 2px rgba(0,0,0,.35);
  --dz-shadow-sm: 0 2px 8px rgba(0,0,0,.32);
  --dz-shadow-md: 0 8px 24px rgba(0,0,0,.38);
  --dz-shadow-lg: 0 18px 44px rgba(0,0,0,.46);
  --dz-ring:      0 0 0 3px rgba(53,101,227,.32);
  --dz-ring-accent: 0 0 0 3px rgba(47,166,184,.28);

  /* ---- Espacamento ------------------------------------------------------ */
  --dz-sp-1: 4px;
  --dz-sp-2: 8px;
  --dz-sp-3: 12px;
  --dz-sp-4: 16px;
  --dz-sp-5: 20px;
  --dz-sp-6: 24px;
  --dz-sp-8: 32px;
  --dz-sp-10:40px;

  /* ---- Tipografia ------------------------------------------------------- */
  --dz-font: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --dz-font-mono: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;

  --dz-fs-display: clamp(1.6rem, 2.4vw, 2rem);
  --dz-fs-title:   clamp(1.25rem, 1.8vw, 1.5rem);
  --dz-fs-section: 1.0625rem;
  --dz-fs-body:    .9375rem;
  --dz-fs-sm:      .8125rem;
  --dz-fs-xs:      .6875rem;

  --dz-fw-regular: 400;
  --dz-fw-medium:  500;
  --dz-fw-semi:    600;
  --dz-fw-bold:    700;

  --dz-ls-tight: -.01em;
  --dz-ls-caps:  .06em;

  /* Cor das particulas do fundo — cinza-azulado, nao a cor da marca. */
  --dz-particle: #8FA3BE;

  --dz-dur: .16s;
  --dz-ease: cubic-bezier(.4,0,.2,1);

  /* =========================================================================
     Aliases de compatibilidade.
     O codigo legado (user/ e admin/) referencia estes nomes. Mantidos para que
     nenhuma tela quebre durante a migracao — mas apontando para os tokens
     novos, de modo que trocar a paleta aqui muda a plataforma inteira.
     ====================================================================== */
  --accent:     var(--dz-accent);
  --accent-dim: var(--dz-accent-wash);
  --bg-base:    var(--dz-bg);
  --bg:         var(--dz-bg);
  --bg2:        var(--dz-surface);
  --bg3:        var(--dz-surface-2);
  --stroke:     var(--dz-border);
  --stroke2:    var(--dz-border-strong);
  --cta:        var(--dz-gold);
  --danger:     var(--dz-danger);
  --success:    var(--dz-success);
  --warn:       var(--dz-warning);
  --purple:     #8B6BE0;
  --text:       var(--dz-text);
  --text2:      var(--dz-text-2);
  --text3:      var(--dz-text-muted);
  --shadow:     var(--dz-shadow-md);
  --shadow-lg:  var(--dz-shadow-lg);
  --radius:     var(--dz-r-xl);
  --radius-sm:  var(--dz-r-lg);
  --radius-xs:  var(--dz-r-md);
}