/* Clarear ícone do menu hamburguer */
.burger-icon,
.burger-icon span,
.burger-icon::before,
.burger-icon::after {
  display: block;
}

/* Estilização extra caso o ícone seja construído com spans */
.burger-icon span {
  height: 3px;
  width: 25px;
  margin: 5px 0;
  background-color: #e6c75c !important;
}



/* --- TABELA COM ROLAGEM HORIZONTAL NO MOBILE --- */
@media (max-width: 768px) {
  #cck3r {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border: 1px solid #ddd;
    border-radius: 8px;
  }

  #cck3r table {
    width: 100%;
    min-width: 600px; /* ajuste conforme o tamanho da sua tabela */
    border-collapse: collapse;
  }
}

/* --- AVISO DE ROLAGEM PARA O USUÁRIO NO MOBILE --- */
.aviso-scroll-mobile {
  display: none;
  text-align: center;
  font-size: 14px;
  color: #666;
  margin-bottom: 8px;
  font-style: italic;
  line-height: 1.4;
}

@media (max-width: 768px) {
  .aviso-scroll-mobile {
    display: block;
    animation: piscando 2s infinite;
  }

  @keyframes piscando {
    0%, 100% { opacity: 0.4; }
    50% { opacity: 1; }
  }
}

#sp-component {
  overflow-x: auto;
}

/* Removido o seletor "img" para não afetar ícones do mapa */
#sp-component object,
#sp-component svg,
#sp-component canvas {
  min-width: 600px;
  width: auto;
  max-width: none;
  height: auto;
  display: block;
}

#sp-component .sp-column > div[id^="chart_"] > div[style*="position: relative"] {
  margin-bottom: 60px;
}

#sp-component .sp-column > div[id^="chart_"]:first-of-type > div[style*="position: relative"] {
  margin-top: 80px;
}