/* I Belong — camada de aplicação sobre o Duralux (tokens do tema + accent de marca).
   Regra: nenhuma cor/espessura fora dos tokens Duralux/Bootstrap; accent ouro #d4a017
   é a cor de marca já estabelecida no app (brand "I Belong"). */
:root {
  --ib-gold: #d4a017;
  --ib-ink: #283c50;      /* token de texto do Duralux */
  --ib-muted: #6b7885;    /* tokens de texto secundário do Duralux */
  --ib-ok: #157347;       /* verde Bootstrap-700 — AA 5.9:1 sobre branco */
  --ib-late: #b02a37;     /* vermelho Bootstrap-700 — AA 6.5:1 sobre branco */
}

body { background: #f4f6fa; }

/* Shell + topbar */
.app-shell { max-width: 1200px; margin: 0 auto; padding: 1.5rem; }
.topbar {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 1.5rem; padding-bottom: 1rem;
  border-bottom: 1px solid #e5e8ef;
}
.brand { font-size: 1.35rem; font-weight: 700; color: var(--ib-ink); letter-spacing: .01em; }
.brand span { color: var(--ib-gold); }

/* Avatar — substitui .avatar-text do tema (que força 40px com max/min-width).
   Mesma forma do tema, tamanhos controlados pela camada de app. */
.ib-avatar {
  display: flex; align-items: center; justify-content: center;
  border-radius: 100%; background: #3454d1; color: #fff; font-weight: 700;
  flex: 0 0 auto;
}
.ib-avatar-md { width: 56px; height: 56px; font-size: 1.4rem; }
.ib-avatar-lg { width: 64px; height: 64px; font-size: 1.6rem; }

/* Badges de tarefa — contraste WCAG AA (>= 4.5:1) */
.ib-badge-ok   { background: var(--ib-ok);   color: #fff; }
.ib-badge-late { background: var(--ib-late); color: #fff; }

/* Badges soft (fase/frequência/tags) — o tema força texto branco (var(--bs-badge-color));
   em fundo claro fica invisível (1.16:1). Texto colorido escuro → AA. */
.badge.bg-soft-primary { color: #3454d1; }  /* Duralux primary — 5.4:1 sobre #ebeefa */
.badge.bg-soft-info    { color: #0e7490; }  /* teal-700 — 4.7:1 sobre #dbf5f3 */
.badge.bg-soft-success { color: #157347; }  /* verde-700 — 5.4:1 sobre #e1fbed */
.badge.bg-soft-danger  { color: #b02a37; }  /* vermelho-700 — 5.7:1 sobre #fdeded */

/* Dot de tipo de tarefa (cores dos seeds de TaskType) */
.tt-dot { margin-right: .4rem; font-size: .9rem; }
.tt-contato          { color: #6f42c1; }
.tt-discipulado      { color: #0d6efd; }
.tt-primeira_conversa{ color: #fd7e14; }
.tt-retorno          { color: #198754; }
.tt-visita           { color: #dc3545; }

/* Indicadores rápidos — peso visual baixo para o bloco de tarefas dominar (D10) */
.ib-kpi { padding: .75rem .5rem; }
.ib-kpi .ib-kpi-value { font-size: 1.35rem; font-weight: 600; line-height: 1.2; color: var(--ib-ink); margin-bottom: .15rem; }
.ib-kpi .ib-kpi-label { font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: var(--ib-muted); margin-bottom: 0; }

/* Seção principal — Discipulados do Dia (RN-16: bloco dominante da tela) */
.ib-section-title {
  display: flex; align-items: center; gap: .6rem;
  font-weight: 700; color: var(--ib-ink); margin-bottom: 1rem;
}
.ib-section-title::before {
  content: ''; width: 4px; height: 1.35em; background: var(--ib-gold); border-radius: 2px;
}

/* Cartões de tarefa */
.ib-task-card { border: 1px solid #e5e8ef; transition: box-shadow .2s ease; }
.ib-task-card:hover { box-shadow: 0 4px 14px rgba(40, 60, 80, .08); }

/* Timeline — autoria discreta */
.ib-author { font-size: .8rem; }

/* Navegação do topbar — links simples, sem pill/badge (regra do produto) */
.topbar-link {
  color: var(--ib-muted); text-decoration: none; font-size: .92rem;
  padding: .25rem 0; border-bottom: 2px solid transparent;
}
.topbar-link:hover { color: var(--ib-ink); border-bottom-color: var(--ib-gold); }

/* Dot de categoria no catálogo de tags (sem inline styles) */
.ib-tag-dot {
  display: inline-block; width: 10px; height: 10px; border-radius: 100%;
  margin-right: .45rem; vertical-align: middle;
}
.ib-tag-dot-positiva { background: var(--ib-ok); }
.ib-tag-dot-atencao  { background: var(--ib-late); }
.ib-tag-dot-auto     { background: #3454d1; }

/* Relatórios — input de dias com largura fixa (sem inline style) */
.ib-days-input { width: 110px; }

/* Status de texto — AA sobre fundo claro (Duralux usa neon #17c666/#ea4d4d,
   que falham AA: 2.26:1 e 3.71:1). Paleta 700, mesmo padrão dos soft badges. */
html body .text-success { color: #157347 !important; }
html body .text-danger  { color: #b02a37 !important; }

/* Widget de aniversariantes (TASK-216) — compacto, sem pill, links diretos */
.ib-bday-item {
  padding: .3rem 0;
  border-bottom: 1px solid #f0f2f6;
  display: flex; justify-content: space-between; align-items: baseline; gap: .5rem;
}
.ib-bday-item:last-child { border-bottom: 0; }
.ib-bday-item a { color: var(--ib-ink); text-decoration: none; }
.ib-bday-item a:hover { color: var(--ib-gold); text-decoration: underline; }
.ib-bday-day { font-size: .75rem; color: var(--ib-muted); white-space: nowrap; }

/* Exemplo de CSV na importação (TASK-218) — sem inline styles (regra 6 do DS) */
.ib-csv-example {
  background: #f4f6fa; border: 1px solid #e5e8ef; border-radius: .375rem;
  padding: .75rem 1rem; font-size: .8rem; color: var(--ib-ink);
  overflow-x: auto; margin-bottom: 0;
}

/* Login do app (accounts/login.html, TASK-221) — sem inline styles (regra 6 do DS) */
.ib-login-card { width: 100%; max-width: 400px; }
.ib-login-title { color: var(--ib-ink); }