/* Modo de uso da conta (body[data-perfil]) + navegação por abas no celular (barra inferior) */

/* ================= Modo de uso: cada conta vê só o que é dela ================= */
.so-corretor { display: none; }
body[data-perfil="corretor"] .so-corretor { display: inline; }
body[data-perfil="corretor"] .nao-corretor { display: none !important; }
body[data-perfil="corretor"] .so-operadora,
body[data-perfil="marketing"] .so-operadora { display: none !important; }

/* Corretor: só "Mapa e contatos" (o mapa sobe para a aba de empresas), Minha base e Perfil */
body[data-perfil="corretor"] #tabPanorama,
body[data-perfil="corretor"] #tabRelatorios,
body[data-perfil="corretor"] #tabOperadora { display: none !important; }
body[data-perfil="marketing"] #tabOperadora { display: none !important; }
body[data-perfil="corretor"] #cartaoMapa .legenda-saude { display: none; }
#abaEmpresas #cartaoMapa #mapa { height: 340px; }

/* Lista simples do corretor: botões grandes para ligar, chamar no WhatsApp e mandar e-mail */
.contato-acoes { display: flex; flex-wrap: wrap; gap: .35rem; }
.contato-acoes a { display: inline-flex; align-items: center; gap: .3rem; padding: .3rem .6rem; border-radius: 999px;
  font-size: .82rem; font-weight: 600; text-decoration: none; border: 1px solid var(--borda); color: var(--tinta); background: var(--superficie); }
.contato-acoes a.zap { color: #15803D; border-color: #86EFAC; background: #F0FDF4; }
.contato-acoes a.tel { color: var(--acento); border-color: var(--suave-borda); background: var(--suave); }
.contato-acoes a:hover { filter: brightness(.97); }

/* ================= Escolha do modo (cadastro e contas antigas) ================= */
.escolha-modo { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6rem; }
.escolha-modo .btn { display: flex; flex-direction: column; align-items: flex-start; gap: .15rem; text-align: left; padding: .75rem .85rem;
  border: 1.5px solid var(--borda); border-radius: 14px; background: var(--superficie); color: var(--tinta); height: 100%; }
.escolha-modo .btn i { font-size: 1.35rem; color: var(--acento); }
.escolha-modo .btn b { font-size: 1rem; }
.escolha-modo .btn span { font-size: .78rem; color: var(--tinta-2); font-weight: 400; line-height: 1.25; }
.escolha-modo .btn-check:checked + .btn { border-color: var(--acento); box-shadow: 0 0 0 3px rgba(37, 99, 235, .15); background: var(--suave); }
@media (max-width: 575px) { .escolha-modo { grid-template-columns: 1fr; } }

/* ================= Celular: abas na barra inferior (padrão de app) ================= */
.nav-inferior { display: none; }
@media (max-width: 991.98px) {
  body.com-nav-inferior { padding-bottom: calc(68px + env(safe-area-inset-bottom)); }
  body.com-nav-inferior .abas { display: none !important; }        /* as pílulas do topo dão lugar à barra */
  body.com-nav-inferior .lateral { display: none; }                  /* a área fica na aba "Área" */
  body.com-nav-inferior.vista-area .lateral { display: block; }
  body.com-nav-inferior.vista-area main { display: none; }

  .nav-inferior { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 1035;
    background: var(--superficie); border-top: 1px solid var(--borda); box-shadow: 0 -6px 20px rgba(15, 23, 42, .08);
    padding: 4px 4px env(safe-area-inset-bottom); }
  .nav-inferior button { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 2px; height: 60px; border: 0; background: transparent; color: var(--tinta-3); font-size: .68rem; font-weight: 600;
    border-radius: 12px; position: relative; -webkit-tap-highlight-color: transparent; }
  .nav-inferior button i { font-size: 1.3rem; line-height: 1; }
  .nav-inferior button span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .nav-inferior button.ativo { color: var(--acento); }
  .nav-inferior button.ativo::before { content: ""; position: absolute; top: 2px; width: 28px; height: 3px; border-radius: 3px; background: var(--degrade); }
  .nav-inferior button .ponto-alerta { position: absolute; top: 8px; right: calc(50% - 16px); width: 8px; height: 8px; border-radius: 50%; background: #F59E0B; }

  /* "Mais": folha que sobe de baixo com as demais abas */
  .folha-mais { position: fixed; inset: 0; z-index: 1060; background: rgba(13, 20, 24, .45); display: flex; align-items: flex-end; }
  .folha-mais > div { width: 100%; background: var(--superficie); border-radius: 18px 18px 0 0; padding: 10px 12px calc(14px + env(safe-area-inset-bottom));
    box-shadow: 0 -10px 30px rgba(0, 0, 0, .2); animation: folha-sobe .18s ease-out; }
  .folha-mais .alca { width: 40px; height: 4px; border-radius: 4px; background: var(--borda); margin: 0 auto 10px; }
  .folha-mais button { display: flex; align-items: center; gap: .8rem; width: 100%; padding: .85rem .6rem; border: 0; background: transparent;
    color: var(--tinta); font-weight: 600; border-radius: 12px; text-align: left; }
  .folha-mais button i { font-size: 1.25rem; color: var(--acento); width: 1.5rem; text-align: center; }
  .folha-mais button.ativo { background: var(--suave); }
  @keyframes folha-sobe { from { transform: translateY(30px); opacity: .5; } to { transform: none; opacity: 1; } }

  /* título da tela atual (o celular não mostra as pílulas) */
  .titulo-vista { display: flex; align-items: center; gap: .5rem; font: 700 1.15rem var(--f-display); color: var(--tinta); margin: 0 0 .75rem; }
  .titulo-vista i { color: var(--acento); }
  body:not(.com-nav-inferior) .titulo-vista { display: none; }

  /* tour no celular: cartão fixo embaixo, largura toda, acima da barra */
  .tour-cartao.tour-mobile { left: 12px !important; right: 12px !important; width: auto !important; top: auto !important; transform: none !important;
    bottom: calc(76px + env(safe-area-inset-bottom)) !important; }
  .tour-cartao.tour-mobile.tour-topo { bottom: auto !important; top: 70px !important; }
}
@media (min-width: 992px) { .titulo-vista { display: none; } }

/* Corretor no celular: cada empresa vira um cartão (nada de tabela espremida) */
@media (max-width: 767.98px) {
  body[data-perfil="corretor"] #tabEmpresas thead { display: none; }
  body[data-perfil="corretor"] #tabEmpresas, body[data-perfil="corretor"] #tabEmpresas tbody,
  body[data-perfil="corretor"] #tabEmpresas tr, body[data-perfil="corretor"] #tabEmpresas td { display: block; width: 100%; }
  body[data-perfil="corretor"] #tabEmpresas tr { border: 1px solid var(--borda); border-radius: 14px; padding: .7rem .8rem; margin-bottom: .7rem;
    background: var(--superficie); box-shadow: 0 4px 14px rgba(15, 23, 42, .05); }
  body[data-perfil="corretor"] #tabEmpresas td { border: 0; padding: .15rem 0; text-align: left !important; }
  body[data-perfil="corretor"] #tabEmpresas td:nth-child(2), body[data-perfil="corretor"] #tabEmpresas td:nth-child(3) { display: inline-block; width: auto; margin-right: .8rem; color: var(--tinta-2); font-size: .88rem; }
  body[data-perfil="corretor"] #tabEmpresas td:nth-child(2) div { display: inline; }
  body[data-perfil="corretor"] #tabEmpresas td:nth-child(2) div::before { content: " · "; }
  body[data-perfil="corretor"] #tabEmpresas td:nth-child(3)::before { content: "Vidas: "; }
  body[data-perfil="corretor"] #tabEmpresas td:nth-child(4) { margin-top: .4rem; }
  body[data-perfil="corretor"] .contato-acoes a { font-size: .9rem; padding: .45rem .8rem; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
}
