/* =====================================================================
   SSIT Tema · celular e app (PWA)
   - sem zoom ao tocar em campos (fonte 16px) e sem zoom de toque duplo;
   - áreas seguras do iPhone (entalhe e barra inferior);
   - telas do Perfex ajustadas para telas estreitas;
   - barra de atalhos do app da equipe e convites (instalar / notificações).
   ===================================================================== */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
a,button,input,select,textarea,label,.btn,[role=button]{touch-action:manipulation}
html.ssit-app,html.ssit-app body{overscroll-behavior-y:none;-webkit-tap-highlight-color:transparent}
html.ssit-app body{-webkit-user-select:none;user-select:none}
html.ssit-app input,html.ssit-app textarea,html.ssit-app [contenteditable],html.ssit-app .table,html.ssit-app p,html.ssit-app td{-webkit-user-select:text;user-select:text}

@media (max-width:768px){
  /* campos com 16px: o iPhone não dá zoom ao focar */
  input,select,textarea,.form-control,.bootstrap-select>.dropdown-toggle,.dataTables_filter input{font-size:16px!important}
  body{font-size:15px}
  /* nada estoura a largura da tela (o conteúdo largo rola dentro do próprio cartão) */
  html,body{max-width:100%;overflow-x:hidden}
  #header #top_search,#header .navbar-form{min-width:0;flex:1 1 auto}
  #header .navbar-nav{margin:0}
  #header .navbar-nav>li>a{padding-left:10px;padding-right:10px}
  .content{padding:14px 12px!important}
  #wrapper{min-height:100vh}
  h4.tw-mt-0,.content>.row>div>h4:first-child{font-size:19px!important}

  /* cartões e grades */
  .panel_s>.panel-body,.panel-body{padding:14px!important}
  .panel_s{border-radius:14px!important;margin-bottom:14px!important}
  .row{margin-left:-6px;margin-right:-6px}
  .row>[class*=col-]{padding-left:6px;padding-right:6px}

  /* botões: alvo de toque confortável e quebra de linha */
  .btn{min-height:42px;padding:9px 14px}
  .btn-sm{min-height:36px}
  .btn-xs{min-height:30px}
  .content .btn-group{flex-wrap:wrap}
  ._buttons,.tw-mb-2.sm\:tw-mb-4,.tw-flex.tw-justify-between{flex-wrap:wrap;gap:8px}
  ._buttons .btn,._buttons .btn-group{margin-bottom:6px}

  /* tabelas: rolam de lado dentro do cartão, sem estourar a tela */
  .table-responsive,.dataTables_wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .dataTables_wrapper .row:first-child>div,.dataTables_wrapper .row:last-child>div{width:100%;float:none;text-align:left!important;margin-bottom:8px}
  .dataTables_wrapper .dataTables_filter input{width:100%!important;margin-left:0!important}
  .dataTables_wrapper .dataTables_filter label{width:100%}
  .dataTables_wrapper .dataTables_paginate{text-align:center!important}
  table.dataTable{min-width:640px}
  .table>tbody>tr>td{white-space:nowrap}
  .table>tbody>tr>td:first-child{white-space:normal;min-width:150px}

  /* abas roláveis */
  .nav-tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .nav-tabs::-webkit-scrollbar{display:none}
  .nav-tabs>li{float:none;flex:0 0 auto}

  /* janelas em tela cheia */
  .modal-dialog{margin:0!important;width:100%!important;max-width:100%!important;min-height:100%}
  .modal-content{border-radius:0!important;min-height:100vh;display:flex;flex-direction:column}
  .modal-body{flex:1 1 auto;overflow-y:auto}
  .modal-header{position:sticky;top:0;z-index:2;padding-top:calc(16px + env(safe-area-inset-top))!important}
  .modal-footer{position:sticky;bottom:0;padding-bottom:calc(12px + env(safe-area-inset-bottom))!important}
  .modal-footer .btn{margin:4px 0 0!important;width:100%}

  /* Kanban nativo: colunas lado a lado com rolagem */
  .kan-ban-row,.kanban-leads-sort,.tasks-phases{display:flex;overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory}
  .kan-ban-col{flex:0 0 86vw;scroll-snap-align:start}

  /* formulários em coluna única */
  .form-group{margin-bottom:14px}
  .items-wrapper{overflow-x:auto}
  .table.items{min-width:760px}

  /* menus suspensos maiores para o dedo */
  .dropdown-menu>li>a{padding:11px 14px!important}
  .bootstrap-select .dropdown-menu{max-height:60vh!important}
}

/* ---------- app instalado: topo e rodapé respeitam o entalhe ---------- */
html.ssit-app #header{padding-top:env(safe-area-inset-top)!important;height:auto!important}
html.ssit-app #menu{padding-top:env(safe-area-inset-top)!important;padding-bottom:env(safe-area-inset-bottom)!important}

/* ---------- barra de atalhos (app da equipe, telas estreitas) ---------- */
.ssit-barra{display:none}
@media (max-width:768px){
  html.ssit-com-barra body{padding-bottom:calc(64px + env(safe-area-inset-bottom))!important}
  .ssit-barra{position:fixed;left:0;right:0;bottom:0;z-index:1035;display:flex;justify-content:space-around;align-items:stretch;
    background:rgba(255,255,255,.97);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);
    border-top:1px solid #E3E7EE;padding:4px 4px calc(4px + env(safe-area-inset-bottom));box-shadow:0 -6px 20px rgba(15,27,45,.06)}
  .ssit-barra a{flex:1 1 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:54px;border-radius:12px;
    color:#5B6475!important;font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:11.5px;font-weight:600;text-decoration:none!important}
  .ssit-barra a svg{width:23px;height:23px}
  .ssit-barra a.on{color:#2448C7!important}
  .ssit-barra a.on svg{stroke-width:2.4}
  .ssit-barra a:active{background:#EEF1F6}
  #ssit-notif{bottom:auto}
  .float-alert.alert{bottom:calc(76px + env(safe-area-inset-bottom))!important}
}

/* ---------- convites (instalar app / ativar notificações) ---------- */
.ssit-convite{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:1040;display:flex;align-items:center;gap:12px;
  background:#0F1B2D;color:#fff;border-radius:16px;padding:12px 12px 12px 14px;box-shadow:0 14px 36px rgba(15,27,45,.35);
  font-family:"IBM Plex Sans",system-ui,sans-serif;animation:ssitSobe .25s ease-out}
html.ssit-com-barra .ssit-convite{bottom:calc(76px + env(safe-area-inset-bottom))}
.ssit-convite-ic{flex:0 0 auto;width:42px;height:42px;border-radius:11px;background:#2448C7 url('icones/icone-96.png') center/cover no-repeat}
.ssit-convite-ic.sino{background:#2448C7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9'/%3E%3Cpath d='M10.3 21a1.94 1.94 0 0 0 3.4 0'/%3E%3C/svg%3E") center/22px no-repeat}
.ssit-convite-tx{flex:1 1 auto;min-width:0;font-size:13px;line-height:1.35;color:#C5CEDD}
.ssit-convite-tx strong{display:block;color:#fff;font-size:14.5px}
.ssit-convite-ok{flex:0 0 auto;min-height:40px;padding:0 16px;border:0;border-radius:10px;background:#2448C7;color:#fff;font-weight:700;font-size:14px;font-family:inherit}
.ssit-convite-x{flex:0 0 auto;width:36px;height:36px;border:0;border-radius:10px;background:transparent;color:#8FA0BC;font-size:16px}
@keyframes ssitSobe{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@media (min-width:769px){.ssit-convite{left:auto;right:20px;max-width:420px}}