.pet-eg {
  --bg: #fff;
  --fg: #222;
  --muted: #666;
  --border: #e3e7ee;
  --thead: #f6f8fb;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, 'Helvetica Neue', Arial, sans-serif;
  color: var(--fg);
}
@media (prefers-color-scheme: dark) {
  .pet-eg {
    --bg: #0c0d10;
    --fg: #e8e8ea;
    --muted: #a9adb6;
    --border: #2a2e35;
    --thead: #141720;
  }
}
.pet-eg .pet-toolbar {
  display: flex;
  gap: .75rem;
  align-items: center;
  margin: 1rem 0;
  flex-wrap: wrap;
}
.pet-eg .pet-search {
  padding: .6rem .75rem;
  border: 1px solid var(--border);
  border-radius: .5rem;
  width: min(460px, 90%);
  background: var(--bg);
  color: var(--fg);
}
.pet-eg .pet-hint { color: var(--muted); font-size: .9rem; }
.pet-eg .pet-count { margin-left: auto; color: var(--muted); }
.pet-eg table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid var(--border);
  background: var(--bg);
}
.pet-eg thead th {
  background: var(--thead);
  position: sticky;
  top: 0;
  z-index: 1;
  font-weight: 600;
}
.pet-eg th, .pet-eg td {
  padding: .6rem .75rem;
  border-bottom: 1px solid var(--border);
  text-align: left;
}
.pet-eg tbody tr:hover { background: rgba(11,107,242,0.04); }
.pet-eg th.pet-sortable { cursor: pointer; user-select: none; }
.pet-eg th.pet-sortable::after { content: ' \25B4\25BE'; color: #b9c0cc; font-size: .8em; padding-left: .25rem; }
/* === Banner Egressos com selo PET+20 anos === */
.eg-hero { position: relative; width:100%; min-height:320px; overflow:hidden; display:grid; place-items:center; }
.eg-hero-slides img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity 1s ease; }
.eg-hero-slides img.active { opacity:1; }
.eg-hero-overlay { position:absolute; inset:0; background:rgba(0,0,0,.35); }
.eg-hero-content { position:relative; z-index:2; text-align:center; color:#fff; }
.eg-hero-badge { position:absolute; bottom:1rem; right:1rem; z-index:3; }
/*.eg-hero-badge img { width:90px; height:auto; filter:drop-shadow(0 2px 6px rgba(0,0,0,.5)); }*/
.eg-hero-badge img { width: 100px; height: auto; }







  /* A tabela ocupa sua largura natural */
  .eg-host table, .pet-eg table {
    width: max-content;
    min-width: 100%;
    border-collapse: collapse;
  }

  /* As células não quebram, só rolam */
  .eg-host th, .eg-host td,
  .pet-eg th, .pet-eg td {
    white-space: nowrap;
  }
}




  .eg-host table, .pet-eg table {
    min-width: 700px;   /* força scroll no mobile */
    width: auto;
    border-collapse: collapse;
  }

  .eg-host th, .eg-host td,
  .pet-eg th, .pet-eg td {
    white-space: nowrap;
  }
}


/* === Ajuste última coluna no desktop === */
.eg-host th:last-child, .eg-host td:last-child,
.pet-eg th:last-child, .pet-eg td:last-child {
  max-width: 200px;
  white-space: normal !important;
  word-break: break-word;
}


/* === Mobile: força scroll horizontal real e largura maior que a tela === */
@media (max-width: 768px){
  /* Qualquer wrapper do bloco de egressos vira rolável */
  .conteudo .eg-host,
  .conteudo .pet-eg,
  .conteudo .eg-host .dataTables_wrapper,
  .conteudo .pet-eg .dataTables_wrapper {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    display: block;
  }

  /* A tabela não pode ficar limitada a 100%: precisa ser maior que a tela */
  .conteudo .eg-host table,
  .conteudo .pet-eg table,
  .conteudo .eg-host .dataTable,
  .conteudo .pet-eg .dataTable {
    width: max-content !important;
    min-width: 900px !important;  /* ajuste este valor se precisar */
    border-collapse: collapse;
  }

  /* Evita quebra de colunas; o usuário arrasta lateralmente */
  .conteudo .eg-host th, .conteudo .eg-host td,
  .conteudo .pet-eg th, .conteudo .pet-eg td {
    white-space: nowrap;
  }
}


/* === Ajuste final da tabela de egressos === */
.eg-host th:last-child, .eg-host td:last-child,
.pet-eg th:last-child, .pet-eg td:last-child {
  max-width: 200px;
  white-space: normal !important;
  word-break: break-word;
}
