/* Celular e tablet em pé: menu inferior, gaveta de navegação, tabelas viram cartões, filtros e painéis em tela cheia. */

.tabbar,.sidescrim{display:none}

/* ---------- navegação (até 860px) ---------- */
@media (max-width:860px){
  body.has-shell{padding-bottom:calc(64px + env(safe-area-inset-bottom))}
  .side{display:flex !important;position:fixed;left:0;top:0;bottom:0;height:100dvh;width:min(300px,86vw);z-index:90;transform:translateX(-102%);transition:transform .22s ease;box-shadow:none;padding-top:max(16px,env(safe-area-inset-top))}
  .side.open{transform:none;box-shadow:var(--shadow-pop)}
  .sidescrim{display:block;position:fixed;inset:0;z-index:85;background:rgba(17,19,24,.4);opacity:0;pointer-events:none;transition:opacity .2s}
  .sidescrim.open{opacity:1;pointer-events:auto}
  .tabbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:80;background:var(--gray-0);border-top:1px solid var(--divider);padding:6px 4px calc(6px + env(safe-area-inset-bottom));gap:2px}
  .tabbar .tab{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 2px;border:0;background:none;border-radius:var(--radius-md);color:var(--text-secondary);font:500 11px/14px var(--font-sans);text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .tabbar .tab svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
  .tabbar .tab span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .tabbar .tab.on{color:var(--brand-500)}
  .tabbar .tab[hidden]{display:none}
  body:not(.is-client) .tabbar .tab[data-clientonly]{display:none}
  .scrim{z-index:92 !important}.drawer{z-index:95 !important}.modal{z-index:105 !important}.dd{z-index:110 !important}.toast{z-index:120 !important}
  .toast{bottom:calc(76px + env(safe-area-inset-bottom)) !important}
  .pageload{left:0 !important;top:57px !important;bottom:calc(64px + env(safe-area-inset-bottom)) !important}
  .bulk{bottom:calc(76px + env(safe-area-inset-bottom)) !important;width:calc(100vw - 24px);max-width:none}
}

/* ---------- páginas (até 720px) ---------- */
@media (max-width:720px){
  .fixed-h .app,.fixed-h .main{height:auto !important;min-height:100vh;overflow:visible !important}
  .fixed-h .tablewrap{flex:none}
  html{-webkit-text-size-adjust:100%}
  body{overflow-x:hidden}
  input:not([type=checkbox]):not([type=radio]),textarea,select:not(.st){font-size:16px !important}
  .btn{height:40px}
  .btn.sm{height:34px}

  /* cabeçalho da página */
  .bar{padding:12px 16px !important;gap:8px !important;flex-wrap:wrap;min-height:52px}
  .ptitle{font-size:17px;line-height:24px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
  .bar .spacer{flex:1 1 auto}
  .bar .btn{height:36px;padding:0 12px}
  .jobchip{max-width:100%;order:9}
  .greet span{font-size:13px}
  .listpick{order:1;min-width:0 !important;width:100%;max-width:none !important}
  #copyVisible{display:none}
  #exportCsv,#menuBtn{order:3}
  .intro{padding:14px 16px 0}
  .intro p{font-size:13px}

  /* indicadores: fileira que rola para o lado (economiza altura); no Início ficam 2x2 */
  .stats{display:flex !important;gap:10px;padding:14px 16px 4px !important;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .stats::-webkit-scrollbar{display:none}
  .stats>.stat{flex:0 0 138px;scroll-snap-align:start;padding:12px 14px}
  #kpis{display:grid !important;grid-template-columns:1fr 1fr;overflow:visible}#kpis>.stat{flex:none}
  .stat b{font-size:20px;line-height:26px}
  .stat small{font-size:12px;line-height:16px}
  .dash{padding:0 16px 32px}
  .dash .stats{padding:14px 0 4px !important}
  .dgrid{gap:12px}
  .card{padding:14px 16px}

  /* filtros */
  .toolbar{padding:10px 16px !important;gap:8px}
  .toolbar .search,.toolbar .search input{flex:1 1 100%;width:100%;min-width:0;max-width:none}
  .toolbar select{flex:1 1 calc(50% - 8px);min-width:0;max-width:none !important;width:auto}
  .toolbar .spacer,.toolbar .hint{display:none}
  .toolbar .count{margin-left:auto}
  .toolbar .seg{width:100%}.toolbar .seg button{flex:1}
  .toolbar .check{font-size:13px}
  .hint{display:none}

  /* tabelas viram lista de cartões */
  .tablewrap{overflow:visible !important;padding-bottom:8px !important;border-top:1px solid var(--divider)}
  table{display:block;width:100% !important;min-width:0 !important}
  colgroup,thead{display:none !important}
  tbody{display:flex;flex-direction:column;gap:10px;padding:12px 16px}
  tbody tr{display:grid;gap:4px 12px;align-items:center;position:relative;padding:12px 14px;background:var(--gray-0);border:1px solid var(--border);border-radius:var(--radius-lg)}
  tbody tr:hover td{background:none !important}
  tbody tr.sel{background:var(--gray-25)}
  tbody td{display:block;padding:0 !important;border:0 !important;height:auto;min-width:0;background:none !important}
  td.go{display:none !important}
  td .t1,td .t2{white-space:normal}
  .empty{padding:32px 16px}

  table.usage colgroup{display:none}table.usage td,table.usage th{padding-right:10px !important;white-space:nowrap}

  /* Eventos de uma feira: marcas */
  #tExh tbody tr{grid-template-columns:48px minmax(0,1fr) auto;grid-template-areas:"logo name status" "logo contact contact"}
  #tExh td:nth-child(1),#tExh td:nth-child(4),#tExh td:nth-child(6){display:none}
  #tExh td:nth-child(2){grid-area:logo}#tExh td:nth-child(3){grid-area:name}#tExh td:nth-child(5){grid-area:contact}#tExh td:nth-child(7){grid-area:status}
  #tExh td:nth-child(2) .logo{width:48px;height:48px}
  #tExh .mini{font-size:12px}

  /* lista de eventos */
  #tEvents tbody tr{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"name status" "date marcas" "local local"}
  #tEvents td:nth-child(1){grid-area:name}#tEvents td:nth-child(2){grid-area:date;color:var(--text-secondary);font-size:13px}
  #tEvents td:nth-child(3){grid-area:local}#tEvents td:nth-child(4){grid-area:marcas;text-align:right;color:var(--text-secondary);font-size:13px}
  #tEvents td:nth-child(4)::after{content:" marcas"}#tEvents td:nth-child(5){grid-area:status}
  #tEvents .t1{font-weight:500}

  /* enriquecimento */
  #tIntel tbody tr{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"lead status" "evento evento" "setor setor" "fat porte"}
  #tIntel td:nth-child(1){grid-area:lead}#tIntel td:nth-child(2){grid-area:evento;font-size:13px}#tIntel td:nth-child(3){grid-area:setor}
  #tIntel td:nth-child(4){grid-area:porte;text-align:right;color:var(--text-secondary);font-size:13px}#tIntel td:nth-child(5){grid-area:fat;font-size:13px}#tIntel td:nth-child(6){grid-area:status}
  #tIntel td:nth-child(3) .t2{color:var(--text-secondary) !important}

  /* agenda (lista) */
  #tAgenda tbody tr{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"ev ev" "date act" "local local"}
  #tAgenda tr.grp{display:block;border:0;background:none;padding:6px 2px 0}#tAgenda tr.grp td{display:block}
  #tAgenda td:nth-child(1){grid-area:date;font-size:13px}#tAgenda td:nth-child(2){grid-area:ev}#tAgenda td:nth-child(3){grid-area:local}
  #tAgenda td:nth-child(4){display:none}#tAgenda td:nth-child(5){grid-area:act}
  #tAgenda .evcell{gap:10px}

  /* leads do Maps */
  #rows tr{grid-template-columns:28px minmax(0,1fr) auto;grid-template-areas:"star lead lead" ". opp rate" ". site site" ". contact status"}
  #rows td:nth-child(1){grid-area:star}#rows td:nth-child(2){grid-area:lead}#rows td.td-addr{display:none}
  #rows td:nth-child(4){grid-area:opp}#rows td:nth-child(5){grid-area:rate;text-align:right}#rows td:nth-child(6){grid-area:site}
  #rows td:nth-child(7){grid-area:contact}#rows td:nth-child(8){grid-area:status;justify-self:end}
  #rows td:nth-child(5) small{display:inline;margin-left:4px}
  #rows .lead-t small .l-addr{display:inline}

  /* página do evento */
  .evtop{flex-direction:column;gap:12px}.evtop h1{font-size:22px}
  .evactions{margin-left:0 !important;flex-wrap:wrap;width:100%}
  .evactions .btn{flex:0 1 auto}
  .evmeta .chip{height:auto;min-height:28px;padding:4px 10px;white-space:normal}
  #evHead,.evhead{padding-left:16px;padding-right:16px}
  .secbar,.sec-head{padding:0 16px}
  .verify{margin:12px 16px}

  /* calendário */
  .cal{padding:0 12px 20px}
  .cal-top{flex-wrap:wrap}.cal-top h2{font-size:16px;margin:0 4px}
  .cal-dow div{padding:6px 0;text-align:center;font-size:10px;letter-spacing:0}
  .day{min-height:64px}
  .day .num{padding:0 4px;font-size:12px}
  .day.today .num{margin-left:2px}
  .cal .chip{height:6px;font-size:0 !important;border-radius:3px;margin:0 3px;width:calc(100% - 6px) !important;border-left:0 !important}
  .cal .chip.cs,.cal .chip.ce,.cal .chip.cs.ce{margin:0 3px;width:calc(100% - 6px) !important;border-radius:3px}
  .more{padding:0 4px;font-size:10px}

  /* painel lateral (detalhe) em tela cheia */
  .drawer{width:100vw !important;max-width:100vw}
  .dbody{padding:16px 16px calc(32px + env(safe-area-inset-bottom)) !important}
  .dhead{padding-right:84px;gap:12px}.dhead .logo{width:56px;height:56px}
  .dbody dl{grid-template-columns:92px minmax(0,1fr);gap:8px 12px}
  .dstatus{flex-wrap:wrap}.dstatus .st{max-width:none}
  .person{flex-wrap:wrap}
  .chips{gap:6px}
  .dclose{top:12px;right:12px}

  /* janelas */
  .modal{padding:0;align-items:flex-end}
  .mbox{width:100% !important;max-width:none !important;max-height:92dvh;overflow:auto;border-radius:16px 16px 0 0 !important;padding:20px 16px calc(20px + env(safe-area-inset-bottom)) !important}
  .mactions{flex-wrap:wrap}.mactions .btn{flex:1}
  .popover{left:12px !important;right:12px;width:auto !important}
  .dd{max-width:calc(100vw - 16px)}
  .menu{max-width:calc(100vw - 24px)}

  /* início */
  .drow2{gap:10px}
  .drow2 .dnum:nth-child(n+4){display:none}
  .drow2 .dnum{min-width:48px}
  .cov,.cov.cov3{grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:6px 10px !important;padding:12px 0}
  .cov.head{display:none}
  .cov>b{grid-column:1/-1;white-space:normal}
  .cov .num{display:none}
  .cov>span{flex-direction:column;align-items:stretch;gap:2px}
  .cov>span::before{font-size:11px;color:var(--text-tertiary)}
  .cov>span:nth-of-type(2)::before{content:"Site"}.cov>span:nth-of-type(3)::before{content:"E-mail"}.cov>span:nth-of-type(4)::before{content:"Telefone"}.cov>span:nth-of-type(5)::before{content:"Enriquecida"}
  .cov small{text-align:left;width:auto}
  .cfg{padding:16px}
  dl.kv{grid-template-columns:120px 1fr}
}