/**
 * Theme Default - 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;
  --color-header-bg: var(--color-topo-bg);
  --color-header-text: var(--color-topo-text);

  /* ============================================
     BODY / CONTEÚDO
     ============================================ */
  --color-body-bg: #ffffff;
  --color-aside-title: #2e353e;
  --color-text: #555555;
  --color-input-bg: #fbfcfe;
  --color-input-border: #c4cdda;
  --color-border: #e4e4e4;

  /* ============================================
     BOTÕES
     ============================================ */
  --color-btn-text: #ffffff;
  --color-btn-bg: #e77055;
  --color-btn-hover-bg: #E05A3D;
  --color-btn-success-bg: #227b16;
  --color-btn-success-text: #ffffff;
  --color-btn-danger-bg: #c80000;
  --color-btn-danger-text: #ffffff;
  --color-btn-warning-bg: #ff8400;
  --color-btn-warning-text: #ffffff;
  --color-btn-info-bg: #4a0abb;
  --color-btn-info-text: #ffffff;

  /* ============================================
     RODAPÉ / FOOTER
     ============================================ */
  --color-footer-bg: #E9EFF2;
  --color-footer-text: #777777;
  --color-footer-bottom-bg: var(--color-footer-bg);
  --color-footer-link: var(--color-footer-text);

  /* ============================================
     REDES SOCIAIS
     ============================================ */
  --color-social-icon: #000000;
  --color-social-bg: #ffffff;
  --color-social-hover: var(--color-primary);

  /* ============================================
     DESTAQUES E LINKS
     ============================================ */
  --color-destaque: var(--color-primary);
  --color-destaque-hover: var(--color-primary-dark);
  --color-link: var(--color-primary);
  --color-link-hover: var(--color-primary-dark);

  /* ============================================
     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: #e04622;
  
  /* ============================================
     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);
  }
}