/**
 * Theme 1 - CSS Custom Properties (Variables)
 * 
 * Este arquivo define todas as variáveis CSS customizáveis do tema.
 * Os valores padrão aqui podem ser sobrescritos por /theme/colors.css
 * gerado dinamicamente pelo painel administrativo.
 * 
 * @version 2.0
 * @date 2026-01-08
 */

:root {
  /* ============================================
     MENU / NAVEGAÇÃO
     ============================================ */
  --color-menu-bg: #ffffff;
  --color-menu-text: #5e7279;
  --color-menu-active: #e04622;
  --color-menu-hover: #ffffff;
  --color-menu-hover-bg: #e04622;

  /* ============================================
     SLIDES / CAROUSEL
     ============================================ */
  --color-slide-text-1: rgb(86, 91, 112);
  --color-slide-bg-1: rgb(247, 248, 251);
  --color-slide-text-2: rgb(255, 255, 255);
  --color-slide-bg-2: rgb(232, 119, 92);

  /* ============================================
     TOPO / HEADER SECTION
     ============================================ */
  --color-topo-bg: #eaeff3;
  --color-topo-text: #e04622;

  /* ============================================
     BODY / CONTEÚDO
     ============================================ */
  --color-body-bg: #ffffff;
  --color-aside-title: #2e353e;

  /* ============================================
     BOTÕES
     ============================================ */
  --color-btn-text: #ffffff;
  --color-btn-bg: #e77055;
  --color-btn-hover-bg: #E05A3D;

  /* ============================================
     RODAPÉ / FOOTER
     ============================================ */
  --color-footer-bg: #E9EFF2;
  --color-footer-text: #777777;

  /* ============================================
     REDES SOCIAIS
     ============================================ */
  --color-social-icon: #000000;
  --color-social-bg: #ffffff;

  /* ============================================
     CALENDÁRIO
     ============================================ */
  --color-calendar-bg: #ffffff;
  --color-calendar-head-bg: #f5f5f5;
  --color-calendar-head-text: #666666;
  --color-calendar-event-bg: #ffee6b;
  --color-calendar-event-text: #000000;
  --color-calendar-today-bg: #008ade;
  --color-calendar-today-text: #ffffff;

  /* ============================================
     COTAÇÕES / CÂMBIO
     ============================================ */
  --color-cambio-bg: #2c3e50;
  --color-cambio-text: #ffffff;
  
  /* ============================================
     LINKS ESPECÍFICOS POR ÁREA
     Cores de links customizáveis por seção
     ============================================ */
  --color-topo-link: var(--color-topo-text);
  --color-menu-link: var(--color-menu-text);
  --color-footer-link: var(--color-footer-text);
  --color-body-link: var(--color-primary);
  --color-cotacao-link: var(--color-cambio-text);
  
  /* ============================================
     TEXTO DO CONTEÚDO PRINCIPAL
     ============================================ */
  --color-body-text: #333333;
  
  /* ============================================
     COTAÇÕES (ALIAS PARA CONFIGURAÇÃO AVANÇADA)
     Mapeamento para área de cotações
     ============================================ */
  --color-cotacao-bg: var(--color-cambio-bg);
  --color-cotacao-text: var(--color-cambio-text);
  
  /* ============================================
     CALENDÁRIO
     ============================================ */
  --color-calendario-bg: #ffffff;
  --color-calendario-text: #2e353e;
  --color-calendario-link: #f672a4;
  
  /* ============================================
     VARIAÇÕES AUTOMÁTICAS
     Hover, focus, active states gerados automaticamente
     ============================================ */
  --color-primary: var(--color-menu-active);
  --color-primary-light: color-mix(in srgb, var(--color-primary) 80%, white);
  --color-primary-dark: color-mix(in srgb, var(--color-primary) 80%, black);
  --color-primary-alpha-10: color-mix(in srgb, var(--color-primary) 10%, transparent);
  --color-primary-alpha-20: color-mix(in srgb, var(--color-primary) 20%, transparent);
}

/* ============================================
   FALLBACKS PARA NAVEGADORES ANTIGOS
   ============================================ */
@supports not (color: color-mix(in srgb, red, blue)) {
  :root {
    --color-primary-light: #f5a89d;
    --color-primary-dark: #8b2d1e;
    --color-primary-alpha-10: rgba(224, 70, 34, 0.1);
    --color-primary-alpha-20: rgba(224, 70, 34, 0.2);
  }
}
