/* Base */
.wccg-fg-wrap{
  position: relative; /* necessário para overlays absolutos (picker) */
  padding:16px;
  margin:12px 0;
  font:14px/1.4 system-ui,-apple-system,Segoe UI,Roboto,Arial
}
.wccg-fg-toolbar{display:flex;gap:12px;align-items:center;justify-content:space-between;margin:0 0 12px}
.wccg-fg-left{display:flex;gap:8px;align-items:center}
.wccg-fg-right{display:flex;gap:8px;align-items:center}
.wccg-fg-breadcrumb{font-weight:600}
.wccg-fg-breadcrumb .wccg-fg-world{
	cursor:pointer;text-decoration: none;                  /* remove underline padrão */
	color: #BC955C; 
	font-weight: 600;
	border-bottom: 1px solid currentColor;  /* cria underline fino na cor do texto */
	transition: all 0.25s ease;             /* animação suave no hover */
}
.wccg-fg-breadcrumb .wccg-fg-world:hover{
	border-bottom-color: transparent;       /* esconde o sublinhado no hover */
 	color: #BC955C; 
}

.wccg-fg-select{min-width:200px;padding:6px 8px;border:1px solid #ddd;border-radius:8px}
.wccg-fg-body{display:block}
.wccg-fg-chart{width:100%; height: var(--h, 560px); border-radius:8px; overflow:hidden}
.wccg-fg-content{margin-top:12px;padding:12px;background:#fafafa}

/* RIGHT layout (desktop) */
.wccg-fg-wrap[data-mode="right"] .wccg-fg-body{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,38%);gap:16px;align-items:start
}
.wccg-fg-wrap[data-mode="right"] .wccg-fg-content{
  margin-top:10px;max-height:var(--h,560px);overflow-y:auto;overflow-x:hidden
}

/* Modal */
.wccg-fg-modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;z-index:9999}
.wccg-fg-modal[aria-hidden="false"]{display:flex}
.wccg-fg-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.4)}
.wccg-fg-modal__dialog{position:relative;background:#fff;max-width:960px;width:92%;max-height:85vh;overflow:auto;border-radius:12px;box-shadow:0 10px 40px rgba(0,0,0,.25)}
.wccg-fg-modal__close{position:absolute;top:8px;right:10px;font-size:24px;background:#fff;border:1px solid #ddd;border-radius:8px;cursor:pointer;line-height:1;width:36px;height:36px}
.wccg-fg-modal__body{padding:18px}

/* Tooltip: esconder o 1º item */
.wccg-fg-wrap .google-visualization-tooltip-item-list li:first-child{display:none!important}

/* --------- MOBILE/TABLET (<= 900px) --------- */
@media (max-width:900px){
  /* Sem layout em grelha, painel por baixo */
  .wccg-fg-wrap[data-mode="right"] .wccg-fg-body{display:block}
  .wccg-fg-wrap[data-mode="right"] .wccg-fg-content{margin-top:12px;max-height:none}

  /* Esconder mapa completamente */
  .wccg-fg-chart{display:none;height:0;border-radius:0}

  /* Toolbar mobile: sticky e em coluna */
  .wccg-fg-toolbar{
    position: sticky; /* <-- faltava, para o top funcionar */
    top:0; z-index:2;
    background:#fff; padding:8px 0 10px; margin:0 0 8px;
    flex-direction:column; align-items:stretch; gap:8px;
  }
  .wccg-fg-left{order:1}
  .wccg-fg-right{order:2; display:grid; grid-template-columns:1fr; gap:8px}

  /* Alvos de toque maiores e legíveis */
  .wccg-fg-select{
    min-width:unset; width:100%;
    padding:10px 12px; font-size:16px; line-height:1.2; min-height:44px;
    -webkit-tap-highlight-color:transparent;
  }
  .wccg-fg-breadcrumb{font-size:16px}

  /* Conteúdo: melhor legibilidade em mobile */
  .wccg-fg-content{
    background:#fff; /* remover cinza para contraste com o sticky */
    padding:0;       /* deixa o bloco renderizado controlar o espaçamento */
  }

  /* Modal: se existir, tornar full-bleed */
  .wccg-fg-modal__dialog{width:100%;max-width:none;border-radius:0;max-height:100vh}
  .wccg-fg-modal__body{padding:16px}

  /* Esconder picker das Américas em mobile (não há mapa) */
  .wccg-fg-americas-picker{display:none!important}
}

/* Picker para Américas (aparece ao clicar no continente 019 "Americas") */
.wccg-fg-americas-picker{
	z-index: 9999;
  position:absolute;
  right:12px; top:12px;
  display:flex; gap:8px; align-items:center;
  background:#ffffff; border:1px solid #e5e5e5; border-radius:10px;
  box-shadow:0 8px 24px rgba(0,0,0,.12);
  padding:8px; z-index:5;
}
.wccg-fg-americas-picker .wccg-am-btn{
  appearance:none; -webkit-appearance:none;
  border:1px solid #ddd; border-radius:8px;
  padding:8px 10px; font:500 14px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial;
  background:#f8f8f8; cursor:pointer;
}
.wccg-fg-americas-picker .wccg-am-btn:hover{ background:#f0f0f0 }
.wccg-fg-americas-picker .wccg-am-close{
  border:none; background:#fff; font-size:18px; line-height:1;
  width:28px; height:28px; border-radius:6px; cursor:pointer; border:1px solid #e5e5e5;
}


.wccg-icons-inline{
  display:inline-flex;
  align-items:flex-start;
  gap: 8px 16px;        /* espaço entre “cartõezinhos” (ícone+texto) */
  flex-wrap:wrap;
}

.wccg-icon{
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  max-width: 62px;
}

.wccg-icon svg{
  width: var(--icon-w, 1.2em);
  height: var(--icon-w, 1.2em);
  margin: var(--icon-space, 0);  /* “espaço à volta” do próprio ícone */
}

.wccg-icon-label{
  margin-top: 4px;
  font-size: 12px;
  line-height: 1.2;
  color: #BC955C;
}

.contactblock {
	background-color: #FBFAF8;
	color:#7B868C;
	font-size:13px;
}


.wccg-fg-columns {
    display: flex;
    gap: 24px;
    align-items: flex-start;
}

.wccg-fg-col {
    min-width: 0;
}

.wccg-fg-col-left {
    flex: 1 1 65%;
}

.wccg-fg-col-right {
    flex: 1 1 35%;
}

/* legenda em cima, conteúdo em baixo */
.rightcontent .legend {
    margin-bottom: 12px;
	display: flex;
    flex-direction: row;
    justify-content: space-evenly;
}

/* se quiseres scroll apenas no conteúdo */
.rightcontent .wccg-fg-content {
    max-height: 500px;          /* ajusta à necessidade */
    overflow-y: auto;
}

/* responsivo: empilhar em mobile */
@media (max-width: 768px) {
    .wccg-fg-columns {
        flex-direction: column;
    }
}

@media (max-width: 575.98px) {
    .wccg-icons-inline {
        gap: 8px 10px;
    }
	.wccg-fg-col-left {
		width: 100%;
	}
	
}

