/* ====================================================
   IDENTIDADE VISUAL OFICIAL - MARCOS ROGÉRIO 22
   Paleta de Cores:
   - Azul Escuro Profundo: #123c90
   - Azul Real Campanha:   #0055a7
   - Azul Celeste / Ação:  #008ee0
   - Azul Suave / Fundo:   #b6defa
   - Verde Bandeira Oficial: #007e2d
   - Verde Vibrante Check:   #4ea21d
   - Laranja Ouro / Destaque: #eea41b
   - Amarelo 22 Oficial:   #fcd700
   - Amarelo Claro:        #ffeb00
==================================================== */

:root {
  --camp-blue-deep: #123c90;
  --camp-blue: #0055a7;
  --camp-blue-light: #008ee0;
  --camp-blue-soft: #b6defa;
  --camp-green-deep: #007e2d;
  --camp-green: #4ea21d;
  --camp-orange: #eea41b;
  --camp-yellow: #fcd700;
  --camp-yellow-bright: #ffeb00;
}

/* Fita Tricolor Oficial da Campanha (Azul, Amarelo, Verde) */
.campaign-ribbon {
  height: 4px;
  width: 100%;
  background: linear-gradient(90deg, 
    #123c90 0%, 
    #0055a7 35%, 
    #fcd700 35%, 
    #fcd700 65%, 
    #007e2d 65%, 
    #4ea21d 100%
  );
}

/* Gradientes de Cabeçalho e Destaques */
.bg-campaign-header {
  background: linear-gradient(135deg, #123c90 0%, #0055a7 70%, #006da6 100%);
}

.bg-campaign-hero {
  background: linear-gradient(145deg, #ffffff 0%, #f8fbfe 100%);
}

.bg-campaign-card-checked {
  background: linear-gradient(90deg, rgba(240, 253, 244, 0.95) 0%, rgba(255, 255, 255, 0.98) 100%);
}

/* Otimização de Toque Mobile */
* {
  -webkit-tap-highlight-color: transparent;
}

/* Barra Grudenta no Celular (Sticky Filter Bar) */
.sticky-mobile-filter {
  position: -webkit-sticky;
  position: sticky;
  top: 52px;
  z-index: 25;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  background: rgba(248, 250, 252, 0.96);
  box-shadow: 0 4px 12px -2px rgba(18, 60, 144, 0.06);
}

/* ====================================================
   BOTÃO DE CHECK DE PRESENÇA (ERGONOMIA DE ÔNIBUS)
==================================================== */
.check-touch-btn {
  width: 52px;
  height: 52px;
  min-width: 52px;
  min-height: 52px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  touch-action: manipulation;
  user-select: none;
  cursor: pointer;
}

.check-touch-btn:active {
  transform: scale(0.90);
}

/* Estado Não Marcado (Pendente): visual limpo com borda convidativa ao toque */
.check-touch-btn.unchecked {
  background: #ffffff;
  border: 2px solid #cbd5e1;
  color: #94a3b8;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
}

.check-touch-btn.unchecked:hover {
  border-color: #008ee0;
  color: #008ee0;
  background: #f0f7ff;
}

/* Estado Marcado (Presente): Verde Oficial Marcos Rogério 22 com brilho */
.check-touch-btn.checked {
  background: linear-gradient(135deg, #007e2d 0%, #4ea21d 100%);
  border: 2.5px solid #006022;
  color: #ffffff;
  box-shadow: 0 4px 16px rgba(0, 126, 45, 0.42);
}

/* ====================================================
   CARTÃO DO MILITANTE
==================================================== */
.worker-card {
  transition: border-color 0.2s, background-color 0.2s, transform 0.12s, box-shadow 0.2s;
  touch-action: manipulation;
}

.worker-card:active {
  transform: scale(0.99);
}

.worker-card.is-present {
  border-color: #86efac !important;
  background: linear-gradient(90deg, #f0fdf4 0%, #ffffff 100%);
  box-shadow: 0 2px 8px rgba(0, 126, 45, 0.08);
}

/* Botões de Ação Rápida (WhatsApp e Ligação) */
.btn-touch-action {
  width: 42px;
  height: 42px;
  min-width: 42px;
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  touch-action: manipulation;
  transition: transform 0.12s, background-color 0.15s, border-color 0.15s;
}

.btn-touch-action:active {
  transform: scale(0.92);
}

/* Barra Flutuante de Resumo no Rodapé do Celular */
.floating-mobile-bar {
  position: fixed;
  bottom: 12px;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 24px);
  max-width: 460px;
  z-index: 30;
  background: linear-gradient(135deg, #123c90 0%, #0055a7 100%);
  border: 1.5px solid rgba(252, 215, 0, 0.35);
  box-shadow: 0 12px 30px -4px rgba(18, 60, 144, 0.45);
}

/* Pills de Filtro Ativo */
.pill-active-todos {
  background-color: #0055a7 !important;
  color: #ffffff !important;
  box-shadow: 0 2px 8px rgba(0, 85, 167, 0.3) !important;
}

.pill-active-ausente {
  background-color: #eea41b !important;
  color: #ffffff !important;
  box-shadow: 0 2px 8px rgba(238, 164, 27, 0.35) !important;
}

.pill-active-presente {
  background-color: #007e2d !important;
  color: #ffffff !important;
  box-shadow: 0 2px 8px rgba(0, 126, 45, 0.35) !important;
}

/* Barra de Rolagem */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: #f1f5f9;
}
::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 9999px;
}
::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}