/* ==========================================================================
   ANIVERSARIANTES
   Grid de cartões, não tabela: o que o dono procura aqui é a cara do cliente e
   quantos dias faltam, e cartão mostra os dois de longe. Quem faz hoje ganha
   moldura laranja e fica no começo da lista.
   Os selos, badges de nota RFM, avatar e botão de WhatsApp são os mesmos da
   Matriz RFM (rfm.css): mesma informação, mesma aparência nas duas telas.
   ========================================================================== */

.aniv-filtros { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; margin-bottom: 4px; }
.aniv-filtros .form-input { min-width: 240px; }

/* --- Grid de cartões ----------------------------------------------------- */
.aniv-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
  gap: 14px;
  margin-top: 16px;
}

.aniv-card {
  position: relative;
  display: flex; flex-direction: column; gap: 12px;
  padding: 16px;
  border: 1px solid var(--line); border-radius: 12px;
  background: var(--bg-card, #FFF);
  text-align: left; font: inherit; color: inherit; cursor: pointer; width: 100%;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.aniv-card:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(15, 23, 42, 0.12); border-color: var(--border-orange, rgba(250, 57, 9,0.35)); }
.aniv-card:focus-visible { outline: 2px solid var(--kortei-orange-500, #FA3909); outline-offset: 2px; }

/* Aniversário de hoje: o cartão inteiro muda de moldura e de fundo, para o dono
   achar a informação sem ler cartão por cartão. */
.aniv-card--hoje { border-color: var(--kortei-orange-500, #FA3909); background: var(--kortei-orange-50, #FFF5F3); }
.aniv-card--hoje:hover { box-shadow: 0 8px 22px rgba(250, 57, 9, 0.22); }

.aniv-card-topo { display: flex; align-items: center; gap: 12px; }
.aniv-card-nome { font-weight: 700; font-size: 14.5px; line-height: 1.3; }
.aniv-card-data { color: var(--text-2); font-size: 12.5px; display: flex; align-items: center; gap: 6px; margin-top: 3px; }
.aniv-card-data svg { flex: 0 0 auto; }
.aniv-card-identidade { min-width: 0; flex: 1; }

/* --- Contagem regressiva ------------------------------------------------- */
.aniv-contagem {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 6px 12px; border-radius: 999px;
  font-size: 12.5px; font-weight: 700; white-space: nowrap;
  background: var(--bg-card-subtle, #F8FAFC); border: 1px solid var(--line); color: var(--text-2);
  align-self: flex-start;
}
.aniv-contagem svg { flex: 0 0 auto; }
.aniv-contagem--hoje { background: var(--kortei-orange-500, #FA3909); border-color: transparent; color: #FFF; }
.aniv-contagem--perto { background: #FEF3C7; border-color: #FCD34D; color: #92400E; }
/* Tarefa cumprida: verde de "feito", não o laranja que ainda pede ação. */
.aniv-contagem--feito { background: #DCFCE7; border-color: #86EFAC; color: #166534; }

/* Linha da tarefa já concluída na Tarefas do Dia: continua visível, para o dono
   ver quem já foi parabenizado, mas recuada para não competir com o que falta. */
.tarefa-row--feita { opacity: 0.72; }

/* A linha do aniversário carrega três botões, mais que as outras tarefas. Ela
   quebra pela largura que tem de verdade, não pela do navegador: dentro do
   painel a coluna de conteúdo é bem mais estreita que a janela, e uma media
   query olharia para o número errado e deixaria o nome espremido mesmo assim. */
.tarefa-row--aniversario { flex-wrap: wrap; }
.tarefa-aniv-dados { flex: 1 1 210px; min-width: 0; }
.tarefa-aniv-acoes {
  display: flex; gap: 6px; align-items: center;
  flex-wrap: wrap; justify-content: flex-end; margin-left: auto;
}

.aniv-selos { display: flex; gap: 6px; flex-wrap: wrap; }

/* --- Números do cliente -------------------------------------------------- */
.aniv-card-dados {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px;
  padding-top: 12px; border-top: 1px solid var(--line);
}
.aniv-dado small { display: block; color: var(--text-2); font-size: 11px; line-height: 1.5; }
.aniv-dado strong { display: block; font-size: 13.5px; font-weight: 700; margin-top: 2px; }
.aniv-dado strong.aniv-destaque { color: var(--kortei-orange-600, #D73108); }
.aniv-dado-nota { display: flex; align-items: center; gap: 6px; margin-top: 3px; flex-wrap: wrap; }

.aniv-card-rodape { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }

.aniv-vazio { text-align: center; color: var(--text-2); padding: 40px 12px; }

@media (max-width: 560px) {
  .aniv-grid { grid-template-columns: 1fr; }
}