
:root, [data-bs-theme="light"]{
  /* Cores principais */
  --bs-primary: #1877F2;   /* Facebook Blue */
  --bs-info: #3498DB;      /* Sky Blue */
  --bs-success: #2ECC71;   /* Leaf Green */
  --bs-secondary: #BDC3C7; /* Cinza Médio */

  /* Neutros */
  --bs-light: #F5F5F5;     /* Fundo claro */
  --bs-dark: #2C3E50;      /* Texto principal */
  --bs-white: #FFFFFF;

  /* Background e texto padrão */
  --bs-body-bg: #FFFFFF;
  --bs-body-color: #2C3E50;

  /* Bordas */
  --bs-border-color: #E6E8EA;

  /* Ajustes de UI */
  --bs-btn-border-radius: .5rem;
}


/* Dark tokens (ativados por data-bs-theme="dark") */
[data-bs-theme="dark"]{
  --bs-body-bg:#0E141B;
  --bs-body-color:#E6ECF2;
  --bs-secondary:#A9B1BD;
  --bs-border-color:#1E2A36;

  /* Marca mantida */
  --bs-primary:#1877F2;
  --bs-info:#3498DB;
  --bs-success:#2ECC71;

  /* Superfícies Dark */
  --gc-surface-1:#0F1821; /* navbar/cards */
  --gc-surface-2:#0B1218; /* hero/sections */
}

/* Componentes temáticos */
.navbar.gc-navbar{
  background-color:var(--gc-surface-1)!important;
  border-bottom:1px solid var(--bs-border-color)!important;
}
.navbar.gc-navbar .navbar-brand{ color:var(--bs-primary)!important; }
.navbar.gc-navbar .nav-link{ color:var(--bs-body-color)!important; }
.navbar.gc-navbar .nav-link:hover{ color:var(--bs-primary)!important; }

.hero{
  background-color:var(--gc-surface-2);
  color:var(--bs-body-color);
}
.card.gc-card{
  background-color:var(--gc-surface-1);
  border-color:var(--bs-border-color);
}
.footer.gc-footer{
  background-color:var(--gc-surface-1);
  border-top:1px solid var(--bs-border-color);
}


/* ===== Acessibilidade Gullcom (Hover/Focus/Contraste) ===== */

/* 1) Link padrão: sublinhado no hover e foco, melhor visibilidade */
a, .nav-link {
  text-underline-offset: .15em;
}
a:hover, .nav-link:hover { text-decoration: underline; }
a:focus-visible, .nav-link:focus-visible {
  outline: 3px solid var(--bs-primary);
  outline-offset: 2px;
  text-decoration: underline;
}

/* 2) Botões: foco explícito + hover com contraste forte */
.btn:focus-visible {
  outline: 3px solid var(--bs-info);   /* anel claro para dark e light */
  outline-offset: 2px;
}
.btn-primary { color: #fff; }
.btn-primary:hover,
.btn-primary:active {
  background-color: #0F6AE0; /* mais escuro que #1877F2 para AA */
  border-color: #0F6AE0;
}
.btn-success { color: #fff; }
.btn-success:hover,
.btn-success:active {
  background-color: #25B864; /* mais escuro que #2ECC71 */
  border-color: #25B864;
}
.btn-info { color: #fff; }
.btn-info:hover,
.btn-info:active {
  background-color: #2E89C8; /* mais escuro que #3498DB */
  border-color: #2E89C8;
}
.btn-outline-primary:hover { color:#fff; }

/* 3) Campos de formulário: foco destacado */
.form-control:focus, .form-select:focus {
  border-color: var(--bs-primary);
  box-shadow: 0 0 0 .25rem rgba(24,119,242,.25); /* visível em ambos os modos */
  outline: none;
}

/* 4) Cards/Componentes clicáveis: foco em blocos */
.card.gc-card:focus-within {
  outline: 3px solid var(--bs-primary);
  outline-offset: 2px;
}

/* 5) Skip link para navegação por teclado */
.skip-link {
  position: absolute; left: -9999px; top: auto;
  background: var(--bs-primary); color:#fff; padding:.5rem .75rem;
  z-index: 1000; border-radius:.25rem;
}
.skip-link:focus { left: .5rem; top: .5rem; }

/* 6) Preferências do usuário */
@media (prefers-reduced-motion: reduce){
  * { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}

/* 7) Alto contraste do SO (Windows HCM) */
@media (forced-colors: active){
  a, .nav-link, .btn { outline: 1px solid CanvasText; }
}

/* 8) Modo Dark: manter legibilidade das superfícies */
[data-bs-theme="dark"] .nav-link { color: var(--bs-body-color) !important; }
[data-bs-theme="dark"] .nav-link:hover { color: var(--bs-primary) !important; }
