/* ============================================================
   KCB SÚMULAS — base visual compartilhada
   Alinhada ao KCB Principal e ao módulo KCB Inscrições.
   Alterações de identidade visual devem começar por este arquivo.
   ============================================================ */

:root {
  --primary: #c83636;
  --primary-d: #a02828;
  --primary-l: rgba(200, 54, 54, 0.08);
  --secondary: rgba(249, 0, 0, 0.53);
  --dark: #252525;
  --gray: #777777;
  --gray-l: #aaaaaa;
  --light: #f8f8f8;
  --border: #e5e5e5;
  --white: #ffffff;
  --gold: #d4a017;
  --gold-l: rgba(212, 160, 23, 0.12);
  --silver: #8e9aaf;
  --silver-l: rgba(142, 154, 175, 0.12);
  --bronze: #b86a2e;
  --bronze-l: rgba(184, 106, 46, 0.12);
  --green: #16a34a;
  --green-l: rgba(22, 163, 74, 0.10);
  --amber: #d97706;
  --amber-l: rgba(217, 119, 6, 0.10);
  --ok-txt: #146c37;
  --ok-fundo: #eafaf1;
  --atencao-txt: #a05a00;
  --atencao-fundo: #fdf3e6;
  --erro-txt: #a02828;
  --erro-fundo: #fdf3f2;
  --info-txt: #2980b9;
  --info-fundo: #eaf3fb;
  --shadow: 0 2px 12px rgba(0,0,0,0.07);
  --shadow-lg: 0 8px 32px rgba(0,0,0,0.10);
  --radius: 8px;
  --radius-lg: 12px;
}

*, *::before, *::after { box-sizing: border-box; }
html { font-family: 'Inter', 'Segoe UI', sans-serif; }
body { margin: 0; color: var(--dark); background: var(--light); }
button, input, select, textarea { font: inherit; }
button { touch-action: manipulation; }
a { color: inherit; }

/* Utilitários pequenos substituem style="..." no HTML. */
.is-hidden { display: none !important; }
.icon-gap { margin-right: 8px; }
.icon-gap-sm { margin-right: 4px; }
.icon-accent { color: var(--primary); }
.icon-muted { color: #dddddd; }
.app-user-icon { font-size: 20px; color: #dddddd; }
.table-scroll { overflow-x: auto; }
.text-muted-xs { color: var(--gray); font-size: 11px; font-weight: 400; }
.field-compact { margin-bottom: 16px; }
.field-filter-evento { max-width: 280px; margin-bottom: 16px; }
.card-narrow { max-width: 480px; }

/* Logo oficial usado também pelo KCB Principal e Inscrições. */
.kcb-logo, .header-logo, .app-logo { object-fit: contain; }

/* Botões: mesma família visual do restante do KCB. */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid transparent;
  border-radius: 5px;
  padding: 9px 16px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  transition: background .2s, border-color .2s, color .2s, box-shadow .2s, transform .2s;
}
.btn:hover { transform: translateY(-1px); }
.btn:disabled { opacity: .55; cursor: not-allowed; transform: none; }
.btn-primary { background: var(--primary); border-color: var(--primary); color: var(--white); }
.btn-primary:hover { background: var(--primary-d); border-color: var(--primary-d); }
.btn-secondary { background: #eeeeee; border-color: #eeeeee; color: var(--dark); }
.btn-secondary:hover { background: #e4e4e4; border-color: #e4e4e4; }
.btn-success { background: var(--ok-txt); border-color: var(--ok-txt); color: var(--white); }
.btn-success:hover { filter: brightness(.92); }
.btn-danger { background: var(--primary); border-color: var(--primary); color: var(--white); }
.btn-danger:hover { background: var(--primary-d); border-color: var(--primary-d); }
.btn-sm { padding: 6px 10px; font-size: 11px; }
.btn-icon-neutral { background: #f0f0f0; border-color: #f0f0f0; color: #333333; }
.btn-icon-neutral:hover { background: #e5e5e5; border-color: #e5e5e5; }

/* Modais do módulo seguem a mesma linguagem. */
.kcb-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(0,0,0,.50);
}
.kcb-modal-overlay.open { display: flex; }
.kcb-modal-card {
  width: 100%;
  max-width: 480px;
  padding: 28px;
  border-radius: var(--radius-lg);
  background: var(--white);
  box-shadow: var(--shadow-lg);
}
.kcb-modal-title { margin: 0 0 20px; font-size: 16px; }
.kcb-modal-actions { display: flex; gap: 10px; justify-content: flex-end; }
.kcb-modal-card .field { margin-bottom: 14px; }
.kcb-modal-card .field:last-of-type { margin-bottom: 20px; }
.kcb-modal-card input { width: 100%; }

/* Tabelas e textos auxiliares. */
.cell-id { color: var(--gray); font-size: 12px; }
.cell-strong { font-weight: 600; }
.cell-muted { color: var(--gray); font-size: 12px; }
.cell-small { font-size: 12px; }
.cell-nowrap { white-space: nowrap; }
.cell-category { font-size: 13px; font-weight: 500; }
.cell-action-note { color: var(--gray); font-size: 11px; }
.empty-table-cell { text-align: center; color: var(--gray); padding: 24px; font-size: 13px; }
.empty-table-cell i { margin-right: 6px; }

/* Mensagens de formulário. */
.form-message {
  display: none;
  margin-bottom: 16px;
  padding: 10px 14px;
  border-radius: var(--radius);
  font-size: 13px;
  font-weight: 500;
}

/* Acessibilidade: foco coerente em todo o módulo. */
:where(button, a, input, select, textarea):focus-visible {
  outline: 3px solid rgba(200,54,54,.20);
  outline-offset: 2px;
}

@media (max-width: 720px) {
  .kcb-modal-card { padding: 22px; }
}

/* ============================================================
   ETAPA 16.4 — revisão geral de legibilidade
   Tipografia ampliada para desktop e dispositivos móveis.
   ============================================================ */
html{font-size:16px}
body{font-size:16px;line-height:1.45}
.text-muted-xs{font-size:13px}
.btn{font-size:14px;padding:10px 17px}
.btn-sm{font-size:13px;padding:7px 11px}
.kcb-modal-title{font-size:19px}
.cell-id,.cell-muted,.cell-small{font-size:14px}
.cell-category{font-size:15px}
.cell-action-note{font-size:13px}
.empty-table-cell{font-size:15px}
.form-message{font-size:14px;line-height:1.5}
@media(max-width:720px){
  body{font-size:16px}
  .btn{font-size:14px}
}

/* ============================================================
   ETAPA 16.6 — reforço geral de legibilidade
   ============================================================ */
html{font-size:17px}
body{font-size:17px;line-height:1.5}
.text-muted-xs{font-size:14px}
.btn{font-size:15px;padding:11px 18px}
.btn-sm{font-size:14px;padding:8px 12px}
.kcb-modal-title{font-size:20px}
.cell-id,.cell-muted,.cell-small{font-size:15px}
.cell-category{font-size:16px}
.cell-action-note{font-size:14px}
.empty-table-cell{font-size:16px}
.form-message{font-size:15px;line-height:1.55}
@media(max-width:720px){
  html,body{font-size:17px}
  .btn{font-size:15px}
}