body {
  padding-top: 56px;
  min-height: 100vh;
  overflow-x: hidden;
}

/* Mobile: aplica padding no body e zera na sidebar */
@media (max-width: 991.98px) {
  body {
    padding-top: 56px; /* altura da navbar mobile */
  }
  .sidebar {
    padding-top: 0; /* zera o padding da sidebar no mobile */
  }
}

/* Sidebar padrão (desktop) */
.sidebar {
  width: 220px;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  padding-top: 56px; /* altura navbar desktop */
  background-color: #f8f9fa;
  border-right: 1px solid #dee2e6;
}

main.content {
  padding: 20px;
}

.pagination {
  flex-wrap: wrap;
}




/* Somente em telas grandes o conteúdo se desloca */
@media (min-width: 992px) {
  main.content {
    margin-left: 250px; /* desloca para caber a sidebar */
  }
}

/* =========================
   LANDING PAGE (index.html)
   ========================= */
body.landing {
  padding-top: 0 !important;      /* sem navbar mobile fixa aqui */
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

body.landing main.content {
  flex: 1;                        /* ocupa o resto da tela */
  margin: 0 !important;           /* sem deslocamento */
  padding: 0 !important;          /* remove a “moldura” */
  display: flex;
  flex-direction: column;
}

/* No desktop, não empurra o conteúdo (seu CSS empurra por causa da sidebar) */
@media (min-width: 992px) {
  body.landing main.content {
    margin-left: 0 !important;
  }
}

/* Cola o footer no final quando o conteúdo for curto */
body.landing footer {
  margin-top: auto;
}



/* Ajustes para telas pequenas */
@media (max-width: 768px) {
  .sidebar {
    width: 100%;         /* ocupa toda largura */
    height: auto;        /* altura automática */
    position: relative;  /* não mais fixa */
    border-right: none;  /* remove borda */
  }
  main.content {
    margin-left: 0;      /* remove o margin-left */
    padding: 10px;       /* opcional: ajustar padding para mobile */
  }
}