/* Estilo geral do container do shortcode */
#mapa-representantes-container {
  display: flex;
  flex-wrap: nowrap;
  gap: 50px;
  align-items: flex-start;
}

.mapa-brasil{
    width: 100%;
}

#mapa-brasil svg {
  width: 100%;
  height: auto;
}


#mapa-brasil svg text {
    fill: #fff;
    font-size: 10px;
    cursor: pointer;
    font-family: 'Outfit', sans-serif;
    font-weight: 400;
    stroke-width: 0;
}

#mapa-brasil .circle { fill: var( --e-global-color-accent ); }

#mapa-brasil svg text {
    fill: #fff;
    font-size: 10px;
    cursor: pointer;
    font-family: 'Outfit', sans-serif;
    font-weight: 400;
    stroke-width: 0;
}

#mapa-brasil svg [id] {
  cursor: pointer;
  transition: fill 0.3s ease;
  fill: var( --e-global-color-primary );
  stroke: #fff;
  stroke-width: 1px;
}

#mapa-brasil svg [id]:hover {
 fill: var( --e-global-color-accent );
}

#mapa-brasil svg [id].ativo {
  fill: var( --e-global-color-accent );
}

#lista-representantes {
    width: 100%;
    font-family: "Outfit", Sans-serif;
    font-weight: 400;
}
.titulo-resposta {
    margin: 0 0 4px;
}

.representante {
    background: #f7f7f7;
    border: 1px solid #dfdfdf;
    padding: 14px 20px;
    border-radius: 10px;
    margin-bottom: 20px;
}

.representante h4 {
    font-size: 18px !important;
    margin: 0 0 6px !important;
    color: var(--e-global-color-primary) !important;
}
.representante p {
    margin: 0;
	font-size: 14px;
}

/* Responsivo */
@media (max-width: 1024px) {
  #mapa-representantes-container {
    flex-direction: column;
    gap:20px
  }

}

/* Oculta o select no desktop */
.estado-mobile-select {
  display: none;
}

/* Mostra o select apenas em telas pequenas */
@media (max-width: 1024px) {
  #mapa-brasil {
    display: none; /* esconde o mapa */
  }

  .estado-mobile-select {
        display: block;
        width: 100%;
        padding: 10px;
        font-size: 16px;
        margin-bottom: 20px;
        border-radius: 100px;
        font-family: 'Outfit', sans-serif;
        border: 1px solid #cecece;
        color: var( --e-global-color-primary );
    }
}