/* Blocos que só aparecem para quem ligou a conta de anúncio (01/11/2026): Gerenciador, Início, Funil, Eventos.
   Quem não ligou não vê nada disto. Mesmo desenho do Balanço. */
#roas, #inicioV2, #funil, #eventos, .gz-janela { --an-tinta: #10201c; --an-mudo: #53635d; --an-linha: #dde8e3; --an-linha2: #e8f0ec; --an-verde: #0b7a57; --an-claro: #e6f4ee; --an-teal: #013735; --an-ambar: #e0a526; }

/* ----------------------------------------------- Gerenciador: resumo do alto */
#roas .gz-resumo { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); background: #fff; border: 1px solid var(--an-linha); border-radius: 18px; margin: 0 0 14px; }
#roas .gz-resumo[hidden], #roas:not([data-vista="campanhas"]) .gz-resumo { display: none !important; }
#roas .gz-resumo > div { padding: 15px 20px; border-left: 1px solid var(--an-linha2); min-width: 0; }
#roas .gz-resumo > div:first-child { border-left: 0; }
#roas .gz-resumo span { display: block; font-size: 12.5px; font-weight: 700; color: var(--an-mudo); }
#roas .gz-resumo strong { display: block; margin-top: 2px; font: 800 25px/1.2 'Outfit', 'Nunito Sans', sans-serif; font-variant-numeric: tabular-nums; color: var(--an-tinta); }
#roas .gz-resumo small { display: block; font-size: 12.5px; color: var(--an-mudo); line-height: 1.3; }
#roas .gz-resumo small a { color: var(--an-verde); font-weight: 700; }
#roas .gz-resumo p { grid-column: 1 / -1; margin: 0; padding: 11px 20px 12px; border-top: 1px solid var(--an-linha2); border-radius: 0 0 18px 18px; background: #fff6e0; color: #8a5a00; font-size: 13.5px; line-height: 1.45; }
#roas .gz-resumo p b { color: #6b4500; }
#roas .gz-resumo p button { border: 0; background: none; padding: 0; min-height: 0; color: #6b4500; font-size: inherit; font-weight: 800; text-decoration: underline; cursor: pointer; }

/* A caixinha: fica embaixo do nome, com texto, longe do botão que liga e desliga a campanha. */
#roas .gz-conta { display: flex; align-items: center; gap: 7px; margin-top: 9px; font-size: 13px; font-weight: 700; color: var(--an-tinta); white-space: nowrap; cursor: pointer; }
#roas .gz-conta input { width: 16px; height: 16px; margin: 0; flex: none; accent-color: var(--an-verde); }
#roas .gz-conta input:disabled { cursor: not-allowed; }
#roas .gz-conta.falta { width: fit-content; padding: 4px 9px 4px 7px; border-radius: 8px; background: #fff6e0; border: 1px solid #f3dfa8; color: #6b4500; white-space: normal; line-height: 1.25; }
#roas .gz-nova { padding: 1px 7px; border-radius: 999px; background: var(--an-claro); color: var(--an-verde); font-size: 11.5px; font-weight: 800; }
#roas tr.gz-fora > td:not(.col-nome):not(.col-sel) { color: #8b9a94; }
#roas tr.gz-fora > td:not(.col-nome):not(.col-sel) * { opacity: .72; }
#roas .barra-selecao [hidden] { display: none !important; }

#roas .gz-novas { margin: 12px 0 0; padding: 12px 16px 12px; border: 1px solid var(--an-linha2); border-radius: 14px; background: #fff; }
#roas .gz-novas legend { padding: 0 6px; font: 800 14.5px/1.3 'Outfit', 'Nunito Sans', sans-serif; color: var(--an-tinta); }
#roas .gz-novas label { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 10px; align-items: start; padding: 7px 0; font-size: 14px; font-weight: 700; color: var(--an-tinta); cursor: pointer; }
#roas .gz-novas input { width: 16px; height: 16px; margin: 3px 0 0; accent-color: var(--an-verde); }
#roas .gz-novas small { display: block; font-size: 13px; font-weight: 600; color: var(--an-mudo); line-height: 1.35; }

/* ----------------------------------------------- Início: Seus anúncios na Meta */
html body.rottads-interface #inicioV2 .v2i-anuncios { display: grid; gap: 14px; min-width: 0; }
html body.rottads-interface #inicioV2 .v2i-an-cab { margin: 6px 2px 0; flex-wrap: wrap; }
html body.rottads-interface #inicioV2 .v2i-an-cab h2 { flex: 0 1 auto; font-size: 20px; }
html body.rottads-interface #inicioV2 .v2i-an-quando { display: inline-flex; align-items: center; gap: 7px; flex: 1 1 auto; min-width: 0; font-size: 13px; font-weight: 700; color: var(--an-mudo); }
html body.rottads-interface #inicioV2 .v2i-an-quando i { width: 8px; height: 8px; border-radius: 50%; background: var(--an-verde); flex: none; }
html body.rottads-interface #inicioV2 .v2i-an-quando.velho i { background: var(--an-ambar); }
html body.rottads-interface #inicioV2 .v2i-an-falta { font-family: 'Outfit', 'Nunito Sans', sans-serif; font-size: 22px; font-weight: 700; line-height: 1.2; color: var(--an-mudo); }
html body.rottads-interface #inicioV2 .v2i-an-aviso { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; padding: 12px 16px; border-radius: 12px; background: #fff6e0; border: 1px solid #f3dfa8; color: #8a5a00; font-size: 14px; line-height: 1.5; }
html body.rottads-interface #inicioV2 .v2i-an-aviso > span { flex: 1 1 320px; min-width: 0; }
html body.rottads-interface #inicioV2 .v2i-an-aviso b { color: #6b4500; }
html body.rottads-interface #inicioV2 .v2i-an-aviso button { border: 0; background: none; padding: 0; min-height: 0; color: #6b4500; font-weight: 800; text-decoration: underline; cursor: pointer; }

/* ----------------------------------------------- Funil: do anúncio à entrega */
#funil .fn-faixa { background: #fff; border: 1px solid var(--an-linha); border-radius: 18px; padding: 16px 20px 18px; margin: 0 0 16px; }
#funil .fn-faixa[hidden] { display: none !important; }
#funil .fn-cab { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; margin-bottom: 12px; }
#funil .fn-cab b { font: 800 16.5px/1.25 'Outfit', 'Nunito Sans', sans-serif; color: var(--an-tinta); }
#funil .fn-cab span { font-size: 13px; color: var(--an-mudo); }
#funil .fn-etapas { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; list-style: none; margin: 0; padding: 0; }
#funil .fn-etapas li { position: relative; min-width: 0; padding: 12px 14px; border-radius: 14px; background: #f3f8f5; }
#funil .fn-etapas li:not(:last-child)::after { content: ''; position: absolute; z-index: 1; right: -11px; top: 50%; width: 14px; height: 14px; margin-top: -7px; border-top: 2px solid #9fbdb0; border-right: 2px solid #9fbdb0; transform: rotate(45deg) scale(.7); }
#funil .fn-etapas li:first-child { background: var(--an-teal); }
#funil .fn-etapas li:first-child span, #funil .fn-etapas li:first-child small { color: #a9d2c4; }
#funil .fn-etapas li:first-child strong { color: #fff; }
#funil .fn-etapas li:last-child { background: var(--an-claro); }
#funil .fn-etapas span { display: block; font-size: 12.5px; font-weight: 800; color: var(--an-mudo); }
#funil .fn-etapas strong { display: block; margin: 2px 0; font: 700 24px/1.15 'Outfit', sans-serif; font-variant-numeric: tabular-nums; color: var(--an-tinta); white-space: nowrap; }
#funil .fn-etapas small { display: block; font-size: 12.5px; color: var(--an-mudo); line-height: 1.3; font-variant-numeric: tabular-nums; }


/* ----------------------------------------------- Vendas por estado: Anúncios na Meta */
#vendas-estados .ve-met-an { display: flex; flex-wrap: wrap; width: fit-content; max-width: 100%; align-items: center; margin-top: -4px; }
#vendas-estados .ve-met-rot { padding: 0 8px 0 10px; font-size: 12.5px; font-weight: 800; letter-spacing: .02em; color: var(--ve-tinta-3); white-space: nowrap; }
#vendas-estados .ve-atencao { margin-top: 14px; padding: 12px 14px; border-radius: 12px; background: #fff6e0; border: 1px solid #f3dfa8; color: #8a5a00; font-size: 13.5px; line-height: 1.45; }
#vendas-estados .ve-atencao b { color: #6b4500; }
#vendas-estados .ve-tab-troca { display: inline-flex; gap: 2px; padding: 3px; border-radius: 11px; background: #f1f6f3; border: 1px solid var(--ve-linha-2); }
#vendas-estados .ve-tab-troca button { border: 0; background: none; padding: 5px 12px; border-radius: 8px; font-size: 13px; font-weight: 700; color: var(--ve-tinta-3); cursor: pointer; }
#vendas-estados .ve-tab-troca button[aria-pressed="true"] { background: #fff; color: #016b43; box-shadow: 0 1px 2px rgba(1, 55, 53, .12); }
#vendas-estados .ve-leg-extra i.ve-gastou { background: repeating-linear-gradient(135deg, #f07259 0 2px, rgba(240, 114, 89, .18) 2px 4px); }

/* Ajudante do código da campanha */
.gz-janela { position: fixed; inset: 0; z-index: 1200; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(1, 35, 33, .45); }
.gz-caixa { width: min(620px, 100%); max-height: calc(100vh - 32px); overflow: auto; padding: 22px 24px; border-radius: 18px; background: #fff; color: var(--an-tinta); font-size: 14.5px; line-height: 1.5; }
.gz-caixa h3 { margin: 0 0 8px; font: 800 19px/1.25 'Outfit', 'Nunito Sans', sans-serif; text-transform: none; letter-spacing: 0; color: inherit; }
.gz-caixa p { margin: 0 0 10px; }
.gz-caixa ol { margin: 0 0 10px; padding-left: 20px; }
.gz-caixa .mini { color: var(--an-mudo); font-size: 13px; }
.gz-codigo { display: block; padding: 10px 12px; border-radius: 10px; background: #f3f8f5; border: 1px solid var(--an-linha2); font-size: 12.5px; line-height: 1.5; word-break: break-all; user-select: all; }
.gz-acoes { display: flex; justify-content: flex-end; gap: 8px; margin: 10px 0; }
.gz-acoes:last-child { margin-bottom: 0; }

@media (max-width: 900px) {
  #roas .gz-resumo { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #roas .gz-resumo > div:nth-child(odd) { border-left: 0; }
  #roas .gz-resumo > div:nth-child(n+3) { border-top: 1px solid var(--an-linha2); }
  #funil .fn-etapas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #funil .fn-etapas li:first-child { grid-column: 1 / -1; }
  #funil .fn-etapas li::after { display: none; }
}
