/* Jornada personalizada, botão Analisar área, filtros avançados, tour, simulação e aba Operadora */

/* ---- Analisar área */
.btn-analisar { font-weight: 600; padding: .6rem 1rem; box-shadow: 0 6px 18px rgba(22, 163, 74, .25); }
.btn-analisar.pulsar { animation: pulsar 1.6s ease-in-out infinite; }
@keyframes pulsar { 0%, 100% { box-shadow: 0 0 0 0 rgba(22, 163, 74, .55); } 50% { box-shadow: 0 0 0 10px rgba(22, 163, 74, 0); } }
@media (prefers-reduced-motion: reduce) { .btn-analisar.pulsar { animation: none; outline: 2px solid #16A34A; outline-offset: 2px; } }
#raioPlano { margin-top: .15rem; }
#raioPlano i { color: var(--acento); }

/* ---- tela vazia até analisar */
#abaPanorama.aguardando > :not(#panoramaVazio) { display: none !important; }
#abaPanorama:not(.aguardando) > #panoramaVazio { display: none; }
.vazio-inicial { text-align: center; padding: 56px 20px; border: 1.5px dashed var(--borda); border-radius: 16px; background: var(--superficie); color: var(--tinta-2); }
.vazio-inicial > i { font-size: 2.4rem; color: var(--acento); }
.vazio-inicial h3 { font-size: 1.25rem; font-weight: 700; color: var(--tinta); margin: .6rem 0 .4rem; }
.vazio-inicial p { max-width: 38rem; margin: 0 auto 1rem; }

/* ---- filtros avançados */
.filtros-avancados { border-top: 1px solid var(--borda); padding-top: .75rem; }
.filtros-avancados summary { cursor: pointer; list-style: none; }
.filtros-avancados summary::-webkit-details-marker { display: none; }
.filtros-avancados summary::after { content: "\F282"; font-family: bootstrap-icons; float: right; transition: transform .2s; }
.filtros-avancados[open] summary::after { transform: rotate(180deg); }
.chip-filtro { border: 1px solid var(--borda); background: var(--superficie); color: var(--tinta-2); border-radius: 999px; padding: .15rem .6rem; font-size: .75rem; line-height: 1.5; }
.chip-filtro:hover { border-color: var(--acento); color: var(--tinta); }
.chip-filtro.ativo { background: var(--acento); border-color: var(--acento); color: #fff; }

/* ---- personalização (modal) */
.escolhas { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
.escolha { text-align: left; border: 1.5px solid var(--borda); border-radius: 14px; background: var(--superficie); padding: 14px; display: flex; flex-direction: column; gap: .25rem; transition: border-color .15s, transform .15s; }
.escolha:hover, .escolha:focus-visible { border-color: var(--acento); transform: translateY(-2px); }
.escolha i { font-size: 1.5rem; color: var(--acento); }
.escolha b { color: var(--tinta); }
.escolha span { font-size: .8rem; color: var(--tinta-2); }
.escolha.sugerida { box-shadow: 0 0 0 1.5px var(--acento) inset; }
.escolha.sugerida::after { content: "Sugerido"; font: 600 .6rem var(--f-mono); text-transform: uppercase; letter-spacing: .1em; color: var(--acento); }

/* ---- carrossel de perfis */
.carrossel-perfis { border-radius: 18px; overflow: hidden; }
.slide-perfil { display: flex; gap: 16px; padding: 16px 52px 30px; color: #fff; min-height: 0; background: #0D1418 linear-gradient(135deg, rgba(34, 211, 238, .35), rgba(59, 130, 246, .35) 55%, rgba(168, 85, 247, .4)); }
.slide-perfil.perfil-marketing { background: #0D1418 linear-gradient(135deg, rgba(244, 114, 182, .35), rgba(168, 85, 247, .4)); }
.slide-perfil.perfil-operadora { background: #0D1418 linear-gradient(135deg, rgba(22, 163, 74, .4), rgba(8, 145, 178, .38)); }
.slide-perfil .rotulo-mono { color: #CBD5E1; }
.slide-perfil h2 { font-size: 1.05rem; font-weight: 700; margin: .2rem 0 .3rem; color: #fff; }
.slide-perfil p { color: #E2E8F0; margin-bottom: .6rem; }
.slide-icone { width: 42px; height: 42px; flex: 0 0 42px; border-radius: 12px; background: rgba(255, 255, 255, .14); display: grid; place-items: center; font-size: 1.6rem; }
.slide-jornada { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .15rem 1rem; padding-left: 1.1rem; font-size: .78rem; color: #E2E8F0; margin-bottom: .9rem; }
.badge-modo { display: inline-flex; align-items: center; gap: .3rem; background: rgba(255, 255, 255, .16); border-radius: 999px; padding: .25rem .7rem; font-size: .8rem; }
.carrossel-perfis .carousel-control-prev, .carrossel-perfis .carousel-control-next { width: 48px; }
@media (max-width: 575px) { .slide-perfil { flex-direction: column; padding: 20px 44px 40px; } }

/* ---- tour guiado */
.tour-fundo { position: fixed; inset: 0; z-index: 1080; }
.tour-foco { position: fixed; z-index: 1081; border-radius: 12px; box-shadow: 0 0 0 9999px rgba(13, 20, 24, .62); outline: 2px solid var(--acento); pointer-events: none; transition: all .25s ease; }
.tour-cartao { position: fixed; z-index: 1082; width: min(340px, calc(100vw - 24px)); background: var(--superficie); color: var(--tinta); border-radius: 14px; padding: 14px 16px; box-shadow: 0 20px 50px rgba(0, 0, 0, .35); }

/* ---- simulação */
.sim-faixa { background: repeating-linear-gradient(45deg, #FEF3C7, #FEF3C7 12px, #FDE68A 12px, #FDE68A 24px); color: #78350F; font: 600 .72rem var(--f-mono); letter-spacing: .06em; text-transform: uppercase; padding: 6px 12px; border-radius: 10px; margin-bottom: 10px; }
.sim-perfis { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.sim-perfil { border: 1px solid var(--borda); background: var(--superficie); border-radius: 999px; padding: .25rem .8rem; font-size: .85rem; color: var(--tinta-2); }
.sim-perfil.ativo { background: var(--degrade); color: #fff; border-color: transparent; }
.sim-passos { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; font: 500 .7rem var(--f-mono); text-transform: uppercase; letter-spacing: .06em; }
.sim-passos span { padding: 3px 9px; border-radius: 999px; border: 1px solid var(--borda); color: var(--tinta-3); }
.sim-passos .atual { border-color: var(--acento); color: var(--acento); }
.sim-passos .feito { background: var(--suave); color: var(--suave-tinta); }
.sim-cartao { border: 1px solid var(--borda); border-radius: 14px; padding: 16px; background: var(--superficie); }
.sim-chip { display: inline-block; border: 1px solid var(--borda); border-radius: 999px; padding: .1rem .55rem; font-size: .75rem; margin: 2px 0; }
.sim-chip.ativo { background: var(--acento); color: #fff; border-color: var(--acento); }
.sim-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; }
.sim-kpis div { border: 1px solid var(--borda); border-radius: 10px; padding: 8px 10px; background: var(--superficie-2); }
.sim-kpis div:first-child { background: var(--degrade); color: #fff; border: 0; }
.sim-kpis small { display: block; font-size: .72rem; opacity: .85; }
.sim-kpis b { font: 700 1.25rem var(--f-display); }
.sim-barras div { display: grid; grid-template-columns: 90px 1fr 40px; align-items: center; gap: 8px; font-size: .8rem; margin-bottom: 4px; }
.sim-barras i { display: block; height: 10px; border-radius: 6px; background: var(--degrade); }
.sim-mapa { position: relative; height: 260px; border-radius: 12px; border: 1px solid var(--borda); overflow: hidden;
  background: linear-gradient(0deg, rgba(148, 163, 184, .12) 1px, transparent 1px) 0 0 / 28px 28px, linear-gradient(90deg, rgba(148, 163, 184, .12) 1px, transparent 1px) 0 0 / 28px 28px, var(--superficie-2); }
.sim-raio { position: absolute; left: 50%; top: 52%; width: 220px; height: 220px; transform: translate(-50%, -50%); border: 2px dashed var(--acento); border-radius: 50%; background: rgba(34, 211, 238, .06); pointer-events: none; }
.sim-pino { position: absolute; transform: translate(-50%, -100%); border: 0; background: none; font-size: 1.6rem; line-height: 1; z-index: 1; padding: 0; }
.sim-pino.rede { color: #9AA3AE; }
.sim-pino.expansao { color: #16A34A; }
.sim-pino:hover, .sim-pino:focus-visible { transform: translate(-50%, -100%) scale(1.2); }
.sim-info { border: 1px solid var(--borda); border-radius: 12px; padding: 12px; min-height: 120px; }
.sim-ok { color: #15803D; font-size: .85rem; }

/* ---- aba Operadora */
#mapaOperadora { height: 460px; border-radius: 12px; border: 1px solid var(--borda); }
.codigo-api { background: var(--superficie-2); border: 1px solid var(--borda); border-radius: 10px; padding: 10px; font-size: .72rem; white-space: pre-wrap; margin: .5rem 0 0; }
.nav-sm .nav-link { padding: .3rem .6rem; }

.slide-perfil p { font-size: .88rem; }
body:not(.nao-staff) .nao-staff-so { display: none !important; }

/* ---- impressão da tela do sistema (Ctrl+P): só o conteúdo, sem sobreposição */
@media print {
  @page { size: A4; margin: 10mm; }
  .topo, .lateral, .abas, #barraConta, #cargaStatus, .btn-ia, .painel-ia, .toast-container, .rodape, .sumario-secoes,
  .tab-pane:not(.active), button, .btn, form, .carousel-control-prev, .carousel-control-next { display: none !important; }
  main.col-lg-9 { flex: 0 0 100% !important; max-width: 100% !important; width: 100% !important; }
  .row > [class*="col-"] { flex: 0 0 100% !important; max-width: 100% !important; }
  .row > .col-6, .row > .col-md-4, .row > .col-xxl-3 { flex: 0 0 25% !important; max-width: 25% !important; }
  .cartao, .kpi { break-inside: avoid; page-break-inside: avoid; height: auto !important; box-shadow: none !important; }
  .table-responsive, .rolagem { max-height: none !important; overflow: visible !important; }
  .grafico { height: 260px !important; } .grafico.alto { height: 320px !important; }
  canvas { max-width: 100% !important; }
  #mapa, #mapaOperadora { height: 340px !important; }
  h2.secao { break-after: avoid; }
  body { background: #fff !important; }
}

/* ---- promoção Black Friday */
.faixa-promo { background: #0D1418 linear-gradient(100deg, #7C3AED, #2563EB 60%, #0891B2); color: #fff;
  border: 0; border-radius: 12px; padding: 10px 14px; font-size: .9rem; }
.faixa-promo i { color: #FDE047; }
.tag-promo { position: absolute; top: -10px; right: 10px; background: #DC2626; color: #fff; font: 700 .62rem var(--f-mono);
  letter-spacing: .04em; padding: .15rem .5rem; border-radius: 999px; box-shadow: 0 4px 10px rgba(220, 38, 38, .35); }
.plano { position: relative; }
.preco-cheio { color: var(--tinta-3); font-weight: 400; font-size: .85em; margin-right: .2rem; }
