/* REXUS — ajustes pontuais sobre o design system (app.min.css).
   Regras mínimas e documentadas; a aparência dos componentes continua vindo do tema. */

/* Troca de logo por tema fora da .logo-box (telas de autenticação).
   Mesmo mecanismo de html[data-bs-theme] usado pelo tema na sidebar. */
.auth-logo .logo-light { display: none; }
.auth-logo .logo-dark { display: inline-block; }
html[data-bs-theme=dark] .auth-logo .logo-light { display: inline-block; }
html[data-bs-theme=dark] .auth-logo .logo-dark { display: none; }

/* Utilitários mínimos usados pelos templates (sem equivalente no tema).
   Substituem styles inline; alturas de progress usam .progress-sm/.progress-md do tema. */
.rx-pointer { cursor: pointer; }
.rx-prewrap { white-space: pre-wrap; }
.rx-summary-plain { list-style: none; }
.rx-summary-plain::-webkit-details-marker { display: none; }
.rx-icon-lg { font-size: 2rem; line-height: 1; }
.rx-icon-xl { font-size: 3rem; line-height: 1; }
.rx-minw-110 { min-width: 110px; }
.rx-minw-140 { min-width: 140px; }
.rx-minw-180 { min-width: 180px; }
.rx-minw-220 { min-width: 220px; }
.rx-minw-260 { min-width: 260px; }
.rx-minw-280 { min-width: 280px; }
.rx-maxw-110 { max-width: 110px; }
.rx-maxw-180 { max-width: 180px; }
.rx-maxw-280 { max-width: 280px; }
.rx-maxw-320 { max-width: 320px; }

/* Larguras mínimas que só valem a partir de md. Abaixo disso a coluna divide
   a largura disponível: reservar 220px numa tela de 375px empurra a tabela
   para fora do card e obriga a rolagem horizontal. */
@media (min-width: 768px) {
  .rx-minw-md-180 { min-width: 180px; }
  .rx-minw-md-220 { min-width: 220px; }
}

/* Tabela de permissões (uma linha por tarefa) empilhada no celular: com duas
   colunas em 375px a descrição fica com uma palavra por linha e o select sai
   do card. Empilhado, cada tarefa é um bloco e o select ocupa a largura toda. */
@media (max-width: 767.98px) {
  .rx-stack-sm thead { display: none; }
  .rx-stack-sm tbody tr { display: block; padding: .75rem 0; }
  .rx-stack-sm tbody tr + tr { border-top: 1px solid var(--bs-border-color); }
  .rx-stack-sm tbody td { display: block; border: 0; padding: 0; }
  .rx-stack-sm tbody td + td { margin-top: .5rem; }
}

/* Controle de uma área fechada para o usuário: continua visível para poder
   explicar o motivo no clique (access-denied.js), mas não se disfarça de
   disponível. Cursor de "não permitido" e opacidade reduzida — sem `disabled`,
   que impediria o próprio clique que abre o aviso. */
.rx-blocked { opacity: .5; cursor: not-allowed; }
.rx-blocked:hover, .rx-blocked:focus { opacity: .65; }

/* Busca do topo (topbar) — dropdown de resultados do typeahead de navegação. */
.rx-nav-search-menu { position: absolute; top: calc(100% + .35rem); left: 0; width: 100%; max-height: 20rem; overflow-y: auto; }
.rx-nav-search-item { white-space: nowrap; }
.rx-nav-search-item.rx-active { background-color: var(--bs-tertiary-bg); }

/* Filtro estreito de situação nas listas (rótulos curtos: Rascunho,
   Publicado, Arquivado) — 180px sobraria ao lado dos demais filtros. */
.rx-maxw-160 { max-width: 160px; }

/* Lista de checkboxes com rolagem própria (seleção de empresas em Modelos).
   A carteira passa de 200 empresas: sem limite, o bloco empurraria os botões
   do formulário fora da tela. `max-height` em rem para acompanhar a fonte —
   cada `.form-check` ocupa ~1.5rem, então 15rem mostra ~9 empresas e o resto
   rola. `min-width: 0` + `overflow-wrap` mantêm razão social longa contida na
   caixa em vez de vazar para o lado. */
.rx-check-list { max-height: 15rem; overflow-y: auto; }
.rx-check-list .form-check { margin-bottom: .125rem; min-width: 0; }
.rx-check-list .form-check-label { overflow-wrap: anywhere; }

/* Bloco de texto dentro de um card flex: sem `min-width: 0` o conteúdo não
   encolhe e o título longo empurra o card, vazando a coluna do grid. */
.rx-minw-0 { min-width: 0; }

/* Leitor de modelos: dimensões limitadas à viewport e superfícies do tema. */
.rx-material-preview .modal-content { max-height: 90vh; max-height: 90dvh; }
.rx-material-preview .modal-body { overflow: auto; min-height: 12rem; }
.rx-material-preview .modal-header,
.rx-material-preview .modal-footer { flex-shrink: 0; }
.rx-material-preview-content { background-color: var(--bs-tertiary-bg); }
.rx-material-preview-frame {
  display: block;
  width: 100%;
  height: 65vh;
  height: 65dvh;
  border: 0;
}
.rx-material-preview-image {
  display: block;
  width: 100%;
  height: 65vh;
  height: 65dvh;
  object-fit: contain;
}
.rx-material-preview-text {
  max-height: 65vh;
  max-height: 65dvh;
  overflow: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  color: var(--bs-body-color);
}
@media (max-width: 575.98px) {
  .rx-material-preview .modal-footer > .small { width: 100%; }
}

/* Popup global de documentos iniciais — composição sobre os tokens Bootstrap. */
.rx-onboarding-popup-list {
  max-height: min(58vh, 36rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-right: .25rem;
}

.rx-onboarding-popup-item {
  background-color: var(--bs-tertiary-bg);
}

.rx-onboarding-popup-item + .rx-onboarding-popup-item {
  margin-top: .75rem;
}

.rx-onboarding-popup-modal .modal-footer > .small {
  max-width: 32rem;
}

@media (max-width: 575.98px) {
  .rx-onboarding-popup-modal .modal-body {
    padding: 1rem;
  }

  .rx-onboarding-popup-modal .modal-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .rx-onboarding-popup-modal .modal-footer .btn {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .rx-onboarding-popup-list {
    scroll-behavior: auto;
  }
}

/* Shell de página e navegação contextual. Mantém os tokens do Hando/Bootstrap. */
.rx-skip-link {
  background-color: var(--bs-body-bg);
  border: 1px solid var(--bs-border-color);
  border-radius: var(--bs-border-radius-sm);
  color: var(--bs-body-color);
  left: .75rem;
  padding: .5rem .75rem;
  position: fixed;
  top: .75rem;
  z-index: 2000;
}

.rx-page-header {
  border-bottom: 1px solid var(--bs-border-color);
  border-bottom: 1px solid color-mix(in srgb, var(--bs-border-color) 70%, transparent);
  margin-bottom: 1.25rem;
  padding-bottom: 1rem !important;
  padding-top: 1.25rem !important;
}

.rx-page-heading {
  border-left: .2rem solid var(--bs-primary);
  min-width: 0;
  padding-left: .85rem;
}

.rx-page-eyebrow:empty,
.rx-page-intro:empty {
  display: none;
}

.rx-page-eyebrow {
  color: var(--bs-secondary-color);
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .06em;
  margin-bottom: .2rem;
  text-transform: uppercase;
}

.rx-page-intro {
  color: var(--bs-secondary-color);
  font-size: .8125rem;
  margin-top: .35rem;
  max-width: 48rem;
}

.rx-page-context {
  min-width: 0;
  padding-top: .2rem;
}

.rx-page-context nav {
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
}

.rx-page-context .breadcrumb {
  justify-content: flex-end;
  min-width: max-content;
  white-space: nowrap;
}

.rx-back-control {
  align-items: center;
  display: inline-flex;
  gap: .15rem;
  touch-action: manipulation;
  -webkit-tap-highlight-color: rgba(var(--bs-primary-rgb), .15);
  white-space: nowrap;
}

.rx-back-control--form {
  background-color: var(--bs-tertiary-bg);
  border-color: var(--bs-border-color);
  color: var(--bs-secondary-color);
  font-weight: 500;
  padding-inline: .75rem;
}

.rx-form-back:hover,
.rx-form-back:focus-visible {
  background-color: var(--bs-secondary-bg);
  border-color: var(--bs-primary);
  color: var(--bs-body-color);
}

.rx-form-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  justify-content: flex-end;
}

.rx-form-actions > .btn,
.rx-form-actions > .rx-back-control {
  min-height: 2.375rem;
}

.rx-list-header {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
}

.rx-list-heading {
  flex: 1 1 auto;
  min-width: 0;
}

.rx-list-actions {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  gap: .5rem;
}

.rx-filter-bar {
  align-items: center;
  background-color: transparent;
  border: 0;
  border-radius: 0;
  display: flex;
  flex: 0 1 auto;
  flex-wrap: wrap;
  gap: .75rem;
  margin: 0 0 1rem;
  padding: 0;
  width: auto;
}

.rx-list-header > .rx-filter-bar {
  margin: 0 0 0 auto;
  order: 1;
}

.rx-list-header > .rx-list-actions {
  order: 2;
}

.rx-filter-search {
  flex: 0 1 17.5rem;
  max-width: 17.5rem;
  min-width: 14rem;
}

.rx-filter-control,
.rx-filter-field {
  flex: 0 1 12rem;
  min-width: 10rem;
}

.rx-filter-submit {
  flex: 0 0 auto;
}

.rx-filter-actions {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  gap: .5rem;
  margin-left: auto;
}

.rx-filter-bar > .form-check {
  flex: 0 1 auto;
}

.rx-table-actions {
  align-items: center;
  display: inline-flex;
  gap: .5rem;
  justify-content: flex-end;
  vertical-align: middle;
}

.rx-table-actions .btn-icon {
  align-items: center;
  display: inline-flex;
  flex: 0 0 1.75rem;
  height: 1.75rem;
  justify-content: center;
  margin: 0 !important;
  width: 1.75rem;
}

.rx-table-actions .mdi {
  line-height: 1;
}

.rx-tag-create {
  align-items: flex-end;
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
}

.rx-tag-field {
  flex: 0 1 18rem;
  min-width: 0;
  width: 18rem;
}

.rx-tag-input .form-control {
  max-width: 100%;
  width: 18rem;
}

.rx-tag-submit {
  flex: 0 0 auto;
  height: 1.775rem;
  min-height: 1.775rem;
}

.rx-tag-create + .rx-tag-list {
  margin-top: 1.25rem;
}

.rx-tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}

.rx-page-content {
  animation: rx-page-enter .28s ease-out both;
}

.rx-page-content .btn,
.rx-page-content a.card {
  transition: transform .2s ease, opacity .2s ease;
}

.rx-page-content a.card:hover {
  border-color: var(--bs-primary);
  border-color: color-mix(in srgb, var(--bs-primary) 38%, var(--bs-border-color));
  box-shadow: 0 .35rem 1rem rgba(16, 24, 40, .08);
  transform: translateY(-1px);
}

.rx-page-content :focus-visible,
.rx-page-header :focus-visible {
  outline: 3px solid var(--bs-primary);
  outline: 3px solid color-mix(in srgb, var(--bs-primary) 45%, transparent);
  outline-offset: 2px;
}

@keyframes rx-page-enter {
  from { opacity: 0; transform: translateY(.35rem); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 767.98px) {
  .rx-page-header {
    align-items: stretch !important;
  }

  .rx-page-context {
    width: 100%;
  }

  .rx-page-context .breadcrumb {
    justify-content: flex-start;
  }

  .rx-form-actions {
    justify-content: stretch;
  }

  .rx-form-actions > .btn,
  .rx-form-actions > .rx-back-control {
    flex: 1 1 auto;
    justify-content: center;
  }

  .rx-filter-bar {
    align-items: stretch;
    flex: 1 1 100%;
    margin-left: 0;
    width: 100%;
  }

  .rx-list-header > .rx-filter-bar {
    margin: 0;
  }

  .rx-filter-search,
  .rx-filter-control,
  .rx-filter-field,
  .rx-filter-submit,
  .rx-filter-actions {
    flex: 1 1 100%;
    max-width: none;
    min-width: 0;
    width: 100%;
  }

  .rx-filter-actions {
    margin-left: 0;
  }

  .rx-filter-actions > * {
    flex: 1 1 auto;
  }

  .rx-tag-field,
  .rx-tag-input,
  .rx-tag-input .form-control,
  .rx-tag-submit {
    max-width: none;
    min-width: 0;
    width: 100%;
  }

}

@media (prefers-reduced-motion: reduce) {
  .rx-page-content,
  .rx-page-content .btn,
  .rx-page-content a.card {
    animation: none;
    transition: none;
  }

  .rx-page-content a.card:hover {
    transform: none;
  }
}