/* ========================================================================== 
   CoNNecta Cloud - Camada responsiva global
   Build de teste v1.11.11-responsive

   Objetivo:
   - preservar o visual desktop atual;
   - remover a dependencia de zoom para "caber" em telas menores;
   - transformar a sidebar em drawer em tablet/mobile;
   - impedir overflow horizontal da pagina;
   - deixar tabelas realmente largas rolarem dentro do proprio componente;
   - tornar modais, grids, filtros e cabecalhos fluidos.
   ========================================================================== */

:root {
  --cc-responsive-sidebar: clamp(236px, 19vw, 280px);
  --cc-responsive-gutter: clamp(12px, 1.6vw, 22px);
  --cc-responsive-gap: clamp(10px, 1.2vw, 18px);
  --cc-mobile-topbar-height: 58px;
  --cc-safe-inline: max(12px, env(safe-area-inset-left));
}

html,
body.painel-body {
  width: 100%;
  max-width: 100%;
}

body.painel-body {
  min-width: 0 !important;
  min-height: 100vh;
  min-height: 100dvh;
  overflow-x: clip;
}

.painel-body #main-layout,
.painel-body .layout {
  width: 100%;
  max-width: none !important;
  min-width: 0;
  grid-template-columns: var(--cc-responsive-sidebar) minmax(0, 1fr);
}

.painel-body .main {
  width: 100%;
  max-width: none !important;
  min-width: 0;
}

.painel-body .content {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  padding-inline: var(--cc-responsive-gutter);
  gap: var(--cc-responsive-gap);
}

.painel-body .content > *,
.painel-body .panel > *,
.painel-body .card > *,
.painel-body .row > *,
.painel-body [class*="col-"] {
  min-width: 0;
}

.painel-body img,
.painel-body svg,
.painel-body canvas,
.painel-body video,
.painel-body iframe {
  max-width: 100%;
}

.painel-body input,
.painel-body select,
.painel-body textarea {
  max-width: 100%;
}

/* A pagina nunca deve ganhar largura por causa de uma tabela. */
.painel-body :is(
  .table-responsive,
  .table-scroll,
  .connecta-table-wrap,
  .connecta-odin-table-shell,
  .snc-table-wrap,
  .snc-alert-table-wrap,
  .odin-audit-events-list
) {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
}

.painel-body :is(.panel, .card):has(> table) {
  max-width: 100%;
  overflow-x: auto;
}

/* Cabecalhos e barras devem poder quebrar linha em vez de estourar a tela. */
.painel-body :is(
  .logo-tools,
  .connecta-report-header,
  .connecta-module-header,
  .connecta-section-header,
  .connecta-odin-header,
  .pulse-header,
  .snc-header,
  .report-instance-header
) {
  max-width: 100%;
  min-width: 0;
  flex-wrap: wrap;
}

.painel-body :is(
  .connecta-module-header-actions,
  .connecta-section-header-actions,
  .snc-header-actions,
  .snc-inline-actions,
  .odin-audit-actions,
  .cc-dialog-actions
) {
  min-width: 0;
  flex-wrap: wrap;
}

/* Remove o escalonamento artificial das versoes anteriores. */
@media screen and (max-width: 1399px) and (min-width: 701px) {
  body.painel-body {
    zoom: 1 !important;
    width: 100% !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
  }

  .painel-body .sidebar {
    min-height: 0 !important;
  }

  .painel-body .layout,
  .painel-body #main-layout,
  .painel-body main,
  .painel-body .main {
    max-width: none !important;
  }
}

/* --------------------------------------------------------------------------
   Desktop compacto - notebook/monitores 1024-1599
   -------------------------------------------------------------------------- */
@media screen and (max-width: 1599px) {
  :root {
    --cc-responsive-sidebar: clamp(228px, 18vw, 260px);
    --cc-responsive-gutter: clamp(14px, 1.35vw, 20px);
    --cc-responsive-gap: 14px;
  }

  .painel-body .sidebar {
    padding-inline: 16px;
  }

  .painel-body .grid {
    grid-template-columns: minmax(0, 1fr) minmax(280px, 330px);
  }

  .painel-body .download-app-grid,
  .painel-body .cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  }
}

@media screen and (max-width: 1280px) {
  .painel-body .grid,
  .painel-body .pulse-grid-2,
  .painel-body .odin-audit-layout,
  .painel-body .snc-overview-grid,
  .painel-body .snc-events-layout,
  .painel-body .snc-config-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .painel-body :is(.report-summary-grid, .odin-summary-grid, .odin-audit-kpis) {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 155px), 1fr));
  }
}

/* --------------------------------------------------------------------------
   Tablet e telas <= 1100px: sidebar vira drawer.
   -------------------------------------------------------------------------- */
.connecta-mobile-topbar,
.connecta-mobile-sidebar-backdrop {
  display: none;
}

@media screen and (max-width: 1100px) {
  body.painel-body {
    --cc-responsive-gutter: clamp(12px, 2.2vw, 18px);
  }

  body.painel-body.connecta-mobile-sidebar-open {
    overflow: hidden;
  }

  .painel-body #main-layout,
  .painel-body #main-layout.sidebar-collapsed,
  .painel-body .layout,
  .painel-body .layout.sidebar-collapsed {
    display: block;
    width: 100%;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .painel-body .sidebar {
    position: fixed !important;
    inset: 0 auto 0 0;
    z-index: 12050;
    width: min(320px, 88vw) !important;
    max-width: 88vw;
    height: 100vh !important;
    height: 100dvh !important;
    min-height: 0 !important;
    padding: max(16px, env(safe-area-inset-top)) 16px
      max(16px, env(safe-area-inset-bottom));
    overflow-x: hidden;
    overflow-y: auto;
    transform: translate3d(-105%, 0, 0);
    transition:
      transform 0.22s ease,
      background-color 0.18s ease,
      border-color 0.18s ease !important;
    box-shadow: 18px 0 48px rgba(0, 0, 0, 0.28);
  }

  .painel-body #main-layout.connecta-mobile-sidebar-open .sidebar {
    transform: translate3d(0, 0, 0);
  }

  /* Neutraliza as regras visuais do modo recolhido quando estamos no drawer. */
  .painel-body #main-layout.sidebar-collapsed .sidebar .menu a span,
  .painel-body #main-layout.sidebar-collapsed .sidebar a#theme-toggle span,
  .painel-body #main-layout.sidebar-collapsed .sidebar footer span span {
    display: initial;
  }

  .painel-body #main-layout.sidebar-collapsed .sidebar .menu a {
    justify-content: flex-start;
    gap: 12px;
  }

  .painel-body #main-layout.sidebar-collapsed .sidebar #main-logo {
    display: block;
  }

  .painel-body #main-layout.sidebar-collapsed .sidebar #icon-logo {
    display: none !important;
  }

  .connecta-mobile-sidebar-backdrop {
    position: fixed;
    inset: 0;
    z-index: 12040;
    display: block;
    visibility: hidden;
    opacity: 0;
    background: rgba(2, 8, 18, 0.62);
    backdrop-filter: blur(2px);
    transition:
      opacity 0.2s ease,
      visibility 0.2s ease;
  }

  .painel-body #main-layout.connecta-mobile-sidebar-open
    .connecta-mobile-sidebar-backdrop {
    visibility: visible;
    opacity: 1;
  }

  .connecta-mobile-topbar {
    position: sticky;
    top: 0;
    z-index: 11000;
    display: flex;
    min-height: var(--cc-mobile-topbar-height);
    align-items: center;
    gap: 10px;
    padding:
      max(8px, env(safe-area-inset-top))
      max(12px, env(safe-area-inset-right))
      8px
      max(12px, env(safe-area-inset-left));
    color: var(--text-color);
    background: color-mix(in srgb, var(--panel) 94%, transparent);
    border-bottom: 1px solid var(--line);
    backdrop-filter: saturate(140%) blur(10px);
  }

  .connecta-mobile-menu-toggle {
    display: inline-flex;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    align-items: center;
    justify-content: center;
    padding: 0;
    color: var(--text-color);
    background: var(--panel-2);
    border: 1px solid var(--line);
    border-radius: 10px;
    box-shadow: none;
    font-size: 1rem;
    cursor: pointer;
  }

  .connecta-mobile-menu-toggle:hover,
  .connecta-mobile-menu-toggle:focus-visible {
    color: var(--text-color);
    background: color-mix(in srgb, var(--brand-2) 12%, var(--panel-2));
    border-color: var(--brand-2);
    outline: none;
  }

  .connecta-mobile-topbar-title {
    min-width: 0;
    overflow: hidden;
    font-size: 0.86rem;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .painel-body .main {
    width: 100%;
    min-width: 0;
  }

  .painel-body .content {
    margin-bottom: 72px;
  }

  .painel-body .kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .painel-body :is(
    .pulse-toolbar,
    .odin-audit-toolbar,
    .odin-cloud-audit-toolbar,
    .odin-audit-cloud-toolbar,
    .connecta-group-create-bar,
    .snc-filter-bar,
    .snc-tools-report-filter-bar,
    .snc-excecoes-filter-bar-v046,
    .snc-report-filter-bar-v075,
    .snc-overview-filter-line-v029
  ) {
    width: 100%;
    min-width: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .painel-body :is(
    .odin-config-grid,
    .snc-form-grid,
    .snc-form-grid-v011,
    .snc-grid-3-v011,
    .permission-grid
  ) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  /* ODIN: em desktop continua largo; em tela pequena somente a tabela rola. */
  .painel-body #view-connecta-odin,
  .painel-body .connecta-odin-page,
  .painel-body .connecta-odin-table-panel,
  .painel-body .connecta-odin-table-shell {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .painel-body .connecta-odin-table-shell {
    overflow-x: auto !important;
  }

  .painel-body .connecta-odin-table {
    width: max(100%, 960px);
    min-width: 960px !important;
  }

  .painel-body .odinDetailsPanel table {
    min-width: 820px !important;
  }

  .painel-body :is(.modal-content-user, .cc-system-dialog__panel) {
    max-width: calc(100vw - 28px) !important;
  }
}

/* --------------------------------------------------------------------------
   Mobile <= 768px
   -------------------------------------------------------------------------- */
@media screen and (max-width: 768px) {
  :root {
    --cc-responsive-gutter: 12px;
    --cc-responsive-gap: 12px;
    --cc-mobile-topbar-height: 56px;
  }

  .painel-body .content {
    padding: 12px;
    gap: 12px;
  }

  .painel-body .sidebar {
    width: min(310px, 90vw) !important;
    max-width: 90vw;
  }

  .painel-body .sidebar .logo {
    margin-left: 0;
  }

  .painel-body .sidebar .menu a {
    min-height: 42px;
  }

  .painel-body .kpis,
  .painel-body :is(
    .pulse-compliance-grid,
    .snc-kpi-grid,
    .snc-metrics-grid,
    .snc-metrics-grid-v004,
    .snc-metrics-grid-v075,
    .snc-card-grid,
    .report-summary-grid,
    .report-summary-grid-secondary,
    .odin-summary-grid,
    .odin-audit-kpis,
    .odin-report-summary-grid,
    .connecta-gauge-grid
  ) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .painel-body :is(
    .pulse-toolbar,
    .odin-audit-toolbar,
    .odin-cloud-audit-toolbar,
    .odin-audit-cloud-toolbar,
    .connecta-group-create-bar,
    .snc-filter-bar,
    .snc-tools-report-filter-bar,
    .snc-excecoes-filter-bar-v046,
    .snc-report-filter-bar-v075,
    .snc-overview-filter-line-v029,
    .snc-overview-bulk-toolbar-v056,
    .snc-overview-bulk-toolbar-v067,
    .snc-pagination-controls-v067,
    .snc-pagination-controls-v076,
    .odin-config-grid,
    .snc-form-grid,
    .snc-form-grid-v011,
    .snc-grid-2-v011,
    .snc-grid-3-v011,
    .snc-action-grid,
    .snc-action-grid-4,
    .snc-action-grid-v007,
    .snc-action-grid-v011,
    .snc-action-grid-v029,
    .snc-action-grid-v046,
    .permission-grid
  ) {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .painel-body :is(
    .logo-tools,
    .connecta-report-header,
    .connecta-module-header,
    .connecta-section-header,
    .connecta-odin-header,
    .pulse-header,
    .snc-header,
    .report-instance-header
  ) {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .painel-body .logo-tools > div,
  .painel-body .connecta-report-header > div,
  .painel-body .connecta-module-header > div,
  .painel-body .connecta-section-header > div {
    max-width: 100%;
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  .painel-body .logo-tools img,
  .painel-body .connecta-module-brand img,
  .painel-body .connecta-report-header .logo img {
    max-width: min(58vw, 190px) !important;
    height: auto !important;
    max-height: 52px;
    margin-left: 0 !important;
  }

  .painel-body .content > .d-flex.justify-content-between,
  .painel-body .panel > .d-flex.justify-content-between {
    flex-wrap: wrap;
    gap: 8px;
  }

  .painel-body :is(
    .connecta-module-header-actions,
    .connecta-section-header-actions,
    .snc-header-actions,
    .snc-inline-actions,
    .odin-audit-actions,
    .snc-modal-actions,
    .cc-dialog-actions
  ) {
    width: 100%;
    align-items: stretch;
  }

  .painel-body :is(
    .connecta-module-header-actions,
    .connecta-section-header-actions,
    .snc-header-actions,
    .snc-inline-actions,
    .odin-audit-actions,
    .snc-modal-actions,
    .cc-dialog-actions
  ) > :is(button, .btn, .snc-btn, a.btn) {
    flex: 1 1 150px;
  }

  /* Inputs que possuem largura inline no template passam a ser fluidos. */
  .painel-body :is(
    .pulse-search-box,
    .pulse-search,
    .snc-input,
    .snc-select,
    .form-control,
    .form-select
  ) {
    max-width: 100% !important;
  }

  .painel-body .pulse-search-box[style*="width"] {
    width: 100% !important;
  }

  /* Modais: ocupam a viewport util e rolam internamente. */
  .painel-body .modal-content-user {
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
    height: auto !important;
    max-height: calc(100vh - 16px) !important;
    max-height: calc(100dvh - 16px) !important;
    margin: 8px auto !important;
    overflow: auto;
  }

  .painel-body :is(
    .snc-modal-box,
    .snc-modal-box-wide,
    .snc-modal-content,
    .cc-system-dialog__panel,
    .connecta-login-session-dialog,
    .odin-config-modal .modal-dialog
  ) {
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
    max-height: calc(100vh - 16px) !important;
    max-height: calc(100dvh - 16px) !important;
    margin: 8px auto !important;
  }

  .painel-body :is(.snc-modal-body, .snc-modal-body-v011, .odin-config-body) {
    max-height: calc(100vh - 150px) !important;
    max-height: calc(100dvh - 150px) !important;
    overflow: auto !important;
  }

  /* SNC Alertas mobile: layout definido apenas no bloco R15 ao final deste arquivo. */

  #view-snc-visao-geral :is(
    .snc-bulk-action-select-v062,
    .snc-bulk-action-select-v066,
    #snc-overview-selected-count,
    .snc-overview-check-all-v056,
    .snc-bulk-action-apply-v066
  ) {
    grid-column: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    justify-self: stretch !important;
  }

  /* Tabelas administrativas continuam tabelas, mas nao estouram a pagina. */
  .painel-body :is(
    .connecta-theme-table,
    .connecta-data-table,
    .connecta-report-table,
    .odinDetailsPanel table,
    #view-snc-alertas .snc-table,
    #view-snc-tools-report .snc-table
  ) {
    font-size: clamp(0.66rem, 2.2vw, 0.75rem);
  }
}

/* --------------------------------------------------------------------------
   Mobile estreito <= 520px
   -------------------------------------------------------------------------- */
@media screen and (max-width: 520px) {
  :root {
    --cc-responsive-gutter: 10px;
    --cc-responsive-gap: 10px;
  }

  .painel-body .content {
    padding: 10px;
  }

  .painel-body .sidebar {
    width: min(300px, 94vw) !important;
    max-width: 94vw;
  }

  .connecta-mobile-topbar {
    padding-inline: 10px;
  }

  .connecta-mobile-topbar-title {
    font-size: 0.8rem;
  }

  .painel-body .kpis,
  .painel-body :is(
    .pulse-compliance-grid,
    .snc-kpi-grid,
    .snc-metrics-grid,
    .snc-metrics-grid-v004,
    .snc-metrics-grid-v075,
    .snc-card-grid,
    .report-summary-grid,
    .report-summary-grid-secondary,
    .odin-summary-grid,
    .odin-audit-kpis,
    .odin-report-summary-grid,
    .connecta-gauge-grid
  ) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .painel-body .card,
  .painel-body .panel,
  .painel-body .container,
  .painel-body .kpi {
    padding: 10px;
    border-radius: 12px;
  }

  .painel-body :is(
    .connecta-module-header-actions,
    .connecta-section-header-actions,
    .snc-header-actions,
    .snc-inline-actions,
    .odin-audit-actions,
    .snc-modal-actions,
    .cc-dialog-actions
  ) > :is(button, .btn, .snc-btn, a.btn) {
    width: 100%;
    flex-basis: 100%;
  }

  /* SNC Alertas: card mobile definido exclusivamente no bloco R15. */
}

/* --------------------------------------------------------------------------
   Telas baixas (ex.: 1366x768): compacta apenas espacamentos verticais.
   -------------------------------------------------------------------------- */
@media screen and (max-height: 780px) and (min-width: 1101px) {
  .painel-body .sidebar {
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .painel-body .sidebar .logo {
    margin-bottom: 8px;
  }

  .painel-body .sidebar .menu a {
    padding-block: 7px;
    margin-top: 2px;
  }

  .painel-body .content {
    padding-block: 14px;
    margin-bottom: 72px;
  }
}

/* Preferencia de movimento reduzido. */
@media (prefers-reduced-motion: reduce) {
  .painel-body .sidebar,
  .connecta-mobile-sidebar-backdrop,
  .connecta-mobile-menu-toggle {
    transition: none !important;
  }
}

/* Impressao nunca usa drawer/topbar. */
@media print {
  .connecta-mobile-topbar,
  .connecta-mobile-sidebar-backdrop {
    display: none !important;
  }

  body.painel-body {
    overflow: visible !important;
  }
}

/* --------------------------------------------------------------------------
   Correcoes encontradas nos testes de viewport reais
   -------------------------------------------------------------------------- */

/* Em 1366px o conteudo util e menor que os antigos 1150px do ODIN. Mantemos
   a tabela larga, mas o quadro passa a conter a rolagem sem aumentar a pagina. */
@media screen and (max-width: 1399px) {
  .painel-body #view-connecta-odin,
  .painel-body .connecta-odin-page,
  .painel-body .connecta-odin-table-panel,
  .painel-body .connecta-odin-table-shell {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .painel-body .connecta-odin-table-shell,
  .painel-body .connecta-odin-table-panel {
    overflow-x: auto !important;
  }

  .painel-body .connecta-odin-table {
    width: max(100%, 1100px);
    min-width: 1100px !important;
  }
}

/* O header da Visao Geral tinha itens com margem/min-width de versoes antigas.
   Em mobile cada informacao passa a ocupar uma linha fluida. */
@media screen and (max-width: 768px) {
  #view-snc-visao-geral .snc-overview-head-actions {
    display: grid !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 8px !important;
    margin: 0 !important;
  }

  #view-snc-visao-geral .snc-overview-head-actions > *,
  #view-snc-visao-geral :is(
    .snc-live-clock-card,
    .snc-mini-kpi-resolver,
    .snc-last-update-box,
    .snc-refresh-field-header-v075,
    .snc-refresh-field-v066
  ) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    justify-self: stretch !important;
  }
}

@media screen and (max-width: 520px) {
  #view-snc-visao-geral .snc-refresh-field-header-v075 .snc-refresh-btn-v066,
  #view-snc-visao-geral .snc-refresh-field-v066 .snc-refresh-btn-v066 {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    transform: none !important;
  }
}


/* ==========================================================================\n   CoNNecta Cloud - Responsividade global v1.11.11 R2\n   Páginas standalone, relatórios, autenticação e ODIN remoto\n   ========================================================================== */

/* ---------- Base para páginas fora do painel principal ---------- */
html:has(body.connecta-standalone-page),
html:has(body.connecta-report-frame),
html:has(body.odin-remote-page),
body.connecta-standalone-page,
body.connecta-report-frame,
body.connecta-auth-page,
body.maintenance-body,
body.odin-remote-page {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

body.connecta-standalone-page,
body.connecta-report-frame,
body.connecta-auth-page,
body.maintenance-body {
  overflow-x: clip;
}

body.connecta-standalone-page *,
body.connecta-report-frame *,
body.connecta-auth-page *,
body.maintenance-body * {
  box-sizing: border-box;
}

body.connecta-standalone-page :is(img, svg, canvas, video, iframe),
body.connecta-report-frame :is(img, svg, canvas, video, iframe),
body.connecta-auth-page :is(img, svg, canvas, video, iframe),
body.maintenance-body :is(img, svg, canvas, video, iframe) {
  max-width: 100%;
}

/* Neutraliza o zoom legado também nas páginas que não usam .painel-body. */
@media screen and (max-width: 1399px) and (min-width: 701px) {
  body.connecta-standalone-page,
  body.connecta-report-frame:not(.connecta-report-embedded-frame) {
    zoom: 1 !important;
    width: 100% !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
  }

  body.connecta-standalone-page main,
  body.connecta-report-frame main {
    width: 100% !important;
    max-width: none !important;
  }
}

/* ---------- RDD / HSE / VeloXX standalone e incorporados ---------- */
body.connecta-report-frame {
  min-height: 100vh;
  min-height: 100dvh;
}

body.connecta-report-frame :is(.container-fluid, .container-hse, .container, main) {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

body.connecta-report-frame :is(.container-hse, .container-fluid) {
  padding-inline: clamp(12px, 2vw, 26px) !important;
}

body.connecta-report-frame :is(.row, [class*="grid"], .controls-hse, .blocks-hse) > * {
  min-width: 0;
}

body.connecta-report-frame :is(
  .table-responsive,
  .table-scroll,
  .connecta-table-wrap,
  .connecta-report-table-wrap,
  .report-table-wrap
) {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto !important;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
}

body.connecta-report-frame .disk-mini {
  min-width: min(220px, 100%) !important;
}

body.hse-body.connecta-report-frame .controls-hse {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)) !important;
}

body.hse-body.connecta-report-frame .controls-hse .col,
body.hse-body.connecta-report-frame .controls-hse .generate-hse {
  width: 100%;
  min-width: 0 !important;
}

body.hse-body.connecta-report-frame .controls-hse :is(input, select, button, .dropdown) {
  width: 100%;
  max-width: 100%;
}

body.hse-body.connecta-report-frame .blocks-hse {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)) !important;
}

body.connecta-report-frame .connecta-report-header {
  width: 100%;
  max-width: 100%;
}

body.connecta-report-frame .connecta-report-header > .col-12,
body.connecta-report-frame .connecta-report-header .justify-content-between {
  width: 100%;
  min-width: 0;
}

body.connecta-report-frame .connecta-report-header .logo {
  min-width: 0;
}

body.connecta-report-frame .connecta-report-header .logo img {
  max-width: min(42vw, 180px) !important;
  height: auto !important;
}

@media screen and (max-width: 900px) {
  body.connecta-report-frame :is(
    .connecta-chart-pair,
    .charts-hse,
    .velox-row-800,
    .velox-gauges,
    .cards-grid,
    .grid-4
  ) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.connecta-report-frame .connecta-report-header,
  body.connecta-report-frame .connecta-report-header > .col-12,
  body.connecta-report-frame .connecta-report-header .justify-content-between {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 10px !important;
  }

  body.connecta-report-frame .connecta-report-header .logo {
    width: 100%;
    flex-wrap: wrap;
  }

  body.connecta-report-frame .connecta-report-header .logo > a {
    margin-right: 12px !important;
  }

  body.connecta-report-frame :is(.chart-container, .line-chart-container, .velox-chart-box) {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 220px;
  }
}

@media screen and (max-width: 600px) {
  body.connecta-report-frame :is(.container-hse, .container-fluid) {
    padding: 10px !important;
  }

  body.connecta-report-frame :is(
    .report-summary-grid,
    .report-summary-grid-secondary,
    .connecta-gauge-grid,
    .blocks-hse,
    .controls-hse,
    .cards-grid,
    .grid-4,
    .charts-hse
  ) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.connecta-report-frame .connecta-report-header {
    margin-bottom: 8px !important;
    padding-bottom: 8px !important;
  }

  body.connecta-report-frame .connecta-report-header .logo img {
    max-width: min(62vw, 170px) !important;
  }

  body.connecta-report-frame :is(.btn, .btn-hse, .btn-connecta-ghost) {
    max-width: 100%;
  }

  body.connecta-report-frame .blocks-hse h4 {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 8px;
  }

  body.connecta-report-frame .blocks-hse .blk-select-all {
    margin-top: 0 !important;
  }
}

/* ---------- Visão geral fullscreen / Portal do cliente ---------- */
@media screen and (max-width: 1399px) {
  body.connecta-standalone-page .content-wrapper-scale {
    width: 100% !important;
    min-height: 100vh;
    min-height: 100dvh;
    transform: none !important;
    transform-origin: top center !important;
  }
}

@media screen and (max-width: 768px) {
  body.connecta-standalone-page main {
    max-width: 100% !important;
  }

  body.connecta-standalone-page .content-wrapper-scale > div {
    padding: 14px !important;
  }

  body.connecta-standalone-page :is(table, .overflow-x-auto) {
    max-width: 100%;
  }

  body.connecta-standalone-page .overflow-x-auto {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  body.connecta-standalone-page :is(.fixed.inset-0, [role="dialog"]) {
    max-width: 100vw;
  }
}

@media screen and (max-width: 480px) {
  body.connecta-standalone-page nav > div,
  body.connecta-standalone-page main,
  body.connecta-standalone-page footer > div {
    padding-inline: 12px !important;
  }

  body.connecta-standalone-page main {
    padding-top: 18px !important;
    padding-bottom: 18px !important;
  }
}

/* ---------- 2FA e páginas de autenticação auxiliares ---------- */
body.connecta-auth-page .container-2fa {
  width: min(100%, 520px) !important;
  max-width: calc(100vw - 24px) !important;
  margin-inline: auto;
}

body.connecta-auth-page .container-2fa img {
  max-width: 100% !important;
  height: auto !important;
}

body.connecta-auth-page :is(input, select, textarea, button, .btn, .input-group) {
  max-width: 100%;
}

@media screen and (max-width: 600px) {
  body.connecta-auth-page {
    padding: max(12px, env(safe-area-inset-top)) 12px max(12px, env(safe-area-inset-bottom)) !important;
    place-items: center;
  }

  body.connecta-auth-page .container-2fa {
    width: 100% !important;
    max-width: 100% !important;
    padding: 18px !important;
    border-radius: 14px !important;
  }

  body.connecta-auth-page .container-2fa :is(button, .btn) {
    min-height: 42px;
  }
}

/* ---------- Modo manutenção ---------- */
@media screen and (max-width: 520px) {
  body.maintenance-body {
    padding: max(8px, env(safe-area-inset-top)) 8px max(8px, env(safe-area-inset-bottom));
    place-items: start center;
  }

  .maintenance-shell {
    width: 100% !important;
    border-radius: 14px !important;
  }

  .maintenance-header {
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 12px !important;
    padding: 15px !important;
  }

  .maintenance-header > div:first-child {
    grid-column: 1 / -1;
  }

  .maintenance-logo {
    width: min(96px, 42vw) !important;
  }

  .maintenance-content {
    padding: 12px !important;
  }

  .maintenance-section {
    padding: 13px !important;
  }

  .maintenance-actions,
  .qr-wrap,
  .status-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .maintenance-actions > *,
  .maintenance-button {
    width: 100%;
  }

  .maintenance-section .input-group {
    align-items: stretch;
    flex-direction: column;
  }

  .maintenance-section .input-group > * {
    width: 100% !important;
    border-radius: 10px !important;
  }
}

/* ---------- ODIN acesso remoto ---------- */
body.odin-remote-page {
  --odin-mobile-dock-height: 0px;
  min-width: 0;
  min-height: 100vh;
  min-height: 100dvh;
  overflow: hidden;
  overscroll-behavior: none;
}

body.odin-remote-page .odin-mobile-only {
  display: none !important;
}

body.odin-remote-page #remoteVideo {
  touch-action: none;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
}

@media screen and (max-width: 980px) {
  body.odin-remote-page {
    --odin-sidebar-width: 0px;
    --odin-mobile-dock-height: 62px;
  }

  body.odin-remote-page .header {
    left: 0 !important;
    right: 0 !important;
    width: 100%;
    max-width: 100vw;
    padding-inline: max(8px, env(safe-area-inset-left)) max(8px, env(safe-area-inset-right));
    overflow: hidden;
  }

  body.odin-remote-page .header-left,
  body.odin-remote-page .header-right {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }

  body.odin-remote-page .header-left::-webkit-scrollbar,
  body.odin-remote-page .header-right::-webkit-scrollbar,
  body.odin-remote-page #sideBar::-webkit-scrollbar {
    display: none;
  }

  body.odin-remote-page .header-left > *,
  body.odin-remote-page .header-right > * {
    flex: 0 0 auto;
  }

  body.odin-remote-page .header-left .btn,
  body.odin-remote-page .header-right .btn {
    min-height: 32px;
    padding: 6px 9px !important;
    border-radius: 9px !important;
    font-size: 11px !important;
    white-space: nowrap;
  }

  body.odin-remote-page #qualitySelect {
    width: 126px !important;
    min-width: 126px;
    min-height: 32px;
    font-size: 11px;
  }

  body.odin-remote-page #sideBar {
    top: auto !important;
    right: 0;
    bottom: 0;
    width: 100% !important;
    height: calc(var(--odin-mobile-dock-height) + env(safe-area-inset-bottom)) !important;
    min-height: 0;
    padding: 7px max(8px, env(safe-area-inset-right)) max(7px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));
    flex-direction: row;
    justify-content: flex-start;
    gap: 7px;
    overflow-x: auto;
    overflow-y: hidden;
    border-top: 1px solid var(--odin-border-soft);
    border-right: 0;
    box-shadow: 0 -10px 28px rgba(0, 0, 0, 0.28);
  }

  body.odin-remote-page #sideBar button {
    width: 44px;
    min-width: 44px;
    height: 44px;
    flex: 0 0 44px;
  }

  body.odin-remote-page #sideBar .odin-mobile-only {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
  }

  body.odin-remote-page .video-container {
    left: 0 !important;
    right: 0 !important;
    bottom: calc(var(--odin-mobile-dock-height) + env(safe-area-inset-bottom)) !important;
  }

  body.odin-remote-page .video-container::before {
    inset: 2px;
    border-radius: 10px;
  }

  body.odin-remote-page #shortcutPanel,
  body.odin-remote-page .odin-floating-panel {
    top: auto !important;
    left: max(8px, env(safe-area-inset-left)) !important;
    right: max(8px, env(safe-area-inset-right)) !important;
    bottom: calc(var(--odin-mobile-dock-height) + env(safe-area-inset-bottom) + 8px) !important;
    width: auto !important;
    max-width: none !important;
    max-height: min(68vh, 620px) !important;
    max-height: min(68dvh, 620px) !important;
    border-radius: 16px 16px 10px 10px;
  }

  body.odin-remote-page :is(.shortcut-panel-body, .odin-panel-body) {
    max-height: calc(min(68vh, 620px) - 64px) !important;
    max-height: calc(min(68dvh, 620px) - 64px) !important;
  }

  body.odin-remote-page #chatPanel {
    display: none;
    flex-direction: column;
  }

  body.odin-remote-page #chatPanel[style*="display: block"] {
    display: flex !important;
  }

  body.odin-remote-page #chatMessages {
    min-height: 120px;
    max-height: none;
    flex: 1 1 auto;
  }

  body.odin-remote-page .chat-input-row {
    padding-bottom: max(12px, env(safe-area-inset-bottom));
  }

  body.odin-remote-page #transferPanel {
    left: max(8px, env(safe-area-inset-left));
    right: max(8px, env(safe-area-inset-right));
    bottom: calc(var(--odin-mobile-dock-height) + env(safe-area-inset-bottom) + 8px);
    width: auto;
    max-width: none;
    max-height: 56vh;
    overflow: auto;
  }

  body.odin-remote-page #globalDropZone > div {
    width: calc(100vw - 32px);
    max-width: 460px;
    padding: 24px !important;
  }
}

@media screen and (max-width: 600px) {
  body.odin-remote-page {
    --odin-header-height: 96px;
    --odin-mobile-dock-height: 58px;
  }

  body.odin-remote-page .header {
    height: var(--odin-header-height) !important;
    min-height: var(--odin-header-height);
    gap: 5px;
    padding-top: max(6px, env(safe-area-inset-top));
    padding-bottom: 6px;
  }

  body.odin-remote-page .header-left,
  body.odin-remote-page .header-right {
    gap: 6px;
  }

  body.odin-remote-page .odin-title b,
  body.odin-remote-page #machineName {
    max-width: 42vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.odin-remote-page #connectedUsers {
    min-width: 38px;
    height: 30px;
    padding-inline: 7px;
    font-size: 11px;
  }

  body.odin-remote-page #sideBar button {
    width: 42px;
    min-width: 42px;
    height: 42px;
    flex-basis: 42px;
    border-radius: 12px;
    font-size: 16px;
  }

  body.odin-remote-page #shortcutPanel,
  body.odin-remote-page .odin-floating-panel {
    left: 6px !important;
    right: 6px !important;
    bottom: calc(var(--odin-mobile-dock-height) + env(safe-area-inset-bottom) + 6px) !important;
    max-height: 72dvh !important;
  }

  body.odin-remote-page .shortcut-item {
    padding: 9px 10px;
  }

  body.odin-remote-page .shortcut-key {
    font-size: 12px;
  }

  body.odin-remote-page .shortcut-desc {
    font-size: 11px;
  }

  body.odin-remote-page .odin-user-device {
    max-width: 45vw;
  }
}

/* Landscape de celular: libera o máximo possível para o vídeo. */
@media screen and (orientation: landscape) and (max-height: 600px) and (max-width: 1000px) {
  body.odin-remote-page {
    --odin-header-height: 54px;
    --odin-mobile-dock-height: 50px;
  }

  body.odin-remote-page .header {
    height: var(--odin-header-height) !important;
    min-height: var(--odin-header-height);
    flex-direction: row !important;
    align-items: center !important;
    gap: 8px;
    padding-block: 5px;
  }

  body.odin-remote-page .header-left {
    width: auto;
    flex: 1 1 auto;
  }

  body.odin-remote-page .header-right {
    width: auto;
    max-width: 42vw;
    flex: 0 1 auto;
  }

  body.odin-remote-page #sideBar {
    padding-top: 4px;
    padding-bottom: max(4px, env(safe-area-inset-bottom));
  }

  body.odin-remote-page #sideBar button {
    width: 40px;
    min-width: 40px;
    height: 38px;
    flex-basis: 40px;
  }

  body.odin-remote-page #shortcutPanel,
  body.odin-remote-page .odin-floating-panel {
    max-height: calc(100dvh - var(--odin-header-height) - var(--odin-mobile-dock-height) - 12px) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.odin-remote-page *,
  body.connecta-standalone-page *,
  body.connecta-report-frame * {
    scroll-behavior: auto !important;
  }
}

/* ========================================================================== */
/* ODIN mobile fullscreen R3                                                  */
/* Vídeo sempre ocupa a viewport; cabeçalho e dock só aparecem sob demanda.  */
/* ========================================================================== */
body.odin-remote-page .odin-mobile-controls-toggle,
body.odin-remote-page .odin-mobile-controls-close,
body.odin-remote-page .odin-mobile-controls-backdrop {
  display: none !important;
}

@media screen and (max-width: 980px) {
  html:has(body.odin-remote-page),
  body.odin-remote-page {
    width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: #000 !important;
  }

  body.odin-remote-page {
    --odin-header-height: 0px !important;
    --odin-sidebar-width: 0px !important;
    --odin-mobile-dock-height: 0px !important;
  }

  /* A tela remota nunca perde espaço para menus no mobile. */
  body.odin-remote-page .video-container {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    min-width: 0 !important;
    min-height: 0 !important;
    background: #000 !important;
    z-index: 1 !important;
  }

  body.odin-remote-page .video-container::before {
    display: none !important;
  }

  body.odin-remote-page #remoteVideo {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    background: #000 !important;
  }

  /* Botão discreto que permanece disponível com todos os menus recolhidos. */
  body.odin-remote-page .odin-mobile-controls-toggle {
    position: fixed !important;
    top: 50% !important;
    right: max(8px, env(safe-area-inset-right)) !important;
    z-index: 260 !important;
    display: inline-flex !important;
    width: 48px !important;
    height: 48px !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    color: #fff !important;
    background: rgba(7, 21, 38, 0.78) !important;
    border: 1px solid rgba(56, 189, 248, 0.5) !important;
    border-radius: 16px 0 0 16px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.38) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    transform: translateY(-50%) !important;
    opacity: 0.82;
    pointer-events: auto !important;
    transition: opacity 0.16s ease, transform 0.16s ease !important;
  }

  body.odin-remote-page .odin-mobile-controls-toggle:active {
    opacity: 1;
    transform: translateY(-50%) scale(0.94) !important;
  }

  body.odin-remote-page.odin-mobile-controls-open .odin-mobile-controls-toggle {
    opacity: 0 !important;
    pointer-events: none !important;
  }

  /* Fundo clicável para recolher os controles. */
  body.odin-remote-page .odin-mobile-controls-backdrop {
    position: fixed !important;
    inset: 0 !important;
    z-index: 200 !important;
    display: block !important;
    background: rgba(0, 0, 0, 0.38) !important;
    backdrop-filter: blur(2px) !important;
    -webkit-backdrop-filter: blur(2px) !important;
    opacity: 0;
    visibility: hidden;
    pointer-events: none !important;
    transition: opacity 0.18s ease, visibility 0.18s ease !important;
  }

  body.odin-remote-page.odin-mobile-controls-open .odin-mobile-controls-backdrop {
    opacity: 1;
    visibility: visible;
    pointer-events: auto !important;
  }

  /* Cabeçalho vira um painel flutuante. Quando fechado não ocupa nenhum pixel. */
  body.odin-remote-page .header {
    position: fixed !important;
    top: max(8px, env(safe-area-inset-top)) !important;
    right: max(8px, env(safe-area-inset-right)) !important;
    left: max(8px, env(safe-area-inset-left)) !important;
    bottom: auto !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: min(58vh, 520px) !important;
    max-height: min(58dvh, 520px) !important;
    margin: 0 !important;
    padding: 50px 12px 12px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    color: var(--odin-text) !important;
    background: rgba(8, 19, 34, 0.96) !important;
    border: 1px solid rgba(56, 189, 248, 0.34) !important;
    border-radius: 18px !important;
    box-shadow: 0 20px 55px rgba(0, 0, 0, 0.52) !important;
    backdrop-filter: blur(18px) !important;
    -webkit-backdrop-filter: blur(18px) !important;
    z-index: 220 !important;
    opacity: 0;
    visibility: hidden;
    pointer-events: none !important;
    transform: translateY(calc(-100% - 24px)) !important;
    transition: transform 0.22s ease, opacity 0.18s ease, visibility 0.22s ease !important;
  }

  body.odin-remote-page.odin-mobile-controls-open .header {
    opacity: 1;
    visibility: visible;
    pointer-events: auto !important;
    transform: translateY(0) !important;
  }

  body.odin-remote-page .header-left,
  body.odin-remote-page .header-right {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    display: flex !important;
    flex: 0 0 auto !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    overflow: visible !important;
  }

  body.odin-remote-page .header-left > *,
  body.odin-remote-page .header-right > * {
    flex: 0 0 auto !important;
  }

  body.odin-remote-page .header-left .btn,
  body.odin-remote-page .header-right .btn {
    min-height: 34px !important;
    padding: 6px 9px !important;
    font-size: 11px !important;
    white-space: nowrap !important;
  }

  body.odin-remote-page #qualitySelect {
    width: min(100%, 150px) !important;
    min-width: 126px !important;
    min-height: 34px !important;
  }

  body.odin-remote-page .odin-mobile-controls-close {
    position: absolute !important;
    top: 8px !important;
    right: 8px !important;
    z-index: 3 !important;
    display: inline-flex !important;
    min-width: 104px !important;
    height: 34px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    padding: 0 10px !important;
    color: #eaf6ff !important;
    background: rgba(14, 165, 233, 0.14) !important;
    border: 1px solid rgba(56, 189, 248, 0.32) !important;
    border-radius: 10px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
  }

  /* Barra de ferramentas também fica oculta e surge somente com o menu. */
  body.odin-remote-page #sideBar {
    position: fixed !important;
    top: auto !important;
    right: max(8px, env(safe-area-inset-right)) !important;
    bottom: max(8px, env(safe-area-inset-bottom)) !important;
    left: max(8px, env(safe-area-inset-left)) !important;
    width: auto !important;
    height: auto !important;
    min-height: 58px !important;
    max-height: 74px !important;
    padding: 7px 8px !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 7px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    background: rgba(8, 19, 34, 0.96) !important;
    border: 1px solid rgba(56, 189, 248, 0.3) !important;
    border-radius: 16px !important;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.46) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    z-index: 221 !important;
    opacity: 0;
    visibility: hidden;
    pointer-events: none !important;
    transform: translateY(calc(100% + 24px)) !important;
    transition: transform 0.22s ease, opacity 0.18s ease, visibility 0.22s ease !important;
    scrollbar-width: none;
  }

  body.odin-remote-page #sideBar::-webkit-scrollbar {
    display: none !important;
  }

  body.odin-remote-page.odin-mobile-controls-open #sideBar {
    opacity: 1;
    visibility: visible;
    pointer-events: auto !important;
    transform: translateY(0) !important;
  }

  body.odin-remote-page #sideBar button {
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    flex: 0 0 44px !important;
  }

  body.odin-remote-page #sideBar .odin-mobile-only {
    display: inline-flex !important;
  }

  /* Painéis secundários aparecem sobre a tela cheia, sem reservar área. */
  body.odin-remote-page #shortcutPanel,
  body.odin-remote-page .odin-floating-panel,
  body.odin-remote-page #transferPanel {
    z-index: 240 !important;
    bottom: max(8px, env(safe-area-inset-bottom)) !important;
  }

  body.odin-remote-page #shortcutPanel,
  body.odin-remote-page .odin-floating-panel {
    top: auto !important;
    left: max(8px, env(safe-area-inset-left)) !important;
    right: max(8px, env(safe-area-inset-right)) !important;
    width: auto !important;
    max-width: none !important;
    max-height: min(78vh, 680px) !important;
    max-height: min(78dvh, 680px) !important;
  }
}

@media screen and (max-width: 600px) {
  body.odin-remote-page .header {
    max-height: min(68vh, 560px) !important;
    max-height: min(68dvh, 560px) !important;
  }

  body.odin-remote-page .odin-title,
  body.odin-remote-page #machineName {
    max-width: min(62vw, 260px) !important;
  }

  body.odin-remote-page .odin-mobile-controls-toggle {
    width: 44px !important;
    height: 46px !important;
    right: max(4px, env(safe-area-inset-right)) !important;
  }
}

@media screen and (orientation: landscape) and (max-height: 600px) and (max-width: 1000px) {
  body.odin-remote-page .header {
    top: max(5px, env(safe-area-inset-top)) !important;
    right: max(5px, env(safe-area-inset-right)) !important;
    left: max(5px, env(safe-area-inset-left)) !important;
    max-height: calc(100dvh - 82px) !important;
    padding-top: 44px !important;
  }

  body.odin-remote-page #sideBar {
    right: max(5px, env(safe-area-inset-right)) !important;
    bottom: max(5px, env(safe-area-inset-bottom)) !important;
    left: max(5px, env(safe-area-inset-left)) !important;
    min-height: 52px !important;
    max-height: 58px !important;
    padding-block: 5px !important;
  }

  body.odin-remote-page #sideBar button {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    flex-basis: 40px !important;
  }
}

/* ========================================================================== */
/* ODIN mobile R4 - teclado automatico e zoom interno                         */
/* ========================================================================== */
@media screen and (max-width: 980px) {
  body.odin-remote-page #remoteVideo {
    transform-origin: center center !important;
    will-change: transform;
  }

  body.odin-remote-page:not(.odin-remote-zoom-gesture) #remoteVideo {
    transition: transform 0.14s ease-out !important;
  }

  body.odin-remote-page.odin-remote-zoom-gesture #remoteVideo {
    transition: none !important;
  }

  body.odin-remote-page #sideBar .odin-zoom-control {
    color: #dff6ff !important;
    border-color: rgba(56, 189, 248, 0.34) !important;
  }

  body.odin-remote-page #sideBar .odin-zoom-reset {
    width: 52px !important;
    min-width: 52px !important;
    flex-basis: 52px !important;
    padding-inline: 4px !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em !important;
  }

  body.odin-remote-page.odin-remote-zoomed #sideBar .odin-zoom-reset {
    color: #7dd3fc !important;
    background: rgba(14, 165, 233, 0.16) !important;
    border-color: rgba(56, 189, 248, 0.62) !important;
  }

  /* Quando o teclado virtual entra em cena, os controles somem para deixar
     somente a tela remota e o proprio teclado do aparelho. */
  body.odin-remote-page.odin-mobile-keyboard-open .odin-mobile-controls-toggle {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  body.odin-remote-page.odin-mobile-keyboard-open .header,
  body.odin-remote-page.odin-mobile-keyboard-open #sideBar,
  body.odin-remote-page.odin-mobile-keyboard-open .odin-mobile-controls-backdrop {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}


/* ==========================================================================
   R5 - Rodape no final da main
   Mantem o rodape no fim do conteudo e no rodape da viewport quando a tela
   possui pouco conteudo, sem usar position: fixed.
   ========================================================================== */
.painel-body .main {
  display: flex;
  min-height: 100vh;
  min-height: 100dvh;
  flex-direction: column;
}

.painel-body .connecta-main-footer {
  width: 100%;
  margin-top: auto !important;
  padding: 24px var(--cc-responsive-gutter) max(18px, env(safe-area-inset-bottom));
  flex: 0 0 auto;
  color: var(--muted);
}

.painel-body .connecta-main-footer > span {
  width: 100%;
  justify-content: center;
}

.painel-body .connecta-main-footer p {
  margin: 0;
  max-width: 980px;
}

@media screen and (max-width: 1100px) {
  .painel-body .connecta-main-footer {
    padding-inline: max(14px, env(safe-area-inset-left), env(safe-area-inset-right));
    padding-bottom: max(20px, env(safe-area-inset-bottom));
  }
}

/* ========================================================================== */
/* R6 - Ajustes Parte 2.5                                                     */
/* Home, relatorios, ODIN, Auditoria, SNC, Radar, Downloads e sessoes login  */
/* ========================================================================== */

/* Base clara off-white e grade consistente. */
body.light-mode {
  --bg: #f6f7f9;
  --panel: #ffffff;
  --panel-2: #f9fbfd;
  --line: #d7e0eb;
  background: var(--bg) !important;
}

/* Home: tema fora do menu de configuracoes, ao lado de Inicio. */
.painel-body .connecta-home-theme-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 38px;
  align-items: center;
  gap: 7px;
  width: 100%;
}

.painel-body .connecta-home-theme-row #btn-home {
  min-width: 0;
  margin: 0 !important;
}

.painel-body .connecta-theme-icon-toggle {
  display: inline-grid;
  width: 38px;
  height: 38px;
  place-items: center;
  padding: 0;
  cursor: pointer;
  background: transparent;
  color: var(--text-color);
  border: 1px solid transparent;
  border-radius: 10px;
  box-shadow: none;
  transition: background-color .16s ease, border-color .16s ease, transform .16s ease;
}

.painel-body .connecta-theme-icon-toggle:hover,
.painel-body .connecta-theme-icon-toggle:focus-visible {
  background: color-mix(in srgb, var(--brand-2) 10%, transparent);
  border-color: color-mix(in srgb, var(--brand-2) 34%, transparent);
  transform: none;
  outline: none;
}

/* Iconografia do menu: azul do logo no claro; degradê de botoes no escuro. */
body.light-mode.painel-body .sidebar .menu :is(a, button) > i,
body.light-mode.painel-body .connecta-theme-icon-toggle i {
  color: #228fc7 !important;
}

body.dark-mode.painel-body .sidebar .menu :is(a, button) > i,
body.dark-mode.painel-body .connecta-theme-icon-toggle i {
  color: var(--brand-2, #00a3a3) !important;
}

@supports (-webkit-background-clip: text) {
  body.dark-mode.painel-body .sidebar .menu :is(a, button) > i,
  body.dark-mode.painel-body .connecta-theme-icon-toggle i {
    background: linear-gradient(135deg, #38bdf8, #2df5bd);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
}

/* Padrao de grades/cards da plataforma. */
body.light-mode.painel-body :is(
  .panel, .card, .connecta-report-card, .connecta-group-card,
  .download-app-card, .odin-audit-card, .odin-audit-unified-card,
  .snc-panel, .snc-card, .snc-report-panel, .snc-config-panel,
  .snc-triggers-panel, .snc-trigger-card, .snc-config-card
) {
  border-color: #d7e0eb !important;
}

body.dark-mode.painel-body :is(
  .download-app-card, .connecta-group-card, .connecta-report-card,
  .odin-audit-card, .odin-audit-unified-card,
  .snc-panel, .snc-card, .snc-report-panel, .snc-config-panel,
  .snc-triggers-panel, .snc-trigger-card, .snc-config-card
) {
  border-color: color-mix(in srgb, #2df5bd 28%, var(--line, #415a77)) !important;
}

/* Downloads: grade bem visivel em ambos os temas. */
body.light-mode .download-app-card {
  background: #fff !important;
  border: 1px solid #cbd8e6 !important;
  box-shadow: 0 5px 16px rgba(15, 23, 42, .055) !important;
}

body.light-mode .download-app-card .download-app-icon,
body.light-mode #view-downloads :is(.fa-solid, .fas) {
  color: #228fc7 !important;
}

body.dark-mode .download-app-card {
  border: 1px solid rgba(45, 245, 189, .42) !important;
  box-shadow: inset 0 0 0 1px rgba(45, 245, 189, .04) !important;
}

body.dark-mode .download-app-card .download-app-icon,
body.dark-mode #view-downloads :is(.fa-solid, .fas) {
  color: #2df5bd !important;
}

/* -------------------------------------------------------------------------- */
/* RDD / HSE / VeloXX - cabecalho e conteudo                                  */
/* -------------------------------------------------------------------------- */
.connecta-report-logo-link {
  display: inline-flex;
  align-items: center;
  margin-right: 10px !important;
  flex: 0 0 auto;
}

body.connecta-report-frame .connecta-report-header {
  gap: 12px !important;
}

body.connecta-report-frame .connecta-report-header .logo,
body.connecta-report-frame .connecta-module-brand {
  gap: 10px !important;
}

body.connecta-report-frame .connecta-report-header .title,
body.connecta-report-frame .connecta-module-brand h2 {
  font-size: clamp(.96rem, 1.15vw, 1.08rem) !important;
  line-height: 1.2 !important;
}

body.connecta-report-frame .connecta-report-header .small,
body.connecta-report-frame .connecta-module-brand p {
  font-size: clamp(.68rem, .85vw, .76rem) !important;
  line-height: 1.35 !important;
}

.connecta-computer-description-title {
  font-size: 90% !important;
}

.report-summary-item strong {
  max-width: 100%;
  overflow-wrap: anywhere;
  font-size: clamp(.66rem, .88vw, .76rem) !important;
  line-height: 1.2;
}

.connecta-speedtest-server-info {
  display: block;
  font-weight: 700 !important;
}

/* HSE: recursos mais compactos e alinhados. */
.hse-body .blocks-hse {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.hse-body .blocks-hse .blk {
  min-height: 38px;
  margin: 0 !important;
  padding: 8px 9px !important;
  font-size: .72rem !important;
  line-height: 1.2;
}

body.dark-mode.hse-body .blocks-hse .blk,
body.dark-mode.hse-body .blocks-hse h4,
body.dark-mode.hse-body .blocks-hse label {
  color: #fff !important;
}

body.light-mode.hse-body .blocks-hse .blk,
body.light-mode.hse-body .blocks-hse h4,
body.light-mode.hse-body .blocks-hse label {
  color: #172033 !important;
}

.hse-body .controls-hse {
  column-gap: 10px !important;
  row-gap: 8px !important;
}

.hse-body .controls-hse :is(input, select, button) {
  min-height: 34px;
}

@media screen and (max-width: 1100px) {
  .hse-body .blocks-hse { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
@media screen and (max-width: 780px) {
  .hse-body .blocks-hse { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media screen and (max-width: 480px) {
  .hse-body .blocks-hse { grid-template-columns: 1fr !important; }
}

@media print {
  #disk-charts-container {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10mm !important;
    align-items: start !important;
  }
  #disk-charts-container .disk-chart-item {
    width: 100% !important;
    max-width: none !important;
    flex: none !important;
    break-inside: avoid !important;
    page-break-inside: avoid !important;
  }
}

/* -------------------------------------------------------------------------- */
/* ODIN principal / MacOS                                                     */
/* -------------------------------------------------------------------------- */
#view-connecta-odin .row.g-3.mb-4 > [class*="col-"] .panel {
  min-height: 78px;
  padding: 10px 12px !important;
}

#view-connecta-odin .row.g-3.mb-4 .fs-3 {
  font-size: 1.25rem !important;
  line-height: 1.05;
}

#view-connecta-odin .connecta-odin-table-panel {
  padding: 10px !important;
}

#view-connecta-odin #connectaOdinGroupFilter {
  width: 100%;
}

#view-connecta-odin .connecta-odin-table th,
#view-connecta-odin .connecta-odin-table td {
  padding-block: 7px !important;
}

.connecta-linked-status-r6 {
  display: inline-flex;
  min-width: 42px;
  justify-content: center;
  padding: 3px 8px;
  border: 1px solid color-mix(in srgb, var(--ok) 55%, var(--line));
  border-radius: 999px;
  color: var(--ok);
  font-size: .66rem;
  font-weight: 600;
}

.connecta-linked-status-r6.is-no {
  color: var(--muted);
  border-color: var(--line);
}

/* -------------------------------------------------------------------------- */
/* Auditoria ODIN                                                             */
/* -------------------------------------------------------------------------- */
.odin-audit-unified-card {
  min-width: 0;
}

.odin-audit-unified-layout {
  display: grid;
  grid-template-columns: minmax(250px, .8fr) minmax(0, 1.35fr);
  gap: 12px;
  min-width: 0;
}

.odin-audit-unified-layout > * {
  min-width: 0;
}

.odin-audit-unified-layout #odinAuditSessionsList,
.odin-audit-unified-layout #odinAuditEventsList {
  max-height: min(48vh, 520px);
  overflow: auto;
}

.odin-audit-unified-card .odin-audit-card-title {
  margin-bottom: 10px;
}

@media screen and (max-width: 900px) {
  .odin-audit-unified-layout { grid-template-columns: 1fr; }
  .odin-audit-unified-layout #odinAuditSessionsList,
  .odin-audit-unified-layout #odinAuditEventsList { max-height: 42vh; }
}

/* -------------------------------------------------------------------------- */
/* Radar de atualizacoes                                                      */
/* -------------------------------------------------------------------------- */
#view-odin-updates :is(.kpi, .odin-kpi, .card) {
  min-height: 0 !important;
}

#view-odin-updates .kpis > *,
#view-odin-updates .row.g-3 > [class*="col-"] > .panel {
  padding-block: 9px !important;
}

.connecta-section-tabs-r6 {
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
}

.connecta-section-tabs-r6 .nav-link {
  white-space: nowrap;
  text-transform: none !important;
}

.odin-radar-actions-r6 {
  position: relative;
  display: inline-block;
}

.odin-radar-actions-r6 > summary {
  display: inline-grid;
  width: 34px;
  height: 34px;
  place-items: center;
  padding: 0 !important;
  list-style: none;
  cursor: pointer;
}

.odin-radar-actions-r6 > summary::-webkit-details-marker { display: none; }

.odin-radar-actions-r6 .odin-more-menu {
  z-index: 5000 !important;
  max-height: min(70vh, 420px);
  overflow: auto;
}

/* -------------------------------------------------------------------------- */
/* SNC - padrao visual, tipografia e guias                                    */
/* -------------------------------------------------------------------------- */
.snc-shell :is(h1, h2, h3, h4, h5, h6, .snc-title, .snc-panel-title),
.snc-shell :is(button, .snc-btn, th) {
  text-transform: none !important;
  letter-spacing: normal !important;
}

.snc-shell :is(.snc-header h1, .snc-header h2) {
  font-weight: 650 !important;
}

.snc-shell .snc-header p,
.snc-shell .snc-muted,
.snc-shell .snc-row-sub {
  font-weight: 400 !important;
}

.snc-tabs-r6,
.snc-rules-tabs-r6 {
  display: flex;
  width: 100%;
  gap: 6px;
  margin: 10px 0 12px;
  padding: 4px;
  overflow-x: auto;
  background: color-mix(in srgb, var(--panel-2) 80%, transparent);
  border: 1px solid var(--line);
  border-radius: 11px;
}

.snc-tabs-r6 button,
.snc-rules-tabs-r6 button {
  flex: 0 0 auto;
  min-height: 32px;
  padding: 6px 11px !important;
  border-radius: 8px !important;
  white-space: nowrap;
}

.snc-tabs-r6 button.is-active,
.snc-rules-tabs-r6 button.is-active {
  border-color: var(--brand-2) !important;
  background: color-mix(in srgb, var(--brand-2) 14%, var(--panel)) !important;
}

#view-snc-alertas :is(.snc-kpi, .snc-metric-card, .snc-report-card),
#view-snc-tools-report :is(.snc-kpi, .snc-metric-card, .snc-report-card),
#view-snc-triggers :is(.snc-kpi, .snc-metric-card, .snc-report-card) {
  min-height: 0 !important;
}

#view-snc-alertas .snc-alertas-metricas,
#view-snc-tools-report .snc-kpi-grid,
#view-snc-triggers .snc-rules-kpi-grid-r6 {
  gap: 8px !important;
}

#view-snc-alertas :is(.snc-kpi, .snc-metric-card),
#view-snc-tools-report :is(.snc-kpi, .snc-metric-card),
#view-snc-triggers .snc-rules-kpi-r6 {
  padding: 8px 10px !important;
}

#view-snc-alertas table thead th,
#view-snc-tools-report table thead th,
#view-snc-triggers table thead th {
  text-transform: none !important;
  font-weight: 650 !important;
}

/* Datas legiveis e sem peso exagerado. */
#view-snc-visao-geral .snc-overview-col-data,
#view-snc-alertas :is(td[data-label="Data"], td[data-label="Data e hora"], .snc-alert-date-v007),
#view-snc-tools-report :is(td[data-label="Data"], td[data-label="Data e hora"], time) {
  font-size: .72rem !important;
  font-weight: 400 !important;
}

body.dark-mode #view-snc-visao-geral .snc-overview-col-data,
body.dark-mode #view-snc-alertas :is(td[data-label="Data"], td[data-label="Data e hora"], .snc-alert-date-v007),
body.dark-mode #view-snc-tools-report :is(td[data-label="Data"], td[data-label="Data e hora"], time) {
  color: #fff !important;
}

/* KPIs pequenos em Regras. */
.snc-rules-kpi-grid-r6 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 10px 0;
}

.snc-rules-kpi-r6 {
  display: grid;
  gap: 2px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}

.snc-rules-kpi-r6 span { color: var(--muted); font-size: .66rem; }
.snc-rules-kpi-r6 strong { font-size: 1rem; font-weight: 650; }

/* SNC Alertas mobile: regras 3:4 removidas na R15. */

/* -------------------------------------------------------------------------- */
/* Modal de limite de sessoes no login                                        */
/* -------------------------------------------------------------------------- */
.connecta-login-session-modal {
  align-items: center;
  justify-items: center;
  overflow: hidden;
}

.connecta-login-session-dialog {
  width: min(760px, calc(100vw - 24px)) !important;
  max-height: calc(100vh - 24px) !important;
  max-height: calc(100dvh - 24px) !important;
  min-height: 0;
}

.connecta-login-session-dialog > header,
.connecta-login-session-dialog > footer {
  flex: 0 0 auto;
}

.connecta-login-session-list {
  min-height: 0;
  flex: 1 1 auto;
  overscroll-behavior: contain;
}

.connecta-login-session-footer-spacer { flex: 1 1 auto; }

.connecta-login-session-requirement {
  margin-top: 7px !important;
  color: #7dd3fc !important;
  font-size: .78rem !important;
  font-weight: 600 !important;
}

body.light-mode .connecta-login-session-requirement { color: #0369a1 !important; }

@media screen and (max-width: 720px) {
  .connecta-login-session-modal {
    place-items: end center !important;
    padding: 8px !important;
  }

  .connecta-login-session-dialog {
    width: 100% !important;
    max-width: 100% !important;
    max-height: calc(100dvh - 16px) !important;
    margin: 0 !important;
    border-radius: 16px 16px 12px 12px !important;
  }

  .connecta-login-session-dialog > header {
    position: sticky;
    top: 0;
    z-index: 3;
    align-items: flex-start !important;
    gap: 10px !important;
    padding: 14px !important;
    background: inherit;
  }

  .connecta-login-session-dialog h2 { font-size: 1.05rem !important; }
  .connecta-login-session-dialog header p { font-size: .76rem !important; }

  .connecta-login-session-list {
    padding: 10px 12px 12px !important;
    gap: 8px !important;
  }

  .connecta-login-session-item {
    grid-template-columns: 20px 36px minmax(0, 1fr) !important;
    gap: 9px !important;
    padding: 10px !important;
    border-radius: 11px !important;
  }

  .connecta-login-session-device {
    width: 34px !important;
    height: 34px !important;
  }

  .connecta-login-session-copy strong { font-size: .78rem; }
  .connecta-login-session-copy small { font-size: .68rem; line-height: 1.25; }

  .connecta-login-session-message,
  .connecta-login-session-empty {
    margin: 8px 12px 0 !important;
    font-size: .74rem;
  }

  .connecta-login-session-dialog > footer {
    position: sticky;
    bottom: 0;
    z-index: 3;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    padding: 10px 12px max(10px, env(safe-area-inset-bottom)) !important;
    background: inherit;
  }

  .connecta-login-session-footer-spacer { display: none !important; }
  .connecta-login-session-dialog > footer .btn { width: 100% !important; min-width: 0; }
  #loginSessionRefresh { grid-column: 1 / -1; }
}

@media screen and (max-width: 430px) {
  .connecta-login-session-dialog > footer { grid-template-columns: 1fr !important; }
  #loginSessionRefresh { grid-column: 1; }
}

/* Impressao padrao para secoes solicitadas. */
@media print {
  body.connecta-printing-section > * { visibility: hidden !important; }
  body.connecta-printing-section .connecta-print-target,
  body.connecta-printing-section .connecta-print-target * { visibility: visible !important; }
  body.connecta-printing-section .connecta-print-target {
    position: absolute !important;
    inset: 0 auto auto 0 !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}

/* Correcoes das guias e KPIs introduzidos na R6. */
.snc-tabs-r6 button.active,
.snc-rules-tabs-r6 button.active,
.snc-tabs-r6 .snc-tab-r6.active {
  border-color: var(--brand-2) !important;
  background: color-mix(in srgb, var(--brand-2) 14%, var(--panel)) !important;
}

.snc-tab-panel-r6 { display: none !important; }
.snc-tab-panel-r6.active { display: block !important; }

.snc-rule-kpis-r6 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 10px 0;
}
.snc-mini-kpi-r6 {
  display: grid;
  gap: 2px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}
.snc-mini-kpi-r6 span { color: var(--muted); font-size: .66rem; }
.snc-mini-kpi-r6 strong { font-size: 1rem; font-weight: 650; }
@media screen and (max-width: 520px) {
  .snc-rule-kpis-r6 { grid-template-columns: 1fr !important; }
}

/* ODIN R6 - grupos em botoes compactos, como nas demais telas operacionais. */
.connecta-odin-group-strip {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  margin: -2px 0 10px;
  padding: 8px 10px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: color-mix(in srgb, var(--panel) 92%, transparent);
}
.connecta-odin-group-strip-title {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  color: var(--muted);
  font-size: .68rem;
  font-weight: 600;
}
.connecta-odin-group-chips {
  display: flex;
  gap: 7px;
  min-width: 0;
  overflow-x: auto;
  padding-bottom: 2px;
  scrollbar-width: thin;
}
.connecta-odin-group-chip {
  flex: 0 0 auto;
  min-height: 30px;
  padding: 5px 10px;
  cursor: pointer;
  color: var(--text-color);
  background: transparent;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: .68rem;
  font-weight: 550;
  white-space: nowrap;
}
.connecta-odin-group-chip.active,
.connecta-odin-group-chip:hover {
  border-color: var(--brand-2);
  background: color-mix(in srgb, var(--brand-2) 13%, var(--panel));
}
@media screen and (min-width: 901px) {
  .connecta-odin-search-panel-r6 #connectaOdinGroupFilter { display: none; }
  .connecta-odin-search-panel-r6 label[for="connectaOdinGroupFilter"] { display: none; }
}
@media screen and (max-width: 640px) {
  .connecta-odin-group-strip { align-items: flex-start; flex-direction: column; gap: 6px; }
  .connecta-odin-group-chips { width: 100%; }
}
@media screen and (min-width: 901px) {
  .connecta-odin-search-panel-r6 .row > :has(#connectaOdinGroupFilter) { display: none !important; }
  .connecta-odin-search-panel-r6 .row > :has(#connectaOdinSearch) { flex: 0 0 66.666%; max-width: 66.666%; }
}

/* Grade de tabelas alinhada ao visual de Downloads. */
body.light-mode.painel-body :is(.connecta-data-table, .connecta-theme-table, .connecta-report-table, .snc-table) :is(th, td) {
  border-color: #d7e0eb !important;
}
body.light-mode.painel-body :is(.connecta-table-shell, .connecta-table-wrap, .snc-alert-table-wrap, .table-responsive) {
  border-color: #d7e0eb !important;
}
body.dark-mode.painel-body :is(.connecta-data-table, .connecta-theme-table, .connecta-report-table, .snc-table) :is(th, td) {
  border-color: rgba(45, 245, 189, .20) !important;
}
body.dark-mode.painel-body :is(.connecta-table-shell, .connecta-table-wrap, .snc-alert-table-wrap, .table-responsive) {
  border-color: rgba(45, 245, 189, .30) !important;
}

/* ODIN principal: KPIs compactos e grupos em botoes. */
#view-odin #odin-kpis {
  gap: 9px !important;
}
#view-odin #odin-kpis .card {
  min-height: 74px !important;
  padding: 9px 11px !important;
}
#view-odin #odin-kpis .card h4 {
  margin-bottom: 5px !important;
  font-size: .7rem !important;
  font-weight: 600 !important;
}
#view-odin #odin-kpis .big {
  font-size: 1.25rem !important;
  line-height: 1 !important;
}
@media screen and (min-width: 901px) {
  .odin-main-filter-panel-r6 .row > :has(#odinSiteFilter) { display: none !important; }
  .odin-main-filter-panel-r6 .row > :has(#odinSearchInput) { flex: 0 0 58.333%; max-width: 58.333%; }
}


/* ========================================================================== */
/* R6.2 - refinamentos finais do checklist 2.5                               */
/* ========================================================================== */

/* RDD/HSE/VeloXX: grades com a mesma linguagem visual de Downloads. */
body.light-mode.connecta-report-frame :is(
  .report-summary-grid, .report-summary-item, .connecta-report-card,
  .report-instance, .card-hse, .table-scroll, .table-responsive
) {
  border-color: #d7e0eb !important;
}
body.dark-mode.connecta-report-frame :is(
  .report-summary-grid, .report-summary-item, .connecta-report-card,
  .report-instance, .card-hse, .table-scroll, .table-responsive
) {
  border-color: rgba(45, 245, 189, .30) !important;
}
body.dark-mode.connecta-report-frame :is(.connecta-report-card, .report-instance, .card-hse) {
  box-shadow: inset 0 0 0 1px rgba(45, 245, 189, .035) !important;
}

/* Radar: o id real da tela e view-odin-agent-updates. */
#view-odin-agent-updates .kpi-card {
  min-height: 78px !important;
  padding: 9px 11px !important;
  border-radius: 10px !important;
}
#view-odin-agent-updates .kpi-card .kpi-title {
  font-size: .70rem !important;
  line-height: 1.15 !important;
}
#view-odin-agent-updates .kpi-card .kpi-value {
  margin: 2px 0 !important;
  font-size: 1.18rem !important;
  line-height: 1 !important;
}
#view-odin-agent-updates .kpi-card .kpi-subtitle {
  font-size: .62rem !important;
  line-height: 1.15 !important;
}

/* SNC Alertas: busca padrao sem criar uma coluna extra no grid. */
.snc-search-inline-r6 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 7px;
  align-items: center;
  min-width: 0;
}
.snc-search-inline-r6 .snc-input { min-width: 0 !important; }
.snc-search-inline-r6 .snc-btn { min-height: 32px !important; white-space: nowrap; }

/* SNC: reduzir negrito excessivo sem perder hierarquia. */
#view-snc-visao-geral .snc-overview-row-v012 > .snc-overview-col :is(strong, b),
#view-snc-alertas table td :is(strong, b),
#view-snc-tools-report table td :is(strong, b) {
  font-weight: 500 !important;
}

/* Grids da plataforma seguem a mesma linha cromatica dos Downloads. */
body.dark-mode.painel-body :is(
  .panel, .card, .table-responsive, .connecta-table-shell, .connecta-table-wrap,
  .snc-alert-table-wrap, .snc-table-wrap
) {
  border-color: rgba(45, 245, 189, .28) !important;
}
body.light-mode.painel-body :is(
  .panel, .card, .table-responsive, .connecta-table-shell, .connecta-table-wrap,
  .snc-alert-table-wrap, .snc-table-wrap
) {
  border-color: #d7e0eb !important;
}

@media screen and (max-width: 520px) {
  .snc-search-inline-r6 { grid-template-columns: 1fr; }
  .snc-search-inline-r6 .snc-btn { width: 100% !important; }
}

/* ========================================================================== */
/* CoNNecta Cloud R7 - filtros ODIN, SNC mobile, HSE, impressao e login       */
/* ========================================================================== */

/* ODIN / CoNNecta ODIN: recupera o filtro horizontal do RMM legado. */
.odin-group-filter-legacy-r7,
.connecta-odin-groups-legacy-r7 {
  width: 100%;
  max-width: 100%;
  padding: 10px 12px !important;
  overflow: hidden;
}
.odin-group-filter-legacy-r7 .panel-title,
.connecta-odin-groups-legacy-r7 .panel-title {
  margin: 0 0 8px !important;
  color: var(--text-color) !important;
  font-size: .72rem !important;
  font-weight: 600 !important;
  text-align: left !important;
}
.odin-legacy-group-menu-r7,
.connecta-odin-groups-legacy-r7 .connecta-odin-group-chips {
  display: flex !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  flex-wrap: nowrap !important;
  gap: 6px !important;
  margin: 0 !important;
  padding: 2px 1px 7px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-behavior: smooth;
  overscroll-behavior-inline: contain;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}
.odin-legacy-group-menu-r7 > *,
.connecta-odin-groups-legacy-r7 .connecta-odin-group-chip {
  flex: 0 0 auto !important;
  width: max-content !important;
  min-width: max-content !important;
  min-height: 31px !important;
  margin: 0 !important;
  padding: 6px 10px !important;
  border-radius: 9px !important;
  white-space: nowrap !important;
  font-size: .68rem !important;
  transform: none !important;
}
.odin-legacy-group-menu-r7 > *.active,
.connecta-odin-groups-legacy-r7 .connecta-odin-group-chip.active {
  outline: 2px solid color-mix(in srgb, var(--brand-2) 42%, transparent);
  outline-offset: 1px;
}
.odin-main-filter-panel-r7 .row,
.connecta-odin-search-panel-r7 .row {
  align-items: end !important;
}

/* HSE R19: grade definitiva dos filtros.
   Desktop: Grupo/Computador = 50% cada; Data/Início/Final/Horários = 25% cada.
   Mobile preserva a disposição responsiva já aprovada. */
body.hse-body.connecta-report-frame .controls-hse {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
  align-items: end !important;
  width: 100% !important;
  min-width: 0 !important;
}

body.hse-body.connecta-report-frame .controls-hse > .hse-filter-field {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}

/* Primeira linha: 50% + 50%. */
body.hse-body.connecta-report-frame .controls-hse > .hse-filter-group {
  grid-column: 1 / 3 !important;
  grid-row: 1 !important;
}
body.hse-body.connecta-report-frame .controls-hse > .hse-filter-computer {
  grid-column: 3 / 5 !important;
  grid-row: 1 !important;
}

/* Segunda linha: quatro campos de 25%. */
body.hse-body.connecta-report-frame .controls-hse > .hse-filter-date {
  grid-column: 1 / 2 !important;
  grid-row: 2 !important;
}
body.hse-body.connecta-report-frame .controls-hse > .hse-filter-start {
  grid-column: 2 / 3 !important;
  grid-row: 2 !important;
}
body.hse-body.connecta-report-frame .controls-hse > .hse-filter-end {
  grid-column: 3 / 4 !important;
  grid-row: 2 !important;
}
body.hse-body.connecta-report-frame .controls-hse > .hse-filter-available {
  grid-column: 4 / 5 !important;
  grid-row: 2 !important;
}

body.hse-body.connecta-report-frame .controls-hse > .generate-hse {
  grid-column: 1 / -1 !important;
  grid-row: 3 !important;
  width: 100% !important;
  min-width: 0 !important;
}

/* Neutraliza o select { width: 70% !important; } legado somente dentro do HSE. */
body.hse-body.connecta-report-frame .controls-hse select,
body.hse-body.connecta-report-frame .controls-hse input,
body.hse-body.connecta-report-frame .controls-hse .dropdown,
body.hse-body.connecta-report-frame .controls-hse .dropdown > button,
body.hse-body.connecta-report-frame .controls-hse .date-input-wrapper,
body.hse-body.connecta-report-frame .controls-hse > .generate-hse .btn-hse,
body.hse-body.connecta-report-frame .controls-hse > .generate-hse button {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

@media screen and (max-width: 760px) {
  body.hse-body.connecta-report-frame .controls-hse {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.hse-body.connecta-report-frame .controls-hse > .hse-filter-group,
  body.hse-body.connecta-report-frame .controls-hse > .hse-filter-computer,
  body.hse-body.connecta-report-frame .controls-hse > .hse-filter-date,
  body.hse-body.connecta-report-frame .controls-hse > .hse-filter-start,
  body.hse-body.connecta-report-frame .controls-hse > .hse-filter-end,
  body.hse-body.connecta-report-frame .controls-hse > .hse-filter-available {
    grid-column: auto !important;
    grid-row: auto !important;
  }

  body.hse-body.connecta-report-frame .controls-hse > .generate-hse {
    grid-column: 1 / -1 !important;
    grid-row: auto !important;
  }
}


/* SNC mobile R7: remove 3:4 e usa cards de conteudo fluido, como Downloads. */
@media screen and (max-width: 768px) {
  #view-snc-visao-geral {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 10px !important;
    font-size: 100% !important;
    overflow-x: clip !important;
  }

  #view-snc-visao-geral .snc-standalone-open-btn-v076 {
    width: 100% !important;
    margin: 0 0 10px !important;
  }

  #view-snc-visao-geral .snc-header-overview-v007 {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    width: 100% !important;
    padding: 12px !important;
  }
  #view-snc-visao-geral .snc-header-overview-v007 > div:first-child {
    width: 100% !important;
    min-width: 0 !important;
  }
  #view-snc-visao-geral .snc-header-overview-v007 h1 {
    margin: 2px 0 3px !important;
    font-size: 1.35rem !important;
    line-height: 1.08 !important;
  }
  #view-snc-visao-geral .snc-header-overview-v007 p {
    margin: 0 !important;
    font-size: .78rem !important;
    line-height: 1.35 !important;
  }
  #view-snc-visao-geral .snc-overview-head-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, .62fr) !important;
    width: 100% !important;
    gap: 8px !important;
    margin: 0 !important;
  }
  #view-snc-visao-geral .snc-live-clock-card {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }
  #view-snc-visao-geral .snc-mini-kpi-resolver {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }
  #view-snc-visao-geral .snc-overview-head-actions > .snc-btn {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    margin: 0 !important;
  }

  #view-snc-visao-geral .snc-overview-filter-line-v029 {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    min-width: 0 !important;
    gap: 9px !important;
    padding: 10px !important;
  }
  #view-snc-visao-geral .snc-overview-filter-line-v029 > *,
  #view-snc-visao-geral .snc-filter-field-v029,
  #view-snc-visao-geral .snc-last-update-box,
  #view-snc-visao-geral .snc-refresh-field-v066 {
    position: static !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 5px !important;
    justify-self: stretch !important;
    align-self: stretch !important;
  }
  #view-snc-visao-geral .snc-filter-field-v029 > label,
  #view-snc-visao-geral .snc-last-update-box > span {
    display: block !important;
    margin: 0 !important;
    color: var(--muted) !important;
    font-size: .68rem !important;
    line-height: 1.2 !important;
    font-weight: 600 !important;
  }
  #view-snc-visao-geral :is(.snc-select, .snc-input, .snc-refresh-btn-v066) {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    min-height: 38px !important;
    margin: 0 !important;
    font-size: .78rem !important;
  }
  #view-snc-visao-geral .snc-search-inline-r6 {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 6px !important;
  }
  #view-snc-visao-geral .snc-search-inline-r6 .snc-btn {
    width: 100% !important;
  }
  #view-snc-visao-geral .snc-last-update-box {
    padding: 8px 10px !important;
    border: 1px solid var(--line) !important;
    border-radius: 10px !important;
    background: var(--panel-2) !important;
  }
  #view-snc-visao-geral .snc-last-update-box small {
    display: block !important;
    width: 100% !important;
    font-size: .72rem !important;
    line-height: 1.25 !important;
    text-align: left !important;
    white-space: normal !important;
  }

}

@media screen and (max-width: 390px) {
  #view-snc-visao-geral .snc-overview-head-actions {
    grid-template-columns: 1fr !important;
  }
}

/* Modal de limite de acessos: proporcao previsivel e funcionamento progressivo. */
.connecta-login-session-modal {
  display: none !important;
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  padding: clamp(10px, 2vw, 24px) !important;
  overflow: hidden !important;
  place-items: center !important;
  z-index: 50000 !important;
}
.connecta-login-session-modal.is-open { display: grid !important; }
.connecta-login-session-dialog {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) auto !important;
  width: min(680px, calc(100vw - 32px)) !important;
  max-width: 680px !important;
  height: auto !important;
  max-height: min(720px, calc(100dvh - 32px)) !important;
  min-height: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  border-radius: 16px !important;
}
.connecta-login-session-dialog > header {
  position: static !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 38px !important;
  align-items: start !important;
  gap: 12px !important;
  padding: 16px 18px 13px !important;
}
.connecta-login-session-dialog > header > div { min-width: 0 !important; }
.connecta-login-session-close {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  padding: 0 !important;
  margin: 0 !important;
  place-self: start end !important;
}
.connecta-login-session-dialog h2 {
  margin: 0 !important;
  font-size: clamp(1.05rem, 2vw, 1.25rem) !important;
  line-height: 1.15 !important;
}
.connecta-login-session-dialog header p {
  max-width: 58ch;
  margin: 5px 0 0 !important;
  font-size: .78rem !important;
  line-height: 1.35 !important;
}
.connecta-login-session-kicker {
  font-size: .64rem !important;
  line-height: 1.2 !important;
}
.connecta-login-session-message,
.connecta-login-session-empty {
  margin: 10px 14px 0 !important;
  padding: 9px 11px !important;
  font-size: .74rem !important;
  line-height: 1.35 !important;
}
.connecta-login-session-list {
  display: grid !important;
  grid-template-columns: 1fr !important;
  align-content: start !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 10px 14px 14px !important;
  gap: 8px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
.connecta-login-session-item {
  display: grid !important;
  grid-template-columns: 20px 36px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  min-width: 0 !important;
  padding: 10px 11px !important;
  border-radius: 11px !important;
}
.connecta-login-session-item input {
  width: 17px !important;
  height: 17px !important;
  margin: 0 !important;
}
.connecta-login-session-device {
  width: 34px !important;
  height: 34px !important;
  border-radius: 9px !important;
}
.connecta-login-session-copy strong {
  display: block !important;
  font-size: .78rem !important;
  line-height: 1.25 !important;
}
.connecta-login-session-copy small {
  display: block !important;
  font-size: .67rem !important;
  line-height: 1.3 !important;
  overflow-wrap: anywhere !important;
}
.connecta-login-session-dialog > footer {
  position: static !important;
  display: grid !important;
  grid-template-columns: auto 1fr auto auto !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 11px 14px !important;
}
.connecta-login-session-dialog > footer .btn {
  min-height: 36px !important;
  margin: 0 !important;
  padding: 7px 11px !important;
  font-size: .72rem !important;
  white-space: normal !important;
}
.connecta-login-session-footer-spacer { min-width: 0; }

@media screen and (max-width: 640px) {
  .connecta-login-session-modal {
    padding: 8px !important;
    place-items: center !important;
  }
  .connecta-login-session-dialog {
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
    max-height: calc(100dvh - 16px) !important;
    border-radius: 14px !important;
  }
  .connecta-login-session-dialog > header {
    padding: 13px 12px 10px !important;
  }
  .connecta-login-session-list {
    padding: 9px 10px 10px !important;
  }
  .connecta-login-session-dialog > footer {
    grid-template-columns: 1fr 1fr !important;
    padding: 9px 10px max(9px, env(safe-area-inset-bottom)) !important;
  }
  .connecta-login-session-footer-spacer { display: none !important; }
  #loginSessionRefresh { grid-column: 1 / -1 !important; }
  #loginSessionCancel,
  #loginSessionContinue { width: 100% !important; }
}
@media screen and (max-width: 400px) {
  .connecta-login-session-dialog > footer { grid-template-columns: 1fr !important; }
  #loginSessionRefresh { grid-column: 1 !important; }
  .connecta-login-session-item {
    grid-template-columns: 18px 30px minmax(0, 1fr) !important;
    gap: 8px !important;
    padding: 9px !important;
  }
  .connecta-login-session-device { width: 30px !important; height: 30px !important; }
}

/* Impressao global R7: sempre logo claro, marca d'agua e assinatura. */
@media print {
  @page { margin-bottom: 17mm; }

  html,
  body {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  body::before {
    content: "" !important;
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    width: 52vw !important;
    height: 28vh !important;
    transform: translate(-50%, -50%) !important;
    background-image: url("../src/imagem/logo-fundo-branco.png") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    opacity: .45 !important;
    pointer-events: none !important;
    z-index: 0 !important;
  }

  body::after {
    content: "Powered by Recriar Soluções LTDA" !important;
    position: fixed !important;
    right: 0 !important;
    bottom: 3mm !important;
    left: 0 !important;
    z-index: 2147483000 !important;
    color: #475569 !important;
    font: 600 8pt/1.2 "Segoe UI", Arial, sans-serif !important;
    letter-spacing: .02em !important;
    text-align: center !important;
    pointer-events: none !important;
  }

  body > * {
    position: relative;
    z-index: 1;
  }

  .logo-dark,
  img.logo-dark,
  .maintenance-logo.logo-dark {
    display: none !important;
    visibility: hidden !important;
  }
  .logo-light,
  img.logo-light,
  .maintenance-logo.logo-light {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    filter: none !important;
  }

  body.connecta-printing-section .connecta-print-target,
  body.connecta-printing-section .connecta-print-target * {
    position: relative;
    z-index: 1;
  }
}

/* ========================================================================== */
/* CoNNecta Cloud R7.1 - acabamento mobile SNC / modal / impressao           */
/* ========================================================================== */

/* SNC: no celular cada alerta vira um card fluido de leitura, sem proporcao fixa. */
@media screen and (max-width: 768px) {
  #view-snc-visao-geral,
  #view-snc-visao-geral .snc-panel,
  #view-snc-visao-geral .snc-panel-wide,
  #view-snc-visao-geral .snc-panel-alertas-recentes-v007 {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  #view-snc-visao-geral .snc-header-overview-v007 {
    display: block !important;
    padding: 12px !important;
    border-radius: 14px !important;
  }

  #view-snc-visao-geral .snc-overview-head-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    margin-top: 12px !important;
  }
  #view-snc-visao-geral .snc-live-clock-card,
  #view-snc-visao-geral .snc-mini-kpi-resolver {
    min-height: 76px !important;
    padding: 10px !important;
    border-radius: 12px !important;
  }
  #view-snc-visao-geral .snc-live-clock-card strong,
  #view-snc-visao-geral .snc-mini-kpi-resolver strong {
    font-size: 1.4rem !important;
    line-height: 1.05 !important;
  }
  #view-snc-visao-geral .snc-overview-head-actions > .snc-btn,
  #view-snc-visao-geral .snc-overview-head-actions > button {
    grid-column: auto !important;
    width: 100% !important;
    min-height: 38px !important;
  }

  /* Filtros: sem sobreposicao de labels, selects e caixa de ultima atualizacao. */
  #view-snc-visao-geral .snc-overview-filter-line-v029 {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    padding: 12px !important;
    overflow: visible !important;
  }
  #view-snc-visao-geral .snc-overview-filter-line-v029 > *,
  #view-snc-visao-geral .snc-filter-field-v029,
  #view-snc-visao-geral .snc-refresh-field-v066,
  #view-snc-visao-geral .snc-refresh-field-header-v075,
  #view-snc-visao-geral .snc-last-update-box {
    position: static !important;
    inset: auto !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    transform: none !important;
  }
  #view-snc-visao-geral .snc-filter-field-v029 > label,
  #view-snc-visao-geral .snc-overview-filter-line-v029 label {
    display: block !important;
    width: 100% !important;
    margin: 0 0 5px !important;
    font-size: .72rem !important;
    line-height: 1.25 !important;
    white-space: normal !important;
  }
  #view-snc-visao-geral .snc-overview-filter-line-v029 :is(select, input, .snc-select, .snc-input, button, .snc-btn) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 40px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    font-size: .78rem !important;
  }
  #view-snc-visao-geral .snc-last-update-box {
    padding: 9px 10px !important;
    border: 1px solid var(--line) !important;
    border-radius: 10px !important;
    background: var(--panel-2) !important;
  }
  #view-snc-visao-geral .snc-last-update-box :is(span, small, strong) {
    position: static !important;
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    white-space: normal !important;
    text-align: left !important;
  }

  /* Barra de selecao em massa compacta e legivel. */
  #view-snc-visao-geral .snc-overview-bulk-toolbar-v056 {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 7px !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 9px !important;
    margin: 0 0 10px !important;
    overflow: visible !important;
    border-radius: 12px !important;
  }
  #view-snc-visao-geral .snc-overview-bulk-toolbar-v056 :is(label, button, .snc-btn, small) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    white-space: normal !important;
  }
  #view-snc-visao-geral .snc-overview-check-all-v056 {
    min-height: 38px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 8px 10px !important;
  }

  /* Lista de alertas: layout mobile centralizado no bloco R15. */
}

@media screen and (max-width: 430px) {
  #view-snc-visao-geral { padding: 7px !important; }
  #view-snc-visao-geral .snc-header-overview-v007,
  #view-snc-visao-geral .snc-overview-filter-line-v029,
  #view-snc-visao-geral .snc-panel-alertas-recentes-v007 { padding: 9px !important; }
  #view-snc-visao-geral .snc-overview-head-actions {
    grid-template-columns: 1fr !important;
  }
}

/* Modal de limite: versao compacta, centralizada e independente do layout do login. */
.connecta-login-session-modal {
  align-items: center !important;
  justify-items: center !important;
}
.connecta-login-session-backdrop {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
}
.connecta-login-session-dialog {
  width: min(620px, calc(100vw - 40px)) !important;
  max-width: 620px !important;
  max-height: min(640px, calc(100dvh - 32px)) !important;
}
.connecta-login-session-dialog > header { padding: 14px 16px 11px !important; }
.connecta-login-session-list { padding: 9px 12px 12px !important; }
.connecta-login-session-dialog > footer { padding: 10px 12px !important; }

@media screen and (max-width: 640px) {
  .connecta-login-session-modal {
    align-items: center !important;
    justify-items: center !important;
    padding: 10px !important;
  }
  .connecta-login-session-dialog {
    width: calc(100vw - 20px) !important;
    max-width: calc(100vw - 20px) !important;
    max-height: calc(100dvh - 20px) !important;
    border-radius: 13px !important;
  }
  .connecta-login-session-dialog > header {
    grid-template-columns: minmax(0, 1fr) 34px !important;
    padding: 12px 11px 9px !important;
  }
  .connecta-login-session-close {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
  }
  .connecta-login-session-dialog h2 { font-size: 1rem !important; }
  .connecta-login-session-dialog header p { font-size: .72rem !important; }
  .connecta-login-session-list { padding: 8px 9px 9px !important; }
  .connecta-login-session-dialog > footer { padding: 8px 9px max(8px, env(safe-area-inset-bottom)) !important; }
}

/* A marca d'agua e um elemento de imagem gerado, para nao depender da opcao
   "imprimir graficos de fundo" do navegador. */
@media print {
  body::before {
    content: url("../src/imagem/logo-fundo-branco.png") !important;
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    width: 48vw !important;
    max-width: 620px !important;
    height: auto !important;
    max-height: 30vh !important;
    transform: translate(-50%, -50%) !important;
    background: none !important;
    opacity: .45 !important;
    object-fit: contain !important;
    pointer-events: none !important;
    z-index: 2147482000 !important;
  }

  /* Qualquer cabecalho de relatorio usa exclusivamente a arte destinada ao fundo claro. */
  img.logo-dark,
  .logo-dark,
  img[src*="logo-fundo-preto"],
  img[src*="logo-connecta-fundo-preto"] {
    display: none !important;
    visibility: hidden !important;
  }
  img.logo-light,
  .logo-light,
  img[src*="logo-fundo-branco"],
  img[src*="logo-connecta-fundo-branco"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    filter: none !important;
  }
}

/* SNC Alertas mobile: grades intermediarias removidas na R15. */

/* ========================================================================== */
/* CoNNecta Cloud R8 - modal de limite de acessos: cliques sempre funcionais  */
/* ========================================================================== */
.connecta-login-session-modal.is-open {
  pointer-events: auto !important;
}
.connecta-login-session-backdrop {
  z-index: 0 !important;
  pointer-events: auto !important;
}
.connecta-login-session-dialog {
  z-index: 10 !important;
  pointer-events: auto !important;
  isolation: isolate;
}
.connecta-login-session-dialog > header,
.connecta-login-session-list,
.connecta-login-session-message {
  position: relative !important;
  z-index: 11 !important;
  pointer-events: auto !important;
}

/* R12: o footer nao pode herdar position: relative do bloco de protecao de cliques. */
.connecta-login-session-dialog > footer {
  position: static !important;
  z-index: 11 !important;
  pointer-events: auto !important;
}
.connecta-login-session-dialog > footer .btn,
.connecta-login-session-close,
.connecta-login-session-item,
.connecta-login-session-item input {
  position: relative !important;
  z-index: 12 !important;
  pointer-events: auto !important;
}
.connecta-login-session-dialog > footer a.btn,
.connecta-login-session-close {
  text-decoration: none !important;
}

/* ========================================================================== */
/* CoNNecta Cloud R10 - modal de limite alinhado aos modais do sistema         */
/* ========================================================================== */
.connecta-login-session-modal.is-open {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 20px !important;
}

.connecta-login-session-dialog {
  width: min(94vw, 640px) !important;
  max-width: 640px !important;
  max-height: min(90dvh, 680px) !important;
  border-radius: var(--card-radius, 16px) !important;
  overflow: hidden !important;
}

.connecta-login-session-dialog > header {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 36px !important;
  align-items: start !important;
  gap: 14px !important;
  padding: 14px 16px !important;
}

.connecta-login-session-close {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 8px !important;
  line-height: 1 !important;
  text-align: center !important;
  text-decoration: none !important;
  place-self: start end !important;
  overflow: hidden !important;
}

.connecta-login-session-close > i {
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 1rem !important;
  line-height: 1 !important;
  transform: none !important;
}

.connecta-login-session-list {
  min-height: 0 !important;
  overflow-y: auto !important;
}

.connecta-login-session-dialog > footer.connecta-login-session-footer {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 12px 14px !important;
  overflow: visible !important;
}

.connecta-login-session-footer-secondary {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
}

#loginSessionRefresh,
#loginSessionCancel,
#loginSessionContinue {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-height: 36px !important;
  margin: 0 !important;
  padding: 8px 12px !important;
  border-radius: 9px !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  pointer-events: auto !important;
  position: relative !important;
  z-index: 20 !important;
}

#loginSessionContinue.connecta-login-session-primary {
  flex: 0 1 auto !important;
  color: #fff !important;
  background: linear-gradient(135deg, var(--brand, #159d7d), var(--brand-2, #20c997)) !important;
  border: 1px solid color-mix(in srgb, var(--brand-2, #20c997) 78%, #ffffff 22%) !important;
  box-shadow: 0 6px 18px color-mix(in srgb, var(--brand-2, #20c997) 22%, transparent) !important;
  font-weight: 700 !important;
}

#loginSessionContinue.connecta-login-session-primary:hover,
#loginSessionContinue.connecta-login-session-primary:focus-visible {
  filter: brightness(1.07) !important;
  transform: none !important;
}

#loginSessionContinue:disabled {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: .68 !important;
}

@media screen and (max-width: 640px) {
  .connecta-login-session-modal.is-open {
    padding: 10px !important;
  }

  .connecta-login-session-dialog {
    width: min(100%, calc(100vw - 20px)) !important;
    max-width: calc(100vw - 20px) !important;
    max-height: calc(100dvh - 20px) !important;
  }

  .connecta-login-session-dialog > header {
    grid-template-columns: minmax(0, 1fr) 34px !important;
    padding: 12px !important;
  }

  .connecta-login-session-dialog > footer.connecta-login-session-footer {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 9px !important;
    padding: 10px max(10px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left)) !important;
  }

  .connecta-login-session-footer-secondary {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    gap: 8px !important;
  }

  #loginSessionRefresh,
  #loginSessionCancel,
  #loginSessionContinue {
    width: 100% !important;
    min-width: 0 !important;
    white-space: normal !important;
  }

  #loginSessionContinue {
    min-height: 42px !important;
  }
}

@media screen and (max-width: 360px) {
  .connecta-login-session-footer-secondary {
    grid-template-columns: 1fr !important;
  }
}

/* ========================================================================== */
/* CoNNecta Cloud R11 - footer do modal de limite sem overflow                 */
/* ========================================================================== */
#loginSessionLimitModal .connecta-login-session-dialog > footer.connecta-login-session-footer {
  position: static !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  align-items: stretch !important;
  justify-items: stretch !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  gap: 9px !important;
  margin: 0 !important;
  padding: 10px 12px 12px !important;
  overflow: hidden !important;
}

#loginSessionLimitModal .connecta-login-session-footer-secondary {
  display: grid !important;
  grid-template-columns: max-content max-content !important;
  align-items: center !important;
  justify-content: start !important;
  justify-items: start !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

#loginSessionLimitModal #loginSessionRefresh,
#loginSessionLimitModal #loginSessionCancel {
  width: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  justify-self: start !important;
}

#loginSessionLimitModal #loginSessionContinue.connecta-login-session-primary {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative !important;
  inset: auto !important;
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  justify-self: stretch !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 40px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  white-space: normal !important;
  overflow: visible !important;
  pointer-events: auto !important;
}

@media screen and (max-width: 430px) {
  #loginSessionLimitModal .connecta-login-session-dialog > footer.connecta-login-session-footer {
    gap: 8px !important;
    padding: 9px 10px max(10px, env(safe-area-inset-bottom)) !important;
  }

  #loginSessionLimitModal .connecta-login-session-footer-secondary {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    width: 100% !important;
  }

  #loginSessionLimitModal #loginSessionRefresh,
  #loginSessionLimitModal #loginSessionCancel {
    width: 100% !important;
    justify-self: stretch !important;
  }
}

@media screen and (max-width: 330px) {
  #loginSessionLimitModal .connecta-login-session-footer-secondary {
    grid-template-columns: 1fr !important;
  }
}


/* ========================================================================== */
/* CoNNecta Cloud R15 - SNC Alertas mobile definitivo                         */
/* Uma unica implementacao mobile; o grid desktop nao participa abaixo 768px. */
/* ========================================================================== */

.snc-overview-mobile-card {
  display: none !important;
}

@media screen and (max-width: 768px) {
  /* A lista usa apenas uma coluna e cresce naturalmente com o conteudo. */
  #view-snc-visao-geral #snc-overview-alertas,
  #view-snc-visao-geral .snc-overview-table-v012,
  #view-snc-visao-geral .snc-overview-table-v067,
  #view-snc-visao-geral .snc-overview-body-v012 {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  #view-snc-visao-geral .snc-overview-head-v012 {
    display: none !important;
  }

  #view-snc-visao-geral .snc-overview-body-v012 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
    padding: 0 !important;
  }

  /* A linha desktop vira somente um wrapper neutro para o card mobile. */
  #view-snc-visao-geral .snc-overview-row-v012 {
    position: static !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    overflow: visible !important;
    cursor: pointer !important;
  }

  #view-snc-visao-geral .snc-overview-row-v012:hover {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
  }

  /* No mobile nenhum elemento da tabela desktop participa do layout. */
  #view-snc-visao-geral .snc-overview-row-v012 > :not(.snc-overview-mobile-card) {
    display: none !important;
  }

  #view-snc-visao-geral .snc-overview-mobile-card {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 12px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    color: var(--text-color) !important;
    background: var(--panel) !important;
    border: 1px solid color-mix(in srgb, var(--snc-alert-accent, var(--brand-2)) 42%, var(--line)) !important;
    border-left: 4px solid var(--snc-alert-accent, var(--brand-2)) !important;
    border-radius: 12px !important;
    box-shadow: 0 5px 14px color-mix(in srgb, #000 8%, transparent) !important;
  }

  #view-snc-visao-geral .snc-overview-mobile-top {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 0 2px !important;
    border: 0 !important;
    background: transparent !important;
  }

  #view-snc-visao-geral .snc-overview-mobile-severity {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    min-width: 0 !important;
    max-width: calc(100% - 34px) !important;
    color: var(--text-color) !important;
    font-size: .72rem !important;
    font-weight: 650 !important;
    line-height: 1.2 !important;
    text-transform: none !important;
    white-space: normal !important;
  }

  #view-snc-visao-geral .snc-overview-mobile-dot {
    display: inline-block !important;
    flex: 0 0 9px !important;
    width: 9px !important;
    height: 9px !important;
    border-radius: 50% !important;
    background: var(--snc-alert-accent, var(--brand-2)) !important;
    box-shadow: 0 0 8px color-mix(in srgb, var(--snc-alert-accent, var(--brand-2)) 72%, transparent) !important;
  }

  #view-snc-visao-geral .snc-overview-mobile-select {
    display: inline-flex !important;
    flex: 0 0 24px !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    cursor: pointer !important;
  }

  #view-snc-visao-geral .snc-overview-mobile-select input {
    display: block !important;
    width: 17px !important;
    height: 17px !important;
    margin: 0 !important;
    accent-color: var(--brand-2) !important;
    cursor: pointer !important;
  }

  #view-snc-visao-geral .snc-overview-mobile-company,
  #view-snc-visao-geral .snc-overview-mobile-meta-item,
  #view-snc-visao-geral .snc-overview-mobile-alert {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 9px 0 0 !important;
    border: 0 !important;
    border-top: 1px solid color-mix(in srgb, var(--line) 72%, transparent) !important;
    background: transparent !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }

  #view-snc-visao-geral .snc-overview-mobile-company {
    padding-top: 8px !important;
  }

  #view-snc-visao-geral .snc-overview-mobile-meta {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  #view-snc-visao-geral .snc-overview-mobile-meta-item {
    height: 100% !important;
  }

  #view-snc-visao-geral .snc-overview-mobile-label {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 0 4px !important;
    color: var(--muted) !important;
    font-size: .61rem !important;
    font-weight: 600 !important;
    line-height: 1.15 !important;
    letter-spacing: .035em !important;
    text-transform: uppercase !important;
    white-space: normal !important;
  }

  #view-snc-visao-geral .snc-overview-mobile-card :is(strong, time) {
    position: static !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--text-color) !important;
    font-size: .81rem !important;
    font-weight: 550 !important;
    line-height: 1.35 !important;
    text-align: left !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: anywhere !important;
    text-overflow: clip !important;
    overflow: visible !important;
  }

  #view-snc-visao-geral .snc-overview-mobile-alert strong {
    font-size: .86rem !important;
    font-weight: 600 !important;
  }

  #view-snc-visao-geral .snc-overview-mobile-actions {
    position: static !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 9px 0 0 !important;
    border: 0 !important;
    border-top: 1px solid color-mix(in srgb, var(--line) 72%, transparent) !important;
    background: transparent !important;
  }

  #view-snc-visao-geral .snc-overview-mobile-lido {
    position: static !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 78px !important;
    max-width: 130px !important;
    min-height: 34px !important;
    margin: 0 !important;
    padding: 7px 13px !important;
    border-radius: 9px !important;
    font-size: .72rem !important;
    line-height: 1 !important;
  }
}

/* Celulares: nenhuma informacao divide coluna. */
@media screen and (max-width: 520px) {
  #view-snc-visao-geral .snc-overview-body-v012 {
    gap: 9px !important;
  }

  #view-snc-visao-geral .snc-overview-mobile-card {
    gap: 9px !important;
    padding: 11px !important;
    border-radius: 11px !important;
  }

  #view-snc-visao-geral .snc-overview-mobile-meta {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 9px !important;
  }

  #view-snc-visao-geral .snc-overview-mobile-lido {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }
}

/* ========================================================================== */
/* R16 - Acesso Remoto MacOS responsivo                                      */
/* Desktop preserva tabela; <= 900px usa cards e layout fluido.              */
/* ========================================================================== */

#view-rustdesk-mac,
#view-rustdesk-mac .rustdesk-mac-panel,
#view-rustdesk-mac .rustdesk-mac-list,
#view-rustdesk-mac .rustdesk-mac-table {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

#view-rustdesk-mac .rustdesk-mac-panel {
  margin-bottom: 0 !important;
}

#view-rustdesk-mac .rustdesk-mac-table {
  table-layout: auto;
}

#view-rustdesk-mac .rustdesk-mac-actions {
  white-space: nowrap;
}

#view-rustdesk-mac .rustdesk-mac-actions .btn {
  margin: 0 3px !important;
}

@media screen and (max-width: 900px) {
  #view-rustdesk-mac {
    padding-inline: 0 !important;
    overflow: visible !important;
  }

  #view-rustdesk-mac .rustdesk-mac-panel {
    margin: 0 !important;
    padding: 14px !important;
    border-radius: 14px !important;
    overflow: visible !important;
  }

  #view-rustdesk-mac .rustdesk-mac-header {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 14px !important;
    margin-bottom: 16px !important;
    padding: 0 0 14px !important;
  }

  #view-rustdesk-mac .connecta-module-brand {
    width: 100% !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 10px !important;
    text-align: center !important;
  }

  #view-rustdesk-mac .connecta-module-brand img {
    width: auto !important;
    max-width: min(72vw, 220px) !important;
    height: auto !important;
    max-height: 64px !important;
    object-fit: contain !important;
  }

  #view-rustdesk-mac .connecta-module-brand > div {
    width: 100% !important;
    min-width: 0 !important;
  }

  #view-rustdesk-mac .connecta-module-brand h2 {
    margin: 0 !important;
    font-size: clamp(1rem, 4.8vw, 1.3rem) !important;
    line-height: 1.22 !important;
    text-align: center !important;
    overflow-wrap: anywhere !important;
  }

  #view-rustdesk-mac .connecta-module-brand p {
    max-width: 520px !important;
    margin: 6px auto 0 !important;
    font-size: .82rem !important;
    line-height: 1.45 !important;
    text-align: center !important;
  }

  #view-rustdesk-mac .connecta-module-header-actions {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 9px !important;
  }

  #view-rustdesk-mac .connecta-module-header-actions .btn {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 42px !important;
    margin: 0 !important;
    justify-content: center !important;
  }

  #view-rustdesk-mac .rustdesk-mac-filters {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 9px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 0 14px !important;
  }

  #view-rustdesk-mac .rustdesk-mac-filter-field {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  #view-rustdesk-mac .rustdesk-mac-filter-field :is(select, input) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 42px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  #view-rustdesk-mac .rustdesk-mac-list {
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  #view-rustdesk-mac .rustdesk-mac-table,
  #view-rustdesk-mac .rustdesk-mac-table tbody {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  #view-rustdesk-mac .rustdesk-mac-table thead {
    display: none !important;
  }

  #view-rustdesk-mac .rustdesk-mac-table tbody {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px !important;
  }

  #view-rustdesk-mac .rustdesk-mac-table tr.rustdesk-mac-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 12px !important;
    gap: 0 !important;
    border: 1px solid color-mix(in srgb, var(--brand-2) 48%, var(--line)) !important;
    border-radius: 13px !important;
    background: var(--panel) !important;
    box-shadow: 0 5px 16px color-mix(in srgb, #000 8%, transparent) !important;
    overflow: hidden !important;
  }

  #view-rustdesk-mac .rustdesk-mac-table td.rustdesk-mac-cell {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 9px 2px !important;
    margin: 0 !important;
    border: 0 !important;
    border-bottom: 1px solid color-mix(in srgb, var(--line) 78%, transparent) !important;
    text-align: left !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: anywhere !important;
    box-sizing: border-box !important;
  }

  #view-rustdesk-mac .rustdesk-mac-table td.rustdesk-mac-cell::before {
    content: attr(data-label);
    display: block !important;
    margin: 0 0 4px !important;
    color: var(--muted) !important;
    font-size: .64rem !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    letter-spacing: .055em !important;
    text-transform: uppercase !important;
  }

  #view-rustdesk-mac .rustdesk-mac-host strong {
    display: block !important;
    color: var(--text-color) !important;
    font-size: .98rem !important;
    line-height: 1.3 !important;
  }

  #view-rustdesk-mac .rustdesk-mac-group .badge {
    display: inline-flex !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  #view-rustdesk-mac .rustdesk-mac-id > span {
    font-variant-numeric: tabular-nums;
    letter-spacing: .025em;
  }

  #view-rustdesk-mac .rustdesk-mac-table td.rustdesk-mac-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto auto !important;
    gap: 8px !important;
    align-items: stretch !important;
    padding: 11px 0 0 !important;
    border-bottom: 0 !important;
  }

  #view-rustdesk-mac .rustdesk-mac-actions::before {
    grid-column: 1 / -1;
    margin-bottom: 0 !important;
  }

  #view-rustdesk-mac .rustdesk-mac-actions .btn {
    min-width: 42px !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: 8px 11px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    white-space: nowrap !important;
  }

  #view-rustdesk-mac .rustdesk-mac-connect {
    width: 100% !important;
  }

  /* Estado vazio/carregando continua legivel sem virar um card quebrado. */
  #view-rustdesk-mac .rustdesk-mac-table tbody > tr:not(.rustdesk-mac-row) {
    display: block !important;
    width: 100% !important;
  }

  #view-rustdesk-mac .rustdesk-mac-table tbody > tr:not(.rustdesk-mac-row) > td {
    display: block !important;
    width: 100% !important;
    padding: 16px !important;
    text-align: center !important;
    border: 1px solid var(--line) !important;
    border-radius: 12px !important;
  }

  /* Modal de cadastro/edicao do Mac tambem respeita a viewport. */
  #rustdeskModal .modal-content-user {
    width: min(94vw, 560px) !important;
    max-width: 94vw !important;
    max-height: calc(100dvh - 24px) !important;
    margin: 12px auto !important;
  }

  #rustdeskModal .modal-content {
    width: 100% !important;
    max-width: 100% !important;
    max-height: calc(100dvh - 24px) !important;
    overflow: hidden !important;
  }

  #rustdeskModal .modal-body {
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  #rustdeskModal .modal-body form .text-end {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  #rustdeskModal .modal-body form .text-end .btn {
    width: 100% !important;
    margin: 0 !important;
  }
}

@media screen and (max-width: 480px) {
  #view-rustdesk-mac .rustdesk-mac-panel {
    padding: 11px !important;
    border-radius: 12px !important;
  }

  #view-rustdesk-mac .connecta-module-brand img {
    max-width: min(76vw, 200px) !important;
    max-height: 58px !important;
  }

  #view-rustdesk-mac .rustdesk-mac-table tr.rustdesk-mac-row {
    padding: 11px !important;
  }

  #view-rustdesk-mac .rustdesk-mac-table td.rustdesk-mac-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  #view-rustdesk-mac .rustdesk-mac-actions::before,
  #view-rustdesk-mac .rustdesk-mac-connect {
    grid-column: 1 / -1 !important;
  }

  #view-rustdesk-mac .rustdesk-mac-edit,
  #view-rustdesk-mac .rustdesk-mac-delete {
    width: 100% !important;
  }

  #rustdeskModal .modal-body form .text-end {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Mantem o desktop com a mesma densidade visual anterior; textos extras das acoes so aparecem nos cards. */
#view-rustdesk-mac .rustdesk-mac-action-text {
  display: none;
}

@media screen and (max-width: 900px) {
  #view-rustdesk-mac .rustdesk-mac-action-text {
    display: inline !important;
  }
}

/* R18 - Radar: ações consolidadas no botão +. */
#view-odin-agent-updates #odinUpdateAgentsTbody > tr > td:last-child {
  width: 48px;
  min-width: 48px;
  vertical-align: top;
  overflow: visible;
}

#view-odin-agent-updates .odin-radar-actions-r6 {
  display: inline-block;
  width: auto;
  max-width: 100%;
}

#view-odin-agent-updates .odin-radar-actions-r6 > summary {
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 !important;
  border-radius: 9px !important;
}

#view-odin-agent-updates .odin-radar-actions-r6[open] .odin-radar-more-menu-r6 {
  position: static !important;
  width: 220px !important;
  min-width: 220px !important;
  max-width: min(220px, 72vw) !important;
  margin-top: 7px !important;
}

#view-odin-agent-updates .odin-radar-more-menu-r6,
#view-odin-agent-updates .odin-radar-command-list-r18 {
  display: grid !important;
  gap: 6px !important;
}

#view-odin-agent-updates .odin-radar-command-list-r18 {
  width: 100% !important;
}

#view-odin-agent-updates .odin-radar-more-menu-r6 .btn,
#view-odin-agent-updates .odin-radar-command-list-r18 .btn {
  display: flex !important;
  width: 100% !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  text-align: left !important;
  border-radius: 8px !important;
}