/* NF Automacao - Portal Controle - Fase 79
 * Camada responsiva global. Somente apresentacao, sem modificar dados ou eventos de pagamento.
 * Regras progressivas para 320px ate tablet. Desktop >= 1200px mantido.
 */
:root {--nf-mobile-gutter:14px;--nf-mobile-radius:14px;}
@media (max-width:1199.98px) {
  html,body,#wrapper,#content-wrapper,#content {min-width:0;max-width:100%;}
  #wrapper,#content-wrapper,#content {width:100%;}
  #content-wrapper,#content {min-width:0!important;}
  #content .container-fluid,#content .container {min-width:0;max-width:100%;}
  #content :is(.row,[class*="col-"]) {min-width:0;}
  :is(.card,.card-body,.card-header,.alert,.modal-content,.dropdown-menu) {min-width:0;}
  :is(img,video,canvas,svg) {max-width:100%;}
  :is(.card,.modal-content,.alert) {overflow-wrap:break-word;}
  :is(.table-responsive,.table-container,.nf-table-scroll,.dataTables_scrollBody) {
    width:100%;max-width:100%;overflow-x:auto!important;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch;
  }
  .table-responsive > table,.table-container > table {max-width:none;}
  .select2-container {max-width:100%!important;}
  .select2-container .select2-selection {max-width:100%;}
  .modal-dialog {max-width:calc(100vw - 24px);}
  .modal-content {max-width:100%;}
  #content .card-header.d-flex,#content .card-header .d-flex {flex-wrap:wrap;gap:8px;}
}
@media (max-width:991.98px) {
  #content .container-fluid {padding-inline:var(--nf-mobile-gutter)!important;}
  #content :is(.page-header,.page-title-wrap,.clientes-page-header,.backup-page-head,.mobile-page-head) {
    max-width:100%;min-width:0;
  }
  :is(.backup-toolbar,.mobile-toolbar,.report-toolbar,.relatorios-filtros,.filters-toolbar) {
    display:flex;flex-wrap:wrap;align-items:stretch;gap:10px;
  }
  :is(.backup-toolbar,.mobile-toolbar,.report-toolbar,.relatorios-filtros,.filters-toolbar) > * {
    min-width:0;max-width:100%;
  }
  #content .row > [class*="col-"] {min-width:0;}
  #content :is(input,select,textarea):not([type="checkbox"]):not([type="radio"]) {max-width:100%;}
  .modal-dialog {margin:12px auto;}
  .modal-dialog-scrollable .modal-content {max-height:calc(100dvh - 24px);}
  .dropdown-menu {max-width:calc(100vw - 24px);}
}
@media (max-width:767.98px) {
  :root {--nf-mobile-gutter:12px;}
  html {overflow-x:clip;}
  body {width:100%;max-width:100%;overflow-x:clip;}
  #wrapper,#content-wrapper,#content {min-width:0!important;width:100%!important;max-width:100%!important;}
  #content .container-fluid {padding-inline:var(--nf-mobile-gutter)!important;}
  #content :is(h1,h2,h3,h4) {max-width:100%;overflow-wrap:break-word;line-height:1.2;}
  #content h1 {font-size:clamp(1.6rem,6vw,1.95rem)!important;}
  #content h2 {font-size:clamp(1.38rem,5.3vw,1.7rem)!important;}
  #content h3 {font-size:clamp(1.16rem,4.8vw,1.45rem)!important;}
  #content h4 {font-size:clamp(1.07rem,4.5vw,1.3rem)!important;}
  #content :is(p,small,label,span,a,td,th) {overflow-wrap:break-word;}
  #content :is(.card,.modal-content) {border-radius:var(--nf-mobile-radius);}
  #content .card:not(.clientes-table-card) > .card-body {padding:14px!important;}
  #content .card-header {padding:12px 14px!important;}
  #content :is(.mb-4,.my-4) {margin-bottom:16px!important;}
  .modern-topbar {min-height:64px;height:auto!important;max-width:100%;margin-bottom:14px!important;}
  .modern-topbar > .container-fluid {display:flex!important;align-items:center!important;flex-wrap:nowrap!important;gap:7px;padding:9px 12px!important;min-width:0;}
  .modern-topbar .page-identity {flex:1 1 auto!important;min-width:0!important;margin-inline:0!important;}
  .modern-topbar .page-identity :is(strong,small) {display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;}
  .modern-topbar .page-identity strong {font-size:14px!important;}
  .modern-topbar .page-identity small {font-size:11px!important;}
  .modern-topbar .navbar-nav {flex:0 0 auto;min-width:0;}
  .modern-topbar #sidebarToggleTop {flex:0 0 42px;min-height:42px;margin:0!important;}
  .modern-topbar .img-profile {width:37px!important;height:37px!important;}
  /* Forms: keyboard, taps and inline columns */
  #content :is(input,select,textarea).form-control,#content select.form-select {
    min-height:42px;font-size:16px!important;max-width:100%;min-width:0;
  }
  #content textarea.form-control {min-height:86px;}
  #content input[type="date"],#content input[type="datetime-local"] {width:100%;min-width:0;}
  #content .btn {max-width:100%;min-height:40px;white-space:normal;overflow-wrap:normal;line-height:1.25;}
  #content .btn-group {display:flex;flex-wrap:wrap;gap:6px;max-width:100%;}
  #content .btn-group > .btn {flex:1 1 auto;border-radius:9px!important;margin:0!important;}
  .select2-container {width:100%!important;max-width:100%!important;}
  .select2-dropdown {max-width:calc(100vw - 24px)!important;}
  .modal {padding:0!important;}
  .modal-dialog,.modal-dialog.modal-lg,.modal-dialog.modal-xl,.modal-dialog.modal-sm {
    width:calc(100vw - 16px)!important;max-width:calc(100vw - 16px)!important;margin:8px auto!important;
  }
  .modal-dialog-centered {min-height:calc(100dvh - 16px)!important;}
  .modal-content {max-width:100%;max-height:calc(100dvh - 16px)!important;overflow:hidden;}
  .modal-header,.modal-footer {flex:0 0 auto;min-width:0;gap:8px;padding:12px 14px!important;}
  .modal-header .modal-title {font-size:17px!important;overflow-wrap:anywhere;}
  .modal-body {min-width:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;padding:14px!important;}
  .modal-footer {display:flex;flex-wrap:wrap;justify-content:flex-end;}
  .modal-footer > .btn {min-width:0;flex:1 1 125px;}
  .modal-body .row {margin-inline:0;}
  .modal-body .row > [class*="col-"] {min-width:0;}
  .modal-body :is(input,select,textarea) {max-width:100%;}
  .modal-body :is(.table-responsive,.table-container) {max-width:100%;overflow-x:auto!important;}
  .dropdown-menu {max-width:min(340px,calc(100vw - 20px))!important;overflow-wrap:anywhere;}
  .dropdown-menu .dropdown-item {white-space:normal;line-height:1.35;padding-block:10px;}
  .pagination {max-width:100%;flex-wrap:wrap;gap:4px;}
  .pagination .page-link {padding:.45rem .65rem;}
  /* Wide data remains a horizontally scrollable table, not a squashed table */
  #content :is(.table-responsive,.table-container,.nf-table-scroll) {
    max-width:100%!important;overflow-x:auto!important;overflow-y:visible;
  }
  #content :is(.table-responsive,.table-container,.nf-table-scroll) > table {width:max-content;min-width:100%;max-width:none;}
  #content table :is(th,td) {vertical-align:middle;}
  #content .dataTables_wrapper {max-width:100%;min-width:0;}
  #content .dataTables_wrapper :is(.dataTables_filter,.dataTables_length,.dataTables_info,.dataTables_paginate) {
    width:100%;float:none;text-align:left;margin:8px 0;
  }
  #content .dataTables_wrapper .dataTables_filter input {max-width:100%;}
  /* Clientes: flex search, separate scrollable status filters, independent table scroll */
  .clientes-page-header {display:flex!important;flex-wrap:wrap;align-items:flex-start;gap:10px;}
  .clientes-page-header > * {min-width:0;max-width:100%;}
  .clientes-page-header .btn {margin-left:0!important;}
  .clientes-stats .clientes-stat-card {height:100%;min-height:88px;min-width:0;}
  .clientes-toolbar {display:flex!important;flex-direction:column;align-items:stretch!important;gap:9px;}
  .clientes-search-form {display:flex!important;flex-wrap:wrap!important;gap:8px;width:100%;min-width:0;}
  .clientes-search-form input[name="busca"] {flex:1 1 100%!important;min-width:0;max-width:100%;}
  .clientes-search-form select {flex:1 1 calc(50% - 8px)!important;min-width:0;max-width:100%;}
  .clientes-search-form .clientes-search-btn {flex:1 1 100%;width:100%;}
  .clientes-filters {max-width:100%;width:100%;overflow-x:auto!important;display:flex!important;flex-wrap:nowrap!important;gap:5px;padding-block:5px;overscroll-behavior-x:contain;}
  .clientes-filters a {white-space:nowrap!important;flex:0 0 auto;}
  .clientes-table-wrap {width:100%!important;max-width:100%;overflow-x:auto!important;}
  .clientes-table-wrap > table {min-width:940px!important;}
  .clientes-table-footer {display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:center;padding:12px!important;}
  .clientes-table-footer > * {min-width:0;max-width:100%;}
  #wa-batch-bar {margin:10px!important;padding:12px!important;display:flex!important;flex-wrap:wrap!important;gap:8px!important;}
  #wa-batch-bar .btn {flex:1 1 auto;}
  /* Backup, app, financial reporting, API configuration and audit pages */
  .backup-page-head,.mobile-page-head {display:flex;flex-wrap:wrap;gap:12px;}
  .backup-page-head > *,.mobile-page-head > * {flex:1 1 100%;min-width:0;}
  .backup-page-head .btn,.mobile-page-head .btn {flex:1 1 135px;}
  .backup-toolbar,.mobile-toolbar,.relatorios-toolbar,.report-toolbar {
    display:flex!important;flex-wrap:wrap!important;gap:9px!important;align-items:stretch!important;
  }
  .backup-toolbar > *,.mobile-toolbar > *,.relatorios-toolbar > *,.report-toolbar > * {min-width:0;max-width:100%;}
  .backup-search,.mobile-search-wrap {width:100%!important;max-width:100%!important;flex:1 1 100%!important;}
  .backup-filters,.mobile-filter-group {max-width:100%;overflow-x:auto!important;flex-wrap:nowrap!important;}
  .backup-filters > *, .mobile-filter-group > * {flex-shrink:0;}
  .backup-table-wrap,.mobile-table-wrap {max-width:100%;overflow-x:auto!important;}
  .backup-table,.mobile-table {min-width:750px;max-width:none;}
  .table-responsive .btn {white-space:nowrap;}
  /* Existing Fase 78 receipt cards continue to own their own mobile presentation. */
  .comprovantes-pagina .comprovantes-tabela td.comprovante-acao .btn {white-space:normal;overflow-wrap:normal;}
}
@media (max-width:575.98px) {
  :root {--nf-mobile-gutter:10px;}
  #content .container-fluid {padding-inline:10px!important;}
  #content .card:not(.clientes-table-card) > .card-body {padding:12px!important;}
  #content :is(.card,.alert) {max-width:100%;}
  #content .row.g-3 {--bs-gutter-x:10px;--bs-gutter-y:10px;}
  .clientes-page-header > .btn,.clientes-page-header > a.btn {width:100%;}
  .clientes-search-form select,.clientes-search-form button {flex:1 1 100%!important;}
  .clientes-stats > [class*="col-"] {min-width:0;}
  .clientes-stats .clientes-stat-card {padding:12px;}
  #wa-batch-bar > .btn {flex:1 1 calc(50% - 8px);min-width:0;}
  .modal-footer > .btn {flex:1 1 100%;}
  .modern-topbar .page-identity strong {font-size:13px!important;}
  .modern-topbar .page-identity small {font-size:10px!important;}
  .modern-topbar .notification-btn {max-width:42px;}
  .nav-tabs {flex-wrap:nowrap;max-width:100%;overflow-x:auto;}
  .nav-tabs .nav-item {flex:0 0 auto;}
}
@media (max-width:359.98px) {
  .modern-topbar > .container-fluid {gap:3px;padding-inline:7px!important;}
  .modern-topbar .img-profile {width:31px!important;height:31px!important;}
  .clientes-stats > [class*="col-"] {flex:0 0 100%;max-width:100%;}
}

/* ================================================================
 * Fase 80 — adaptação DESKTOP / NOTEBOOK, complementar à Fase 79.
 * Corrige largura útil abaixo de 1600px, sem tocar nas rotinas PHP.
 * Colunas secundárias são ocultadas em larguras reduzidas: dados
 * completos permanecem no cadastro e em Detalhes.
 * ================================================================ */
@media (min-width: 768px) {
  /* A área de trabalho precisa poder encolher ao lado do menu. */
  #wrapper { max-width: 100%; min-width: 0; }
  #content-wrapper, #content { min-width: 0 !important; max-width: 100%; }
  #content-wrapper { flex: 1 1 auto; }
  #content .container-fluid { min-width: 0; max-width: 100%; }
  #content :is(.row, .card, .card-body, .table-responsive) { min-width: 0; }
  #content :is(.table-responsive, .table-container, .dataTables_scrollBody) {
    max-width: 100%;
    -webkit-overflow-scrolling: touch;
  }
  .clientes-page, .clientes-table-card, .clientes-toolbar,
  .clientes-stats, .clientes-table-wrap { min-width: 0; max-width: 100%; }
  /* O CSS legado dava 300px à PRIMEIRA coluna, que agora é o checkbox. */
  .clientes-table > :is(thead,tbody) > tr > :first-child {
    width: 28px !important;
    min-width: 28px !important;
    max-width: 28px !important;
    padding-left: 8px !important;
    padding-right: 0 !important;
  }
  .clientes-table > :is(thead,tbody) > tr > :nth-child(2) {
    min-width: 0 !important;
  }
  .clientes-table .clientes-company-cell,
  .clientes-table .clientes-company-text { min-width: 0; }
}

/* Laptops, janelas divididas e telas HD: não comprimir pesquisa e selects. */
@media (min-width: 768px) and (max-width: 1599.98px) {
  .clientes-toolbar {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  .clientes-search-form {
    display: grid;
    grid-template-columns: minmax(160px, 1fr) repeat(3, minmax(125px, 175px)) auto;
    gap: 8px;
    width: 100%;
    max-width: 100%;
    min-width: 0 !important;
    flex: 0 1 auto;
  }
  .clientes-search-form .clientes-search-box { min-width: 0; width: 100%; }
  .clientes-search-form .clientes-search-box input { min-width: 0; width: 100%; }
  .clientes-search-form select.form-select {
    width: 100%;
    min-width: 0 !important;
    max-width: 100% !important;
    text-overflow: ellipsis;
  }
  .clientes-search-form .clientes-search-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    white-space: nowrap;
  }
  .clientes-filters {
    display: flex;
    flex-wrap: wrap;
    max-width: 100%;
    min-width: 0;
    gap: 5px;
  }
  .clientes-filters a { white-space: nowrap; }
  .clientes-table { width: 100%; table-layout: auto; }
  .clientes-table > :is(thead,tbody) > tr > :nth-child(2) {
    max-width: 340px;
  }
  .clientes-table .clientes-company-text {
    max-width: clamp(145px, 18vw, 280px);
  }
  .clientes-table > :is(thead,tbody) > tr > :not(:first-child) {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }
  .clientes-table > :is(thead,tbody) > tr > :last-child {
    min-width: 92px;
    white-space: nowrap;
  }
  .clientes-table-card .card-body,
  .clientes-table-wrap { min-width: 0; }
  #wa-batch-bar { max-width: calc(100% - 28px); }
  #wa-batch-bar > :is(button,a) { white-space: normal; }
  /* As colunas Sistema e Versão tornam a grade larga demais no notebook.
     Permanecem no cadastro/detalhes e no filtro, sem excluir nenhum dado. */
  .clientes-table .d-xl-table-cell { display: none !important; }
}

/* HD 1366x768, 1280x720: priorizar dados críticos e Ações na mesma tela. */
@media (min-width: 992px) and (max-width: 1399.98px) {
  .clientes-table > thead > tr > :nth-child(7),
  .clientes-table > tbody > tr > :nth-child(7) { display: none !important; }
  .clientes-table .clientes-company-text { max-width: clamp(145px, 18vw, 235px); }
  .clientes-stats .clientes-stat-card { padding: 12px; gap: 10px; }
  .clientes-stats .clientes-stat-icon { width: 39px; height: 39px; flex-basis: 39px; }
  .clientes-stats .clientes-stat-card strong { font-size: 21px; }
}

/* 992–1199px: em notebook reduzido, esconder apenas colunas secundárias. */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .clientes-table .d-lg-table-cell { display: none !important; }
  .clientes-table { min-width: 0 !important; }
  .clientes-table .clientes-company-text { max-width: clamp(125px, 17vw, 185px); }
  .clientes-table > :is(thead,tbody) > tr > :last-child { min-width: 80px; }
}

/* Tablet deitado / janelas pequenas: filtros em duas linhas, sem esmagar a busca. */
@media (min-width: 768px) and (max-width: 991.98px) {
  .clientes-search-form {
    grid-template-columns: minmax(160px,1fr) minmax(145px,1fr) minmax(145px,1fr);
  }
  .clientes-search-form .clientes-search-box { grid-column: 1 / -1; }
  .clientes-search-form .clientes-search-btn { grid-column: 1 / -1; }
  .clientes-table-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: auto !important;
    overscroll-behavior-x: contain;
  }
  .clientes-table { min-width: 690px !important; }
  .clientes-table .clientes-company-text { max-width: 205px; }
}

/* Ao reduzir ainda mais uma janela desktop, a tabela rola DENTRO do card,
   nunca cortando silenciosamente o canto direito da página. */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .clientes-table-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: auto !important;
    overscroll-behavior-x: contain;
  }
}