/**
 * DESIGN TOKENS — GRUPO GORDINHO
 * Paleta Oficial: Verde Floresta Profundo (Deep Forest Green) & Ouro/Âmbar Vibrante (Golden Yellow)
 * Baseada na identidade visual premium com alto contraste e sofisticação.
 */

:root {
  /* Brand Accent — Amarelo Ouro / Âmbar Quente (Destaques & CTAs) */
  --color-primary: #FAB818;            /* Amarelo Ouro vibrante e convidativo */
  --color-primary-hover: #E5A50E;      /* Amarelo Ouro escurecido */
  --color-primary-dark: #C98E05;
  --color-primary-subtle: rgba(250, 184, 24, 0.12);
  --color-primary-border: rgba(250, 184, 24, 0.35);

  /* Secondary Accent — Verde Esmeralda & Status */
  --color-accent: #22C55E;             /* Verde status / confirmação */
  --color-accent-hover: #16A34A;
  --color-accent-subtle: rgba(34, 197, 94, 0.12);
  --color-accent-border: rgba(34, 197, 94, 0.35);

  /* Backgrounds & Superfícies — Verde Floresta Profundo & Elegante */
  --bg-main: #0F3822;                  /* Fundo principal verde escuro rico */
  --bg-darker: #0A2717;                /* Fundo ultra profundo para contrastes e rodapé */
  --bg-surface: #13442A;               /* Superfície dos cards e blocos */
  --bg-surface-elevated: #195234;      /* Superfície elevada para hover e detalhes */
  --bg-surface-hover: #1E603E;         /* Hover refinado */
  --bg-glass: rgba(13, 46, 28, 0.88);  /* Header com blur de vidro verde floresta */

  /* Tipografia & Neutros de Alta Legibilidade */
  --text-primary: #FFFFFF;             /* Títulos e destaques principais */
  --text-secondary: #D2E4D8;           /* Textos corridos em tom off-white suave */
  --text-muted: #8FB49C;               /* Metadados, legendas e rótulos */
  --text-inverse: #0A2717;             /* Texto escuro para botões amarelos */

  /* Bordas e Divisores */
  --border-color: rgba(255, 255, 255, 0.1);  /* Bordas suaves */
  --border-subtle: rgba(255, 255, 255, 0.06);
  --border-highlight: rgba(250, 184, 24, 0.35);

  /* Semantic / WhatsApp */
  --color-whatsapp: #FAB818;           /* Botões principais no amarelo ouro oficial */
  --color-whatsapp-hover: #E5A50E;
  --color-pending: #CBD5E1;
  --color-pending-bg: rgba(255, 255, 255, 0.08);

  /* Typography */
  --font-heading: 'Outfit', 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --font-body: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;

  /* Font Sizes */
  --text-xs: 0.75rem;     /* 12px */
  --text-sm: 0.875rem;    /* 14px */
  --text-base: 1rem;      /* 16px */
  --text-lg: 1.125rem;    /* 18px */
  --text-xl: 1.25rem;     /* 20px */
  --text-2xl: 1.5rem;     /* 24px */
  --text-3xl: 1.875rem;   /* 30px */
  --text-4xl: 2.25rem;    /* 36px */
  --text-5xl: 3rem;       /* 48px */

  /* Spacing */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;

  /* Layout */
  --container-max: 1240px;
  --container-padding: clamp(1rem, 2.5vw, 2rem);
  --header-height: 76px;

  /* Border Radius */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 22px;
  --radius-full: 9999px;

  /* Shadows */
  --shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.35);
  --shadow-lg: 0 14px 28px -4px rgba(0, 0, 0, 0.45);
  --shadow-glow: 0 0 25px rgba(250, 184, 24, 0.25);
  --shadow-glow-green: 0 0 25px rgba(34, 197, 94, 0.25);

  /* Transitions */
  --transition-fast: 150ms ease;
  --transition-base: 220ms ease;
  --transition-smooth: 350ms cubic-bezier(0.16, 1, 0.3, 1);
}