/* ================================================================
   FENOBICHO — COLOR TOKENS
   Fonte única de verdade para todas as cores do design system.
   Carregado como primeiro CSS em todas as páginas.

   Verde primário único: #1B9E1B
   Dourado secundário:   #F5B800
   Marrom accent:        #8B5A2B
   Ink (app logado):     #0E1B14
   ================================================================ */

:root {

  /* ================================================================
     PRIMÁRIO — Verde
     ================================================================ */

  --color-primary:       #1B9E1B;
  --color-primary-hover: #158A15;
  --color-primary-dark:  #0F6B0F;
  --color-primary-light: rgba(27, 158, 27, 0.12);
  --color-primary-rgb:   27, 158, 27;

  /* ================================================================
     SECUNDÁRIO — Dourado
     ================================================================ */

  --color-secondary:       #F5B800;
  --color-secondary-hover: #E5A800;
  --color-secondary-light: rgba(245, 184, 0, 0.15);
  --color-secondary-rgb:   245, 184, 0;

  /* ================================================================
     ACCENT — Marrom
     ================================================================ */

  --color-accent:       #8B5A2B;
  --color-accent-dark:  #6B4423;
  --color-accent-light: #A67C52;
  --color-accent-rgb:   139, 90, 43;

  /* ================================================================
     TEXTO
     ================================================================ */

  --color-text-primary:   #1A1A1A;
  --color-text-secondary: #424242;
  --color-text-muted:     #666666;
  --color-text-light:     #FFFFFF;
  --color-text-link:      #1B9E1B;

  /* ================================================================
     BACKGROUNDS — páginas públicas
     ================================================================ */

  --color-bg-primary:      #F5F5F5;
  --color-bg-secondary:    #FFFFFF;
  --color-bg-tertiary:     #EEEEEE;
  --color-bg-card:         #FFFFFF;
  --color-bg-input:        #FFFFFF;
  --color-bg-overlay:      rgba(0, 0, 0, 0.5);
  --color-bg-header:       #FFFFFF;
  --color-bg-section-alt:  #E8F5E9;

  /* ================================================================
     BACKGROUNDS — app logado (ink-based)
     ================================================================ */

  --color-app-bg:      #F4F6F1;
  --color-app-surface: #FFFFFF;
  --color-app-line:    #E5EAE0;
  --color-app-ink:     #0E1B14;
  --color-app-ink-60:  rgba(14, 27, 20, 0.60);
  --color-app-ink-30:  rgba(14, 27, 20, 0.30);
  --color-app-ink-10:  rgba(14, 27, 20, 0.08);
  --color-app-dark:    #0E1B14;
  --color-app-dark-2:  #152720;

  /* ================================================================
     STATUS
     ================================================================ */

  --color-danger:        #D32F2F;
  --color-danger-light:  rgba(211, 47, 47, 0.10);
  --color-success:       #1B9E1B;
  --color-success-light: rgba(27, 158, 27, 0.10);
  --color-warning:       #F5B800;
  --color-warning-light: rgba(245, 184, 0, 0.15);
  --color-info:          #1976D2;
  --color-info-light:    rgba(25, 118, 210, 0.10);

  /* ================================================================
     MODAL
     ================================================================ */

  --color-modal-bg:     #FFFFFF;
  --color-modal-shadow: rgba(0, 0, 0, 0.15);
  --color-modal-scrim:  rgba(0, 0, 0, 0.50);

  /* ================================================================
     GRADIENTES
     ================================================================ */

  --gradient-primary:       linear-gradient(135deg, #1B9E1B 0%, #2ECC40 100%);
  --gradient-primary-shine: linear-gradient(90deg, #1B9E1B 0%, #2ECC40 50%, #1B9E1B 100%);
  --gradient-cta:           linear-gradient(135deg, #1B9E1B 0%, #158A15 100%);
  --gradient-gold:          linear-gradient(135deg, #F5B800 0%, #FFD700 100%);
  --gradient-yellow-green:  linear-gradient(135deg, #F5B800 0%, #1B9E1B 100%);
  --gradient-brown:         linear-gradient(135deg, #8B5A2B 0%, #A67C52 100%);
  --gradient-hero:          linear-gradient(135deg, #F0F4F0 0%, #E8F5E9 50%, #F5F5F5 100%);
  --gradient-card:          linear-gradient(145deg, #FFFFFF 0%, #F8F8F8 100%);
  --gradient-app-dark:      linear-gradient(135deg, #0E1B14 0%, #152720 100%);

  /* ================================================================
     SOMBRAS
     ================================================================ */

  --shadow-sm:           0 2px 6px rgba(0, 0, 0, 0.10);
  --shadow-md:           0 4px 16px rgba(0, 0, 0, 0.12);
  --shadow-lg:           0 8px 28px rgba(0, 0, 0, 0.15);
  --shadow-xl:           0 16px 48px rgba(0, 0, 0, 0.20);
  --shadow-card:         0 4px 16px rgba(0, 0, 0, 0.12);
  --shadow-card-hover:   0 8px 32px rgba(0, 0, 0, 0.18);
  --shadow-modal:        0 20px 60px rgba(0, 0, 0, 0.20);
  --shadow-input:        0 2px 6px rgba(0, 0, 0, 0.08);
  --shadow-button:       0 4px 12px rgba(27, 158, 27, 0.30);
  --shadow-button-gold:  0 4px 12px rgba(245, 184, 0, 0.40);
  --shadow-glow-primary: 0 4px 20px rgba(27, 158, 27, 0.35);
  --shadow-glow-gold:    0 4px 20px rgba(245, 184, 0, 0.45);
  --shadow-glow-brown:   0 4px 20px rgba(139, 90, 43, 0.30);
  --shadow-app:          0 2px 8px rgba(14, 27, 20, 0.08);
  --shadow-app-md:       0 4px 20px rgba(14, 27, 20, 0.14);

  /* ================================================================
     BORDAS
     ================================================================ */

  --border-primary:       2px solid #1B9E1B;
  --border-gold:          2px solid #F5B800;
  --border-subtle:        1px solid #D0D0D0;
  --border-card:          1px solid #CCCCCC;
  --border-input:         2px solid #BDBDBD;
  --border-input-focus:   2px solid #1B9E1B;
  --border-input-error:   2px solid #D32F2F;
  --border-input-success: 2px solid #1B9E1B;
  --border-app:           1px solid #E5EAE0;

  /* ================================================================
     ALIASES — app logado (--jogo-*)
     Apontam para os tokens canônicos acima para backward compat.
     ================================================================ */

  --jogo-primary:      #1B9E1B;
  --jogo-primary-d:    #158A15;
  --jogo-primary-soft: rgba(27, 158, 27, 0.12);
  --jogo-ink:          #0E1B14;
  --jogo-ink-60:       rgba(14, 27, 20, 0.60);
  --jogo-ink-30:       rgba(14, 27, 20, 0.30);
  --jogo-ink-10:       rgba(14, 27, 20, 0.08);
  --jogo-surface:      #FFFFFF;
  --jogo-bg:           #F4F6F1;
  --jogo-line:         #E5EAE0;
  --jogo-shadow:       0 2px 8px rgba(14, 27, 20, 0.08);
  --jogo-shadow-md:    0 4px 20px rgba(14, 27, 20, 0.14);

}