/*
 * Camada global de responsividade da Intranet Enfoque.
 * Conservadora: corrige largura, toque, tabelas, toolbars e modais sem alterar
 * a identidade visual de cada modulo no desktop.
 */
html { max-width: 100%; overflow-x: hidden; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { max-width: 100%; overflow-x: hidden; }
img, picture, video, canvas { max-width: 100%; height: auto; }
svg { max-width: 100%; }
iframe { max-width: 100%; }
:where(.container, .page-container, .page-content, .main-content, .content, main, section, article) { min-width: 0; }
:where(.table-responsive, .table-wrapper, .table-wrap, .table-container, .report-table-wrapper, .report-table-wrap, .data-table-wrap, .data-table-wrapper) {
  max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; -webkit-overflow-scrolling: touch;
}
:where(dialog, .modal, .modal-card, .custom-modal-card, .enf-modal-card, .ti-modal-card) { max-width: calc(100vw - 24px); }

@media (max-width: 900px) {
  :where(.page-container, .page-content, .main-content, .content, main) { max-width: 100%; }
  :where(.toolbar, .page-toolbar, .report-toolbar, .filters, .filter-row, .filters-row, .actions, .action-row, .button-row) {
    flex-wrap: wrap;
  }
  :where(.toolbar, .page-toolbar, .report-toolbar, .filters, .filter-row, .filters-row) > * { min-width: 0; }
}

@media (max-width: 760px) {
  :root { --mobile-safe-gutter: 14px; }
  body { min-height: 100dvh; }

  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  select,
  textarea {
    max-width: 100%;
    font-size: 16px !important;
  }

  button,
  a[role="button"],
  input[type="button"],
  input[type="submit"] { touch-action: manipulation; }

  :where(.container, .page-container, .page-content, .main-content, .content) {
    width: 100%; max-width: 100%; box-sizing: border-box;
  }

  :where(.toolbar, .page-toolbar, .report-toolbar, .filters, .filter-row, .filters-row) {
    gap: 8px;
  }

  :where(.toolbar, .page-toolbar, .report-toolbar, .filters, .filter-row, .filters-row) > :is(label, .field, .form-field, .control, .filter-control) {
    flex: 1 1 180px;
  }

  :where(.card-grid, .cards-grid, .dashboard-grid, .report-grid, .settings-grid, .form-grid, .stats-grid) {
    grid-template-columns: 1fr !important;
  }

  :where(.table-responsive, .table-wrapper, .table-wrap, .table-container, .report-table-wrapper, .report-table-wrap, .data-table-wrap, .data-table-wrapper) {
    width: 100%; max-width: calc(100vw - (var(--mobile-safe-gutter) * 2));
  }

  table { font-size: .86rem; }

  :where(dialog, .modal, .modal-card, .custom-modal-card, .enf-modal-card, .ti-modal-card) {
    width: calc(100vw - 20px) !important;
    max-width: calc(100vw - 20px) !important;
    max-height: calc(100dvh - 20px) !important;
  }

  :where(.modal-content, .dialog-content, .custom-modal-content, .enf-modal-content, .ti-modal-content) {
    max-height: calc(100dvh - 120px); overflow: auto; -webkit-overflow-scrolling: touch;
  }

  :where(.modal-actions, .dialog-actions, .form-actions, .footer-actions) {
    display: flex; flex-wrap: wrap; gap: 8px;
  }

  :where(.modal-actions, .dialog-actions, .form-actions, .footer-actions) > button {
    flex: 1 1 140px;
  }
}

@media (max-width: 430px) {
  :where(.toolbar, .page-toolbar, .report-toolbar, .filters, .filter-row, .filters-row) > * {
    flex-basis: 100%;
  }
  :where(.modal-actions, .dialog-actions, .form-actions, .footer-actions) > button {
    flex-basis: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; }
}

/* Blocos legados com tabelas largas: a rolagem pertence ao componente, nao a pagina. */
@media (max-width: 760px) {
  :where(
    .app-users-table-wrap,
    .count-table-wrap,
    .school-table-wrap,
    .cleanup-table-wrap,
    .mass-preview-wrap,
    .alert-detail,
    .stock-detail,
    .xml-table-wrap,
    .cost-table-wrap,
    .compras-preview-table-wrap,
    .details-table-wrap
  ) {
    width: 100%;
    max-width: 100%;
    overflow-x: auto !important;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }

  :where(.xml-search, .school-toolbar > div:first-child) {
    min-width: 0 !important;
    width: 100%;
    max-width: 100%;
  }
}


/* Global fluid responsive layer - 2026-09-05. */
:root {
  --enf-fluid-gutter: clamp(10px, 2.4vw, 28px);
  --enf-touch-size: 42px;
}

:where(body, .layout, .content-wrap, .page-main, main, .card, .panel, .grid, .form-grid, .filters, .toolbar) {
  min-inline-size: 0;
}

:where(.content-wrap, .page-main, .main-content, .page-content, main) {
  max-inline-size: 100%;
}

:where(.card, .panel, .control-card, .chart-card, .dashboard-panel, .dashboard-widget, .metric-card, .stat-card) {
  overflow-wrap: anywhere;
}

:where(.toolbar, .page-toolbar, .report-toolbar, .filters, .filter-row, .filters-row, .actions, .action-row, .form-actions, .modal-actions, .dialog-actions) {
  row-gap: 10px;
}

:where(.toolbar, .page-toolbar, .report-toolbar, .filters, .filter-row, .filters-row, .actions, .action-row, .form-actions) > * {
  min-inline-size: 0;
}

:where(.table-wrap, .table-wrapper, .table-container, .table-responsive, .report-table-wrap, .report-table-wrapper,
  .data-table-wrap, .data-table-wrapper, .app-users-table-wrap, .count-table-wrap, .school-table-wrap,
  .cleanup-table-wrap, .mass-preview-wrap, .xml-table-wrap, .cost-table-wrap, .details-table-wrap,
  .seller-sales-table-wrap, .vmc-table-wrap, .quota-report-table-wrap, .margin-report-table-wrap,
  .cadastro-products-table-wrap, .cadastro-mass-preview-table-wrap) {
  inline-size: 100%;
  max-inline-size: 100%;
  overflow-x: auto !important;
  overscroll-behavior-inline: contain;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}

:where(.table-wrap, .table-wrapper, .table-container, .table-responsive, .report-table-wrap, .report-table-wrapper,
  .data-table-wrap, .data-table-wrapper) > table {
  margin-inline: 0;
}

@media (max-width: 1180px) {
  :where(.dashboard-grid, .charts-grid, .stats-grid, .metrics-grid, .report-grid, .cards-grid,
    .expense-summary-grid, .expense-ranking-grid, .vpn-summary-grid, .vpn-history-grid,
    .stock-report-metrics, .quota-dashboard-grid, .control-grid, .xml-grid, .transport-grid,
    .cadastro-note-summary-cards, .app-users-grid) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 900px) {
  :root { --enf-fluid-gutter: clamp(10px, 3vw, 20px); }

  :where(.content-wrap, .page-main, .main-content, .page-content, main) {
    inline-size: 100%;
  }

  :where(.filters, .filter-row, .filters-row, .toolbar, .page-toolbar, .report-toolbar,
    .actions, .action-row, .form-actions, .xml-toolbar, .ti-actions, .cleanup-actions,
    .cadastro-products-actions, .cadastro-secondary-actions, .report-filter-actions,
    .devolucao-confirm-actions, .cost-confirm-actions) {
    flex-wrap: wrap !important;
  }

  :where(.filters, .filter-row, .filters-row, .toolbar, .page-toolbar, .report-toolbar) > :is(label, .field, .form-field, .control, .filter-control, .form-group) {
    flex: 1 1 min(100%, 220px);
  }

  :where(.modal, dialog, .modal-card, .custom-modal-card, .enf-modal-card, .ti-modal-card,
    .xml-modal-card, .abc-modal-card, .price-modal-card, .cadastro-modal-card) {
    max-inline-size: calc(100vw - 24px) !important;
  }
}

@media (max-width: 760px) {
  :root { --mobile-safe-gutter: 12px; }

  body {
    min-inline-size: 0;
    min-block-size: 100dvh;
  }

  :where(.layout, .content-wrap, .page-main, .main-content, .page-content, main) {
    inline-size: 100% !important;
    max-inline-size: 100% !important;
    min-inline-size: 0 !important;
  }

  :where(.page-main, .main-content, .page-content) {
    padding-inline: var(--mobile-safe-gutter) !important;
  }

  :where(.card, .panel, .control-card, .chart-card, .dashboard-panel, .dashboard-widget,
    .metric-card, .stat-card, .management-inner-card) {
    min-inline-size: 0 !important;
    max-inline-size: 100% !important;
  }

  :where(.dashboard-grid, .charts-grid, .stats-grid, .metrics-grid, .report-grid, .cards-grid,
    .settings-grid, .form-grid, .expense-summary-grid, .expense-ranking-grid, .vpn-summary-grid,
    .vpn-history-grid, .stock-report-metrics, .quota-dashboard-grid, .control-grid, .xml-grid,
    .transport-grid, .cadastro-note-summary-cards, .app-users-grid, .app-users-access-grid,
    .price-filter-grid, .mass-mapping-grid, .cadastro-mass-grid, .count-grid) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  :where(.filters, .filter-row, .filters-row, .toolbar, .page-toolbar, .report-toolbar,
    .actions, .action-row, .button-row, .form-actions, .modal-actions, .dialog-actions,
    .xml-actions, .xml-toolbar, .ti-actions, .cleanup-actions, .cadastro-products-actions,
    .cadastro-secondary-actions, .report-filter-actions, .devolucao-confirm-actions,
    .cost-confirm-actions) {
    inline-size: 100%;
    max-inline-size: 100%;
    gap: 8px !important;
  }

  :where(.filters, .filter-row, .filters-row, .toolbar, .page-toolbar, .report-toolbar) > * {
    min-inline-size: 0 !important;
  }

  :where(.form-actions, .modal-actions, .dialog-actions, .xml-actions, .ti-actions,
    .cleanup-actions, .cadastro-products-actions, .cadastro-secondary-actions,
    .report-filter-actions, .devolucao-confirm-actions, .cost-confirm-actions) > :is(button, a, .btn) {
    min-block-size: var(--enf-touch-size);
  }

  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  select,
  textarea {
    inline-size: 100%;
    min-inline-size: 0;
    max-inline-size: 100%;
    font-size: 16px !important;
  }

  :where(button, a[role="button"], input[type="button"], input[type="submit"]) {
    touch-action: manipulation;
  }

  :where(.tabs, .tab-buttons, .tab-list, [role="tablist"]) {
    max-inline-size: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
  }

  :where(.tabs, .tab-buttons, .tab-list, [role="tablist"]) > * {
    flex: 0 0 auto;
  }

  :where(.table-wrap, .table-wrapper, .table-container, .table-responsive, .report-table-wrap,
    .report-table-wrapper, .data-table-wrap, .data-table-wrapper, .app-users-table-wrap,
    .count-table-wrap, .school-table-wrap, .cleanup-table-wrap, .mass-preview-wrap,
    .xml-table-wrap, .cost-table-wrap, .details-table-wrap, .seller-sales-table-wrap,
    .vmc-table-wrap, .quota-report-table-wrap, .margin-report-table-wrap,
    .cadastro-products-table-wrap, .cadastro-mass-preview-table-wrap) {
    max-inline-size: calc(100vw - (var(--mobile-safe-gutter) * 2)) !important;
  }

  :where(table) {
    font-size: clamp(.78rem, 3.4vw, .9rem);
  }

  :where(dialog, .modal, .modal-card, .custom-modal-card, .enf-modal-card, .ti-modal-card,
    .xml-modal-card, .abc-modal-card, .price-modal-card, .cadastro-modal-card) {
    inline-size: calc(100vw - 18px) !important;
    max-inline-size: calc(100vw - 18px) !important;
    max-block-size: calc(100dvh - 18px) !important;
  }

  :where(.modal-content, .dialog-content, .custom-modal-content, .enf-modal-content,
    .ti-modal-content, .xml-modal-content) {
    max-block-size: calc(100dvh - 112px);
    overflow: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }

  :where(.modal-actions, .dialog-actions, .form-actions, .footer-actions) {
    display: flex;
    flex-wrap: wrap;
  }

  :where(.modal-actions, .dialog-actions, .form-actions, .footer-actions) > button {
    flex: 1 1 140px;
  }

  :where(.price-autocomplete-panel, .autocomplete-panel, .autocomplete-list) {
    max-inline-size: calc(100vw - 24px) !important;
  }
}

@media (max-width: 520px) {
  :root { --mobile-safe-gutter: 9px; }

  :where(.form-actions, .modal-actions, .dialog-actions, .footer-actions,
    .xml-actions, .ti-actions, .cleanup-actions, .cadastro-products-actions,
    .cadastro-secondary-actions, .report-filter-actions, .devolucao-confirm-actions,
    .cost-confirm-actions) > :is(button, a, .btn) {
    inline-size: 100%;
    flex-basis: 100%;
  }

  :where(.toolbar, .page-toolbar, .report-toolbar, .filters, .filter-row, .filters-row) > * {
    flex-basis: 100% !important;
  }
}

@media (orientation: landscape) and (max-height: 520px) and (max-width: 940px) {
  :where(dialog, .modal, .modal-card, .custom-modal-card, .enf-modal-card, .ti-modal-card) {
    max-block-size: calc(100dvh - 10px) !important;
  }
}


/* ========================================================================== */
/* Mobile hardening - 2026-09-14                                              */
/* Corrige sobreposicoes, campos truncados e layouts rigidos em telas pequenas. */
/* ========================================================================== */
@media (max-width: 760px) {
  html, body { width: 100%; max-width: 100%; overflow-x: clip; }

  .layout,
  .content-wrap,
  .page-main,
  .main-content,
  .page-content,
  .content-wrapper,
  main {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .page-main,
  .main-content,
  .page-content,
  .content-wrapper {
    padding-left: 10px !important;
    padding-right: 10px !important;
    box-sizing: border-box !important;
  }

  :where(.card, .panel, .control-card, .report-card, .dashboard-card, .chart-card, .filter-card,
    .settings-card, .management-inner-card, .form-card, .metric-card, .stat-card) {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  :where(.card, .panel, .control-card, .report-card, .dashboard-card, .chart-card, .filter-card,
    .settings-card, .management-inner-card, .form-card) > * {
    min-width: 0;
  }

  :where(.toolbar, .page-toolbar, .report-toolbar, .filters, .filter-row, .filters-row,
    .actions, .action-row, .button-row, .form-actions, .modal-actions, .dialog-actions,
    .ti-actions, .xml-actions) {
    display: flex;
    flex-wrap: wrap !important;
    align-items: stretch;
  }

  :where(.toolbar, .page-toolbar, .report-toolbar, .filters, .filter-row, .filters-row) > * {
    width: 100%;
    flex: 1 1 100% !important;
    min-width: 0 !important;
  }

  :where(.form-grid, .filters-grid, .filter-grid, .settings-grid, .cards-grid, .dashboard-grid,
    .stats-grid, .metrics-grid, .report-grid, .control-grid, .app-users-grid, .count-grid) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  :where(label, .field, .form-field, .form-group, .control) {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  select,
  textarea {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  :where(button, .btn, a[role="button"], input[type="button"], input[type="submit"]) {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  :where(h1, h2, h3, h4, h5, p, label, .muted, .hint, .subtitle, .description) {
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  :where(.table-wrap, .table-wrapper, .table-container, .table-responsive, .report-table-wrap,
    .report-table-wrapper, .data-table-wrap, .data-table-wrapper, .app-users-table-wrap,
    .count-table-wrap, .school-table-wrap, .cleanup-table-wrap, .mass-preview-wrap,
    .xml-table-wrap, .cost-table-wrap, .details-table-wrap, .seller-sales-table-wrap,
    .vmc-table-wrap, .quota-report-table-wrap, .margin-report-table-wrap,
    .cadastro-products-table-wrap, .cadastro-mass-preview-table-wrap) {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: visible;
    border-radius: 12px;
  }

  :where(table) {
    width: max-content;
    min-width: 100%;
  }

  :where(table th, table td) {
    max-width: min(72vw, 320px);
    white-space: normal;
    overflow-wrap: break-word;
    vertical-align: top;
  }

  :where(.tabs, .tab-buttons, .tab-list, [role="tablist"]) {
    display: flex;
    flex-wrap: nowrap !important;
    width: 100%;
    overflow-x: auto !important;
  }

  :where(.tabs, .tab-buttons, .tab-list, [role="tablist"]) > * {
    flex: 0 0 auto !important;
    white-space: nowrap;
  }
}

@media (max-width: 430px) {
  .page-main,
  .main-content,
  .page-content,
  .content-wrapper {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  :where(.form-actions, .modal-actions, .dialog-actions, .footer-actions, .ti-actions, .xml-actions) > :is(button, .btn, a) {
    width: 100% !important;
    flex: 1 1 100% !important;
  }
}