/*Borda roxa abaixo do cabeçalho das regiões*/
  .t-Header { 
  border-bottom: 3px solid #c95788;
  }

/* Menu Lateral - Ao expandir não sobrepor informações quando for página com Left Side Column*/
/*
.apex-side-nav.js-navExpanded.t-PageBody--showLeft .t-Body-content {
transform: translate3d(240px, 0, 0) !important;
}
*/

/* Menu Superior - Navigation Menu Bar */
  .t-Header-nav-list{ 
    background-color: #552179 !important;
  }

  .a-MenuBar-item{ 
    background-color: #552179 !important;
  }

  .a-Menu-content{ 
    background-color: #2c1a63 !important;
  }

  .a-Menu-labelContainer{
    color: #fafafa !important;
  }

/* Cores Padrões */
  .colorPurple {
   color: #511C76 !important;
  }

  .colorBlue {
   color: #2C1A63 !important;
  }

  .colorPink {
   color: #C95788 !important;
  }

  .backgroundColorPurple {
   background-color: #511C76 !important;
  }

  .backgroundColorBlue {
   background-color: #2C1A63 !important;
  }

  .backgroundColorPink {
   background-color: #C95788 !important;
  }

/*
.t-Region-headerItems.t-Region-headerItems--title{
border-left: 5px solid #511c76;
}
*/

/*Borda roxa à esquerda do cabeçalho das regiões*/
  .t-Region-header{ 
  border-left: 5px solid #511c76 !important;
  }

/*Cor do ícone em região em template Hero*/
  .t-HeroRegion-icon{ 
    background-color: #c95788 !important;
    color: #2C1A63 !important;
  }

/*Formatação da Fonte dos Headers das regiões*/
  .t-Region-title { 
      font-weight: 500 !important;
      font-size: large !important;
      color: #262626 !important;
  }

/*Borda roxa abaixo do cabeçalho das regiões*/
  .a-IRR-toolbar { 
      border-bottom: 3px solid #511c76;
  }

/*Borda roxa abaixo do cabeçalho das regiões*/
  .a-IG-header{ 
      border-bottom: 3px solid #511c76;
  }

/*Borda roxa abaixo do cabeçalho das regiões*/
  .ui-dialog.ui-dialog--inline .ui-dialog-titlebar{ 
      border-bottom: 3px solid #511c76;
  }

/*Borda roxa abaixo do cabeçalho das regiões*/
  .ui-dialog-titlebar.ui-widget-header.ui-corner-all.ui-helper-clearfix{ 
      border-bottom: 3px solid #511c76;
  }

/*Cor do ícone no header das regiões*/
  .t-Region-headerIcon{ 
  color: #c95788 !important;
  }

/*Margem do item*/
  .t-Form-fieldContainer{ 
  margin-top:6px !important; 
  }

/*Cor do Radio Button quando selecionado*/
  .apex-button-group input:checked+label, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input:checked+label{
  border-color: #c95788 !important; 
    background-color: #c95788 !important;
  }

/*Cor do ícone do tipo Alert*/
  .t-Alert--info .t-Alert-icon .t-Icon{ 
  color: #fff !important;
  }
/* Estrutura certa do ícone do alerta "info": a região do ícone
   (.t-Alert-icon) ocupa toda a altura do aviso, com um fundo azul
   claro — e DENTRO dela fica uma bolinha pequena e escura (o
   próprio <span class="t-Icon">), com o "i" branco centralizado. */
.t-Alert--defaultIcons.t-Alert--info .t-Alert-icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #F3ECF9 !important;
}
.t-Alert--info .t-Alert-icon .t-Icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  border-radius: 50% !important;
  background-color: var(--nc-primary) !important;
  background-image: none !important;
  position: relative !important;
}
.t-Alert--info .t-Alert-icon .t-Icon::before {
  content: "i" !important;
  display: block !important;
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  font-style: italic !important;
  line-height: 1 !important;
}

/* Espaço nas laterais do texto do aviso — estava colado nas bordas. */
.t-Alert-content {
  padding: 12px 16px !important;
}

/*Cor do botão do tipo Link*/
  .t-Button--link.t-Button, .t-Button--link .t-Icon{ 
  color: #2C1A63 !important;
  }

/*Borda do ícone das breadcrumbs das regiões com template Hero*/
  .t-HeroRegion-icon{ 
    /*transform: rotate(45deg);*/
    border-radius: 7px !important;
  }

/*Cor do marcador da região Wizard, quando ok*/
  .t-WizardSteps-step.is-complete .t-WizardSteps-marker { 
      background-color: #2c1b63 !important;
      color: #FFF;
  }

/*Cor do marcador da região Wizard, quando ativo*/
  .t-WizardSteps-step.is-active .t-WizardSteps-marker { 
      background-color: #c95788; 
  }

/*Cor do item selecionado, com foco*/
  .apex-item-multi:focus, .apex-item-select:focus, .apex-item-text:focus, .apex-item-textarea:focus, select.listmanager:focus {
  border-color: #c95788 !important; 
  }

/*Cor do item selecionado, com foco*/
  .t-Form-fieldContainer--floatingLabel .apex-item-has-icon:focus+.apex-item-icon, .t-Form-fieldContainer--floatingLabel .apex-item-multi.is-focused+.apex-item-icon {
  background-color: #c95788 !important; 
  }

/*Formatação das cores e formatos dos ícones das regiões do tipo Card*/
  .t-Card-icon{ 
    border-radius: 7px !important;
    /*transform: rotate(45deg);*/
  }

/*Formatação das cores e formatos dos ícones das regiões do tipo Card*/
  .t-Card-colorFill, .t-Card-icon { 
      background:
          linear-gradient(#511C76, transparent),
          linear-gradient(to top left, #C95788, transparent),
          linear-gradient(to bottom right, #2C1A63, transparent) !important;
      background-blend-mode: screen !important;
  }

/*Formatação da fonte dos títulos das Páginas Modais*/
  .ui-dialog-title{ 
      font-weight: 500 !important;
      font-size: large !important;
      color: #262626 !important;
  }

/*Formatação das fotos, circular e sem borda em formato Pequeno 50px*/
  .fotoColabSmall{ 
      display: block;
      margin-left: auto;
      margin-right: auto;
      width: 50%;
      border-radius: 100px;
      margin-top: 5px;
      margin-bottom: 5px;
      min-width: 50px;
      min-height: 50px;
      max-width: 50px;
      max-height: 50px;
  }

  .fotoColabSmallComments{ 
  width: 42px;
  height: 42px;
  border-radius: 50%;
  object-fit: cover;
  border: 1.5px solid #511c76 !important;
}

/*Formatação das fotos, circular e com borda em formato Médio 100px*/
  .fotoColabMed{ 
      display: block;
      margin-left: auto;
      margin-right: auto;
      width: 50%;
      border-radius: 100px;
      box-shadow: 0 0 0 3px #511c76 !important;
      margin-top: 5px;
      margin-bottom: 5px;
      min-width: 100px;
      min-height: 100px;
      max-width: 100px;
      max-height: 100px;
  }

/*Formatação das fotos, circular e com borda em formato Grande 120px*/
  .fotoColab{ 
      display: block;
      margin-left: auto;
      margin-right: auto;
      width: 50%;
      border-radius: 100px;
      box-shadow: 0 0 0 3px #511c76 !important;
      margin-top: 5px;
      margin-bottom: 5px;
      min-width: 120px;
      min-height: 120px;
      max-width: 120px;
      max-height: 120px;
  }

/*Formatação das fotos nos relatórios (Classic Report, Interactive Report, etc...)*/
  td[headers=FOTO] img { 
      display: block;
      margin-left: auto;
      margin-right: auto;
      width: 50%;
      border-radius: 50px;
      margin-top: 5px;
      margin-bottom: 5px;
      min-width: 60px;
      min-height: 60px;
      max-width: 60px;
      max-height: 60px;
  }

  .zoom100{
    zoom: 100%;
  }

  .zoom150{
    zoom: 150%;
  }

  .zoom140{
    zoom: 140%;
  }

  .zoom130{
    zoom: 130%;
  }

  .zoom120{
    zoom: 120%;
  }

  .zoom110{
    zoom: 110%;
  }

  .zoom90{
    zoom: 90%;
  }

  .zoom80{
    zoom: 80%;
  }

  .zoom70{
    zoom: 70%;
  }

  .zoom60{
    zoom: 60%;
  }

  .zoom50{
    zoom: 50%;
  }

  .zoom40{
    zoom: 40%;
  }

  .zoom30{
    zoom: 30%;
  }

  .zoom20{
    zoom: 20%;
  }

  .zoom10{
    zoom: 10%;
  }

/*Comando para Mostrar região ao clicar no + Ver Mais*/
  .expandRegion { 
  display: block;
  }

/*Comando para Esconder região ao clicar no + Ver Mais*/
  .collapseRegion { 
  display: none;
  }

/*A região PARAMETROS que fica na página global*/
  #GLOBAL_PARAMETROS{ 
    display: none;
  }

/*As cores dos ícones do Home, que não estavam ficando brancos*/
  .t-Cards-item > .t-Card .t-Card-icon{ 
  color: #fff !important;
  }


/*Dados do Usuário no Menu Lateral - Início*/
  #t_TreeNav {
      display: flex;
      flex-direction: column;
      height: 100%;
  }

  #t_TreeNav ul {
      flex: 1 0 auto;
  }

  div.sideuserdata{
      flex: 0 0 auto;
  }

  #t_PageBody.apex-side-nav.js-navCollapsed .sideuserdata {
     display: none;
  }

  .ui-dialog > div.sideuserdata {
      flex: 0 0 auto;
      display: none !important;
  }
/*Dados do Usuário no Menu Lateral - Fim*/


/*Nível de transparência de Itens desabilitados*/
  .apex_disabled { 
    opacity: 0.8 !important;
  }

/*Para utilizar na foto do perfil das consultas de colaboradores, identificar Admitidos, Afastados e Desligados*/
  .admitido {
  box-shadow: 0 0 0 3px #58e05c !important;
  }

  .afastado {
  box-shadow: 0 0 0 3px #fcdc21 !important;
  }

  .desligado {
  box-shadow: 0 0 0 3px #d64747 !important;
  }

  .picSuccess {
   box-shadow: 0 0 0 3px #47b74a !important;
  }

  .picAlert {
   box-shadow: 0 0 0 3px #fcdc21 !important;
  }

  .picDanger {
   box-shadow: 0 0 0 3px #d64747 !important;
  }

  .picInfo {
   box-shadow: 0 0 0 3px #2c1a63 !important;
  }

  .picNone {
   box-shadow: 0 0 0 3px #d1d1d1 !important;
  }

/*Classe para aplicar cor em ícones*/
  .colorSuccess {
   color: #47b74a !important;
  }

  .colorAlert {
   color: #fcdc21 !important;
  }

  .colorDanger {
   color: #d64747 !important;
  }

  .colorInfo {
   color: #2c1a63 !important;
  }

  .colorNone {
   color: #d1d1d1 !important;
  }

/*Corrigir Bug da atualização do Chrome que some o Item ao selecionar*/
  .apex-item-select:not(.a-GV *):not(.a-GV-columnItemContainer *),
  .apex-item-text:not(.a-GV *):not(.a-GV-columnItemContainer *),
  .apex-item-textarea:not(.a-GV *):not(.a-GV-columnItemContainer *),
  .apex-item-multi:not(.a-GV *):not(.a-GV-columnItemContainer *) {
  backface-visibility: hidden;
  }


/*Breadcrumb via HTML customizado*/
    #BREADCRUMB{
      margin-top: 0px !important;
      margin-bottom: 0px !important;
    }

    /* Style the list */
    #BREADCRUMB ul.breadcrumb {
      /*padding: 10px 16px;*/
      list-style: none;
      /*background-color: #eee;*/
      background-color: #fff0;
    }

    /* Display list items side by side */
    #BREADCRUMB ul.breadcrumb li {
      display: inline;
      font-size: 14px;
    }

    /* Add a slash symbol (/) before/behind each list item */
    #BREADCRUMB ul.breadcrumb li+li:before {
      padding: 8px;
      color: #c95788;
      content: "/\00a0";
      font-size: 16px;
    }

    /* Add a color to all links inside the list */
    #BREADCRUMB ul.breadcrumb li a {
      color: #2C1A63;
      text-decoration: none;
    }

    /* Add a color on mouse-over */
    #BREADCRUMB ul.breadcrumb li a:hover {
      color: #c95788;
      text-decoration: underline;
    }




/*Botão do Chamado Interno*/

  .floatChamadoInterno{
    position: fixed;
    bottom: 13rem;
    right: 1rem;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background-color: #c95788 !important;
    color: #2c1a63 !important;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 8px 0px;
    cursor: pointer;
    z-index: 9999 !important;
    transition: all 0.2s ease-in-out 0s;
    left: unset;
    transform: scale(1);
    border: 2px solid #2c1a63 !important;
  }
/*
  .floatChamadoInterno{
    z-index: 100 !important;
    position: fixed;
    width: 50px;
    height: 50px;
    bottom: 80px;
    right: 10px;
    background-color: #c95788 !important;
    color: #2c1a63 !important;
    border-radius: 25px;
    text-align: center;
    box-shadow: 2px 2px 3px #999;
  }
*/

  .my-floatChamadoInterno{
    z-index: 9999 !important;
    margin-top:22px;
  }

/* Botão do ChatBot - CHATBASE */
#chatbase-bubble-button{
  bottom: 7rem !important;
  z-index: 500 !important;
}

/*Botão da NATI - IA da Natcorp - ChatBot*/

  .floatNati{
    position: fixed;
    bottom: 20rem;
    right: 1rem;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background-color: #c95788 !important;
    color: #2c1a63 !important;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 8px 0px;
    cursor: pointer;
    z-index: 9999 !important;
    transition: all 0.2s ease-in-out 0s;
    left: unset;
    transform: scale(1);
    border: 2px solid #c95788 !important;
    /*
    background-image: url("#WORKSPACE_IMAGES#NATI - 128px.png");
    background-size: cover;
    background-position: center;
    */
  }

  .my-floatNati{
    z-index: 9999 !important;
    margin-top:22px;
  }

.floatNati:hover {
  transform: scale(1.07);
}

.nati-avatar {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  object-fit: cover;
  border: 1.5px solid #c95788 !important;
}

.btnNATIlive {
  background-color: #c95788 !important;
  color: #2C1A63 !important;
  animation: btnNATIpulse 1500ms infinite;
}

@keyframes btnNATIpulse {
  0% {
    box-shadow: #c95788 0 0 0 0;
  }
  75% {
    box-shadow: #c9578800 0 0 0 16px;
  }
}


/*CSS Class: floatNati my-floatNati fab-nati */
/*Custom Attributes: style="background-image: url('#WORKSPACE_IMAGES#NATI - 128px.png'); background-size: cover; background-position: center;" */

/* Botão de IA */

  .btnIA{
    right: 1rem;
    width: 42px;
    height: 42px;
    /*border-radius: 50%;*/
    background-color: transparent !important;
    color: rgb(0 0 0 / 0%) !important;
    /*box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 8px 0px;*/
    cursor: pointer;
    transition: all 0.25s ease-in-out;
    left: unset;
    /*transform: scale(1);*/

    /*transform: rotate(45deg) scale(1);*/
    /*padding:10px 22px;*/
    color: #fff !important;
    border: none !important;
    border-radius: 14px !important;
    overflow: visible;
  }

/*
.btnIA span {
    display: inline-block;
    //transform: rotate(-45deg);
}
*/

.fab-ia-natcorp:hover {
  transform: scale(1.10);
  /*box-shadow: rgba(0, 0, 0, 0.3) 0px 4px 8px 0px;*/
  border: none !important;
  border-radius: 14px !important;
  box-shadow: rgba(201,87,136, 0.60) 0px 0px 12px 6px !important;
}

.ia-natcorp-avatar {
  width: 42px;
  height: 42px;
  border-radius: 14px !important;
  object-fit: cover;
  /*border: 1.5px solid #c95788 !important;*/
}

.btnIAlive {
  /*background-color: transparent !important;
  color: rgb(0 0 0 / 0%) !important;*/
  border-radius: 14px !important;
  box-shadow: linear-gradient(#C95788, transparent),
          linear-gradient(to top left, #C95788, transparent),
          linear-gradient(to bottom right, #C95788, transparent) 20px 20px 20px 20px !important;
  animation: btnIApulse 1500ms infinite;
    content: "";
    position: absolute;
    inset: -18px; /* controla distância do halo */
    border-radius: 20px;
    /* Define o formato do halo IGUAL ao botão */
    z-index: -1;
}

@keyframes btnIApulse {
  0% {
    box-shadow: #C95788 0 0 0 0;
  }
  75% {
    box-shadow: #C9578800 0 0 0 14px;
  }
  100% {
    box-shadow: #C9578800 0 0 0 20px;
  }
}


/* Modal: Arredondar pontas da modal */
.ui-dialog{
  border-radius: 10px !important;
}

/* Interactive Report: Arredondar pontas da regiao */
.a-IRR{
  border-radius: 10px !important;
}


/* Cabecalho Regiao: Arredondar pontas da regiao
.t-Region-header{
  border-top-left-radius: 10px !important;
  border-top-right-radius: 10px !important;
}
*/


/* Regiao: Arredondar pontas da regiao 
.t-Region{
  border-radius: 10px !important; 
}
*/


/* CSS para aumentar o texto do custom-alerts.js SweetAlert2 */
.swal2-popup {
  font-size: 1.2em; /* Aumenta o tamanho do texto */
}

.swal2-title {
  font-size: 2em; /* Aumenta o tamanho do título */
}

.swal2-html-container {
  font-size: 1.4em; /* Aumenta o tamanho do texto do corpo do alert */
}





/* === A PARTIR DAQUI: Natcorp_Style_New === */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;600;700;800&display=swap');
/* Fontes exclusivas da tela de login (Sora/Manrope), fiéis ao
   protótipo aprovado — o resto do sistema continua com Jakarta Sans. */
@import url('https://fonts.googleapis.com/css2?family=Sora:wght@400;500;600;700&family=Manrope:wght@400;500;600;700&display=swap');


/* =====================================================================
   Natcorp Skin — Oracle APEX 19.x / Universal Theme 19.x
   Aplica a identidade visual Natcorp (violeta profundo + ametista +
   grafite) sobre as telas existentes, sem alterar páginas ou itens.

   Instalação:
   1. Shared Components > Static Application Files > Upload natcorp.css
      e natcorp.js.
   2. Shared Components > User Interface Attributes > Desktop >
      CSS > File URLs:      #APP_IMAGES#natcorp.css
      JavaScript > File URLs: #APP_IMAGES#natcorp.js
   3. Se o tema já é customizado (Theme Style próprio), mantenha-o:
      este arquivo carrega DEPOIS e sobrescreve por especificidade.
   ===================================================================== */


:root {
  --nc-primary: #5b2a86;
  --nc-primary-rgb: 91, 42, 134;
  --nc-primary-deep: #3d1a5e;
  --nc-primary-glow: #8e4fb8;
  --nc-primary-glow-rgb: 142, 79, 184;
  --nc-primary-soft: #f3ecf9;
  --nc-primary-border: #e0d2ee;
  --nc-graphite: #4a4a52;
  --nc-ink: #2b2233;
  --nc-muted: #6E6978;
  --nc-bg: #f8f6fb;
  --nc-card: #ffffff;
  --nc-border: #e5e0ec;
  --nc-success: #1f8a5a;
  --nc-success-soft: #e4f5ec;
  --nc-warning: #c98411;
  --nc-warning-soft: #fbf0dc;
  --nc-danger: #c8342f;
  --nc-danger-soft: #fbe6e5;
  --nc-radius: 10px;
  --nc-radius-sm: 6px;
  --nc-radius-md: 8px;
  --nc-radius-lg: 12px;
  --nc-shadow: 0 1px 2px rgba(43, 34, 51, 0.06), 0 8px 24px rgba(43, 34, 51, 0.05);
  --nc-shadow-xs: 0 1px 2px rgba(43, 34, 51, 0.04);
  --nc-shadow-md: 0 6px 18px rgba(43, 34, 51, 0.1);
  --nc-font: "Plus Jakarta Sans", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  /* Aliases — mesmos nomes usados no arquivo 2, apontando para as cores
     já aprovadas acima, só para os seletores de item poderem ser
     transportados sem adivinhar valores novos. */
  --nc-fg: var(--nc-ink);
  --nc-input: var(--nc-border);
  --nc-muted-fg: var(--nc-muted);
  --nc-muted-bg: #f4f1f8;
  --nc-destructive: var(--nc-danger);
  --nc-primary-fg: #faf8fc;
  --nc-secondary: var(--nc-primary-soft);
  --nc-secondary-fg: var(--nc-primary-deep);
  --nc-accent: var(--nc-primary-soft);
  --nc-accent-fg: var(--nc-primary-deep);
  --nc-ring: var(--nc-primary-glow);
}

/* ---------- Temas de cor alternativos ---------- */
/* Cada tema redefine só os tokens principais de cor — como todo o
   resto do CSS já usa var(--nc-primary...), a troca de tema acontece
   automaticamente em toda a aplicação, sem reescrever nenhuma regra.
   Aplicado como classe no <html> (ex.: html.nc-theme-oceano). Cores
   extraídas do protótipo (Ametista é o padrão, sem classe extra). */
html.nc-theme-standard {
  --nc-primary: #2c1a63;
  --nc-primary-rgb: 44, 26, 99;
  --nc-primary-deep: #1a0f3d;
  --nc-primary-glow: #5b2a86;
  --nc-primary-glow-rgb: 91, 42, 134;
  --nc-primary-soft: #eef1f6;
  --nc-primary-border: #d7dce6;
  /* A pedido: fundo de página do tema Standard Natcorp precisa ser
     #fefefe (não usa o --nc-bg "de fábrica" dos outros temas). */
  --nc-bg: #fefefe;
  --nc-muted-bg: #eef0f3;
}
html.nc-theme-lavanda {
  --nc-primary: #6e3c91;
  --nc-primary-rgb: 110, 60, 145;
  --nc-primary-deep: #4a2861;
  --nc-primary-glow: #be6de2;
  --nc-primary-glow-rgb: 190, 109, 226;
  --nc-primary-soft: #e6effd;
  --nc-primary-border: #d6e2f8;
  --nc-bg: #f5f7fc;
  --nc-muted-bg: #eef2fb;
}
html.nc-theme-iris {
  --nc-primary: #511c76;
  --nc-primary-rgb: 81, 28, 118;
  --nc-primary-deep: #35134e;
  --nc-primary-glow: #c95788;
  --nc-primary-glow-rgb: 201, 87, 136;
  --nc-primary-soft: #f3eef7;
  --nc-primary-border: #e8dcee;
  --nc-bg: #f8f6fa;
  --nc-muted-bg: #f3eef7;
}
html.nc-theme-orquidea {
  --nc-primary: #643a7a;
  --nc-primary-rgb: 100, 58, 122;
  --nc-primary-deep: #422650;
  --nc-primary-glow: #c95788;
  --nc-primary-glow-rgb: 201, 87, 136;
  --nc-primary-soft: #eef5f4;
  --nc-primary-border: #d7ebe8;
  --nc-bg: #f6faf9;
  --nc-muted-bg: #eef5f4;
}
html.nc-theme-safira {
  --nc-primary: #2c1a63;
  --nc-primary-rgb: 44, 26, 99;
  --nc-primary-deep: #1a0f3d;
  --nc-primary-glow: #c95788;
  --nc-primary-glow-rgb: 201, 87, 136;
  --nc-primary-soft: #eef0f8;
  --nc-primary-border: #d8ddf0;
  --nc-bg: #f5f6fb;
  --nc-muted-bg: #eef0f8;
}
html.nc-theme-ameixa {
  --nc-primary: #5a214f;
  --nc-primary-rgb: 90, 33, 79;
  --nc-primary-deep: #3c1635;
  --nc-primary-glow: #2a8fa3;
  --nc-primary-glow-rgb: 42, 143, 163;
  --nc-primary-soft: #f5eef4;
  --nc-primary-border: #ecd7e6;
  --nc-bg: #faf6f9;
  --nc-muted-bg: #f5eef4;
}
html.nc-theme-violeta {
  --nc-primary: #511c76;
  --nc-primary-rgb: 81, 28, 118;
  --nc-primary-deep: #35134e;
  --nc-primary-glow: #779a87;
  --nc-primary-glow-rgb: 119, 154, 135;
  --nc-primary-soft: #f1f5f1;
  --nc-primary-border: #dbe8de;
  --nc-bg: #f7faf7;
  --nc-muted-bg: #f1f5f1;
}
html.nc-theme-magenta {
  --nc-primary: #a43e6b;
  --nc-primary-rgb: 164, 62, 107;
  --nc-primary-deep: #6e2948;
  --nc-primary-glow: #511c76;
  --nc-primary-glow-rgb: 81, 28, 118;
  --nc-primary-soft: #f8eff3;
  --nc-primary-border: #ecd4e0;
  --nc-bg: #fbf5f8;
  --nc-muted-bg: #f8eff3;
}
html.nc-theme-berinjela {
  --nc-primary: #4a2348;
  --nc-primary-rgb: 74, 35, 72;
  --nc-primary-deep: #301730;
  --nc-primary-glow: #d56f67;
  --nc-primary-glow-rgb: 213, 111, 103;
  --nc-primary-soft: #f7f0f1;
  --nc-primary-border: #ecd9d7;
  --nc-bg: #faf6f7;
  --nc-muted-bg: #f7f0f1;
}
html.nc-theme-indigo {
  --nc-primary: #39307a;
  --nc-primary-rgb: 57, 48, 122;
  --nc-primary-deep: #251f52;
  --nc-primary-glow: #258e91;
  --nc-primary-glow-rgb: 37, 142, 145;
  --nc-primary-soft: #eef4f5;
  --nc-primary-border: #d7e6e7;
  --nc-bg: #f6f9fa;
  --nc-muted-bg: #eef4f5;
}
html.nc-theme-aurora {
  --nc-primary: #511c76;
  --nc-primary-rgb: 81, 28, 118;
  --nc-primary-deep: #35134e;
  --nc-primary-glow: #c95788;
  --nc-primary-glow-rgb: 201, 87, 136;
  --nc-primary-soft: #f2f3f6;
  --nc-primary-border: #dde0ea;
  --nc-bg: #f7f8fb;
  --nc-muted-bg: #f2f3f6;
}
html.nc-theme-oceano {
  --nc-primary: #1e3a5f;
  --nc-primary-rgb: 30, 58, 95;
  --nc-primary-deep: #14263f;
  --nc-primary-glow: #2c6fa8;
  --nc-primary-glow-rgb: 44, 111, 168;
  --nc-primary-soft: #e5eef7;
  --nc-primary-border: #cfd9e3;
  --nc-bg: #f4f8fb;
  --nc-muted-bg: #e5eef7;
}
html.nc-theme-bordo {
  --nc-primary: #772d3b;
  --nc-primary-rgb: 119, 45, 59;
  --nc-primary-deep: #4f1e27;
  --nc-primary-glow: #b85c70;
  --nc-primary-glow-rgb: 184, 92, 112;
  --nc-primary-soft: #f5ebee;
  --nc-primary-border: #e1cdd3;
  --nc-bg: #faf5f7;
  --nc-muted-bg: #f5ebee;
}

/* ---------- Botão flutuante + janela de escolha de tema ---------- */
/* ---------- Ícone de tema dentro do menu superior ---------- */
html body .nc-theme-navitem .t-Icon.nc-theme-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
html body .nc-theme-navitem .t-Icon.nc-theme-icon svg {
  width: 18px;
  height: 18px;
}
html body .nc-theme-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(43, 34, 51, 0.45);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
html body .nc-theme-modal {
  background: var(--nc-card);
  border-radius: var(--nc-radius-lg);
  padding: 24px 28px;
  width: 1120px;
  max-width: 100%;
  max-height: calc(100vh - 32px);
  overflow-y: auto;
  box-shadow: var(--nc-shadow-md);
  font-family: var(--nc-font);
}
html body .nc-theme-modal h3 {
  margin: 0 0 4px;
  color: var(--nc-ink);
  font-size: 18px;
  font-weight: 700;
}
html body .nc-theme-modal p {
  margin: 0 0 4px;
  color: var(--nc-muted);
  font-size: 13px;
}
html body .nc-theme-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 12px;
  margin-top: 18px;
}
@media (max-width: 1000px) {
  html body .nc-theme-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  html body .nc-theme-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 500px) {
  html body .nc-theme-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 380px) {
  html body .nc-theme-grid { grid-template-columns: 1fr; }
}
html body .nc-theme-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  border: 1px solid var(--nc-border);
  border-radius: var(--nc-radius-lg);
  padding: 14px;
  background: var(--nc-card);
  text-align: left;
  cursor: pointer;
  transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}
html body .nc-theme-card:hover {
  border-color: var(--nc-primary-glow);
  box-shadow: var(--nc-shadow-xs);
}
html body .nc-theme-card.is-selected {
  border-color: var(--nc-primary);
  background: var(--nc-primary-soft);
  box-shadow: var(--nc-shadow-md);
}
html body .nc-theme-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
html body .nc-theme-card-swatches {
  display: flex;
  gap: 5px;
}
html body .nc-theme-card-swatch {
  width: 20px;
  height: 20px;
  border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, 0.1);
}
html body .nc-theme-card-check {
  display: none;
  color: var(--nc-primary);
  flex-shrink: 0;
}
html body .nc-theme-card.is-selected .nc-theme-card-check {
  display: block;
}
html body .nc-theme-card-name {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  color: var(--nc-ink);
}
html body .nc-theme-card-desc {
  margin: 0;
  font-size: 11px;
  line-height: 1.4;
  color: var(--nc-muted);
}
html body .nc-theme-modal-close {
  margin-top: 22px;
  padding: 9px 20px;
  border-radius: var(--nc-radius-md);
  border: 0;
  background: var(--nc-primary);
  color: #fff;
  font-family: var(--nc-font);
  font-weight: 600;
  font-size: 13px;
  cursor: pointer;
  float: right;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
html body .nc-theme-modal-close svg {
  width: 16px;
  height: 16px;
}
html body .nc-theme-modal-close:hover {
  background: var(--nc-primary-deep);
}

/* Fonte padrão forçada pra workspace inteira — exceto ícones, que usam
   fontes especiais onde cada caractere desenha um símbolo, não uma
   letra (Font Awesome, ícones nativos do APEX, jQuery UI, Lucide). */
html body,
html body *:not(.fa):not([class*=" fa-"]):not([class^="fa-"]):not(.a-Icon):not(.t-Icon):not([class*=" icon-"]):not([class^="icon-"]):not(.ui-icon):not([class*="lucide"]):not(.a-TreeView-toggle):not(.a-MenuBar-icon):not(.a-Menu-subMenuCol):not(.a-IG):not(.a-IG *):not(.a-GV):not(.a-GV *):not(.a-GV-columnItemContainer *):not(.u-selector):not([class*="CheckboxLabel"]):not([class*="controlsCheckbox"]):not([class*="RadioLabel"]) {
  font-family: var(--nc-font) !important;
}
/* A pedido: dentro do Interactive Grid, usa nossa fonte customizada
   (só o TIPO da fonte — nada de tamanho, peso, espaçamento ou
   qualquer outra métrica, que continuam 100% nativos do APEX).
   ATENÇÃO/histórico: antes essa regra fazia o oposto (forçava fonte
   NATIVA aqui) porque em algum momento anterior um desalinhamento
   entre a coluna de checkbox e a coluna de dados pareceu estar ligado
   à métrica da fonte. Se esse desalinhamento voltar a aparecer, é só
   avisar que a gente reverte esse trecho pra fonte nativa de novo. */
html body .a-IG,
html body .a-IG * {
  font-family: var(--nc-font) !important;
}

/* ---------- Base ---------- */
body,
.t-Body {
  background-color: var(--nc-bg);
  color: var(--nc-ink);
  font-family: var(--nc-font);
  -webkit-font-smoothing: antialiased;
}

a { color: var(--nc-primary); }
a:hover { color: var(--nc-primary-glow); }
/* Exceção: o menu de filtro de coluna da Interactive Report/Grid
   (Sort Widget) usa links internamente, e nossa regra genérica acima
   estava sobrescrevendo a cor nativa do hover desse menu (pensada
   pra ficar legível no fundo escuro dele) por um roxo claro que
   ficava difícil de ler. Mantém a cor nativa aqui. */
html body .a-IRR-sortWidget a:hover,
html body [class*="sortWidget"] a:hover {
  color: inherit !important;
}

/* ---------- Header (t-Header) ---------- */
.t-Header {
  background: linear-gradient(135deg, var(--nc-primary-deep), var(--nc-primary) 55%, var(--nc-primary-glow));
  border-bottom: 0;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.08), 0 6px 18px rgba(61, 26, 94, 0.18);
}
/* Sem !important de propósito: em ambientes que já têm uma cor fixa
   escrita direto no HTML (inline style, indicador de ambiente
   DEV/TESTE), o inline sempre vence e essa cor customizada é
   respeitada. Em ambientes sem essa marcação, o degradê do tema
   escolhido passa a valer normalmente. */
.t-Header-branding {
  background: linear-gradient(135deg, var(--nc-primary-deep), var(--nc-primary) 55%, var(--nc-primary-glow));
}
/* Menu dinâmico do topo (.t-Header-nav) — parte de baixo da barra,
   onde ficam os itens tipo "Frequência", "Lançamentos", etc. Usa a
   mesma cor sólida do tema pra ficar visualmente unido com a parte de
   cima da barra. */
.t-Header-nav {
  background: var(--nc-primary) !important;
}
.t-Header-nav-list.a-MenuBar {
  background: transparent !important;
}
/* Botões do próprio cabeçalho (Blog, Notificações, usuário logado) —
   usam .t-NavigationBar-item, mas ficam dentro do cabeçalho escuro,
   então só precisam de destaque no hover/foco, sem fundo fixo no
   estado normal. */
html body .t-Header-navBar .t-NavigationBar-item .t-Button--navBar:hover,
html body .t-Header-navBar .t-NavigationBar-item .t-Button--navBar:focus,
html body .t-Header-navBar .t-NavigationBar-item .t-Button--navBar[aria-expanded="true"] {
  background: rgba(255, 255, 255, 0.15) !important;
  color: #fff !important;
}
/* .t-NavigationBar usado DENTRO do conteúdo da página (não no
   cabeçalho) — ex.: menus de abas tipo "Requisições / Dados
   Cadastrais / ...". Usa as MESMAS classes nativas do menu do
   cabeçalho (.t-Button--navBar/.t-Button--header), mas como está
   sobre um fundo claro (não o cabeçalho escuro), precisa de uma cor
   de fundo própria — sem isso, o texto força branco fica ilegível. */
/* Região "LISTA_COLAB" (Dados do Colaborador) — o fundo escuro atrás
   dos botões de navegação também precisa seguir o tema. */
/* Lista de navegação (Requisições/Dados Cadastrais/...) usada em
   regiões tipo "sidebar" — sempre em coluna vertical, um item por
   linha, independente da largura da região que a contém (evita
   quebrar em 2 colunas quando a região é mais larga). */
html body .t-Region .t-NavigationBar {
  display: flex !important;
  flex-direction: column !important;
  max-width: 220px !important;
}
html body .t-Region .t-NavigationBar .t-NavigationBar-item {
  width: 100% !important;
}
html body #LISTA_COLAB {
  background-color: var(--nc-primary) !important;
  border-top-width: 0px !important;
  height: 100% !important;
  box-sizing: border-box !important;
}
html body #LISTA_COLAB .t-Button--navBar {
  background-color: var(--nc-primary) !important;
  color: #fff !important;
}
/* Fecha o vão vazio: a coluna que contém essa lista ainda ocupava a
   largura original do grid (ex.: col-3), mesmo o conteúdo tendo
   encolhido. Usa :has() pra mirar só ESSA coluna específica (não
   qualquer .col-3 do sistema), encolhendo ela e alargando a coluna
   vizinha (a dos dados do colaborador) pra ocupar o espaço sobrando. */
html body .row:has(#LISTA_COLAB) {
  display: flex !important;
  flex-wrap: nowrap !important;
}
html body .row > [class*="col-"]:has(#LISTA_COLAB) {
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: 240px !important;
}
html body .row > [class*="col-"]:has(#LISTA_COLAB) + [class*="col-"] {
  flex: 1 1 0% !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  padding-top: 0 !important;
  margin-top: 0 !important;
}
html body .row > [class*="col-"]:has(#LISTA_COLAB) + [class*="col-"] > * {
  margin-top: 0 !important;
}
html body .t-Region .t-NavigationBar .t-NavigationBar-item .t-Button--navBar,
html body .t-Region .t-NavigationBar .t-NavigationBar-item .t-Button--navBar[aria-expanded="true"],
html body .t-Region .t-NavigationBar .t-NavigationBar-item .t-Button--navBar[aria-expanded="false"],
html body .t-Region .t-NavigationBar .t-NavigationBar-item .t-Button--navBar.is-active {
  background-color: var(--nc-primary) !important;
  background-image: none !important;
  color: #fff !important;
}
html body .t-Region .t-NavigationBar .t-NavigationBar-item .t-Button--navBar:hover {
  background-color: var(--nc-primary-deep) !important;
}
.t-Header-branding,
.t-Header-navBar,
.t-Header-controls,
.t-Header-logo-link,
.t-Header-logo,
.t-Button--header,
.t-NavTabs-link,
.a-MenuBar-label,
.a-MenuBar-item {
  color: #fff !important;
}
/* Foto de perfil padrão (quando não há foto real) — o ícone/avatar de
   fallback usa uma cor roxa fixa do tema nativo, sem relação com
   nosso sistema. Sobrescreve pra seguir o tema escolhido. */
html body .fotoColabSmall,
html body img.fotoColabSmall {
  background: var(--nc-primary) !important;
  color: var(--nc-primary) !important;
}
/* Foto "Média" (tela de detalhes do colaborador) — força um círculo
   perfeito (largura = altura), já que o formato oval vinha de a
   imagem não ser um quadrado perfeito com border-radius:50% em cima. */
html body img.fotoColabMed {
  width: 96px !important;
  height: 96px !important;
  object-fit: cover !important;
  border-radius: 50% !important;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateZ(0) scale(1);
  transform: translateZ(0) scale(1);
  image-rendering: -webkit-optimize-contrast;
  outline: 1px solid transparent;
  box-shadow: 0 0 0 0.5px rgba(0, 0, 0, 0.06);
}
/* Ajuste geral pra imagens de exibição (display_image): deixa o
   TAMANHO natural (sem esticar/cortar) por padrão — a versão
   anterior forçava um quadrado fixo em TODAS elas, o que ficava bom
   pra fotos de perfil arredondadas, mas cortava logos e outras
   imagens não-quadradas. Cada uso específico que precisar de círculo
   perfeito (como fotoColabMed) tem sua própria regra à parte. */
html body img.display_image.apex-item-image {
  max-width: 100% !important;
  height: auto !important;
}
/* Foto de perfil específica (#P1_FOTO) que precisa ser um círculo
   perfeito — usa o ID em vez da classe genérica, pra não afetar
   outras imagens (como logos) que usam a mesma classe. */
html body img#P1_FOTO.display_image {
  width: 120px !important;
  height: 120px !important;
  object-fit: cover !important;
}
/* Menu dinâmico do topo (.a-MenuBar) — item "atual" e hover usavam a
   cor nativa do tema Oracle (roxo fixo do Theme Style), sem nenhuma
   relação com nosso sistema de variáveis. Agora seguem o tema
   escolhido. Força fundo transparente nos itens NÃO atuais, pra
   neutralizar qualquer resquício de cor fixa do tema nativo. */
html body .a-MenuBar-item.a-MenuBar-item:not(.a-Menu--current) > .a-MenuBar-label,
html body .a-MenuBar-item.a-MenuBar-item:not(.a-Menu--current) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}
html body .a-MenuBar-item.a-MenuBar-item:not(.a-Menu--current) > .a-MenuBar-label::before,
html body .a-MenuBar-item.a-MenuBar-item:not(.a-Menu--current) > .a-MenuBar-label::after,
html body .a-MenuBar-item.a-MenuBar-item:not(.a-Menu--current)::before,
html body .a-MenuBar-item.a-MenuBar-item:not(.a-Menu--current)::after {
  background: transparent !important;
  background-color: transparent !important;
}
html body .a-MenuBar-item.a-Menu--current,
html body .a-MenuBar-item.a-Menu--current > .a-MenuBar-label {
  background: var(--nc-primary-glow) !important;
  color: #fff !important;
}
html body .a-MenuBar-label:hover,
html body .a-MenuBar-item:hover > .a-MenuBar-label {
  background: rgba(255, 255, 255, 0.12) !important;
}
html body .a-Menu {
  background: var(--nc-primary) !important;
  border-color: var(--nc-primary-deep) !important;
}
html body .a-Menu-content,
html body .t-NavigationBar-menu .a-Menu-content {
  background: var(--nc-primary) !important;
}
/* Itens desabilitados do menu (ex.: "Reverter Alterações" quando não
   há nada pra reverter) usam uma cor escura pensada pra fundo claro
   — no nosso fundo roxo, ficava quase invisível. */
html body .a-Menu-item.is-disabled,
html body .a-Menu-item[aria-disabled="true"] {
  color: rgba(255, 255, 255, 0.45) !important;
}
html body .a-Menu-item.is-disabled .a-Menu-label,
html body .a-Menu-item[aria-disabled="true"] .a-Menu-label,
html body .a-Menu-item.is-disabled .a-Icon,
html body .a-Menu-item[aria-disabled="true"] .a-Icon {
  color: rgba(255, 255, 255, 0.45) !important;
}
html body .t-NavigationBar-menu a,
html body .t-NavigationBar-menu .a-Menu-label {
  color: #fff !important;
}
html body .t-NavigationBar-menu li:hover > a,
html body .t-NavigationBar-menu a:hover {
  background: var(--nc-primary-deep) !important;
}
html body .a-Menu-item:hover,
html body .a-Menu-item.is-highlighted,
html body .a-Menu-item:focus,
html body .a-Menu-item:focus-within,
html body .a-Menu-item[aria-selected="true"],
html body .a-Menu-item:hover .a-Menu-inner,
html body .a-Menu-item:hover .a-Menu-label,
html body .a-Menu-label:hover,
html body .a-Menu-label:focus,
html body .a-Menu-inner:hover {
  background: var(--nc-primary-deep) !important;
  transition: background-color 0.12s ease !important;
}
html body .a-Menu-item.is-current,
html body .a-Menu-item.is-selected {
  background: var(--nc-primary-deep) !important;
  color: #fff !important;
}
/* Espaço vazio dentro de cada item do submenu (reservado pra ícone de
   submenu, quando não tem submenu fica vazio) — tinha cor de fundo
   própria sobrepondo a do item. Deixa transparente pra sempre mostrar
   a cor de baixo. */
html body .a-Menu-subMenuCol {
  background: transparent !important;
}
/* Item "em foco" automaticamente quando o menu abre (antes de mover o
   mouse) — usa :focus-within, que funciona independente do nome da
   classe que o JavaScript do widget usa pra marcar esse estado. Cobre
   tanto o .a-Menu-item quanto o <li> mais simples usado em alguns
   dropdowns (ex.: menu do usuário). */
html body .t-NavigationBar-menu li:focus-within,
html body .t-NavigationBar-menu li:focus-within > a,
html body .a-Menu li:focus-within,
html body .a-Menu li:focus-within > a,
html body .a-Menu-item:focus-within,
html body .a-Menu-item:focus-within .a-Menu-inner {
  background: var(--nc-primary-deep) !important;
  color: #fff !important;
}
.t-Button--header {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.22);
  border-radius: var(--nc-radius-sm);
}
.t-Button--header:hover { background: rgba(255, 255, 255, 0.2); }

/* ---------- Side navigation (t-TreeNav) ---------- */
.t-Body-nav,
.t-TreeNav {
  background: var(--nc-primary-deep);
}
.t-TreeNav .a-TreeView-content,
.t-TreeNav .a-TreeView-label {
  color: rgba(255, 255, 255, 0.86);
}
.t-TreeNav .a-TreeView-node .a-TreeView-content:hover {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  border-radius: var(--nc-radius-sm);
}
.t-TreeNav .a-TreeView-node.is-current > .a-TreeView-content,
.t-TreeNav .a-TreeView-node.is-current--top > .a-TreeView-content {
  background: var(--nc-primary-glow);
  color: #fff;
  border-radius: var(--nc-radius-sm);
  box-shadow: inset 3px 0 0 rgba(255, 255, 255, 0.5);
}
.t-TreeNav .a-TreeView-content .a-TreeView-icon,
.t-TreeNav .a-TreeView-toggle::before { color: rgba(255, 255, 255, 0.7); }

/* ---------- Regions / cards ---------- */
.t-Region,
.t-Alert,
.t-Card,
.a-IRR-region,
.t-Report,
.t-Region--hideHeader {
  background-color: var(--nc-card);
  border: 1px solid var(--nc-border);
  border-radius: var(--nc-radius);
  box-shadow: var(--nc-shadow);
}
/* A pedido: quando a região tem "Remove UI Decoration" marcado em
   Appearance > Template Options > Style (classe nativa do APEX
   .t-Region--noUI), isso tem que ser respeitado SEMPRE — em
   qualquer aplicação, independente de estar combinado com outras
   opções de template (--removeHeader, --scrollBody etc.). Sem fundo,
   borda, sombra ou cantos arredondados de "card" do nosso skin; a
   região fica como conteúdo cru, do jeito que foi pedido no Page
   Designer. Precisa de mais especificidade (.t-Region + o modificador)
   e !important pra sempre vencer a regra genérica de card acima. */
.t-Region.t-Region--noUI {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
/* Mesma lógica pros Display Items DENTRO de uma região --noUI: o
   nosso CSS de "Somente leitura / Display Only" (mais abaixo) dá a
   qualquer Display Item uma "caixa" de campo — borda e fundo cinza —
   que o APEX nativo não tinha antes das nossas mudanças. Numa região
   sem decoração, esse item normalmente está sendo usado como
   conteúdo solto (um título, uma logo, um texto centralizado), não
   como campo de formulário — então a caixa não deveria aparecer ali.
   Mantém só o alinhamento (flex + width:100%, já corrigido acima). */
.t-Region--noUI .apex-item-display-only,
.t-Region--noUI span.display_only,
.t-Region--noUI .t-Region-body .apex-item-display-only,
.t-Region--noUI .t-Region-body span.display_only {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  color: var(--nc-ink) !important;
}
/* Mesmo caso, agora dentro de um Alert (.t-Alert) usado como banner
   de status (ex.: "Existe pendência de assinatura...") — um Display
   Only ali dentro é só o texto do próprio aviso, não um campo de
   formulário, então também não deveria ganhar a caixa (borda/fundo/
   padding). A cor do texto continua a que o Alert já define (não força
   nc-ink aqui), pra não brigar com a cor de cada tipo de aviso. */
.t-Alert .apex-item-display-only,
.t-Alert span.display_only,
.t-Alert .t-Alert-body .apex-item-display-only,
.t-Alert .t-Alert-body span.display_only {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  font-weight: 700 !important;
  color: var(--nc-ink) !important;
}
/* Toda a cadeia de "embrulhos" entre o Alert e o texto (container >
   row > col > campo) precisa ficar transparente também — senão sobra
   um retângulo com a cor de fundo da PÁGINA por trás do texto, em vez
   da cor cheia do Alert (ex.: o amarelo do warning) aparecer inteira e
   uniforme atrás de tudo. */
.t-Alert .container,
.t-Alert .row,
.t-Alert [class*="col-"],
.t-Alert .t-Form-fieldContainer,
.t-Alert .t-Form-inputContainer,
.t-Alert .t-Form-itemWrapper {
  background: transparent !important;
}
/* Faltava neutralizar 3 camadas ACIMA da cadeia acima: .t-Alert-wrap,
   .t-Alert-content e .t-Alert-body ficam entre a <div class="t-Alert
   ...-colorBG..."> (que o APEX pinta de amarelo/etc. nativamente) e o
   .container de dentro — sem essa transparência aqui, o fundo colorido
   "para" nessas 3 divs e não chega até o texto. Escopado só em Alerts
   com --colorBG (Highlight Background), pra não mexer nos Alerts SEM
   essa opção, que devem continuar com o conteúdo branco de propósito
   (só o ícone/borda coloridos). */
.t-Alert--colorBG .t-Alert-wrap,
.t-Alert--colorBG .t-Alert-content,
.t-Alert--colorBG .t-Alert-body {
  background: transparent !important;
}
/* A região "avó" (nc-stepper-host) é só uma casca estrutural pro
   stepper — sem borda, sombra, fundo ou padding próprios. */
html body .nc-stepper-host {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
html body .nc-stepper-host > .t-Region-bodyWrap > .t-Region-body {
  padding: 0 !important;
}
/* Cada etapa do stepper (a "filha", ex.: Identificação) também vira
   uma casca sem borda/fundo/padding próprios — só o conteúdo dela. */
html body .nc-section {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
}
html body .nc-section > .t-Region-bodyWrap > .t-Region-body {
  padding: 0 !important;
}

/* Duas marcações manuais e simétricas pro cabeçalho de uma região:
   - nc-no-header    -> força ESCONDER (mesmo se o tema mostraria)
   - nc-show-header  -> força MOSTRAR  (mesmo se o tema esconderia,
                         como acontece com Template Options "Remove
                         Header"/"noUI" — .t-Region--removeHeader /
                         .t-Region--noUI)
   Sem marcação nenhuma, vale o comportamento padrão do próprio tema. */
html body .nc-show-header .t-Region-header {
  display: flex !important;
}
html body .nc-no-header .t-Region-header {
  display: none !important;
}
/* A região "avó" (a que leva nc-stepper-host) nunca precisa mostrar o
   próprio cabeçalho — é só uma casca estrutural pro stepper. Escondemos
   automaticamente aqui, sem precisar de mais nenhuma classe além da
   nc-stepper-host que já é obrigatória pro recurso funcionar. */
html body .nc-stepper-host > .t-Region-header {
  display: none !important;
}
/* Qualquer região dentro do Footer da Global Page (Desktop) nunca
   mostra o próprio cabeçalho — automático, sem precisar da classe
   nc-no-header em cada aplicação. O <footer class="t-Footer"> é
   estrutural do próprio tema, sempre presente. */
html body .t-Footer .t-Region-header {
  display: none !important;
}
/* Região de breadcrumb de cada página (fica dentro de .t-Body-title,
   uma área estrutural do próprio tema, diferente do .t-Header/.t-Footer
   da Global Page) nunca mostra o próprio cabeçalho — automático, sem
   precisar de nc-no-header em cada página. */
html body .t-Body-title .t-Region-header {
  display: none !important;
}

html body .t-Region:not(.t-Region--removeHeader):not(.t-Region--noUI) > .t-Region-header {
  display: flex !important;
  align-items: center !important;
  gap: 1.125rem !important;
  background: var(--nc-card) !important;
  border-bottom: 1px solid var(--nc-border) !important;
  border-radius: var(--nc-radius) var(--nc-radius) 0 0 !important;
  padding: 0.3rem 0.75rem !important;
}
html body .t-Region-headerItems--title {
  display: flex !important;
  align-items: center !important;
  gap: 1.25rem !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
}
html body .t-Region-title,
html body .t-Region-headerItems--title .t-Region-title {
  font-family: var(--nc-font) !important;
  color: var(--nc-primary) !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  letter-spacing: normal !important;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nc-native-header__text {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.nc-native-header__subtitle {
  display: block;
  margin-top: 0.15rem;
  font-family: var(--nc-font) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--nc-muted) !important;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.t-Region-body { padding: 0.75rem !important; }

/* Desativa a linha roxa fixa que vem do Natcorp_Style.css
   (.t-Region-headerItems.t-Region-headerItems--title), pra não
   ficar duas linhas roxas coladas no canto da região. */
html body .t-Region-headerItems.t-Region-headerItems--title {
  border-left: none !important;
}
/* A pedido: removida a listra roxa da borda esquerda das regiões —
   agora usa a mesma cor cinza clara das outras bordas, ficando
   consistente em volta toda. */
html body .t-Region:not(.t-Region--noUI) {
  border-left-color: var(--nc-border) !important;
  border-left-width: 1px !important;
}
html body .t-Region-header:not(.t-Region--noUI) {
  border-left-color: var(--nc-border) !important;
  border-left-width: 1px !important;
}

/* Cabeçalho nativo "comum" (fora do stepper) — ícone claro em cima do
   título da região, feito 100% em CSS via ::before (SVG embutido),
   sem JavaScript. Antes isso era montado pelo natcorp.js junto com a
   separação de subtítulo via "Título|Subtítulo" — essa parte do
   subtítulo não é mais suportada (não dá pra "ler" e dividir texto só
   com CSS); o título aparece inteiro, numa linha só, como veio. */
html body .t-Region:not(.nc-section):not(.t-Region--removeHeader):not(.t-Region--noUI) > .t-Region-header .t-Region-headerItems--title::before {
  content: "";
  display: block;
  width: 44px;
  height: 44px;
  border-radius: 10px;
  flex: 0 0 auto;
  background-color: var(--nc-primary-deep);
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 4H6a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-5'/%3E%3Cpath d='M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px 20px;
}

/* Esconde só o cabeçalho da PRÓPRIA etapa (filho direto), nunca o de
   sub-regiões aninhadas mais fundo dentro dela — essas mantêm seu
   próprio cabeçalho normalmente. */
html body .nc-section > .t-Region-header {
  display: none !important;
}

/* Sub-região usada como agrupador de assunto */
.t-Region--scrollBody > .t-Region-bodyWrap > .t-Region-body { padding: 0.75rem 0.9rem; }

/* ---------- Form fields (t-Form-*) — porte literal do arquivo 2 ---------- */
html body .t-Form-fieldContainer,
html body .t-Form-fieldContainer--stacked {
  margin-bottom: 3px !important;
  margin-top: 0 !important;
  padding-bottom: 0 !important;
  padding-top: 0 !important;
}
html body .t-Form-labelContainer {
  margin: 0 !important;
  padding-bottom: 0 !important;
}

html body .t-Form-inputContainer {
  margin: 0 !important;
}
html body .row {
  row-gap: 1px !important;
  margin-bottom: 0 !important;
  margin-top: 0 !important;
}
html body .container {
  padding: 0 !important;
}
html body .t-Form-fieldContainer .col,
html body .t-Form-fieldContainer[class*="col-"] {
  padding-left: 8px !important;
  padding-right: 8px !important;
}
/* Label ao lado do campo (não flutuante, ex.: layout "Optional"/
   "Required" com label à esquerda) — empurra o label um pouco pra
   baixo (padding-top), aproximando do centro vertical do campo
   (altura padrão 44px), sem mexer no display/flex da linha (isso
   desalinhava o espaçamento nativo das colunas nas duas tentativas
   anteriores). */
html body .t-Form-fieldContainer:not(.t-Form-fieldContainer--floatingLabel) > .t-Form-labelContainer[class*="col-"] {
  padding-top: 12px !important;
}
html body .t-Form-fieldContainer .t-Form-label,
html body .t-Form-fieldContainer label,
html body label.t-Form-label {
  font-family: var(--nc-font) !important;
  font-size: 10.2px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.025em !important;
  color: #9691a0 !important;
  color: color-mix(in srgb, var(--nc-muted) 70%, white) !important;
  margin-bottom: 2px !important;
  line-height: 1.3 !important;
  display: block !important;
}
html body .t-Form-fieldContainer.is-required .t-Form-label::after,
html body .t-Form-fieldContainer .t-Form-label .a-Icon.icon-asterisk,
html body .apex-item-icon-required {
  color: var(--nc-destructive) !important;
}
html body .t-Form-fieldContainer .t-Form-itemText--inlineHelp,
html body .apex-item-wrapper .t-Form-inlineHelp,
html body .t-Form-helpText {
  font-size: 1rem !important;
  color: var(--nc-muted-fg) !important;
}

/* Itens de formulário — texto, número, e-mail, telefone, senha,
   datepicker, popup LOV, color picker, select, textarea */
html body input.text_field:not(#P9999_SEARCH):not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input.apex-item-text:not(#P9999_SEARCH):not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input[type="text"].apex-item-text:not(#P9999_SEARCH):not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input[type="email"]:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input[type="tel"]:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input[type="number"]:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input[type="password"]:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input.apex-item-datepicker:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input.apex-item-popup-lov:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input.apex-item-color-picker:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body select.selectlist:not([multiple]):not(.a-GV *):not(.a-GV-columnItemContainer *),
html body select.apex-item-select:not([multiple]):not(.a-GV *):not(.a-GV-columnItemContainer *),
html body .apex-item-select:not([multiple]):not(.a-GV *):not(.a-GV-columnItemContainer *),
html body .a-Button.a-Button--calendar + input:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body .apex-item-group--popup-lov input:not(.a-GV *):not(.a-GV-columnItemContainer *) {
  -webkit-appearance: none !important;
  appearance: none !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 44px !important;
  height: 44px !important;
  padding: 0 12px !important;
  font-family: var(--nc-font) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 42px !important;
  color: var(--nc-muted-fg) !important;
  background-color: var(--nc-card) !important;
  background-image: none !important;
  border: 1px solid var(--nc-input) !important;
  border-radius: var(--nc-radius-md) !important;
  box-shadow: var(--nc-shadow-xs);
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    background-color 0.15s ease !important;
}
/* A pedido: textarea foi REVERTIDO pro padrão nativo do APEX (sem
   nenhuma altura/resize/padding customizados nossos) — o resize
   nativo estava sendo bloqueado por algum script da própria
   aplicação, e nossas tentativas de contornar isso via CSS/JS não
   resolveram, então preferimos não mexer nisso e deixar 100% no
   comportamento original do Apex. */

/* Campos com label "Floating" (.t-Form-fieldContainer--floatingLabel)
   — o label fica flutuando em cima, então o valor precisa ficar
   "grudado" na parte de baixo da caixa, sem padding inferior, senão
   o label sobrepõe o texto digitado. Caixa mais alta pra sobrar
   espaço em cima pro label. */
html body .t-Form-fieldContainer--floatingLabel input.apex-item-text:not(#nc-fake-id):not(.a-GV *):not(.a-GV-columnItemContainer *),
html body .t-Form-fieldContainer--floatingLabel input[type="text"]:not(#nc-fake-id):not(.a-GV *):not(.a-GV-columnItemContainer *),
html body .t-Form-fieldContainer--floatingLabel input[type="email"]:not(#nc-fake-id):not(.a-GV *):not(.a-GV-columnItemContainer *),
html body .t-Form-fieldContainer--floatingLabel input[type="tel"]:not(#nc-fake-id):not(.a-GV *):not(.a-GV-columnItemContainer *),
html body .t-Form-fieldContainer--floatingLabel input[type="number"]:not(#nc-fake-id):not(.a-GV *):not(.a-GV-columnItemContainer *),
html body .t-Form-fieldContainer--floatingLabel input.apex-item-datepicker:not(#nc-fake-id):not(.a-GV *):not(.a-GV-columnItemContainer *),
html body .t-Form-fieldContainer--floatingLabel input.apex-item-popup-lov:not(#nc-fake-id):not(.a-GV *):not(.a-GV-columnItemContainer *) {
  height: 44px !important;
  min-height: 44px !important;
  padding: 20px 12px 2px !important;
  line-height: 1 !important;
}
html body .t-Form-fieldContainer--floatingLabel input.number_field:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body .t-Form-fieldContainer--floatingLabel input.text_field:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body .t-Form-fieldContainer--floatingLabel .apex-item-wrapper[class*="clockpicker"] input[type="text"]:not(.a-GV *):not(.a-GV-columnItemContainer *) {
  height: 44px !important;
  min-height: 44px !important;
  padding: 20px 12px 2px !important;
  line-height: 1 !important;
}
/* Pega qualquer OUTRO tipo de campo de texto do APEX dentro de um
   floating label que não esteja explicitamente listado acima (ex.:
   itens mais novos, variações de máscara, etc.) — garante o mesmo
   alinhamento embaixo pra qualquer campo de texto/número/data. */
html body .t-Form-fieldContainer--floatingLabel input[type="text"]:not(.a-GV *):not(.a-GV-columnItemContainer *):not(#nc-fake-id),
html body .t-Form-fieldContainer--floatingLabel input[type="search"]:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body .t-Form-fieldContainer--floatingLabel input[type="url"]:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body .t-Form-fieldContainer--floatingLabel input.apex-item-text:not(.a-GV *):not(.a-GV-columnItemContainer *) {
  height: 44px !important;
  min-height: 44px !important;
  padding: 20px 12px 2px !important;
  line-height: 1 !important;
}
/* Exceção: campo de código de verificação (tela de Token) — o
   label desse campo vem vazio (sem texto), então não precisa
   reservar espaço de floating label lá em cima. A regra genérica de
   campo de texto (font-size: 14px !important) vencia até a fonte
   nativa gigante desse campo específico — aqui, o seletor por ID
   tem especificidade maior e consegue restaurar o tamanho grande.
   Centraliza o número dentro do campo (mantendo nosso visual
   arredondado), sem cortar. */
html body input#P2_VERIFICATION_CODE#P2_VERIFICATION_CODE.text_field.apex-item-text {
  height: 80px !important;
  min-height: 80px !important;
  box-sizing: border-box !important;
  padding: 0 !important;
  line-height: 80px !important;
  text-align: center !important;
  font-size: 40px !important;
  letter-spacing: 12px !important;
}
/* <select> não segue padding + line-height do mesmo jeito que
   <input> pra empurrar o texto pra baixo — o navegador centraliza o
   conteúdo dele verticalmente na altura disponível, ignorando boa
   parte disso. Em vez de padding-top grande + line-height:1 (que
   funciona pra input mas não pra select), usa padding-bottom maior
   que o padding-top — a diferença entre os dois "empurra" o texto
   pra mais perto da borda de baixo, aproximando do efeito do input. */
html body .t-Form-fieldContainer--floatingLabel select.apex-item-select:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body .t-Form-fieldContainer--floatingLabel select.selectlist:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body .t-Form-fieldContainer--floatingLabel select.apex-item-multi:not(.a-GV *):not(.a-GV-columnItemContainer *) {
  height: 44px !important;
  min-height: 44px !important;
  padding: 22px 36px 2px 12px !important;
  line-height: normal !important;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2377707f' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 15 5 5 5-5'/%3E%3Cpath d='m7 9 5-5 5 5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 10px center !important;
  background-size: 16px 16px !important;
}
html body .t-Form-fieldContainer--floatingLabel textarea.apex-item-textarea,
html body .t-Form-fieldContainer--floatingLabel textarea.textarea {
  padding: 20px 12px 2px !important;
}
html body .t-Form-fieldContainer--floatingLabel .select2-container--default .select2-selection--single {
  height: 44px !important;
  padding-top: 20px !important;
}
html body .t-Form-fieldContainer--floatingLabel .select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 1 !important;
}
html body .t-Form-fieldContainer--floatingLabel ul.apex-item-multi {
  align-items: flex-end !important;
  padding: 20px 10px 2px !important;
}
/* Radio Group (toggle segmentado Sim/Não etc.) dentro de floating
   label — empurra só o grupo em si pra baixo (margin-top), sem mexer
   no wrapper que também contém o label flutuante. */
html body .t-Form-fieldContainer--floatingLabel .apex-item-group--rc.apex-item-radio {
  margin-top: 20px !important;
}
html body .t-Form-fieldContainer--floatingLabel .apex-item-display-only,
html body .t-Form-fieldContainer--floatingLabel span.display_only {
  align-items: flex-end !important;
  padding: 20px 12px 2px !important;
}
/* Reforço universal (não depende de ID, vale pra qualquer aplicação):
   Popup LOV é sempre readonly, e essa combinação de atributo+classe,
   repetida, ganha força extra pra vencer a regra genérica de campo. */
html body .t-Form-fieldContainer--floatingLabel input[readonly].apex-item-popup-lov.apex-item-popup-lov:not(#nc-fake-id) {
  height: 44px !important;
  min-height: 44px !important;
  padding: 20px 12px 2px !important;
  line-height: 1 !important;
}

/* Campos com ícone nativo do APEX (classe apex-item-has-icon, ex.: os
   campos de Usuário/Senha da tela de login) — precisam de mais espaço
   à esquerda pro texto/placeholder não ficar embaixo do ícone.
   Especificidade reforçada (classe dupla + truque :not(#nc-fake-id),
   igual usado nas regras de label flutuante) pra empatar/vencer a
   regra base de normalização de campo (que usa :not(#P9999_SEARCH) e
   por isso já carrega especificidade de ID). */
html body input.apex-item-text.apex-item-has-icon.apex-item-has-icon:not(#nc-fake-id),
html body input[type="text"].apex-item-has-icon.apex-item-has-icon:not(#nc-fake-id),
html body input[type="password"].apex-item-has-icon.apex-item-has-icon:not(#nc-fake-id),
html body input.apex-item-has-icon.apex-item-has-icon:not(#nc-fake-id) {
  padding-left: 40px !important;
}
/* Reforço extra específico pra tela de login (.t-Login-body), com
   especificidade bem acima de qualquer regra genérica de campo.
   Vale para qualquer página da família login (900, 901 - Alterar Senha,
   etc.), já que todas usam o mesmo template .t-Login-body. */
html body .t-Login-body input.apex-item-text.apex-item-has-icon.apex-item-has-icon:not(#nc-fake-id),
html body .t-Login-body input.apex-item-has-icon.apex-item-has-icon:not(#nc-fake-id) {
  padding-left: 38px !important;
  padding-right: 12px !important;
}
html body #P900_USUARIO {
  padding-left: 38px !important;
}
html body #P900_SENHA {
  padding-left: 38px !important;
}
html body #P900_EMPRESA {
  padding-left: 38px !important;
}
html body #P900_MATRICULA {
  padding-left: 38px !important;
}
html body #P900_EMAIL {
  padding-left: 38px !important;
}
html body .apex-item-icon {
  z-index: 1;
}

/* Restaura o ícone nativo de calendário em <input type="date"> — o
   appearance:none da regra acima também pegava esses campos (mesma
   classe apex-item-text) e escondia o ícone do navegador. */
html body input[type="date"],
html body input[type="time"],
html body input[type="datetime-local"] {
  -webkit-appearance: auto !important;
  appearance: auto !important;
}
html body input[type="date"]::-webkit-calendar-picker-indicator,
html body input[type="time"]::-webkit-calendar-picker-indicator,
html body input[type="datetime-local"]::-webkit-calendar-picker-indicator {
  opacity: 1 !important;
  cursor: pointer !important;
}
/* Universal: QUALQUER input ou textarea do sistema (não importa o
   tipo de item nem a classe) tem que mostrar o placeholder com a
   mesma cor legível, com opacidade 100% — antes só cobria
   apex-item-text/textarea, deixando passar Popup LOV, datepicker,
   color picker, multi-item etc., que caíam no padrão fraco do
   navegador. Campos com regra própria mais específica (ex.: o campo
   de busca do filtro de coluna, mais abaixo no arquivo) continuam
   podendo se sobrepor normalmente. */
html body input::placeholder,
html body textarea::placeholder {
  color: var(--nc-muted-fg) !important;
  opacity: 1 !important;
}

/* Foco — anel ametista idêntico ao protótipo. Escopado pra fora do
   Interactive Grid (:not(.a-GV *)) pra garantir que o foco/edição
   dentro da grid continue 100% nativo do APEX. */
html body input.apex-item-text:focus:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input[type="text"]:focus:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input[type="email"]:focus:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input[type="tel"]:focus:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input[type="number"]:focus:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input[type="password"]:focus:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input.apex-item-datepicker:focus:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input.apex-item-popup-lov:focus:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body select.apex-item-select:focus:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body select.selectlist:focus:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body textarea.apex-item-textarea:focus:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body textarea.textarea:focus:not(.a-GV *):not(.a-GV-columnItemContainer *) {
  outline: none !important;
  border-color: var(--nc-ring) !important;
  box-shadow:
    0 0 0 3px rgba(var(--nc-primary-glow-rgb), 0.28),
    var(--nc-shadow-xs) !important;
  background-color: var(--nc-card) !important;
}

/* Somente leitura / desabilitado — escopado pra fora do Interactive
   Grid, senão um estado transitório de "disabled/readonly" que a
   própria grid usa internamente durante a ativação da edição podia
   acabar pegando nosso visual/comportamento em vez do nativo. */
html body input.apex-item-text[readonly]:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input.apex-item-text[disabled]:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input.apex-item-text.apex_disabled:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body textarea.apex-item-textarea[readonly]:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body textarea.apex-item-textarea.apex_disabled:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body select.apex-item-select[disabled]:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body select.apex-item-select.apex_disabled:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body .apex-item-display-only:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body span.display_only:not(.a-GV *):not(.a-GV-columnItemContainer *) {
  background-color: var(--nc-muted-bg) !important;
  color: var(--nc-muted-fg) !important;
  border-color: var(--nc-border) !important;
  box-shadow: none !important;
  cursor: default !important;
  font-family: var(--nc-font) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}
/* A pedido: no tema Standard Natcorp especificamente, todo item
   desativado (Disabled/readonly) — incluindo os Display Items — usa
   um fundo levemente diferente do resto (#fafafa), em vez do
   --nc-muted-bg padrão usado nos demais temas. Mesma lista de
   seletores da regra "Somente leitura / desabilitado" acima, só que
   com prefixo do tema. */
html.nc-theme-standard body input.apex-item-text[readonly]:not(.a-GV *):not(.a-GV-columnItemContainer *),
html.nc-theme-standard body input.apex-item-text[disabled]:not(.a-GV *):not(.a-GV-columnItemContainer *),
html.nc-theme-standard body input.apex-item-text.apex_disabled:not(.a-GV *):not(.a-GV-columnItemContainer *),
html.nc-theme-standard body textarea.apex-item-textarea[readonly]:not(.a-GV *):not(.a-GV-columnItemContainer *),
html.nc-theme-standard body textarea.apex-item-textarea.apex_disabled:not(.a-GV *):not(.a-GV-columnItemContainer *),
html.nc-theme-standard body select.apex-item-select[disabled]:not(.a-GV *):not(.a-GV-columnItemContainer *),
html.nc-theme-standard body select.apex-item-select.apex_disabled:not(.a-GV *):not(.a-GV-columnItemContainer *),
html.nc-theme-standard body .apex-item-display-only:not(.a-GV *):not(.a-GV-columnItemContainer *),
html.nc-theme-standard body span.display_only:not(.a-GV *):not(.a-GV-columnItemContainer *) {
  background-color: #fafafa !important;
}
/* Display Only usa <span>, que não tem caixa/altura de campo por
   padrão como um <input> tem — replica a caixa inteira do Text Item
   (altura, padding, borda, cantos) pra ficar uma cópia visual completa.
   Exceção: quando o conteúdo tem HTML rico (parágrafos <p>, como uma
   descrição/comentário formatado), NÃO usa flex — isso forçava todo
   o texto (incluindo os parágrafos) pra uma linha só, ignorando as
   quebras naturais. Nesses casos, mantém o empilhamento normal de
   bloco, só ajustando largura/borda/padding pra ficar consistente
   visualmente com os outros campos. */
html body .apex-item-display-only:not(:has(p)),
html body span.display_only:not(:has(p)) {
  display: flex !important;
  align-items: center !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 44px !important;
  padding: 10px 12px !important;
  border: 1px solid var(--nc-border) !important;
  border-radius: var(--nc-radius-md) !important;
}
/* Corrige o alinhamento de texto (ex.: <center>, ou qualquer outra tag
   com text-align próprio) que o desenvolvedor coloca DENTRO do valor
   de um Display Only. Sem isto, o filho direto encolhe pro tamanho do
   próprio conteúdo (comportamento padrão de item flex) e fica sempre
   "colado" à esquerda da caixa, mesmo com <center> — o texto continua
   centralizado dentro da tag, só que a tag em si não ocupa a largura
   toda, então visualmente parece que o alinhamento não fez efeito.
   Isso NÃO muda nada nos Display Items comuns (texto puro, sem tag),
   que continuam alinhados à esquerda como sempre. */
html body .apex-item-display-only:not(:has(p)) > *,
html body span.display_only:not(:has(p)) > * {
  width: 100% !important;
}
html body .apex-item-display-only:has(p),
html body span.display_only:has(p) {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 44px !important;
  height: auto !important;
  padding: 10px 12px !important;
  border: 1px solid var(--nc-border) !important;
  border-radius: var(--nc-radius-md) !important;
}
html body .apex-item-display-only:has(p) p {
  margin: 0 0 10px !important;
}
html body .apex-item-display-only:has(p) p:last-child {
  margin-bottom: 0 !important;
}

/* Clock Picker (plugin de.danielh.clockpicker) — o <input> dele não
   tem nenhuma classe nossa (apex-item-text), então mira o wrapper do
   plugin. Só layout, mesma caixa do Text Item (altura, padding, borda,
   fonte). Padding horizontal bem menor (4px em vez de 12px) porque
   esse campo é usado em grades de colunas bem estreitas (ex.: linha
   "Hora Abono" com posições 1 a 10) — com 12px de cada lado, o valor
   selecionado ("12:10") ficava cortado, sem espaço pra caber.
   Reforçado com :not(#nc-fake-id) pra empatar/vencer a regra base de
   normalização de campo (que usa o truque :not(#P9999_SEARCH) e por
   isso carrega especificidade de ID — mesmo bug já corrigido em
   outros pontos do arquivo, ex.: seta do select, ícones de login). */
html body .apex-item-wrapper[class*="clockpicker"] input[type="text"]:not(#nc-fake-id) {
  -webkit-appearance: none !important;
  appearance: none !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 44px !important;
  height: 44px !important;
  padding: 0 4px !important;
  font-family: var(--nc-font) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 42px !important;
  text-align: center !important;
  color: var(--nc-muted-fg) !important;
  background-color: var(--nc-card) !important;
  border: 1px solid var(--nc-input) !important;
  border-radius: var(--nc-radius-md) !important;
  box-shadow: var(--nc-shadow-xs) !important;
}
html body .apex-item-wrapper[class*="clockpicker"] input[type="text"]:focus {
  outline: none !important;
  border-color: var(--nc-ring) !important;
  box-shadow: 0 0 0 3px rgba(var(--nc-primary-glow-rgb), 0.28) !important;
}

/* Select "Justificativa" (P33_COD_JUSTIFICATIVA_1..10) dentro do
   diálogo Abono Coletivo (#ABNC) — mesma grade estreita de 10 colunas
   da linha "Hora Abono" (Clock Picker, acima). Com o padding padrão
   (12px de cada lado + mais 36px reservados pra seta customizada) e
   fonte de 14px, o código da justificativa selecionada não cabia
   nessa coluna estreita e ficava escondido/cortado. Reduz padding e
   fonte só nesses selects específicos do diálogo (mira pelo prefixo
   do id, escopado a "#ABNC" — nenhum outro select do sistema é
   afetado). O ID de "#ABNC" já garante especificidade maior que a
   regra base de normalização de campo e a da seta customizada do
   select (reforçado com :not(#nc-fake-id), no mesmo padrão do resto
   do arquivo). */
#ABNC select[id^="P33_COD_JUSTIFICATIVA_"]:not(#nc-fake-id) {
  padding: 0 18px 0 4px !important;
  font-size: 11px !important;
  background-position: right 3px center !important;
  background-size: 11px 11px !important;
}
/* A pedido: a fonte reduzida acima é só pra caixa fechada (o valor já
   selecionado, que precisa caber na coluna estreita). A LISTA de
   opções que abre ao clicar no select é outro elemento (o próprio
   navegador desenha o dropdown) e pode ter seu próprio font-size sem
   afetar a caixa — aqui ela volta pro tamanho normal (14px, igual aos
   demais campos), só pra ficar fácil de ler ao escolher a
   justificativa. */
#ABNC select[id^="P33_COD_JUSTIFICATIVA_"]:not(#nc-fake-id) option {
  font-size: 14px !important;
}

/* Campos "Jornada" (P33_JORNADA_1..10, Display Only) dentro do diálogo
   Abono Coletivo (#ABNC) — mesma linha/grade estreita do Clock Picker
   e da Justificativa. A pedido, iguala a caixa desses campos à caixa
   do Clock Picker (mesmo padding, fonte e texto centralizado), já que
   antes usavam o padding/fonte padrão de Display Only (maior) e
   ficavam visualmente diferentes dos vizinhos na mesma grade. */
#ABNC span[id^="P33_JORNADA_"].display_only:not(#nc-fake-id) {
  padding: 0 4px !important;
  font-size: 12px !important;
  text-align: center !important;
  justify-content: center !important;
}

/* File Browse — 100% nativo do APEX (sem nenhum layout, arredondado
   ou reposicionamento customizado). Só a cor do tema (no quadradinho
   da pastinha) e o hover seguem nosso padrão visual. */
html body .apex-item-group--file:hover {
  border-color: var(--nc-primary-glow) !important;
  box-shadow: 0 0 0 3px rgba(var(--nc-primary-glow-rgb), 0.2) !important;
}
html body .apex-item-file-dropzone-icon {
  background-color: var(--nc-primary) !important;
  color: #fff !important;
}
/* Hero Region (Static Content) — mesma fonte e cor padrão dos itens,
   sem mexer no tamanho. */
html body .t-HeroRegion-title {
  font-family: var(--nc-font) !important;
  color: var(--nc-fg) !important;
}

/* Select List — seta customizada do protótipo.
   CORRIGIDO: a regra base de normalização (bem acima, a que tira o
   "appearance" nativo de todos os campos) já força background-image:
   none !important no mesmo seletor, só que com ":not(.a-GV *):not(.a-
   GV-columnItemContainer *)" a mais — isso deixava ela mais específica
   e vencia, apagando a seta em qualquer select FORA de Floating Label
   (que tem uma classe extra e por isso escapava do problema). Repete
   aqui os mesmos ":not()" pra empatar em especificidade — como essa
   regra vem DEPOIS no arquivo, empate = ela vence, e a seta volta a
   aparecer em qualquer select comum. */
html body select.apex-item-select:not([multiple]):not(.a-GV *):not(.a-GV-columnItemContainer *),
html body select.selectlist:not([multiple]):not(.a-GV *):not(.a-GV-columnItemContainer *) {
  padding-right: 36px !important;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2377707f' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 15 5 5 5-5'/%3E%3Cpath d='m7 9 5-5 5 5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 10px center !important;
  background-size: 16px 16px !important;
  cursor: pointer !important;
}
html body select.apex-item-select::-ms-expand {
  display: none !important;
}

/* Select2 (plugin) — o <select> real fica escondido; quem aparece é o
   .select2-container. Estilizando pra ficar igual aos demais campos. */
html body .select2-container {
  width: 100% !important;
  font-family: var(--nc-font) !important;
}
html body .select2-container--default .select2-selection--single {
  height: 44px !important;
  padding: 0 36px 0 12px !important;
  border: 1px solid var(--nc-input) !important;
  border-radius: var(--nc-radius-md) !important;
  background-color: var(--nc-card) !important;
  box-shadow: var(--nc-shadow-xs);
  display: flex !important;
  align-items: center !important;
}
html body .select2-container--disabled .select2-selection--single {
  background-color: var(--nc-muted-bg) !important;
  border-color: var(--nc-border) !important;
  box-shadow: none !important;
  cursor: default !important;
}
html body .select2-container--disabled .select2-selection--single .select2-selection__rendered {
  color: var(--nc-muted-fg) !important;
}
html body .select2-container--disabled .select2-selection--single .select2-selection__arrow {
  opacity: 0.5 !important;
}
html body .select2-container--default .select2-selection--single .select2-selection__rendered {
  padding: 0 !important;
  line-height: normal !important;
  font-family: var(--nc-font) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--nc-muted-fg) !important;
}
html body .select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: var(--nc-muted-fg) !important;
}
/* Seta customizada, igual ao select nativo */
html body .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 100% !important;
  top: 0 !important;
  right: 10px !important;
  width: 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
html body .select2-container--default .select2-selection--single .select2-selection__arrow b {
  display: none !important;
}
html body .select2-container--default .select2-selection--single .select2-selection__arrow::after {
  content: "" !important;
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2377707f' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 15 5 5 5-5'/%3E%3Cpath d='m7 9 5-5 5 5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}
/* Estado aberto/foco — mesmo anel ametista dos outros campos */
html body .select2-container--default.select2-container--open .select2-selection--single,
html body .select2-container--default.select2-container--focus .select2-selection--single {
  border-color: var(--nc-ring) !important;
  box-shadow:
    0 0 0 3px rgba(var(--nc-primary-glow-rgb), 0.28),
    var(--nc-shadow-xs) !important;
}
/* Painel de opções */
html body .select2-dropdown {
  border: 1px solid var(--nc-border) !important;
  border-radius: var(--nc-radius-lg) !important;
  box-shadow: var(--nc-shadow-md);
  overflow: hidden !important;
}
html body .select2-search--dropdown {
  padding: 8px !important;
}
html body .select2-search--dropdown .select2-search__field {
  height: 40px !important;
  padding: 0 10px !important;
  font-size: 1rem !important;
  font-family: var(--nc-font) !important;
  border: 1px solid var(--nc-input) !important;
  border-radius: var(--nc-radius-sm) !important;
  outline: none !important;
}
html body .select2-search--dropdown .select2-search__field:focus {
  border-color: var(--nc-ring) !important;
}
html body .select2-results__option {
  padding: 10px 14px !important;
  font-family: var(--nc-font) !important;
  font-size: 14px !important;
  color: var(--nc-fg) !important;
}
html body .select2-container--default .select2-results__option--highlighted[aria-selected] {
  background: var(--nc-primary-soft) !important;
  color: var(--nc-primary-deep) !important;
}
html body .select2-container--default .select2-results__option[aria-selected="true"] {
  background: var(--nc-primary) !important;
  color: #ffffff !important;
}

/* Botão de ajuda ao lado do item (ícone "?") */
/* Garante que o botão de ajuda sempre fique do lado direito do item,
   mesmo em campos "complexos" (radio group, popup LOV, etc.) cujo
   conteúdo interno é um <div> em bloco e empurraria o botão pra uma
   linha separada. Aplica nos dois níveis possíveis (itemWrapper e
   inputContainer), porque a posição do botão varia conforme o tipo
   de item. */
html body .t-Form-itemWrapper,
html body .t-Form-inputContainer {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  position: relative !important;
}
/* itemWrapper (ícone + campo, ex.: usuário/senha da tela de login)
   precisa ficar SEMPRE numa linha só — o campo tem width:100%
   forçado, então com wrap habilitado aqui o ícone não cabia mais do
   lado e quebrava pra cima do campo. */
html body .t-Form-itemWrapper {
  flex-wrap: nowrap !important;
}
/* inputContainer (campo + botão de ajuda + mensagem de erro) precisa
   de wrap pra mensagem de validação poder cair pra própria linha. */
html body .t-Form-inputContainer {
  flex-wrap: wrap !important;
}
html body .t-Form-itemWrapper > *:not(.t-Form-helpButton):not(.js-resize-sensor):not(img):not(.a-Form-error),
html body .t-Form-inputContainer > *:not(.t-Form-helpButton):not(.js-resize-sensor):not(img):not(.a-Form-error) {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}
/* Mensagem de validação (obrigatório, formato inválido etc.) — no Apex
   nativo ela sempre cai pra linha de baixo do campo. Como o
   inputContainer/itemWrapper viraram flex (regra acima, pro botão de
   ajuda ficar do lado do item), a mensagem de erro virava só mais um
   item flexível na MESMA linha do campo, espremendo tudo e cortando
   labels. Forçando ela a ocupar 100% da largura, ela sempre "quebra"
   pra própria linha, embaixo do campo — igual ao nativo. */
html body .t-Form-itemWrapper > .a-Form-error,
html body .t-Form-inputContainer > .a-Form-error {
  flex: 1 1 100% !important;
  min-width: 100% !important;
}
/* Imagens (display_image) não devem virar "item flexível esticável"
   como os campos de formulário — mantém proporção natural, só
   limitando pra nunca ultrapassar a largura do container. */
html body .t-Form-itemWrapper > img,
html body .t-Form-inputContainer > img {
  flex: 0 1 auto !important;
  max-width: 100% !important;
  height: auto !important;
  min-width: 0 !important;
}
/* Sensor de redimensionamento (utilitário invisível de bibliotecas como
   Select2/multi-value) — nunca deve crescer nem ocupar espaço visível
   DENTRO de um campo de formulário flexível. Nossa regra de flex:1
   acima estava "inflando" ele sem querer.
   IMPORTANTE: o Interactive Grid usa esse MESMO elemento/classe
   (.js-resize-sensor) internamente pra detectar quando o container
   muda de tamanho e recalcular a largura responsiva das colunas — ele
   precisa ocupar 100% do espaço do pai (via inset:0, no estilo inline
   do próprio APEX) pra esse cálculo funcionar. Zerar width/height dele
   também dentro da grid quebrava essa detecção: o cabeçalho (que é
   posicionado por fora) continuava responsivo, mas o conteúdo/colunas
   da grid ficavam "congelados" na largura calculada na primeira
   renderização, cortando ao meio em vez de acompanhar o
   redimensionamento. Por isso, escopado pra fora do Interactive Grid
   (:not(.a-IG *)). */
html body .js-resize-sensor:not(.a-IG *) {
  flex: 0 0 0 !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
  visibility: hidden !important;
}
html body .t-Form-helpButton {
  margin-left: auto !important;
  flex: 0 0 auto !important;
}
html body .t-Form-helpButton {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--nc-muted) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 1 !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}
html body .t-Form-helpButton:disabled,
html body .t-Form-helpButton[disabled] {
  background: transparent !important;
  border: 0 !important;
  color: var(--nc-muted) !important;
  opacity: 0.55 !important;
  cursor: default !important;
}
html body .t-Form-helpButton .a-Icon,
html body .t-Form-helpButton .a-Icon::before {
  font-size: 16px !important;
  width: auto !important;
  height: auto !important;
}
html body .t-Form-helpButton:hover {
  background: var(--nc-primary-soft) !important;
  color: var(--nc-primary) !important;
}
/* Reposiciona visualmente o botão de ajuda pro lado do campo, sem
   mover ele de verdade no HTML (CSS não move elemento de um contêiner
   pai pro outro) — usamos position:absolute pra "fingir" que ele está
   lá, calculado pra pousar próximo de onde o campo começa. É uma
   aproximação: pode não encaixar perfeitamente em todo tipo de layout
   de campo (labels com texto de 2 linhas, floating label, etc.),
   diferente da versão em JavaScript que sempre acerta o lugar certo. */
html body .t-Form-fieldContainer {
  position: relative !important;
}
html body .t-Form-labelContainer > .t-Form-helpButton {
  position: absolute !important;
  top: 20px !important;
  right: 4px !important;
  z-index: 2 !important;
  margin: 0 !important;
}

/* Popup LOV com múltiplos valores (mostra as seleções como "tags") —
   o campo visual de verdade é o <ul class="apex-item-multi">, não o
   <input> de busca escondido dentro do <li>. Sem isso, o input interno
   herdava a borda/fundo genérica de campo e sobrava como um quadrado
   vazio do lado das tags. */
html body ul.apex-item-multi {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  min-width: 0 !important;
  flex: 1 1 0 !important;
  gap: 6px !important;
  min-height: 44px !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 6px 10px !important;
  margin: 0 !important;
  list-style: none !important;
  box-sizing: border-box !important;
  background-color: var(--nc-card) !important;
  border: 1px solid var(--nc-input) !important;
  border-radius: var(--nc-radius-md) !important;
  box-shadow: var(--nc-shadow-xs);
}
html body ul.apex-item-multi .apex-item-multi-item {
  display: flex !important;
  align-items: center !important;
  max-width: 100% !important;
}
/* Tags como texto simples (sem virar "pilulazinha" colorida) — mesmo
   visual limpo do popup LOV de valor único. */
html body ul.apex-item-multi .apex-item-multi-item > span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  color: var(--nc-fg) !important;
  font-family: var(--nc-font) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}
html body ul.apex-item-multi .apex-item-multi-item:not(:last-child) > span::after {
  content: ",";
  color: var(--nc-muted);
}
html body .apex-item-multi-remove {
  background: transparent !important;
  border: 0 !important;
  color: var(--nc-muted) !important;
  cursor: pointer !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
}
html body .apex-item-multi-remove:hover {
  color: var(--nc-destructive) !important;
}
html body .apex-item-multi-remove .a-Icon {
  font-size: 12px !important;
}
html body ul.apex-item-multi input.apex-item-text {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  min-height: auto !important;
  height: 28px !important;
  width: auto !important;
  max-width: 100% !important;
  min-width: 4px !important;
  flex: 0 1 auto !important;
}

/* Pop-Up LOV e Datepicker (grupo input + botão) — escopado pra fora do
   Interactive Grid. Esse grupo (.apex-item-group--popup-lov) é
   reaproveitado pelo próprio editor de coluna Popup LOV da grid, e
   forçar display:flex/position:relative nele (sem excluir a grid)
   quebrava o layout interno do widget dentro de colunas estreitas —
   o botão de abrir a busca ficava sem espaço/invisível e a coluna
   parecia "travada". */
html body .apex-item-group--popup-lov:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body .apex-item-group.apex-item-group--popup-lov:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body .apex-item-group--datepicker:not(.a-GV *):not(.a-GV-columnItemContainer *) {
  display: flex !important;
  align-items: stretch !important;
  gap: 6px !important;
  width: 100% !important;
  min-width: 0 !important;
  position: relative !important;
}
html body .apex-item-group--popup-lov .a-Button:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body .apex-item-group--datepicker .a-Button:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body .ui-datepicker-trigger:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body button.a-Button--popupLOV:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body button.a-Button--calendar:not(.a-GV *):not(.a-GV-columnItemContainer *) {
  height: 44px !important;
  min-width: 44px !important;
  padding: 0 10px !important;
  border: 1px solid var(--nc-input) !important;
  border-radius: var(--nc-radius-md) !important;
  background: var(--nc-secondary) !important;
  color: var(--nc-primary) !important;
  box-shadow: var(--nc-shadow-xs);
  transition: background 0.15s ease, color 0.15s ease !important;
}
html body .apex-item-group--popup-lov .a-Button:not(.a-GV *):not(.a-GV-columnItemContainer *):hover,
html body .apex-item-group--datepicker .a-Button:not(.a-GV *):not(.a-GV-columnItemContainer *):hover,
html body .ui-datepicker-trigger:not(.a-GV *):not(.a-GV-columnItemContainer *):hover,
html body button.a-Button--calendar:not(.a-GV *):not(.a-GV-columnItemContainer *):hover {
  background: var(--nc-accent) !important;
  color: var(--nc-accent-fg) !important;
}

/* Datepicker (jQuery UI) */
html body .ui-datepicker.a-DatePicker,
html body .ui-datepicker {
  border: 1px solid var(--nc-border) !important;
  border-radius: var(--nc-radius-lg) !important;
  box-shadow: var(--nc-shadow-md);
  background: var(--nc-card) !important;
  font-family: var(--nc-font);
  padding: 8px !important;
}
html body .ui-datepicker .ui-datepicker-header {
  background: var(--nc-secondary) !important;
  border: 0 !important;
  border-radius: var(--nc-radius-md) !important;
  color: var(--nc-primary) !important;
  font-weight: 800 !important;
}
html body .ui-datepicker td a.ui-state-default {
  border-radius: var(--nc-radius-sm) !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--nc-fg) !important;
  text-align: center !important;
}
html body .ui-datepicker td a.ui-state-default:hover {
  background: var(--nc-accent) !important;
  color: var(--nc-accent-fg) !important;
}
html body .ui-datepicker td a.ui-state-active,
html body .ui-datepicker td a.ui-state-highlight {
  background: var(--nc-primary) !important;
  color: var(--nc-primary-fg) !important;
  font-weight: 800 !important;
}

/* Radio e Checkbox */
html body .apex-item-group--rc .apex-item-option,
html body .apex-item-group--rc label {
  font-size: 1.05rem !important;
  color: var(--nc-fg) !important;
  font-weight: 500 !important;
}
/* Checkbox (padrão, sem virar toggle) — mesma fonte/tamanho/cor que já
   usamos pro Display Item, só no label do checkbox, sem tocar no Radio
   Group (que mantém o font-size próprio dele, acima). */
html body .apex-item-group--rc.apex-item-checkbox .apex-item-option,
html body .apex-item-group--rc.apex-item-checkbox label {
  font-family: var(--nc-font) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--nc-fg) !important;
}
/* Escopado pra fora do Interactive Grid (:not(.a-GV *)) — checkbox/radio
   nativos de colunas editáveis da grid (ex.: coluna tipo Checkbox) e o
   checkbox de seleção de linha continuam 100% nativos do APEX. */
html body input[type="radio"].apex-item-radio:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input[type="radio"]:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input[type="checkbox"].apex-item-checkbox:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input[type="checkbox"]:not(.a-GV *):not(.a-GV-columnItemContainer *) {
  -webkit-appearance: none !important;
  appearance: none !important;
  width: 22px !important;
  height: 22px !important;
  margin: 0 8px 0 0 !important;
  vertical-align: -5px !important;
  border: 1.5px solid var(--nc-input) !important;
  background-color: var(--nc-card) !important;
  box-shadow: var(--nc-shadow-xs);
  cursor: pointer !important;
  transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease !important;
}
html body input[type="radio"]:not(.a-GV *):not(.a-GV-columnItemContainer *) {
  border-radius: 999px !important;
}
html body input[type="checkbox"]:not(.a-GV *):not(.a-GV-columnItemContainer *) {
  border-radius: 5px !important;
}
html body input[type="radio"]:hover:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input[type="checkbox"]:hover:not(.a-GV *):not(.a-GV-columnItemContainer *) {
  border-color: var(--nc-primary-glow) !important;
  box-shadow: 0 0 0 3px rgba(var(--nc-primary-glow-rgb), 0.2) !important;
}
html body input[type="radio"]:checked:not(.a-GV *):not(.a-GV-columnItemContainer *) {
  border-color: var(--nc-primary) !important;
  background-color: var(--nc-primary) !important;
  box-shadow: inset 0 0 0 4px var(--nc-card) !important;
}
html body input[type="checkbox"]:checked:not(.a-GV *):not(.a-GV-columnItemContainer *) {
  border-color: var(--nc-primary) !important;
  background-color: var(--nc-primary) !important;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 16px 16px !important;
}
html body input[type="radio"]:focus:not(.a-GV *):not(.a-GV-columnItemContainer *),
html body input[type="checkbox"]:focus:not(.a-GV *):not(.a-GV-columnItemContainer *) {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(var(--nc-primary-glow-rgb), 0.28) !important;
}
/* Interactive Grid — o checkbox de seleção de linha (<span
   class="u-selector">) desenha o símbolo de "check" usando uma
   fonte de ícones própria do APEX (um caractere especial, não uma
   imagem). Nossa troca de fonte global sobrescrevia isso e o
   símbolo sumia. "revert" não resolve aqui porque ele pula direto
   pro padrão do navegador, ignorando o CSS do próprio APEX — por
   isso força explicitamente o nome exato da fonte de ícone nativa.
   Mesmo mecanismo/correção pro checkbox de alternar controles do
   Interactive Report (.a-IRR-controlsCheckboxLabel). */
html body .u-selector,
html body .u-selector:before,
html body .a-IRR-controlsCheckboxLabel,
html body .a-IRR-controlsCheckboxLabel:before {
  font-family: apex-5-icon-font !important;
}

/* Espaço extra embaixo, pra caixa maior (com o anel de destaque
   quando marcado) não ficar cortada pela borda da região. */
html body .apex-item-group--rc.apex-item-checkbox {
  margin-bottom: 10px !important;
}
/* Cada opção do Checkbox Group precisa de mais altura de linha que o
   padrão nativo, já que nosso quadradinho (26px) é maior que o
   original (16px) — sem isso, opções empilhadas ficam grudadas ou até
   sobrepostas. */
html body .apex-item-group--rc.apex-item-checkbox input + label {
  min-height: 30px !important;
  margin: 6px 0 !important;
  padding-left: 36px !important;
  display: inline-flex !important;
  align-items: center !important;
}

html body .apex-item-group--rc.apex-item-checkbox input + label:before {
  width: 26px !important;
  height: 26px !important;
  border-radius: 8px !important;
  border: 1.5px solid var(--nc-input) !important;
  background-color: var(--nc-card) !important;
  box-shadow: 0 1px 3px rgba(43, 34, 51, 0.08) !important;
  transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease !important;
}
html body .apex-item-group--rc.apex-item-checkbox input:hover + label:before {
  border-color: var(--nc-primary-glow) !important;
  box-shadow: 0 0 0 3px rgba(var(--nc-primary-glow-rgb), 0.2) !important;
}
html body .apex-item-group--rc.apex-item-checkbox input:checked + label:before {
  border-color: var(--nc-primary) !important;
  background-color: var(--nc-primary) !important;
  box-shadow: 0 0 0 4px rgba(var(--nc-primary-glow-rgb), 0.28) !important;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='19' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 18px 18px !important;
}
/* O ::after nativo do tema desenha o próprio checkmark por cima do
   ::before — como já desenhamos o nosso checkmark no ::before (via
   background-image acima), escondemos o ::after nativo pra não
   sobrepor/duplicar. */
html body .apex-item-group--rc.apex-item-checkbox input + label:after {
  display: none !important;
}

/* Radio Group estilo "Switch" (Sim/Não como botões, não bolinhas) —
   classe .apex-item-group--switch. Opção selecionada usa a cor do
   tema (igual aos botões "Hot"); a não selecionada fica neutra,
   igual aos botões normais do sistema. */
html body .apex-item-group--switch {
  display: inline-flex !important;
  border-radius: var(--nc-radius-md) !important;
  overflow: hidden !important;
  border: 1px solid var(--nc-input) !important;
}
html body .apex-item-group--switch .apex-item-option {
  margin: 0 !important;
}
html body .apex-item-group--switch input[type="radio"] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
html body .apex-item-group--switch label.a-Button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 34px !important;
  padding: 0 16px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: #fff !important;
  color: var(--nc-primary-deep) !important;
  cursor: pointer !important;
  font-weight: 500 !important;
  transition: background-color 0.15s ease, color 0.15s ease !important;
}
html body .apex-item-group--switch input[type="radio"]:checked + label.a-Button {
  background-color: var(--nc-primary) !important;
  color: #fff !important;
}
html body .apex-item-group--switch input[type="radio"]:not(:checked) + label.a-Button:hover {
  background-color: var(--nc-primary-soft) !important;
}
html body .apex-item-group--switch .apex-item-option:not(:last-child) label.a-Button {
  border-right: 1px solid var(--nc-input) !important;
}

/* Radio Group exibido como toggle segmentado (ex.: Sim/Não) — versão
   universal: em vez de mirar só `.apex-item-grid-row` (que às vezes
   fica mais fundo, dependendo de "Number of Columns"), miramos o
   CONTAINER EXTERNO que todo Radio Group tem (.apex-item-group--rc
   .apex-item-radio) e fazemos os <div> de wrapper no meio (apex-item-
   grid, radio_group, apex-item-grid-row) "sumirem" do layout com
   display:contents — assim não importa quantos níveis de divs existam,
   o resultado é sempre o mesmo. */
html body .apex-item-group--rc.apex-item-radio,
html body .apex-item-grid-row {
  display: flex !important;
  align-items: stretch !important;
  height: 34px !important;
  padding: 0 !important;
  gap: 0 !important;
  background: var(--nc-card) !important;
  border: 1px solid var(--nc-input) !important;
  border-radius: var(--nc-radius-md) !important;
  overflow: hidden !important;
}
html body .apex-item-group--rc.apex-item-radio .apex-item-grid,
html body .apex-item-group--rc.apex-item-radio .radio_group,
html body .apex-item-group--rc.apex-item-radio .apex-item-grid-row {
  display: contents !important;
}
html body .apex-item-group--rc.apex-item-radio .apex-item-option,
html body .apex-item-grid-row .apex-item-option {
  flex: 1 1 0 !important;
  display: flex !important;
  margin: 0 !important;
}
/* Esconde o rádio nativo (é nele que fica a classe própria do app,
   "borda-campo-valido", de onde vinha a cor rosa, e também a bolinha
   visível) — o clique continua funcionando porque o <label for="...">
   aciona o input escondido normalmente. */
html body .apex-item-group--rc.apex-item-radio .apex-item-option input[type="radio"],
html body .apex-item-grid-row .apex-item-option input[type="radio"] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  border: 0 !important;
  background: none !important;
  background-image: none !important;
  box-shadow: none !important;
  pointer-events: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}
html body .apex-item-group--rc.apex-item-radio .apex-item-option label,
html body .apex-item-grid-row .apex-item-option label {
  flex: 1 1 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 18px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--nc-fg) !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: background-color 0.15s ease, color 0.15s ease !important;
}
html body .apex-item-group--rc.apex-item-radio .apex-item-option input[type="radio"]:checked + label,
html body .apex-item-grid-row .apex-item-option input[type="radio"]:checked + label {
  background: var(--nc-primary) !important;
  color: #ffffff !important;
}

/* Label vazio (sem texto nenhum) pareado com opção de valor vazio —
   convenção comum quando o desenvolvedor deixa uma opção em branco pra
   representar "nenhum valor". Preenche visualmente com "Não" via
   ::after num label :empty — só aparência, não altera o texto real do
   elemento (o value="" já vem assim direto no HTML da página). */
html body input[type="radio"][value=""] + label:empty::after,
html body input[type="checkbox"][value=""] + label:empty::after {
  content: "Não";
}

/* Quando NENHUMA opção do Radio Group está marcada (banco veio nulo),
   mostra a primeira opção ("Não") como selecionada visualmente — com
   uma bolinha extra pra deixar claro que é um padrão, não uma escolha
   real do usuário. Importante: isso é só aparência, feito com :has() —
   não marca o input de verdade, não muda o valor do campo, não dispara
   nenhuma Dynamic Action. Só se aplica a grupos de exatamente 2 opções
   (padrão Não/Sim); grupos com mais opções não são afetados. */
html body .apex-item-group--rc.apex-item-radio:not(.nc-checkbox-single):not(:has(input[type="radio"]:checked)) .apex-item-option:first-child label,
html body .apex-item-grid-row:not(:has(input[type="radio"]:checked)) .apex-item-option:first-child label {
  background: var(--nc-primary) !important;
  color: #ffffff !important;
  position: relative !important;
}
html body .apex-item-group--rc.apex-item-radio:not(.nc-checkbox-single):not(:has(input[type="radio"]:checked)) .apex-item-option:first-child label::after,
html body .apex-item-grid-row:not(:has(input[type="radio"]:checked)) .apex-item-option:first-child label::after {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #fff;
  margin-left: 8px;
  vertical-align: middle;
}

/* Erros de item */
html body .apex-page-item-error,
html body .t-Form-error,
html body span.a-Form-error:not(:empty) {
  display: block !important;
  margin-top: -4px !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: var(--nc-destructive) !important;
}
html body span.a-Form-error:empty {
  display: none !important;
  margin: 0 !important;
}
html body .apex-page-item-error-wrapper input.apex-item-text,
html body .apex-page-item-error-wrapper select.apex-item-select,
html body .apex-page-item-error-wrapper textarea.apex-item-textarea,
html body input.apex-item-text.apex-page-item-error,
html body .is-error input.apex-item-text {
  border-color: var(--nc-destructive) !important;
  box-shadow: 0 0 0 3px rgba(214, 47, 42, 0.18) !important;
}

/* ---------- Buttons ---------- */
.t-Button {
  border-radius: var(--nc-radius-sm);
  font-weight: 600;
  letter-spacing: 0.01em;
  transition: background-color 0.15s ease, box-shadow 0.15s ease, transform 0.05s ease;
}
.t-Button:active { transform: translateY(1px); }
html body .t-Button--hot:not(.btnIA):not(.floatChamadoInterno):not(.floatNati):not(.t-Button--simple),
html body .t-Button.t-Button--hot:not(.btnIA):not(.floatChamadoInterno):not(.floatNati):not(.t-Button--simple),
html body button.t-Button--hot:not(.btnIA):not(.floatChamadoInterno):not(.floatNati):not(.t-Button--simple) {
  background: linear-gradient(135deg, var(--nc-primary), var(--nc-primary-glow)) !important;
  border-color: var(--nc-primary-deep) !important;
  color: #fff !important;
  box-shadow: 0 2px 8px rgba(var(--nc-primary-rgb), 0.28) !important;
}
html body .t-Button--hot:hover:not(.btnIA):not(.floatChamadoInterno):not(.floatNati):not(.t-Button--simple) {
  background: linear-gradient(135deg, var(--nc-primary-deep), var(--nc-primary)) !important;
}
/* Botões com "Remove UI Decoration" + "Hot" ao mesmo tempo (ex.:
   #SSO_MANUAL) — fundo continua branco/nativo (prioridade do
   simple), mas texto e ícone seguem a cor do tema. */
html body .t-Button--simple.t-Button--hot,
html body .t-Button--simple.t-Button--hot .t-Icon,
html body .t-Button--simple.t-Button--hot .t-Button-label {
  color: var(--nc-primary) !important;
}
html body .t-Button--simple.t-Button--hot:hover,
html body .t-Button--simple.t-Button--hot:hover .t-Icon,
html body .t-Button--simple.t-Button--hot:hover .t-Button-label {
  color: var(--nc-primary-deep) !important;
}
html body .t-Button--simple.t-Button--hot,
html body .t-Button--simple.t-Button--hot:hover,
html body .t-Button--simple.t-Button--hot:focus,
html body .t-Button--simple.t-Button--hot:active,
html body .t-Button--simple.t-Button--hot.is-active {
  background-color: #fff !important;
  background-image: none !important;
}
/* Sem isso, esse botão ficava "preso" num fundo escuro depois de
   clicado (estilo nativo de foco do tema, que essa combinação de
   classes não tinha sobrescrito ainda) — garante que o fundo
   continue branco/nativo e o texto legível em qualquer estado. */
html body .t-Button--simple.t-Button--hot:focus,
html body .t-Button--simple.t-Button--hot:active,
html body .t-Button--simple.t-Button--hot.is-active {
  background-color: #fff !important;
  border-color: var(--nc-border) !important;
  color: var(--nc-primary-deep) !important;
  box-shadow: 0 0 0 3px rgba(var(--nc-primary-glow-rgb), 0.28) !important;
}
html body .t-Button--simple.t-Button--hot:focus .t-Icon,
html body .t-Button--simple.t-Button--hot:focus .t-Button-label,
html body .t-Button--simple.t-Button--hot:active .t-Icon,
html body .t-Button--simple.t-Button--hot:active .t-Button-label,
html body .t-Button--simple.t-Button--hot.is-active .t-Icon,
html body .t-Button--simple.t-Button--hot.is-active .t-Button-label {
  color: var(--nc-primary-deep) !important;
}
html body .t-Button:not(.t-Button--hot):not(.t-Button--header):not(.t-Button--noUI):not(.t-Button--danger):not(.t-Button--warning):not(.t-Button--success):not(.t-Button--info):not(.t-Button--primary):not(.t-Button--simple):not(.btnIA):not(.floatChamadoInterno):not(.floatNati) {
  background-color: #fff !important;
  border: 1px solid var(--nc-border) !important;
  color: var(--nc-primary-deep) !important;
}
html body .t-Button:not(.t-Button--hot):not(.t-Button--header):not(.t-Button--noUI):not(.t-Button--danger):not(.t-Button--warning):not(.t-Button--success):not(.t-Button--info):not(.t-Button--primary):not(.t-Button--simple):not(.btnIA):not(.floatChamadoInterno):not(.floatNati):hover {
  background-color: var(--nc-primary-soft) !important;
  border-color: var(--nc-primary-border) !important;
}
/* Sem essa regra, o botão ficava "preso" numa cor escura depois de
   clicado (usando algum estilo nativo de foco/ativo do tema) — volta
   sempre pro visual normal (fundo branco, texto roxo). */
html body .t-Button:not(.t-Button--hot):not(.t-Button--header):not(.t-Button--noUI):not(.t-Button--danger):not(.t-Button--warning):not(.t-Button--success):not(.t-Button--info):not(.t-Button--primary):not(.t-Button--simple):not(.btnIA):not(.floatChamadoInterno):not(.floatNati):focus,
html body .t-Button:not(.t-Button--hot):not(.t-Button--header):not(.t-Button--noUI):not(.t-Button--danger):not(.t-Button--warning):not(.t-Button--success):not(.t-Button--info):not(.t-Button--primary):not(.t-Button--simple):not(.btnIA):not(.floatChamadoInterno):not(.floatNati):active,
html body .t-Button:not(.t-Button--hot):not(.t-Button--header):not(.t-Button--noUI):not(.t-Button--danger):not(.t-Button--warning):not(.t-Button--success):not(.t-Button--info):not(.t-Button--primary):not(.t-Button--simple):not(.btnIA):not(.floatChamadoInterno):not(.floatNati).is-active {
  background-color: #fff !important;
  border-color: var(--nc-border) !important;
  color: var(--nc-primary-deep) !important;
  box-shadow: 0 0 0 3px rgba(var(--nc-primary-glow-rgb), 0.28) !important;
}
/* "Remove UI Decoration" sempre prioriza esse visual (fundo branco,
   texto roxo, sem borda), mesmo que o botão também tenha "Hot"
   marcado — declarada por último, com a MESMA especificidade da
   variante de duas classes do Hot (.t-Button.t-Button--hot), pra
   vencer o empate de vez (foi exatamente isso que faltou da última
   vez que tentamos isso). */
html body .t-Button--noUI,
html body .t-Button.t-Button--noUI,
html body button.t-Button--noUI,
html body .t-Button--hot.t-Button--noUI,
html body .t-Button--hot.t-Button--noUI:not(.btnIA):not(.floatChamadoInterno):not(.floatNati):not(.t-Button--simple) {
  background: #fff !important;
  background-image: none !important;
  border: 0 !important;
  color: var(--nc-primary-deep) !important;
  box-shadow: none !important;
}
html body .t-Button--noUI:hover,
html body .t-Button.t-Button--noUI:hover,
html body button.t-Button--noUI:hover,
html body .t-Button--hot.t-Button--noUI:hover,
html body .t-Button--hot.t-Button--noUI:not(.btnIA):not(.floatChamadoInterno):not(.floatNati):not(.t-Button--simple):hover {
  background: var(--nc-primary-soft) !important;
  border: 0 !important;
}

/* Botões flutuantes (position:fixed) não ocupam espaço na página, mas
   a região/container/row/col que os envolve continua existindo
   normalmente — sobrando como uma caixinha vazia perto de onde o
   botão foi colocado no código (geralmente perto do rodapé). Esconde
   essa "casca" vazia quando ela só contém um desses botões. */
html body .t-Region-body:has(> .container > .row > .col > .floatNati),
html body .t-Region-body:has(> .container > .row > .col > .floatChamadoInterno),
html body .t-Region-body:has(> .container > .row > .col > .btnIA),
html body .t-Region-body:has(> script:only-child) {
  display: none !important;
}
/* A regra acima esconde só o CONTEÚDO interno (.t-Region-body) —
   mas a "casca" da região (a moldura .t-Region em volta, com borda,
   padding, etc.) continuava aparecendo, ocupando espaço mesmo vazia.
   Esconde a região inteira nesses mesmos casos. */
html body .t-Region:has(> .t-Region-body > .container > .row > .col > .floatNati),
html body .t-Region:has(> .t-Region-body > .container > .row > .col > .floatChamadoInterno),
html body .t-Region:has(> .t-Region-body > .container > .row > .col > .btnIA),
html body .t-Region:has(> .t-Region-body > script:only-child),
html body .t-Region:has(> .t-Region-body > .container > .row > .col > script:only-child) {
  display: none !important;
}

/* ---------- Tabs Container ---------- */
/* Mira a classe base .a-Tabs (presente nos dois tipos de aba do APEX:
   Tabs Container nativo e Region Display Selector), com seletores por
   descendência (não só filho direto) pra funcionar em qualquer
   variante de estilo (--simple, --large, etc.) sem exceção. */
html body ul.a-Tabs {
  display: flex !important;
  gap: 0 !important;
  column-gap: 0 !important;
  row-gap: 0 !important;
  justify-content: flex-start !important;
  border-bottom: 1.5px solid var(--nc-primary-border) !important;
  /* "nowrap" (não "wrap"): quando as abas não cabem todas na largura
     da tela, o certo é manter tudo numa linha só e deixar a rolagem
     horizontal NATIVA do Oracle assumir (aquela barra de arrastar) —
     não quebrar as abas em duas linhas. Com "wrap", a gente perdia
     essa rolagem sem querer (efeito colateral de uma limpeza de
     espaçamento entre abas, não uma mudança pensada pra isso). */
  flex-wrap: nowrap !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
/* Reforço pra variantes de estilo nativo (Fill Labels, Pill, etc.) que
   podem ter regras próprias de espaçamento com força maior — zera
   tudo de novo, especificamente nessas classes. */
html body ul.a-Tabs.t-Tabs--fillLabels,
html body ul.a-Tabs.t-Tabs--pill,
html body ul.a-Tabs.t-Tabs--simple,
html body ul.a-Tabs.t-Tabs--large {
  gap: 0 !important;
}
html body ul.a-Tabs.t-Tabs--fillLabels li,
html body ul.a-Tabs.t-Tabs--pill li,
html body ul.a-Tabs.t-Tabs--simple li,
html body ul.a-Tabs.t-Tabs--large li {
  margin: 0 !important;
  padding: 0 !important;
}
html body ul.a-Tabs li,
html body ul.a-Tabs > li,
html body ul.a-Tabs .a-Tabs-item {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}
html body ul.a-Tabs > li + li,
html body ul.a-Tabs .a-Tabs-item + .a-Tabs-item {
  margin-left: 0 !important;
}
html body ul.a-Tabs li > a,
html body ul.a-Tabs .a-Tabs-link {
  margin-left: 0 !important;
}
/* Esconde o asterisco vermelho que o APEX injeta automaticamente na
   aba quando ela tem um campo obrigatório vazio (vem com
   style="color:red" direto no HTML). Optamos por esconder em vez de
   reposicionar, já que o reposicionamento não estava sendo aplicado
   de forma confiável nessa aplicação específica. */
html body ul.a-Tabs a span[style*="color:red"],
html body ul.a-Tabs a span[style*="color: red"] {
  display: none !important;
}
html body ul.a-Tabs a,
html body ul.a-Tabs a:hover,
html body ul.a-Tabs a:focus,
html body ul.a-Tabs a:visited,
html body ul.a-Tabs a:active,
html body ul.a-Tabs a span {
  text-decoration: none !important;
}
html body ul.a-Tabs a {
  display: inline-flex !important;
  align-items: center !important;
  height: 40px !important;
  width: auto !important;
  max-width: none !important;
  overflow: visible !important;
  box-sizing: border-box !important;
  white-space: nowrap !important;
  border: 1.5px solid var(--nc-primary-border) !important;
  border-bottom: 0 !important;
  border-radius: 8px 8px 0 0 !important;
  margin-right: -1.5px !important;
  background: var(--nc-card) !important;
  color: var(--nc-primary) !important;
  font-family: var(--nc-font) !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  line-height: normal !important;
  padding: 0 18px !important;
  transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease !important;
}
html body ul.a-Tabs a,
html body ul.a-Tabs a *,
html body ul.a-Tabs a span,
html body ul.a-Tabs a span[style] {
  white-space: nowrap !important;
}
html body ul.a-Tabs li {
  flex-shrink: 0 !important;
}
html body ul.a-Tabs a:hover {
  background: var(--nc-primary-soft) !important;
  border-color: var(--nc-primary-glow) !important;
}
html body ul.a-Tabs li.is-active a,
html body ul.a-Tabs li.a-Tabs-selected a,
html body ul.a-Tabs li.apex-rds-selected a {
  background: var(--nc-primary) !important;
  border-color: var(--nc-primary) !important;
  color: #fff !important;
  box-shadow: 0 -2px 8px rgba(var(--nc-primary-rgb), 0.2) !important;
  position: relative !important;
  z-index: 1 !important;
}

/* ---------- Reforço Tabs Container nativo (.t-Tabs) ---------- */
/* O Tabs Container nativo do APEX usa .t-Tabs/.t-Tabs-item/.t-Tabs-link.
   Algumas variantes (principalmente Fill Labels/Pill) aplicam regras próprias
   de distribuição e espaçamento. Este bloco força o mesmo padrão visual
   já aplicado ao .a-Tabs: abas agrupadas, sem espaços entre elas. */
html body ul.t-Tabs {
  display: flex !important;
  gap: 0 !important;
  column-gap: 0 !important;
  row-gap: 0 !important;
  justify-content: flex-start !important;
  margin: 0 !important;
  padding: 0 !important;
  /* "nowrap" pelo mesmo motivo do ".a-Tabs" acima: preserva a
     rolagem horizontal nativa do Oracle em vez de quebrar as abas em
     duas linhas quando não cabem todas na tela. */
  flex-wrap: nowrap !important;
}
html body ul.t-Tabs .t-Tabs-item,
html body ul.t-Tabs li {
  margin: 0 !important;
  padding: 0 !important;
  flex: 0 0 auto !important;
}
html body ul.t-Tabs .t-Tabs-item + .t-Tabs-item,
html body ul.t-Tabs li + li {
  margin-left: 0 !important;
}
html body ul.t-Tabs .t-Tabs-link,
html body ul.t-Tabs li > a {
  display: inline-flex !important;
  align-items: center !important;
  height: 40px !important;
  width: auto !important;
  max-width: none !important;
  box-sizing: border-box !important;
  white-space: nowrap !important;
  border: 1.5px solid var(--nc-primary-border) !important;
  border-bottom: 0 !important;
  border-radius: 8px 8px 0 0 !important;
  margin: 0 -1.5px 0 0 !important;
  background: var(--nc-card) !important;
  color: var(--nc-primary) !important;
  font-family: var(--nc-font) !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  line-height: normal !important;
  padding: 0 18px !important;
  text-decoration: none !important;
  transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease !important;
}
html body ul.t-Tabs .t-Tabs-link:hover,
html body ul.t-Tabs li > a:hover {
  background: var(--nc-primary-soft) !important;
  border-color: var(--nc-primary-glow) !important;
}
html body ul.t-Tabs .t-Tabs-item.is-active .t-Tabs-link,
html body ul.t-Tabs .t-Tabs-item.a-Tabs-selected .t-Tabs-link {
  background: var(--nc-primary) !important;
  border-color: var(--nc-primary) !important;
  color: #fff !important;
  box-shadow: 0 -2px 8px rgba(var(--nc-primary-rgb), 0.2) !important;
  position: relative !important;
  z-index: 1 !important;
}

/* ---------- Interactive Report / Grid ---------- */
/* A pedido: barra de rolagem horizontal sempre visível em qualquer
   Interactive Report cuja tabela seja mais larga que a moldura da
   região — reproduz permanentemente o efeito que o botão nativo
   "Maximizar" liga sob demanda (troca overflow:hidden/visible por
   overflow:auto na região), só que já vem ligado por padrão em TODO
   Interactive Report do sistema, tenha ou não esse botão habilitado
   na página. É independente do botão em si: só garante que, sempre
   que a tabela não couber, apareça a barra de rolagem embaixo em vez
   de cortar as colunas. Escopado à classe "t-IRR-region", presente em
   toda região de Interactive Report, com ou sem o botão. */
html body .t-IRR-region {
  overflow-x: auto !important;
}

/* ---------- Barra de rolagem horizontal FLUTUANTE (Interactive Report) ----------
   Ver Natcorp_Allow_Unload_Iframes.js pelo JS que cria e sincroniza
   essa barra com a rolagem de verdade da região. Só o visual dela
   mora aqui. Fica escondida (opacity/visibility) até o JS marcar
   ".is-visible" nela. */
html body .nc-hscroll-float {
  position: fixed;
  bottom: 6px;
  height: 14px;
  /* Precisa ficar ACIMA do z-index da região quando maximizada
     (.t-IRR-region.nc-fake-maximized usa 999999 pra cobrir a tela
     toda) — senão a própria região maximizada desenha por cima da
     barra e ela fica escondida, mesmo estando tecnicamente "visível"
     (confirmado via elementFromPoint: o elemento por cima era uma
     célula da tabela, não a barra). */
  z-index: 1000000;
  overflow-x: auto;
  overflow-y: hidden;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  background: var(--nc-card, #fff);
  border: 1px solid var(--nc-border, #e5e0ec);
  border-radius: 999px;
  box-shadow: var(--nc-shadow-xs, 0 1px 2px rgba(0, 0, 0, 0.08));
  transition: opacity 0.12s ease;
}
html body .nc-hscroll-float.is-visible {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}
/* O "espaçador" não tem nenhum conteúdo visível — só existe pra dar
   ao elemento pai (".nc-hscroll-float") a mesma largura de rolagem
   (scrollWidth) que a região de verdade tem, e assim a barra de
   rolagem NATIVA do navegador que aparece dentro dele fica com a
   proporção certa. */
html body .nc-hscroll-float__spacer {
  height: 1px;
}

/* ---------- Simulação de "Maximizar" no Interactive Report (TESTE) ----------
   Ver Natcorp_Allow_Unload_Iframes.js pelo JS que insere o botão e
   liga o clique (bloco "Simulação do botão Maximizar em Interactive
   Report"). NÃO é o recurso nativo do Oracle, é uma simulação nossa.
   PRA REMOVER esse recurso inteiro: apaga este bloco inteiro (até o
   comentário "FIM" logo abaixo) e o bloco correspondente no .js —
   nada aqui interfere em mais nada do arquivo. */
html body.nc-fake-maximize-open {
  overflow: hidden !important;
}
/* A pedido: sem fundo escurecido nem cara de "cartão flutuando" (sem
   borda arredondada, sombra ou respiro) — a região cobre a tela de
   ponta a ponta, mais parecido com o jeito nativo do Oracle de
   maximizar do que um modal/diálogo por cima do conteúdo. */
html body .t-IRR-region.nc-fake-maximized {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  /* Bem mais alto que qualquer z-index nativo do APEX (menu superior,
     coluna lateral, até diálogos nativos) — 9999 não era suficiente
     porque o menu/coluna lateral do tema usam um z-index nativo maior
     que isso, então ficavam por cima mesmo com a região "na frente"
     no HTML. */
  z-index: 999999 !important;
  background: var(--nc-card) !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  /* A região inteira rola (cabeçalho da barra de ferramentas incluso)
     — tentamos deixar só a tabela rolando com a barra fixa em cima,
     mas isso mexia demais na estrutura interna que o Oracle usa pro
     cabeçalho "grudento" das colunas e quebrava o alinhamento das
     linhas. Voltamos pro jeito simples: quando o conteúdo é mais alto
     que a tela, aparece uma barra de rolagem vertical nativa do
     navegador na própria região, dando acesso a todos os registros. */
  overflow: auto !important;
}
/* HISTÓRICO: chegamos a ter essas regras generalizadas pra TODO
   Interactive Report (maximizado ou não). Deu problema: pra fazer o
   "position: sticky" funcionar sem a região ter rolagem própria de
   verdade, teria que neutralizar o overflow também da região e de
   elementos do ESQUELETO da página inteira (".container", ".t-Body"
   etc.) — só que a região PRECISA manter "overflow-x: auto" (é a
   funcionalidade da barra de rolagem sempre visível) e isso sozinho já
   quebra o sticky, sem solução só de CSS. Pior: ao esconder o clone
   nativo do Oracle (".js-stickyTableHeader") em TODO relatório,
   quebramos o cabeçalho grudento nos relatórios que já tinham isso
   funcionando sozinho, nativamente, no modo normal (não maximizado).
   Revertido pra escopo só do modo maximizado (onde a região TEM
   rolagem própria de verdade e o sticky funciona sem conflito nenhum
   — confirmado). Pro modo normal, a solução passou a ser um mecanismo
   em JavaScript próprio (ver Natcorp_Allow_Unload_Iframes.js), que só
   entra em ação nos relatórios que não têm o recurso nativo do Oracle
   habilitado — os que já têm continuam com o widget nativo deles,
   sem a gente interferir.

   ATUALIZAÇÃO: descobrimos que existem DOIS jeitos de "maximizar" uma
   região, e cada um usa uma classe diferente:
   - ".nc-fake-maximized": nosso botão "fake" (quando o relatório NÃO
     tem o recurso nativo do Oracle de maximizar).
   - ".is-maximized": o maximizar NATIVO do próprio Oracle APEX (quando
     o relatório JÁ tem o botão nativo — classe "js-showMaximizeButton"
     na região). Nesse caso a região também fica "position: fixed" e
     ocupando a tela toda, só que quem faz isso é o próprio APEX, não a
     gente — por isso as regras abaixo, que cuidam só do cabeçalho
     grudento, precisam valer pras duas classes igualmente. Repare que
     as regras de "position: fixed / tela cheia" lá em cima (linhas
     ~3247) continuam só pra ".nc-fake-maximized", porque no maximizar
     nativo isso já é o próprio Oracle que faz. */
html body .t-IRR-region.nc-fake-maximized .js-stickyTableHeader,
html body .t-IRR-region.nc-fake-maximized .js-stickyWidget-placeholder,
html body .t-IRR-region.is-maximized .js-stickyTableHeader,
html body .t-IRR-region.is-maximized .js-stickyWidget-placeholder {
  display: none !important;
}
html body .t-IRR-region.nc-fake-maximized .t-fht-tbody,
html body .t-IRR-region.nc-fake-maximized .t-fht-tbody table,
html body .t-IRR-region.is-maximized .t-fht-tbody,
html body .t-IRR-region.is-maximized .t-fht-tbody table {
  margin-top: 0 !important;
}
/* SEM linha "extra" no topo (nem quebra de controle, nem Pivot): a
   1ª linha do tbody já É o cabeçalho de colunas de verdade —
   comportamento original, intacto. */
html body .t-IRR-region.nc-fake-maximized .a-IRR-table:not(:has(> tbody > tr > th.a-IRR-header--group)):not(:has(> tbody > tr > th.a-IRR-header--pivotColumn)) > tbody > tr:first-child > th.a-IRR-header,
html body .t-IRR-region.is-maximized .a-IRR-table:not(:has(> tbody > tr > th.a-IRR-header--group)):not(:has(> tbody > tr > th.a-IRR-header--pivotColumn)) > tbody > tr:first-child > th.a-IRR-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 5 !important;
}
/* COM linha "extra" no topo — quebra de controle (rótulo de grupo,
   ex.: "Empresa: Dpc") OU relatório Pivot (linha com os valores
   pivotados, ex.: nomes de analistas como coluna): cada uma repete
   sua própria linha "extra" seguida da linha de cabeçalho de colunas
   de verdade (no Pivot só existe 1 vez, já que não repete por grupo;
   na quebra de controle repete pra cada grupo). Aqui deixamos TODAS
   as linhas "extra" (não só a 1ª ocorrência) com "position: sticky"
   no mesmo "top" — com isso, o PRÓPRIO NAVEGADOR troca
   automaticamente qual está "colada" conforme o usuário rola (mesmo
   mecanismo nativo usado em listas com "cabeçalho de seção", tipo
   agenda de contato por letra): assim que a linha do próximo grupo
   chega no topo, ela empurra pra fora a do grupo anterior e assume o
   lugar. Não precisa de JavaScript pra essa troca — é comportamento
   nativo do "position: sticky" com vários itens irmãos no mesmo
   "top". */
html body .t-IRR-region.nc-fake-maximized .a-IRR-table:has(> tbody > tr > th.a-IRR-header--group) > tbody > tr > th.a-IRR-header--group,
html body .t-IRR-region.is-maximized .a-IRR-table:has(> tbody > tr > th.a-IRR-header--group) > tbody > tr > th.a-IRR-header--group,
html body .t-IRR-region.nc-fake-maximized .a-IRR-table:has(> tbody > tr > th.a-IRR-header--pivotColumn) > tbody > tr > th.a-IRR-header--pivotColumn,
html body .t-IRR-region.is-maximized .a-IRR-table:has(> tbody > tr > th.a-IRR-header--pivotColumn) > tbody > tr > th.a-IRR-header--pivotColumn {
  position: sticky !important;
  top: 0 !important;
  z-index: 6 !important;
}
html body .t-IRR-region.nc-fake-maximized .a-IRR-table:has(> tbody > tr > th.a-IRR-header--group) > tbody > tr > th.a-IRR-header:not(.a-IRR-header--group),
html body .t-IRR-region.is-maximized .a-IRR-table:has(> tbody > tr > th.a-IRR-header--group) > tbody > tr > th.a-IRR-header:not(.a-IRR-header--group),
html body .t-IRR-region.nc-fake-maximized .a-IRR-table:has(> tbody > tr > th.a-IRR-header--pivotColumn) > tbody > tr > th.a-IRR-header:not(.a-IRR-header--pivotColumn),
html body .t-IRR-region.is-maximized .a-IRR-table:has(> tbody > tr > th.a-IRR-header--pivotColumn) > tbody > tr > th.a-IRR-header:not(.a-IRR-header--pivotColumn) {
  position: sticky !important;
  top: var(--nc-group-header-height, 2.25rem) !important;
  z-index: 5 !important;
}
html body .t-IRR-region.nc-fake-maximized .a-IRR-tableContainer,
html body .t-IRR-region.is-maximized .a-IRR-tableContainer {
  overflow: visible !important;
}
html body .t-IRR-region.nc-fake-maximized .t-fht-tbody,
html body .t-IRR-region.is-maximized .t-fht-tbody {
  overflow: visible !important;
}
html body .t-IRR-region.nc-fake-maximized .t-fht-wrapper,
html body .t-IRR-region.nc-fake-maximized .a-IRR-content,
html body .t-IRR-region.nc-fake-maximized .a-IRR,
html body .t-IRR-region.is-maximized .t-fht-wrapper,
html body .t-IRR-region.is-maximized .a-IRR-content,
html body .t-IRR-region.is-maximized .a-IRR {
  overflow: visible !important;
}
/* Confirmado num relatório com a variante ".t-IRR-region--noBorders":
   o navegador calculava "overflow-y: hidden" pra região maximizada
   NATIVAMENTE (".is-maximized"), mesmo com bastante conteúdo sobrando
   pra rolar (comparamos "scrollHeight" bem maior que "clientHeight") —
   resultado: tela maximizada "travada", sem dar pra descer os
   registros. A gente nunca definiu esse "overflow" da região em si
   (só dos elementos de dentro, nas regras acima) — isso vem de uma
   variação do CSS nativo do Oracle pra essa combinação específica de
   classes. Força "overflow-y: auto" na região sempre que ela estiver
   maximizada nativamente, garantindo a rolagem vertical independente
   de qual variante/classe adicional o relatório tiver. */
html body .t-IRR-region.is-maximized {
  overflow-y: auto !important;
}
/* Cabeçalho "grudento" via JavaScript, pros relatórios SEM o widget
   nativo do Oracle, no modo NORMAL (não maximizado) — ver a
   funcionalidade correspondente em Natcorp_Allow_Unload_Iframes.js.
   O JS aplica/remove essa classe conforme a rolagem; aqui só o visual
   de quando ela está ativa. */
html body .nc-sticky-header-clone {
  position: fixed !important;
  z-index: 10 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}
/* Gira o ícone do nosso botão (de "expandir" pra "recolher") enquanto
   maximizado, só como pista visual do estado atual. */
html body .nc-fake-maximize-btn[aria-expanded="true"] .a-Icon {
  transform: rotate(180deg);
}
/* ---------- FIM da simulação de "Maximizar" (TESTE) ---------- */

.a-IRR-header,
.a-IRR-table thead th {
  background: var(--nc-primary-border) !important;
  color: var(--nc-primary-deep) !important;
  font-family: var(--nc-font) !important;
  font-size: 1.8rem !important;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 0.4rem 0.75rem !important;
  border-bottom: 1px solid var(--nc-primary-border);
}
/* Interactive Grid — fonte igual ao Classic Report, menor que a IR. */
/* [TESTE: desabilitado temporariamente pra diagnóstico]
.a-GV-header {
  background: var(--nc-primary-border) !important;
  color: var(--nc-primary-deep) !important;
  font-family: var(--nc-font) !important;
  font-size: 1.1rem !important;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 0.4rem 0.75rem !important;
  border-bottom: 1px solid var(--nc-primary-border);
}
*/
/* Classic Report — fonte separada da IR, menor pra não cortar o
   texto do cabeçalho das colunas. */
table.t-Report-report thead th {
  background: var(--nc-primary-border) !important;
  color: var(--nc-primary-deep) !important;
  font-family: var(--nc-font) !important;
  font-size: 1.1rem !important;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--nc-primary-border);
  padding: 10px 12px !important;
  box-sizing: border-box !important;
}
.a-IRR-header .a-IRR-headerLink {
  background: transparent !important;
  color: var(--nc-primary-deep) !important;
  font-family: var(--nc-font) !important;
  font-size: 1rem !important;
}
.a-IRR-table td,
table.t-Report-report td {
  padding: 0.4rem 0.75rem !important;
  font-family: var(--nc-font) !important;
  font-size: 1.15rem !important;
}
.a-IRR-table td {
  min-height: 44px !important;
  box-sizing: border-box !important;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}
table.t-Report-report td {
  min-height: 44px !important;
  box-sizing: border-box !important;
  padding: 10px 12px !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  color: var(--nc-fg) !important;
}
/* Classic Report — altura fixa de linha e listras alternadas (zebra)
   pra facilitar a leitura de linha em linha. */
table.t-Report-report tbody tr {
  min-height: 44px !important;
}
table.t-Report-report tbody tr:nth-child(odd) td {
  background: #ffffff !important;
}
table.t-Report-report tbody tr:nth-child(even) td {
  background: #f2f0f5 !important;
}
/* Aplica a fonte em todo o relatório (corpo, toolbar, paginação, etc.),
   exceto nos ícones — que dependem da própria fonte de ícones pra
   desenhar os glifos (senão viram caixinhas/texto sem sentido).
   [TESTE: .a-GV-region removido daqui pra diagnóstico do Interactive
   Grid — nossa fonte customizada pode ter métricas (altura de linha)
   um pouco diferentes da nativa, e isso podia estar confundindo o
   cálculo interno de altura das linhas.] */
.a-IRR-region *:not(.a-Icon):not(.t-Icon):not([class*="fa-"]),
.t-Report-report *:not(.a-Icon):not(.t-Icon):not([class*="fa-"]) {
  font-family: var(--nc-font) !important;
}
.a-IRR-table tbody tr:hover td,
table.t-Report-report tbody tr:hover td {
  background: var(--nc-primary-soft) !important;
}
/* Ícones de ação de linha do Interactive Report (imagens antigas do
   APEX, tipo gif) — escondemos a imagem original e desenhamos um
   ícone roxo no lugar, escolhido pelo nome do arquivo (src). Extensível:
   pra adicionar um novo ícone, é só criar um bloco igual a esses dois,
   trocando o "img[src*=...]" e o desenho do SVG. */
html body td a img[src*="e2.gif"],
html body td a img[src*="apex-edit-pencil.png"],
html body td a img[src*="zoomin.gif"] {
  display: none !important;
}
/* Lápis (editar) — e2.gif, apex-edit-pencil.png e apex-edit-pencil-alt.png
   (nomes nativos diferentes que o APEX usa pra mesma ação de editar,
   dependendo da tela/relatório) */
html body td a img[src*="apex-edit-pencil-alt.png"] {
  display: none !important;
}
html body td a:has(img[src*="e2.gif"]),
html body td a:has(img[src*="apex-edit-pencil.png"]),
html body td a:has(img[src*="apex-edit-pencil-alt.png"]) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 20px;
  height: 20px;
}
html body td a:has(img[src*="e2.gif"])::before,
html body td a:has(img[src*="apex-edit-pencil.png"])::before,
html body td a:has(img[src*="apex-edit-pencil-alt.png"])::before {
  content: "";
  display: inline-block;
  width: 17px;
  height: 17px;
  background-color: var(--nc-primary) !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  -webkit-mask-size: contain !important;
  mask-size: contain !important;
  -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 4H6a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-5'/%3E%3Cpath d='M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z'/%3E%3C/svg%3E") !important;
  mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 4H6a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-5'/%3E%3Cpath d='M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z'/%3E%3C/svg%3E") !important;
}
/* Lupa (visualizar) — zoomin.gif (nome provável; me avise se for outro) */
html body td a:has(img[src*="zoomin.gif"]) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 20px;
  height: 20px;
}
html body td a:has(img[src*="zoomin.gif"])::before {
  content: "";
  display: inline-block;
  width: 17px;
  height: 17px;
  background-color: var(--nc-primary) !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  -webkit-mask-size: contain !important;
  mask-size: contain !important;
  -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") !important;
  mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") !important;
}

.a-IRR-toolbar,
.a-IRR-searchBar { background: transparent; border-bottom: 1px solid var(--nc-border); }

/* ---------- Alerts / notifications ---------- */
.t-Alert--success .t-Alert-icon { background: var(--nc-success); }
.t-Alert--warning .t-Alert-icon { background: var(--nc-warning); }
.t-Alert--danger .t-Alert-icon { background: var(--nc-danger); }
.t-Alert--defaultIcons.t-Alert--info .t-Alert-icon { background: var(--nc-primary); }
#t_Alert_Success,
.t-Alert--horizontal.t-Alert--success { border-left: 4px solid var(--nc-success); }

/* A pedido: só na TELA DE LOGIN, o alerta "warning" (aviso de
   usuário/senha incorretos, com a contagem do throttle) usa um
   amarelo mais suave em vez do amarelo forte nativo do APEX. Fora do
   login, o warning continua com a cor nativa (sem esta regra). */
body.t-PageBody--login .t-Alert--colorBG.t-Alert--warning,
body.t-PageBody--login .t-Alert--warning.t-Alert--colorBG,
body.t-PageBody--login .t-Alert--warning {
  background-color: var(--nc-warning-soft) !important;
  border-color: var(--nc-warning-soft) !important;
}
body.t-PageBody--login .t-Alert--defaultIcons.t-Alert--warning .t-Alert-icon {
  background: var(--nc-warning-soft) !important;
}

/* Ícone do alerta "warning": mesmo problema do "info" (ver bloco lá em
   cima) — o ícone nativo do APEX (fonte de ícones) não estava
   renderizando e aparecia como um quadradinho vazio/bugado. Mesma
   solução: bolinha colorida sólida com o "!" desenhado via ::before,
   sem depender de nenhuma fonte de ícone. */
.t-Alert--warning .t-Alert-icon .t-Icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  border-radius: 50% !important;
  background-color: var(--nc-warning) !important;
  background-image: none !important;
  position: relative !important;
}
.t-Alert--warning .t-Alert-icon .t-Icon::before {
  content: "!" !important;
  display: block !important;
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

/* Ícone do alerta "danger" (erro — inclusive os erros de PL/SQL/pacotes
   do banco): mesmo problema do "info" e do "warning" (ver blocos acima)
   — o ícone nativo do APEX não estava renderizando e aparecia como um
   quadradinho vazio/bugado. Mesma solução: bolinha colorida sólida com
   um "×" desenhado via ::before, sem depender de nenhuma fonte de ícone. */
.t-Alert--danger .t-Alert-icon .t-Icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  border-radius: 50% !important;
  background-color: var(--nc-danger) !important;
  background-image: none !important;
  position: relative !important;
}
.t-Alert--danger .t-Alert-icon .t-Icon::before {
  content: "\00d7" !important;
  display: block !important;
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

/* Ícone do alerta "success": mesma lacuna encontrada no "danger" — a
   cor de fundo já existia, mas faltava o ícone desenhado via ::before.
   Corrigido do mesmo jeito, com um "✓" no lugar do "!"/"×". */
.t-Alert--success .t-Alert-icon .t-Icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  border-radius: 50% !important;
  background-color: var(--nc-success) !important;
  background-image: none !important;
  position: relative !important;
}
.t-Alert--success .t-Alert-icon .t-Icon::before {
  content: "\2713" !important;
  display: block !important;
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

/* ---------- Badges / status ---------- */
.t-Badge,
.nc-badge {
  background: var(--nc-primary-soft);
  color: var(--nc-primary-deep);
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 700;
  padding: 0.15rem 0.6rem;
}

/* ---------- Wizard nativo do UT (t-WizardSteps) ---------- */
.t-WizardSteps {
  background: #fff;
  border: 1px solid var(--nc-border);
  border-radius: var(--nc-radius);
  box-shadow: var(--nc-shadow);
  padding: 0.5rem;
}
.t-WizardSteps-wrap { border: 0; }
.t-WizardSteps-item.is-active .t-WizardSteps-label { color: var(--nc-primary-deep); font-weight: 700; }
.t-WizardSteps-item.is-active .t-WizardSteps-marker {
  background: var(--nc-primary);
  border-color: var(--nc-primary);
  color: #fff;
}
.t-WizardSteps-item.is-complete .t-WizardSteps-marker {
  background: var(--nc-success);
  border-color: var(--nc-success);
  color: #fff;
}

/* ---------- Stepper injetado pelo natcorp.js ---------- */
.nc-stepper {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.5rem;
  margin: 0 0 1rem;
  padding: 0.6rem;
  background: #fff;
  border: 1px solid var(--nc-border);
  border-radius: var(--nc-radius);
  box-shadow: var(--nc-shadow);
  list-style: none;
}
.nc-stepper__item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.65rem 0.9rem;
  border-radius: var(--nc-radius);
  background: transparent;
  border: 1px solid transparent;
  cursor: pointer;
  text-align: left;
  min-width: 0;
  font: inherit;
}
.nc-stepper__item:hover:not(.is-active) { background: var(--nc-primary-soft); }
.nc-stepper__item.is-active {
  background: var(--nc-primary);
}
.nc-stepper__num {
  display: grid;
  place-items: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 999px;
  background: var(--nc-border);
  color: var(--nc-ink);
  font-size: 12px !important;
  font-weight: 800;
  flex: 0 0 auto;
}
.nc-stepper__item.is-pending:not(.is-active) .nc-stepper__num {
  background: var(--nc-danger);
  color: #fff;
}
.nc-stepper__item.is-error:not(.is-active) .nc-stepper__num {
  background: var(--nc-primary);
  color: #fff;
}
.nc-stepper__item.is-ok:not(.is-active) .nc-stepper__num {
  background: var(--nc-success);
  color: #fff;
}
.nc-stepper__item.is-active .nc-stepper__num {
  background: #fff;
  color: var(--nc-primary);
}
.nc-stepper__text {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 0.1rem;
}
.nc-stepper__label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px !important;
  font-weight: 700;
  color: var(--nc-ink);
}
.nc-stepper__item.is-active .nc-stepper__label {
  color: #fff;
}
.nc-stepper__status {
  font-size: 10.88px !important;
  font-weight: 600;
  color: var(--nc-muted);
}
.nc-stepper__item.is-pending .nc-stepper__status { color: var(--nc-danger); }
.nc-stepper__item.is-error .nc-stepper__status { color: var(--nc-danger); }
.nc-stepper__item.is-ok .nc-stepper__status { color: var(--nc-success); }
.nc-stepper__item.is-active .nc-stepper__status {
  color: rgba(255, 255, 255, 0.85) !important;
}

/* Cabeçalho destacado de seção no modo página única */
/* Cartão de destaque (bolinha + título + subtítulo) no topo de cada
   etapa — só aparece no modo "Página única", pra identificar de qual
   etapa é cada bloco quando todas ficam visíveis empilhadas. No modo
   "Etapas" fica escondido, já que a aba ativa já mostra essa info.
   Réplica exata do elemento de referência do protótipo. */
.nc-section-heading {
  display: none;
}
.nc-stepper-host.nc-mode-unica .nc-section-heading {
  display: flex !important;
  min-width: 0;
  align-items: center;
  gap: 14px;
  margin: 0 0 8px;
  padding: 14px 16px;
  border: 1px solid var(--nc-primary-border);
  border-radius: 12px;
  background: linear-gradient(
    to right,
    rgba(var(--nc-primary-rgb), 0.1),
    rgba(var(--nc-primary-rgb), 0.06),
    transparent
  );
}
/* Etapa sem conteúdo (marcada via JS com nc-section-empty) — esconde o
   cartão de destaque também, não só o botão do stepper. Especificidade
   mais alta que a regra de "mostrar" acima, pra vencer o !important. */
.nc-stepper-host.nc-mode-unica .nc-section.nc-section-empty .nc-section-heading {
  display: none !important;
}
.nc-section-heading__num {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  border-radius: 999px;
  background: var(--nc-primary);
  color: #fff;
  font-family: var(--nc-font);
  font-size: 14px;
  font-weight: 700;
  box-shadow: var(--nc-shadow-xs);
}
.nc-section-heading__text {
  min-width: 0;
}
.nc-section-heading__title {
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--nc-font);
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.025em;
  color: var(--nc-ink);
}
.nc-section-heading__subtitle {
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--nc-font);
  font-size: 14px;
  font-weight: 400;
  color: var(--nc-muted);
}

/* Alternador Etapas / Página única */
.nc-viewtoggle {
  display: inline-flex;
  gap: 0.5rem;
  margin: 0 0 0.75rem;
}
.nc-viewtoggle button {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  border: 1px solid var(--nc-input);
  background: var(--nc-card);
  border-radius: var(--nc-radius-md);
  padding: 0.55rem 1.1rem;
  font: inherit;
  font-size: 12px !important;
  font-weight: 700;
  color: var(--nc-primary);
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.nc-viewtoggle button svg {
  width: 1.1rem;
  height: 1.1rem;
  flex: 0 0 auto;
}
.nc-viewtoggle button:hover:not(.is-active) {
  background: var(--nc-primary-soft);
}
.nc-viewtoggle button.is-active {
  background: var(--nc-primary);
  border-color: var(--nc-primary);
  color: #fff;
}

/* ---------- Responsividade ---------- */
@media (min-width: 640px) {
  .nc-stepper { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 992px) {
  .nc-stepper { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1280px) {
  .nc-stepper { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  .t-Region-body { padding: 0.75rem; }
  .t-Form-fieldContainer { margin-bottom: 0.7rem; }
  .t-ButtonRegion .t-Button { width: 100%; margin-bottom: 0.4rem; }
  .a-IRR-toolbar { flex-wrap: wrap; }
}

/* Evita o "estouro" horizontal comum em formulários APEX densos */
.t-Body-contentInner,
.t-Region-body,
.t-Form-fieldContainer,
.t-Form-inputContainer { min-width: 0; }
.apex-item-text,
.apex-item-select,
.apex-item-textarea { max-width: 100%; }

/* Faixa de botões de região (topo/rodapé) — o tema nativo mostra essa
   área com borda mesmo sem nenhum botão configurado, deixando uma
   caixa vazia visível. Escondemos sempre que estiver genuinamente
   vazia (os dois lados sem nada dentro). */
html body .t-Region-buttons--top:has(.t-Region-buttons-left:empty):has(.t-Region-buttons-right:empty),
html body .t-Region-buttons--bottom:has(.t-Region-buttons-left:empty):has(.t-Region-buttons-right:empty) {
  display: none !important;
}

/* Left Side Column — garante que nenhum item "estoure" a largura
   estreita da coluna lateral (campos, botões, selects, etc.). Cobre os
   nomes de classe mais prováveis pra essa região no Universal Theme. */
html body .t-Body-side,
html body .t-Body-side *:not(button):not(.a-Button),
html body .apex-side-nav .t-Region,
html body .apex-side-nav .t-Region *:not(button):not(.a-Button) {
  box-sizing: border-box !important;
  max-width: 100% !important;
  min-width: 0 !important;
}
html body .t-Body-side .t-Region-body,
html body .apex-side-nav .t-Region-body {
  overflow-x: hidden !important;
}

/* ---------- Impressão ---------- */
@media print {
  .t-Header, .t-Body-nav, .nc-stepper, .nc-viewtoggle, .t-ButtonRegion { display: none !important; }
  .t-Region { box-shadow: none; border-color: #ccc; }
}

/* ---------- Campo de busca do menu superior (#P9999_SEARCH) ---------- */
/* Esse campo é especial: fica escondido/recolhido por padrão e só
   expande (com animação via JS nativo) quando clicado na lupa,
   trocando a cor de fundo entre branco e transparente. Excluímos ele
   da nossa regra genérica de campo de texto (lá em cima, com
   :not(#P9999_SEARCH)) E reforçamos aqui com um valor explícito, já
   que só a exclusão não bastou pra garantir o tamanho compacto. */
html body input#P9999_SEARCH,
html body input#P9999_SEARCH#P9999_SEARCH {
  height: 20px !important;
  min-height: 0 !important;
  max-height: none !important;
  line-height: 20px !important;
  padding: 0 4px !important;
  font-size: 12px !important;
  border: 0 !important;
  box-shadow: none !important;
  box-sizing: content-box !important;
}

/* ---------- Tema Standard Natcorp: cabeçalho sem degradê ---------- */
/* Os outros temas usam um degradê (escuro -> claro) no cabeçalho. No
   tema Standard, a pedido, isso vira uma cor sólida única, sem efeito
   de gradiente. (A parte de cor dos botões foi removida — estava
   conflitando com a prioridade do "Remove UI Decoration".) */
html.nc-theme-standard .t-Header,
html.nc-theme-standard .t-Header-branding {
  background: var(--nc-primary) !important;
}

/* ---------- Campo dentro do Popup LOV de múltiplos valores —
   reforço final ---------- */
/* Esse <input readonly> (dentro de <li class="apex-item-multi-item">)
   tem as mesmas classes do popup LOV comum (apex-item-text,
   apex-item-popup-lov), então pega sem querer o visual de "caixa
   cheia" (borda + fundo) da regra base de normalização de campo —
   que usa o truque :not(#P9999_SEARCH) e por isso carrega
   especificidade de ID, vencendo até regras declaradas depois no
   arquivo. Reforçado aqui com o mesmo truque (:not(#nc-fake-id) +
   :not(.a-GV *) etc., igual usado em outros pontos do arquivo) pra
   empatar/vencer essa especificidade e realmente ficar "sem caixa",
   já que o campo visual de verdade é o <ul class="apex-item-multi">
   em volta (que já tem a borda/fundo dele). */
html body ul.apex-item-multi input.apex-item-text:not(#nc-fake-id):not(.a-GV *):not(.a-GV-columnItemContainer *) {
  border: 0 !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  box-shadow: none !important;
  min-height: 0 !important;
  height: 28px !important;
  padding: 0 !important;
  margin: 0 !important;
}
/* REVERTIDO (a pedido) — esse campo estava com display:none,
   escondendo ele por completo (e junto o placeholder). Voltou a
   aparecer normalmente; a regra logo acima já deixa ele "sem caixa"
   (borda/fundo transparente, sem padding), então não deve repetir o
   visual de "quadrado" que motivou esconder no passado. Se aparecer
   algo estranho, ajustar aqui pontualmente. */
/* ==========================================================================
   MELHORIAS: INTERACTIVE REPORT, INTERACTIVE GRID, CLASSIC REPORT
   (variáveis --nat-* mapeadas para as variáveis --nc-* do sistema)
   ========================================================================== */

/* ---------- INTERACTIVE REPORT ---------- */
html body .a-IRR {
  overflow: hidden;
  border: 1px solid var(--nc-border) !important;
  border-radius: var(--nc-radius) !important;
  background: var(--nc-card) !important;
  box-shadow: var(--nc-shadow) !important;
  font-size: 13px !important;
}
html body .a-IRR-toolbar {
  padding: 10px 12px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--nc-border) !important;
  background: var(--nc-card) !important;
}
html body .a-IRR-search-field {
  height: 38px !important;
  min-height: 38px !important;
  border-radius: 999px !important;
  background: var(--nc-muted-bg) !important;
}
html body .a-IRR-button {
  min-height: 36px !important;
  border: 1px solid var(--nc-border) !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: var(--nc-graphite) !important;
  box-shadow: none !important;
  font-weight: 700 !important;
}
html body .a-IRR-button:hover,
html body .a-IRR-button:focus {
  background: var(--nc-muted-bg) !important;
  border-color: var(--nc-primary-glow) !important;
  color: var(--nc-primary) !important;
}
/* Interactive Grid — mesmo estilo de pílula arredondada da barra de
   ferramentas (busca, Editar, Salvar, Ações, Adicionar Linha,
   Redefinir), sem tocar em nada da tabela em si (fonte/altura/
   padding da grid continuam 100% nativos, de propósito). */
html body .a-Toolbar-inputText {
  height: 38px !important;
  min-height: 38px !important;
  border-radius: 999px !important;
  background: var(--nc-muted-bg) !important;
  border: 0 !important;
}
html body .a-IG-header .a-Toolbar-item.a-Button,
html body .a-IG-header label.a-Button {
  min-height: 36px !important;
  border: 1px solid var(--nc-border) !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: var(--nc-graphite) !important;
  box-shadow: none !important;
  font-weight: 700 !important;
}
html body .a-IG-header .a-Toolbar-item.a-Button:hover,
html body .a-IG-header label.a-Button:hover {
  background: var(--nc-muted-bg) !important;
  border-color: var(--nc-primary-glow) !important;
  color: var(--nc-primary) !important;
}
html body .a-IG-header .a-Toolbar-item.a-Button.a-Button--hot {
  background: linear-gradient(135deg, var(--nc-primary), var(--nc-primary-glow)) !important;
  border-color: var(--nc-primary-deep) !important;
  color: #fff !important;
}
/* "1. Relatório Primário" e "Linhas" (selects nativos do toolbar) —
   mesma borda arredondada em pílula que já usamos no campo de busca
   e no botão "Ações", pra ficar tudo visualmente igual. */
html body .a-IRR-selectList {
  height: 36px !important;
  min-height: 36px !important;
  border: 1px solid var(--nc-border) !important;
  border-radius: 999px !important;
  background-color: #fff !important;
  color: var(--nc-graphite) !important;
  font-weight: 700 !important;
  padding: 0 32px 0 14px !important;
}
html body .a-IRR-selectList:hover,
html body .a-IRR-selectList:focus {
  border-color: var(--nc-primary-glow) !important;
  outline: none !important;
}
html body .a-IRR-rowSelector label {
  font-weight: 600 !important;
  color: var(--nc-muted) !important;
}
html body .a-IRR-header.a-IRR-header {
  padding: 8px 12px !important;
  border-color: var(--nc-border) !important;
  background: var(--nc-primary-soft) !important;
  color: var(--nc-primary-deep) !important;
  box-shadow: none !important;
}
/* Cabeçalho de grupo (Group By / quebra de controle) — texto solto
   direto na célula, sem span/link — reduz o tamanho da fonte. */
html body .a-IRR-header.a-IRR-header--group {
  font-size: 11.5px !important;
  font-weight: 700 !important;
}
html body .a-IRR-headerLink {
  color: var(--nc-primary-deep) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .08em;
  text-transform: uppercase;
}
/* Modo de quebra de controle (Control Break) usa um <span> simples
   em vez do link de ordenação — mesmo padrão visual do cabeçalho
   normal do Interactive Report. */
html body .a-IRR-headerLabel {
  color: var(--nc-primary-deep) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .08em;
  text-transform: uppercase;
}
html body .a-IRR-header:hover {
  background: var(--nc-muted-bg) !important;
}
html body .a-IRR-header.is-active {
  background: var(--nc-primary) !important;
  color: #fff !important;
}
html body .a-IRR-header.is-active .a-IRR-headerLink {
  color: #fff !important;
}
html body .a-IRR-table td {
  padding: 10px 12px !important;
  border-color: var(--nc-border) !important;
  background: #fff;
  color: var(--nc-ink) !important;
  font-size: 13px !important;
}
html body .a-IRR-table tr:hover td {
  background: var(--nc-muted-bg) !important;
}
html body .a-IRR-pagination-label,
html body .a-IRR-reportSummary-value {
  color: var(--nc-muted) !important;
  font-size: 12px !important;
}
html body .a-IRR-pagination-item a,
html body .a-IRR-pagination-item button {
  min-width: 32px;
  min-height: 32px;
  border: 1px solid var(--nc-border) !important;
  border-radius: 10px !important;
  background: #fff !important;
  color: var(--nc-graphite) !important;
}

/* ---------- INTERACTIVE GRID ---------- */
html body .a-IG {
  overflow: hidden;
  border: 1px solid var(--nc-border) !important;
  border-radius: var(--nc-radius) !important;
  background: var(--nc-card) !important;
  box-shadow: var(--nc-shadow) !important;
}
html body .a-IG-header,
html body .a-IG .a-Toolbar {
  border: 0 !important;
  border-bottom: 1px solid var(--nc-border) !important;
  background: var(--nc-card) !important;
}
html body .a-IG-header .a-Toolbar-button {
  border: 1px solid var(--nc-border) !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: var(--nc-graphite) !important;
  box-shadow: none !important;
}
html body .a-IG-header .a-Toolbar-button:hover {
  background: var(--nc-muted-bg) !important;
  color: var(--nc-primary) !important;
}
html body .a-GV-header.a-GV-header,
html body .a-GV-headerGroup.a-GV-headerGroup {
  border-color: var(--nc-border) !important;
  background: var(--nc-card) !important;
  color: var(--nc-muted) !important;
  box-shadow: none !important;
}
html body .a-GV-headerLabel {
  color: var(--nc-muted) !important;
  font-family: var(--nc-font) !important;
}
html body .a-GV-header.is-active,
html body .a-GV-header.is-focused {
  background: var(--nc-primary) !important;
  color: #fff !important;
}
html body .a-GV-header.is-active .a-GV-headerLabel,
html body .a-GV-header.is-focused .a-GV-headerLabel {
  color: #fff !important;
}
html body .a-GV-cell {
  border-color: var(--nc-border) !important;
  background: #fff;
  color: var(--nc-ink) !important;
  font-family: var(--nc-font) !important;
}
/* Área abaixo das linhas de dados (espaço reservado pra clicar e
   adicionar um novo registro) — garante fundo igual tanto na parte
   fixa (checkbox) quanto na parte rolável (dados), pra não parecer
   um vão desencontrado entre as duas metades da grid. */
html body .a-GV-bdy,
html body .a-GV-w-frozen,
html body .a-GV-w-scroll,
html body .a-GV-table {
  background: #fff !important;
}
html body .a-GV-row:hover .a-GV-cell {
  background: var(--nc-muted-bg) !important;
}
html body .a-GV-row.is-selected .a-GV-cell,
html body .a-GV-table tr.is-selected .a-GV-cell {
  background: var(--nc-primary-soft) !important;
}
html body .a-GV-table .a-GV-cell.is-focused,
html body .a-GV-table .a-GV-header.is-focused,
html body .a-GV-table .a-GV-headerGroup.is-focused {
  box-shadow: inset 0 0 0 1px var(--nc-primary) !important;
}
html body .a-GV-footer {
  border-color: var(--nc-border) !important;
  background: #fff !important;
  color: var(--nc-muted) !important;
}

/* ---------- CLASSIC REPORT / TABLES ---------- */
html body .t-Report-report {
  border-collapse: collapse;
  background: #fff !important;
  color: var(--nc-ink) !important;
  font-size: 13px !important;
}
html body .t-Report-colHead.t-Report-colHead {
  padding: 8px 12px !important;
  border-color: var(--nc-border) !important;
  background: var(--nc-primary-soft) !important;
  color: var(--nc-primary-deep) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .08em;
  text-transform: uppercase;
}
html body .t-Report-cell {
  padding: 10px 12px !important;
  border-color: var(--nc-border) !important;
  color: var(--nc-ink) !important;
}
html body .t-Report-report tr:hover .t-Report-cell,
html body .t-Report--rowHighlight .t-Report-report tr:hover .t-Report-cell {
  background: var(--nc-muted-bg) !important;
}
html body .t-Report-paginationText {
  color: var(--nc-muted) !important;
  font-size: 12px !important;
}
html body .t-Report-paginationText a {
  color: var(--nc-primary) !important;
  font-weight: 700;
}

/* Bar chart nativo do APEX. */
html body .a-BarChart .a-BarChart-bar {
  background: var(--nc-border) !important;
}
html body .a-BarChart-filled {
  background: var(--nc-primary) !important;
}
html body .a-BarChart .a-BarChart-item:hover {
  background: var(--nc-muted-bg) !important;
}

/* ---------- Preview de dispositivo ---------- */
/* Encolhe e centraliza a página inteira numa "moldura", simulando a
   largura de um celular ou tablet, direto na própria página (sem
   abrir nada por cima) — igual o comportamento do protótipo.
   Atenção: é uma aproximação visual; como o navegador continua
   "vendo" a largura real da tela, media queries nativas não
   disparam de verdade (diferente do modo dispositivo do F12). */
html.nc-preview-mobile,
html.nc-preview-tablet {
  background: #d9d9d9 !important;
}
/* Modal Dialog (jQuery UI) — por padrão, o JS dele centraliza na
   TELA TODA (position:fixed com left/top calculados via inline
   style), estourando pra fora da nossa moldura. Trava a largura
   máxima e recalcula a posição horizontal pra ficar centralizado
   DENTRO da moldura, não da tela inteira. */
html.nc-preview-mobile .ui-dialog {
  max-width: 370px !important;
  left: calc(50% - 185px) !important;
}
html.nc-preview-tablet .ui-dialog {
  max-width: 740px !important;
  left: calc(50% - 370px) !important;
}
html.nc-preview-mobile body,
html.nc-preview-tablet body {
  position: relative !important;
  margin: 20px auto !important;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08), 0 20px 50px rgba(0, 0, 0, 0.25) !important;
  border-radius: 18px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  min-height: calc(100vh - 40px) !important;
  max-height: calc(100vh - 40px) !important;
}
html.nc-preview-mobile body {
  max-width: 390px !important;
}
html.nc-preview-tablet body {
  max-width: 768px !important;
}
html.nc-preview-mobile .t-Header,
html.nc-preview-tablet .t-Header {
  position: absolute !important;
  width: 100% !important;
  max-width: inherit !important;
  left: 0 !important;
  right: auto !important;
  top: 0 !important;
}
html.nc-preview-mobile .t-Body-nav,
html.nc-preview-tablet .t-Body-nav {
  position: absolute !important;
}
/* A pedido: quando o menu está RECOLHIDO (só ícones) no modo
   Celular/Tablet, esconde ele por completo em vez de deixar
   "flutuando" por cima do conteúdo — a faixa estreita de ícones
   sobrepondo o texto ficava feio/confuso, especialmente em telas com
   bastante filtro. Isso também é mais parecido com um app mobile de
   verdade: o menu fica escondido até o usuário tocar no hambúrguer
   pra expandir (aí sim ele aparece, ocupando o espaço reservado). */
html.nc-preview-mobile body.js-navCollapsed .t-Body-nav,
html.nc-preview-tablet body.js-navCollapsed .t-Body-nav {
  display: none !important;
}
/* Como o menu agora fica TOTALMENTE escondido quando recolhido (ver
   regra acima), não tem mais risco de sobreposição — zera de vez essa
   margem nativa (240/288px, o valor varia por aplicação) que reserva
   espaço pro menu, já que ele nem está mais visível pra precisar
   desse espaço. */
html.nc-preview-mobile body.js-navCollapsed .t-Body-content,
html.nc-preview-tablet body.js-navCollapsed .t-Body-content {
  margin-left: 0 !important;
}
/* Quando o menu lateral está RECOLHIDO (só ícones), ele continua
   "flutuando" por cima do conteúdo (position:absolute) — dá um
   respiro à esquerda pro conteúdo não ficar embaixo dele. O valor
   exato é medido e aplicado via JavaScript (largura real do menu),
   não um número fixo chutado. */
html.nc-preview-mobile body.js-navCollapsed .t-Body-main,
html.nc-preview-tablet body.js-navCollapsed .t-Body-main {
  box-sizing: border-box !important;
}
/* Regra NATIVA do tema Oracle (não nossa) força margin-left:240px em
   .t-Body-content a partir de 641px de largura de tela — só ativa no
   modo Tablet (768px), nunca no Celular (390px, abaixo do
   breakpoint). O controle de quando zerar (só quando recolhido) é
   feito via JavaScript agora, não mais só por CSS — a combinação de
   classes não estava reagindo de forma confiável nesse cenário de
   iframe aninhado. */
/* Espaçador invisível que reservava altura pro cabeçalho — zera pra
   não deixar esse vão vazio em cima do relatório. */
html.nc-preview-mobile #t_Body_content_offset,
html.nc-preview-tablet #t_Body_content_offset {
  height: 0 !important;
}
/* A margem do .t-Body-content é controlada via JavaScript agora
   (mede a largura real do menu, em vez de adivinhar por nome de
   classe) — ver ncAdjustNativeSidebarMargin no arquivo JS. */
/* O container do relatório tem padding lateral próprio (deixa um
   vão à esquerda) que o Filtro não tem, já que fica em outro lugar
   da estrutura — zera pra alinhar os dois igual. */
html.nc-preview-mobile .t-Body-content .container,
html.nc-preview-tablet .t-Body-content .container {
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 100% !important;
}
html.nc-preview-mobile .t-Body-content .row,
html.nc-preview-tablet .t-Body-content .row {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
html.nc-preview-mobile .t-Body-content [class*="col-"],
html.nc-preview-tablet .t-Body-content [class*="col-"] {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
/* A pedido: qualquer coluna lado a lado (regiões OU itens de
   formulário) empilha verticalmente no modo Celular/Tablet — em
   QUALQUER lugar da página (não só no conteúdo principal), incluindo
   dentro de Modais. Evita colunas ficarem espremidas/cortadas. */
html.nc-preview-mobile .row > [class*="col-"],
html.nc-preview-tablet .row > [class*="col-"] {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  width: 100% !important;
}
html.nc-preview-mobile .t-Form-labelContainer[class*="col-"],
html.nc-preview-tablet .t-Form-labelContainer[class*="col-"],
html.nc-preview-mobile .t-Form-inputContainer[class*="col-"],
html.nc-preview-tablet .t-Form-inputContainer[class*="col-"] {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  width: 100% !important;
}
/* Página com breadcrumb (usa .t-Body-title) também vem posicionada
   de forma flutuante nativamente — empilha normalmente, senão fica
   sobrepondo o Filtro (que já empilhamos acima). Ajuste minimalista,
   só tirando do posicionamento flutuante, sem mexer em mais nada. */
html.nc-preview-mobile .t-Body-title,
html.nc-preview-tablet .t-Body-title {
  position: static !important;
  top: auto !important;
  width: 100% !important;
}
html.nc-preview-mobile .t-Body-side,
html.nc-preview-tablet .t-Body-side {
  position: static !important;
  width: 100% !important;
  max-width: 100% !important;
  left: auto !important;
  top: auto !important;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
html.nc-preview-mobile .t-Body-side ~ *,
html.nc-preview-tablet .t-Body-side ~ * {
  margin-top: 0 !important;
  padding-top: 0 !important;
}
html.nc-preview-mobile .t-Body-content > .container > .row,
html.nc-preview-tablet .t-Body-content > .container > .row {
  margin-top: 0 !important;
}
/* Cabeçalhos "grudentos" (sticky) de relatórios/grids — o widget
   nativo do APEX (Sticky Widget, classe .js-stickyTableHeader)
   calcula uma largura fixa em pixels via JS, baseada na tabela
   real (bem mais larga que a moldura), e por isso vaza pra fora.
   Trava a largura desse cabeçalho pro tamanho do container. */
html.nc-preview-mobile .t-fht-wrapper,
html.nc-preview-tablet .t-fht-wrapper {
  overflow: hidden !important;
  position: relative !important;
}
/* Desistimos de fazer esse cabeçalho "seguir" a rolagem no modo
   Celular/Tablet — depois de várias tentativas, continuava
   quebrando de formas diferentes. Agora ele fica estático (rola
   junto com a tabela normalmente, sem "grudar" no topo), que é o
   comportamento mais simples e confiável. */
html.nc-preview-mobile .js-stickyTableHeader,
html.nc-preview-tablet .js-stickyTableHeader {
  display: none !important;
}
html.nc-preview-mobile .t-fht-tbody,
html.nc-preview-tablet .t-fht-tbody {
  margin-top: 0 !important;
}
html.nc-preview-mobile .t-fht-tbody table,
html.nc-preview-tablet .t-fht-tbody table {
  margin-top: 0 !important;
}
html.nc-preview-mobile .js-stickyWidget-placeholder,
html.nc-preview-tablet .js-stickyWidget-placeholder {
  display: none !important;
}
/* Relatórios (Interactive Report/Grid, Classic Report) mais largos
   que a moldura precisam de rolagem HORIZONTAL própria, já que a
   página toda tem overflow-x:hidden (pra não vazar a moldura). */
html.nc-preview-mobile .a-IRR,
html.nc-preview-tablet .a-IRR,
html.nc-preview-mobile .a-IG,
html.nc-preview-tablet .a-IG,
html.nc-preview-mobile .t-Region-body:has(table.t-Report-report),
html.nc-preview-tablet .t-Region-body:has(table.t-Report-report) {
  overflow-x: auto !important;
  max-width: 100% !important;
  -webkit-overflow-scrolling: touch !important;
}
html.nc-preview-mobile .t-fht-tbody,
html.nc-preview-tablet .t-fht-tbody {
  overflow-x: visible !important;
}

/* Destaque bem claro de qual opção (Celular/Tablet/Desktop) está
   selecionada no momento — fundo sólido + contorno, pra não deixar
   dúvida nenhuma pro usuário. */
html body .nc-preview-navitem button {
  position: relative !important;
}
html body .nc-preview-navitem button.is-active {
  background: rgba(255, 255, 255, 0.25) !important;
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.9) !important;
  border-radius: 6px !important;
}

/* ---------- Ícones dos Cards (pedido do chefe) ---------- */
html body .t-Card-desc.t-Card-desc,
html body .t-Card-info.t-Card-info,
html body .t-Card-subtitle.t-Card-subtitle {
  color: var(--nc-muted) !important;
  font-size: 12px !important;
}
html body .t-Card-icon.t-Card-icon,
html body .t-Card-colorFill.t-Card-colorFill {
  background: linear-gradient(135deg, var(--nc-primary), var(--nc-primary-glow)) !important;
  background-blend-mode: normal !important;
  color: #fff !important;
}
html body .t-Card-icon.t-Card-icon {
  border-radius: 16px !important;
  box-shadow: 0 12px 24px -18px rgba(var(--nc-primary-rgb), .75);
}

/* Região "Filtros" (Left Side Column) — a redução de fonte quando um
   texto específico não cabe é feita via JavaScript agora
   (ncShrinkOverflowingText, no arquivo JS), medindo texto por texto
   — só some COM ISSO se realmente estourar, o resto mantém o
   tamanho padrão normalmente. Classe aplicada dinamicamente: */
html body .t-Body-side .nc-text-shrunk {
  font-size: 90% !important;
}

/* Coluna lateral estreita (Left Side Column): o ícone decorativo de
   44x44 (quadradinho roxo) que a skin adiciona antes de todo título de
   região via ::before não aparece aqui — é só estético, então some
   pra sobrar espaço e o texto do título ficar sempre do lado do botão
   de recolher/expandir, sem cortar. */
html body .t-Body-side .t-Region:not(.nc-section):not(.t-Region--removeHeader):not(.t-Region--noUI) > .t-Region-header .t-Region-headerItems--title::before {
  content: none !important;
  display: none !important;
}

/* Campo de busca do menu de filtro de coluna (Interactive Report/
   Grid) — o nativo do APEX usa texto branco + fundo quase
   transparente (pensado pra ficar em cima de um fundo escuro do
   próprio menu). Se esse fundo escuro não aparecer corretamente por
   qualquer motivo, o campo fica branco sobre branco, ilegível. Por
   segurança, força cores fixas e sempre legíveis aqui, sem depender
   de tema nem do fundo por trás. */
html body .a-IRR-sortWidget-searchField,
html body input.a-IRR-sortWidget-searchField {
  background-color: #ece8f0 !important;
  color: #2b2233 !important;
  caret-color: #2b2233 !important;
}
html body .a-IRR-sortWidget-searchField::placeholder {
  color: #2b2233 !important;
  opacity: 1 !important;
}
/* Ícone da lupinha ao lado do campo "Filtrar..." — vinha branco
   (invisível em cima do fundo claro). O ícone é desenhado pelo
   próprio <label> (via ::before/::after com fonte de ícone). */
html body .a-IRR-sortWidget .a-Icon,
html body .a-IRR-sortWidget [class*="icon-"],
html body .a-IRR-sortWidget-searchLabel,
html body .a-IRR-sortWidget-searchLabel::before,
html body .a-IRR-sortWidget-searchLabel::after {
  color: #2b2233 !important;
}
/* Itens da lista de valores desse mesmo menu (ex.: "Abril",
   "Demonstração") — mesma lógica: força cores fixas e sempre
   legíveis, tanto no estado normal quanto ao passar o mouse (que era
   o caso que ficava ilegível: fundo escuro + texto escuro). */
html body .a-IRR-sortWidget-row {
  background-color: #ffffff !important;
  color: #2b2233 !important;
}
html body .a-IRR-sortWidget-row:hover,
html body .a-IRR-sortWidget-row:focus,
html body .a-IRR-sortWidget-row.is-highlighted {
  background-color: #5b2a86 !important;
  color: #ffffff !important;
}

/* Campo de pesquisa da caixinha de Popup LOV (Pesquisar valores) — a
   lupinha (span.icon-search) fica do lado ESQUERDO do texto, igual
   os campos de usuário/senha da tela de login. Esse input tem a
   classe apex-item-text, então caía na regra base de campo (padding:
   0 12px, sem reservar espaço pro ícone), fazendo o texto digitado
   passar por baixo da lupinha. Mesmo ajuste de padding-left usado
   nos campos com ícone da tela de login, reforçado com o mesmo
   truque de especificidade (:not(#nc-fake-id)) — sem mexer na
   posição nativa do ícone. */
html body input.a-PopupLOV-search.apex-item-text:not(#nc-fake-id):not(.a-GV *):not(.a-GV-columnItemContainer *) {
  padding-left: 34px !important;
}

/* =====================================================================
   TELA DE LOGIN — redesign v2 (fiel ao protótipo aprovado). Classe
   real confirmada no HTML: <body class="t-PageBody--login ...">.
   Estrutura do form nativo:
     .t-Login-container > .container > .row > .col > .t-Login-region
       > .t-Login-header (logo + título)
       > .t-Login-body (campos)
       > .t-Login-buttons (Entrar/SSO/Alterar/Esqueci)
   Caminhos de imagem abaixo são placeholders — trocar pelos caminhos
   reais assim que os 3 arquivos forem subidos como Static Workspace
   Files (padrão: natcorp/r/files/static/vXXXX/NOME.ext).
   IMPORTANTE: a pedido, essa tela NUNCA acompanha o tema de cor
   escolhido no seletor — as cores aqui são FIXAS (não usam var(--nc-
   ...)), sempre as mesmas independente do tema ativo no resto do
   sistema. */

/* Esconde APENAS a região nativa "Fazendo Login" (id="FAZENDO_LOGIN"),
   que o próprio APEX usa só durante o envio do formulário e que às
   vezes deixava uma borda sem conteúdo visível por baixo do nosso
   layout novo.
   CORRIGIDO: antes o seletor mirava ".t-Alert" de forma genérica, o
   que também escondia o alerta REAL de erro de login ("Dados de
   Usuário e/ou Senha incorretos...", com a contagem regressiva do
   throttle nativo) — os dois usam a mesma classe .t-Alert, então a
   regra genérica apagava as duas coisas. Agora mira só o id
   FAZENDO_LOGIN, que é sempre vazio mesmo (não é o alerta de erro). */
html:not([class*="app-LOGIN_STEFANINI"]) body.t-PageBody--login .t-Login-region .container:has(#FAZENDO_LOGIN),
html[class*="app-LOGIN_STEFANINI"] body:not(:has(#P2_VERIFICATION_CODE)).t-PageBody--login .t-Login-region .container:has(#FAZENDO_LOGIN),
html:not([class*="app-LOGIN_STEFANINI"]) body.t-PageBody--login #FAZENDO_LOGIN,
html[class*="app-LOGIN_STEFANINI"] body:not(:has(#P2_VERIFICATION_CODE)).t-PageBody--login #FAZENDO_LOGIN {
  display: none !important;
}
/* Resquício de HTML antigo (de antes deste redesign do login) — uma
   <div class="image"></div> vazia, que ficou presa direto no HTML de
   algumas páginas de login específicas (ex.: "Alterar Senha"), usada
   antigamente pra desenhar uma logo via CSS content:url(). Ela nem
   deveria renderizar (o HTML original a coloca dentro do <head>), mas
   o navegador "recupera" esse erro e acaba jogando ela pra dentro do
   <body> mesmo assim, aparecendo deslocada por cima do layout novo.
   Só esconde quando estiver VAZIA e dentro da tela de login — não
   mexe em nenhuma outra ".image" real que exista em outro lugar do
   sistema (classe genérica demais pra esconder sem esse escopo). O
   ideal ainda é remover esse <style>/<div> direto no HTML Header da
   página no Page Designer, mas isso aqui evita o estrago visual
   enquanto isso não é feito. */
body.t-PageBody--login div.image:empty {
  display: none !important;
}
/* Qualquer OUTRA região solta na tela de login (fora do cartão em
   si) — não deveria existir nenhuma, então esconde de forma
   genérica, sem depender de um ID específico (que muda de
   aplicação pra aplicação). */
html body.t-PageBody--login .row > [class*="col-"] > .t-Region:not(.t-Login-region) {
  display: none !important;
}

/* CORREÇÃO CRÍTICA: o template nativo do login tem um <style> inline
   travando ".t-Body" com position:absolute + top/left/right/bottom:0
   (do tamanho exato da tela, sem rolagem). Como agora o conteúdo
   ficou mais alto que a tela (por causa da logo acima do cartão),
   sem essa correção a parte de baixo do formulário fica cortada e
   impossível de rolar até ela. Troca pra permitir rolagem vertical
   quando o conteúdo não cabe. */
html body.t-PageBody--login .t-Body {
  position: static !important;
  height: auto !important;
  min-height: 100vh !important;
  overflow-y: auto !important;
  display: block !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
}
html body.t-PageBody--login {
  overflow-y: auto !important;
}

/* ---------- Fonte exclusiva da tela de login (Sora/Manrope) — só
   aqui, o resto do sistema continua com Jakarta Sans normalmente. */
html body.t-PageBody--login.t-PageBody--login,
html body.t-PageBody--login.t-PageBody--login * {
  font-family: "Manrope", "Segoe UI", sans-serif !important;
}
html body.t-PageBody--login.t-PageBody--login .t-Login-body::before {
  font-family: "Sora", "Segoe UI", sans-serif !important;
}

/* ---------- 1) Fundo da página inteira ---------- */
html body.t-PageBody--login {
  background-color: #F6F5F8 !important;
  background-image:
    linear-gradient(180deg, rgba(246,245,248,0.85) 0%, rgba(246,245,248,0.55) 55%, rgba(246,245,248,0.85) 100%),
    url("hero-concrete.jpg") !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
  min-height: 100vh !important;
}

/* ---------- 2) Logo — o <span class="t-Login-logo"> real do APEX
   fica DENTRO do .t-Login-header (que tem overflow:hidden pra
   arredondar a foto), então não dá pra "escapar" ele pra cima do
   cartão sem cortar. Em vez disso: escondemos o span original e
   desenhamos o logo via ::before no container MAIOR (que engloba
   tudo), que aí sim fica visualmente ACIMA do cartão. */
html body.t-PageBody--login span.t-Login-logo {
  display: none !important;
}
html body.t-PageBody--login .t-Login-container {
  display: block !important;
  margin: 0 auto !important;
  padding: 0 !important;
}
html body.t-PageBody--login .t-Body-wrap,
html body.t-PageBody--login .t-Body-col,
html body.t-PageBody--login .t-Body-col--main {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  top: 0 !important;
  gap: 0 !important;
  display: block !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  height: auto !important;
  min-height: 0 !important;
}
html body.t-PageBody--login .t-Login-container::before {
  content: "";
  display: block;
  height: 92px;
  max-width: 400px;
  margin: 0 auto 18px;
  background-image: url("logo-natcorp.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

/* ---------- Cartão de login (.t-Login-region) — fundo branco, cantos
   arredondados, sombra suave (não é mais vidro escuro — é o cartão
   "elevado" claro do protótipo aprovado). ---------- */
html body.t-PageBody--login .t-Login-region {
  max-width: 400px !important;
  margin: 0 auto 24px !important;
  background: #F8F7FA !important;
  border: 1px solid #E4E1EA !important;
  border-radius: 20px !important;
  box-shadow: 0 20px 48px -20px rgba(44,26,99,0.22), 0 2px 8px rgba(44,26,99,0.06) !important;
  overflow: hidden !important;
  padding: 0 !important;
}

/* ---------- 3) Fundo do cabeçalho do cartão (.t-Login-header) ---------- */
html body.t-PageBody--login .t-Login-header {
  position: relative;
  height: 150px !important;
  padding: 0 !important;
  background-color: #2C1A63 !important;
  background-image: url("panel-colaborador.jpg") !important;
  background-size: cover !important;
  background-position: center 30% !important;
  display: flex !important;
  align-items: flex-end !important;
}
/* Selo circular com ícone de pessoa — desenhado 100% em CSS (SVG
   embutido), imitando o crachá do protótipo. */
html body.t-PageBody--login .t-Login-header::before {
  content: "";
  position: absolute;
  left: 24px;
  bottom: 14px;
  z-index: 1;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background-color: #2C1A63;
  background-image:
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='5'/%3E%3Cpath d='M20 21a8 8 0 0 0-16 0'/%3E%3C/svg%3E"),
    linear-gradient(135deg, #2C1A63, #8E4FB8);
  background-repeat: no-repeat, no-repeat;
  background-position: center, center;
  background-size: 22px 22px, cover;
  box-shadow: 0 8px 20px rgba(44,26,99,0.4);
}
/* Ícone da bolinha por portal — mesmo ícone (Lucide) usado no card
   correspondente na página "Menu de Portais". Colaborador usa o
   ícone padrão acima (person); os demais trocam só o SVG do
   background-image, mantendo o mesmo gradiente/tamanho/posição. */
html[class*="app-PG_"] body.t-PageBody--login .t-Login-header::before {
  background-image:
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Cpath d='M16 3.128a4 4 0 0 1 0 7.744'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3C/svg%3E"),
    linear-gradient(135deg, #2C1A63, #8E4FB8);
}
html[class*="app-PO_"] body.t-PageBody--login .t-Login-header::before {
  background-image:
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='7' height='9' x='3' y='3' rx='1'/%3E%3Crect width='7' height='5' x='14' y='3' rx='1'/%3E%3Crect width='7' height='9' x='14' y='12' rx='1'/%3E%3Crect width='7' height='5' x='3' y='16' rx='1'/%3E%3C/svg%3E"),
    linear-gradient(135deg, #2C1A63, #8E4FB8);
}
html[class*="app-CV_"] body.t-PageBody--login .t-Login-header::before {
  background-image:
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10' cy='7' r='4'/%3E%3Cpath d='M10.3 15H7a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='17' cy='17' r='3'/%3E%3Cpath d='m21 21-1.9-1.9'/%3E%3C/svg%3E"),
    linear-gradient(135deg, #2C1A63, #8E4FB8);
}
html[class*="app-NATDOCS_"] body.t-PageBody--login .t-Login-header::before {
  background-image:
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 21h8'/%3E%3Cpath d='M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z'/%3E%3C/svg%3E"),
    linear-gradient(135deg, #2C1A63, #8E4FB8);
}
/* O Chamado (app 118, workspace separado) usa uma versão mais
   antiga do Theme 42, que nunca adiciona a classe app-CHAMADO_ no
   <html> (confirmado no HTML real da aplicação — não é algo que
   mudou, sempre foi assim). Por isso, além da checagem por classe
   (que funciona nos outros portais, caso um dia essa aplicação
   ganhe a classe também), aceita também pelo ID numérico da
   aplicação (p_flow_id=118) como garantia — assim esse MESMO
   arquivo funciona nos dois workspaces, sem precisar de versões
   separadas. */
html[class*="app-CHAMADO_"] body.t-PageBody--login .t-Login-header::before,
html body.t-PageBody--login:has(input[name="p_flow_id"][value="118"]) .t-Login-header::before {
  background-image:
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m4.93 4.93 4.24 4.24'/%3E%3Cpath d='m14.83 9.17 4.24-4.24'/%3E%3Cpath d='m14.83 14.83 4.24 4.24'/%3E%3Cpath d='m9.17 14.83-4.24 4.24'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3C/svg%3E"),
    linear-gradient(135deg, #2C1A63, #8E4FB8);
}
html[class*="app-CHINT_"] body.t-PageBody--login .t-Login-header::before {
  background-image:
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='8' height='4' x='8' y='2' rx='1' ry='1'/%3E%3Cpath d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2'/%3E%3Cpath d='M12 11h4'/%3E%3Cpath d='M12 16h4'/%3E%3Cpath d='M8 11h.01'/%3E%3Cpath d='M8 16h.01'/%3E%3C/svg%3E"),
    linear-gradient(135deg, #2C1A63, #8E4FB8);
}
html[class*="app-FREQ_NATPONTO_"] body.t-PageBody--login .t-Login-header::before {
  background-image:
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E"),
    linear-gradient(135deg, #2C1A63, #8E4FB8);
}
html[class*="app-LOGIN_STEFANINI"] body:has(#P2_VERIFICATION_CODE).t-PageBody--login .t-Login-header::before {
  background-image:
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 10h-1.26A8 8 0 1 0 9 20h9a5 5 0 0 0 0-10z'/%3E%3Crect x='9.5' y='12.5' width='5' height='4' rx='0.8'/%3E%3Cpath d='M10.7 12.5v-1.2a1.3 1.3 0 0 1 2.6 0v1.2'/%3E%3C/svg%3E"),
    linear-gradient(135deg, #2C1A63, #8E4FB8);
}
html body.t-PageBody--login .t-Login-title {
  font-size: 0 !important;
  margin: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
}
/* Título "Login - Painel do [Portal]" — o texto muda conforme a
   aplicação (identificada pela classe html[class*="app-XX_"], onde
   XX é o prefixo do portal e o resto é o nome da base do cliente,
   ex.: app-PC_NATCORP, app-PC_OUTRACLIENTE — mirando só o prefixo
   funciona pra qualquer base). Fallback genérico "Login" pra
   qualquer aplicação que não bata com nenhum desses portais. */
html body.t-PageBody--login .t-Login-body::before {
  content: "Login";
  display: block;
  font-size: 21px;
  font-weight: 700;
  color: #211B2E;
  margin: 4px 0 2px;
}
html[class*="app-PC_"] body.t-PageBody--login .t-Login-body::before {
  content: "Login - Portal do Colaborador";
}
html[class*="app-PG_"] body.t-PageBody--login .t-Login-body::before {
  content: "Login - Portal do Gestor";
}
html[class*="app-PO_"] body.t-PageBody--login .t-Login-body::before {
  content: "Login - Portal do Operador";
}
html[class*="app-CV_"] body.t-PageBody--login .t-Login-body::before {
  content: "Login - Portal do Candidato";
}
html[class*="app-NATDOCS_"] body.t-PageBody--login .t-Login-body::before {
  content: "Login - NatDocs";
}
html[class*="app-CHAMADO_"] body.t-PageBody--login .t-Login-body::before,
html body.t-PageBody--login:has(input[name="p_flow_id"][value="118"]) .t-Login-body::before {
  content: "Login - Chamados para o Suporte Técnico";
}
html[class*="app-CHINT_"] body.t-PageBody--login .t-Login-body::before {
  content: "Login - Chamados Internos";
}
html[class*="app-FREQ_NATPONTO_"] body.t-PageBody--login .t-Login-body::before {
  content: "Login - NatPonto";
}
html[class*="app-LOGIN_STEFANINI"] body:has(#P2_VERIFICATION_CODE).t-PageBody--login .t-Login-body::before {
  content: "Token de Autenticação";
}

/* Imagem de fundo do cabeçalho do cartão — muda conforme o portal.
   Caminhos placeholder — trocar pelo nome real de cada arquivo
   assim que forem subidos como Static Workspace Files (mesma pasta
   do nosso CSS, só o nome do arquivo, sem caminho completo). */
html[class*="app-PG_"] body.t-PageBody--login .t-Login-header {
  background-image: url("panel-gestor.jpg") !important;
  background-position: center 41% !important;
}
html[class*="app-PO_"] body.t-PageBody--login .t-Login-header {
  background-image: url("panel-operador.jpg") !important;
}
html[class*="app-CV_"] body.t-PageBody--login .t-Login-header {
  background-image: url("panel-candidatos.jpg") !important;
}
html[class*="app-NATDOCS_"] body.t-PageBody--login .t-Login-header {
  background-image: url("panel-assinatura.jpg") !important;
}
html[class*="app-CHAMADO_"] body.t-PageBody--login .t-Login-header,
html body.t-PageBody--login:has(input[name="p_flow_id"][value="118"]) .t-Login-header {
  background-image: url("panel-suporte.jpg") !important;
}
html[class*="app-CHINT_"] body.t-PageBody--login .t-Login-header {
  background-image: url("panel-internos.jpg") !important;
}
html[class*="app-FREQ_NATPONTO_"] body.t-PageBody--login .t-Login-header {
  background-image: url("panel-natponto.jpg") !important;
}

/* ---------- Corpo do cartão (campos) ---------- */
html body.t-PageBody--login .t-Login-body {
  padding: 20px 28px 8px !important;
}
html body.t-PageBody--login .t-Form-label {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: #6E6978 !important;
}
html body.t-PageBody--login .t-Login-body input.apex-item-text,
html body.t-PageBody--login .t-Login-body input[type="text"],
html body.t-PageBody--login .t-Login-body input[type="password"] {
  background-color: #FBFAFC !important;
  border: 1px solid #E4E1EA !important;
  border-radius: 12px !important;
  color: #211B2E !important;
  height: 44px !important;
}
html body.t-PageBody--login .t-Login-body input:focus {
  border-color: #8E4FB8 !important;
}
/* Mensagens "Display Only" dentro da tela de login (ex.: aviso de
   e-mail enviado, na tela de Token) — garante que o texto sempre
   apareça legível, com boa cor de contraste. */
html body.t-PageBody--login .t-Login-body .apex-item-display-only,
html body.t-PageBody--login .t-Login-body span.display_only {
  background-color: #FBFAFC !important;
  color: #211B2E !important;
  border: 1px solid #E4E1EA !important;
}
/* Quando a mensagem "Display Only" vem vazia (ex.: antes do token
   ser enviado), esconde a caixa inteira do campo — sem isso, uma
   caixa vazia aparecia na tela sem motivo aparente. */
html body.t-PageBody--login .t-Form-fieldContainer:has(> .t-Form-inputContainer .apex-item-display-only:empty),
html body.t-PageBody--login .t-Form-fieldContainer:has(> .t-Form-inputContainer span.display_only:empty) {
  display: none !important;
}

/* ---------- Botões (.t-Login-buttons) ---------- */
html body.t-PageBody--login .t-Login-buttons {
  padding: 4px 28px 28px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}
/* Exceção: na tela de Token (app-LOGIN_STEFANINI), os botões ficam
   dentro de .t-Login-links (não .t-Login-buttons, que fica vazio
   nessa página) — sem isso, os botões ficavam colados nas bordas do
   cartão, sem o respiro lateral que o restante do padrão tem. */
html[class*="app-LOGIN_STEFANINI"] body:has(#P2_VERIFICATION_CODE).t-PageBody--login .t-Login-links {
  padding: 4px 28px 28px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}
/* Espaço entre os botões e o aviso "Info Token" logo abaixo — na
   original tinha um respiro aqui, na nossa versão ficava colado. */
html[class*="app-LOGIN_STEFANINI"] body:has(#P2_VERIFICATION_CODE).t-PageBody--login .t-Login-subRegions {
  margin-top: 16px !important;
}
html body.t-PageBody--login .t-Login-buttons .t-Button {
  width: 100% !important;
  height: 44px !important;
  border-radius: 12px !important;
  margin: 0 !important;
  font-weight: 700 !important;
  justify-content: center !important;
}
html body.t-PageBody--login.t-PageBody--login .t-Login-buttons .t-Button--hot:not(.btnIA):not(.floatChamadoInterno):not(.floatNati),
html body.t-PageBody--login.t-PageBody--login .t-Login-buttons .t-Button--hot:not(.btnIA):not(.floatChamadoInterno):not(.floatNati):hover,
html body.t-PageBody--login.t-PageBody--login .t-Login-buttons .t-Button--hot:not(.btnIA):not(.floatChamadoInterno):not(.floatNati):focus,
html body.t-PageBody--login.t-PageBody--login .t-Login-buttons .t-Button--hot:not(.btnIA):not(.floatChamadoInterno):not(.floatNati):active {
  background: linear-gradient(135deg, #2C1A63, #8E4FB8) !important;
  background-image: linear-gradient(135deg, #2C1A63, #8E4FB8) !important;
  border: 0 !important;
  color: #fff !important;
  box-shadow: 0 10px 24px rgba(44,26,99,0.32) !important;
}
html body.t-PageBody--login.t-PageBody--login .t-Login-buttons .t-Button--hot .t-Button-label,
html body.t-PageBody--login.t-PageBody--login .t-Login-buttons .t-Button--hot .t-Icon {
  color: #fff !important;
}
html body.t-PageBody--login .t-Login-buttons .t-Button:not(.t-Button--hot) {
  background: #fff !important;
  border: 1px solid #E4E1EA !important;
  color: #211B2E !important;
}
html body.t-PageBody--login .t-Login-buttons .t-Button:not(.t-Button--hot) .t-Button-label,
html body.t-PageBody--login .t-Login-buttons .t-Button:not(.t-Button--hot) .t-Icon {
  color: #211B2E !important;
}
html body.t-PageBody--login .t-Login-buttons .t-Button:not(.t-Button--hot):hover {
  background: #F4F1F8 !important;
  color: #2C1A63 !important;
}
html body.t-PageBody--login .t-Login-buttons .t-Button:not(.t-Button--hot):hover .t-Button-label,
html body.t-PageBody--login .t-Login-buttons .t-Button:not(.t-Button--hot):hover .t-Icon {
  color: #2C1A63 !important;
}

/* ---------- Subtítulo adaptativo — inserido via JavaScript
   (ncInsertLoginSubtitle), com o texto mudando conforme os campos
   presentes na tela (Empresa/Matrícula). ---------- */
html body.t-PageBody--login .t-Login-subtitle {
  font-size: 13.5px !important;
  color: #6E6978 !important;
  line-height: 1.4 !important;
  margin: 2px 0 20px !important;
}


/* =====================================================================
   REDE DE PROTEÇÃO: garante que qualquer região ou item que o APEX
   marque como oculto (classe nativa .u-hidden, usada por exemplo por
   Dynamic Actions do tipo "Hide" via apex.da.hide) SEMPRE fique
   escondido, não importa se alguma outra regra nossa (das 29+ que
   forçam display:flex/block/grid com !important pra estilizar
   campos, cartões, etc.) também mira o mesmo elemento. A classe
   repetida 3x aumenta a especificidade o suficiente pra vencer
   qualquer combinação de tag+classe que usamos no resto do arquivo,
   ficando por último no arquivo como reforço extra de prioridade.
   ===================================================================== */
html body .u-hidden.u-hidden.u-hidden {
  display: none !important;
  visibility: hidden !important;
}

/* Item "Display Image" (foto/imagem de exibição) configurado com a
   opção nativa "Hidden" (esconder quando vazio) no Template Options
   — quando não há imagem, o .t-Form-itemWrapper fica completamente
   vazio (sem nenhum <img> dentro). Garante que a região inteira
   (rótulo + moldura) some nesse caso, em vez de aparecer como uma
   caixa vazia com borda. */
html body .apex-item-wrapper--display-image:has(> .t-Form-inputContainer > .t-Form-itemWrapper:not(:has(img))) {
  display: none !important;
}
/* A regra acima esconde só o CAMPO em si — mas quando a região
   inteira (com cabeçalho, mesmo que removido visualmente, e
   moldura) existe só pra abrigar esse campo de imagem, ela
   continuava aparecendo vazia por fora. Esconde a região inteira
   nesse caso também. */
html body .t-Region:has(.apex-item-wrapper--display-image:has(> .t-Form-inputContainer > .t-Form-itemWrapper:not(:has(img)))) {
  display: none !important;
}
/* A coluna de grade (col-X) que envolve essa região também precisa
   sumir, senão o espaço lateral dela continua reservado no layout,
   mesmo com o conteúdo interno escondido. */
html body [class*="col-"]:has(> .t-Region:has(.apex-item-wrapper--display-image:has(> .t-Form-inputContainer > .t-Form-itemWrapper:not(:has(img))))) {
  display: none !important;
}

/* HISTÓRICO: chegamos a suspeitar que um relatório "vazando" pra fora
   da borda de uma modal fosse um Classic Report sem rolagem própria
   (".t-Report-tableWrap" com "overflow-x: visible") e a chegar a
   colocar uma regra aqui forçando "overflow-x: auto" nele dentro de
   modal. Não era isso — o elemento era, na verdade, um
   ".t-IRR-region" (Interactive Report) com "scrollLeft" antigo preso
   (rolado de uma vez que precisou, sem resetar quando o conteúdo
   deixou de precisar rolar tanto). Regra removida daqui porque não
   tinha efeito nenhum no problema real; a correção de verdade foi no
   JavaScript (Natcorp_Allow_Unload_Iframes.js), resetando o
   "scrollLeft" sempre que o elemento deixa de ter overflow
   horizontal de verdade. */

/* HISTÓRICO: chegamos a tentar encolher a fonte do relatório dentro
   de modal automaticamente via "Container Queries" (cqw), pra caber
   sem precisar rolar. Revertido — essa técnica entrou em conflito com
   o mecanismo de rolagem horizontal que a região já tem por conta
   própria (o "scrollLeft" ficava desalinhado com o novo tamanho do
   conteúdo, fazendo a tabela "sumir" rolada além do que existia de
   verdade). Risco alto de efeito colateral pra um ganho incerto.
   Voltamos a depender só da rolagem horizontal (nativa + nossa barra
   flutuante), que é o mecanismo já testado e usado em todo o resto do
   sistema — ver correção do "scrollLeft" preso em
   Natcorp_Allow_Unload_Iframes.js. */

/* Cabeçalho (".t-Report-colHead") e linhas de dado (".t-Report-cell")
   do Classic Report no MESMO tamanho de fonte. Usa "rem" (relativo à
   fonte raiz da página) em vez de "em" nos dois — "em" sozinho não
   bastava porque cabeçalho e linha herdam de ancestrais com bases
   diferentes no tema, então "1em" em cada um não dava o mesmo tamanho
   final; com "rem" os dois ficam garantidamente iguais, não importa o
   que os ancestrais definirem. */
html body .t-Report-report th.t-Report-colHead {
  font-size: 1rem !important;
}
/* Linhas de dado um pouco maiores que o cabeçalho, a pedido — só no
   Classic Report (".t-Report-cell"); não mexe no Interactive Report
   (".a-IRR-*") nem no Interactive Grid (".a-GV-*"). */
html body .t-Report-report td.t-Report-cell {
  font-size: 1.2rem !important;
}

/* =====================================================================
   Esconde a barra de rolagem horizontal NATIVA do cabeçalho "grudento"
   do Oracle (".t-fht-thead.js-stickyTableHeader") — ela é a réplica
   flutuante do cabeçalho que o próprio APEX sincroniza com a rolagem
   da tabela por baixo dos panos, e por isso precisa manter
   "overflow-x" funcionando pra receber a rolagem programaticamente.
   Só a BARRA em si (o desenho visual/cinza) é escondida — a rolagem
   sincronizada continua funcionando normalmente por trás. Ficou
   redundante agora que a barra flutuante nossa (lá embaixo da tela)
   cobre essa mesma necessidade em todo relatório interativo.
   ===================================================================== */
html body .t-fht-thead.js-stickyTableHeader {
  scrollbar-width: none !important; /* Firefox */
  -ms-overflow-style: none !important; /* IE/Edge antigo */
}
html body .t-fht-thead.js-stickyTableHeader::-webkit-scrollbar {
  display: none !important; /* Chrome, Edge, Safari */
  height: 0 !important;
}

/* Classic Report não preenchendo a largura toda da região: por padrão
   o navegador dimensiona a tabela só pelo tamanho do CONTEÚDO das
   colunas — então num relatório com textos curtos (ex.: "Nome
   arquivo"/"Tamanho"/"Download"/"Deletar"), sobra um espaço vazio à
   direita e parece que o relatório "não vai até o final" da região.
   Confirmado via diagnóstico: o verdadeiro culpado é o
   ".t-Report-wrap" — ele é "float: left" (flutuante) e, sem largura
   própria definida, "encolhe" só até o tamanho do conteúdo (é assim
   que "float" funciona por padrão). Como o filho dele (a tabela) já
   tinha "width: 100%", isso virava uma referência circular (100% de
   "encolher pro conteúdo" não tem valor fixo) e o navegador acabava
   ignorando e usando o tamanho natural mesmo. Força esse "wrap" a
   ocupar 100% da região (valor explícito, sem depender do
   encolhimento do float), o que resolve a referência circular. Força
   também a tabela e o "tableWrap" de dentro, por garantia. Aplicado a
   todo Classic Report do sistema (não mexe em Interactive Report
   ".a-IRR-*" nem Interactive Grid ".a-GV-*"). */
html body .t-Report-wrap {
  width: 100% !important;
}
html body .t-Report-tableWrap {
  width: 100% !important;
}
html body table.t-Report-report {
  width: 100% !important;
}


/* ###########################################################################################
   ###########################################################################################
   ##                                                                                       ##
   ##   NOVAS IMPLEMENTAÇÕES — Natcorp (a partir daqui)                                      ##
   ##                                                                                       ##
   ##   Tudo ACIMA deste bloco é a Natcorp Skin original, sem nenhuma alteração.             ##
   ##   Tudo ABAIXO é o Natcorp_Login.css (27/09/2026): login em tela dividida, cabeçalho e menu   ##
   ##   lateral, e as páginas internas (regiões, campos, relatórios clássico/interativo,     ##
   ##   grade interativa, modais, alertas, Alertify, apex.message, upload de arquivo).       ##
   ##                                                                                       ##
   ##   Vem DEPOIS da Skin de propósito: com a mesma prioridade, vence quem vem por último.  ##
   ##   Gerado por brand/apex/app/gerar-app.mjs — NÃO edite abaixo daqui: edite as fontes    ##
   ##   .src.css (esta parte é reescrita a cada geração; a de cima, nunca).                  ##
   ##                                                                                       ##
   ###########################################################################################
   ########################################################################################### */

/* Natcorp — login, menu e páginas do APEX. Gerado por brand/apex/app/gerar-app.mjs: não edite. */
/* ===== login ===== */
/* =====================================================================
   Natcorp_Login.css — login em tela dividida para APEX 19.2 (Universal Theme 42)
   ---------------------------------------------------------------------
   UM arquivo, sem dependências: a fonte Manrope, o logo e o painel animado
   vêm embutidos. Nada é buscado fora (nem Google Fonts).

   INSTALAR
   1. Shared Components › Static Workspace Files › Upload: este arquivo.
   2. Página de login (900) › CSS › File URLs:
          #WORKSPACE_IMAGES#Natcorp_Login.css
      (ou Shared Components › User Interface Attributes › CSS File URLs,
      para todos os apps: é seguro, toda regra só vale no login.)
   3. Ctrl+Shift+R no navegador.

   REVERTER: apagar a linha do File URLs. Nada mais foi alterado.

   PRIORIDADE — esta folha vale por cima de qualquer outra, sem editá-las.
   O gerador faz três coisas que a fonte não mostra:
     1. toda declaração ganha !important;
     2. todo "body.t-PageBody--login" ganha :not(#nc-p1):not(#nc-p2), o
        peso de DOIS IDs sem ID nenhum na página. Entre dois !important
        decide a especificidade, e as regras mais fortes das outras folhas
        do APEX pesam no máximo um ID (o :not(#nc-fake-id) do
        Natcorp_Style_Min.css do workspace natcorp);
     3. a seção "Zerar o outro redesenho do login" (no fim) desfaz as
        propriedades que SÓ a outra folha declara — prioridade não decide
        o que só um lado escreve. Essa lista foi medida em 26/09 no app 100
        com medir-conflitos.js; se aquela folha mudar, meça de novo.
   O que CSS nenhum vence: style="" com !important gravado por JavaScript,
   uma folha com três IDs ou mais, ou um script que tire a classe
   t-PageBody--login do <body>.

   NÃO EDITE ESTE ARQUIVO À MÃO: ele é gerado a partir de
   brand/apex/login/Natcorp_Login.src.css por gerar-login.mjs
   (node brand/apex/login/gerar-login.mjs).
   ===================================================================== */

/* Manrope variável (pesos 200–800), subconjunto latino: cobre todo o
   português. Embutida porque os .woff2 dão 404 no servidor do APEX. */
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("data:font/woff2;base64,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") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Os tokens ficam na raiz: html::after (a frase de apoio) não herda do body.
   O :has() prende a raiz ao login. O :where() é tolerante: um navegador sem
   :has() descarta só aquele item, o body continua recebendo os tokens e só a
   frase de apoio some (numa lista comum, a regra INTEIRA seria descartada). */
:where(:root:has(body.t-PageBody--login:not(#nc-p1):not(#nc-p2)), body.t-PageBody--login:not(#nc-p1):not(#nc-p2)) {
  --nc-roxo: #511C76;
  --nc-azul: #2C1A63;
  --nc-rosa: #C95788;
  --nc-tinta: #1B1238;
  --nc-grafite: #4A4460;
  --nc-cinza: #8E88A3;
  --nc-nevoa: #E9E5F1;
  --nc-off: #F4F2F7;
  --nc-painel: 50%;            /* largura do painel de marca */

  /* O texto do painel é o do hero da home (src/components/sections/Hero.tsx):
     "Todo o RH. [[Um único sistema.]]" — a segunda frase no rosa-claro. */
  --nc-login-titulo: "Todo o RH.";
  --nc-login-destaque: "Um único sistema.";
  --nc-login-texto: "HR Tech brasileira há mais de 35 anos.";
  --nc-login-subtitulo: "Entre com seu usuário e senha para continuar.";
  --nc-fs: clamp(34px, 3.7vw, 60px);  /* corpo do título do painel */
  --nc-pad: clamp(48px, 6vw, 112px);   /* margem lateral do painel */
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) {
  background: #fff !important;        /* vence o style="" inline */
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  color: var(--nc-tinta) !important;
  -webkit-font-smoothing: antialiased !important;
}

/* ---------- Painel de marca (direita) -------------------------------
   As camadas do hero dos portais (PortalHubPage › Opening), numa imagem só:
   malha técnica, rede de pontos à deriva, brilho rosa que respira e os
   losangos do ModuleLights desenhando-se, com a luz correndo na borda.
   O SVG é gerado por gerar-painel.mjs a partir do código do site e vem
   embutido aqui: o APEX não recebe arquivo, template nem JavaScript.
   Pseudo-elementos usados (todos fora de .t-Body, que empilha à parte):
     body::before           fundo + efeitos
     body::after            "Todo o RH."
     #wwvFlowForm::before   "Um único sistema."
     #wwvFlowForm::after    logo Natcorp
     html::after            frase de apoio
   -------------------------------------------------------------------- */

body.t-PageBody--login:not(#nc-p1):not(#nc-p2)::before {
  content: "" !important;
  position: fixed !important;
  inset: 0 0 0 calc(100% - var(--nc-painel)) !important;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 1250' preserveAspectRatio='xMidYMid slice'%3E%3Cstyle%3E.draw{stroke-dasharray:1 1;stroke-dashoffset:1;opacity:0;animation:draw 2.2s cubic-bezier(.22,1,.36,1) .2s forwards}.d2{animation-duration:2.6s;animation-delay:.7s}.fl{animation-duration:1.8s}@keyframes draw{to{stroke-dashoffset:0;opacity:1}}.run{stroke-dasharray:.07 1;opacity:0;animation:run 14s linear infinite,in 1.2s ease 2.4s forwards}.run.w{stroke-dasharray:.055 1}@keyframes run{from{stroke-dashoffset:0}to{stroke-dashoffset:-2}}.pk{stroke-dasharray:.08 1;stroke-dashoffset:1;opacity:0;animation:pk linear infinite,in 1s ease forwards}@keyframes pk{from{stroke-dashoffset:1}to{stroke-dashoffset:-1}}@keyframes in{to{opacity:var(--o,1)}}.small{opacity:0;transform-box:fill-box;transform-origin:center;animation:in 1.2s cubic-bezier(.22,1,.36,1) 1.2s forwards,breathe 6s ease-in-out 2.4s infinite}@keyframes breathe{50%25{transform:scale(1.05)}}.glow{animation:drift 12s ease-in-out infinite}@keyframes drift{0%25,100%25{transform:translate(0,0);opacity:.5}50%25{transform:translate(180px,125px);opacity:.9}}.net{animation:slide 150s linear infinite}@keyframes slide{to{transform:translateX(-1000px)}}%3C/style%3E%3Cdefs%3E%3CradialGradient id='g' cx='.5' cy='.5' r='.5'%3E%3Cstop offset='0' stop-color='%23C95788' stop-opacity='.3'/%3E%3Cstop offset='.45' stop-color='%23C95788' stop-opacity='.1'/%3E%3Cstop offset='1' stop-color='%23C95788' stop-opacity='0'/%3E%3C/radialGradient%3E%3Cpattern id='grid' width='56' height='56' patternUnits='userSpaceOnUse'%3E%3Cpath d='M56 0H0V56' fill='none' stroke='%23fff' stroke-opacity='.06'/%3E%3C/pattern%3E%3CradialGradient id='gm' cx='0.85' cy='0.86' r='.62'%3E%3Cstop offset='0' stop-color='%23fff'/%3E%3Cstop offset='.75' stop-color='%23fff' stop-opacity='0'/%3E%3C/radialGradient%3E%3Cmask id='mg'%3E%3Crect width='1000' height='1250' fill='url(%23gm)'/%3E%3C/mask%3E%3ClinearGradient id='nm' x1='0' x2='1'%3E%3Cstop offset='.05' stop-color='%23fff' stop-opacity='.15'/%3E%3Cstop offset='.6' stop-color='%23fff' stop-opacity='.7'/%3E%3C/linearGradient%3E%3Cmask id='mn'%3E%3Crect width='1000' height='1250' fill='url(%23nm)'/%3E%3C/mask%3E%3ClinearGradient id='edge' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23F3C9DA' stop-opacity='.95'/%3E%3Cstop offset='.5' stop-color='%23E4A9C4' stop-opacity='.75'/%3E%3Cstop offset='1' stop-color='%23C95788' stop-opacity='.4'/%3E%3C/linearGradient%3E%3ClinearGradient id='edge2' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23E4A9C4' stop-opacity='.9'/%3E%3Cstop offset='.5' stop-color='%23C95788' stop-opacity='.75'/%3E%3Cstop offset='1' stop-color='%23C95788' stop-opacity='.45'/%3E%3C/linearGradient%3E%3ClinearGradient id='glass' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23F3C9DA' stop-opacity='.3'/%3E%3Cstop offset='.55' stop-color='%23C95788' stop-opacity='.16'/%3E%3Cstop offset='1' stop-color='%23511C76' stop-opacity='.1'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='1000' height='1250' fill='url(%23grid)' mask='url(%23mg)'/%3E%3Cg mask='url(%23mn)' opacity='1'%3E%3Cg class='net'%3E%3Cg id='t'%3E%3Cg stroke='%23E4A9C4' stroke-width='1'%3E%3Cline x1='0.1' y1='1151.0' x2='77.9' y2='1245.3' stroke-opacity='0.052'/%3E%3Cline x1='0.1' y1='1151.0' x2='-115.4' y2='1113.2' stroke-opacity='0.053'/%3E%3Cline x1='210.6' y1='911.7' x2='329.3' y2='940.1' stroke-opacity='0.052'/%3E%3Cline x1='329.3' y1='940.1' x2='344.1' y2='830.5' stroke-opacity='0.074'/%3E%3Cline x1='542.9' y1='855.6' x2='557.4' y2='911.6' stroke-opacity='0.172'/%3E%3Cline x1='542.9' y1='855.6' x2='565.3' y2='849.2' stroke-opacity='0.236'/%3E%3Cline x1='816.8' y1='302.5' x2='807.4' y2='153.5' stroke-opacity='0.001'/%3E%3Cline x1='816.8' y1='302.5' x2='900.1' y2='235.2' stroke-opacity='0.080'/%3E%3Cline x1='707.9' y1='872.6' x2='565.3' y2='849.2' stroke-opacity='0.010'/%3E%3Cline x1='683.9' y1='584.9' x2='741.1' y2='611.7' stroke-opacity='0.162'/%3E%3Cline x1='683.9' y1='584.9' x2='714.1' y2='622.7' stroke-opacity='0.190'/%3E%3Cline x1='807.4' y1='153.5' x2='909.0' y2='68.6' stroke-opacity='0.033'/%3E%3Cline x1='807.4' y1='153.5' x2='877.6' y2='138.8' stroke-opacity='0.146'/%3E%3Cline x1='807.4' y1='153.5' x2='900.1' y2='235.2' stroke-opacity='0.050'/%3E%3Cline x1='923.2' y1='860.6' x2='863.0' y2='793.9' stroke-opacity='0.112'/%3E%3Cline x1='923.2' y1='860.6' x2='907.8' y2='951.4' stroke-opacity='0.108'/%3E%3Cline x1='923.2' y1='860.6' x2='1001.6' y2='771.1' stroke-opacity='0.058'/%3E%3Cline x1='577.4' y1='1140.0' x2='489.3' y2='1253.7' stroke-opacity='0.011'/%3E%3Cline x1='577.4' y1='1140.0' x2='636.9' y2='1152.6' stroke-opacity='0.166'/%3E%3Cline x1='372.2' y1='419.2' x2='428.5' y2='368.6' stroke-opacity='0.139'/%3E%3Cline x1='372.2' y1='419.2' x2='283.6' y2='455.6' stroke-opacity='0.101'/%3E%3Cline x1='372.2' y1='419.2' x2='330.6' y2='489.3' stroke-opacity='0.128'/%3E%3Cline x1='332.3' y1='190.7' x2='222.8' y2='261.2' stroke-opacity='0.037'/%3E%3Cline x1='557.4' y1='911.6' x2='565.3' y2='849.2' stroke-opacity='0.163'/%3E%3Cline x1='58.6' y1='341.9' x2='10.5' y2='310.4' stroke-opacity='0.173'/%3E%3Cline x1='508.8' y1='526.8' x2='516.2' y2='631.2' stroke-opacity='0.085'/%3E%3Cline x1='909.0' y1='68.6' x2='877.6' y2='138.8' stroke-opacity='0.136'/%3E%3Cline x1='344.1' y1='830.5' x2='251.1' y2='733.6' stroke-opacity='0.029'/%3E%3Cline x1='514.9' y1='206.9' x2='632.4' y2='180.3' stroke-opacity='0.055'/%3E%3Cline x1='514.9' y1='206.9' x2='592.9' y2='172.2' stroke-opacity='0.121'/%3E%3Cline x1='283.6' y1='455.6' x2='330.6' y2='489.3' stroke-opacity='0.172'/%3E%3Cline x1='332.6' y1='664.6' x2='251.1' y2='733.6' stroke-opacity='0.081'/%3E%3Cline x1='233.2' y1='1133.1' x2='238.0' y2='1102.6' stroke-opacity='0.222'/%3E%3Cline x1='233.2' y1='1133.1' x2='373.9' y2='1117.8' stroke-opacity='0.016'/%3E%3Cline x1='863.0' y1='793.9' x2='1001.6' y2='771.1' stroke-opacity='0.018'/%3E%3Cline x1='939.6' y1='495.9' x2='1077.7' y2='508.5' stroke-opacity='0.021'/%3E%3Cline x1='877.6' y1='138.8' x2='900.1' y2='235.2' stroke-opacity='0.095'/%3E%3Cline x1='632.4' y1='180.3' x2='592.9' y2='172.2' stroke-opacity='0.205'/%3E%3Cline x1='907.8' y1='951.4' x2='1052.3' y2='961.8' stroke-opacity='0.009'/%3E%3Cline x1='10.5' y1='310.4' x2='-99.9' y2='235.2' stroke-opacity='0.031'/%3E%3Cline x1='741.1' y1='611.7' x2='714.1' y2='622.7' stroke-opacity='0.225'/%3E%3Cline x1='238.0' y1='1102.6' x2='373.9' y2='1117.8' stroke-opacity='0.025'/%3E%3C/g%3E%3Cg fill='rgba(228,169,196,.75)'%3E%3Ccircle cx='0.1' cy='1151.0' r='1.85'/%3E%3Ccircle cx='210.6' cy='911.7' r='2.31'/%3E%3Ccircle cx='329.3' cy='940.1' r='2.73'/%3E%3Ccircle cx='542.9' cy='855.6' r='2.51'/%3E%3Ccircle cx='816.8' cy='302.5' r='2.01'/%3E%3Ccircle cx='707.9' cy='872.6' r='1.40'/%3E%3Ccircle cx='683.9' cy='584.9' r='3.05'/%3E%3Ccircle cx='807.4' cy='153.5' r='2.27'/%3E%3Ccircle cx='923.2' cy='860.6' r='2.52'/%3E%3Ccircle cx='577.4' cy='1140.0' r='3.03'/%3E%3Ccircle cx='372.2' cy='419.2' r='2.89'/%3E%3Ccircle cx='332.3' cy='190.7' r='1.87'/%3E%3Ccircle cx='428.5' cy='368.6' r='3.08'/%3E%3Ccircle cx='557.4' cy='911.6' r='2.97'/%3E%3Ccircle cx='58.6' cy='341.9' r='2.37'/%3E%3Ccircle cx='508.8' cy='526.8' r='1.67'/%3E%3Ccircle cx='909.0' cy='68.6' r='1.99'/%3E%3Ccircle cx='344.1' cy='830.5' r='3.06'/%3E%3Ccircle cx='514.9' cy='206.9' r='2.07'/%3E%3Ccircle cx='283.6' cy='455.6' r='2.11'/%3E%3Ccircle cx='332.6' cy='664.6' r='2.47'/%3E%3Ccircle cx='233.2' cy='1133.1' r='2.17'/%3E%3Ccircle cx='863.0' cy='793.9' r='2.51'/%3E%3Ccircle cx='516.2' cy='631.2' r='2.61'/%3E%3Ccircle cx='939.6' cy='495.9' r='2.65'/%3E%3Ccircle cx='251.1' cy='733.6' r='1.97'/%3E%3Ccircle cx='330.6' cy='489.3' r='2.81'/%3E%3Ccircle cx='877.6' cy='138.8' r='2.86'/%3E%3Ccircle cx='77.7' cy='508.5' r='1.59'/%3E%3Ccircle cx='77.9' cy='1245.3' r='1.72'/%3E%3Ccircle cx='632.4' cy='180.3' r='2.17'/%3E%3Ccircle cx='592.9' cy='172.2' r='3.05'/%3E%3Ccircle cx='884.6' cy='1113.2' r='2.98'/%3E%3Ccircle cx='907.8' cy='951.4' r='1.82'/%3E%3Ccircle cx='10.5' cy='310.4' r='1.44'/%3E%3Ccircle cx='1.6' cy='771.1' r='1.74'/%3E%3Ccircle cx='741.1' cy='611.7' r='2.61'/%3E%3Ccircle cx='238.0' cy='1102.6' r='1.75'/%3E%3Ccircle cx='373.9' cy='1117.8' r='1.52'/%3E%3Ccircle cx='489.3' cy='3.7' r='3.03'/%3E%3Ccircle cx='636.9' cy='1152.6' r='1.34'/%3E%3Ccircle cx='900.1' cy='235.2' r='3.14'/%3E%3Ccircle cx='565.3' cy='849.2' r='1.81'/%3E%3Ccircle cx='222.8' cy='261.2' r='2.37'/%3E%3Ccircle cx='52.3' cy='961.8' r='2.63'/%3E%3Ccircle cx='714.1' cy='622.7' r='1.36'/%3E%3C/g%3E%3C/g%3E%3Cuse href='%23t' x='1000'/%3E%3C/g%3E%3C/g%3E%3Cellipse class='glow' cx='330' cy='260' rx='300' ry='720' fill='url(%23g)'/%3E%3Cg transform='translate(850 1075) scale(0.52) translate(-1412 -425)' fill='none' stroke-linecap='round'%3E%3Cpath class='draw fl' d='M-128 945 C 412 905, 712 725, 992 645 S 1492 425, 2352 365' pathLength='1' stroke='%23F3C9DA' stroke-width='1.6' stroke-opacity='.3'/%3E%3Cpath class='draw fl' d='M-128 989 C 412 949, 712 751, 992 671 S 1492 455, 2352 395' pathLength='1' stroke='%23F3C9DA' stroke-width='1.6' stroke-opacity='.3'/%3E%3Cpath class='draw fl' d='M-128 1033 C 412 993, 712 777, 992 697 S 1492 485, 2352 425' pathLength='1' stroke='%23F3C9DA' stroke-width='1.6' stroke-opacity='.3'/%3E%3Cpath class='draw fl' d='M-128 1077 C 412 1037, 712 803, 992 723 S 1492 515, 2352 455' pathLength='1' stroke='%23F3C9DA' stroke-width='1.6' stroke-opacity='.3'/%3E%3Cpath class='draw fl' d='M-128 1121 C 412 1081, 712 829, 992 749 S 1492 545, 2352 485' pathLength='1' stroke='%23F3C9DA' stroke-width='1.6' stroke-opacity='.3'/%3E%3Cg transform='translate(1300 500) rotate(12) scale(1.12) translate(-1412 -425)'%3E%3Cpath class='draw d2' d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='%23C95788' stroke-width='8' stroke-opacity='.16'/%3E%3Cpath class='draw d2' d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='url(%23edge2)' stroke-width='2.4'/%3E%3C/g%3E%3Cpath class='draw' d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='%23E4A9C4' stroke-width='30' stroke-opacity='.1'/%3E%3Cpath class='draw' d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='%23E4A9C4' stroke-width='12' stroke-opacity='.2'/%3E%3Cpath class='draw' d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='url(%23edge)' stroke-width='3.5'/%3E%3Cpath class='pk' d='M-128 945 C 412 905, 712 725, 992 645 S 1492 425, 2352 365' pathLength='1' stroke='%23fff' stroke-width='2.2' stroke-opacity='.9' style='animation-duration:7s,1s;animation-delay:0s,0s'/%3E%3Cpath class='pk' d='M-128 989 C 412 949, 712 751, 992 671 S 1492 455, 2352 395' pathLength='1' stroke='%23fff' stroke-width='2.2' stroke-opacity='.9' style='animation-duration:7.8s,1s;animation-delay:0.6s,0.6s'/%3E%3Cpath class='pk' d='M-128 1033 C 412 993, 712 777, 992 697 S 1492 485, 2352 425' pathLength='1' stroke='%23fff' stroke-width='2.2' stroke-opacity='.9' style='animation-duration:8.6s,1s;animation-delay:1.2s,1.2s'/%3E%3Cpath class='pk' d='M-128 1077 C 412 1037, 712 803, 992 723 S 1492 515, 2352 455' pathLength='1' stroke='%23fff' stroke-width='2.2' stroke-opacity='.9' style='animation-duration:9.4s,1s;animation-delay:1.7999999999999998s,1.7999999999999998s'/%3E%3Cpath class='pk' d='M-128 1121 C 412 1081, 712 829, 992 749 S 1492 545, 2352 485' pathLength='1' stroke='%23fff' stroke-width='2.2' stroke-opacity='.9' style='animation-duration:10.2s,1s;animation-delay:2.4s,2.4s'/%3E%3Cpath class='run' d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='%23F3C9DA' stroke-width='14' style='--o:.45'/%3E%3Cpath class='run w' d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='%23fff' stroke-width='5'/%3E%3Cg class='small'%3E%3Cg transform='translate(942 855) scale(0.26) translate(-1412 -425)'%3E%3Cpath d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' fill='url(%23glass)' stroke='%23F3C9DA' stroke-width='5' stroke-opacity='.8'/%3E%3Cpath d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' stroke='%23fff' stroke-width='2.5' stroke-opacity='.5' transform='translate(-16 -16)'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") center / cover no-repeat,
    radial-gradient(60% 80% at 85% 50%, rgba(201, 87, 136, .30), transparent 70%),
    radial-gradient(45% 60% at 100% 100%, rgba(201, 87, 136, .4), transparent 70%),
    linear-gradient(180deg, #2C1A63 0%, #511C76 100%) !important;
  z-index: 0 !important;
  pointer-events: none !important;                 /* decorativo: se o formulário encostar no
                                           painel (outro tema, zoom), o clique passa */
}

@media (prefers-reduced-motion: reduce) {
  body.t-PageBody--login:not(#nc-p1):not(#nc-p2)::before {
    background-image:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 1250' preserveAspectRatio='xMidYMid slice'%3E%3Cstyle%3E.pk,.run{display:none}.glow{opacity:.6}%3C/style%3E%3Cdefs%3E%3CradialGradient id='g' cx='.5' cy='.5' r='.5'%3E%3Cstop offset='0' stop-color='%23C95788' stop-opacity='.3'/%3E%3Cstop offset='.45' stop-color='%23C95788' stop-opacity='.1'/%3E%3Cstop offset='1' stop-color='%23C95788' stop-opacity='0'/%3E%3C/radialGradient%3E%3Cpattern id='grid' width='56' height='56' patternUnits='userSpaceOnUse'%3E%3Cpath d='M56 0H0V56' fill='none' stroke='%23fff' stroke-opacity='.06'/%3E%3C/pattern%3E%3CradialGradient id='gm' cx='0.85' cy='0.86' r='.62'%3E%3Cstop offset='0' stop-color='%23fff'/%3E%3Cstop offset='.75' stop-color='%23fff' stop-opacity='0'/%3E%3C/radialGradient%3E%3Cmask id='mg'%3E%3Crect width='1000' height='1250' fill='url(%23gm)'/%3E%3C/mask%3E%3ClinearGradient id='nm' x1='0' x2='1'%3E%3Cstop offset='.05' stop-color='%23fff' stop-opacity='.15'/%3E%3Cstop offset='.6' stop-color='%23fff' stop-opacity='.7'/%3E%3C/linearGradient%3E%3Cmask id='mn'%3E%3Crect width='1000' height='1250' fill='url(%23nm)'/%3E%3C/mask%3E%3ClinearGradient id='edge' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23F3C9DA' stop-opacity='.95'/%3E%3Cstop offset='.5' stop-color='%23E4A9C4' stop-opacity='.75'/%3E%3Cstop offset='1' stop-color='%23C95788' stop-opacity='.4'/%3E%3C/linearGradient%3E%3ClinearGradient id='edge2' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23E4A9C4' stop-opacity='.9'/%3E%3Cstop offset='.5' stop-color='%23C95788' stop-opacity='.75'/%3E%3Cstop offset='1' stop-color='%23C95788' stop-opacity='.45'/%3E%3C/linearGradient%3E%3ClinearGradient id='glass' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23F3C9DA' stop-opacity='.3'/%3E%3Cstop offset='.55' stop-color='%23C95788' stop-opacity='.16'/%3E%3Cstop offset='1' stop-color='%23511C76' stop-opacity='.1'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='1000' height='1250' fill='url(%23grid)' mask='url(%23mg)'/%3E%3Cg mask='url(%23mn)' opacity='1'%3E%3Cg class='net'%3E%3Cg id='t'%3E%3Cg stroke='%23E4A9C4' stroke-width='1'%3E%3Cline x1='0.1' y1='1151.0' x2='77.9' y2='1245.3' stroke-opacity='0.052'/%3E%3Cline x1='0.1' y1='1151.0' x2='-115.4' y2='1113.2' stroke-opacity='0.053'/%3E%3Cline x1='210.6' y1='911.7' x2='329.3' y2='940.1' stroke-opacity='0.052'/%3E%3Cline x1='329.3' y1='940.1' x2='344.1' y2='830.5' stroke-opacity='0.074'/%3E%3Cline x1='542.9' y1='855.6' x2='557.4' y2='911.6' stroke-opacity='0.172'/%3E%3Cline x1='542.9' y1='855.6' x2='565.3' y2='849.2' stroke-opacity='0.236'/%3E%3Cline x1='816.8' y1='302.5' x2='807.4' y2='153.5' stroke-opacity='0.001'/%3E%3Cline x1='816.8' y1='302.5' x2='900.1' y2='235.2' stroke-opacity='0.080'/%3E%3Cline x1='707.9' y1='872.6' x2='565.3' y2='849.2' stroke-opacity='0.010'/%3E%3Cline x1='683.9' y1='584.9' x2='741.1' y2='611.7' stroke-opacity='0.162'/%3E%3Cline x1='683.9' y1='584.9' x2='714.1' y2='622.7' stroke-opacity='0.190'/%3E%3Cline x1='807.4' y1='153.5' x2='909.0' y2='68.6' stroke-opacity='0.033'/%3E%3Cline x1='807.4' y1='153.5' x2='877.6' y2='138.8' stroke-opacity='0.146'/%3E%3Cline x1='807.4' y1='153.5' x2='900.1' y2='235.2' stroke-opacity='0.050'/%3E%3Cline x1='923.2' y1='860.6' x2='863.0' y2='793.9' stroke-opacity='0.112'/%3E%3Cline x1='923.2' y1='860.6' x2='907.8' y2='951.4' stroke-opacity='0.108'/%3E%3Cline x1='923.2' y1='860.6' x2='1001.6' y2='771.1' stroke-opacity='0.058'/%3E%3Cline x1='577.4' y1='1140.0' x2='489.3' y2='1253.7' stroke-opacity='0.011'/%3E%3Cline x1='577.4' y1='1140.0' x2='636.9' y2='1152.6' stroke-opacity='0.166'/%3E%3Cline x1='372.2' y1='419.2' x2='428.5' y2='368.6' stroke-opacity='0.139'/%3E%3Cline x1='372.2' y1='419.2' x2='283.6' y2='455.6' stroke-opacity='0.101'/%3E%3Cline x1='372.2' y1='419.2' x2='330.6' y2='489.3' stroke-opacity='0.128'/%3E%3Cline x1='332.3' y1='190.7' x2='222.8' y2='261.2' stroke-opacity='0.037'/%3E%3Cline x1='557.4' y1='911.6' x2='565.3' y2='849.2' stroke-opacity='0.163'/%3E%3Cline x1='58.6' y1='341.9' x2='10.5' y2='310.4' stroke-opacity='0.173'/%3E%3Cline x1='508.8' y1='526.8' x2='516.2' y2='631.2' stroke-opacity='0.085'/%3E%3Cline x1='909.0' y1='68.6' x2='877.6' y2='138.8' stroke-opacity='0.136'/%3E%3Cline x1='344.1' y1='830.5' x2='251.1' y2='733.6' stroke-opacity='0.029'/%3E%3Cline x1='514.9' y1='206.9' x2='632.4' y2='180.3' stroke-opacity='0.055'/%3E%3Cline x1='514.9' y1='206.9' x2='592.9' y2='172.2' stroke-opacity='0.121'/%3E%3Cline x1='283.6' y1='455.6' x2='330.6' y2='489.3' stroke-opacity='0.172'/%3E%3Cline x1='332.6' y1='664.6' x2='251.1' y2='733.6' stroke-opacity='0.081'/%3E%3Cline x1='233.2' y1='1133.1' x2='238.0' y2='1102.6' stroke-opacity='0.222'/%3E%3Cline x1='233.2' y1='1133.1' x2='373.9' y2='1117.8' stroke-opacity='0.016'/%3E%3Cline x1='863.0' y1='793.9' x2='1001.6' y2='771.1' stroke-opacity='0.018'/%3E%3Cline x1='939.6' y1='495.9' x2='1077.7' y2='508.5' stroke-opacity='0.021'/%3E%3Cline x1='877.6' y1='138.8' x2='900.1' y2='235.2' stroke-opacity='0.095'/%3E%3Cline x1='632.4' y1='180.3' x2='592.9' y2='172.2' stroke-opacity='0.205'/%3E%3Cline x1='907.8' y1='951.4' x2='1052.3' y2='961.8' stroke-opacity='0.009'/%3E%3Cline x1='10.5' y1='310.4' x2='-99.9' y2='235.2' stroke-opacity='0.031'/%3E%3Cline x1='741.1' y1='611.7' x2='714.1' y2='622.7' stroke-opacity='0.225'/%3E%3Cline x1='238.0' y1='1102.6' x2='373.9' y2='1117.8' stroke-opacity='0.025'/%3E%3C/g%3E%3Cg fill='rgba(228,169,196,.75)'%3E%3Ccircle cx='0.1' cy='1151.0' r='1.85'/%3E%3Ccircle cx='210.6' cy='911.7' r='2.31'/%3E%3Ccircle cx='329.3' cy='940.1' r='2.73'/%3E%3Ccircle cx='542.9' cy='855.6' r='2.51'/%3E%3Ccircle cx='816.8' cy='302.5' r='2.01'/%3E%3Ccircle cx='707.9' cy='872.6' r='1.40'/%3E%3Ccircle cx='683.9' cy='584.9' r='3.05'/%3E%3Ccircle cx='807.4' cy='153.5' r='2.27'/%3E%3Ccircle cx='923.2' cy='860.6' r='2.52'/%3E%3Ccircle cx='577.4' cy='1140.0' r='3.03'/%3E%3Ccircle cx='372.2' cy='419.2' r='2.89'/%3E%3Ccircle cx='332.3' cy='190.7' r='1.87'/%3E%3Ccircle cx='428.5' cy='368.6' r='3.08'/%3E%3Ccircle cx='557.4' cy='911.6' r='2.97'/%3E%3Ccircle cx='58.6' cy='341.9' r='2.37'/%3E%3Ccircle cx='508.8' cy='526.8' r='1.67'/%3E%3Ccircle cx='909.0' cy='68.6' r='1.99'/%3E%3Ccircle cx='344.1' cy='830.5' r='3.06'/%3E%3Ccircle cx='514.9' cy='206.9' r='2.07'/%3E%3Ccircle cx='283.6' cy='455.6' r='2.11'/%3E%3Ccircle cx='332.6' cy='664.6' r='2.47'/%3E%3Ccircle cx='233.2' cy='1133.1' r='2.17'/%3E%3Ccircle cx='863.0' cy='793.9' r='2.51'/%3E%3Ccircle cx='516.2' cy='631.2' r='2.61'/%3E%3Ccircle cx='939.6' cy='495.9' r='2.65'/%3E%3Ccircle cx='251.1' cy='733.6' r='1.97'/%3E%3Ccircle cx='330.6' cy='489.3' r='2.81'/%3E%3Ccircle cx='877.6' cy='138.8' r='2.86'/%3E%3Ccircle cx='77.7' cy='508.5' r='1.59'/%3E%3Ccircle cx='77.9' cy='1245.3' r='1.72'/%3E%3Ccircle cx='632.4' cy='180.3' r='2.17'/%3E%3Ccircle cx='592.9' cy='172.2' r='3.05'/%3E%3Ccircle cx='884.6' cy='1113.2' r='2.98'/%3E%3Ccircle cx='907.8' cy='951.4' r='1.82'/%3E%3Ccircle cx='10.5' cy='310.4' r='1.44'/%3E%3Ccircle cx='1.6' cy='771.1' r='1.74'/%3E%3Ccircle cx='741.1' cy='611.7' r='2.61'/%3E%3Ccircle cx='238.0' cy='1102.6' r='1.75'/%3E%3Ccircle cx='373.9' cy='1117.8' r='1.52'/%3E%3Ccircle cx='489.3' cy='3.7' r='3.03'/%3E%3Ccircle cx='636.9' cy='1152.6' r='1.34'/%3E%3Ccircle cx='900.1' cy='235.2' r='3.14'/%3E%3Ccircle cx='565.3' cy='849.2' r='1.81'/%3E%3Ccircle cx='222.8' cy='261.2' r='2.37'/%3E%3Ccircle cx='52.3' cy='961.8' r='2.63'/%3E%3Ccircle cx='714.1' cy='622.7' r='1.36'/%3E%3C/g%3E%3C/g%3E%3Cuse href='%23t' x='1000'/%3E%3C/g%3E%3C/g%3E%3Cellipse class='glow' cx='330' cy='260' rx='300' ry='720' fill='url(%23g)'/%3E%3Cg transform='translate(850 1075) scale(0.52) translate(-1412 -425)' fill='none' stroke-linecap='round'%3E%3Cpath  d='M-128 945 C 412 905, 712 725, 992 645 S 1492 425, 2352 365' pathLength='1' stroke='%23F3C9DA' stroke-width='1.6' stroke-opacity='.3'/%3E%3Cpath  d='M-128 989 C 412 949, 712 751, 992 671 S 1492 455, 2352 395' pathLength='1' stroke='%23F3C9DA' stroke-width='1.6' stroke-opacity='.3'/%3E%3Cpath  d='M-128 1033 C 412 993, 712 777, 992 697 S 1492 485, 2352 425' pathLength='1' stroke='%23F3C9DA' stroke-width='1.6' stroke-opacity='.3'/%3E%3Cpath  d='M-128 1077 C 412 1037, 712 803, 992 723 S 1492 515, 2352 455' pathLength='1' stroke='%23F3C9DA' stroke-width='1.6' stroke-opacity='.3'/%3E%3Cpath  d='M-128 1121 C 412 1081, 712 829, 992 749 S 1492 545, 2352 485' pathLength='1' stroke='%23F3C9DA' stroke-width='1.6' stroke-opacity='.3'/%3E%3Cg transform='translate(1300 500) rotate(12) scale(1.12) translate(-1412 -425)'%3E%3Cpath  d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='%23C95788' stroke-width='8' stroke-opacity='.16'/%3E%3Cpath  d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='url(%23edge2)' stroke-width='2.4'/%3E%3C/g%3E%3Cpath  d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='%23E4A9C4' stroke-width='30' stroke-opacity='.1'/%3E%3Cpath  d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='%23E4A9C4' stroke-width='12' stroke-opacity='.2'/%3E%3Cpath  d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='url(%23edge)' stroke-width='3.5'/%3E%3Cpath class='pk' d='M-128 945 C 412 905, 712 725, 992 645 S 1492 425, 2352 365' pathLength='1' stroke='%23fff' stroke-width='2.2' stroke-opacity='.9' style='animation-duration:7s,1s;animation-delay:0s,0s'/%3E%3Cpath class='pk' d='M-128 989 C 412 949, 712 751, 992 671 S 1492 455, 2352 395' pathLength='1' stroke='%23fff' stroke-width='2.2' stroke-opacity='.9' style='animation-duration:7.8s,1s;animation-delay:0.6s,0.6s'/%3E%3Cpath class='pk' d='M-128 1033 C 412 993, 712 777, 992 697 S 1492 485, 2352 425' pathLength='1' stroke='%23fff' stroke-width='2.2' stroke-opacity='.9' style='animation-duration:8.6s,1s;animation-delay:1.2s,1.2s'/%3E%3Cpath class='pk' d='M-128 1077 C 412 1037, 712 803, 992 723 S 1492 515, 2352 455' pathLength='1' stroke='%23fff' stroke-width='2.2' stroke-opacity='.9' style='animation-duration:9.4s,1s;animation-delay:1.7999999999999998s,1.7999999999999998s'/%3E%3Cpath class='pk' d='M-128 1121 C 412 1081, 712 829, 992 749 S 1492 545, 2352 485' pathLength='1' stroke='%23fff' stroke-width='2.2' stroke-opacity='.9' style='animation-duration:10.2s,1s;animation-delay:2.4s,2.4s'/%3E%3Cpath class='run' d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='%23F3C9DA' stroke-width='14' style='--o:.45'/%3E%3Cpath class='run w' d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='%23fff' stroke-width='5'/%3E%3Cg %3E%3Cg transform='translate(942 855) scale(0.26) translate(-1412 -425)'%3E%3Cpath d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' fill='url(%23glass)' stroke='%23F3C9DA' stroke-width='5' stroke-opacity='.8'/%3E%3Cpath d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' stroke='%23fff' stroke-width='2.5' stroke-opacity='.5' transform='translate(-16 -16)'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E"),
      radial-gradient(60% 80% at 85% 50%, rgba(201, 87, 136, .30), transparent 70%),
      radial-gradient(45% 60% at 100% 100%, rgba(201, 87, 136, .4), transparent 70%),
      linear-gradient(180deg, #2C1A63 0%, #511C76 100%) !important;
  }
}

/* O título em duas peças: a primeira presa por baixo ao meio da tela, a
   segunda presa por cima. Se "Um único sistema." quebrar numa tela estreita,
   ela cresce para baixo e nunca encavala na primeira linha. */
body.t-PageBody--login:not(#nc-p1):not(#nc-p2)::after,
body.t-PageBody--login:not(#nc-p1):not(#nc-p2) #wwvFlowForm::before {
  position: fixed !important;
  left: calc(100% - var(--nc-painel)) !important;
  right: 0 !important;
  padding: 0 var(--nc-pad) !important;
  font: 800 var(--nc-fs)/1.02 Manrope, system-ui, sans-serif !important;
  letter-spacing: -.02em !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2)::after {
  content: var(--nc-login-titulo) !important;
  bottom: 50% !important;
  color: #fff !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) #wwvFlowForm::before {
  content: var(--nc-login-destaque) !important;
  top: 50% !important;
  color: #F3C9DA !important;                       /* o destaque do hero da home */
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) #wwvFlowForm::after {   /* a assinatura Natcorp */
  content: "" !important;
  position: fixed !important;
  top: clamp(32px, 6vh, 56px) !important;
  left: calc(100% - var(--nc-painel) + var(--nc-pad)) !important;
  width: 150px !important;
  height: 38px !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.596 8' fill='%23fff'%3E%3Cpath d='M4.322 0.322L5.573 1.573A0.456 0.456 0 0 1 5.573 2.218L4.322 3.469A0.456 0.456 0 0 1 3.678 3.469L2.427 2.218A0.456 0.456 0 0 1 2.427 1.573L3.678 0.322A0.456 0.456 0 0 1 4.322 0.322Z'/%3E%3Cpath d='M6.427 2.427L7.678 3.678A0.456 0.456 0 0 1 7.678 4.322L6.427 5.573A0.456 0.456 0 0 1 5.782 5.573L4.531 4.322A0.456 0.456 0 0 1 4.531 3.678L5.782 2.427A0.456 0.456 0 0 1 6.427 2.427Z'/%3E%3Cpath d='M2.218 2.427L3.469 3.678A0.456 0.456 0 0 1 3.469 4.322L2.218 5.573A0.456 0.456 0 0 1 1.573 5.573L0.322 4.322A0.456 0.456 0 0 1 0.322 3.678L1.573 2.427A0.456 0.456 0 0 1 2.218 2.427Z'/%3E%3Cpath d='M4.322 4.531L5.573 5.782A0.456 0.456 0 0 1 5.573 6.427L4.322 7.678A0.456 0.456 0 0 1 3.678 7.678L2.427 6.427A0.456 0.456 0 0 1 2.427 5.782L3.678 4.531A0.456 0.456 0 0 1 4.322 4.531Z'/%3E%3Cpath d='M11.61 5.69V4.04Q11.61 3.86 11.58 3.66Q11.55 3.46 11.47 3.28Q11.38 3.10 11.22 2.99Q11.05 2.87 10.78 2.87Q10.62 2.87 10.47 2.93Q10.32 2.98 10.21 3.10Q10.09 3.23 10.02 3.43Q9.95 3.64 9.95 3.94L9.53 3.77Q9.53 3.32 9.70 2.97Q9.87 2.62 10.19 2.42Q10.52 2.22 10.98 2.22Q11.34 2.22 11.58 2.34Q11.82 2.45 11.97 2.64Q12.11 2.83 12.19 3.05Q12.26 3.26 12.29 3.46Q12.31 3.67 12.31 3.81V5.69ZM9.25 5.69V2.31H9.87V3.32H9.95V5.69Z'/%3E%3Cpath d='M13.95 5.78Q13.58 5.78 13.32 5.64Q13.07 5.50 12.94 5.27Q12.81 5.04 12.81 4.77Q12.81 4.52 12.90 4.32Q12.99 4.13 13.16 3.99Q13.33 3.85 13.60 3.76Q13.81 3.70 14.09 3.65Q14.37 3.59 14.69 3.55Q15.00 3.51 15.33 3.46L15.08 3.60Q15.09 3.22 14.92 3.04Q14.75 2.86 14.35 2.86Q14.10 2.86 13.88 2.97Q13.66 3.09 13.57 3.36L12.93 3.17Q13.06 2.73 13.41 2.48Q13.76 2.22 14.35 2.22Q14.80 2.22 15.14 2.37Q15.48 2.52 15.64 2.86Q15.72 3.03 15.74 3.21Q15.76 3.40 15.76 3.61V5.69H15.15V4.93L15.26 5.04Q15.05 5.42 14.73 5.60Q14.41 5.78 13.95 5.78ZM14.08 5.22Q14.35 5.22 14.54 5.13Q14.73 5.03 14.85 4.89Q14.96 4.74 15.00 4.60Q15.06 4.45 15.06 4.26Q15.07 4.07 15.07 3.96L15.29 4.04Q14.97 4.09 14.72 4.12Q14.47 4.16 14.28 4.20Q14.09 4.23 13.94 4.28Q13.80 4.33 13.71 4.39Q13.61 4.46 13.55 4.55Q13.49 4.64 13.49 4.76Q13.49 4.89 13.56 4.99Q13.62 5.10 13.75 5.16Q13.88 5.22 14.08 5.22Z'/%3E%3Cpath d='M18.40 5.69Q18.07 5.75 17.76 5.74Q17.45 5.73 17.20 5.62Q16.96 5.51 16.83 5.28Q16.72 5.06 16.71 4.84Q16.71 4.62 16.71 4.34V1.38H17.40V4.30Q17.40 4.51 17.40 4.66Q17.41 4.81 17.47 4.91Q17.58 5.10 17.83 5.12Q18.07 5.15 18.40 5.10ZM16.07 2.86V2.31H18.40V2.86Z'/%3E%3Cpath d='M20.44 5.78Q19.92 5.78 19.56 5.55Q19.19 5.32 19.00 4.91Q18.80 4.51 18.80 4.00Q18.80 3.48 19.00 3.08Q19.20 2.68 19.57 2.45Q19.94 2.22 20.45 2.22Q21.01 2.22 21.41 2.50Q21.80 2.78 21.93 3.27L21.24 3.46Q21.14 3.18 20.93 3.03Q20.71 2.87 20.44 2.87Q20.13 2.87 19.93 3.02Q19.73 3.16 19.63 3.42Q19.54 3.67 19.54 4.00Q19.54 4.51 19.77 4.82Q19.99 5.13 20.44 5.13Q20.75 5.13 20.94 4.99Q21.12 4.84 21.22 4.58L21.93 4.74Q21.76 5.24 21.38 5.51Q20.99 5.78 20.44 5.78Z'/%3E%3Cpath d='M23.91 5.78Q23.40 5.78 23.03 5.55Q22.66 5.33 22.45 4.92Q22.25 4.52 22.25 4.00Q22.25 3.47 22.46 3.07Q22.67 2.67 23.04 2.44Q23.41 2.22 23.91 2.22Q24.42 2.22 24.79 2.45Q25.17 2.67 25.37 3.08Q25.58 3.48 25.58 4.00Q25.58 4.53 25.37 4.93Q25.17 5.33 24.79 5.56Q24.42 5.78 23.91 5.78ZM23.91 5.13Q24.38 5.13 24.61 4.81Q24.84 4.50 24.84 4.00Q24.84 3.48 24.61 3.18Q24.38 2.87 23.91 2.87Q23.59 2.87 23.39 3.01Q23.18 3.16 23.08 3.41Q22.98 3.66 22.98 4.00Q22.98 4.51 23.22 4.82Q23.45 5.13 23.91 5.13Z'/%3E%3Cpath d='M26.14 5.69V2.31H26.76V3.13L26.68 3.03Q26.74 2.86 26.84 2.72Q26.94 2.59 27.08 2.50Q27.21 2.41 27.36 2.36Q27.52 2.31 27.68 2.30Q27.84 2.29 28.00 2.31V2.96Q27.84 2.92 27.64 2.93Q27.44 2.95 27.27 3.06Q27.12 3.15 27.02 3.29Q26.93 3.43 26.88 3.61Q26.84 3.78 26.84 3.98V5.69Z'/%3E%3Cpath d='M30.06 5.78Q29.58 5.78 29.24 5.55Q28.91 5.31 28.75 4.91Q28.58 4.50 28.58 4.00Q28.58 3.49 28.74 3.09Q28.91 2.69 29.24 2.45Q29.57 2.22 30.04 2.22Q30.52 2.22 30.87 2.45Q31.22 2.68 31.41 3.09Q31.60 3.49 31.60 4.00Q31.60 4.50 31.41 4.91Q31.22 5.31 30.88 5.55Q30.53 5.78 30.06 5.78ZM28.46 7.19V2.31H29.07V4.72H29.16V7.19ZM29.96 5.16Q30.27 5.16 30.47 5.00Q30.67 4.85 30.76 4.59Q30.86 4.32 30.86 4.00Q30.86 3.68 30.76 3.42Q30.66 3.15 30.46 3.00Q30.26 2.84 29.94 2.84Q29.64 2.84 29.45 2.99Q29.26 3.13 29.17 3.40Q29.07 3.66 29.07 4.00Q29.07 4.34 29.17 4.60Q29.26 4.86 29.45 5.01Q29.65 5.16 29.96 5.16Z'/%3E%3C/svg%3E") left center / contain no-repeat !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

html:has(body.t-PageBody--login:not(#nc-p1):not(#nc-p2))::after {       /* a frase de apoio */
  content: var(--nc-login-texto) !important;
  position: fixed !important;
  left: calc(100% - var(--nc-painel)) !important;
  right: 0 !important;
  bottom: clamp(32px, 6vh, 56px) !important;
  padding: 0 var(--nc-pad) !important;
  font: 500 15px/1.5 Manrope, system-ui, sans-serif !important;
  color: rgba(255, 255, 255, .75) !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

/* ---------- Coluna do formulário (esquerda) ------------------------- */

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Body {
  right: var(--nc-painel) !important;             /* a página 900 fixa inset:0 */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 48px clamp(24px, 5vw, 64px) !important;
  overflow-y: auto !important;
  z-index: 2 !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Body-wrap,
body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Body-col--main,
body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-container {
  width: 100% !important;
  max-width: 420px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background: none !important;
  min-height: 0 !important;
  display: block !important;
}

/* Universal Theme 1.4 (ex.: app 600): o login NÃO tem .t-Body. A estrutura é
     form#wwvFlowForm > .t-Login-container > main.t-Login-containerBody > .container…
   Então a coluna esquerda vai no .t-Login-container. "Filho direto do form"
   só existe no 1.4: no 1.1 (apps 100 e 202) ele mora dentro do .t-Body. */
body.t-PageBody--login:not(#nc-p1):not(#nc-p2) #wwvFlowForm > .t-Login-container {
  position: fixed !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  right: var(--nc-painel) !important;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 48px clamp(24px, 5vw, 64px) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow-y: auto !important;
  background: #fff !important;
  z-index: 2 !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-containerBody {
  display: block !important;
  width: 100% !important;
  max-width: 420px !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-container .container,
body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-container .row,
body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-container .col {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-region,
body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-body,
body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Form-inputContainer {
  overflow: visible !important;                    /* o tema corta anel de foco, ícone e sombra */
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-region {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Cabeçalho: logo do cliente, título, subtítulo — tudo à esquerda */

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-header {
  padding: 0 !important;
  margin: 0 !important;
  text-align: left !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-logo {
  display: block !important;
  width: 180px !important;
  height: 56px !important;
  margin: 0 0 40px !important;
  background-position: left center !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-title {
  font: 700 32px/1.15 Manrope, system-ui, sans-serif !important;
  font-size: 32px !important;
  letter-spacing: -.02em !important;
  color: var(--nc-tinta) !important;
  margin: 0 0 8px !important;
  text-align: left !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-header::after {
  content: var(--nc-login-subtitulo) !important;
  display: block !important;
  font: 500 15px/1.5 Manrope, system-ui, sans-serif !important;
  color: var(--nc-grafite) !important;
}

/* O subtítulo diz o que o formulário pede: no Portal do Candidato (app 600) o
   primeiro campo é E-mail, não Usuário. Sem suporte a :has(), fica o texto padrão. */
body.t-PageBody--login:not(#nc-p1):not(#nc-p2):has(#P900_EMAIL) .t-Login-header::after {
  content: "Entre com seu e-mail e senha para continuar." !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-body {
  margin-top: 32px !important;
  padding: 0 !important;
}

/* Campos */

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-body .t-Form-fieldContainer {
  margin: 0 0 18px !important;
  padding: 0 !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Form-labelContainer,
body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Form-inputContainer {
  padding: 0 !important;
  width: 100% !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Form-label {
  display: block !important;
  padding: 0 0 6px !important;
  font: 600 13px/1.4 Manrope, system-ui, sans-serif !important;
  color: var(--nc-grafite) !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Form-itemWrapper {
  position: relative !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-body input.apex-item-text {
  width: 100% !important;
  height: 48px !important;
  padding: 0 14px 0 44px !important;
  text-indent: 0 !important;                       /* o tema 1.4 soma 2rem–3.1rem ao padding */
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 12px !important;
  background: #fff !important;
  font: 500 15px Manrope, system-ui, sans-serif !important;
  color: var(--nc-tinta) !important;
  box-shadow: 0 1px 2px rgba(27, 18, 56, .04) !important;
  transition: border-color .15s, box-shadow .15s !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-body input.apex-item-text::placeholder {
  color: var(--nc-cinza) !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-body input.apex-item-text:hover {
  border-color: #D6CFE4 !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-body input.apex-item-text:focus {
  border-color: var(--nc-roxo) !important;   /* o CSS antigo força rosa */
  box-shadow: 0 0 0 4px rgba(81, 28, 118, .14) !important;
  outline: none !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-body .apex-item-icon {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  margin: 0 !important;                            /* o tema desloca o ícone -40px */
  z-index: 3 !important;                           /* o campo é item de flex: o z-index do
                                           tema vale nele e cobria a chave no foco */
  pointer-events: none !important;
  width: 44px !important;
  height: 48px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--nc-cinza) !important;
  background: none !important;
  box-shadow: none !important;                     /* o Theme Roller do rótulo flutuante
                                           desenha um divisor com sombra interna */
  transition: color .15s !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-body input.apex-item-text:focus + .apex-item-icon {
  color: var(--nc-roxo) !important;
}

/* Rótulo flutuante (Universal Theme 1.4, ex.: app 500). O tema monta cada campo
   como uma LINHA flex — rótulo e campo lado a lado (order 2 e 3), rótulo absolute,
   movido para dentro do campo. Aqui ele vira o mesmo desenho dos outros apps:
   rótulo acima, campo na largura toda. O ponto e o ícone vermelhos de
   "obrigatório" saem: num login os dois campos são obviamente obrigatórios. */

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-body .t-Form-fieldContainer--floatingLabel {
  display: block !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Form-fieldContainer--floatingLabel .t-Form-labelContainer,
body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Form-fieldContainer--floatingLabel .t-Form-inputContainer {
  position: relative !important;
  order: 0 !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Form-fieldContainer--floatingLabel .t-Form-label {
  position: static !important;
  top: auto !important;
  left: auto !important;
  transform: none !important;
  margin: 0 !important;
  background: none !important;
  white-space: normal !important;
  pointer-events: auto !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Form-fieldContainer--floatingLabel::before,
body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Form-fieldContainer--floatingLabel .t-Form-label::before,
body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Form-fieldContainer--floatingLabel .t-Form-label::after {
  content: none !important;
  display: none !important;
}

/* Botão Entrar */

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-buttons {
  padding: 0 !important;
  margin-top: 8px !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-buttons .t-Button--hot {
  width: 100% !important;
  height: 50px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: var(--nc-roxo) !important;          /* Roxo sólido, como o botão principal do site */
  box-shadow: 0 10px 24px -10px rgba(81, 28, 118, .55) !important;
  font: 700 15px Manrope, system-ui, sans-serif !important;
  color: #fff !important;
  transition: box-shadow .15s, filter .15s !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-buttons .t-Button--hot:hover {
  background: var(--nc-azul) !important;           /* hover no Azul da marca, igual às páginas internas */
  box-shadow: 0 14px 28px -10px rgba(81, 28, 118, .6) !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-buttons .t-Button--hot:focus-visible {
  outline: 3px solid var(--nc-roxo) !important;
  outline-offset: 3px !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-buttons .t-Button--hot .t-Icon {
  display: none !important;                        /* o ícone "desligar" some */
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-links {
  padding: 16px 0 0 !important;
  text-align: left !important;
}

/* ---------- Botões secundários (apps com SSO e recuperação de senha) --
   Hierarquia: Entrar é a ação principal; Entrar SSO, a alternativa, em
   contorno; Alterar e Esqueci senha, caminhos de exceção, como links
   discretos lado a lado. Por classe, nunca pelo id gerado do botão:
     .t-Button--hot                      Entrar
     .t-Button--hot.t-Button--simple     Entrar SSO
     .t-Button:not(.t-Button--hot)       Alterar Senha, Esqueci Senha
   -------------------------------------------------------------------- */

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-buttons {
  display: flex !important;
  flex-flow: row wrap !important;
  justify-content: space-between !important;
  gap: 12px 16px !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-buttons .t-Button {
  flex: 1 1 100% !important;
  margin: 0 !important;
  letter-spacing: normal !important;
  justify-content: center !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-buttons .t-Button .t-Icon {
  display: none !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-buttons .t-Button .t-Button-label {
  font-family: inherit !important;
  color: inherit !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-buttons .t-Button--hot.t-Button--simple {
  height: 48px !important;
  border: 1.5px solid var(--nc-roxo) !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: none !important;
  color: var(--nc-roxo) !important;
  filter: none !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-buttons .t-Button--hot.t-Button--simple:hover {
  background: var(--nc-off) !important;
  box-shadow: none !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-buttons .t-Button:not(.t-Button--hot) {
  flex: 0 0 auto !important;
  width: auto !important;                          /* tema e Natcorp_Style_Min fixam 100% */
  height: auto !important;
  padding: 4px 0 !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: none !important;
  box-shadow: none !important;
  font: 600 14px/1.4 Manrope, system-ui, sans-serif !important;
  color: var(--nc-roxo) !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-buttons .t-Button:not(.t-Button--hot):hover {
  background: none !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-buttons .t-Button:focus-visible {
  outline: 3px solid var(--nc-roxo) !important;
  outline-offset: 3px !important;
}

/* ---------- Zerar o outro redesenho do login ------------------------
   O Natcorp_Style_Min.css do workspace natcorp (app 100) desenha um
   login próprio. Prioridade só decide as propriedades que as DUAS folhas
   declaram; as que só ele declara continuariam valendo. Esta lista foi
   MEDIDA em 26/09 no app 100: para cada elemento do login, as
   propriedades que só ele escreve, com o valor que o elemento tem com
   aquela folha desligada. Alturas vão como auto, nunca em px: o valor
   medido em uma tela quebraria as outras.
   Se aquela folha mudar, meça de novo: medir-conflitos.js.
   -------------------------------------------------------------------- */

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-container::before,
body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-header::before,
body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-body::before {
  content: none !important;
  display: none !important;
  background: none !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) {
  min-height: 0 !important;
  overflow-y: visible !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Body {
  position: absolute !important;
  height: auto !important;
  min-height: 0 !important;
  background-color: transparent !important;
  color: var(--nc-tinta) !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Body-wrap,
body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Body-col {
  top: auto !important;
  height: auto !important;
  border: 0 none !important;
  border-image: none !important;
  gap: normal !important;
  align-items: normal !important;
  justify-content: normal !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-container .container,
body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-container .row,
body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-container .col {
  row-gap: normal !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-header {
  position: static !important;
  display: block !important;
  height: auto !important;
  align-items: normal !important;
  background: none !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-title {
  height: auto !important;
  overflow: visible !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-body .t-Form-fieldContainer {
  position: static !important;
  min-width: 0 !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Form-label {
  text-transform: none !important;
  letter-spacing: normal !important;
  margin-bottom: 0 !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-body .t-Form-inputContainer {
  display: block !important;
  position: relative !important;
  align-items: normal !important;
  flex-wrap: nowrap !important;
  gap: normal !important;
  min-width: 0 !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-body .t-Form-itemWrapper {
  display: flex !important;
  flex: 0 1 auto !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  gap: normal !important;
  min-width: 0 !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-body input.apex-item-text {
  appearance: auto !important;
  backface-visibility: visible !important;
  box-sizing: border-box !important;
  flex: 1 1 0% !important;
  min-width: 0 !important;
  min-height: auto !important;
  max-width: 100% !important;
  opacity: 1 !important;
}

body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-body .apex-item-icon {
  flex: 0 1 auto !important;
  min-width: 0 !important;
}

/* ---------- Celular e tablet: só o formulário ----------------------- */

@media (max-width: 991px) {
  body.t-PageBody--login:not(#nc-p1):not(#nc-p2)::before,
  body.t-PageBody--login:not(#nc-p1):not(#nc-p2)::after,
  body.t-PageBody--login:not(#nc-p1):not(#nc-p2) #wwvFlowForm::before,
  body.t-PageBody--login:not(#nc-p1):not(#nc-p2) #wwvFlowForm::after,
  html:has(body.t-PageBody--login:not(#nc-p1):not(#nc-p2))::after {
    display: none !important;
  }

  body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Body,
  body.t-PageBody--login:not(#nc-p1):not(#nc-p2) #wwvFlowForm > .t-Login-container {
    right: 0 !important;
    align-items: flex-start !important;
    padding: 12vh 24px 32px !important;
  }

  body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-logo {
    margin-bottom: 32px !important;
  }

  body.t-PageBody--login:not(#nc-p1):not(#nc-p2) .t-Login-title {
    font-size: 28px !important;
  }
}

/* ===== Natcorp_Menu.css ===== */
/* =====================================================================
   Natcorp_Menu — cabeçalho superior e menu lateral das páginas internas,
   com o mesmo fundo e o mesmo efeito do painel roxo do login: degradê
   Azul → Roxo, brilho Rosa, malha, rede de pontos à deriva e os losangos
   com a luz correndo na borda. Só as três cores da marca:
     Roxo #511C76 · Rosa #C95788 · Azul #2C1A63
   (o Rosa clareado #E4A9C4 / #F3C9DA só nos brilhos e ícones sobre o escuro).
   "@app" vira html body.t-PageBody:not(.t-PageBody--login):not(#nc-a1):not(#nc-a2)
   e toda declaração ganha !important — feito pelo gerar-app.mjs, que também
   troca os marcadores @@…@@ pelas imagens do ../painel-natcorp.mjs.
   NÃO edite o .css gerado: edite este.
   Medidas que o tema calcula (cabeçalho 48 px, menu 240/48 px) não mudam:
   o theme42.js e o layout dependem delas.
   ===================================================================== */

:root {
  --nc-azul: #2C1A63; --nc-roxo: #511C76; --nc-rosa: #C95788;
  --nc-rosa-claro: #E4A9C4;
  --nc-tinta: #1B1238;
}

/* ---------- 1. Cabeçalho: a continuação do painel -------------------- */
/* Começa no Azul, onde encosta no topo do menu, e vai ao Roxo, com o
   brilho Rosa à direita — o mesmo desenho do painel, na horizontal. */

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Header {
  background-color: var(--nc-azul) !important;
  background-image:
    radial-gradient(38% 260% at 88% 0%, rgba(201, 87, 136, .38), transparent 70%),
    radial-gradient(30% 220% at 45% 100%, rgba(81, 28, 118, .55), transparent 70%),
    linear-gradient(90deg, #2C1A63 0%, #511C76 100%) !important;
  backdrop-filter: none !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .07), 0 10px 28px -18px rgba(44, 26, 99, .8) !important;
  border: 0 !important;
  color: #fff !important;
}

/* o tema e a Natcorp Skin pintam também os FILHOS do cabeçalho (o degradê antigo está no
   .t-Header-branding, o roxo no .t-Header-nav): sem isto eles cobrem o fundo novo */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Header-branding,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Header-nav,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Header-navBar,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Header-logo {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* o símbolo Natcorp, branco, antes do nome do app */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Header-logo-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  color: #fff !important;
  text-decoration: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Header-logo-link::before {
  content: "" !important;
  width: 22px !important;
  height: 22px !important;
  flex: none !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8' fill='%23fff'%3E%3Cpath d='M4.322 0.322L5.573 1.573A0.456 0.456 0 0 1 5.573 2.218L4.322 3.469A0.456 0.456 0 0 1 3.678 3.469L2.427 2.218A0.456 0.456 0 0 1 2.427 1.573L3.678 0.322A0.456 0.456 0 0 1 4.322 0.322Z'/%3E%3Cpath d='M6.427 2.427L7.678 3.678A0.456 0.456 0 0 1 7.678 4.322L6.427 5.573A0.456 0.456 0 0 1 5.782 5.573L4.531 4.322A0.456 0.456 0 0 1 4.531 3.678L5.782 2.427A0.456 0.456 0 0 1 6.427 2.427Z'/%3E%3Cpath d='M2.218 2.427L3.469 3.678A0.456 0.456 0 0 1 3.469 4.322L2.218 5.573A0.456 0.456 0 0 1 1.573 5.573L0.322 4.322A0.456 0.456 0 0 1 0.322 3.678L1.573 2.427A0.456 0.456 0 0 1 2.218 2.427Z'/%3E%3Cpath d='M4.322 4.531L5.573 5.782A0.456 0.456 0 0 1 5.573 6.427L4.322 7.678A0.456 0.456 0 0 1 3.678 7.678L2.427 6.427A0.456 0.456 0 0 1 2.427 5.782L3.678 4.531A0.456 0.456 0 0 1 4.322 4.531Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Header-logo,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Header-logo-link,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Header-logo span {
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  letter-spacing: -.02em !important;
  color: #fff !important;
}

/* "Manual" e "Blog" são <a>, "Notificações" e o usuário são <button>: o navegador centraliza
   o conteúdo do botão mas não o do link. inline-flex centraliza os dois igual. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Header .t-Button--header {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  height: 36px !important;
  margin: 6px 2px !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(255, 255, 255, .86) !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  transition: background-color .2s, color .2s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Header .t-Button--header .t-Icon,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Header .t-Button--header .t-Button-label,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Header .t-Button--header .a-Icon {
  color: inherit !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Header .t-Button--header:hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Header .t-Button--header.is-active,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Header .t-Button--header[aria-expanded="true"] {
  background: rgba(255, 255, 255, .12) !important;
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Header .t-Button--header:focus-visible {
  outline: 2px solid var(--nc-rosa-claro) !important;
  outline-offset: 2px !important;
}

/* o botão do menu (hambúrguer): quadrado de 36 com o ícone no centro —
   o tema dava margem ao ícone e ele ficava 10 px à esquerda */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Header .t-Button--headerTree {
  width: 36px !important;
  padding: 0 !important;
  margin-left: 8px !important;
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Header .t-Button--headerTree .t-Icon {
  margin: 0 !important;
  position: static !important;
}

/* ---------- 2. Menu lateral: o painel do login ---------------------- */
/* O fundo vai no .t-Body-nav, que é quem ROLA: fundo em elemento que rola
   fica parado enquanto os itens passam por cima. O logo Natcorp é a PRIMEIRA
   camada desse fundo — assim fica preso ao pé do menu, sem elemento novo no
   HTML, e a lista (com 96 px de folga no fim) nunca termina em cima dele. */

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-nav {
  background-color: var(--nc-azul) !important;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.596 8' fill='%23fff'%3E%3Cpath d='M4.322 0.322L5.573 1.573A0.456 0.456 0 0 1 5.573 2.218L4.322 3.469A0.456 0.456 0 0 1 3.678 3.469L2.427 2.218A0.456 0.456 0 0 1 2.427 1.573L3.678 0.322A0.456 0.456 0 0 1 4.322 0.322Z'/%3E%3Cpath d='M6.427 2.427L7.678 3.678A0.456 0.456 0 0 1 7.678 4.322L6.427 5.573A0.456 0.456 0 0 1 5.782 5.573L4.531 4.322A0.456 0.456 0 0 1 4.531 3.678L5.782 2.427A0.456 0.456 0 0 1 6.427 2.427Z'/%3E%3Cpath d='M2.218 2.427L3.469 3.678A0.456 0.456 0 0 1 3.469 4.322L2.218 5.573A0.456 0.456 0 0 1 1.573 5.573L0.322 4.322A0.456 0.456 0 0 1 0.322 3.678L1.573 2.427A0.456 0.456 0 0 1 2.218 2.427Z'/%3E%3Cpath d='M4.322 4.531L5.573 5.782A0.456 0.456 0 0 1 5.573 6.427L4.322 7.678A0.456 0.456 0 0 1 3.678 7.678L2.427 6.427A0.456 0.456 0 0 1 2.427 5.782L3.678 4.531A0.456 0.456 0 0 1 4.322 4.531Z'/%3E%3Cpath d='M11.61 5.69V4.04Q11.61 3.86 11.58 3.66Q11.55 3.46 11.47 3.28Q11.38 3.10 11.22 2.99Q11.05 2.87 10.78 2.87Q10.62 2.87 10.47 2.93Q10.32 2.98 10.21 3.10Q10.09 3.23 10.02 3.43Q9.95 3.64 9.95 3.94L9.53 3.77Q9.53 3.32 9.70 2.97Q9.87 2.62 10.19 2.42Q10.52 2.22 10.98 2.22Q11.34 2.22 11.58 2.34Q11.82 2.45 11.97 2.64Q12.11 2.83 12.19 3.05Q12.26 3.26 12.29 3.46Q12.31 3.67 12.31 3.81V5.69ZM9.25 5.69V2.31H9.87V3.32H9.95V5.69Z'/%3E%3Cpath d='M13.95 5.78Q13.58 5.78 13.32 5.64Q13.07 5.50 12.94 5.27Q12.81 5.04 12.81 4.77Q12.81 4.52 12.90 4.32Q12.99 4.13 13.16 3.99Q13.33 3.85 13.60 3.76Q13.81 3.70 14.09 3.65Q14.37 3.59 14.69 3.55Q15.00 3.51 15.33 3.46L15.08 3.60Q15.09 3.22 14.92 3.04Q14.75 2.86 14.35 2.86Q14.10 2.86 13.88 2.97Q13.66 3.09 13.57 3.36L12.93 3.17Q13.06 2.73 13.41 2.48Q13.76 2.22 14.35 2.22Q14.80 2.22 15.14 2.37Q15.48 2.52 15.64 2.86Q15.72 3.03 15.74 3.21Q15.76 3.40 15.76 3.61V5.69H15.15V4.93L15.26 5.04Q15.05 5.42 14.73 5.60Q14.41 5.78 13.95 5.78ZM14.08 5.22Q14.35 5.22 14.54 5.13Q14.73 5.03 14.85 4.89Q14.96 4.74 15.00 4.60Q15.06 4.45 15.06 4.26Q15.07 4.07 15.07 3.96L15.29 4.04Q14.97 4.09 14.72 4.12Q14.47 4.16 14.28 4.20Q14.09 4.23 13.94 4.28Q13.80 4.33 13.71 4.39Q13.61 4.46 13.55 4.55Q13.49 4.64 13.49 4.76Q13.49 4.89 13.56 4.99Q13.62 5.10 13.75 5.16Q13.88 5.22 14.08 5.22Z'/%3E%3Cpath d='M18.40 5.69Q18.07 5.75 17.76 5.74Q17.45 5.73 17.20 5.62Q16.96 5.51 16.83 5.28Q16.72 5.06 16.71 4.84Q16.71 4.62 16.71 4.34V1.38H17.40V4.30Q17.40 4.51 17.40 4.66Q17.41 4.81 17.47 4.91Q17.58 5.10 17.83 5.12Q18.07 5.15 18.40 5.10ZM16.07 2.86V2.31H18.40V2.86Z'/%3E%3Cpath d='M20.44 5.78Q19.92 5.78 19.56 5.55Q19.19 5.32 19.00 4.91Q18.80 4.51 18.80 4.00Q18.80 3.48 19.00 3.08Q19.20 2.68 19.57 2.45Q19.94 2.22 20.45 2.22Q21.01 2.22 21.41 2.50Q21.80 2.78 21.93 3.27L21.24 3.46Q21.14 3.18 20.93 3.03Q20.71 2.87 20.44 2.87Q20.13 2.87 19.93 3.02Q19.73 3.16 19.63 3.42Q19.54 3.67 19.54 4.00Q19.54 4.51 19.77 4.82Q19.99 5.13 20.44 5.13Q20.75 5.13 20.94 4.99Q21.12 4.84 21.22 4.58L21.93 4.74Q21.76 5.24 21.38 5.51Q20.99 5.78 20.44 5.78Z'/%3E%3Cpath d='M23.91 5.78Q23.40 5.78 23.03 5.55Q22.66 5.33 22.45 4.92Q22.25 4.52 22.25 4.00Q22.25 3.47 22.46 3.07Q22.67 2.67 23.04 2.44Q23.41 2.22 23.91 2.22Q24.42 2.22 24.79 2.45Q25.17 2.67 25.37 3.08Q25.58 3.48 25.58 4.00Q25.58 4.53 25.37 4.93Q25.17 5.33 24.79 5.56Q24.42 5.78 23.91 5.78ZM23.91 5.13Q24.38 5.13 24.61 4.81Q24.84 4.50 24.84 4.00Q24.84 3.48 24.61 3.18Q24.38 2.87 23.91 2.87Q23.59 2.87 23.39 3.01Q23.18 3.16 23.08 3.41Q22.98 3.66 22.98 4.00Q22.98 4.51 23.22 4.82Q23.45 5.13 23.91 5.13Z'/%3E%3Cpath d='M26.14 5.69V2.31H26.76V3.13L26.68 3.03Q26.74 2.86 26.84 2.72Q26.94 2.59 27.08 2.50Q27.21 2.41 27.36 2.36Q27.52 2.31 27.68 2.30Q27.84 2.29 28.00 2.31V2.96Q27.84 2.92 27.64 2.93Q27.44 2.95 27.27 3.06Q27.12 3.15 27.02 3.29Q26.93 3.43 26.88 3.61Q26.84 3.78 26.84 3.98V5.69Z'/%3E%3Cpath d='M30.06 5.78Q29.58 5.78 29.24 5.55Q28.91 5.31 28.75 4.91Q28.58 4.50 28.58 4.00Q28.58 3.49 28.74 3.09Q28.91 2.69 29.24 2.45Q29.57 2.22 30.04 2.22Q30.52 2.22 30.87 2.45Q31.22 2.68 31.41 3.09Q31.60 3.49 31.60 4.00Q31.60 4.50 31.41 4.91Q31.22 5.31 30.88 5.55Q30.53 5.78 30.06 5.78ZM28.46 7.19V2.31H29.07V4.72H29.16V7.19ZM29.96 5.16Q30.27 5.16 30.47 5.00Q30.67 4.85 30.76 4.59Q30.86 4.32 30.86 4.00Q30.86 3.68 30.76 3.42Q30.66 3.15 30.46 3.00Q30.26 2.84 29.94 2.84Q29.64 2.84 29.45 2.99Q29.26 3.13 29.17 3.40Q29.07 3.66 29.07 4.00Q29.07 4.34 29.17 4.60Q29.26 4.86 29.45 5.01Q29.65 5.16 29.96 5.16Z'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 1000' preserveAspectRatio='xMidYMid slice'%3E%3Cstyle%3E.draw{stroke-dasharray:1 1;stroke-dashoffset:1;opacity:0;animation:draw 2.2s cubic-bezier(.22,1,.36,1) .2s forwards}.d2{animation-duration:2.6s;animation-delay:.7s}.fl{animation-duration:1.8s}@keyframes draw{to{stroke-dashoffset:0;opacity:1}}.run{stroke-dasharray:.07 1;opacity:0;animation:run 14s linear infinite,in 1.2s ease 2.4s forwards}.run.w{stroke-dasharray:.055 1}@keyframes run{from{stroke-dashoffset:0}to{stroke-dashoffset:-2}}.pk{stroke-dasharray:.08 1;stroke-dashoffset:1;opacity:0;animation:pk linear infinite,in 1s ease forwards}@keyframes pk{from{stroke-dashoffset:1}to{stroke-dashoffset:-1}}@keyframes in{to{opacity:var(--o,1)}}.small{opacity:0;transform-box:fill-box;transform-origin:center;animation:in 1.2s cubic-bezier(.22,1,.36,1) 1.2s forwards,breathe 6s ease-in-out 2.4s infinite}@keyframes breathe{50%25{transform:scale(1.05)}}.glow{animation:drift 12s ease-in-out infinite}@keyframes drift{0%25,100%25{transform:translate(0,0);opacity:.5}50%25{transform:translate(60px,90px);opacity:.9}}.net{animation:slide 150s linear infinite}@keyframes slide{to{transform:translateX(-300px)}}%3C/style%3E%3Cdefs%3E%3CradialGradient id='g' cx='.5' cy='.5' r='.5'%3E%3Cstop offset='0' stop-color='%23C95788' stop-opacity='.3'/%3E%3Cstop offset='.45' stop-color='%23C95788' stop-opacity='.1'/%3E%3Cstop offset='1' stop-color='%23C95788' stop-opacity='0'/%3E%3C/radialGradient%3E%3Cpattern id='grid' width='56' height='56' patternUnits='userSpaceOnUse'%3E%3Cpath d='M56 0H0V56' fill='none' stroke='%23fff' stroke-opacity='.06'/%3E%3C/pattern%3E%3CradialGradient id='gm' cx='0.7166666666666667' cy='0.905' r='.62'%3E%3Cstop offset='0' stop-color='%23fff'/%3E%3Cstop offset='.75' stop-color='%23fff' stop-opacity='0'/%3E%3C/radialGradient%3E%3Cmask id='mg'%3E%3Crect width='300' height='1000' fill='url(%23gm)'/%3E%3C/mask%3E%3ClinearGradient id='nm' x1='0' x2='0' y1='0' y2='1'%3E%3Cstop offset='0' stop-color='%23fff' stop-opacity='.5'/%3E%3Cstop offset='1' stop-color='%23fff' stop-opacity='.8'/%3E%3C/linearGradient%3E%3Cmask id='mn'%3E%3Crect width='300' height='1000' fill='url(%23nm)'/%3E%3C/mask%3E%3ClinearGradient id='edge' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23F3C9DA' stop-opacity='.95'/%3E%3Cstop offset='.5' stop-color='%23E4A9C4' stop-opacity='.75'/%3E%3Cstop offset='1' stop-color='%23C95788' stop-opacity='.4'/%3E%3C/linearGradient%3E%3ClinearGradient id='edge2' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23E4A9C4' stop-opacity='.9'/%3E%3Cstop offset='.5' stop-color='%23C95788' stop-opacity='.75'/%3E%3Cstop offset='1' stop-color='%23C95788' stop-opacity='.45'/%3E%3C/linearGradient%3E%3ClinearGradient id='glass' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23F3C9DA' stop-opacity='.3'/%3E%3Cstop offset='.55' stop-color='%23C95788' stop-opacity='.16'/%3E%3Cstop offset='1' stop-color='%23511C76' stop-opacity='.1'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='300' height='1000' fill='url(%23grid)' mask='url(%23mg)'/%3E%3Cg mask='url(%23mn)' opacity='0.55'%3E%3Cg class='net'%3E%3Cg id='t'%3E%3Cg stroke='%23E4A9C4' stroke-width='1'%3E%3Cline x1='0.0' y1='920.8' x2='-126.8' y2='912.0' stroke-opacity='0.043'/%3E%3Cline x1='63.2' y1='729.4' x2='98.8' y2='752.1' stroke-opacity='0.201'/%3E%3Cline x1='63.2' y1='729.4' x2='162.9' y2='684.5' stroke-opacity='0.076'/%3E%3Cline x1='63.2' y1='729.4' x2='-23.0' y2='688.5' stroke-opacity='0.102'/%3E%3Cline x1='63.2' y1='729.4' x2='167.2' y2='729.3' stroke-opacity='0.086'/%3E%3Cline x1='98.8' y1='752.1' x2='162.9' y2='684.5' stroke-opacity='0.106'/%3E%3Cline x1='98.8' y1='752.1' x2='212.4' y2='698.0' stroke-opacity='0.045'/%3E%3Cline x1='98.8' y1='752.1' x2='-23.0' y2='688.5' stroke-opacity='0.023'/%3E%3Cline x1='98.8' y1='752.1' x2='167.2' y2='729.3' stroke-opacity='0.145'/%3E%3Cline x1='162.9' y1='684.5' x2='212.4' y2='698.0' stroke-opacity='0.184'/%3E%3Cline x1='162.9' y1='684.5' x2='277.0' y2='688.5' stroke-opacity='0.067'/%3E%3Cline x1='162.9' y1='684.5' x2='167.2' y2='729.3' stroke-opacity='0.196'/%3E%3Cline x1='245.0' y1='242.0' x2='242.2' y2='122.8' stroke-opacity='0.057'/%3E%3Cline x1='245.0' y1='242.0' x2='128.5' y2='294.9' stroke-opacity='0.041'/%3E%3Cline x1='212.4' y1='698.0' x2='277.0' y2='688.5' stroke-opacity='0.158'/%3E%3Cline x1='212.4' y1='698.0' x2='167.2' y2='729.3' stroke-opacity='0.178'/%3E%3Cline x1='242.2' y1='122.8' x2='99.7' y2='152.6' stroke-opacity='0.008'/%3E%3Cline x1='277.0' y1='688.5' x2='167.2' y2='729.3' stroke-opacity='0.061'/%3E%3Cline x1='111.7' y1='335.4' x2='128.5' y2='294.9' stroke-opacity='0.198'/%3E%3Cline x1='99.7' y1='152.6' x2='128.5' y2='294.9' stroke-opacity='0.009'/%3E%3C/g%3E%3Cg fill='rgba(228,169,196,.75)'%3E%3Ccircle cx='0.0' cy='920.8' r='1.85'/%3E%3Ccircle cx='63.2' cy='729.4' r='2.31'/%3E%3Ccircle cx='98.8' cy='752.1' r='2.73'/%3E%3Ccircle cx='162.9' cy='684.5' r='2.51'/%3E%3Ccircle cx='245.0' cy='242.0' r='2.01'/%3E%3Ccircle cx='212.4' cy='698.0' r='1.40'/%3E%3Ccircle cx='205.2' cy='467.9' r='3.05'/%3E%3Ccircle cx='242.2' cy='122.8' r='2.27'/%3E%3Ccircle cx='277.0' cy='688.5' r='2.52'/%3E%3Ccircle cx='173.2' cy='912.0' r='3.03'/%3E%3Ccircle cx='111.7' cy='335.4' r='2.89'/%3E%3Ccircle cx='99.7' cy='152.6' r='1.87'/%3E%3Ccircle cx='128.5' cy='294.9' r='3.08'/%3E%3Ccircle cx='167.2' cy='729.3' r='2.97'/%3E%3C/g%3E%3C/g%3E%3Cuse href='%23t' x='300'/%3E%3C/g%3E%3C/g%3E%3Cellipse class='glow' cx='60' cy='170' rx='170' ry='380' fill='url(%23g)'/%3E%3Cg transform='translate(215 905) scale(0.21) translate(-1412 -425)' fill='none' stroke-linecap='round'%3E%3Cpath class='draw fl' d='M-128 945 C 412 905, 712 725, 992 645 S 1492 425, 2352 365' pathLength='1' stroke='%23F3C9DA' stroke-width='1.6' stroke-opacity='.3'/%3E%3Cpath class='draw fl' d='M-128 989 C 412 949, 712 751, 992 671 S 1492 455, 2352 395' pathLength='1' stroke='%23F3C9DA' stroke-width='1.6' stroke-opacity='.3'/%3E%3Cpath class='draw fl' d='M-128 1033 C 412 993, 712 777, 992 697 S 1492 485, 2352 425' pathLength='1' stroke='%23F3C9DA' stroke-width='1.6' stroke-opacity='.3'/%3E%3Cpath class='draw fl' d='M-128 1077 C 412 1037, 712 803, 992 723 S 1492 515, 2352 455' pathLength='1' stroke='%23F3C9DA' stroke-width='1.6' stroke-opacity='.3'/%3E%3Cpath class='draw fl' d='M-128 1121 C 412 1081, 712 829, 992 749 S 1492 545, 2352 485' pathLength='1' stroke='%23F3C9DA' stroke-width='1.6' stroke-opacity='.3'/%3E%3Cg transform='translate(1300 500) rotate(12) scale(1.12) translate(-1412 -425)'%3E%3Cpath class='draw d2' d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='%23C95788' stroke-width='8' stroke-opacity='.16'/%3E%3Cpath class='draw d2' d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='url(%23edge2)' stroke-width='2.4'/%3E%3C/g%3E%3Cpath class='draw' d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='%23E4A9C4' stroke-width='30' stroke-opacity='.1'/%3E%3Cpath class='draw' d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='%23E4A9C4' stroke-width='12' stroke-opacity='.2'/%3E%3Cpath class='draw' d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='url(%23edge)' stroke-width='3.5'/%3E%3Cpath class='pk' d='M-128 945 C 412 905, 712 725, 992 645 S 1492 425, 2352 365' pathLength='1' stroke='%23fff' stroke-width='2.2' stroke-opacity='.9' style='animation-duration:7s,1s;animation-delay:0s,0s'/%3E%3Cpath class='pk' d='M-128 989 C 412 949, 712 751, 992 671 S 1492 455, 2352 395' pathLength='1' stroke='%23fff' stroke-width='2.2' stroke-opacity='.9' style='animation-duration:7.8s,1s;animation-delay:0.6s,0.6s'/%3E%3Cpath class='pk' d='M-128 1033 C 412 993, 712 777, 992 697 S 1492 485, 2352 425' pathLength='1' stroke='%23fff' stroke-width='2.2' stroke-opacity='.9' style='animation-duration:8.6s,1s;animation-delay:1.2s,1.2s'/%3E%3Cpath class='pk' d='M-128 1077 C 412 1037, 712 803, 992 723 S 1492 515, 2352 455' pathLength='1' stroke='%23fff' stroke-width='2.2' stroke-opacity='.9' style='animation-duration:9.4s,1s;animation-delay:1.7999999999999998s,1.7999999999999998s'/%3E%3Cpath class='pk' d='M-128 1121 C 412 1081, 712 829, 992 749 S 1492 545, 2352 485' pathLength='1' stroke='%23fff' stroke-width='2.2' stroke-opacity='.9' style='animation-duration:10.2s,1s;animation-delay:2.4s,2.4s'/%3E%3Cpath class='run' d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='%23F3C9DA' stroke-width='14' style='--o:.45'/%3E%3Cpath class='run w' d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='%23fff' stroke-width='5'/%3E%3Cg class='small'%3E%3Cg transform='translate(942 855) scale(0.26) translate(-1412 -425)'%3E%3Cpath d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' fill='url(%23glass)' stroke='%23F3C9DA' stroke-width='5' stroke-opacity='.8'/%3E%3Cpath d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' stroke='%23fff' stroke-width='2.5' stroke-opacity='.5' transform='translate(-16 -16)'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E"),
    radial-gradient(90% 40% at 0% 0%, rgba(201, 87, 136, .28), transparent 70%),
    radial-gradient(120% 45% at 100% 100%, rgba(201, 87, 136, .22), transparent 70%),
    linear-gradient(180deg, #2C1A63 0%, #511C76 100%) !important;
  background-size: 104px auto, cover, auto, auto, auto !important;
  background-position: left 24px bottom 24px, center bottom, 0 0, 0 0, 0 0 !important;
  background-repeat: no-repeat !important;
  box-shadow: inset -1px 0 0 rgba(255, 255, 255, .06) !important;
  scrollbar-color: rgba(255, 255, 255, .25) transparent !important;
  scrollbar-width: thin !important;
}

/* recolhido (48 px): o logo não cabe, e o símbolo sozinho pediria mais uma cópia do
   painel animado nesta folha (+30 KB) — a camada do logo só some */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).js-navCollapsed .t-Body-nav {
  background-size: 0 0, cover, auto, auto, auto !important;
}

@media (prefers-reduced-motion: reduce) {
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-nav {
    background-image:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.596 8' fill='%23fff'%3E%3Cpath d='M4.322 0.322L5.573 1.573A0.456 0.456 0 0 1 5.573 2.218L4.322 3.469A0.456 0.456 0 0 1 3.678 3.469L2.427 2.218A0.456 0.456 0 0 1 2.427 1.573L3.678 0.322A0.456 0.456 0 0 1 4.322 0.322Z'/%3E%3Cpath d='M6.427 2.427L7.678 3.678A0.456 0.456 0 0 1 7.678 4.322L6.427 5.573A0.456 0.456 0 0 1 5.782 5.573L4.531 4.322A0.456 0.456 0 0 1 4.531 3.678L5.782 2.427A0.456 0.456 0 0 1 6.427 2.427Z'/%3E%3Cpath d='M2.218 2.427L3.469 3.678A0.456 0.456 0 0 1 3.469 4.322L2.218 5.573A0.456 0.456 0 0 1 1.573 5.573L0.322 4.322A0.456 0.456 0 0 1 0.322 3.678L1.573 2.427A0.456 0.456 0 0 1 2.218 2.427Z'/%3E%3Cpath d='M4.322 4.531L5.573 5.782A0.456 0.456 0 0 1 5.573 6.427L4.322 7.678A0.456 0.456 0 0 1 3.678 7.678L2.427 6.427A0.456 0.456 0 0 1 2.427 5.782L3.678 4.531A0.456 0.456 0 0 1 4.322 4.531Z'/%3E%3Cpath d='M11.61 5.69V4.04Q11.61 3.86 11.58 3.66Q11.55 3.46 11.47 3.28Q11.38 3.10 11.22 2.99Q11.05 2.87 10.78 2.87Q10.62 2.87 10.47 2.93Q10.32 2.98 10.21 3.10Q10.09 3.23 10.02 3.43Q9.95 3.64 9.95 3.94L9.53 3.77Q9.53 3.32 9.70 2.97Q9.87 2.62 10.19 2.42Q10.52 2.22 10.98 2.22Q11.34 2.22 11.58 2.34Q11.82 2.45 11.97 2.64Q12.11 2.83 12.19 3.05Q12.26 3.26 12.29 3.46Q12.31 3.67 12.31 3.81V5.69ZM9.25 5.69V2.31H9.87V3.32H9.95V5.69Z'/%3E%3Cpath d='M13.95 5.78Q13.58 5.78 13.32 5.64Q13.07 5.50 12.94 5.27Q12.81 5.04 12.81 4.77Q12.81 4.52 12.90 4.32Q12.99 4.13 13.16 3.99Q13.33 3.85 13.60 3.76Q13.81 3.70 14.09 3.65Q14.37 3.59 14.69 3.55Q15.00 3.51 15.33 3.46L15.08 3.60Q15.09 3.22 14.92 3.04Q14.75 2.86 14.35 2.86Q14.10 2.86 13.88 2.97Q13.66 3.09 13.57 3.36L12.93 3.17Q13.06 2.73 13.41 2.48Q13.76 2.22 14.35 2.22Q14.80 2.22 15.14 2.37Q15.48 2.52 15.64 2.86Q15.72 3.03 15.74 3.21Q15.76 3.40 15.76 3.61V5.69H15.15V4.93L15.26 5.04Q15.05 5.42 14.73 5.60Q14.41 5.78 13.95 5.78ZM14.08 5.22Q14.35 5.22 14.54 5.13Q14.73 5.03 14.85 4.89Q14.96 4.74 15.00 4.60Q15.06 4.45 15.06 4.26Q15.07 4.07 15.07 3.96L15.29 4.04Q14.97 4.09 14.72 4.12Q14.47 4.16 14.28 4.20Q14.09 4.23 13.94 4.28Q13.80 4.33 13.71 4.39Q13.61 4.46 13.55 4.55Q13.49 4.64 13.49 4.76Q13.49 4.89 13.56 4.99Q13.62 5.10 13.75 5.16Q13.88 5.22 14.08 5.22Z'/%3E%3Cpath d='M18.40 5.69Q18.07 5.75 17.76 5.74Q17.45 5.73 17.20 5.62Q16.96 5.51 16.83 5.28Q16.72 5.06 16.71 4.84Q16.71 4.62 16.71 4.34V1.38H17.40V4.30Q17.40 4.51 17.40 4.66Q17.41 4.81 17.47 4.91Q17.58 5.10 17.83 5.12Q18.07 5.15 18.40 5.10ZM16.07 2.86V2.31H18.40V2.86Z'/%3E%3Cpath d='M20.44 5.78Q19.92 5.78 19.56 5.55Q19.19 5.32 19.00 4.91Q18.80 4.51 18.80 4.00Q18.80 3.48 19.00 3.08Q19.20 2.68 19.57 2.45Q19.94 2.22 20.45 2.22Q21.01 2.22 21.41 2.50Q21.80 2.78 21.93 3.27L21.24 3.46Q21.14 3.18 20.93 3.03Q20.71 2.87 20.44 2.87Q20.13 2.87 19.93 3.02Q19.73 3.16 19.63 3.42Q19.54 3.67 19.54 4.00Q19.54 4.51 19.77 4.82Q19.99 5.13 20.44 5.13Q20.75 5.13 20.94 4.99Q21.12 4.84 21.22 4.58L21.93 4.74Q21.76 5.24 21.38 5.51Q20.99 5.78 20.44 5.78Z'/%3E%3Cpath d='M23.91 5.78Q23.40 5.78 23.03 5.55Q22.66 5.33 22.45 4.92Q22.25 4.52 22.25 4.00Q22.25 3.47 22.46 3.07Q22.67 2.67 23.04 2.44Q23.41 2.22 23.91 2.22Q24.42 2.22 24.79 2.45Q25.17 2.67 25.37 3.08Q25.58 3.48 25.58 4.00Q25.58 4.53 25.37 4.93Q25.17 5.33 24.79 5.56Q24.42 5.78 23.91 5.78ZM23.91 5.13Q24.38 5.13 24.61 4.81Q24.84 4.50 24.84 4.00Q24.84 3.48 24.61 3.18Q24.38 2.87 23.91 2.87Q23.59 2.87 23.39 3.01Q23.18 3.16 23.08 3.41Q22.98 3.66 22.98 4.00Q22.98 4.51 23.22 4.82Q23.45 5.13 23.91 5.13Z'/%3E%3Cpath d='M26.14 5.69V2.31H26.76V3.13L26.68 3.03Q26.74 2.86 26.84 2.72Q26.94 2.59 27.08 2.50Q27.21 2.41 27.36 2.36Q27.52 2.31 27.68 2.30Q27.84 2.29 28.00 2.31V2.96Q27.84 2.92 27.64 2.93Q27.44 2.95 27.27 3.06Q27.12 3.15 27.02 3.29Q26.93 3.43 26.88 3.61Q26.84 3.78 26.84 3.98V5.69Z'/%3E%3Cpath d='M30.06 5.78Q29.58 5.78 29.24 5.55Q28.91 5.31 28.75 4.91Q28.58 4.50 28.58 4.00Q28.58 3.49 28.74 3.09Q28.91 2.69 29.24 2.45Q29.57 2.22 30.04 2.22Q30.52 2.22 30.87 2.45Q31.22 2.68 31.41 3.09Q31.60 3.49 31.60 4.00Q31.60 4.50 31.41 4.91Q31.22 5.31 30.88 5.55Q30.53 5.78 30.06 5.78ZM28.46 7.19V2.31H29.07V4.72H29.16V7.19ZM29.96 5.16Q30.27 5.16 30.47 5.00Q30.67 4.85 30.76 4.59Q30.86 4.32 30.86 4.00Q30.86 3.68 30.76 3.42Q30.66 3.15 30.46 3.00Q30.26 2.84 29.94 2.84Q29.64 2.84 29.45 2.99Q29.26 3.13 29.17 3.40Q29.07 3.66 29.07 4.00Q29.07 4.34 29.17 4.60Q29.26 4.86 29.45 5.01Q29.65 5.16 29.96 5.16Z'/%3E%3C/svg%3E"),
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 1000' preserveAspectRatio='xMidYMid slice'%3E%3Cstyle%3E.pk,.run{display:none}.glow{opacity:.6}%3C/style%3E%3Cdefs%3E%3CradialGradient id='g' cx='.5' cy='.5' r='.5'%3E%3Cstop offset='0' stop-color='%23C95788' stop-opacity='.3'/%3E%3Cstop offset='.45' stop-color='%23C95788' stop-opacity='.1'/%3E%3Cstop offset='1' stop-color='%23C95788' stop-opacity='0'/%3E%3C/radialGradient%3E%3Cpattern id='grid' width='56' height='56' patternUnits='userSpaceOnUse'%3E%3Cpath d='M56 0H0V56' fill='none' stroke='%23fff' stroke-opacity='.06'/%3E%3C/pattern%3E%3CradialGradient id='gm' cx='0.7166666666666667' cy='0.905' r='.62'%3E%3Cstop offset='0' stop-color='%23fff'/%3E%3Cstop offset='.75' stop-color='%23fff' stop-opacity='0'/%3E%3C/radialGradient%3E%3Cmask id='mg'%3E%3Crect width='300' height='1000' fill='url(%23gm)'/%3E%3C/mask%3E%3ClinearGradient id='nm' x1='0' x2='0' y1='0' y2='1'%3E%3Cstop offset='0' stop-color='%23fff' stop-opacity='.5'/%3E%3Cstop offset='1' stop-color='%23fff' stop-opacity='.8'/%3E%3C/linearGradient%3E%3Cmask id='mn'%3E%3Crect width='300' height='1000' fill='url(%23nm)'/%3E%3C/mask%3E%3ClinearGradient id='edge' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23F3C9DA' stop-opacity='.95'/%3E%3Cstop offset='.5' stop-color='%23E4A9C4' stop-opacity='.75'/%3E%3Cstop offset='1' stop-color='%23C95788' stop-opacity='.4'/%3E%3C/linearGradient%3E%3ClinearGradient id='edge2' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23E4A9C4' stop-opacity='.9'/%3E%3Cstop offset='.5' stop-color='%23C95788' stop-opacity='.75'/%3E%3Cstop offset='1' stop-color='%23C95788' stop-opacity='.45'/%3E%3C/linearGradient%3E%3ClinearGradient id='glass' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23F3C9DA' stop-opacity='.3'/%3E%3Cstop offset='.55' stop-color='%23C95788' stop-opacity='.16'/%3E%3Cstop offset='1' stop-color='%23511C76' stop-opacity='.1'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='300' height='1000' fill='url(%23grid)' mask='url(%23mg)'/%3E%3Cg mask='url(%23mn)' opacity='0.55'%3E%3Cg class='net'%3E%3Cg id='t'%3E%3Cg stroke='%23E4A9C4' stroke-width='1'%3E%3Cline x1='0.0' y1='920.8' x2='-126.8' y2='912.0' stroke-opacity='0.043'/%3E%3Cline x1='63.2' y1='729.4' x2='98.8' y2='752.1' stroke-opacity='0.201'/%3E%3Cline x1='63.2' y1='729.4' x2='162.9' y2='684.5' stroke-opacity='0.076'/%3E%3Cline x1='63.2' y1='729.4' x2='-23.0' y2='688.5' stroke-opacity='0.102'/%3E%3Cline x1='63.2' y1='729.4' x2='167.2' y2='729.3' stroke-opacity='0.086'/%3E%3Cline x1='98.8' y1='752.1' x2='162.9' y2='684.5' stroke-opacity='0.106'/%3E%3Cline x1='98.8' y1='752.1' x2='212.4' y2='698.0' stroke-opacity='0.045'/%3E%3Cline x1='98.8' y1='752.1' x2='-23.0' y2='688.5' stroke-opacity='0.023'/%3E%3Cline x1='98.8' y1='752.1' x2='167.2' y2='729.3' stroke-opacity='0.145'/%3E%3Cline x1='162.9' y1='684.5' x2='212.4' y2='698.0' stroke-opacity='0.184'/%3E%3Cline x1='162.9' y1='684.5' x2='277.0' y2='688.5' stroke-opacity='0.067'/%3E%3Cline x1='162.9' y1='684.5' x2='167.2' y2='729.3' stroke-opacity='0.196'/%3E%3Cline x1='245.0' y1='242.0' x2='242.2' y2='122.8' stroke-opacity='0.057'/%3E%3Cline x1='245.0' y1='242.0' x2='128.5' y2='294.9' stroke-opacity='0.041'/%3E%3Cline x1='212.4' y1='698.0' x2='277.0' y2='688.5' stroke-opacity='0.158'/%3E%3Cline x1='212.4' y1='698.0' x2='167.2' y2='729.3' stroke-opacity='0.178'/%3E%3Cline x1='242.2' y1='122.8' x2='99.7' y2='152.6' stroke-opacity='0.008'/%3E%3Cline x1='277.0' y1='688.5' x2='167.2' y2='729.3' stroke-opacity='0.061'/%3E%3Cline x1='111.7' y1='335.4' x2='128.5' y2='294.9' stroke-opacity='0.198'/%3E%3Cline x1='99.7' y1='152.6' x2='128.5' y2='294.9' stroke-opacity='0.009'/%3E%3C/g%3E%3Cg fill='rgba(228,169,196,.75)'%3E%3Ccircle cx='0.0' cy='920.8' r='1.85'/%3E%3Ccircle cx='63.2' cy='729.4' r='2.31'/%3E%3Ccircle cx='98.8' cy='752.1' r='2.73'/%3E%3Ccircle cx='162.9' cy='684.5' r='2.51'/%3E%3Ccircle cx='245.0' cy='242.0' r='2.01'/%3E%3Ccircle cx='212.4' cy='698.0' r='1.40'/%3E%3Ccircle cx='205.2' cy='467.9' r='3.05'/%3E%3Ccircle cx='242.2' cy='122.8' r='2.27'/%3E%3Ccircle cx='277.0' cy='688.5' r='2.52'/%3E%3Ccircle cx='173.2' cy='912.0' r='3.03'/%3E%3Ccircle cx='111.7' cy='335.4' r='2.89'/%3E%3Ccircle cx='99.7' cy='152.6' r='1.87'/%3E%3Ccircle cx='128.5' cy='294.9' r='3.08'/%3E%3Ccircle cx='167.2' cy='729.3' r='2.97'/%3E%3C/g%3E%3C/g%3E%3Cuse href='%23t' x='300'/%3E%3C/g%3E%3C/g%3E%3Cellipse class='glow' cx='60' cy='170' rx='170' ry='380' fill='url(%23g)'/%3E%3Cg transform='translate(215 905) scale(0.21) translate(-1412 -425)' fill='none' stroke-linecap='round'%3E%3Cpath  d='M-128 945 C 412 905, 712 725, 992 645 S 1492 425, 2352 365' pathLength='1' stroke='%23F3C9DA' stroke-width='1.6' stroke-opacity='.3'/%3E%3Cpath  d='M-128 989 C 412 949, 712 751, 992 671 S 1492 455, 2352 395' pathLength='1' stroke='%23F3C9DA' stroke-width='1.6' stroke-opacity='.3'/%3E%3Cpath  d='M-128 1033 C 412 993, 712 777, 992 697 S 1492 485, 2352 425' pathLength='1' stroke='%23F3C9DA' stroke-width='1.6' stroke-opacity='.3'/%3E%3Cpath  d='M-128 1077 C 412 1037, 712 803, 992 723 S 1492 515, 2352 455' pathLength='1' stroke='%23F3C9DA' stroke-width='1.6' stroke-opacity='.3'/%3E%3Cpath  d='M-128 1121 C 412 1081, 712 829, 992 749 S 1492 545, 2352 485' pathLength='1' stroke='%23F3C9DA' stroke-width='1.6' stroke-opacity='.3'/%3E%3Cg transform='translate(1300 500) rotate(12) scale(1.12) translate(-1412 -425)'%3E%3Cpath  d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='%23C95788' stroke-width='8' stroke-opacity='.16'/%3E%3Cpath  d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='url(%23edge2)' stroke-width='2.4'/%3E%3C/g%3E%3Cpath  d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='%23E4A9C4' stroke-width='30' stroke-opacity='.1'/%3E%3Cpath  d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='%23E4A9C4' stroke-width='12' stroke-opacity='.2'/%3E%3Cpath  d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='url(%23edge)' stroke-width='3.5'/%3E%3Cpath class='pk' d='M-128 945 C 412 905, 712 725, 992 645 S 1492 425, 2352 365' pathLength='1' stroke='%23fff' stroke-width='2.2' stroke-opacity='.9' style='animation-duration:7s,1s;animation-delay:0s,0s'/%3E%3Cpath class='pk' d='M-128 989 C 412 949, 712 751, 992 671 S 1492 455, 2352 395' pathLength='1' stroke='%23fff' stroke-width='2.2' stroke-opacity='.9' style='animation-duration:7.8s,1s;animation-delay:0.6s,0.6s'/%3E%3Cpath class='pk' d='M-128 1033 C 412 993, 712 777, 992 697 S 1492 485, 2352 425' pathLength='1' stroke='%23fff' stroke-width='2.2' stroke-opacity='.9' style='animation-duration:8.6s,1s;animation-delay:1.2s,1.2s'/%3E%3Cpath class='pk' d='M-128 1077 C 412 1037, 712 803, 992 723 S 1492 515, 2352 455' pathLength='1' stroke='%23fff' stroke-width='2.2' stroke-opacity='.9' style='animation-duration:9.4s,1s;animation-delay:1.7999999999999998s,1.7999999999999998s'/%3E%3Cpath class='pk' d='M-128 1121 C 412 1081, 712 829, 992 749 S 1492 545, 2352 485' pathLength='1' stroke='%23fff' stroke-width='2.2' stroke-opacity='.9' style='animation-duration:10.2s,1s;animation-delay:2.4s,2.4s'/%3E%3Cpath class='run' d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='%23F3C9DA' stroke-width='14' style='--o:.45'/%3E%3Cpath class='run w' d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' pathLength='1' stroke='%23fff' stroke-width='5'/%3E%3Cg %3E%3Cg transform='translate(942 855) scale(0.26) translate(-1412 -425)'%3E%3Cpath d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' fill='url(%23glass)' stroke='%23F3C9DA' stroke-width='5' stroke-opacity='.8'/%3E%3Cpath d='M1588 -114 L1889 226 C1986 336 1986 514 1889 624 L1588 964 C1491 1074 1333 1074 1236 964 L935 624 C838 514 838 336 935 226 L1236 -114 C1333 -224 1491 -224 1588 -114 Z' stroke='%23fff' stroke-width='2.5' stroke-opacity='.5' transform='translate(-16 -16)'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E"),
      radial-gradient(90% 40% at 0% 0%, rgba(201, 87, 136, .28), transparent 70%),
      radial-gradient(120% 45% at 100% 100%, rgba(201, 87, 136, .22), transparent 70%),
      linear-gradient(180deg, #2C1A63 0%, #511C76 100%) !important;
  }
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav ul {
  background: transparent !important;
  background-image: none !important;
}

/* O pé do menu é do logo: com um submenu aberto (Requisições tem 20 itens) a lista
   rolava POR CIMA dele. Aberto, quem rola passa a ser a lista, que termina 80 px antes
   do fim e some em degradê; o .t-Body-nav não rola mais. Recolhido (sem logo), volta
   tudo ao tema: lá os submenus abrem para fora e não podem ser cortados. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav {
  padding: 12px 0 16px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2):not(.js-navCollapsed) .t-Body-nav {
  overflow: hidden !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2):not(.js-navCollapsed) #t_TreeNav {
  height: calc(100% - 80px) !important;
  min-height: 0 !important;                       /* o tema dá min-height: 99% à árvore, e ele vencia a altura */
  overflow-x: hidden !important;
  overflow-y: auto !important;
  scrollbar-color: rgba(255, 255, 255, .25) transparent !important;
  scrollbar-width: thin !important;
  -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 28px), transparent) !important;
  mask-image: linear-gradient(to bottom, #000 calc(100% - 28px), transparent) !important;
}

/* a linha é a camada de fundo do item (o tema a usa para o destaque): vira um
   bloco arredondado recuado, como a lista lateral do site */
/* Medido: destaque de x=10 a 230, ícone na caixa de 0 a 40 — o glifo ficava a ~2 px da
   borda do destaque. A linha recua 8 px e o conteúdo anda 10 px: o ícone fica com 14 px
   de respiro dentro do destaque, o mesmo que sobra à direita da seta. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-row {
  left: 8px !important;
  right: 8px !important;
  width: auto !important;
  border-radius: 10px !important;
  background: transparent !important;
  transition: background-color .2s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-content {
  padding-left: 10px !important;
  color: rgba(255, 255, 255, .84) !important;
  background: transparent !important;
}

/* a seta de abrir/fechar anda junto, para não ficar colada à borda direita do destaque */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-toggle {
  margin-right: 8px !important;
}

/* menu recolhido (48 px, só ícones): sem o recuo — senão o ícone sai da coluna */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).js-navCollapsed #t_TreeNav .a-TreeView-content {
  padding-left: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).js-navCollapsed #t_TreeNav .a-TreeView-row {
  left: 4px !important;
  right: 4px !important;
}

/* propriedades separadas, nunca o atalho "font:" — ele zera o line-height que o
   tema usa para centralizar o texto com o ícone */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-label {
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  letter-spacing: normal !important;
  color: rgba(255, 255, 255, .84) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-content .fa,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-content .t-Icon {
  color: var(--nc-rosa-claro) !important;
  opacity: 1 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-toggle {
  color: rgba(255, 255, 255, .55) !important;
}

/* hover */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-node:hover > .a-TreeView-row {
  background: rgba(255, 255, 255, .07) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-node:hover > .a-TreeView-content .a-TreeView-label {
  color: #fff !important;
}

/* item atual / selecionado: vidro claro com um fio de luz, texto branco em negrito.
   Sem filete colorido na borda: o destaque inteiro já diz onde você está. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-row.is-selected,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-row.is-current,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-row.is-current--top {
  background: rgba(255, 255, 255, .14) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08), 0 6px 16px -10px rgba(20, 8, 50, .6) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-content.is-selected .fa,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-content.is-current--top .fa {
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-content.is-selected .a-TreeView-label,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-content.is-current .a-TreeView-label,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-content.is-current--top .a-TreeView-label {
  color: #fff !important;
  font-weight: 700 !important;
}

/* subníveis: o tema pinta a lista de cinza-escuro (rgb 30,36,40) — sai (regra acima);
   o texto fica um tom abaixo */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-node .a-TreeView-node .a-TreeView-label {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: rgba(255, 255, 255, .7) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-node .a-TreeView-node:hover > .a-TreeView-content .a-TreeView-label,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-node .a-TreeView-node .a-TreeView-content.is-selected .a-TreeView-label,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #t_TreeNav .a-TreeView-node .a-TreeView-node .a-TreeView-content.is-current .a-TreeView-label {
  color: #fff !important;
}

/* ---------- 3. Menu SUPERIOR (aplicações com navegação no topo — as de dentro do iframe) ----------
   As aplicações abertas dentro do painel (eSocial, …) usam o menu no topo ("eSocial ·
   Cadastros ▾"). Lá o cabeçalho escuro deste arquivo virava uma SEGUNDA faixa roxa logo
   abaixo do cabeçalho do painel, com a aba atual num lilás chapado — dois cabeçalhos
   empilhados. Dentro do painel ele é uma sub-navegação da página, não um cabeçalho: barra
   clara com o fio Névoa embaixo, abas em texto, a atual em Roxo com o fio Rosa de 2 px (o
   mesmo das abas de região) e o Lavanda suave no hover. A área clicável de cada aba é um
   bloco de 32 px com cantos de 8 — a barra fica nos 40 px do tema (ele posiciona o título
   da página por essa altura), com o texto e a seta do submenu juntos. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .t-Header {
  background: #fff !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: inset 0 -1px 0 var(--nc-nevoa), 0 6px 18px -16px rgba(27, 18, 56, .35) !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .t-Header-nav {
  padding: 0 16px !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .t-Header-nav-list,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .t-Header-nav-list.a-MenuBar {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .t-Header-nav-list > ul {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  height: 40px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  height: 32px !important;
  margin: 4px 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  transition: background-color .2s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item .a-MenuBar-label {
  display: flex !important;
  align-items: center !important;
  height: 32px !important;
  padding: 0 12px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: normal !important;
  line-height: 1 !important;
  color: var(--nc-grafite) !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

/* aba com submenu: o texto e a seta formam UM alvo — sem vão entre eles */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item.a-Menu--split .a-MenuBar-label {
  padding-right: 2px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item > .a-Menu-subMenuCol {
  display: flex !important;
  align-items: center !important;
  height: 32px !important;
  padding: 0 10px 0 4px !important;
  background: transparent !important;
  color: var(--nc-cinza) !important;
  cursor: pointer !important;
}

/* a seta: o ícone do APEX é uma IMAGEM de fundo, e a Skin pinta um fundo Roxo por cima
   quando o menu abre — virava um quadrado cheio. Vira o glifo da Font APEX, na cor do texto
   em todos os estados. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item > .a-Menu-subMenuCol .a-Icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 14px !important;
  height: 14px !important;
  background: none !important;
  color: inherit !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item > .a-Menu-subMenuCol .a-Icon::before {
  content: "\f107" !important;                     /* fa-angle-down */
  font-family: "Font APEX Small", "Font APEX" !important;
  font-size: 14px !important;
  line-height: 1 !important;
  color: inherit !important;
  transition: transform .2s cubic-bezier(.22, 1, .36, 1) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item.is-expanded > .a-Menu-subMenuCol .a-Icon::before {
  transform: rotate(180deg) !important;
}

/* o submenu desce da barra: a Skin corta tudo o que passa dos 40 px dela (overflow
   hidden na barra e na lista) e o menu abria invisível */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .t-Header-nav,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .t-Header-nav-list {
  overflow: visible !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item:hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item.is-focused,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item.is-expanded {
  background: var(--nc-nevoa2) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item:hover .a-MenuBar-label,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item.is-focused .a-MenuBar-label,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item.is-expanded .a-MenuBar-label,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item:hover > .a-Menu-subMenuCol,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item.is-expanded > .a-Menu-subMenuCol {
  background: transparent !important;
  color: var(--nc-roxo) !important;
}

/* a aba atual: texto Roxo e o fio Rosa encostado na base da barra */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item.a-Menu--current {
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item.a-Menu--current:hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item.a-Menu--current.is-expanded {
  background: var(--nc-nevoa2) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item.a-Menu--current .a-MenuBar-label,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item.a-Menu--current > .a-Menu-subMenuCol {
  background: transparent !important;
  color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item.a-Menu--current .a-MenuBar-label {
  font-weight: 800 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item.a-Menu--current::after {
  content: "" !important;
  position: absolute !important;
  left: 10px !important;
  right: 10px !important;
  bottom: -4px !important;
  height: 2px !important;
  border-radius: 2px 2px 0 0 !important;
  background: var(--nc-rosa) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar-item .a-MenuBar-label:focus-visible {
  outline: 2px solid var(--nc-roxo) !important;
  outline-offset: -2px !important;
  border-radius: 8px !important;
}

/* o submenu abre colado à barra, não 4 px sobre o fio da aba */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).apex-top-nav .a-MenuBar .a-Menu--top {
  margin-top: 4px !important;
}

/* ===== Natcorp_Paginas.css ===== */
/* =====================================================================
   Natcorp_Paginas — o conteúdo das páginas internas no desenho do site
   (natcorp.com.br), só com as três cores da marca: Roxo #511C76, Rosa
   #C95788, Azul #2C1A63 (mais os neutros Tinta/Grafite/Cinza/Névoa).
   Cartão de primeiro nível: branco, raio 16, borda Névoa, sombra suave,
   título alinhado à coluna dos campos. Região dentro de cartão: seção
   plana com fio em cima — cartão dentro de cartão nunca. Campos de 38 px
   em 13,5 px (cabe o conteúdo real), botões de raio 8 (primário Roxo
   sólido), relatórios sem grade vertical, abas como a lista da /modulos.
   O menu e o cabeçalho ficam no Natcorp_Menu.
   "@app" vira html body.t-PageBody:not(.t-PageBody--login):not(#nc-a1):not(#nc-a2)
   e toda declaração ganha !important — feito pelo gerar-app.mjs.
   NÃO edite o .css gerado: edite este.
   ===================================================================== */

:root {
  --nc-azul: #2C1A63; --nc-roxo: #511C76; --nc-roxo-hover: #2C1A63;   /* hover do primário: o Azul da marca */
  --nc-rosa: #C95788; --nc-realce: #E4A9C4;
  --nc-tinta: #1B1238; --nc-grafite: #4A4460; --nc-cinza: #8E88A3;
  --nc-tela: #FCFBFE; --nc-quase: #FBF9FD; --nc-off: #F4F2F7;
  --nc-nevoa: #E9E5F1; --nc-nevoa2: #F1EDF6;
  --nc-ruim: #B8323F;
  /* cores de ESTADO dos botões (t-Button--success/--warning/--info/--primary): tons escuros
     o bastante para texto branco em 14 px negrito (contraste ≥ 4.5:1) */
  --nc-bom: #1F7A52; --nc-bom-hover: #17603F;
  --nc-alerta: #F5B700; --nc-alerta-hover: #E3A600; --nc-alerta-texto: #7A5300;   /* aviso: AMARELO — texto escuro por cima (branco não lê no amarelo) */
  --nc-info: #A63F6E; --nc-info-hover: #8A3159;
  --nc-grad: linear-gradient(135deg, #511C76 0%, #2C1A63 100%);   /* Roxo → Azul */
  /* shadow-soft e shadow-lift do site */
  --nc-soft: 0 1px 2px rgba(27, 18, 56, .04), 0 8px 24px -8px rgba(27, 18, 56, .12);
  --nc-lift: 0 2px 4px rgba(27, 18, 56, .05), 0 24px 48px -16px rgba(81, 28, 118, .25);
  --nc-anel: 0 0 0 3px rgba(81, 28, 118, .14);
  /* altura do rótulo de um campo com rótulo em cima: 12 (recuo) + 25 (texto) + 2 + 4 = 43 px.
     É o degrau que campo sem rótulo e botão precisam descer para alinhar com os vizinhos. */
  --nc-rotulo-h: 43px;
  /* fundo dos ícones em quadrado: o do ícone de cartão da Natcorp Skin ("Alertas") —
     Roxo de cima, Rosa do canto inferior direito, Azul do superior esquerdo, em "screen" */
  --nc-icone-fundo: linear-gradient(#511C76, transparent), linear-gradient(to left top, #C95788, transparent), linear-gradient(to right bottom, #2C1A63, transparent);
}

/* ---------- 1. Base ------------------------------------------------ */

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) {
  background-color: var(--nc-tela) !important;
  background-image: radial-gradient(1100px 520px at 100% -8%, rgba(201, 87, 136, .05), transparent 62%) !important;
  background-attachment: fixed !important;
  color: var(--nc-tinta) !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  -webkit-font-smoothing: antialiased !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) input, html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) select, html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) textarea, html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) button,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region-title, html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-label, html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb, html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-rds a,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog, html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog-title {
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
}

/* a Skin pinta o .t-Body de lavanda (248,246,251) por cima do fundo: sai, fica o do body */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body {
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-contentInner {
  padding: 16px 20px 32px !important;
}

/* ---------- 2. Barra de título (breadcrumb + ações) ---------------- */

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title {
  background: rgba(252, 251, 254, .88) !important;
  backdrop-filter: saturate(1.4) blur(12px) !important;
  border: 0 !important;
  box-shadow: 0 1px 0 var(--nc-nevoa) !important;
}

/* a região do breadcrumb (sem cabeçalho) virava cartão branco com sombra, colado ao menu —
   os cantos da esquerda pareciam retos. Na barra de título ela é só texto sobre o fundo. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Region {
  margin-bottom: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* BREADCRUMB: a trilha diz ONDE você está — e o último item já é o <h1> da página. Estava
   tudo em 12,5 px Cinza, título e caminho iguais. Agora: a trilha pequena em cima (links
   em Grafite, Roxo no hover, separador discreto) e o nome da página embaixo, grande, em
   Tinta — o título da tela. */
/* Ao ROLAR a página, a partir de 72 px o título desce ao tamanho da trilha e entra na
   mesma linha, destacado numa pílula Lavanda com o texto em Roxo — a barra fixa encolhe
   de ~86 para ~48 px e sobra tela para o conteúdo. Só CSS: uma animação presa à rolagem
   (animation-timeline) liga UMA variável, --nc-bc-compacto, de 0 para 1 aos 72 px; os
   estilos compactos ficam num @container style(--nc-bc-compacto: 1) — um ESTADO, não um
   valor calculado — e por isso as propriedades deslizam com transition (animação não
   dispara transition; consulta de estilo, sim). A troca de linha não tem como deslizar:
   o título entra com um fade curto no lugar novo. (Animar as propriedades direto não
   funciona: toda regra aqui é !important, e animação não vence !important.) Chrome, Edge
   e Safari recentes; onde não há suporte, o breadcrumb fica como está, grande. */
@property --nc-bc-compacto {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

@keyframes nc-bc-compactar {
  from { --nc-bc-compacto: 0; }
  to { --nc-bc-compacto: 1; }
}

@supports (animation-timeline: scroll()) {
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title {
    animation: nc-bc-compactar linear both !important;
    animation-timeline: scroll(nearest block) !important;
    animation-range: 72px 73px !important;           /* um degrau em 72 px, não uma transição arrastada */
  }
}

/* A barra NÃO muda de altura entre os estados: o tema mede a barra uma vez, ao carregar,
   e empurra o conteúdo por essa medida — se a página abre já rolada (recarregar mantém a
   rolagem) ele mediria a versão compacta e a barra cobriria o 1.º cartão. Altura mínima
   fixa e conteúdo centrado: compacta, a linha única fica no meio da mesma faixa. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Region-body {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  min-height: 72px !important;
  padding: 12px 4px !important;
}

/* O MESMO para o breadcrumb posto numa REGIÃO DE BOTÕES (template Buttons Container na
   barra — Requisição de Desligamento, página 50): sem isto a barra tinha 78 px no topo e
   51 compacta; aberta já rolada, o tema media 51 e a barra cobria 27 px do 1.º cartão. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-ButtonRegion-col--content {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  min-height: 72px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  row-gap: 4px !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb-item {
  display: inline-flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 12.5px !important;
  line-height: 1.4 !important;
  color: var(--nc-cinza) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb-item::after {
  margin: 0 8px !important;
  color: #CBC1DC !important;
  font-size: 11px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb-item .t-Breadcrumb-label,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb-item a.t-Breadcrumb-label {
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: var(--nc-grafite) !important;
  text-decoration: none !important;
  transition: color .15s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb-item a.t-Breadcrumb-label:hover {
  color: var(--nc-roxo) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

/* a página atual: vai para a linha de baixo, como título */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb-item.is-active,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb-item:last-child {
  flex: 0 0 100% !important;
  white-space: nowrap !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb-item.is-active::after,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb-item:last-child::after {
  content: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb-item.is-active .t-Breadcrumb-label,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb-item:last-child .t-Breadcrumb-label {
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 999px !important;
  background: rgba(241, 237, 246, 0) !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  letter-spacing: -.02em !important;
  line-height: 1.2 !important;
  color: var(--nc-tinta) !important;
  transition:
    font-size .32s cubic-bezier(.22, 1, .36, 1),
    padding .32s cubic-bezier(.22, 1, .36, 1),
    letter-spacing .32s cubic-bezier(.22, 1, .36, 1),
    background-color .32s ease,
    color .32s ease !important;
}

/* o estado compacto (rolou além de 72 px) */
@container style(--nc-bc-compacto: 1) {
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb-item.is-active,
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb-item:last-child {
    flex: 0 0 auto !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb-item.is-active .t-Breadcrumb-label,
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb-item:last-child .t-Breadcrumb-label {
    padding: 3px 10px !important;
    background: rgba(241, 237, 246, 1) !important;
    font-size: 12.5px !important;
    letter-spacing: 0 !important;
    color: var(--nc-roxo) !important;
  }
}

/* a troca de linha: o título aparece no lugar novo com um fade curto, para cima ao compactar
   e para baixo ao voltar. Nomes diferentes nos dois estados — a troca reinicia a animação. */
@keyframes nc-bc-entra {
  from { opacity: .15; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}

@keyframes nc-bc-volta {
  from { opacity: .15; transform: translateY(-6px); }
  to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: no-preference) {
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb-item.is-active .t-Breadcrumb-label,
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb-item:last-child .t-Breadcrumb-label {
    animation: nc-bc-volta .32s cubic-bezier(.22, 1, .36, 1) !important;
  }

  @container style(--nc-bc-compacto: 1) {
    html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb-item.is-active .t-Breadcrumb-label,
    html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb-item:last-child .t-Breadcrumb-label {
      animation: nc-bc-entra .32s cubic-bezier(.22, 1, .36, 1) !important;
    }
  }
}

/* página sem trilha (só o item atual): o título sozinho, sem linha vazia em cima */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Breadcrumb-item:only-child .t-Breadcrumb-label {
  font-size: 20px !important;
}

/* TÍTULO DA PÁGINA quando ela NÃO tem breadcrumb. A barra de título chega vazia e o nome
   da página só existe no <title> — o CSS não copia texto, então o modelo de página
   imprime o nome dentro da barra, antes das regiões dela:
     <div class="t-Body-title" id="t_Body_title">
       <h1 class="nc-TituloPagina">#TITLE#</h1>
       #REGION_POSITION_01#
     </div>
   Regras (a barra decide sozinha, página a página):
   · breadcrumb COM itens na barra → vale o breadcrumb (o último item já é o nome);
   · QUALQUER outra região na barra (botões, texto…) → vale essa região, sem o nome;
   · barra vazia, ou só um breadcrumb sem itens → aparece o nome da página, e o
     breadcrumb vazio some (ocupava a barra em branco).
   · página cujo conteúdo principal é um IFRAME → nem breadcrumb nem nome: a barra fica
     fechada e o iframe encosta no cabeçalho (a aplicação de dentro tem os títulos dela).
   Para desligar numa página: Page › CSS Classes → nc-sem-titulo. Mesmo desenho do
   título do breadcrumb, e o mesmo compacto ao rolar. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .nc-TituloPagina {
  display: flex !important;
  align-items: center !important;
  box-sizing: border-box !important;
  min-height: 72px !important;
  margin: 0 !important;
  padding: 12px 20px !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  letter-spacing: -.02em !important;
  line-height: 1.2 !important;
  color: var(--nc-tinta) !important;
  transition: font-size .32s cubic-bezier(.22, 1, .36, 1), letter-spacing .32s cubic-bezier(.22, 1, .36, 1), color .32s ease !important;
}

/* páginas sem breadcrumb costumam fechar a barra no CSS da própria página
   (.t-Body-title { height: 0; padding: 0 }) porque ela ficava vazia — com o título, abre */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title:has(> .nc-TituloPagina:not(:empty)) {
  height: auto !important;
}

/* Uma regra por caso: um seletor inválido derruba a lista inteira (já aconteceu — um
   :has dentro de :has, que o CSS não aceita, apagou até o caso do breadcrumb). "Outra
   região na barra" = qualquer corpo de região com algo que não seja o breadcrumb, ou
   uma região de botões. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title:has(.t-Breadcrumb-item) .nc-TituloPagina {
  display: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title:has(.t-Region-body > :not(.t-Breadcrumb):not(script):not(style):not(input[type="hidden"])) .nc-TituloPagina {
  display: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title:has(.t-ButtonRegion) .nc-TituloPagina {
  display: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).nc-sem-titulo .t-Body-title .nc-TituloPagina {
  display: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .nc-TituloPagina:empty {
  display: none !important;
}

/* o espaçador que o tema põe no topo do conteúdo (altura = cabeçalho + barra de título):
   páginas de iframe fazem do .t-Body-content uma coluna flex de altura fixa, e o
   espaçador ENCOLHIA para caber o iframe — o conteúdo subia 14 px sob a barra */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-content > div:first-child:not([class]) {
  flex-shrink: 0 !important;
}

/* página de IFRAME: barra de título fechada, sem breadcrumb e sem nome */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2):has(.t-Body-contentInner .t-Region iframe[width="100%"]) .t-Body-title {
  height: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2):has(.t-Body-contentInner .t-Region iframe[width="100%"]) .t-Body-title > * {
  display: none !important;
}

/* breadcrumb sem nenhum item: a região não tem o que mostrar */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Region:has(.t-Breadcrumb):not(:has(.t-Breadcrumb-item)) {
  display: none !important;
}

@container style(--nc-bc-compacto: 1) {
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .nc-TituloPagina {
    font-size: 15px !important;
    letter-spacing: -.01em !important;
    color: var(--nc-roxo) !important;
  }
}

/* ---------- 3. Regiões ---------------------------------------------- */
/* Alinhamento: corpo 18 px + linha do grid (-8) + coluna (+8) = campos a 18 px da
   borda. O cabeçalho usa os mesmos 18 px — título e campos na mesma linha vertical.
   (O .t-Region-headerItems--title somava um recuo próprio de 13 px: zerado.) */

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:not(.t-Region--noUI):not(.t-Region--removeHeader):not(.t-Region--hiddenOverflow):not(.t-Region--noBorder) {
  background: #fff !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 16px !important;
  box-shadow: var(--nc-soft) !important;
  margin-bottom: 16px !important;
  overflow: visible !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:not(.t-Region--noUI) > .t-Region-header {
  min-height: 0 !important;
  padding: 14px 16px 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 16px 16px 0 0 !important;
  align-items: center !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region-headerItems--title {
  padding: 0 !important;
  margin: 0 !important;
}

/* O CABEÇALHO QUEBRA A LINHA quando os botões não cabem ao lado do título. Era uma linha
   só, que não encolhia os botões: num cartão de gráfico de 375 px (Indicadores — BI) os
   cinco botões ocupavam 324 px e o título ficava com LARGURA ZERO, com os botões por cima
   dele. O título agora reserva ao menos 200 px; o que não couber desce para a linha de
   baixo, alinhado à esquerda. Regiões largas continuam numa linha só. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:not(.t-Region--noUI) > .t-Region-header {
  flex-wrap: wrap !important;
  row-gap: 8px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:not(.t-Region--noUI) > .t-Region-header > .t-Region-headerItems--title {
  flex: 1 1 200px !important;
  min-width: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:not(.t-Region--noUI) > .t-Region-header > .t-Region-headerItems--title .t-Region-title {
  min-width: 0 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:not(.t-Region--noUI) > .t-Region-header > .t-Region-headerItems--buttons {
  display: flex !important;
  flex: 0 1 auto !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
  max-width: 100% !important;
  margin: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region-headerItems--buttons > .t-Button,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region-headerItems--buttons > .js-maximizeButtonContainer .t-Button {
  margin: 0 !important;
}

/* no CARTÃO (região dentro de outra) a fileira de botões ocupa a linha dela e o MAXIMIZAR
   vai para a ponta direita — é da região, não uma ação do conteúdo. Nas regiões de página
   a fileira fica do tamanho dos botões, à direita do título. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region .t-Region:not(.t-Region--noUI) > .t-Region-header > .t-Region-headerItems--buttons:has(> .t-Button, > button) {
  flex-grow: 1 !important;
  justify-content: flex-start !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region .t-Region:not(.t-Region--noUI) > .t-Region-header > .t-Region-headerItems--buttons > .js-maximizeButtonContainer {
  display: inline-flex !important;
  margin-left: auto !important;
}

/* BOTÕES DE CARTÃO: no cabeçalho de uma região DENTRO de outra (os cartões de gráfico do
   BI, "% ≡ · Qtd. ≡ · pizza · barras · print · maximizar") os botões de página (40 px,
   respiro de 18) pesavam mais que o gráfico e quebravam em 3 linhas no celular. Ficam de
   32 px, texto de 12.5, os só-ícone quadrados — cabem numa fileira só. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region .t-Region:not(.t-Region--noUI) > .t-Region-header .t-Region-headerItems--buttons .t-Button:not(.t-Button--link) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 10px !important;
  border-radius: 8px !important;
  font-size: 12.5px !important;
  gap: 5px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region .t-Region:not(.t-Region--noUI) > .t-Region-header .t-Region-headerItems--buttons .t-Button.t-Button--noLabel {
  width: 32px !important;
  min-width: 32px !important;
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region .t-Region:not(.t-Region--noUI) > .t-Region-header .t-Region-headerItems--buttons .t-Button .t-Icon {
  margin: 0 !important;
  font-size: 13px !important;
}

/* a Natcorp Skin põe o mesmo quadrado com lápis em todo título: sai */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region-headerItems--title::before {
  content: none !important;
  display: none !important;
}

/* BOTÃO DE EXPANDIR a região (e o do relatório interativo): é um botão "sem desenho"
   (noUI) e o tema zera o recuo vertical dele — ficava uma faixa de 40 × 16 px encostada no
   ícone. Vira um alvo quadrado de 36 px, ícone centrado em Grafite, fundo Lavanda e Roxo
   no hover; o quadro Rosa de foco do tema (pseudo-elementos) sai, fica o anel do sistema. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Region-headerItems--buttons .js-maximizeButtonContainer, .a-IRR-buttons) .t-Button.t-Button--noLabel {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  min-width: 36px !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--nc-grafite) !important;
  transition: background-color .15s, color .15s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Region-headerItems--buttons .js-maximizeButtonContainer, .a-IRR-buttons) .t-Button.t-Button--noLabel .t-Icon {
  position: static !important;
  margin: 0 !important;
  font-size: 16px !important;
  color: inherit !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Region-headerItems--buttons .js-maximizeButtonContainer, .a-IRR-buttons) .t-Button.t-Button--noLabel:hover {
  background: var(--nc-nevoa2) !important;
  color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Region-headerItems--buttons .js-maximizeButtonContainer, .a-IRR-buttons) .t-Button.t-Button--noLabel::before,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Region-headerItems--buttons .js-maximizeButtonContainer, .a-IRR-buttons) .t-Button.t-Button--noLabel::after {
  content: none !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Region-headerItems--buttons .js-maximizeButtonContainer, .a-IRR-buttons) .t-Button.t-Button--noLabel:focus {
  outline: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Region-headerItems--buttons .js-maximizeButtonContainer, .a-IRR-buttons) .t-Button.t-Button--noLabel:focus-visible {
  box-shadow: var(--nc-anel) !important;
}

/* REGIÃO RECOLHÍVEL (modelo Collapsible): o botão de abrir/fechar vem ANTES do título,
   num contêiner próprio. Ele pegava o estilo dos botões comuns (40 px de altura, 18 px de
   recuo, fundo branco e borda) e, com 54 px de largura num contêiner de 8, cobria o
   começo do título ("sições"). Vira um alvo quieto de 28 px com a seta em Roxo. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region--hideShow > .t-Region-header {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region--hideShow > .t-Region-header > .t-Region-headerItems--controls {
  display: flex !important;
  flex: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region--hideShow > .t-Region-header > .t-Region-headerItems--title {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion) .t-Region--hideShow > .t-Region-header .t-Region-headerItems--controls .t-Button.t-Button--hideShow {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion) .t-Region--hideShow > .t-Region-header .t-Region-headerItems--controls .t-Button.t-Button--hideShow:hover {
  background: var(--nc-nevoa2) !important;
  border: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion) .t-Region--hideShow > .t-Region-header .t-Region-headerItems--controls .t-Button.t-Button--hideShow:focus {
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;                    /* a Skin punha um quadro rosa ao clicar */
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion) .t-Region--hideShow > .t-Region-header .t-Region-headerItems--controls .t-Button.t-Button--hideShow:focus-visible {
  box-shadow: var(--nc-anel) !important;
}

/* o tema desenha o foco de todo botão nos pseudo-elementos (quadro Rosa por dentro e
   halo por fora); neste alvo pequeno ficava um quadrado rosa depois do clique */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion) .t-Region--hideShow > .t-Region-header .t-Region-headerItems--controls .t-Button.t-Button--hideShow::before,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion) .t-Region--hideShow > .t-Region-header .t-Region-headerItems--controls .t-Button.t-Button--hideShow::after {
  content: none !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region--hideShow .t-Button--hideShow .a-Icon {
  margin: 0 !important;
  position: static !important;
  color: inherit !important;
}

/* ÍCONE DA REGIÃO — o que foi escolhido na propriedade "Ícone" da região, no editor.
   O modelo de região Standard do Universal Theme 1.1 (APEX 19.2) NÃO imprime esse ícone;
   ele só aparece depois de acrescentar ao modelo, antes do <h2 class="t-Region-title">:
     <span class="t-Region-headerIcon"><span class="t-Icon #ICON_CSS_CLASSES#" aria-hidden="true"></span></span>
   (é o mesmo HTML das versões novas do APEX, então esta regra continua valendo depois
   de uma atualização). Em região sem ícone o #ICON_CSS_CLASSES# vem vazio: entra o
   símbolo Natcorp no lugar. Fundo e glifo: o padrão dos ícones ("Fundo dos ícones"). */
/* Destaque: é o primeiro ponto de cor do cartão, então é um pouco maior que o título
   (40 px contra 16 px de texto), com a sombra tingida de Rosa e Roxo — a mesma luz do
   fundo — e um brilho de 1 px no alto, que dá volume ao quadrado sem contorno. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region-headerIcon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: none !important;
  width: 40px !important;
  height: 40px !important;
  margin: 0 14px 0 0 !important;
  padding: 0 !important;
  border-radius: 12px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .28),
    inset 0 0 0 1px rgba(255, 255, 255, .10),
    0 2px 6px -2px rgba(81, 28, 118, .35),
    0 12px 24px -12px rgba(201, 87, 136, .75) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region-headerIcon .t-Icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  font-size: 18px !important;
  line-height: 1 !important;
  text-shadow: 0 1px 2px rgba(44, 26, 99, .35) !important;
}

/* a fonte de ícones só vem com a classe "fa"; o ícone da propriedade pode chegar sem ela
   ("fa-users") — sem a fonte o glifo virava um retângulo */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region-headerIcon .t-Icon::before {
  margin: 0 !important;
  font-family: "Font APEX Small", "Font APEX" !important;
  font-weight: 400 !important;
  font-style: normal !important;
  -webkit-font-smoothing: antialiased !important;
}

/* sem ícone escolhido (classe vazia): o mesmo quadrado, com o símbolo Natcorp em branco
   (os quatro módulos do logo, de ../painel-natcorp.mjs) no lugar do glifo */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region-headerIcon:not(:has(.t-Icon[class*="fa-"])) .t-Icon::before {
  content: "" !important;
  display: block !important;
  width: 20px !important;
  height: 20px !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8' fill='%23fff'%3E%3Cpath d='M4.322 0.322L5.573 1.573A0.456 0.456 0 0 1 5.573 2.218L4.322 3.469A0.456 0.456 0 0 1 3.678 3.469L2.427 2.218A0.456 0.456 0 0 1 2.427 1.573L3.678 0.322A0.456 0.456 0 0 1 4.322 0.322Z'/%3E%3Cpath d='M6.427 2.427L7.678 3.678A0.456 0.456 0 0 1 7.678 4.322L6.427 5.573A0.456 0.456 0 0 1 5.782 5.573L4.531 4.322A0.456 0.456 0 0 1 4.531 3.678L5.782 2.427A0.456 0.456 0 0 1 6.427 2.427Z'/%3E%3Cpath d='M2.218 2.427L3.469 3.678A0.456 0.456 0 0 1 3.469 4.322L2.218 5.573A0.456 0.456 0 0 1 1.573 5.573L0.322 4.322A0.456 0.456 0 0 1 0.322 3.678L1.573 2.427A0.456 0.456 0 0 1 2.218 2.427Z'/%3E%3Cpath d='M4.322 4.531L5.573 5.782A0.456 0.456 0 0 1 5.573 6.427L4.322 7.678A0.456 0.456 0 0 1 3.678 7.678L2.427 6.427A0.456 0.456 0 0 1 2.427 5.782L3.678 4.531A0.456 0.456 0 0 1 4.322 4.531Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  filter: drop-shadow(0 1px 2px rgba(44, 26, 99, .35)) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region .t-Region .t-Region-headerIcon:not(:has(.t-Icon[class*="fa-"])) .t-Icon::before {
  width: 16px !important;
  height: 16px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region-headerItems--title:has(> .t-Region-headerIcon) {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;                              /* a Skin põe 12,5 px, que somavam com a margem do ícone */
}

/* seção dentro de um cartão: o ícone menor, para não competir com o do cartão */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region .t-Region .t-Region-headerIcon {
  width: 32px !important;
  height: 32px !important;
  margin-right: 12px !important;
  border-radius: 10px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .28),
    0 8px 16px -10px rgba(201, 87, 136, .7) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region .t-Region .t-Region-headerIcon .t-Icon {
  font-size: 15px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region-title {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  letter-spacing: -.02em !important;
  line-height: 1.35 !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:not(.t-Region--noUI) > .t-Region-bodyWrap > .t-Region-body {
  padding: 8px 16px 14px !important;
}

/* FIO ROSA sob o cabeçalho da região: separa "do que se trata" do conteúdo. Vale para TODA
   região com cabeçalho visível — cartões e painéis internos. Para tirar de uma região,
   no APEX: Region › Appearance › CSS Classes → nc-sem-fio. Fica de fora a região
   recolhida (o fio ficaria colado na borda de baixo). O :not(#nc-fio) só dá peso. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:not(.t-Region--noUI):not(.t-Region--removeHeader):not(.t-Region--hideHeader):not(.is-collapsed):not(.nc-sem-fio):not(#nc-fio) > .t-Region-header {
  border-bottom: 2px solid var(--nc-rosa) !important;
}

/* cabeçalho de TODA região (com fio ou sem): 8 px em cima e 8 px embaixo do título */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:not(.t-Region--noUI):not(.t-Region--removeHeader):not(.t-Region--hideHeader):not(#nc-cab) > .t-Region-header {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:not(.t-Region--noUI):not(.t-Region--removeHeader):not(.t-Region--hideHeader):not(.is-collapsed):not(.nc-sem-fio):not(#nc-fio) > .t-Region-bodyWrap > .t-Region-body {
  padding-top: 14px !important;
}

/* região SEM cabeçalho de primeiro nível (a lista de uma tela): cartão completo, com os
   quatro cantos. Fora ficam os recipientes sem borda (ex.: o que envolve as abas),
   senão viravam cartão com cartões dentro. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-contentInner .t-Region--removeHeader:not(.t-Region--noUI):not(.t-Region--noBorder):not(.t-Region .t-Region):not(.t-Region--textContent) {
  background: #fff !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 16px !important;
  box-shadow: var(--nc-soft) !important;
  margin-bottom: 16px !important;
}

/* As opções de modelo da região mandam: "Sem padding" zera o recuo do corpo, qualquer
   que seja o tipo da região (a regra de cartão acima punha 8–18 px mesmo assim). */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region.t-Region--noPadding > .t-Region-bodyWrap > .t-Region-body {
  padding: 0 !important;
}

/* REGIÃO DE IFRAME (a tela é outra aplicação dentro desta — Requisição de Pessoal etc.):
   nenhum desenho. Sem cartão, sem fio, sem recuo, sem margem, e a página em volta sem o
   recuo do conteúdo — o iframe encosta no cabeçalho e no menu como se fosse uma página
   nativa. Vale para a região que contém o iframe e para o <div class="t-Region"> que
   algumas regiões usam para embrulhá-lo. Só o iframe de largura inteira (width="100%"):
   um vídeo ou mapa embutido numa região comum continua dentro do cartão. O
   :not(#nc-iframe) só dá peso: a regra de seção interna (fio + margem) era mais forte. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-contentInner:has(.t-Region iframe[width="100%"]) {
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-contentInner:has(.t-Region iframe[width="100%"]) > .container > .row:has(.t-Region iframe[width="100%"]) {
  margin: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-contentInner:has(.t-Region iframe[width="100%"]) > .container > .row:has(.t-Region iframe[width="100%"]) > .col {
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:has(iframe[width="100%"]):not(#nc-iframe),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:has(iframe[width="100%"]):not(#nc-iframe) > .t-Region-bodyWrap,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:has(iframe[width="100%"]):not(#nc-iframe) > .t-Region-bodyWrap > .t-Region-body {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:has(iframe[width="100%"]):not(#nc-iframe) > .t-Region-bodyWrap > .t-Region-buttons:not(:has(*:not(:empty))) {
  display: none !important;                        /* as barras de botões vazias do modelo não ocupam altura */
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:has(iframe[width="100%"]) iframe {
  display: block !important;
  width: 100% !important;
  border: 0 !important;
}

/* região SEM cabeçalho dentro de outra (gráfico, contadores, o recipiente das abas):
   só recipiente — sem a borda inferior e esquerda que a Skin põe */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region .t-Region.t-Region--removeHeader,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region.t-Region--noBorder {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* região dentro de um CARTÃO (Dados Pessoais, Documentos, Folha | Horário…): um PAINEL
   com fio Névoa e cantos de 12 px, cada assunto na sua moldura. Só com o fio de cima,
   duas seções lado a lado (Folha | Horário) viravam uma massa de campos sem divisa. Sem
   sombra e sem fundo próprio — a hierarquia vem do fio, não de um segundo cartão
   flutuando. Região marcada "Sem borda" continua plana. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:not(.t-Region--removeHeader):not(.t-Region--noUI) .t-Region:not(.t-Region--noUI):not(.t-Region--removeHeader):not(.t-Region--noBorder) {
  background: #fff !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  margin: 12px 0 0 !important;
  overflow: visible !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:not(.t-Region--removeHeader):not(.t-Region--noUI) .t-Region:not(.t-Region--noUI):not(.t-Region--noBorder) > .t-Region-header {
  padding: 12px 14px 0 !important;
  border-radius: 12px 12px 0 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:not(.t-Region--removeHeader):not(.t-Region--noUI) .t-Region:not(.t-Region--noUI):not(.t-Region--noBorder) > .t-Region-bodyWrap > .t-Region-body {
  padding: 8px 14px 14px !important;
}

/* A grade do tema: a .row é 16 px mais larga que o .container (margens de -8 px) e o
   .container corta o excesso com overflow:hidden — que ROLA quando o foco ou a busca do
   navegador pedem um campo à vista: o contêiner deslizava 8 px e a 1.ª coluna aparecia
   cortada ("ínculo" em vez de "Vínculo"). overflow:clip corta igual mas não rola;
   flow-root mantém as colunas flutuantes contidas, como o hidden fazia. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region-body .container {
  display: flow-root !important;
  overflow: clip !important;
}

/* a mesma seção quando marcada "Sem borda": plana, como antes */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:not(.t-Region--removeHeader):not(.t-Region--noUI) .t-Region.t-Region--noBorder:not(.t-Region--noUI) > .t-Region-header {
  padding: 12px 0 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:not(.t-Region--removeHeader):not(.t-Region--noUI) .t-Region.t-Region--noBorder:not(.t-Region--noUI) > .t-Region-bodyWrap > .t-Region-body {
  padding: 6px 0 2px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:not(.t-Region--removeHeader):not(.t-Region--noUI) .t-Region .t-Region-title {
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: -.01em !important;
  color: var(--nc-tinta) !important;
}

/* ---------- 3b. Fundo dos ícones ----------------------------------- */
/* O padrão é o ícone de cartão da Natcorp Skin (o de "Alertas"): a mistura dos três
   degradês da marca, glifo branco. A Skin só o aplica a .t-Card-icon; aqui ele vale
   para todo ícone em quadrado — cartões, a lista de aplicações e o ícone de região.
   A cor de fundo fica transparente: sem isso o u-color do tema (Rosa, Azul, Roxo,
   verde… conforme a posição do item) apareceria por baixo da mistura.
   EXCEÇÃO — ícone com COR DE STATUS (colorStatusRed/Green/Yellow/Blue do Natcorp_Style.css,
   u-success/u-warning/u-danger/u-info do APEX): a cor ali é informação (assinante pendente
   em vermelho, assinado em verde) e fica a do status. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Cards .t-Card .t-Card-icon:not([class*="colorStatus"]):not(.u-success):not(.u-warning):not(.u-danger):not(.u-info),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-icon:not([class*="colorStatus"]):not(.u-success):not(.u-warning):not(.u-danger):not(.u-info),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region-headerIcon {
  background-color: transparent !important;
  background-image: var(--nc-icone-fundo) !important;
  background-blend-mode: screen !important;
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Cards .t-Card .t-Card-icon .t-Icon,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-icon .t-Icon,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region-headerIcon .t-Icon {
  background: transparent !important;              /* o .t-Icon da lista também leva .u-color */
  color: #fff !important;
}

/* ---------- 4. Campos ---------------------------------------------- */
/* Medido na página 136: 83 campos, os menores com 52 px, e 11 cortavam o conteúdo
   (fonte 14 px, 12 px de recuo e 36 px reservados à seta). Agora 38 px de altura,
   13,5 px de fonte, 10 px de recuo e 28 px para a seta: cabe o texto real. */

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-label {
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  hyphens: manual !important;                      /* a Skin hifenizava: "Sindica-to ?" — quebra entre palavras */
  text-transform: none !important;
  letter-spacing: normal !important;
  color: var(--nc-grafite) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-labelContainer {
  padding-bottom: 4px !important;
}

/* o "?" de ajuda: a Skin o posiciona solto no canto (absolute) e ele caía sobre a borda do
   campo. Fica ao lado do rótulo, pequeno, em Cinza — Roxo no hover */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-labelContainer:has(> .t-Form-helpButton) {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-labelContainer > .t-Form-helpButton {
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: none !important;
  order: 2 !important;
  width: 18px !important;
  height: 18px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--nc-cinza) !important;
  cursor: help !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-labelContainer > .t-Form-helpButton::before,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-labelContainer > .t-Form-helpButton::after {
  content: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-labelContainer > .t-Form-helpButton .a-Icon {
  margin: 0 !important;
  font-size: 13px !important;
  color: inherit !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-labelContainer > .t-Form-helpButton:hover {
  background: var(--nc-nevoa2) !important;
  color: var(--nc-roxo) !important;
}

/* rótulo vazio num campo de rótulo EM CIMA (col-null — sem coluna de rótulo para alinhar):
   o contêiner ocupava 34 px sem mostrar nada (ex.: a lista de checkbox de uma região
   recolhível, que já tem o nome no título) */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :where(.row:not(:has(.t-Form-label:not(:empty)))) .t-Form-labelContainer.col-null:has(> .t-Form-label:empty) {
  display: none !important;
}

/* CAMPO FORA DA GRADE (direto no corpo da região — a coluna de filtros, formulários de uma
   coluna só): o rótulo e o campo têm 8 px de cada lado, que são a metade do vão ENTRE
   colunas da grade. Sem grade não há vão: eram 8 px de recuo a mais, e numa região
   estreita o campo ficava espremido. Os campos passam a alinhar com o título. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region-body > .t-Form-fieldContainer > :is(.t-Form-labelContainer, .t-Form-inputContainer) {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* CAMPO SEM RÓTULO ao lado de campos com rótulo (rótulo em cima): o controle subia 17–43 px
   e ficava fora da linha dos vizinhos. O rótulo vazio ganha a altura de uma linha de texto
   (um espaço invisível); o rótulo oculto pelo tema (coluna 0) volta a ocupar o lugar,
   com o texto transparente — continua lido por leitor de tela. Só quando a MESMA linha do
   grid tem algum campo com rótulo VISÍVEL — o rótulo oculto (coluna 0) não conta: numa
   linha só de checkboxes com o nome na opção ("Opções", Requisição de Alteração Funcional,
   página 116), cada um reservava 43 px de rótulo invisível e as linhas ficavam a 78 px uma
   da outra. Campo de exibição vazio e oculto fica de fora. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form--labelsAbove .row:has(.t-Form-labelContainer:not(.col-0) .t-Form-label:not(:empty)) .t-Form-label:empty::before {
  content: "\00a0" !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form--labelsAbove .row:has(.t-Form-labelContainer:not(.col-0) .t-Form-label:not(:empty)) .t-Form-fieldContainer:not(:has(.apex-item-display-only:empty)) > .t-Form-labelContainer.col-0 {
  position: static !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 12px 0 4px !important;
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form--labelsAbove .row:has(.t-Form-labelContainer:not(.col-0) .t-Form-label:not(:empty)) .t-Form-fieldContainer:not(:has(.apex-item-display-only:empty)) > .t-Form-labelContainer.col-0 .t-Form-label {
  color: transparent !important;
  user-select: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form--labelsAbove .row:has(.t-Form-labelContainer:not(.col-0) .t-Form-label:not(:empty)) .t-Form-fieldContainer:not(:has(.apex-item-display-only:empty)) > .t-Form-labelContainer.col-0 .t-Form-label:empty::before {
  content: "\00a0" !important;
}

/* campo de EXIBIÇÃO com caixa: a Skin dá 44 px mínimos, os campos têm 38 — ficava 3 px fora
   da linha dos vizinhos. Mesma altura dos campos; texto longo continua crescendo. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-inputContainer .apex-item-display-only:not(:has(p, table, h1, h2, h3)) {
  min-height: 38px !important;
  box-sizing: border-box !important;
  align-items: center !important;
  padding-top: 7px !important;
  padding-bottom: 7px !important;
}

/* grupos de opção (checkbox, rádio): a Skin põe 10 px de margem embaixo — com a linha
   alinhada pela base, a pílula ficava 10 px acima dos campos vizinhos */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-inputContainer .apex-item-group:is(.apex-item-checkbox, .apex-item-radio) {
  margin-bottom: 0 !important;
}

/* RÓTULO QUE QUEBRA EM 2 LINHAS ("Paga Contribuição Sindicato ?"): o campo dele descia uma
   linha em relação aos vizinhos. Na linha do grid só de campos (sem área de texto e sem
   botão solto, que têm alturas próprias), as colunas alinham pela BASE — os controles
   ficam na mesma linha e o rótulo mais longo cresce para cima. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form--labelsAbove .row:has(> .col > .t-Form-fieldContainer):not(:has(textarea)):not(:has(> .col > .t-Button)) {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-end !important;
}

/* BOTÃO no grid, na mesma linha de campos com rótulo (ex.: "Benefícios" ao lado de "Total
   Remuneração"): o tema o descia 24 px e ele ficava 19 px acima do campo. Desce a altura do
   rótulo, menos 1 px — o botão (40) e o campo (38) ficam com o centro na mesma linha. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form--labelsAbove .row:has(.t-Form-fieldContainer .t-Form-label:not(:empty)) > .col:not(:has(.t-Form-fieldContainer)) > .t-Button {
  margin-top: calc(var(--nc-rotulo-h) - 1px) !important;
  margin-bottom: 0 !important;
}

/* ---------- CAMPO COM ERRO de validação ----------
   A Skin puxava o campo 4 px para cima (margem negativa) — o texto se descolava do botão da
   lista, que ficava onde estava —, não mudava a borda e escrevia a mensagem em 10 px, colada.
   Fica: borda e anel no vermelho da marca (--nc-ruim) no campo E no botão preso a ele,
   mensagem legível com o ícone, 6 px abaixo. O .t-Form-fieldContainer a mais é peso: sem ele
   a regra geral dos campos (mais abaixo, mesmo peso) devolvia a borda Névoa. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer .t-Form-inputContainer :is(input, select, textarea).apex-page-item-error,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer .t-Form-inputContainer .apex-page-item-error :is(input, select, textarea) {
  margin: 0 !important;
  border-color: var(--nc-ruim) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer .t-Form-inputContainer :is(input, select, textarea).apex-page-item-error:focus {
  border-color: var(--nc-ruim) !important;
  box-shadow: 0 0 0 3px rgba(184, 50, 63, .14) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer .t-Form-itemWrapper:has(.apex-page-item-error) :is(.a-Button--popupLOV, .a-Button--calendar, .ui-datepicker-trigger) {
  border-color: var(--nc-ruim) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-inputContainer .a-Form-error,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-inputContainer .a-Form-error .t-Form-error {
  margin: 0 !important;
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-inputContainer .a-Form-error.u-visible {
  flex: none !important;
  width: 100% !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-inputContainer .a-Form-error .t-Form-error {
  display: flex !important;
  align-items: flex-start !important;
  gap: 6px !important;
  margin-top: 6px !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 16px !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  color: var(--nc-ruim) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-inputContainer .a-Form-error .t-Form-error::before {
  content: "\f06a" !important;                      /* fa-exclamation-circle */
  flex: none !important;
  font-family: "Font APEX Small", "Font APEX" !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 16px !important;
}

/* Na linha alinhada pela BASE (regra acima), o campo com mensagem fica 22 px mais alto e
   empurrava o vizinho sem erro para CIMA. Os vizinhos ganham uma linha vazia da mesma
   altura (6 de margem + 16 de texto): os campos continuam na mesma linha. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form--labelsAbove .row:has(.a-Form-error.u-visible) .t-Form-fieldContainer:not(:has(.a-Form-error.u-visible)) > .t-Form-inputContainer::after {
  content: "" !important;
  display: block !important;
  flex: none !important;
  width: 100% !important;
  height: 22px !important;
}

/* ---------- ALERTA DE REGIÃO (t-Alert fora do topo da página — "Carta Anexada") ----------
   A Skin: bloco verde de 48 px com um "✓" de TEXTO, filete de 3 px na borda e título em
   22 px fino. Vira um cartão discreto: fio Névoa, o ícone da Font APEX num quadrado de
   36 px — sucesso e informação no degradê da marca, aviso e erro no vermelho — e o título
   em 15 px negrito, alinhado ao centro do ícone. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert:not(.t-Alert--page) {
  margin: 0 !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert:not(.t-Alert--page) .t-Alert-wrap {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px 16px 12px 12px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert:not(.t-Alert--page) .t-Alert-icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: none !important;
  width: 36px !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 10px !important;
  background-color: transparent !important;
  background-image: var(--nc-icone-fundo) !important;
  background-blend-mode: screen !important;
  box-shadow: 0 8px 18px -10px rgba(201, 87, 136, .8) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert:not(.t-Alert--page):is(.t-Alert--warning, .t-Alert--danger) .t-Alert-icon {
  background-color: var(--nc-ruim) !important;
  background-image: none !important;
  box-shadow: 0 8px 18px -10px rgba(184, 50, 63, .8) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert:not(.t-Alert--page) .t-Alert-icon .t-Icon {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 16px !important;
  line-height: 1 !important;
  color: #fff !important;
}

/* o ícone padrão de cada tipo (t-Alert--defaultIcons): a Skin escrevia um caractere */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--defaultIcons:not(.t-Alert--page) .t-Alert-icon .t-Icon::before {
  font-family: "Font APEX Small", "Font APEX" !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--defaultIcons.t-Alert--success:not(.t-Alert--page) .t-Alert-icon .t-Icon::before {
  content: "\f00c" !important;                     /* fa-check */
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--defaultIcons.t-Alert--info:not(.t-Alert--page) .t-Alert-icon .t-Icon::before {
  content: "\f129" !important;                     /* fa-info */
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--defaultIcons:is(.t-Alert--warning, .t-Alert--danger):not(.t-Alert--page) .t-Alert-icon .t-Icon::before {
  content: "\f12a" !important;                     /* fa-exclamation */
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert:not(.t-Alert--page) .t-Alert-content {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert:not(.t-Alert--page) .t-Alert-title {
  margin: 0 !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  letter-spacing: -.01em !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert:not(.t-Alert--page) .t-Alert-body {
  padding: 0 !important;
  font-size: 13.5px !important;
  line-height: 1.5 !important;
  color: var(--nc-grafite) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert:not(.t-Alert--page) .t-Alert-body:not(:empty) {
  margin-top: 2px !important;
}

/* ---------- AVISO DA PÁGINA (erros da validação, "salvo com sucesso") ----------
   Era a faixa amarela da Skin com uma coluna laranja. Vira um cartão branco com o ícone no
   quadrado — vermelho para erro/aviso, o degradê da marca para sucesso —, título em Tinta e
   os erros como lista; o erro que aponta um campo continua sendo um link para ele. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page {
  overflow: hidden !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: var(--nc-lift) !important;
}

/* celular: o tema põe o aviso no fluxo, de borda a borda — ganha a margem do resto da tela */
@media (max-width: 640px) {
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page {
    width: auto !important;
    margin: 0 16px 12px !important;
  }
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page .t-Alert-wrap {
  display: flex !important;
  align-items: flex-start !important;
  gap: 14px !important;
  padding: 16px 12px 16px 16px !important;
  background: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page .t-Alert-icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: none !important;
  width: 40px !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 12px !important;
  background-color: transparent !important;
  background-image: var(--nc-icone-fundo) !important;
  background-blend-mode: screen !important;
  box-shadow: 0 10px 22px -12px rgba(201, 87, 136, .8) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page:is(.t-Alert--warning, .t-Alert--danger) .t-Alert-icon {
  background-color: var(--nc-ruim) !important;
  background-image: none !important;
  box-shadow: 0 10px 22px -12px rgba(184, 50, 63, .8) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page .t-Alert-icon .t-Icon {
  position: static !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 18px !important;
  line-height: 1 !important;
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page .t-Alert-icon .t-Icon::before {
  font-size: 18px !important;
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page .t-Alert-content {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

/* o tema dá 16 px ao corpo — somados ao respiro do cartão, o texto ficava 30 px longe do
   ícone e 16 px abaixo dele */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page .t-Alert-body {
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page .t-Alert-body,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page .t-Alert-title,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page .a-Notification-title {
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page :is(.t-Alert-title, .a-Notification-title) {
  margin: 0 !important;
  padding-top: 9px !important;                     /* a linha de 22 px centrada no ícone de 40 */
  font-size: 15px !important;
  font-weight: 800 !important;
  line-height: 22px !important;
  letter-spacing: -.01em !important;
}

/* o tema limita a lista a 96 px (3 erros) e o resto rolava escondido: cabem ~12 antes de rolar */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page .a-Notification-list {
  max-height: min(320px, 50vh) !important;
  margin: 8px 0 0 !important;
  padding: 0 0 0 16px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page .a-Notification-item {
  margin: 0 !important;
  padding: 2px 0 !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  color: var(--nc-grafite) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page .a-Notification-item::marker {
  color: var(--nc-cinza) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page .a-Notification-link {
  font-weight: 700 !important;
  color: var(--nc-roxo) !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(81, 28, 118, .3) !important;
  text-underline-offset: 3px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page .a-Notification-link:hover {
  text-decoration-color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page .t-Alert-buttons {
  flex: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page .t-Button--closeAlert {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: static !important;
  width: 32px !important;
  height: 32px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--nc-cinza) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page .t-Button--closeAlert:hover {
  background: var(--nc-nevoa2) !important;
  color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert--page .t-Button--closeAlert .t-Icon {
  color: inherit !important;
}

/* OBRIGATÓRIO no template "Required" (campos empilhados — a modal "Relatório de Aviso de
   Férias"): o APEX escreve o asterisco num <span class="t-Form-required"> DEPOIS do
   <label>, que ocupa a linha inteira — o asterisco caía numa 2.ª linha e o campo descia
   20 px em relação ao vizinho não obrigatório. O asterisco volta para o lado do nome, o
   mesmo " *" vermelho do outro template (is-required, logo abaixo). */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-labelContainer:has(> .t-Form-required) {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: baseline !important;
  column-gap: 3px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-labelContainer:has(> .t-Form-required) > .t-Form-label {
  display: inline !important;
  width: auto !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-labelContainer > .t-Form-required {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-labelContainer > .t-Form-required .a-Icon {
  display: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-labelContainer > .t-Form-required::after {
  content: "*" !important;
  font: 800 12px Manrope, system-ui, sans-serif !important;
  color: var(--nc-ruim) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .is-required .t-Form-label::before {
  content: none !important;
  display: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .is-required .t-Form-label::after {
  content: " *" !important;
  display: inline !important;
  font: 800 12px Manrope, system-ui, sans-serif !important;
  vertical-align: baseline !important;
  color: var(--nc-ruim) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) input.apex-item-text,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) select.selectlist,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) select.apex-item-select,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) textarea.textarea,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog input.apex-item-text,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog select.selectlist {
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 10px !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 8px !important;
  background-color: #fff !important;
  font-size: 13.5px !important;
  line-height: 1.3 !important;
  color: var(--nc-tinta) !important;
  box-shadow: none !important;
  transition: border-color .2s, box-shadow .2s !important;
}

/* a busca das listas popup tem a lupa POR CIMA do campo, a 16 px da borda da barra: a regra
   acima (padding 0 10px) apagava o recuo do tema e o texto corria por baixo do ícone */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-PopupLOV-searchBar input.a-PopupLOV-search {
  padding-left: 34px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-PopupLOV-searchBar .a-Icon.icon-search {
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: var(--nc-cinza) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) select.selectlist,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) select.apex-item-select,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog select.selectlist {
  padding-right: 28px !important;
  background-position: right 8px center !important;
  text-overflow: ellipsis !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) textarea.textarea {
  height: auto !important;
  padding: 8px 10px !important;
  line-height: 1.5 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) input.apex-item-text::placeholder,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) textarea.textarea::placeholder {
  color: var(--nc-cinza) !important;
  opacity: 1 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) input.apex-item-text:hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) select.selectlist:hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) textarea.textarea:hover {
  border-color: #D3CBE3 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) input.apex-item-text:focus,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) select.selectlist:focus,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) textarea.textarea:focus,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog input.apex-item-text:focus {
  border-color: var(--nc-roxo) !important;
  box-shadow: var(--nc-anel) !important;
  outline: none !important;
}

/* a lista popup é sempre readonly, mas é um campo ATIVO: fica fora do cinza de desabilitado */
/* itens desabilitados, somente leitura e de exibição: fundo #FDFDFD (quase branco neutro),
   texto em Grafite — some a caixa lilás/cinza do tema */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) input.apex-item-text[readonly]:not(.apex-item-popup-lov),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) input.apex-item-text:disabled,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) select.selectlist:disabled,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) select:disabled,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) textarea:disabled,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) textarea[readonly],
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .apex-item-display-only,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .apex_disabled,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .select2-container--disabled .select2-selection {
  background-color: #FDFDFD !important;
  color: var(--nc-grafite) !important;
}

/* CAMPO OCULTO POR CONVENÇÃO — para esconder um item em qualquer página sem trocar o tipo
   dele nem criar Dynamic Action: no APEX, Item › Advanced › CSS Classes → nc-oculto
   (a classe vai no próprio campo; aqui some o contêiner inteiro: rótulo, campo, ajuda e
   erro). O valor continua no formulário e é enviado normalmente. Também vale na coluna do
   grid (Layout › Column CSS Classes) e na região (Appearance › CSS Classes). */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer:has(.nc-oculto),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .col.nc-oculto,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region.nc-oculto,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .nc-oculto:not(input, select, textarea) {
  display: none !important;
}

/* Campo de EXIBIÇÃO vazio e sem rótulo (rótulo em coluna 0 — o tema esconde só o
   rótulo): a Skin dá a todo "display only" borda, fundo e 44 px de altura, e ele virava
   uma caixa vazia na tela (ex.: o "Status" em cima do mapa da marcação de ponto). Sem
   valor e sem rótulo não há o que mostrar. Se uma ação dinâmica preencher o valor, o
   <span> deixa de estar vazio e o campo aparece. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer:has(> .t-Form-labelContainer.col-0):has(.apex-item-display-only:empty) {
  display: none !important;
}

/* ---------- CAMPO DE ARQUIVO (File Browse) — área de soltar ----------
   Era o botão cinza do navegador ("Escolher arquivo") solto na linha, fácil de passar
   batido. Vira uma área tracejada de 132 px: ícone de envio, a instrução e, embaixo, o
   botão e o nome do arquivo escolhido.
   O ARRASTAR-E-SOLTAR é do próprio navegador: o <input type=file> é esticado sobre a
   área inteira (fica por cima, transparente só no fundo) — soltar um arquivo em qualquer
   ponto dela o seleciona, e clicar em qualquer ponto abre o seletor. Sem JavaScript.
   O realce DURANTE o arraste (is-dragover) precisa de 1 linha de JS (Natcorp_Upload.js);
   sem ele, o resto funciona igual. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  min-height: 132px !important;
  border: 1.5px dashed #CFC5E2 !important;
  border-radius: 12px !important;
  background: var(--nc-quase) !important;
  transition: border-color .2s, background-color .2s, box-shadow .2s !important;
}

/* o ícone: nuvem com a seta, num círculo branco */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file::before {
  content: "\f0ee" !important;                     /* fa-cloud-upload */
  position: absolute !important;
  top: 18px !important;
  left: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px !important;
  height: 44px !important;
  margin-left: -22px !important;
  border-radius: 50% !important;
  background: #fff !important;
  box-shadow: 0 1px 2px rgba(27, 18, 56, .06), 0 6px 16px -8px rgba(81, 28, 118, .35) !important;
  font-family: "Font APEX Small", "Font APEX" !important;
  font-size: 20px !important;
  line-height: 1 !important;
  color: var(--nc-roxo) !important;
  pointer-events: none !important;
  transition: transform .25s cubic-bezier(.22, 1, .36, 1) !important;
}

/* a instrução */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file::after {
  content: "Arraste o arquivo para cá ou clique para escolher" !important;
  position: absolute !important;
  top: 72px !important;
  left: 16px !important;
  right: 16px !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
  text-align: center !important;
  color: var(--nc-tinta) !important;
  pointer-events: none !important;
}

/* o campo de verdade cobre a área toda; o que ele desenha (botão + nome) fica embaixo */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file input[type="file"] {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 98px 16px 14px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: transparent !important;
  box-shadow: none !important;
  cursor: pointer !important;
  text-align: center !important;
  text-align-last: center !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  color: var(--nc-cinza) !important;
  outline: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file input[type="file"]::file-selector-button {
  height: 26px !important;
  margin: 0 8px 0 0 !important;
  padding: 0 12px !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 7px !important;
  background: #fff !important;
  font-family: inherit !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  color: var(--nc-roxo) !important;
  cursor: pointer !important;
  transition: border-color .2s, background-color .2s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file .apex-item-file-dropzone {
  display: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file:hover {
  border-color: rgba(81, 28, 118, .45) !important;
  background: #F7F3FB !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file:hover input[type="file"]::file-selector-button {
  border-color: rgba(81, 28, 118, .4) !important;
  background: var(--nc-off) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file:has(input[type="file"]:focus-visible) {
  border-color: var(--nc-roxo) !important;
  box-shadow: var(--nc-anel) !important;
}

/* arrastando por cima (classe posta pelo Natcorp_Upload.js) */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file.is-dragover {
  border-style: solid !important;
  border-color: var(--nc-roxo) !important;
  background: #F1EAF8 !important;
  box-shadow: var(--nc-anel) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file.is-dragover::before {
  transform: translateY(-3px) scale(1.06) !important;
  background: var(--nc-roxo) !important;
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file.is-dragover::after {
  content: "Solte para anexar" !important;
  color: var(--nc-roxo) !important;
}

/* arquivo escolhido (classe posta pelo Natcorp_Upload.js): a área fica "preenchida" */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file.tem-arquivo {
  border-style: solid !important;
  border-color: rgba(81, 28, 118, .3) !important;
  background: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file.tem-arquivo::before {
  content: "\f00c" !important;                     /* fa-check */
  background: var(--nc-roxo) !important;
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file.tem-arquivo::after {
  content: "Arquivo anexado — clique ou arraste outro para trocar" !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file.tem-arquivo input[type="file"] {
  font-weight: 700 !important;
  color: var(--nc-tinta) !important;
}

/* ARQUIVO JÁ SALVO no banco: o APEX põe um link "Fazer Download" dentro do campo. A área
   de soltar o cobria (o campo esticado fica por cima) — o link sumia e não recebia clique.
   Ele sai para baixo da área como um botão próprio, com o ícone de download, e a
   instrução passa a dizer que um arquivo novo substitui o atual. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file:has(> a) {
  margin-bottom: 50px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file:has(> a)::after {
  content: "Já há um arquivo salvo — arraste outro para substituir" !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file > a {
  position: absolute !important;
  top: calc(100% + 10px) !important;
  left: 0 !important;
  z-index: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  height: 36px !important;
  padding: 0 14px 0 12px !important;
  border: 1px solid rgba(81, 28, 118, .2) !important;
  border-radius: 8px !important;
  background: #F4EEFA !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  color: var(--nc-roxo) !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: background-color .2s, border-color .2s, box-shadow .2s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file > a::before {
  content: "\f019" !important;                     /* fa-download */
  font-family: "Font APEX Small", "Font APEX" !important;
  font-size: 15px !important;
  font-weight: 400 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file > a:hover {
  border-color: var(--nc-roxo) !important;
  background: #EDE3F7 !important;
  box-shadow: 0 8px 18px -12px rgba(81, 28, 118, .6) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file > a:focus-visible {
  outline: 2px solid var(--nc-roxo) !important;
  outline-offset: 2px !important;
}

/* ÁREA ESTREITA (celular, coluna pequena): a frase longa quebrava em duas linhas e caía em
   cima do botão. A largura medida é a do próprio campo (container query), não a da tela. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-itemWrapper:has(> .apex-item-group--file) {
  container-type: inline-size !important;
}

@container (max-width: 440px) {
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file::after {
    content: "Arraste ou clique para escolher" !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file.tem-arquivo::after {
    content: "Arquivo anexado" !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file.is-dragover::after {
    content: "Solte para anexar" !important;
  }
}

/* tela de toque: não há o que arrastar — a instrução diz o gesto certo */
@media (pointer: coarse) {
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file::after {
    content: "Toque para escolher o arquivo" !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file.tem-arquivo::after {
    content: "Arquivo anexado — toque para trocar" !important;
  }
}

/* campo obrigatório não preenchido na validação */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer:has(.a-Form-error.u-visible) .apex-item-group--file {
  border-color: var(--nc-ruim) !important;
}

@media (prefers-reduced-motion: reduce) {
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file::before {
    transition: none !important;
  }
}

/* ESPAÇADOR: campo de exibição vazio com o rótulo em branco, mas numa coluna de rótulo
   normal (os "P116_BLANK_…" de Filial Atual, que alinham a coluna com as perguntas de
   Filial Proposta ao lado). Ele existe para OCUPAR o lugar: a caixa some (sem borda e sem
   fundo) e a altura fica. Preenchido por ação dinâmica, deixa de estar vazio e a caixa
   volta. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer:has(> .t-Form-labelContainer:not(.col-0) > .t-Form-label:empty) .t-Form-inputContainer .apex-item-display-only:empty {
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* checkbox: a Skin desenhava DUAS caixas sobrepostas — o próprio input (22 px) e o
   label::before (26 px, com halo de 4 px) — e o texto em caixa-alta. Fica só o input
   (é ele que recebe o clique e o foco), com 18 px, na linha do texto. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-checkbox .apex-item-option,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :where(.apex-item-option:has(> input[type="checkbox"])) {   /* :where — um :has não suportado não derruba a regra inteira */
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 28px !important;
  margin: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-option > input[type="checkbox"] {
  position: static !important;
  flex: none !important;
  order: 0 !important;                           /* a Skin punha order: 3 — a caixa ia para depois do texto */
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  border: 1.5px solid #CBC1DC !important;
  border-radius: 5px !important;
  background-color: #fff !important;
  background-position: center !important;
  background-size: 12px auto !important;
  background-repeat: no-repeat !important;
  box-shadow: none !important;
  cursor: pointer !important;
  transition: background-color .15s, border-color .15s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-option > input[type="checkbox"]:hover {
  border-color: var(--nc-rosa) !important;
}

/* marcado: o Rosa da marca é a cor de "selecionado" — checkbox, rádio e seletor */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-option > input[type="checkbox"]:checked {
  border-color: var(--nc-rosa) !important;
  background-color: var(--nc-rosa) !important;
}

/* ---- Grupo de rádio ----
   A Skin desenha o grupo como botões lado a lado, mas deixa por cima as bolinhas do rádio
   (::before 16 px e ::after 6 px, no canto do botão) e pinta o escolhido de Roxo. Vira um
   seletor segmentado: um trilho branco com fio Névoa, cada opção um botão de 32 px, a
   escolhida em Rosa com texto branco. O <input> continua lá, oculto — é ele que recebe
   o clique (pelo label) e o teclado (setas), e o foco dele acende o anel no botão. */
/* o grupo de fora e a grade não desenham nada (a Skin punha uma segunda borda) e esticam */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group.apex-item-radio:has(.apex-item-grid),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-radio .apex-item-grid {
  display: block !important;
  width: 100% !important;
  height: auto !important;                         /* a Skin travava o grupo em 34 px e cortava o trilho */
  overflow: visible !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-radio .apex-item-grid-row,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-radio:not(:has(.apex-item-grid)) {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  box-sizing: border-box !important;
  min-height: 38px !important;                     /* a altura dos outros campos */
  gap: 2px !important;
  padding: 3px !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 10px !important;
  background: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-radio .apex-item-option {
  position: relative !important;
  display: flex !important;
  flex: 1 1 0 !important;
  min-width: max-content !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-radio .apex-item-option > input[type="radio"] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-radio .apex-item-option > input[type="radio"] + label {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 1 1 auto !important;
  height: 30px !important;                         /* 30 + trilho (3 + 3 + 2 de fio) = 38, a altura dos campos */
  margin: 0 !important;
  padding: 0 14px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  white-space: nowrap !important;
  color: var(--nc-grafite) !important;
  cursor: pointer !important;
  transition: background-color .15s, color .15s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-radio .apex-item-option > input[type="radio"] + label::before,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-radio .apex-item-option > input[type="radio"] + label::after {
  content: none !important;
  display: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-radio .apex-item-option > input[type="radio"]:not(:checked) + label:hover {
  background: var(--nc-nevoa2) !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-radio .apex-item-option > input[type="radio"]:checked + label {
  background: var(--nc-rosa) !important;
  color: #fff !important;
  box-shadow: 0 6px 14px -8px rgba(201, 87, 136, .8) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-radio .apex-item-option > input[type="radio"]:focus-visible + label {
  box-shadow: 0 0 0 3px rgba(201, 87, 136, .28) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-radio .apex-item-option > input[type="radio"]:disabled + label {
  cursor: default !important;
  opacity: .55 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-option > input[type="checkbox"]:focus-visible {
  outline: none !important;
  box-shadow: var(--nc-anel) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-option > input[type="checkbox"] + label {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  color: var(--nc-tinta) !important;
  cursor: pointer !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-option > input[type="checkbox"] + label::before,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-option > input[type="checkbox"] + label::after {
  content: none !important;
  display: none !important;
}

/* GRUPO de checkbox em linha (ex.: "Pagou Sindicato no Ano?  SIM / NÃO"): a Skin o
   desenha como uma trilha com borda e pinta o label de Roxo (esmaecido quando
   desabilitado) — com a caixa por cima, parecia marcado o que não estava. Vira uma
   fila simples: caixa + texto, lado a lado, na altura dos campos. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-checkbox .apex-item-grid,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-checkbox .apex-item-grid-row {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px 20px !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-checkbox .apex-item-option > input[type="checkbox"] + label {
  width: auto !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

/* DUAS opções (Sim / Não): pílula segmentada, o mesmo desenho do grupo de rádio — trilha
   branca, cada opção um botão, a marcada em Rosa. Com 3 ou mais opções continua a fila de
   caixas acima. O <input> fica oculto (é ele que recebe clique pelo label e o teclado). */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-checkbox .apex-item-grid-row:has(> .apex-item-option:nth-child(2):last-child),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-checkbox:not(:has(.apex-item-grid)):has(> .apex-item-option:nth-of-type(2):last-of-type) {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  gap: 2px !important;
  box-sizing: border-box !important;
  min-height: 38px !important;
  padding: 3px !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 10px !important;
  background: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.apex-item-grid-row, .apex-item-checkbox):has(> .apex-item-option:nth-child(2):last-child) > .apex-item-option {
  position: relative !important;
  flex: 1 1 0 !important;
  min-width: max-content !important;
  min-height: 0 !important;
  gap: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.apex-item-grid-row, .apex-item-checkbox):has(> .apex-item-option:nth-child(2):last-child) > .apex-item-option > input[type="checkbox"] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  border: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.apex-item-grid-row, .apex-item-checkbox):has(> .apex-item-option:nth-child(2):last-child) > .apex-item-option > input[type="checkbox"] + label {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 1 1 auto !important;
  height: 30px !important;
  padding: 0 14px !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  color: var(--nc-grafite) !important;
  transition: background-color .15s, color .15s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.apex-item-grid-row, .apex-item-checkbox):has(> .apex-item-option:nth-child(2):last-child) > .apex-item-option > input[type="checkbox"]:not(:checked):not(:disabled) + label:hover {
  background: var(--nc-nevoa2) !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.apex-item-grid-row, .apex-item-checkbox):has(> .apex-item-option:nth-child(2):last-child) > .apex-item-option > input[type="checkbox"]:checked + label {
  background: var(--nc-rosa) !important;
  color: #fff !important;
  font-weight: 600 !important;
  box-shadow: 0 6px 14px -8px rgba(201, 87, 136, .8) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.apex-item-grid-row, .apex-item-checkbox):has(> .apex-item-option:nth-child(2):last-child) > .apex-item-option > input[type="checkbox"]:focus-visible + label {
  box-shadow: 0 0 0 3px rgba(201, 87, 136, .28) !important;
}

/* somente leitura: a pílula continua dizendo qual é — a marcada um pouco apagada, a outra Cinza */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.apex-item-grid-row, .apex-item-checkbox):has(> .apex-item-option:nth-child(2):last-child):has(input:disabled) {
  background: #FDFDFD !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.apex-item-grid-row, .apex-item-checkbox):has(> .apex-item-option:nth-child(2):last-child) > .apex-item-option > input[type="checkbox"]:disabled:checked + label {
  opacity: .8 !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.apex-item-grid-row, .apex-item-checkbox):has(> .apex-item-option:nth-child(2):last-child) > .apex-item-option > input[type="checkbox"]:disabled:not(:checked) + label {
  color: var(--nc-cinza) !important;
  font-weight: 500 !important;
}

/* desabilitado (somente leitura): o marcado continua legível — caixa Rosa e texto em
   Tinta negrito; o não marcado fica quieto, caixa #FDFDFD e texto Cinza */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-option > input[type="checkbox"]:disabled {
  cursor: default !important;
  opacity: 1 !important;
  background-color: #FDFDFD !important;
  border-color: #DDD5EA !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-option > input[type="checkbox"]:disabled:checked {
  background-color: var(--nc-rosa) !important;
  border-color: var(--nc-rosa) !important;
  opacity: .8 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-option > input[type="checkbox"]:disabled + label {
  cursor: default !important;
  color: var(--nc-cinza) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-option > input[type="checkbox"]:disabled:checked + label {
  font-weight: 700 !important;
  color: var(--nc-tinta) !important;
}

/* NOTA — ".t-DialogRegion" nas listas :is(...) deste arquivo: a região de diálogo EMBUTIDA
   (template Inline Dialog — "Filtrar Parâmetros" do eSocial) é posta pelo APEX direto no
   <body>, fora de .t-Body-content; sem ela na lista, os campos e botões de lá ficavam com
   o desenho da Skin (botões lilás, calendário 6 px mais alto que o campo). */
/* botões colados ao campo (calendário, lista de valores): eram um bloco lilás solto,
   7 px ao lado do campo. Agora o campo e o botão são UMA peça — o campo perde os cantos
   da direita, o botão encosta nele (borda compartilhada), branco, ícone em Grafite, e
   só fica Roxo no hover. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion) input.apex-item-datepicker,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion) input.apex-item-popup-lov {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion) .a-Button--popupLOV,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion) .ui-datepicker-trigger,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion) .a-Button--calendar {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 38px !important;
  min-width: 40px !important;
  margin: 0 0 0 -1px !important;
  padding: 0 !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 0 8px 8px 0 !important;
  background: #fff !important;
  color: var(--nc-grafite) !important;
  box-shadow: none !important;
  transition: background-color .2s, color .2s, border-color .2s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion) .a-Button--popupLOV .a-Icon,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion) .ui-datepicker-trigger .a-Icon {
  margin: 0 !important;
  color: inherit !important;
  opacity: .8 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion) .a-Button--popupLOV:hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion) .ui-datepicker-trigger:hover {
  background: var(--nc-quase) !important;
  border-color: #D3CBE3 !important;
  color: var(--nc-roxo) !important;
}

/* lista popup de VÁRIOS valores: a caixa do campo é o ul.apex-item-multi (com os valores
   escolhidos em etiquetas) e o input mora dentro dela. O input ganhava borda e fundo
   próprios — ficava uma caixa dentro da outra. Agora o ul é o campo (a mesma borda,
   altura e cantos dos outros) e o input é só texto. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--popup-lov {
  display: flex !important;
  align-items: stretch !important;
  gap: 0 !important;                              /* a Skin punha 6 px entre a caixa e o botão */
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--popup-lov .apex-item-multi {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px !important;
  flex: 1 1 auto !important;
  max-width: none !important;                     /* o APEX grava max-width em linha e sobrava um vão antes do botão */
  box-sizing: border-box !important;              /* 38 com a borda — era 40, 2 px acima dos outros campos */
  min-height: 38px !important;
  margin: 0 !important;
  padding: 3px 6px !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 8px 0 0 8px !important;
  background: #fff !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--popup-lov .apex-item-multi:focus-within {
  border-color: var(--nc-roxo) !important;
  box-shadow: var(--nc-anel) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--popup-lov .apex-item-multi input.apex-item-popup-lov {
  height: 28px !important;                        /* 28 + 3 + 3 + borda = 36: a caixa fica nos 38 mínimos, como os outros campos */
  min-height: 0 !important;
  padding: 0 4px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 13.5px !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--popup-lov .apex-item-multi input.apex-item-popup-lov:focus {
  border: 0 !important;
  box-shadow: none !important;
}

/* os valores escolhidos */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-multi .apex-item-multi-item:not(:has(input)) {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  height: 26px !important;
  margin: 0 !important;
  padding: 0 4px 0 8px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: var(--nc-nevoa2) !important;
  color: var(--nc-roxo) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--popup-lov .a-Button--popupLOV {
  height: auto !important;
  min-height: 38px !important;
}

/* o contêiner separa campo e botão com gap de 8 px: zerado só onde há botão colado */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-itemWrapper:has(> .ui-datepicker-trigger),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-itemWrapper:has(> .a-Button--popupLOV) {
  gap: 0 !important;
}

/* o foco do campo acende o botão junto: parecem uma peça só também no foco */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion) input.apex-item-datepicker:focus + .ui-datepicker-trigger,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion) input.apex-item-popup-lov:focus + .a-Button--popupLOV {
  border-color: var(--nc-roxo) !important;
  color: var(--nc-roxo) !important;
}

/* ---------- 5. Botões ---------------------------------------------- */

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button:not(.t-Button--link):not(.t-Button--noUI),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button:not(.t-Button--link) {
  height: 40px !important;
  padding: 0 18px !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: normal !important;
  transition: background-color .3s cubic-bezier(.22, 1, .36, 1), box-shadow .3s cubic-bezier(.22, 1, .36, 1), border-color .3s !important;
}

/* secundário: branco, borda Névoa, texto Roxo */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button:not(.t-Button--hot):not(.t-Button--link):not(.t-Button--noUI),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button:not(.t-Button--hot),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button:not(.t-Button--hot):not(.t-Button--link) {
  background: #fff !important;
  border: 1px solid var(--nc-nevoa) !important;
  color: var(--nc-roxo) !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button:not(.t-Button--hot):not(.t-Button--link):not(.t-Button--noUI):hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button:not(.t-Button--hot):hover {
  border-color: rgba(81, 28, 118, .4) !important;
  background: var(--nc-off) !important;
}

/* primário: Roxo sólido; no hover escurece e ganha a sombra roxa */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Button--hot,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button--hot,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button--hot {
  background: var(--nc-roxo) !important;
  background-image: none !important;
  border: 0 !important;
  color: #fff !important;
  box-shadow: 0 1px 2px rgba(27, 18, 56, .12) !important;
}

/* PERIGO (t-Button--danger — "Remover", "Excluir"): a regra do secundário, acima, o
   pintava de Roxo como qualquer botão. Volta a ser vermelho: contorno (t-Button--simple)
   em branco com texto e borda no vermelho da marca; cheio, vermelho com texto branco. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button.t-Button--danger:not(.t-Button--link):not(.t-Button--noUI),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button.t-Button--danger,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button.t-Button--danger:not(.t-Button--link) {
  background: var(--nc-ruim) !important;
  border: 1px solid var(--nc-ruim) !important;
  color: #fff !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button.t-Button--danger:not(.t-Button--link):not(.t-Button--noUI):hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button.t-Button--danger:hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button.t-Button--danger:not(.t-Button--link):hover {
  background: #9A2833 !important;
  border-color: #9A2833 !important;
  box-shadow: 0 12px 28px -12px rgba(184, 50, 63, .6) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button.t-Button--danger.t-Button--simple:not(.t-Button--link):not(.t-Button--noUI),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button.t-Button--danger.t-Button--simple,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button.t-Button--danger.t-Button--simple:not(.t-Button--link) {
  background: #fff !important;
  border-color: rgba(184, 50, 63, .35) !important;
  color: var(--nc-ruim) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button.t-Button--danger.t-Button--simple:not(.t-Button--link):not(.t-Button--noUI):hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button.t-Button--danger.t-Button--simple:hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button.t-Button--danger.t-Button--simple:not(.t-Button--link):hover {
  background: #FDF1F2 !important;
  border-color: var(--nc-ruim) !important;
  color: var(--nc-ruim) !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Button--danger .t-Icon,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Button--danger .t-Button-label {
  color: inherit !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Button--danger:focus-visible {
  outline-color: var(--nc-ruim) !important;
}

/* OS OUTROS ESTADOS (primário, sucesso, aviso, informação): a regra do secundário os
   deixava todos Roxo contorno — no painel "Relatórios de Logs" (eSocial) só o
   "Inconsistentes" (perigo, acima) aparecia colorido; "Geral", "Liquidados" e "Sem Retorno"
   pareciam iguais a "Cancelados", que não tem estado. Cada estado volta com a sua cor:
   primário no Azul da marca, sucesso verde, aviso AMARELO (com texto escuro), informação no
   Rosa escurecido — cheio com texto branco; com t-Button--simple, contorno na cor. */

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button.t-Button--primary:not(.t-Button--link):not(.t-Button--noUI),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button.t-Button--primary,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button.t-Button--primary:not(.t-Button--link) {
  background: var(--nc-azul) !important;
  border: 1px solid var(--nc-azul) !important;
  color: #fff !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button.t-Button--primary:not(.t-Button--link):not(.t-Button--noUI):hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button.t-Button--primary:hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button.t-Button--primary:not(.t-Button--link):hover {
  background: var(--nc-roxo) !important;
  border-color: var(--nc-roxo) !important;
  color: #fff !important;
  box-shadow: 0 12px 28px -12px rgba(81, 28, 118, .6) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button.t-Button--primary.t-Button--simple:not(.t-Button--link):not(.t-Button--noUI),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button.t-Button--primary.t-Button--simple,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button.t-Button--primary.t-Button--simple:not(.t-Button--link) {
  background: #fff !important;
  border-color: rgba(81, 28, 118, .35) !important;
  color: var(--nc-azul) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button.t-Button--primary.t-Button--simple:not(.t-Button--link):not(.t-Button--noUI):hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button.t-Button--primary.t-Button--simple:hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button.t-Button--primary.t-Button--simple:not(.t-Button--link):hover {
  background: #F1EEF8 !important;
  border-color: var(--nc-azul) !important;
  color: var(--nc-azul) !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Button.t-Button--primary .t-Icon,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Button.t-Button--primary .t-Button-label {
  color: inherit !important;
}


html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button.t-Button--success:not(.t-Button--link):not(.t-Button--noUI),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button.t-Button--success,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button.t-Button--success:not(.t-Button--link) {
  background: var(--nc-bom) !important;
  border: 1px solid var(--nc-bom) !important;
  color: #fff !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button.t-Button--success:not(.t-Button--link):not(.t-Button--noUI):hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button.t-Button--success:hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button.t-Button--success:not(.t-Button--link):hover {
  background: var(--nc-bom-hover) !important;
  border-color: var(--nc-bom-hover) !important;
  color: #fff !important;
  box-shadow: 0 12px 28px -12px rgba(31, 122, 82, .6) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button.t-Button--success.t-Button--simple:not(.t-Button--link):not(.t-Button--noUI),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button.t-Button--success.t-Button--simple,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button.t-Button--success.t-Button--simple:not(.t-Button--link) {
  background: #fff !important;
  border-color: rgba(31, 122, 82, .35) !important;
  color: var(--nc-bom) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button.t-Button--success.t-Button--simple:not(.t-Button--link):not(.t-Button--noUI):hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button.t-Button--success.t-Button--simple:hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button.t-Button--success.t-Button--simple:not(.t-Button--link):hover {
  background: #EEF7F2 !important;
  border-color: var(--nc-bom) !important;
  color: var(--nc-bom) !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Button.t-Button--success .t-Icon,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Button.t-Button--success .t-Button-label {
  color: inherit !important;
}


html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button.t-Button--warning:not(.t-Button--link):not(.t-Button--noUI),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button.t-Button--warning,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button.t-Button--warning:not(.t-Button--link) {
  background: var(--nc-alerta) !important;
  border: 1px solid var(--nc-alerta) !important;
  color: var(--nc-tinta) !important;                /* no amarelo, texto escuro — o branco não lia */
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button.t-Button--warning:not(.t-Button--link):not(.t-Button--noUI):hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button.t-Button--warning:hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button.t-Button--warning:not(.t-Button--link):hover {
  background: var(--nc-alerta-hover) !important;
  border-color: var(--nc-alerta-hover) !important;
  color: var(--nc-tinta) !important;
  box-shadow: 0 12px 28px -12px rgba(227, 166, 0, .7) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button.t-Button--warning.t-Button--simple:not(.t-Button--link):not(.t-Button--noUI),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button.t-Button--warning.t-Button--simple,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button.t-Button--warning.t-Button--simple:not(.t-Button--link) {
  background: #fff !important;
  border-color: rgba(245, 183, 0, .7) !important;
  color: var(--nc-alerta-texto) !important;        /* contorno: texto em âmbar escuro (amarelo puro não lê no branco) */
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button.t-Button--warning.t-Button--simple:not(.t-Button--link):not(.t-Button--noUI):hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button.t-Button--warning.t-Button--simple:hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button.t-Button--warning.t-Button--simple:not(.t-Button--link):hover {
  background: #FFF7D6 !important;
  border-color: var(--nc-alerta) !important;
  color: var(--nc-alerta-texto) !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Button.t-Button--warning .t-Icon,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Button.t-Button--warning .t-Button-label {
  color: inherit !important;
}


html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button.t-Button--info:not(.t-Button--link):not(.t-Button--noUI),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button.t-Button--info,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button.t-Button--info:not(.t-Button--link) {
  background: var(--nc-info) !important;
  border: 1px solid var(--nc-info) !important;
  color: #fff !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button.t-Button--info:not(.t-Button--link):not(.t-Button--noUI):hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button.t-Button--info:hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button.t-Button--info:not(.t-Button--link):hover {
  background: var(--nc-info-hover) !important;
  border-color: var(--nc-info-hover) !important;
  color: #fff !important;
  box-shadow: 0 12px 28px -12px rgba(166, 63, 110, .6) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button.t-Button--info.t-Button--simple:not(.t-Button--link):not(.t-Button--noUI),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button.t-Button--info.t-Button--simple,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button.t-Button--info.t-Button--simple:not(.t-Button--link) {
  background: #fff !important;
  border-color: rgba(166, 63, 110, .35) !important;
  color: var(--nc-info) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button.t-Button--info.t-Button--simple:not(.t-Button--link):not(.t-Button--noUI):hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-title .t-Button.t-Button--info.t-Button--simple:hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button.t-Button--info.t-Button--simple:not(.t-Button--link):hover {
  background: #FBF0F5 !important;
  border-color: var(--nc-info) !important;
  color: var(--nc-info) !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Button.t-Button--info .t-Icon,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Button.t-Button--info .t-Button-label {
  color: inherit !important;
}


/* botão feito de LINK (<a class="t-Button">): o <button> centra o texto sozinho, o <a> não
   — o "Remover" ficava colado no alto da caixa de 40 px */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) a.t-Button:not(.t-Button--link):not(.t-Button--noUI) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) a.t-Button.t-Button--stretch:not(.t-Button--link):not(.t-Button--noUI) {
  display: flex !important;
  width: 100% !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Button--hot:hover {
  background: var(--nc-roxo-hover) !important;
  box-shadow: 0 12px 28px -10px rgba(81, 28, 118, .55) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Button--hot .t-Icon,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Button--hot .t-Button-label {
  color: #fff !important;
}

/* só ícone: quadrado de 40 com o ícone no centro exato — o tema dá margem ao ícone
   (t-Icon--left/right) e ele ficava 6 px fora do centro */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) .t-Button--noLabel.t-Button--icon,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .t-Button--noLabel.t-Button--icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Button--noLabel.t-Button--icon .t-Icon {
  margin: 0 !important;
  position: static !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Button:focus-visible,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Body-content, .t-Body-side, .t-Dialog-body, .t-DialogRegion, .t-Dialog-footer) a:focus-visible,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-rds a:focus-visible {
  outline: 2px solid var(--nc-roxo) !important;
  outline-offset: 2px !important;
}

/* ---------- 6. Abas: a lista da página /modulos, na horizontal ------ */

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-rds-container {
  background: transparent !important;
  border: 0 !important;
  margin: 4px 0 20px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-rds {
  display: inline-flex !important;
  gap: 4px !important;
  padding: 5px !important;
  background: #fff !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 12px !important;
  box-shadow: var(--nc-soft) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-rds .apex-rds-item a {
  display: inline-flex !important;
  align-items: center !important;
  height: 38px !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--nc-grafite) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-rds .apex-rds-item a:hover {
  background: var(--nc-quase) !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-rds .apex-rds-selected a,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-rds .apex-rds-selected a:hover {
  background: var(--nc-off) !important;
  color: var(--nc-roxo) !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-rds .apex-rds-item a::after,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-rds .apex-rds-item a::before {
  content: none !important;
  display: none !important;
}

/* ---------- 7. Relatórios (Interactive Report) --------------------- */
/* Para quem varre linhas o dia inteiro: barra de ferramentas com margem e controles
   de uma altura só; cabeçalho alinhado à esquerda como os dados (era centralizado),
   sem quebrar linha e em Grafite (o Cinza em 11 px não passava de contraste); células
   de 13 px com algarismos tabulares; zero grade vertical, zero zebra, fio embaixo. */

/* A região do relatório é o modelo "IRR region" (.t-IRR-region), que não tem a classe
   .t-Region: nenhuma regra de cartão a alcançava e ela ficava sem borda, ao lado do
   cartão de Filtros. Aqui ganha o MESMO cartão; o .a-IRR de dentro perde a sombra e o
   raio de 10 px que a Skin dava a ele (senão seria cartão dentro de cartão). */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-contentInner .t-IRR-region:not(.t-Region .t-IRR-region) {
  background: #fff !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 16px !important;
  box-shadow: var(--nc-soft) !important;
  margin-bottom: 16px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* o separador padrão entre a barra de ferramentas e a tabela: o mesmo fio Névoa da borda do cartão */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-toolbar {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--nc-nevoa) !important;
  padding: 12px 16px 10px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controls,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlGroup {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-search {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-toolbar .a-Button,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-toolbar select,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-toolbar input[type="text"],
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-search-field {
  height: 36px !important;
  min-height: 36px !important;
  margin: 0 !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 8px !important;
  background-color: #fff !important;
  box-shadow: none !important;
  color: var(--nc-grafite) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-search-field {
  width: 260px !important;
  padding: 0 12px !important;
  font-weight: 500 !important;
  color: var(--nc-tinta) !important;
}

/* celular: o campo de busca fixo em 260 px empurrava a barra para 401 px num cartão de
   350 — a barra vazava a borda. Abaixo de 640 px o campo divide a linha com a lupa. */
@media (max-width: 640px) {
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-toolbar {
    width: auto !important;
    max-width: 100% !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-search {
    flex: 1 1 100% !important;
    min-width: 0 !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-searchFieldContainer {
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-search-field {
    width: 100% !important;
    min-width: 0 !important;
  }
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-search-field:focus {
  border-color: var(--nc-roxo) !important;
  box-shadow: var(--nc-anel) !important;
  outline: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-toolbar .a-Button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 0 12px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-toolbar .a-Button:hover {
  background-color: var(--nc-off) !important;
  color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-toolbar label,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-toolbar .a-IRR-rowSelector-label {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--nc-cinza) !important;
}

/* ---------- PAINEL DE FILTROS E DESTAQUES APLICADOS (a-IRR-controlsContainer) ----------
   "Situação eSocial (Aguardando) / (Liquidado)…": cada item eram quatro células flutuando
   com alturas diferentes (32 e 44 px) — o × de remover 6 px abaixo do resto, o checkbox em
   dobro (o <input> Roxo de 22 px + a caixa desenhada no label) e o ícone num quadrado
   laranja. Vira uma fileira de CHIPS: um bloco branco de 32 px com fio Névoa, e dentro,
   na mesma linha, a caixa (a do sistema, Rosa marcada), o ícone do tipo (destaque, filtro…)
   em Grafite, o nome — no destaque, na COR que o usuário escolheu, que é a informação — e
   o × discreto. Desmarcado, o chip esmaece. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  padding: 10px 16px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--nc-nevoa) !important;
  background: var(--nc-quase) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer > .a-MediaBlock-graphic {
  float: none !important;
  flex: none !important;
  margin: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer > .a-MediaBlock-content {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  overflow: visible !important;
}

/* o botão de recolher o painel */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-button--controls {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: none !important;
  color: var(--nc-grafite) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-button--controls:hover {
  border-color: rgba(81, 28, 118, .35) !important;
  color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer ul.a-IRR-controls {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-controls-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  height: 32px !important;
  margin: 0 !important;
  padding: 0 4px 0 8px !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: 0 1px 2px rgba(27, 18, 56, .04) !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-controls-cell {
  display: inline-flex !important;
  align-items: center !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

/* a caixa: a mesma dos checkboxes do sistema; o label (que desenhava a 2.ª caixa) fica só
   para o leitor de tela */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer input.a-IRR-controlsCheckbox {
  appearance: none !important;
  -webkit-appearance: none !important;
  position: static !important;
  flex: none !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1.5px solid #CBC1DC !important;
  border-radius: 5px !important;
  background-color: #fff !important;
  background-image: none !important;
  box-shadow: none !important;
  opacity: 1 !important;
  cursor: pointer !important;
  transition: background-color .15s, border-color .15s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer input.a-IRR-controlsCheckbox:hover {
  border-color: var(--nc-rosa) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer input.a-IRR-controlsCheckbox:checked {
  border-color: var(--nc-rosa) !important;
  background-color: var(--nc-rosa) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.3 2.3 4.7-5' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-position: center !important;
  background-size: 11px 11px !important;
  background-repeat: no-repeat !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer input.a-IRR-controlsCheckbox:focus-visible {
  outline: 2px solid var(--nc-roxo) !important;
  outline-offset: 2px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-controlsCheckboxLabel {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
  clip-path: inset(50%) !important;
  background: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-controlsCheckboxLabel::before,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-controlsCheckboxLabel::after {
  content: none !important;
  display: none !important;
}

/* o ícone do tipo (destaque, filtro, agrupamento…): sem o quadrado laranja */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-controls-cell .a-IRR-controlsIcon {
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  background-color: transparent !important;
  color: var(--nc-grafite) !important;
  font-size: 14px !important;
  line-height: 16px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-controls-cell:has(> .a-IRR-controlsIcon) {
  background: transparent !important;
}

/* o nome: no destaque, a cor escolhida pelo usuário continua (vem em linha no <a>) — só
   ganha forma de etiqueta; no filtro, texto Tinta */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-controlsLabel {
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  height: 22px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  border: 0 !important;
  border-radius: 6px !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  color: var(--nc-tinta) !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

/* celular: com "…" sumia justamente o que diferencia os itens ("Aguardando", "Liquidado"):
   lá o nome quebra em duas linhas e o chip cresce */
@media (max-width: 640px) {
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-controls-item {
    height: auto !important;
    min-height: 32px !important;
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-controls-cell--label .a-IRR-controlsLabel {
    height: auto !important;
    padding-top: 3px !important;
    padding-bottom: 3px !important;
    line-height: 1.3 !important;
    white-space: normal !important;
  }
}

/* área estreita no desktop (coluna pequena): o nome longo termina em "…" e o × continua no chip */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-controls-item {
  max-width: 100% !important;
  min-width: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-controls-cell--label {
  flex: 0 1 auto !important;
  min-width: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-controls-cell--label .a-IRR-controlsLabel {
  display: block !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  line-height: 22px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-controls-item:not(.a-IRR-controls-item--highlight) .a-IRR-controlsLabel {
  background: transparent !important;
  padding: 0 2px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-controlsLabel:hover {
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

/* desmarcado: o chip fica de lado, esmaecido */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-controls-item:has(input.a-IRR-controlsCheckbox:not(:checked)) .a-IRR-controlsLabel {
  opacity: .5 !important;
}

/* o × de remover */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-button--remove {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 24px !important;
  height: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--nc-cinza) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-button--remove:hover {
  background: var(--nc-nevoa2) !important;
  color: var(--nc-ruim) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-controlsContainer .a-IRR-button--remove .a-Icon {
  width: 12px !important;
  height: 12px !important;
  color: inherit !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-content,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-tableContainer,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-reportView {
  border: 0 !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-table {
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

/* a barra dos títulos das colunas: BRANCA, como a tabela. O Lavanda da rodada anterior
   pesava e brigava com o Roxo dos links. Quem separa o título dos dados é o fio de
   baixo, um tom mais forte que o das linhas; o nome da coluna em Grafite semibold.
   O Roxo fica para o que se clica: os links das células e a coluna ordenada. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-table th,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-table .a-IRR-header {
  background: #fff !important;
  border: 0 !important;
  border-bottom: 2px solid var(--nc-rosa) !important;   /* fio Rosa de 2 px entre os títulos das colunas e os dados */
  padding: 11px 12px 10px !important;
  text-align: left !important;
  vertical-align: bottom !important;
  white-space: nowrap !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-table th .a-IRR-headerLink,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-table th .a-IRR-headerLabel {
  display: inline !important;
  text-align: left !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  color: var(--nc-grafite) !important;
  text-decoration: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-table th .a-IRR-headerLink:hover {
  color: var(--nc-roxo) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

/* coluna ordenada: o nome em Roxo e a seta junto */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-table th.is-sorted .a-IRR-headerLink,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-table th .a-IRR-headerLink[aria-sort],
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-table th .a-IRR-sortIcon {
  color: var(--nc-roxo) !important;
}

/* uma linha por célula: o texto quebrava em 2–4 linhas nas colunas estreitas e cada
   linha passava de 90 px. Assim ficam ~40 px; quando a soma não cabe, a tabela rola
   na horizontal dentro do relatório (o tema já prevê a rolagem). */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-table td {
  white-space: nowrap !important;
  border: 0 !important;
  border-bottom: 1px solid var(--nc-nevoa2) !important;
  padding: 10px 12px !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
  vertical-align: middle !important;
  color: var(--nc-tinta) !important;
  font-variant-numeric: tabular-nums !important;
}

/* o fundo só onde a célula não traz cor própria (destaque de linha do IR, cor de coluna
   do relatório): com !important ele cobria as cores de status */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-table td:not([style*="background"]) {
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-table tr > :first-child {
  padding-left: 16px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-table tr > :last-child {
  padding-right: 16px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-table tr:hover td {
}

/* o fundo só onde a célula não traz cor própria (destaque de linha do IR, cor de coluna
   do relatório): com !important ele cobria as cores de status */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-table tr:hover td:not([style*="background"]) {
  background: var(--nc-quase) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-table td a {
  color: var(--nc-roxo) !important;
  font-weight: 600 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-pagination,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-paginationWrap {
  padding: 10px 16px !important;
  border: 0 !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-pagination .a-Button {
  border-radius: 8px !important;
  border: 1px solid var(--nc-nevoa) !important;
  background: #fff !important;
  color: var(--nc-roxo) !important;
}

/* ---------- 7b. Menus suspensos e o menu da coluna ------------------- */
/* O menu de "Ações" (e seus submenus, e todo .a-Menu do app: usuário, notificações, os
   menus da ficha do colaborador) vinha com fundo Roxo chapado; o menu que abre ao
   clicar no título de uma coluna vinha preto a 95 %, com botões-pílula lilás e um
   campo cinza. Os dois viram o mesmo cartão flutuante branco das regiões. */

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-content {
  background: #fff !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu {
  padding: 0 !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 12px !important;
  box-shadow: var(--nc-lift) !important;
  overflow: visible !important;                    /* os SUBMENUS ("Ações > Dados" da grade interativa) moram DENTRO
                                           do menu: com overflow hidden eles eram cortados e não abriam */
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
}

/* o canto arredondado fica por conta do conteúdo (raio 12 − 1 px da borda), já que o menu
   não recorta mais */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-content {
  padding: 6px !important;
  border: 0 !important;
  border-radius: 11px !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-content ul {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-item {
  background: transparent !important;
  border: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-item > .a-Menu-inner {
  display: flex !important;
  align-items: center !important;
  min-height: 34px !important;
  padding: 0 8px 0 2px !important;
  border-radius: 8px !important;
  background: transparent !important;
  transition: background-color .15s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-label,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-label a,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu a.a-Menu-label {
  padding: 0 8px 0 0 !important;
  background: transparent !important;
  border: 0 !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 34px !important;
  color: var(--nc-tinta) !important;
  text-decoration: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-statusCol {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  flex: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-statusCol .a-Icon,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-statusCol .fa {
  color: var(--nc-roxo) !important;
  opacity: .85 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-accelContainer,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-subMenuCol {
  color: var(--nc-cinza) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-item.is-focused > .a-Menu-inner,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-item.is-expanded > .a-Menu-inner,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-item:hover > .a-Menu-inner {
  background: var(--nc-nevoa2) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-item.is-focused .a-Menu-label,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-item.is-expanded .a-Menu-label,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-item:hover .a-Menu-label {
  color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-item.is-disabled .a-Menu-label {
  color: var(--nc-cinza) !important;
}

/* separador: o tema dava a ele a altura de um item (34 px) com o fio embaixo */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-itemSep {
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* O DIVISOR entre grupos do menu. Nos submenus da grade interativa ("Ações > Seleção") a
   Skin pinta o FUNDO do contêiner do divisor de Roxo (9 px de faixa escura), e o fio de
   verdade ficava com largura zero, porque o rótulo do divisor não se esticava. O
   contêiner fica transparente, o rótulo ocupa a linha e o fio é 1 px Névoa. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-itemSep > .a-Menu-inner,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-itemSep .a-Menu-labelContainer {
  display: flex !important;
  align-items: center !important;
  height: 9px !important;
  min-height: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-itemSep .a-Menu-labelContainer {
  flex: 1 1 auto !important;
  width: 100% !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-itemSep .a-Menu-statusCol,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-itemSep .a-Menu-accelContainer {
  display: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-hSeparator,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-Menu .a-Menu-itemSep .a-Menu-hSeparator {
  display: block !important;
  flex: 1 1 auto !important;
  height: 1px !important;
  min-height: 0 !important;
  max-height: 1px !important;
  margin: 0 6px !important;
  border: 0 !important;
  background: var(--nc-nevoa) !important;
}

/* o menu da coluna (Filial, Empresa…) */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget {
  min-width: 240px !important;
  padding: 0 !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: var(--nc-lift) !important;
  overflow: hidden !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget-actions {
  display: flex !important;
  gap: 4px !important;
  margin: 0 !important;
  padding: 8px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--nc-nevoa) !important;
  border-radius: 0 !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget-actions-item {
  margin: 0 !important;
  flex: 1 1 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 34px !important;
  padding: 0 !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--nc-grafite) !important;
  transition: background-color .15s, color .15s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget-button .a-Icon {
  margin: 0 !important;
  color: inherit !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget-button:focus {
  outline: none !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget-button:hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget-button:focus-visible {
  background: var(--nc-nevoa2) !important;
  color: var(--nc-roxo) !important;
  outline: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget-button.is-active {
  background: var(--nc-roxo) !important;
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget-search {
  position: relative !important;
  border: 0 !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget-searchField {
  width: 100% !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 12px 0 36px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--nc-nevoa) !important;
  border-radius: 0 !important;
  background-color: #fff !important;
  box-shadow: none !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 13px !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget-searchField::placeholder {
  color: var(--nc-cinza) !important;
  opacity: 1 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget-searchField:focus {
  outline: none !important;
  background-color: var(--nc-quase) !important;
  border-bottom-color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget-searchLabel,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget-searchLabel::before {
  color: var(--nc-cinza) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget-rows {
  max-height: 240px !important;
  overflow-y: auto !important;
  padding: 6px !important;
  background: #fff !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(81, 28, 118, .32) transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget-row {
  display: block !important;
  padding: 7px 10px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  color: var(--nc-tinta) !important;
  text-decoration: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget-row:hover,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget-row:focus,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget-row.is-active {
  background: var(--nc-nevoa2) !important;
  color: var(--nc-roxo) !important;
  outline: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-sortWidget-help {
  padding: 10px 12px !important;
  border-bottom: 1px solid var(--nc-nevoa) !important;
  background: var(--nc-quase) !important;
  font-size: 12.5px !important;
  color: var(--nc-grafite) !important;
}

/* ---------- 8. Modais ---------------------------------------------- */

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-widget-overlay {
  background: rgba(27, 18, 56, .42) !important;
  backdrop-filter: blur(3px) !important;
  opacity: 1 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog {
  border: 0 !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  background: #fff !important;
  box-shadow: var(--nc-lift), 0 0 0 1px rgba(27, 18, 56, .04) !important;
}

/* abaixo do título, em TODA modal: um fio de 3 px no Rosa da marca separa o título
   do conteúdo (a ficha original tinha esse fio, em Roxo) */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .ui-dialog-titlebar {
  padding: 18px 24px !important;
  background: #fff !important;
  border: 0 !important;
  border-bottom: 3px solid var(--nc-rosa) !important;
  border-radius: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .ui-dialog-title {
  font-size: 17px !important;
  font-weight: 800 !important;
  letter-spacing: -.02em !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .ui-dialog-titlebar-close {
  width: 36px !important;
  height: 36px !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .ui-dialog-titlebar-close:hover {
  background: var(--nc-off) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .ui-dialog-content {
  background: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog .ui-dialog-buttonpane {
  border-top: 1px solid var(--nc-nevoa) !important;
  background: var(--nc-quase) !important;
  padding: 12px 24px !important;
}

/* ---------- 8b. A página DENTRO da modal ----------------------------- */
/* A modal do APEX é outro documento (iframe) com body.t-Dialog-page — só passou a
   receber esta folha quando o prefixo @app ganhou o :is (ver gerar-app.mjs). Rodapé
   de botões num fio, sobre o Quase-branco, como a barra de botões de um diálogo. */

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Dialog {
  background: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Dialog-body {
  padding: 20px 24px 12px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Dialog-footer {
  border-top: 1px solid var(--nc-nevoa) !important;
  background: var(--nc-quase) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Dialog-footer .t-ButtonRegion {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Dialog-footer .t-ButtonRegion-wrap {
  padding: 4px 12px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Dialog-footer .t-ButtonRegion .t-Button:not(.t-Button--link):not(.t-Button--noUI) {
  height: 36px !important;
  padding: 0 14px !important;
  font-size: 13px !important;
  gap: 6px !important;
}

/* A FICHA DO COLABORADOR (página 13: foto, menu, dados). Tinha um bloco Roxo chapado
   de 456 px com a metade vazia, cada grupo de dados numa caixa cinza e quatro botões
   primários iguais. Vira uma ficha: foto e menu à esquerda; à direita o nome grande
   ao lado da foto e os dados em grupos separados por um fio, rótulo em Cinza e valor
   em Tinta. */

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #FOTO_ID {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #FOTO_ID .t-TabsRegion-items {
  display: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #FOTO_ID .t-Form-labelContainer {
  display: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #FOTO_ID .t-Form-fieldContainer,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #FOTO_ID .t-Form-inputContainer {
  padding: 0 !important;
  margin: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #FOTO_ID .t-Form-itemWrapper {
  display: flex !important;
  justify-content: flex-start !important;
  padding: 4px 4px 16px 8px !important;           /* folga para o anel e a sombra: o contêiner de fora corta (overflow hidden) */
}

/* círculo de verdade: a Skin força min-height 100 px, e com a largura em 88 a foto virava
   uma elipse de 88 × 100. As quatro medidas travadas no mesmo valor, e a foto recortada
   ao centro (object-fit), qualquer que seja a proporção do arquivo (vêm 200 × 252).
   O anel Roxo de 3 px é o da ficha original; a sombra por baixo o descola do fundo. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #FOTO_ID img.apex-item-image {
  width: 100px !important;
  height: 100px !important;
  min-width: 100px !important;
  min-height: 100px !important;
  max-width: 100px !important;
  max-height: 100px !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  object-position: center 30% !important;          /* retrato: o rosto fica no terço de cima */
  border: 0 !important;
  border-radius: 50% !important;
  box-shadow: 0 0 0 3px var(--nc-roxo), 0 12px 26px -12px rgba(81, 28, 118, .6) !important;
}

/* o menu da ficha: o bloco escuro da ficha original, mas com a MESMA pele do menu
   lateral do sistema — degradê Azul → Roxo, brilho Rosa no canto, texto branco, ícones
   em Rosa claro e o item aberto em vidro claro. Altura do conteúdo, cantos de 14 px. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB {
  height: auto !important;
  min-height: 0 !important;
  padding: 8px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background-color: var(--nc-azul) !important;
  background-image:
    radial-gradient(120% 60% at 100% 100%, rgba(201, 87, 136, .30), transparent 70%),
    linear-gradient(180deg, #2C1A63 0%, #511C76 100%) !important;
  box-shadow: 0 14px 30px -18px rgba(44, 26, 99, .75) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Region-bodyWrap,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Region-body {
  padding: 0 !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-NavigationBar {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-NavigationBar-item {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Button--navBar {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 8px 0 10px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(255, 255, 255, .86) !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-align: left !important;
  transition: background-color .15s, color .15s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Button--navBar .t-Icon {
  position: static !important;
  width: 18px !important;
  margin: 0 !important;
  flex: none !important;
  text-align: center !important;
  font-size: 14px !important;
  color: #E4A9C4 !important;                       /* o Rosa claro dos ícones do menu lateral */
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Button--navBar .t-Button-label {
  flex: 1 1 auto !important;
  padding: 0 !important;
  color: inherit !important;
  font: inherit !important;
  text-align: left !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Button--navBar .icon-down-arrow {
  flex: none !important;
  margin: 0 !important;
  font-size: 10px !important;
  color: rgba(255, 255, 255, .5) !important;
  transform: rotate(-90deg) !important;
  transition: transform .2s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Button--navBar .t-Button-badge:empty {
  display: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Button--navBar:hover {
  background: rgba(255, 255, 255, .08) !important;
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Button--navBar[aria-expanded="true"] {
  background: rgba(255, 255, 255, .14) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08) !important;
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Button--navBar:hover .t-Icon,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Button--navBar[aria-expanded="true"] .t-Icon {
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Button--navBar[aria-expanded="true"] .icon-down-arrow {
  transform: none !important;
  color: #fff !important;
}

/* o foco do tema (quadro Rosa nos pseudo-elementos) some; fica o anel claro */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Button--navBar::before,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Button--navBar::after {
  content: none !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Button--navBar:focus {
  outline: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Button--navBar:focus-visible {
  outline: 2px solid #E4A9C4 !important;
  outline-offset: -2px !important;
}

/* os dados: sem caixa, sem cartão */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #INFORMACOES {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #INFORMACOES .t-Region-body {
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #INFORMACOES .t-Form-labelContainer {
  display: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #INFORMACOES .t-Form-inputContainer {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  padding: 0 !important;
}

/* cada campo é o primeiro filho da própria coluna — o fio vai entre as LINHAS do grid */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #INFORMACOES .t-Form-fieldContainer {
  margin: 0 !important;
  padding: 12px 0 !important;
  border: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #INFORMACOES .row + .row .t-Form-fieldContainer {
  border-top: 1px solid var(--nc-nevoa) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #P13_TITULO_COLAB_CONTAINER {
  padding: 6px 0 12px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #INFORMACOES .apex-item-display-only {
  display: block !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #P13_TITULO_COLAB h3 {
  margin: 0 !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  letter-spacing: -.02em !important;
  line-height: 1.2 !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #INFORMACOES .apex-item-display-only table {
  border-collapse: collapse !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #INFORMACOES .apex-item-display-only td {
  padding: 3px 0 !important;
  border: 0 !important;
  vertical-align: baseline !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #INFORMACOES .apex-item-display-only td:first-child {
  width: 136px !important;
  padding-right: 12px !important;
  font-weight: 500 !important;
  color: var(--nc-cinza) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #INFORMACOES .apex-item-display-only td b {
  font-weight: 600 !important;
  color: var(--nc-tinta) !important;
}

/* o nome sobe para a altura da foto: com a coluna da foto só de um lado, o topo direito
   ficava vazio e o nome começava 130 px abaixo. Só com as colunas lado a lado. */
@media (min-width: 640px) {
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2):has(#FOTO_ID) .row > .col:has(> #INFORMACOES) {
    margin-top: -128px !important;               /* a linha da foto mede 142 px: o nome alinha com o topo dela */
  }
}

/* A coluna direita da ficha troca de região pelos botões do rodapé (Feedback,
   Informações…): quem aparece no lugar dos dados começa no topo, sem a margem extra
   da classe margin-top-md, e com o mesmo tratamento sem caixa. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .col:has(> #INFORMACOES) > .t-Region {
  margin-top: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .col:has(> #INFORMACOES) > .t-Region > .t-Region-bodyWrap > .t-Region-body {
  padding: 0 !important;
}

/* os números do topo do Feedback ("Feedbacks 1", "Média ★★★★★"): valor solto, grande,
   não uma caixa de campo cinza */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .col:has(> #INFORMACOES) .apex-item-wrapper--display-only .apex-item-display-only {
  display: inline-block !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  color: var(--nc-tinta) !important;
  font-variant-numeric: tabular-nums !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .col:has(> #INFORMACOES) > .t-Region:not(#INFORMACOES) .t-Form-fieldContainer {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .col:has(> #INFORMACOES) > .t-Region:not(#INFORMACOES) .t-Form-labelContainer,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .col:has(> #INFORMACOES) > .t-Region:not(#INFORMACOES) .t-Form-inputContainer {
  width: auto !important;
  max-width: none !important;
  flex: none !important;
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .col:has(> #INFORMACOES) > .t-Region:not(#INFORMACOES) .t-Form-labelContainer {
  display: flex !important;
  align-items: center !important;
  height: auto !important;
}

/* o tema dá 12 px de recuo em cima ao rótulo de campo "xlarge": ele descia abaixo do valor */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .col:has(> #INFORMACOES) > .t-Region:not(#INFORMACOES) .t-Form-label {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  color: var(--nc-cinza) !important;
}

/* a linha dos números fica separada dos comentários por um fio */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .col:has(> #INFORMACOES) > .t-Region:not(#INFORMACOES) > .t-Region-bodyWrap > .t-Region-body > .container:first-child {
  margin: 0 0 16px !important;
  padding: 2px 0 2px !important;
  border-bottom: 1px solid var(--nc-nevoa) !important;
}

/* ---- Comentários (modelo "Comments" do tema) ----
   O tema pinta autor e texto em duas caixas cinza coladas, com cantos de 2 px. Viram um
   balão só — fundo Quase-branco, fio Névoa, cantos de 12 px — com o avatar no mesmo
   quadrado dos ícones (fundo de Alertas), o autor em Tinta e a data em Cinza. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Comments {
  margin: 0 !important;
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Comments .t-Comments-item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Comments .t-Comments-icon {
  flex: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Comments .t-Comments-userIcon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  border: 0 !important;
  border-radius: 50% !important;
  background-color: transparent !important;
  background-image: var(--nc-icone-fundo) !important;
  background-blend-mode: screen !important;
  box-shadow: 0 8px 16px -10px rgba(201, 87, 136, .7) !important;
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Comments .t-Comments-userIcon .fa {
  font-size: 15px !important;
  line-height: 1 !important;
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Comments .t-Comments-body {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 4px 12px 12px 12px !important;    /* a ponta de cima, junto do avatar, quase reta: o balão "sai" dele */
  background: var(--nc-quase) !important;
  overflow: hidden !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Comments .t-Comments-body::before,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Comments .t-Comments-body::after {
  content: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Comments .t-Comments-info {
  padding: 12px 14px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Comments .t-Comments-info small,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Comments .t-Comments-date {
  font-size: 11.5px !important;
  font-weight: 500 !important;
  letter-spacing: .01em !important;
  color: var(--nc-cinza) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Comments .t-Comments-actions {
  margin-left: 6px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Comments .t-Comments-actions a {
  font-size: 12px !important;
  font-weight: 700 !important;
  color: var(--nc-roxo) !important;
  text-decoration: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Comments .t-Comments-actions a:hover {
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Comments .t-Comments-comment {
  padding: 8px 14px 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  font-size: 13.5px !important;
  line-height: 1.6 !important;
  color: var(--nc-grafite) !important;
  overflow-wrap: anywhere !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Comments .t-Comments-comment b {
  display: inline-block !important;
  margin-bottom: 2px !important;
  font-weight: 700 !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Comments .a-StarRating {
  margin-top: 6px !important;
}

/* celular: as duas colunas ficavam lado a lado e o menu, com ~70 px, mostrava só os
   ícones. Abaixo de 640 px cada coluna ocupa a linha, e o menu vira uma faixa de
   atalhos que rola na horizontal, acima dos dados. */
@media (max-width: 639px) {
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .row:has(> .col > #LISTA_COLAB) {
    flex-wrap: wrap !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .row:has(> .col > #LISTA_COLAB) > .col {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  /* a coluna dos dados (ou do Feedback) desce 16 px do bloco do menu */
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .row > .col:has(> #INFORMACOES) {
    margin-top: 16px !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #FOTO_ID .t-Form-itemWrapper {
    justify-content: center !important;
    padding-left: 0 !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB,
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Region-bodyWrap,
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Region-body {
    width: 100% !important;
    max-width: 100% !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-NavigationBar {
    width: 100% !important;
    max-width: none !important;                   /* a Skin limita a barra a 220 px: a faixa era cortada */
    flex-direction: row !important;
    gap: 6px !important;
    overflow-x: auto !important;
    padding: 0 !important;
    scrollbar-width: none !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-NavigationBar-item {
    width: auto !important;
    flex: none !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Button--navBar {
    width: auto !important;
    height: 34px !important;
    padding: 0 12px !important;
    border: 1px solid rgba(255, 255, 255, .18) !important;
    border-radius: 999px !important;
  }

  /* o tema esconde o texto dos botões da barra em tela pequena: aqui ele é o atalho */
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Button--navBar .t-Button-label {
    display: inline !important;
    overflow: visible !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #LISTA_COLAB .t-Button--navBar .icon-down-arrow {
    transform: none !important;
  }
}

/* ---------- 8b'. apex.message.alert / apex.message.confirm ------------------------ */
/* A caixa de aviso e de confirmação do próprio APEX (a ação "Confirm" das Dynamic
   Actions também usa esta). Vinha como uma modal comum com a barra de título VAZIA — só
   o fio Rosa e o X —, texto de 12 px no canto e os botões espremidos. Fica no mesmo
   desenho do Alertify: sem barra de título, ícone do tipo no quadrado da marca, texto
   centrado em Tinta, botões do sistema. O X continua, discreto, no canto. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog.ui-dialog--notification {
  min-width: min(400px, calc(100vw - 32px)) !important;
  border-radius: 16px !important;
}

/* celular: o jQuery UI centra pela largura em linha e a caixa encostava nas bordas */
@media (max-width: 480px) {
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog.ui-dialog--notification {
    left: 16px !important;
    right: 16px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
  }
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog.ui-dialog--notification .ui-dialog-titlebar {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  left: auto !important;
  z-index: 1 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog.ui-dialog--notification .ui-dialog-title {
  display: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog.ui-dialog--notification .ui-dialog-titlebar-close {
  position: static !important;
  width: 32px !important;
  height: 32px !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--nc-cinza) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog.ui-dialog--notification .ui-dialog-titlebar-close:hover {
  background: var(--nc-nevoa2) !important;
  color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog.ui-dialog--notification .ui-dialog-content {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  height: auto !important;                          /* o jQuery UI grava a altura em linha (20 px) */
  min-height: 0 !important;
  padding: 30px 28px 4px !important;
  text-align: center !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
  color: var(--nc-tinta) !important;
}

/* o ícone: "!" no aviso (um botão), "?" na confirmação (dois botões) */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog.ui-dialog--notification .ui-dialog-content::before {
  content: "\f12a" !important;                     /* fa-exclamation */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: none !important;
  width: 44px !important;
  height: 44px !important;
  margin: 0 0 14px !important;
  border-radius: 12px !important;
  background-image: var(--nc-icone-fundo) !important;
  background-blend-mode: screen !important;
  box-shadow: 0 10px 22px -12px rgba(201, 87, 136, .8) !important;
  font-family: "Font APEX Small", "Font APEX" !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog.ui-dialog--notification:has(.ui-dialog-buttonset > button:nth-child(2)) .ui-dialog-content::before {
  content: "\f128" !important;                     /* fa-question */
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog.ui-dialog--notification .ui-dialog-content p {
  margin: 0 !important;
  text-wrap: pretty !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog.ui-dialog--notification .ui-dialog-buttonpane {
  margin: 0 !important;
  padding: 16px 24px 22px !important;
  border: 0 !important;
  background: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog.ui-dialog--notification .ui-dialog-buttonset {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 8px !important;
  float: none !important;
  width: 100% !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog.ui-dialog--notification .ui-dialog-buttonset > button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 104px !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 20px !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: none !important;
  text-shadow: none !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--nc-roxo) !important;
  transition: background-color .2s, border-color .2s, box-shadow .2s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog.ui-dialog--notification .ui-dialog-buttonset > button:hover {
  border-color: rgba(81, 28, 118, .4) !important;
  background: var(--nc-off) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog.ui-dialog--notification .ui-dialog-buttonset > button.ui-button--hot {
  border-color: var(--nc-roxo) !important;
  background: var(--nc-roxo) !important;
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog.ui-dialog--notification .ui-dialog-buttonset > button.ui-button--hot:hover {
  border-color: var(--nc-azul) !important;
  background: var(--nc-azul) !important;
  box-shadow: 0 12px 24px -12px rgba(81, 28, 118, .6) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .ui-dialog.ui-dialog--notification .ui-dialog-buttonset > button:focus-visible {
  outline: none !important;
  box-shadow: var(--nc-anel) !important;
}

/* ---------- 8c. Alertify (alert, confirm, prompt e as notificações log) ---------- */
/* O plugin vinha com o tema "default" dele: caixa com borda preta de 10 px, botão verde com
   degradê e brilho azul no foco, fonte sans-serif genérica e uma entrada que "quicava"
   150 px. Vira um diálogo da família das modais da Natcorp: véu Tinta desfocado, cartão
   branco de cantos 16, o ícone do tipo no quadrado da marca, texto em Tinta e os botões
   do sistema (principal Roxo, secundário claro). As notificações (log) viram cartões
   escuros no canto. */

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify-cover.alertify-cover {
  background: rgba(27, 18, 56, .42) !important;
  backdrop-filter: blur(3px) !important;
  opacity: 1 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify.alertify {
  top: 16vh !important;
  left: 0 !important;
  right: 0 !important;
  width: min(440px, calc(100vw - 32px)) !important;
  margin: 0 auto !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: var(--nc-lift), 0 0 0 1px rgba(27, 18, 56, .04) !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  color: var(--nc-tinta) !important;
  transition: opacity .22s ease, transform .32s cubic-bezier(.22, 1, .36, 1) !important;
}

/* estado escondido: um deslize curto no lugar dos 150 px com quique */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify.alertify-hidden {
  transform: translateY(-12px) !important;
  opacity: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify .alertify-dialog {
  padding: 28px 24px 20px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify .alertify-inner {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
}

/* o ícone do tipo: alerta (!), confirmação (?) e pergunta (lápis) — glifos da Font APEX */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify .alertify-inner::before {
  content: "\f12a" !important;                     /* fa-exclamation */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px !important;
  height: 44px !important;
  margin: 0 0 14px !important;
  border-radius: 12px !important;
  background-image: var(--nc-icone-fundo) !important;
  background-blend-mode: screen !important;
  box-shadow: 0 10px 22px -12px rgba(201, 87, 136, .8) !important;
  font-family: "Font APEX Small", "Font APEX" !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify.alertify-confirm .alertify-inner::before {
  content: "\f128" !important;                     /* fa-question */
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify.alertify-prompt .alertify-inner::before {
  content: "\f040" !important;                     /* fa-pencil */
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify .alertify-message {
  margin: 0 0 20px !important;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
  color: var(--nc-tinta) !important;
  text-wrap: pretty !important;
}

/* prompt: o campo de texto como os campos do sistema */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify .alertify-text {
  height: 40px !important;
  margin: 0 0 18px !important;
  padding: 0 12px !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: none !important;
  font-family: inherit !important;
  font-size: 14px !important;
  color: var(--nc-tinta) !important;
  text-align: left !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify .alertify-text:focus {
  border-color: var(--nc-roxo) !important;
  box-shadow: var(--nc-anel) !important;
  outline: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify .alertify-buttons {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 100% !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify .alertify-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 104px !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 20px !important;
  border-radius: 8px !important;
  background-image: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  transition: background-color .2s, border-color .2s, box-shadow .2s !important;
}

/* confirmar / OK: o botão principal */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify .alertify-button-ok,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify .alertify-button-ok:focus {
  border: 1px solid var(--nc-roxo) !important;
  background-color: var(--nc-roxo) !important;
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify .alertify-button-ok:hover {
  border-color: var(--nc-azul) !important;
  background-color: var(--nc-azul) !important;
  box-shadow: 0 12px 24px -12px rgba(81, 28, 118, .6) !important;
}

/* cancelar: o secundário (era vermelho vivo) */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify .alertify-button-cancel,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify .alertify-button-cancel:focus {
  border: 1px solid var(--nc-nevoa) !important;
  background-color: #fff !important;
  color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify .alertify-button-cancel:hover {
  border-color: rgba(81, 28, 118, .4) !important;
  background-color: var(--nc-off) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify .alertify-button:focus-visible {
  outline: none !important;
  box-shadow: var(--nc-anel) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify .alertify-button:active {
  position: static !important;
  box-shadow: none !important;
}

/* as notificações rápidas (alertify.log / success / error) */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .alertify-logs {
  z-index: 100000 !important;                      /* acima do véu dos diálogos (99999): não ficam desfocadas por trás dele */
  right: 16px !important;
  bottom: 96px !important;                         /* acima do botão flutuante da NATI, no mesmo canto */
  width: min(340px, calc(100vw - 32px)) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .alertify-log {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  padding: 14px 16px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: rgba(27, 18, 56, .94) !important;
  box-shadow: 0 16px 32px -16px rgba(27, 18, 56, .6) !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  color: #fff !important;
  text-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .alertify-log::before {
  content: "\f129" !important;                     /* fa-info */
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: none !important;
  width: 22px !important;
  height: 22px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, .14) !important;
  font-family: "Font APEX Small", "Font APEX" !important;
  font-size: 11px !important;
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .alertify-log-success {
  background: rgba(44, 26, 99, .96) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .alertify-log-success::before {
  content: "\f00c" !important;                     /* fa-check */
  background: var(--nc-rosa) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .alertify-log-error {
  background: rgba(184, 50, 63, .96) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .alertify-log-error::before {
  content: "\f12a" !important;                     /* fa-exclamation */
  background: rgba(255, 255, 255, .22) !important;
}

@media (prefers-reduced-motion: reduce) {
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #alertify.alertify,
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .alertify-log {
    transition: none !important;
  }
}

/* ---------- 9. Componentes do Universal Theme ---------------------- */
/* São padrão do tema: redesenhá-los aqui vale para toda tela que os usa. */

/* complemento do título (ex.: "(26 de Setembro)"): vira chip, como os do site */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region-title small {
  display: inline-flex !important;
  align-items: center !important;
  height: 24px !important;
  margin-left: 4px !important;
  padding: 0 10px !important;
  border-radius: 999px !important;
  background: var(--nc-off) !important;
  color: var(--nc-grafite) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: normal !important;
}

/* t-Cards (atalhos da Home): cartão compacto; o ícone sai do canto encavalado
   e vira o ladrilho em degradê que o site usa ao lado dos títulos */
/* Um fio só e sombra leve. Eram DUAS bordas de 1 px (o fio Névoa do cartão + a borda
   cinza que o tema dá ao .t-Card-wrap por dentro), que liam como uma linha de 2 px, e a
   sombra das regiões, que num cartão de 70 px de altura pesava. Agora: o fio padrão, a
   sombra de contato (1 px), e a sombra grande só no hover — o cartão é um link. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Cards .t-Card {
  background: #fff !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 14px !important;
  box-shadow: 0 1px 2px rgba(27, 18, 56, .05) !important;
  transition: box-shadow .3s cubic-bezier(.22, 1, .36, 1), border-color .3s, transform .3s cubic-bezier(.22, 1, .36, 1) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Cards .t-Card:hover {
  border-color: rgba(81, 28, 118, .28) !important;
  box-shadow: 0 10px 24px -14px rgba(81, 28, 118, .45) !important;
  transform: translateY(-1px) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Cards .t-Card .t-Card-wrap {
  border: 0 !important;                            /* a 2.ª borda: a do tema, cinza, por dentro do fio do cartão */
  box-shadow: none !important;
  background: transparent !important;              /* tinha fundo branco e raio 2: cobria os cantos */
  border-radius: inherit !important;
  display: flex !important;
  flex-direction: row !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 14px 16px !important;
  min-height: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Cards .t-Card .t-Card-icon {
  position: static !important;
  flex: none !important;
  width: 38px !important;
  height: 38px !important;
  margin: 0 !important;
  border-radius: 10px !important;
}

/* o ícone ocupa o quadrado inteiro, mas o glifo (::before, 16 px) segue o alinhamento
   do texto — e o tema alinha ao início: o cubo da lista ficava 8 px à esquerda do
   centro. Flex centraliza o glifo nos dois eixos, qualquer que seja a largura dele. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Cards .t-Card .t-Card-icon .t-Icon,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-icon .t-Icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Cards .t-Card .t-Card-icon .t-Icon::before,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-icon .t-Icon::before {
  margin: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Cards .t-Card .t-Card-icon .t-Icon {
  width: 38px !important;
  height: 38px !important;
  line-height: 38px !important;
  font-size: 16px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Cards .t-Card .t-Card-titleWrap {
  padding: 0 !important;
  flex: 1 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Cards .t-Card .t-Card-title {
  white-space: normal !important;                  /* o tema cortava com reticências ("[6] Al…") */
  overflow: visible !important;
  text-overflow: clip !important;
  margin: 0 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--nc-tinta) !important;
}

/* o corpo tem filhos vazios (não conta como :empty) e roubava a largura do título */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Cards .t-Card .t-Card-body:not(:has(.t-Card-desc:not(:empty), .t-Card-info:not(:empty))),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Cards .t-Card .t-Card-colorFill {
  display: none !important;
}

/* t-MediaList (Aplicações mais acessadas): sem grade dura; cada item vira o
   ladrilho interno do site — fundo quase-branco, raio 12, ícone em degradê */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-item {
  border: 0 !important;
  padding: 5px !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-itemWrap {
  display: flex !important;
  align-items: center !important;                  /* ícone centralizado com o título de duas linhas */
  gap: 12px !important;
  height: 100% !important;
  padding: 12px 14px !important;
  border: 1px solid #ECEAF1 !important;
  border-radius: 12px !important;
  background: #FBFBFC !important;                  /* quase branco NEUTRO: separa do fundo branco da região sem puxar para o Lavanda/Rosa */
  transition: background-color .25s, border-color .25s, box-shadow .25s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-itemWrap:hover {
  background: #fff !important;
  border-color: rgba(81, 28, 118, .22) !important;
  box-shadow: 0 8px 20px -14px rgba(27, 18, 56, .35) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-iconWrap {
  flex: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-body {
  padding: 0 !important;
  margin: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-icon {
  width: 36px !important;
  height: 36px !important;
  border-radius: 10px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-icon .t-Icon {
  font-size: 16px !important;
  line-height: 36px !important;
  width: 36px !important;
  height: 36px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-desc {
  color: var(--nc-cinza) !important;
}

/* t-BadgeList (Aniversários, contadores): os cartões de número do site —
   valor 30/800 em Tinta, algarismos tabulares, rótulo pequeno em Cinza */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-BadgeList {
  border: 0 !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-BadgeList .t-BadgeList-item {
  border: 0 !important;
  padding: 5px !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-BadgeList .t-BadgeList-wrap {
  height: 100% !important;
  padding: 18px 16px !important;
  border: 1px solid var(--nc-nevoa2) !important;
  border-radius: 12px !important;
  background: var(--nc-quase) !important;
  transition: background-color .25s, border-color .25s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-BadgeList a.t-BadgeList-wrap:hover {
  background: var(--nc-off) !important;
  border-color: rgba(81, 28, 118, .25) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-BadgeList .t-BadgeList-value {
  font-size: 30px !important;
  font-weight: 800 !important;
  letter-spacing: -.02em !important;
  font-variant-numeric: tabular-nums !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-BadgeList .t-BadgeList-label {
  margin-top: 4px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: var(--nc-cinza) !important;
}

/* ---------- 10. Coluna lateral da página (filtros) ------------------ */
/* A coluna era branca, com sombra, e o cartão de filtros ocupava os 240 px
   inteiros, colado ao menu: os cantos da esquerda pareciam retos. Agora a
   coluna é o fundo da tela e o cartão flutua com margem, como os outros. */

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-side {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  padding: 16px 0 16px 12px !important;
}

/* A coluna lateral é FIXA (rolagem própria) e o tema reserva 240 px para ela; o conteúdo
   começa com 20 px de folga vazia. A coluna ganha 8 px sobre essa folga: o cartão de
   filtros vai de 12 px do menu a 12 px do relatório (236 px de largura, eram 222) e o
   relatório não sai do lugar nem perde largura. Só com a coluna ao lado do conteúdo. */
@media (min-width: 640px) {
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2).t-PageBody--showLeft .t-Body-side {
    width: 248px !important;
  }
}

/* celular: a coluna ocupa a largura toda, acima do conteúdo — recuo igual dos dois lados */
@media (max-width: 639px) {
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-side {
    padding-right: 12px !important;
  }
}

/* dentro da coluna estreita, o cartão respira menos — senão o seletor cortava o texto */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-side .t-Region:not(.t-Region--noUI) > .t-Region-header {
  padding: 12px 12px 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-side .t-Region:not(.t-Region--noUI) > .t-Region-bodyWrap > .t-Region-body {
  padding: 6px 12px 12px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-side > .t-Region {
  margin: 0 0 16px !important;
}

/* região SEM cabeçalho na coluna (os "Parâmetros" de uma pesquisa): o mesmo cartão das
   outras — a regra de cartão das sem cabeçalho só olhava o conteúdo principal, e esta
   ficava só com o fio esquerdo que a Skin põe */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-side > .t-Region.t-Region--removeHeader:not(.t-Region--noUI):not(.t-Region--noBorder) {
  background: #fff !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 16px !important;
  box-shadow: var(--nc-soft) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-side > .t-Region.t-Region--removeHeader:not(.t-Region--noUI) > .t-Region-bodyWrap > .t-Region-body {
  padding: 12px 12px 12px !important;
}

/* e as regiões DENTRO dele (as recolhíveis "Requisições", "Status"): seção plana com
   fio em cima, como dentro dos outros cartões — não cartão dentro de cartão */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-side > .t-Region--removeHeader .t-Region.t-Region:not(.t-Region--noUI):not(.t-Region--removeHeader) {
  margin: 8px 0 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--nc-nevoa) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-side > .t-Region--removeHeader .t-Region.t-Region:not(.t-Region--noUI) > .t-Region-header {
  padding: 10px 0 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-side > .t-Region--removeHeader .t-Region.t-Region:not(.t-Region--noUI) > .t-Region-header .t-Region-title {
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: -.01em !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Body-side > .t-Region--removeHeader .t-Region.t-Region:not(.t-Region--noUI) > .t-Region-bodyWrap > .t-Region-body {
  padding: 6px 0 2px !important;
}

/* ---------- 10b. Grade interativa (Interactive Grid, .a-IG) -------------------------
   O MESMO desenho do relatório interativo (seção acima), peça por peça:
   · a grade perde a moldura própria (borda, cantos de 10 px e sombra da Skin): o cartão
     é a REGIÃO, como no IR — e o corpo da região perde o respiro, para a barra e a
     tabela irem de borda a borda;
   · barra de ferramentas com os controles de 36 px e cantos de 8 (a Skin fazia pílulas),
     busca de 260 px, fio Névoa embaixo;
   · títulos das colunas em Grafite semibold sobre branco e o fio Rosa de 2 px;
   · fio Névoa em cima da barra dos títulos e divisores verticais entre as colunas (a
     grade é para editar célula a célula: aqui a coluna precisa aparecer — no IR, não);
   · linhas com fio Névoa claro, 13 px; seleção em Lavanda com a caixa
     Rosa (a do resto do sistema);
   · a célula em edição com o anel Roxo no lugar do azul. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:has(.a-IG) > .t-Region-bodyWrap > .t-Region-body {
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* o contêiner da barra dava 8 px de respiro e um fio próprio: a barra ficava numa moldura
   recuada, com o fio de baixo 8 px mais curto que o cartão */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-IG-header {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-Toolbar {
  padding: 12px 16px 10px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--nc-nevoa) !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-Toolbar-group,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-Toolbar-groupContainer {
  gap: 6px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-Toolbar .a-Button,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-Toolbar .a-Toolbar-selectList,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-Toolbar .a-Toolbar-inputText {
  height: 36px !important;
  min-height: 36px !important;
  margin: 0 !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 8px !important;
  background-color: #fff !important;
  box-shadow: none !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--nc-grafite) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-Toolbar .a-Button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 0 12px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-Toolbar .a-Button:not(:disabled):hover {
  background-color: var(--nc-off) !important;
  border-color: rgba(81, 28, 118, .35) !important;
  color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-Toolbar .a-Button.a-Button--hot {
  border-color: var(--nc-roxo) !important;
  background: var(--nc-roxo) !important;
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-Toolbar .a-Button.a-Button--hot:not(:disabled):hover {
  border-color: var(--nc-roxo-hover) !important;
  background: var(--nc-roxo-hover) !important;
  color: #fff !important;
  box-shadow: 0 10px 22px -12px rgba(81, 28, 118, .6) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-Toolbar .a-Button:disabled {
  opacity: .5 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-Toolbar .a-Button .a-Icon {
  color: inherit !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-Toolbar .a-Toolbar-inputText {
  width: 260px !important;
  padding: 0 12px !important;
  font-weight: 500 !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-Toolbar .a-Toolbar-inputText::placeholder {
  color: var(--nc-cinza) !important;
  opacity: 1 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-Toolbar .a-Toolbar-inputText:focus {
  border-color: var(--nc-roxo) !important;
  box-shadow: var(--nc-anel) !important;
  outline: none !important;
}

/* celular: a busca (lupa + campo + Ir) ficava em três linhas e o "Redefinir" saía do
   cartão. A barra quebra por grupos; a busca ocupa a primeira linha inteira. */
@media (max-width: 640px) {
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-Toolbar {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-Toolbar-groupContainer {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    max-width: 100% !important;
    margin: 0 !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-Toolbar-groupContainer--start {
    flex: 1 1 100% !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-Toolbar-group--together {
    display: flex !important;
    flex-wrap: nowrap !important;
    flex: 1 1 100% !important;
    min-width: 0 !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-Toolbar .a-Toolbar-inputText {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
  }
}

/* títulos das colunas */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-hdr,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-hdr .a-GV-table {
  background: #fff !important;
}

/* ALTURAS FIXAS (título 42, linha 40): a grade é feita de DUAS tabelas lado a lado — a
   coluna fixa (seleção + ações) e o resto — e o tema não iguala as linhas depois do CSS.
   Com o botão de ações (36 px) mais o respiro, a coluna fixa ficava 10 px mais alta por
   linha e, na 12ª, 120 px fora do lugar. Altura explícita nas duas = linhas casadas. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-header {
  height: 42px !important;
  padding: 0 12px 10px !important;
  border: 0 !important;
  border-top: 1px solid var(--nc-nevoa) !important;     /* fio de cima da barra dos títulos */
  border-left: 1px solid var(--nc-nevoa) !important;    /* divisor entre colunas, no título… */
  border-bottom: 2px solid var(--nc-rosa) !important;
  background: #fff !important;
  vertical-align: bottom !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-header .a-GV-headerLabel {
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  color: var(--nc-grafite) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-header.is-sorted .a-GV-headerLabel,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-header:hover .a-GV-headerLabel {
  color: var(--nc-roxo) !important;
}

/* linhas */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-cell {
  height: 40px !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-left: 1px solid var(--nc-nevoa2) !important;   /* …e nos registros, um tom mais claro */
  border-bottom: 1px solid var(--nc-nevoa2) !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
  color: var(--nc-tinta) !important;
  font-variant-numeric: tabular-nums !important;
}

/* o fundo só onde a célula não traz cor própria (destaque de linha do IR, cor de coluna
   do relatório): com !important ele cobria as cores de status */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-cell:not([style*="background"]) {
  background: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-row:hover > .a-GV-cell {
  background: var(--nc-quase) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-row.is-selected > .a-GV-cell {
  background: #F7F3FB !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-row > :first-child {
  border-left: 0 !important;
}

/* coluna fixa: caixa e botão centrados, sem o respiro das colunas de dados (o recuo de
   12 px cortava a caixa de 18 px na coluna de 34 com "…") */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-w-frozen :is(.a-GV-cell, .a-GV-header) {
  padding-left: 4px !important;
  padding-right: 4px !important;
  text-align: center !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-w-frozen .a-GV-cell {
  text-overflow: clip !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV .a-Button--actions {
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 4px !important;
}

/* a coluna fixa da seleção e das ações: separada do resto por um fio, não por 3 px cinza
   (a barra cinza é a borda da própria tabela das caixas, .a-GV-table--checkbox) */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-w-frozen {
  border-right: 1px solid var(--nc-nevoa) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-table--checkbox {
  border-right: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-cell a {
  color: var(--nc-roxo) !important;
  font-weight: 600 !important;
}

/* célula ativa / em edição: o anel Roxo no lugar do azul do tema */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-cell.is-focused,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-cell:focus {
  outline: none !important;
  box-shadow: inset 0 0 0 2px var(--nc-roxo) !important;
}

/* O EDITOR da célula (linha nova, "Editar"): o APEX põe o campo dentro da célula ativa
   (.a-GV-columnItem). Ele pegava a regra geral dos campos — borda Roxa, cantos de 8 px,
   10 px de recuo — e ainda o recuo de 12 px da célula: virava uma caixa arredondada
   dentro do anel da célula. Como no padrão da grade, o campo OCUPA a célula, sem moldura
   própria; quem marca a edição é só o anel Roxo da célula. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-cell:has(> .a-GV-columnItem) {
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-columnItem {
  height: 100% !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-columnItem :is(input, select, textarea):not([type="checkbox"]):not([type="radio"]),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-columnItem :is(input, select, textarea).apex-item-text {
  width: 100% !important;
  height: 38px !important;                         /* 39 somava 1 px à linha e ela descolava da coluna fixa */
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 13px !important;
  color: var(--nc-tinta) !important;
  outline: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-columnItem :is(input, select, textarea):focus {
  border: 0 !important;
  box-shadow: none !important;
}

/* botões presos ao editor (calendário, lista popup): sem a moldura, colados à direita */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-columnItem :is(.ui-datepicker-trigger, .a-Button--popupLOV, .a-Button--calendar) {
  height: 38px !important;
  border: 0 !important;
  border-left: 1px solid var(--nc-nevoa2) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* coluna obrigatória: o triângulo do canto do título no vermelho da marca */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-header.is-required::before {
  border-top-color: var(--nc-ruim) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-cell.is-changed {
  background-image: linear-gradient(135deg, var(--nc-rosa) 0 6px, transparent 6px) !important;
}

/* botão de ações da linha (≡) */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV .a-Button--actions {
  color: var(--nc-grafite) !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV .a-Button--actions:hover {
  color: var(--nc-roxo) !important;
}

/* a caixa de seleção da linha: a mesma dos checkboxes do sistema (18 px, Rosa marcada) */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .u-selector {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 18px !important;
  height: 18px !important;
  border: 1.5px solid #CFC5E2 !important;
  border-radius: 5px !important;
  background: #fff !important;
  box-shadow: none !important;
  transition: background-color .15s, border-color .15s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .u-selector:hover {
  border-color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG :is(.is-selected .u-selector, .u-selector[aria-checked="true"]) {
  border-color: var(--nc-rosa) !important;
  background: var(--nc-rosa) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG :is(.is-selected .u-selector, .u-selector[aria-checked="true"])::before {
  color: #fff !important;
}

/* rodapé ("1 linhas selecionadas · 12 Total") */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IG .a-GV-footer {
  padding: 10px 16px !important;
  border: 0 !important;
  border-top: 1px solid var(--nc-nevoa) !important;
  background: transparent !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  color: var(--nc-grafite) !important;
}

/* ---------- 11. Relatório clássico (t-Report) ---------------------- */
/* O desenho da tabela interativa (seção do IR): títulos das colunas em Grafite semibold
   sobre branco, linhas com fio Névoa claro, sem grade vertical nem zebra. O fio Rosa de
   2 px entre títulos e dados é SÓ do IR (decisão do cliente): aqui o divisor é o fio
   Névoa de 1 px. O alinhamento de cada título continua o
   que foi definido na coluna (o APEX grava align="…" no th). */

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-tableWrap {
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  background: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-report {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  width: 100% !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-report th,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-colHead {
  background: #fff !important;
  border: 0 !important;
  border-bottom: 1px solid var(--nc-nevoa) !important;
  padding: 11px 12px 10px !important;
  vertical-align: bottom !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  color: var(--nc-grafite) !important;
}

/* "centro" é o PADRÃO do APEX para o título da coluna do relatório clássico, não uma
   escolha — e ficava centrado sobre dados alinhados à esquerda. Vai à esquerda, como no IR;
   quem pediu direita (valores) continua à direita. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-report th[align="center"] {
  text-align: left !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-report th a {
  color: inherit !important;
  text-decoration: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-report th a:hover {
  color: var(--nc-roxo) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-cell {
  border: 0 !important;
  border-bottom: 1px solid var(--nc-nevoa2) !important;
  padding: 10px 12px !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
  vertical-align: middle !important;
  color: var(--nc-tinta) !important;
}

/* o fundo só onde a célula não traz cor própria (destaque de linha do IR, cor de coluna
   do relatório): com !important ele cobria as cores de status */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-cell:not([style*="background"]) {
  background: #fff !important;
}

/* A LINHA DE TOTAL ("Total do Relatório:", que o APEX escreve em negrito na primeira
   célula da última linha): fio Névoa em cima e fundo Quase-branco, para ler como
   fechamento da tabela e não como mais um registro. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-report tr:last-child:has(> .t-Report-cell:first-child > b) > .t-Report-cell {
  border-top: 1px solid var(--nc-nevoa) !important;
  background: var(--nc-quase) !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-report tr:last-child:has(> .t-Report-cell:first-child > b) > .t-Report-cell b {
  font-weight: 800 !important;
}

/* botão dentro de uma linha (o "Remover"): menor que o da página, para não esticar a
   linha a 64 px */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Report-cell, .a-IRR-table td) .t-Button:not(.t-Button--link):not(.t-Button--noUI) {
  height: 32px !important;
  padding: 0 12px !important;
  font-size: 13px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-report tr:last-child .t-Report-cell {
  border-bottom: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-report tr:hover .t-Report-cell {
}

/* o fundo só onde a célula não traz cor própria (destaque de linha do IR, cor de coluna
   do relatório): com !important ele cobria as cores de status */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-report tr:hover .t-Report-cell:not([style*="background"]) {
  background: var(--nc-quase) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-cell a {
  color: var(--nc-roxo) !important;
  font-weight: 600 !important;
}

/* Relatório clássico DENTRO de um cartão (Marcações de Ponto, Férias…): o cartão já é a
   moldura — a borda e os cantos próprios do relatório faziam um cartão dentro do outro.
   Fica só um fio em cima, separando o cabeçalho da região das linhas. Vale para todo
   relatório clássico dentro de região com cartão. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:not(.t-Region--noUI) > .t-Region-bodyWrap > .t-Region-body .t-Report {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;                     /* a Skin dá ao .t-Report borda, cantos de 10 px e sombra */
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:not(.t-Region--noUI) > .t-Region-bodyWrap > .t-Region-body .t-Report-tableWrap {
  border: 0 !important;
  border-top: 1px solid var(--nc-nevoa) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Região SEM respiro interno (t-Region--noPadding) com relatório: a tabela vai até o fundo
   do cartão e o branco das células pintava por cima da curva — os cantos de baixo
   ficavam retos. Tabela e corpo da região acompanham o raio do cartão (16 − 1 px da borda). */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region--noPadding:not(.t-Region--noUI) > .t-Region-bodyWrap > .t-Region-body,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region--noPadding:not(.t-Region--noUI) > .t-Region-bodyWrap > .t-Region-body .t-Report-tableWrap {
  border-bottom-left-radius: 15px !important;
  border-bottom-right-radius: 15px !important;
}

/* ali o fio cinza de cima da tabela repetia o fio Rosa do cabeçalho da região, 14 px acima,
   e o Rosa dos títulos das colunas logo abaixo: três fios em 50 px. Fica só o respiro. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region--noPadding:not(.t-Region--noUI) > .t-Region-bodyWrap > .t-Region-body .t-Report-tableWrap {
  border-top: 0 !important;
}

/* celular: o cabeçalho da região quebra a linha — o título fica inteiro em cima e os
   botões descem para a linha de baixo (antes, três botões espremiam o título até
   "Marcações de Po…") */
@media (max-width: 639px) {
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region > .t-Region-header {
    flex-wrap: wrap !important;
    row-gap: 10px !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region > .t-Region-header > .t-Region-headerItems--title {
    flex: 1 1 100% !important;
    min-width: 0 !important;
  }

  /* o selo de data do título ("26 de Setembro às 21:02") desce para baixo do nome */
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region > .t-Region-header .t-Region-title {
    flex-wrap: wrap !important;
    row-gap: 4px !important;
    white-space: normal !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region > .t-Region-header > .t-Region-headerItems--buttons {
    display: flex !important;
    flex: 1 1 100% !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    gap: 6px !important;
  }
}

/* Tabela DENTRO de uma célula de relatório (os pares "Empresa / Filial / C.Custo", os
   horários de ponto, "Situação / Dias / Saída"): ela herdava as listras do relatório de
   fora (o tema pinta todo "tr" descendente) e o espaçamento de 2 px entre células — virava
   uma pilha de faixas cinza com vãos brancos. Vira uma lista de pares: rótulo em Cinza,
   valor em Tinta, sem fundo e sem vão. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Report-cell, .a-IRR-table td) table {
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Report-cell, .a-IRR-table td) table td,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report--altRowsDefault :is(.t-Report-cell, td) table tr:nth-child(n) td {
  padding: 3px 14px 3px 0 !important;
  border: 0 !important;
  background: transparent !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  vertical-align: baseline !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Report-cell, .a-IRR-table td) table td:first-child:not(:only-child):not(:has(a)) {
  width: 1% !important;
  white-space: nowrap !important;
  font-weight: 500 !important;
  color: var(--nc-cinza) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Report-cell, .a-IRR-table td) table td b {
  font-weight: 600 !important;
  color: var(--nc-tinta) !important;
}

/* "Nenhum … neste período" (a mensagem de sem dados do APEX, .nodatafound): 11 px solto e
   recuado. Vira um texto de estado vazio legível, alinhado ao título da seção. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .nodatafound {
  display: block !important;
  margin: 0 !important;
  padding: 6px 0 2px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  color: var(--nc-cinza) !important;
}

/* Sem dados numa região SEM respiro interno (t-Region--noPadding — "Benefícios Escolhidos"
   antes do primeiro Adicionar): o texto encostava na borda do cartão. Vira um estado vazio
   de verdade: centrado, com o "i" (fa-info) num círculo Lavanda e a frase em Grafite — é a
   instrução do próximo passo, não um rodapé. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region--noPadding > .t-Region-bodyWrap > .t-Region-body .nodatafound {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 28px 20px 30px !important;
  text-align: center !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
  text-wrap: balance !important;
  color: var(--nc-grafite) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region--noPadding > .t-Region-bodyWrap > .t-Region-body .nodatafound::before {
  content: "\f129" !important;                     /* fa-info */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  background: var(--nc-nevoa2) !important;
  font-family: "Font APEX Small", "Font APEX" !important;
  font-size: 22px !important;                      /* o "i" da Font APEX é estreito: 17 px sumia no círculo */
  font-weight: 400 !important;
  line-height: 1 !important;
  color: var(--nc-roxo) !important;
}

/* relatório sem a mensagem de "sem dados" configurada ("Benefícios Atuais"): o APEX escreve
   a caixa vazia, e ficava só o ícone solto. Ganha um "Nenhum registro" neutro, em Cinza. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region--noPadding > .t-Region-bodyWrap > .t-Region-body .nodatafound:empty::after {
  content: "Nenhum registro" !important;
  font-weight: 500 !important;
  color: var(--nc-cinza) !important;
}

/* Marcações de Ponto (Painel do Gestor, página 1): os horários eram caixinhas de 60 px
   com fio Azul e cantos de 3 px (CSS da própria página, #MARCACAO_PONTO). Viram etiquetas
   de horário: fundo Lavanda, número em Roxo tabular, e o Roxo cheio no hover — é um link
   que abre o mapa da marcação. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #MARCACAO_PONTO td[headers^="MARCACOES"] a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 58px !important;
  max-width: none !important;
  height: 30px !important;
  padding: 0 10px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: var(--nc-nevoa2) !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  font-variant-numeric: tabular-nums !important;
  color: var(--nc-roxo) !important;
  text-decoration: none !important;
  transition: background-color .15s, color .15s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #MARCACAO_PONTO td[headers^="MARCACOES"] a:hover {
  background: var(--nc-roxo) !important;
  box-shadow: none !important;
  color: #fff !important;
}

/* Sequência 1, 2, 3, 4, 5…: cada coluna de horários é uma tabela com width:100%, e com
   só 2 horários as duas células dividiam a largura inteira — o 2.º horário ia parar no
   meio, como se fosse o 3.º. A linha vira uma fila (flex) alinhada à esquerda; a coluna
   dos horários 1–4 encolhe ao conteúdo e a dos 5–8 (MARCACOES2) continua logo depois. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #MARCACAO_PONTO td[headers^="MARCACOES"] table,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #MARCACAO_PONTO td[headers^="MARCACOES"] tbody {
  display: block !important;
  width: auto !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #MARCACAO_PONTO td[headers^="MARCACOES"] tr {
  display: flex !important;
  flex-wrap: nowrap !important;                    /* até 4 por coluna; com a coluna encolhida, "wrap" empilhava um por linha */
  gap: 6px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #MARCACAO_PONTO td[headers^="MARCACOES"] table td {
  display: block !important;
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #MARCACAO_PONTO td[headers="MARCACOES_TXT"] {
  width: 1% !important;
  white-space: nowrap !important;
  padding-right: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #MARCACAO_PONTO td[headers="MARCACOES2_TXT"] {
  padding-left: 6px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #MARCACAO_PONTO td[headers="MARCACOES2_TXT"]:not(:has(a)) {
  padding: 0 16px 0 0 !important;                  /* é a última coluna: sem horários 5–8, ela só guarda o respiro da borda */
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #MARCACAO_PONTO td[headers="MARCACOES2_TXT"]:has(a) {
  padding-right: 16px !important;
}

/* ---- Organograma (Google Charts OrgChart + a tabela .organograma da página) ----
   Era um bloco em degradê Roxo → Rosa chapado, texto branco, cantos de 5 px e linhas Azuis
   de 2 px; o nó raiz, um código em letra de 8 px. Vira um cartão de pessoa: branco, fio
   Névoa, cantos de 16 px, uma faixa de cabeçalho no degradê da marca (o mesmo dos ícones)
   com o departamento, a foto em círculo sobre a faixa, nome em Tinta, matrícula em Cinza
   e cargo que quebra linha em vez de ser cortado. Linhas finas em lilás. Vale onde quer
   que o organograma apareça. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .google-visualization-orgchart-table {
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .google-visualization-orgchart-table * {
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) td.google-visualization-orgchart-node {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 16px !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  vertical-align: top !important;
}

/* as linhas de ligação: 2 px Azul escuro → 2 px Lilás */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) td.google-visualization-orgchart-lineleft {
  border-left: 2px solid #D6CFE4 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) td.google-visualization-orgchart-lineright {
  border-right: 2px solid #D6CFE4 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) td.google-visualization-orgchart-linebottom {
  border-bottom: 2px solid #D6CFE4 !important;
}

/* o cartão */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) td.google-visualization-orgchart-node > a {
  display: block !important;
  color: inherit !important;
  text-decoration: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) table.organograma {
  width: 100% !important;
  min-width: 184px !important;                     /* com o texto quebrando linha o Google calculava colunas de ~130 px */
  margin: 0 !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  background: #fff !important;
  background-image: none !important;
  box-shadow: var(--nc-soft) !important;
  color: var(--nc-tinta) !important;
  font-size: 12px !important;
  transition: box-shadow .2s, border-color .2s, transform .2s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) td.google-visualization-orgchart-node > a:hover table.organograma,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) td.google-visualization-orgchart-nodesel table.organograma {
  border-color: rgba(201, 87, 136, .45) !important;
  box-shadow: var(--nc-lift) !important;
  transform: translateY(-2px) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) table.organograma td,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) table.organograma tr td.info {
  padding: 0 14px !important;
  border: 0 !important;
  background: transparent !important;
  white-space: normal !important;
  text-align: center !important;
  line-height: 1.35 !important;
}

/* cabeçalho: departamento e código, sobre o degradê da marca */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) table.organograma tr.ccusto:first-child td.info {
  padding: 12px 14px 32px !important;             /* os 32 px de baixo ficam sob a foto, que sobe */
  background-color: transparent !important;
  background-image: var(--nc-icone-fundo) !important;
  background-blend-mode: screen !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  letter-spacing: .02em !important;
  color: rgba(255, 255, 255, .78) !important;
  font-variant-numeric: tabular-nums !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) table.organograma tr.ccusto:first-child big,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) table.organograma tr.ccusto:first-child b {
  display: block !important;
  margin-bottom: 2px !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: -.01em !important;
  line-height: 1.25 !important;
  color: #fff !important;
}

/* a foto sobe sobre a faixa, com anel branco */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) table.organograma tr.foto td.info {
  padding: 0 14px 6px !important;
}

/* aba Funcional: a ordem é foto, nome, cargo, departamento. A foto é a 1.ª linha — a faixa
   da marca vira um fundo de 48 px atrás da metade de cima dela (não há linha de cabeçalho
   para subir por cima), e o departamento vai para um rodapé Lavanda. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) table.organograma tr.foto:first-child td.info {
  padding: 16px 14px 6px !important;
  background-color: transparent !important;
  background-image: var(--nc-icone-fundo) !important;
  background-size: 100% 48px !important;
  background-repeat: no-repeat !important;
  background-blend-mode: screen !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) table.organograma tr.foto:first-child img.fotoColabMed,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) table.organograma tr.foto:first-child img {
  margin: 0 auto !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) table.organograma tr.ccusto:last-child:not(:first-child) td.info {
  padding: 8px 14px 10px !important;
  border-top: 1px solid var(--nc-nevoa) !important;
  background: var(--nc-nevoa2) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) table.organograma tr.cargo:not(:last-child) td.info {
  padding-bottom: 12px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) table.organograma tr.nome big {
  font-size: 14px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) table.organograma tr.foto img,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) table.organograma img.fotoColabMed {
  display: block !important;
  width: 64px !important;                          /* a Skin força 100 px mínimo em .fotoColabMed: as quatro medidas travadas */
  height: 64px !important;
  min-width: 64px !important;
  min-height: 64px !important;
  max-width: 64px !important;
  max-height: 64px !important;
  margin: -28px auto 0 !important;
  object-fit: cover !important;
  object-position: center 30% !important;
  border: 3px solid #fff !important;
  border-radius: 50% !important;
  background-color: #fff !important;
  box-shadow: 0 8px 18px -10px rgba(81, 28, 118, .6) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) table.organograma .foto .info span {
  font-size: 48px !important;
  color: #D6CFE4 !important;
}

/* "Gestor": etiqueta; nome e matrícula; cargo */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) table.organograma tr.nome td.info {
  padding-top: 2px !important;
  font-size: 13.5px !important;
  color: var(--nc-tinta) !important;
}

/* o papel ("Gestor"): rótulo pequeno em Rosa, acima do nome */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) table.organograma tr.nome:not(:has(b)) td.info {
  padding-top: 4px !important;
  padding-bottom: 0 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  color: var(--nc-rosa) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) table.organograma tr.nome b {
  font-weight: 700 !important;
  color: var(--nc-tinta) !important;
  font-variant-numeric: tabular-nums !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) table.organograma tr.cargo td.info {
  padding: 4px 14px 14px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--nc-grafite) !important;
}

/* o nó raiz sem cartão (só o código da estrutura, ex.: "700_109701"): etiqueta */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) td.google-visualization-orgchart-node:not(:has(table)) {
  height: auto !important;
  padding: 6px 14px !important;
  border-radius: 999px !important;
  background: var(--nc-nevoa2) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .02em !important;
  color: var(--nc-roxo) !important;
  font-variant-numeric: tabular-nums !important;
}

/* rodapé: a Skin pinta uma faixa cinza (2,4 %) que destoava do fundo claro; fica o fundo
   da tela e um fio Névoa em cima. A região de texto vazia que carrega o botão da NATI
   virava um "cartão" de 2 px de altura — um fio duplo com sombra: sai o desenho. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Footer {
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid var(--nc-nevoa) !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Footer .t-Region--textContent {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* relatório marcado "Row Highlight Off" + "No Borders" (os links do rodapé: Termos de
   Uso…): quem o marcou assim pediu um relatório que não parece relatório. Sem cartão,
   sem fundo, sem fios, texto miúdo em Cinza — o Roxo só aparece no hover. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report--rowHighlightOff.t-Report--noBorders,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report--rowHighlightOff.t-Report--noBorders .t-Report-tableWrap,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report--rowHighlightOff.t-Report--noBorders .t-Report-report,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report--rowHighlightOff.t-Report--noBorders .t-Report-cell,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report--rowHighlightOff.t-Report--noBorders .t-Report-report tr:hover .t-Report-cell {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region:has(.t-Report--rowHighlightOff.t-Report--noBorders) {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report--rowHighlightOff.t-Report--noBorders .t-Report-cell {
  padding: 3px 8px !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  color: var(--nc-cinza) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report--rowHighlightOff.t-Report--noBorders .t-Report-cell a {
  font-weight: 500 !important;
  color: var(--nc-cinza) !important;
  text-decoration: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report--rowHighlightOff.t-Report--noBorders .t-Report-cell a:hover {
  color: var(--nc-roxo) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

/* ---------- 12. Superfícies do navegador ---------------------------- */
/* As partes que ninguém desenha também carregam a marca: seleção de texto,
   cursor de digitação e barras de rolagem. */

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) ::selection {
  background: rgba(201, 87, 136, .22) !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) input,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) textarea {
  caret-color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-IRR-tableContainer,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region-body {
  scrollbar-color: rgba(81, 28, 118, .32) transparent !important;
  scrollbar-width: thin !important;
}

/* ---------- TELA DE CARREGANDO (#nc-carregando, montada pelo Natcorp_Carregando.js) ----------
   Ao trocar de página: um véu claro e desfocado sobre a tela — o conteúdo de trás continua
   reconhecível, só recua — e no centro o símbolo da Natcorp com os quatro losangos
   (no degradê real do logo: Ameixa → Roxo → Azul) acendendo em sequência, em sentido horário (em cima → direita → embaixo → esquerda),
   como uma volta. Embaixo, "Carregando…". Entra 150 ms depois do clique (troca rápida não
   pisca) e bloqueia cliques repetidos enquanto a página não troca. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #nc-carregando {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483000 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
  background: rgba(252, 251, 254, .62) !important;
  -webkit-backdrop-filter: blur(8px) saturate(1.15) !important;
  backdrop-filter: blur(8px) saturate(1.15) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: opacity .28s cubic-bezier(.22, 1, .36, 1), visibility 0s linear .28s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #nc-carregando.is-ativo {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  cursor: progress !important;
  transition: opacity .28s cubic-bezier(.22, 1, .36, 1) .15s, visibility 0s linear .15s !important;
}

/* o símbolo (66 px) num disco branco de 104, com um halo claro e centrado em volta */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #nc-carregando .nc-carregando-marca {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 104px !important;
  height: 104px !important;
  border-radius: 50% !important;
  background: #fff !important;
  box-shadow: 0 0 0 1px rgba(233, 229, 241, .7), 0 0 44px 6px rgba(154, 64, 138, .16), 0 0 90px 24px rgba(201, 87, 136, .08) !important;   /* sombra CENTRADA e clara: um halo em volta, não uma sombra projetada para baixo */
  transform: translateY(6px) scale(.96) !important;
  transition: transform .5s cubic-bezier(.22, 1, .36, 1) .15s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #nc-carregando.is-ativo .nc-carregando-marca {
  transform: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #nc-carregando svg {
  width: 66px !important;
  height: 66px !important;
  overflow: visible !important;
}

/* SEM opacity/transform aqui: o gerador põe !important em toda declaração, e um valor
   !important vence a animação — os losangos ficavam parados, apagados. Quem define os dois
   é só a animação (fill-mode both: vale inclusive antes de cada losango começar). */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #nc-carregando .nc-carregando-m {
  fill: url(#nc-carregando-g) !important;
  transform-box: fill-box !important;
  transform-origin: center !important;
  animation: nc-carregando-volta 2s cubic-bezier(.45, 0, .25, 1) infinite both !important;
}

/* sentido horário: em cima (m1), direita (m2), embaixo (m3), esquerda (m4) */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #nc-carregando .nc-carregando-m2 { animation-delay: .5s !important; }
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #nc-carregando .nc-carregando-m3 { animation-delay: 1s !important; }
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #nc-carregando .nc-carregando-m4 { animation-delay: 1.5s !important; }

/* o losango "apagado" fica em 45 %: o símbolo inteiro continua reconhecível, na cor real,
   e a luz passa por ele */
@keyframes nc-carregando-volta {
  0% { opacity: .45; transform: scale(.88); }
  22% { opacity: 1; transform: scale(1.06); }
  50% { opacity: .95; transform: scale(1); }
  100% { opacity: .45; transform: scale(.88); }
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #nc-carregando .nc-carregando-texto {
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: .01em !important;
  color: var(--nc-grafite) !important;
}

/* movimento reduzido: sem a volta — os quatro respiram juntos, devagar */
@media (prefers-reduced-motion: reduce) {
  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #nc-carregando .nc-carregando-m {
    animation: nc-carregando-respira 2.4s ease-in-out infinite both !important;
    animation-delay: 0s !important;
  }

  html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) #nc-carregando .nc-carregando-marca {
    transform: none !important;
    transition: none !important;
  }
}

@keyframes nc-carregando-respira {
  0%, 100% { opacity: .6; }
  50% { opacity: 1; }
}

/* ---------- CAMPOS COM RÓTULO FLUTUANTE (t-Form-fieldContainer--floatingLabel) ----------
   Aplicações com o template "Floating" (Avaliações › Abertura e Fechamento de Ciclo): o
   rótulo mora DENTRO da caixa, no alto, e o valor embaixo. A regra geral dos campos
   (38 px, respiro 0 10) achatava a caixa e o rótulo caía por cima do valor
   ("PERÍODO - INÍCIO" sobre "27/09/2024"). No padrão Natcorp: caixa de 52 px, rótulo de
   11 px em Cinza no alto (Roxo quando o campo está em foco), valor em 13.5 px embaixo; os
   botões presos (lista, calendário) com a mesma altura; obrigatório com o " *" vermelho do
   resto do sistema, no lugar do triângulo vermelho no canto da Skin. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer--floatingLabel {
  position: relative !important;
  margin-bottom: 12px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer--floatingLabel::before {
  content: none !important;
  display: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer--floatingLabel > .t-Form-labelContainer {
  position: static !important;
  width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer--floatingLabel .t-Form-label {
  position: absolute !important;
  top: 8px !important;
  left: 21px !important;                           /* 8 do contêiner + 1 da borda + 12 do respiro do campo */
  right: 60px !important;
  z-index: 2 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 14px !important;
  letter-spacing: .02em !important;
  color: var(--nc-cinza) !important;
  pointer-events: none !important;
  transform: none !important;
  transition: color .2s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer--floatingLabel:focus-within .t-Form-label {
  color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer--floatingLabel .t-Form-inputContainer :is(input.apex-item-text, select.apex-item-select, select.selectlist, textarea.textarea) {
  height: 52px !important;
  min-height: 52px !important;
  padding: 21px 12px 5px !important;
  font-size: 13.5px !important;
  line-height: 1.3 !important;
}

/* campo de EXIBIÇÃO com rótulo flutuante ("Início", "Fim", "Nome do Arquivo" — Assinatura
   de Documento): a caixa de exibição tinha 38 px e o rótulo caía por cima do valor */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer--floatingLabel .t-Form-inputContainer .apex-item-display-only {
  display: flex !important;
  align-items: flex-end !important;
  box-sizing: border-box !important;
  min-height: 52px !important;
  padding: 21px 12px 7px !important;
  font-size: 13.5px !important;
  line-height: 1.35 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer--floatingLabel .t-Form-inputContainer :is(select.apex-item-select, select.selectlist) {
  padding-right: 32px !important;
  background-position: right 10px center !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer--floatingLabel .t-Form-inputContainer textarea.textarea {
  height: auto !important;
  padding-top: 24px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer--floatingLabel .t-Form-inputContainer :is(.a-Button--popupLOV, .ui-datepicker-trigger, .a-Button--calendar) {
  height: 52px !important;
  min-height: 52px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer--floatingLabel .apex-item-group--popup-lov .apex-item-multi {
  box-sizing: border-box !important;
  min-height: 52px !important;
  padding: 20px 8px 3px !important;
}

/* lista de VÁRIOS valores com rótulo flutuante ("Empresas", "Filiais" — Meus Processos
   Pendentes): a caixa é o <ul>, e o campo de texto mora dentro dela. A regra de cima dava
   52 px e o respiro do rótulo também ao campo de dentro — somados ao respiro do <ul>, a
   caixa ia a 78 px e o botão ficava com 52. O campo de dentro é só a linha do texto. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer--floatingLabel .apex-item-group--popup-lov .apex-item-multi input.apex-item-popup-lov {
  height: 26px !important;
  min-height: 0 !important;
  padding: 0 4px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer--floatingLabel .apex-item-group--popup-lov .apex-item-multi .apex-item-multi-item {
  margin: 0 !important;
}

/* grupo de rádio / checkbox: não há caixa para o rótulo morar dentro — ele sobe e fica em
   cima das opções, como nos formulários de rótulo em cima */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer--floatingLabel:has(.apex-item-group--rc) .t-Form-label {
  position: static !important;
  display: block !important;
  padding: 0 0 6px 1px !important;
  overflow: visible !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer--floatingLabel:has(.apex-item-group--rc) > .t-Form-labelContainer {
  width: auto !important;
  height: auto !important;
}

/* o contêiner do campo flutuante é uma LINHA: o rótulo empurrava as opções para uma coluna
   de 182 px, onde as três empilhavam e a caixa de 38 cortava duas. Rótulo em cima, opções
   na largura toda. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer--floatingLabel:has(.apex-item-group--rc) {
  flex-direction: column !important;
  align-items: stretch !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer--floatingLabel:has(.apex-item-group--rc) > .t-Form-inputContainer {
  width: 100% !important;
  overflow: visible !important;
}

/* o " *" do obrigatório: o tema o posiciona fora do fluxo (o corte do rótulo o escondia)
   e a Skin o deixava transparente */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer--floatingLabel .t-Form-label::after {
  position: static !important;
  margin-left: 1px !important;
  opacity: 1 !important;                           /* a Skin o deixava com opacidade 0 */
  line-height: 14px !important;                    /* o "font:" da regra do asterisco zerava a altura de linha e o rótulo descia 2 px */
}

/* ---------- REGIÃO HERO (t-HeroRegion — o cabeçalho "Abertura e Fechamento de Ciclo") ----------
   A Skin: quadrado Rosa chapado de 64 px com o ícone Azul e título de 32 px fino. Vira o
   cabeçalho das regiões do sistema, maior: o ícone no quadrado do degradê da marca, título
   de 24 px em negrito e a descrição em Grafite logo abaixo. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-HeroRegion {
  padding: 14px 16px !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-HeroRegion-wrap {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-HeroRegion-col--left {
  flex: none !important;
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-HeroRegion-icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 52px !important;
  height: 52px !important;
  border-radius: 14px !important;
  background-color: transparent !important;
  background-image: var(--nc-icone-fundo) !important;
  background-blend-mode: screen !important;
  box-shadow: 0 10px 24px -12px rgba(201, 87, 136, .8) !important;
  font-size: 22px !important;
  line-height: 1 !important;
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-HeroRegion-icon::before {
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-HeroRegion-col--content {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-HeroRegion-title {
  margin: 0 !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: -.02em !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-HeroRegion-col--content p {
  margin: 3px 0 0 !important;
  font-size: 13.5px !important;
  line-height: 1.45 !important;
  color: var(--nc-grafite) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-HeroRegion-col--right {
  flex: none !important;
  padding: 0 !important;
}


/* ---------- GRÁFICO SEM DADOS (painéis de Indicadores — BI) ----------
   O contêiner do gráfico (.hbc) recebe só o texto "Nenhum Dado Encontrado." quando a
   consulta volta vazia: ficava solto no canto de um cartão de 380 px. Vira o estado vazio
   do sistema, centrado no espaço do gráfico: o ícone de gráfico num círculo Lavanda e a
   frase em Cinza. Assim que o gráfico chega (o .hbc ganha elementos), nada disto vale. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region-body > .hbc:not(:has(*)) {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  min-height: 180px !important;
  height: 100% !important;
  padding: 24px 16px !important;
  text-align: center !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--nc-cinza) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region-body > .hbc:not(:has(*))::before {
  content: "\f080" !important;                     /* fa-bar-chart */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  background: var(--nc-nevoa2) !important;
  font-family: "Font APEX Small", "Font APEX" !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  color: var(--nc-roxo) !important;
}

/* ---------- BARRA DE CARREGAMENTO (Pace.js — aplicações de BI) ----------
   O Pace desenhava uma caixa azul com "27 %" no MEIO da tela, por cima dos cartões. Vira
   um fio fino no topo, no degradê da marca — avisa que está carregando sem cobrir nada. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .pace {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 2147482000 !important;
  width: 100% !important;
  height: 3px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  pointer-events: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .pace .pace-progress {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  height: 3px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 3px 3px 0 !important;
  background: linear-gradient(90deg, #9A408A, #511C76 60%, #C95788) !important;
  box-shadow: 0 0 10px rgba(201, 87, 136, .55) !important;
  transition: width .3s ease !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .pace .pace-progress::before,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .pace .pace-progress::after,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .pace .pace-progress-inner,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .pace .pace-activity {
  display: none !important;
  content: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .pace.pace-inactive {
  display: none !important;
}

/* ---------- REGIÃO "SEM RESPIRO" COM FORMULÁRIO OU COM OUTRAS REGIÕES ----------
   t-Region--noPadding existe para a tabela ir de borda a borda. Usada numa região de
   FILTROS (Indicadores — BI) os campos encostavam na borda do cartão; numa região que
   agrupa CARTÕES (os gráficos) a borda dos cartões de dentro coincidia com a do de fora —
   fio duplo. Nesses dois casos o corpo ganha o respiro dos cartões; tabelas (relatório
   clássico, interativo, grade) continuam de borda a borda. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region--noPadding:not(.t-Region--noUI) > .t-Region-bodyWrap > .t-Region-body:has(.t-Form-fieldContainer):not(:has(.a-IRR, .a-IG, .t-Report-report)),
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region--noPadding:not(.t-Region--noUI) > .t-Region-bodyWrap > .t-Region-body:has(> .container .t-Region:not(.t-Region--noUI)):not(:has(.a-IRR, .a-IG, .t-Report-report)) {
  padding: 12px 16px 16px !important;
}

/* ---------- TÍTULO DE SEÇÃO FEITO COM CAMPO ("Dados da Empresa", "Dados de Avaliação") ----------
   Um campo de EXIBIÇÃO sozinho na linha (coluna 12), com o rótulo escondido (coluna 0) e
   um texto: é um título de seção dentro do formulário. A Skin o desenhava como caixa cinza
   da largura toda, igual a um campo vazio. Vira título: 14 px negrito em Tinta, com o fio
   Névoa embaixo e mais espaço em cima que embaixo — separa os grupos de filtros. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .col-12 > .t-Form-fieldContainer:has(> .t-Form-labelContainer.col-0) .apex-item-display-only:not(:empty):not(.t-Alert *) {
  display: block !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 14px 0 8px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--nc-nevoa) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  letter-spacing: -.01em !important;
  color: var(--nc-tinta) !important;
}


/* ---------- GRÁFICO DE BARRAS DO APEX (a-BarChart — painéis de Indicadores) ----------
   AS CORES: cada barra vem com a cor da série em linha (a paleta padrão do APEX, uma cor
   por posição: vermelho, laranja, amarelo, verde…). A Skin (parte de cima deste arquivo)
   pintava TODAS de Roxo com !important — em 677 barras conferidas, as 10 cores viravam
   uma só. Não dá para "voltar" ao valor em linha depois de um !important, então a paleta
   é reposta aqui pela MESMA regra do APEX: a posição do item na lista (conferido: 677 de
   677 barras seguem essa ordem). */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart > .a-BarChart-item:nth-child(10n+1) .a-BarChart-filled { background-color: #FF3B30 !important; }
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart > .a-BarChart-item:nth-child(10n+2) .a-BarChart-filled { background-color: #FF9500 !important; }
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart > .a-BarChart-item:nth-child(10n+3) .a-BarChart-filled { background-color: #FFCC00 !important; }
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart > .a-BarChart-item:nth-child(10n+4) .a-BarChart-filled { background-color: #4CD964 !important; }
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart > .a-BarChart-item:nth-child(10n+5) .a-BarChart-filled { background-color: #34AADC !important; }
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart > .a-BarChart-item:nth-child(10n+6) .a-BarChart-filled { background-color: #007AFF !important; }
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart > .a-BarChart-item:nth-child(10n+7) .a-BarChart-filled { background-color: #5856D6 !important; }
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart > .a-BarChart-item:nth-child(10n+8) .a-BarChart-filled { background-color: #FF2D55 !important; }
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart > .a-BarChart-item:nth-child(10n+9) .a-BarChart-filled { background-color: #8E8E93 !important; }
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart > .a-BarChart-item:nth-child(10n+10) .a-BarChart-filled { background-color: #C7C7CC !important; }

/* A LINHA: nome, barra e valor eram células de tabela sem limite — um nome longo ("Avaliação
   Nível Intermediário - Área Meio") ocupava a largura toda e a barra ficava com 0 px (nos
   cartões "Avaliações Aplicadas", "Grau de Instrução", "Itens da Avaliação" não aparecia
   barra nenhuma). Vira uma grade de 3 colunas: o nome em até 40 % e até 2 linhas, a barra
   com ao menos 64 px, o valor alinhado à direita em números tabulares. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart > .a-BarChart-item {
  display: grid !important;
  grid-template-columns: minmax(84px, 40%) minmax(64px, 1fr) auto !important;
  align-items: center !important;
  column-gap: 12px !important;
  margin: 0 !important;
  padding: 8px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--nc-nevoa2) !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart > .a-BarChart-item:last-child {
  border-bottom: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart .a-BarChart-label {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart .a-BarChart-barLink {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 4px 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart .a-BarChart-bar {
  display: block !important;
  width: 100% !important;
  height: 8px !important;
  overflow: hidden !important;
  border-radius: 999px !important;
  background: var(--nc-nevoa2) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart .a-BarChart-filled {
  height: 100% !important;
  border-radius: 999px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart .a-BarChart-value {
  display: block !important;
  min-width: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: right !important;
  white-space: nowrap !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  font-variant-numeric: tabular-nums !important;
  color: var(--nc-grafite) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart .a-BarChart-value a {
  color: inherit !important;
  text-decoration: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart .a-BarChart-barLink:hover .a-BarChart-bar {
  background: var(--nc-nevoa) !important;
}

/* o nome e o valor traziam cada um o seu fio (eram células de tabela) — com o fio da linha
   inteira, virava uma linha picotada: fica só o da linha */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart .a-BarChart-label,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart .a-BarChart-barLink,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .a-BarChart .a-BarChart-value {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* ---------- FORMULÁRIO TABULAR (tabela com campos em cada linha — "Links Úteis") ----------
   Os campos do formulário tabular antigo do APEX (u-TF-item) não têm as classes dos campos
   de página, e nenhuma regra os alcançava: ficavam com o desenho cru do navegador — borda
   preta em relevo de 2 px, 24 px de altura, a lista nativa cinza, larguras soltas (o "size"
   de cada coluna). Recebem o desenho dos campos do sistema em versão de LINHA: 34 px, fio
   Névoa, cantos de 8, anel Roxo no foco, a largura da própria coluna; a lista com a seta
   da marca; a caixa de seleção da linha, a do sistema (Rosa marcada). */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-cell > :is(input.u-TF-item--text, input.u-TF-item--date, input.u-TF-item--number, input[type="text"].u-TF-item, select.u-TF-item, textarea.u-TF-item) {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 64px !important;
  height: 34px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 8px !important;
  background-color: #fff !important;
  box-shadow: none !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--nc-tinta) !important;
  transition: border-color .2s, box-shadow .2s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-cell > textarea.u-TF-item {
  height: auto !important;
  min-height: 34px !important;
  padding: 7px 10px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-cell > select.u-TF-item {
  -webkit-appearance: none !important;
  appearance: none !important;
  padding-right: 30px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5l3 3 3-3' fill='none' stroke='%234A4460' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-position: right 10px center !important;
  background-size: 12px 12px !important;
  background-repeat: no-repeat !important;
  cursor: pointer !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-cell > :is(input.u-TF-item, select.u-TF-item, textarea.u-TF-item):hover {
  border-color: #D3CBE3 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-cell > :is(input.u-TF-item, select.u-TF-item, textarea.u-TF-item):focus {
  border-color: var(--nc-roxo) !important;
  box-shadow: var(--nc-anel) !important;
  outline: none !important;
}

/* a caixa de seleção da linha (e a de "todas", no título) */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Report-cell, .t-Report-colHead) > input[type="checkbox"]:is(.u-TF-item--checkbox, .row-selector, #check-all-rows) {
  -webkit-appearance: none !important;
  appearance: none !important;
  flex: none !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1.5px solid #CBC1DC !important;
  border-radius: 5px !important;
  background-color: #fff !important;
  background-image: none !important;
  box-shadow: none !important;
  vertical-align: middle !important;
  cursor: pointer !important;
  transition: background-color .15s, border-color .15s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Report-cell, .t-Report-colHead) > input[type="checkbox"]:is(.u-TF-item--checkbox, .row-selector, #check-all-rows):hover {
  border-color: var(--nc-rosa) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Report-cell, .t-Report-colHead) > input[type="checkbox"]:is(.u-TF-item--checkbox, .row-selector, #check-all-rows):checked {
  border-color: var(--nc-rosa) !important;
  background-color: var(--nc-rosa) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.3 2.3 4.7-5' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-position: center !important;
  background-size: 12px 12px !important;
  background-repeat: no-repeat !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) :is(.t-Report-cell, .t-Report-colHead) > input[type="checkbox"]:is(.u-TF-item--checkbox, .row-selector, #check-all-rows):focus-visible {
  outline: 2px solid var(--nc-roxo) !important;
  outline-offset: 2px !important;
}

/* a linha com campos: menos respiro vertical (o campo já tem 34 px) e a coluna da caixa
   estreita e centrada */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-report tr:has(> .t-Report-cell > .u-TF-item) > .t-Report-cell {
  padding-top: 6px !important;
  padding-bottom: 6px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Report-report :is(td, th):has(> input[type="checkbox"]:is(.u-TF-item--checkbox, .row-selector, #check-all-rows)) {
  width: 44px !important;
  text-align: center !important;
}

/* ---------- CAMPO DE ARQUIVO SEM CAMPO (tela de visualização) ----------
   Em modo de leitura (Assinatura de Documento › Visualizar) o APEX escreve o grupo do
   arquivo VAZIO — não há <input type=file>. A área de soltar aparecia assim mesmo, com
   "Arraste o arquivo para cá ou clique para escolher": prometia uma ação que não existe.
   Sem campo e sem arquivo salvo, o campo inteiro sai (o "Ver Documento Original" da região
   continua ali). Com o campo, o texto de apoio ("* Tamanho máximo de 10Mb.") desce para
   baixo da área, em vez de espremido numa coluna ao lado dela. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file:not(:has(input[type="file"])):not(:has(> a))::before,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--file:not(:has(input[type="file"])):not(:has(> a))::after {
  content: none !important;
  display: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer:has(.apex-item-group--file:empty) {
  display: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-itemWrapper:has(> .apex-item-group--file) {
  flex-wrap: wrap !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-itemWrapper:has(> .apex-item-group--file) > .t-Form-itemText {
  flex: 1 1 100% !important;
  width: 100% !important;
  margin: 6px 0 0 !important;
  padding: 0 !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
  color: var(--nc-cinza) !important;
}

/* ---------- ETIQUETA DA LISTA (t-MediaList-badge — o status do assinante) ----------
   Era uma caixinha cinza de 12 px com "-". Vira uma etiqueta legível: pílula Lavanda,
   texto em Grafite semibold; o conteúdo continua o que o APEX manda. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-width: 28px !important;
  height: 26px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--nc-nevoa2) !important;
  box-shadow: none !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  color: var(--nc-grafite) !important;
  white-space: nowrap !important;
}

/* item de lista com várias linhas (nome, papel, CPF): o ícone e a etiqueta acompanham a
   PRIMEIRA linha — centrados na altura toda, o ícone se descolava do nome */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-itemWrap:has(.t-MediaList-body) {
  align-items: flex-start !important;
}

/* alerta de região: a Skin punha um fio embaixo do título ("Prazo Expirado"), sobrando no
   cartão de uma linha só */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert:not(.t-Alert--page) .t-Alert-header {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}


/* texto de um ALERTA feito com campo de exibição ("Prazo Expirado"): é a mensagem do
   alerta, não um título de seção — sem caixa, sem fio, alinhado ao centro do ícone */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert .t-Form-fieldContainer .apex-item-display-only {
  display: block !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Alert .t-Alert-body :is(.container, .row, .col, .t-Form-fieldContainer, .t-Form-inputContainer, .t-Form-itemWrapper) {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
}

/* rótulo flutuante de campo FORA DA GRADE (direto no corpo da região — a coluna de filtros
   de "Meus Processos Pendentes"): ali o contêiner não tem os 8 px de lado da grade, e o
   rótulo, calculado para eles, ficava 21 px para dentro da caixa em vez de 12 */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Region-body > .t-Form-fieldContainer--floatingLabel .t-Form-label {
  left: 13px !important;
  top: 12px !important;                            /* e o contêiner tem 4 px em cima: o rótulo desce junto */
}

/* ---------- SIM/NÃO (Switch em botões — apex-item-group--switch: "Status Ativo/Inativo") ----------
   A Skin desenhava dois blocos retos de 250 px em caixa-alta, o escolhido em Roxo
   chapado, colados à borda de uma caixa de rótulo flutuante que não era a deles. Vira o
   mesmo SELETOR SEGMENTADO dos grupos de rádio do sistema: trilho branco com fio Névoa,
   cada opção um botão de 32 px do tamanho do texto, a escolhida em Rosa com texto branco.
   O rótulo sobe para cima do trilho (não há caixa para morar dentro). O <input> continua
   lá, invisível: o clique vai pelo label e o teclado (setas) pelo rádio. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer:has(.apex-item-group--switch) {
  flex-direction: column !important;
  align-items: stretch !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer--floatingLabel:has(.apex-item-group--switch) > .t-Form-labelContainer {
  width: auto !important;
  height: auto !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer--floatingLabel:has(.apex-item-group--switch) .t-Form-label {
  position: static !important;
  display: block !important;
  padding: 0 0 6px 1px !important;
  overflow: visible !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer:has(.apex-item-group--switch) > .t-Form-inputContainer {
  width: 100% !important;
  overflow: visible !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--switch {
  display: inline-flex !important;
  flex: none !important;
  align-self: flex-start !important;               /* do tamanho das opções — o contêiner o esticava à coluna toda */
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 2px !important;
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 3px !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--switch > .apex-item-option {
  position: relative !important;
  display: inline-flex !important;
  flex: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--switch > .apex-item-option > input[type="radio"] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--switch > .apex-item-option > label.a-Button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 72px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  color: var(--nc-grafite) !important;
  cursor: pointer !important;
  transition: background-color .15s, color .15s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--switch > .apex-item-option > label.a-Button:hover {
  background: var(--nc-nevoa2) !important;
  color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--switch > .apex-item-option > input[type="radio"]:checked + label.a-Button {
  background: var(--nc-rosa) !important;
  color: #fff !important;
  box-shadow: 0 6px 14px -8px rgba(201, 87, 136, .8) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--switch > .apex-item-option > input[type="radio"]:focus-visible + label.a-Button {
  outline: 2px solid var(--nc-roxo) !important;
  outline-offset: 1px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .apex-item-group--switch > .apex-item-option > input[type="radio"]:disabled + label.a-Button {
  opacity: .5 !important;
  cursor: default !important;
}


/* o texto da etiqueta às vezes vem num <h5> ("Prazo Expirado", "Assinado" — Processos de
   Assinatura), com a margem e o corpo de título do tema: o texto ficava 4 px acima do
   centro da pílula. Herda da etiqueta. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-badge :is(h1, h2, h3, h4, h5, h6, p) {
  margin: 0 !important;
  padding: 0 !important;
  font: inherit !important;
  line-height: 1 !important;
  color: inherit !important;
}

/* a etiqueta acompanha o TÍTULO do item, no alto — no meio de um cartão alto ela ficava
   solta, longe do que descreve */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-itemWrap:has(.t-MediaList-body) > .t-MediaList-badgeWrap {
  align-self: flex-start !important;
  padding: 5px 0 0 !important;
}

/* A ETIQUETA NA COR DO STATUS. O ícone do item já diz o status pela cor (colorStatusRed/
   Green/Yellow/Blue/Gray, do Natcorp_Style.css — vermelho para expirado, erro, cancelado;
   verde para assinado…), mas a etiqueta ao lado era sempre Lavanda. Ela passa a repetir a
   cor do ícone, em tom claro com texto escuro da mesma família, e um ponto na cor cheia —
   o status se lê de relance, sem depender só da cor (o texto continua lá). */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-itemWrap:has(.colorStatusRed) .t-MediaList-badge {
  background: #FDECEC !important;
  color: #A3262F !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-itemWrap:has(.colorStatusGreen) .t-MediaList-badge {
  background: #E6F6EC !important;
  color: #1B6B45 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-itemWrap:has(.colorStatusYellow) .t-MediaList-badge {
  background: #FFF6D5 !important;
  color: #7A5300 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-itemWrap:has(.colorStatusBlue) .t-MediaList-badge {
  background: #E7F0FA !important;
  color: #174F8C !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-itemWrap:has(.colorStatusGray) .t-MediaList-badge {
  background: #EFEEF3 !important;
  color: var(--nc-grafite) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-MediaList .t-MediaList-itemWrap:has([class*="colorStatus"]) .t-MediaList-badge::before {
  content: "" !important;
  flex: none !important;
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: currentColor !important;
}

/* ---------- SELECT2 (plugin de lista com busca e vários valores — "Fato", Linha do Tempo) ----------
   Vinha com o desenho do próprio plugin: caixa de 32 px com fio cinza #AAA e cantos de 4, o
   texto em 14 px de outra família, etiquetas cinza. Recebe o desenho dos campos do sistema:
   38 px, fio Névoa, cantos de 8, anel Roxo no foco; os valores escolhidos em etiquetas
   Lavanda; a lista que abre, no cartão flutuante dos menus. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-container {
  max-width: 100% !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-inputContainer .select2-container {
  width: 100% !important;                          /* o plugin grava a largura em linha (250 px) e sobrava um vão */
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-container--default :is(.select2-selection--multiple, .select2-selection--single) {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  min-height: 38px !important;
  padding: 3px 8px !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: none !important;
  cursor: text !important;
  transition: border-color .2s, box-shadow .2s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-container--default .select2-selection--single {
  padding-right: 30px !important;
  cursor: pointer !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-container--default :is(.select2-selection--multiple, .select2-selection--single):hover {
  border-color: #D3CBE3 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-container--default:is(.select2-container--focus, .select2-container--open) :is(.select2-selection--multiple, .select2-selection--single) {
  border-color: var(--nc-roxo) !important;
  box-shadow: var(--nc-anel) !important;
  outline: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-container--default .select2-selection--multiple .select2-selection__rendered {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-container--default .select2-selection__rendered li {
  margin: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-container--default .select2-search--inline .select2-search__field {
  height: 28px !important;
  margin: 0 !important;
  padding: 0 4px !important;
  border: 0 !important;
  background: transparent !important;
  font-family: inherit !important;
  font-size: 13.5px !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-container--default .select2-search--inline .select2-search__field::placeholder {
  color: var(--nc-cinza) !important;
  opacity: 1 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-container--default .select2-selection__choice {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  height: 26px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: var(--nc-nevoa2) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-container--default .select2-selection__choice__remove {
  order: 2 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  color: var(--nc-cinza) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-container--default .select2-selection__choice__remove:hover {
  color: var(--nc-ruim) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-container--default .select2-selection--single .select2-selection__rendered {
  padding: 0 4px !important;
  font-size: 13.5px !important;
  line-height: 30px !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-container--default .select2-selection--single .select2-selection__arrow {
  top: 50% !important;
  right: 8px !important;
  height: 20px !important;
  transform: translateY(-50%) !important;
}

/* a lista que abre */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-dropdown {
  overflow: hidden !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: var(--nc-lift) !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-container--open .select2-dropdown--below {
  margin-top: 4px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-container--open .select2-dropdown--above {
  margin-top: -4px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-results__options {
  padding: 4px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-container--default .select2-results__option {
  margin: 0 !important;
  padding: 8px 10px !important;
  border-radius: 6px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-container--default .select2-results__option--highlighted[aria-selected] {
  background: var(--nc-nevoa2) !important;
  color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-container--default .select2-results__option[aria-selected="true"] {
  background: transparent !important;
  color: var(--nc-roxo) !important;
  font-weight: 700 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-container--default .select2-results__option[aria-selected="true"]::after {
  content: "\f00c" !important;                     /* fa-check */
  float: right !important;
  font-family: "Font APEX Small", "Font APEX" !important;
  font-size: 12px !important;
  color: var(--nc-rosa) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .select2-search--dropdown .select2-search__field {
  height: 34px !important;
  padding: 0 10px !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 8px !important;
  font-family: inherit !important;
  font-size: 13px !important;
}

/* ---------- BOTÃO ENCAIXADO NO CAMPO (t-Button--pillEnd numa coluna ao lado) ----------
   O APEX marca o botão como "fim de pílula" (pillEnd) — feito para encostar no campo —,
   mas o põe numa COLUNA própria: ficava 19 px solto do "Fato", com outra altura. Na linha
   com esse botão, a coluna dele encolhe ao tamanho do botão e encosta na do campo; campo e
   botão viram uma peça: o campo perde os cantos da direita, o botão os da esquerda, a
   mesma altura (38). */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .row:has(> .col > .t-Button--pillEnd:first-child) {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: flex-end !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .row:has(> .col > .t-Button--pillEnd:first-child) > .col:has(> .t-Button--pillEnd:first-child) {
  flex: none !important;
  width: auto !important;
  max-width: none !important;
  margin-left: -8px !important;
  padding-left: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .row:has(> .col > .t-Button--pillEnd:first-child) > .col:has(> .t-Button--pillEnd:first-child) > .t-Button--pillEnd {
  height: 38px !important;
  min-height: 38px !important;
  margin: 0 0 3px !important;                      /* os 3 px de margem que o contêiner do campo tem embaixo */
  border-radius: 0 8px 8px 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .row:has(> .col > .t-Button--pillEnd:first-child) :is(.select2-selection, input.apex-item-text, select.selectlist) {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

/* rótulo à esquerda do campo ("Fato"): centrado na altura do campo, não no alto */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .t-Form-fieldContainer:has(.select2-container) > .t-Form-labelContainer:not(.col-12) {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  min-height: 38px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* ---------- LINHA DO TEMPO (TimelineJS — Consultas › Linha do Tempo) ----------
   O componente monta, para cada fato, um MARCADOR na faixa de cima e um SLIDE de detalhe na
   faixa de baixo. Com 1.501 fatos eram 30 mil elementos; e a faixa de detalhe, espremida
   pela de cima (664 de 700 px), tinha 36 px — mostrava só um "LINHA DO TEMPO" cortado.
   · LEVEZA: a faixa de detalhe fica invisível e os 1.502 slides fora da tela deixam de ser
     desenhados; os marcadores perdem as transições (cada zoom animava 1.501 caixas de uma
     vez). O DOM continua o mesmo (isso só se reduz na consulta; ver a nota ao cliente).
   · DESENHO: fundo branco com as faixas dos fatos alternando um quase-branco; o nome de cada
     fato numa etiqueta branca legível; os períodos em Lavanda com texto Tinta (o verde-água
     #1ABC9C com texto branco de 12 px não lia); o selecionado em Roxo; o eixo dos anos em
     Grafite; os botões de zoom no quadrado do sistema, com ícones de verdade (os do
     componente não carregavam e apareciam como quadrados vazios). */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline {
  overflow: hidden !important;
  border: 0 !important;                            /* já está dentro do cartão da região */
  border-radius: 0 !important;
  background: #fff !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
}

/* A FAIXA DE DESCRIÇÃO (abaixo do gráfico): o plugin (sb-timeline.js, versão Natcorp) dá à
   região a altura da faixa de cima + 320 px, e a descrição do item clicado aparece aqui.
   Os slides fora da tela não são desenhados (content-visibility) — 1.502 slides, um só
   visível por vez. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-storyslider {
  border-top: 1px solid var(--nc-nevoa) !important;
  background: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-slide {
  background: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-slide .tl-slide-content {
  padding-top: 24px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-slide .tl-text .tl-headline-date,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-slide .tl-text h3.tl-headline-date {
  margin: 0 0 6px !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 800 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  color: var(--nc-rosa) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-slide .tl-text h2.tl-headline {
  margin: 0 0 10px !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  letter-spacing: -.01em !important;
  text-transform: none !important;
  color: var(--nc-tinta) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-slide.tl-slide-titleslide .tl-text h2.tl-headline {
  font-size: 24px !important;
  color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-slide .tl-text .tl-text-content,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-slide .tl-text .tl-text-content p {
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  color: var(--nc-grafite) !important;
}

/* setas de anterior/próximo, dos lados da descrição */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-slidenav-previous .tl-slidenav-title,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-slidenav-next .tl-slidenav-title {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;                /* o nome do item vizinho em até 3 linhas (eram 7, em caixa-alta) */
  width: auto !important;
  max-width: 130px !important;                     /* a largura do próprio botão de navegação — mais que isso a da direita era cortada */
  overflow: hidden !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  color: var(--nc-grafite) !important;
  opacity: 1 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline :is(.tl-slidenav-previous, .tl-slidenav-next) .tl-slidenav-description {
  display: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline :is(.tl-slidenav-previous, .tl-slidenav-next) .tl-slidenav-icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  margin-bottom: 6px !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 50% !important;
  background: #fff !important;
  color: var(--nc-roxo) !important;
  font-size: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-slidenav-previous .tl-slidenav-icon::before,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-slidenav-next .tl-slidenav-icon::before {
  font-family: "Font APEX Small", "Font APEX" !important;
  font-size: 13px !important;
  line-height: 1 !important;
  color: inherit !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-slidenav-previous .tl-slidenav-icon::before { content: "\f104" !important; }   /* fa-angle-left */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-slidenav-next .tl-slidenav-icon::before { content: "\f105" !important; }       /* fa-angle-right */

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline :is(.tl-slidenav-previous, .tl-slidenav-next):hover .tl-slidenav-icon {
  border-color: var(--nc-roxo) !important;
  background: var(--nc-off) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-storyslider .tl-slide {
  content-visibility: auto !important;
  contain-intrinsic-size: auto 300px !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timenav {
  background: #fff !important;
  border: 0 !important;
}

/* as faixas dos fatos */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timegroup {
  background: #fff !important;
  border: 0 !important;
  transition: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timegroup.tl-timegroup-alternate {
  background: #FAF9FC !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timegroup .tl-timegroup-message {
  display: inline-block !important;
  margin: 4px 0 0 8px !important;
  padding: 2px 8px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .92) !important;
  box-shadow: 0 0 0 1px var(--nc-nevoa2) !important;
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  line-height: 16px !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  color: var(--nc-grafite) !important;
  transition: none !important;
}

/* os períodos (marcadores) */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timemarker {
  transition: none !important;                     /* sem "contain": ele cria camada própria e as faixas dos fatos cobriam os marcadores */
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timemarker * {
  transition: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timemarker .tl-timemarker-content-container {
  border: 0 !important;
  border-radius: 6px !important;
  background: var(--nc-nevoa2) !important;
  box-shadow: inset 0 0 0 1px rgba(81, 28, 118, .1) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timemarker .tl-timemarker-content-container .tl-headline {
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  text-transform: none !important;
  color: var(--nc-tinta) !important;
}

/* a faixa vertical de cada período e as duas linhas-guia: somadas em 1.501 marcadores viravam
   colunas Lavanda e dezenas de riscos. Aparecem só no período sob o mouse e no selecionado. */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timemarker .tl-timemarker-timespan {
  border-radius: 6px 6px 0 0 !important;
  background: transparent !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timemarker :is(.tl-timemarker-line-left, .tl-timemarker-line-right) {
  border-color: transparent !important;
  box-shadow: none !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timemarker:hover .tl-timemarker-timespan {
  background: rgba(81, 28, 118, .04) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timemarker:hover :is(.tl-timemarker-line-left, .tl-timemarker-line-right) {
  border-color: rgba(81, 28, 118, .25) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timemarker:hover .tl-timemarker-content-container {
  background: #E7DDF2 !important;
  box-shadow: inset 0 0 0 1px rgba(81, 28, 118, .3) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timemarker:hover .tl-headline {
  color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timemarker.tl-timemarker-active .tl-timemarker-content-container {
  background: var(--nc-roxo) !important;
  box-shadow: 0 6px 14px -8px rgba(81, 28, 118, .8) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timemarker.tl-timemarker-active .tl-headline {
  color: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timemarker.tl-timemarker-active .tl-timemarker-timespan {
  background: rgba(201, 87, 136, .06) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timemarker.tl-timemarker-active :is(.tl-timemarker-line-left, .tl-timemarker-line-right) {
  border-color: rgba(201, 87, 136, .55) !important;
}

/* o eixo dos anos */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timeaxis-background {
  border: 0 !important;
  border-top: 1px solid var(--nc-nevoa) !important;
  background: #fff !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timeaxis .tl-timeaxis-tick-text {
  font-family: Manrope, "Segoe UI", system-ui, sans-serif !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  font-variant-numeric: tabular-nums !important;
  color: var(--nc-cinza) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timeaxis .tl-timeaxis-major .tl-timeaxis-tick-text {
  font-size: 12px !important;
  font-weight: 800 !important;
  color: var(--nc-grafite) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timeaxis .tl-timeaxis-tick,
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timeaxis .tl-timeaxis-tick::before {
  border-color: var(--nc-nevoa) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-timenav-line {
  background: var(--nc-rosa) !important;
  box-shadow: none !important;
}

/* os botões de zoom (mais, menos, voltar ao início) */
/* em linha, à direita, no vão entre a última faixa e o eixo dos anos — no meio da coluna
   dos nomes eles cobriam "Férias", "Exame Funcionário", "Avaliação" */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-menubar {
  top: auto !important;
  bottom: calc(var(--nc-tl-detalhe, 36px) + 40px) !important;   /* no vão entre a última faixa e o eixo; a altura da descrição vem do plugin */
  right: 12px !important;                          /* à direita: à esquerda ficam os nomes dos fatos */
  left: auto !important;
  z-index: 20 !important;                          /* o fundo da faixa de cima tem z-index 6 e engolia o clique (5) */
  display: flex !important;
  flex-direction: row !important;
  gap: 6px !important;
  padding: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-menubar .tl-menubar-button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--nc-nevoa) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: 0 1px 2px rgba(27, 18, 56, .06) !important;
  color: var(--nc-grafite) !important;
  cursor: pointer !important;
  transition: background-color .2s, color .2s, border-color .2s !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-menubar .tl-menubar-button:hover {
  border-color: rgba(81, 28, 118, .35) !important;
  background: var(--nc-off) !important;
  color: var(--nc-roxo) !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-menubar .tl-menubar-button > span {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: auto !important;
  background: none !important;
  font-size: 0 !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-menubar .tl-menubar-button > span::before {
  font-family: "Font APEX Small", "Font APEX" !important;
  font-size: 14px !important;
  line-height: 1 !important;
  color: inherit !important;
}

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-icon-zoom-in::before { content: "\f00e" !important; }     /* fa-search-plus */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-icon-zoom-out::before { content: "\f010" !important; }    /* fa-search-minus */
html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-icon-goback::before { content: "\f0e2" !important; }      /* fa-undo */

html body:is(.t-PageBody:not(.t-PageBody--login), .t-Dialog-page):not(#nc-a1):not(#nc-a2) .tl-timeline .tl-attribution {
  opacity: .5 !important;
  font-size: 10px !important;
}