/**
 * Visual do CKEditor 4 para o Contrato Express.
 * Mantem a identidade verde do produto com controles mais claros e acessiveis.
 */

/*
 * Paleta do editor, num lugar so.
 *
 * Ela vive no :root — e nao dentro do .cke_chrome, onde nasceu — porque
 * declaracao no proprio elemento vence qualquer override de fora: um tema que
 * redefinisse estas variaveis na raiz seria ignorado. Daqui, um tema inteiro e
 * redeclarar o que quiser trocar.
 *
 * O resto da folha usa `var(--token, valor-antigo)`. O fallback existe de
 * proposito: se este bloco sumir, a folha continua pintando como sempre.
 */
:root {
  --cv-editor-ink: #23483f;
  --cv-editor-muted: #678179;
  --cv-editor-accent: #3f7569;
  --cv-editor-accent-strong: #2f6257;
  --cv-editor-hover: #e4f0ec;
  --cv-editor-line: #ccdcd6;
  --cv-editor-surface: #ffffff;
  --cv-editor-toolbar: #f3f8f6;
  --cv-editor-accent-alt: #377260;
  --cv-editor-line-soft: #d8e4df;
  --cv-editor-muted-soft: #9aaeaa;
  --cv-editor-rodape: #f8fbfa;
}

/* Estrutura do editor */
.cke_chrome.cv-skin,
.site-content .cke_chrome {
  border: 1px solid var(--cv-editor-line) !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  background: var(--cv-editor-surface) !important;
  box-shadow:
    0 1px 2px rgba(35, 72, 63, 0.05),
    0 10px 28px rgba(35, 72, 63, 0.08) !important;
  transition: border-color 160ms ease, box-shadow 160ms ease !important;
}

/* Maximizar: não prender o editor no card (senão maximiza “errado”) */
.cke_chrome.cv-skin:has(.cke_maximized),
.site-content .cke_chrome:has(.cke_maximized) {
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.cke_chrome.cv-skin.cke_focus,
.cke_chrome.cv-skin:focus-within,
.site-content .cke_chrome.cke_focus,
.site-content .cke_chrome:focus-within {
  border-color: #8fb5aa !important;
  box-shadow:
    0 0 0 3px rgba(63, 117, 105, 0.11),
    0 14px 34px rgba(35, 72, 63, 0.11) !important;
}

.cke_chrome.cv-skin .cke_inner,
.site-content .cke_chrome .cke_inner {
  position: relative !important;
  background: transparent !important;
}

.cke_chrome.cv-skin .cke_inner.cke_maximized,
.site-content .cke_chrome .cke_inner.cke_maximized {
  position: fixed !important;
  z-index: 100000 !important;
  left: 0 !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  background: #fff !important;
  border-radius: 0 !important;
  display: flex !important;
  flex-direction: column !important;
}

/* O CKEditor calcula a altura de .cke_contents comparando a altura do
   .cke_inner (ja esticado em 100% por causa das regras acima) com a altura
   antiga do conteudo, entao o valor inline sai curto e sobra espaco vazio.
   O flex ignora esse calculo e faz o corpo ocupar o que resta da janela. */
.cke_chrome.cv-skin .cke_inner.cke_maximized > .cke_top,
.cke_chrome.cv-skin .cke_inner.cke_maximized > .cke_bottom,
.site-content .cke_chrome .cke_inner.cke_maximized > .cke_top,
.site-content .cke_chrome .cke_inner.cke_maximized > .cke_bottom {
  flex: 0 0 auto !important;
}

.cke_chrome.cv-skin .cke_inner.cke_maximized > .cke_contents,
.site-content .cke_chrome .cke_inner.cke_maximized > .cke_contents {
  flex: 1 1 auto !important;
  height: auto !important;
  min-height: 0 !important;
}

/* Barra de ferramentas */
.cke_chrome.cv-skin .cke_top,
.site-content .cke_top {
  background: var(--cv-editor-toolbar, var(--cv-editor-toolbar, #f3f8f6)) !important;
  background-image: none !important;
  border-bottom: 1px solid var(--cv-editor-line, var(--cv-editor-line, #ccdcd6)) !important;
  padding: 5px 6px !important;
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.75) !important;
}

.cke_chrome.cv-skin .cke_toolbox,
.site-content .cke_toolbox {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 3px !important;
  width: 100% !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
  scrollbar-width: thin;
  line-height: 0 !important;
}

/* Ultimo recurso: nem com todos os grupos recolhidos a barra coube. */
.cke_chrome.cv-skin .cke_toolbox.cv-toolbox-rola,
.site-content .cke_toolbox.cv-toolbox-rola {
  overflow-x: auto !important;
}

.cke_chrome.cv-skin .cke_toolbar,
.site-content .cke_toolbar {
  display: flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  float: none !important;
  margin: 0 !important;
}

/* ——— Menu "⋯": o que nao coube na barra ——— */

/* O menu desce abaixo da barra, e o moono poe overflow:hidden no .cke_top:
   sem soltar isso o painel existe, mede certo e simplesmente nao aparece,
   cortado na borda de baixo. Quem precisa recortar aqui e o .cke_toolbox,
   que tem overflow proprio. */
.cke_chrome.cv-skin .cke_top,
.site-content .cke_chrome .cke_top {
  position: relative;
  overflow: visible !important;
}

.cke_chrome.cv-skin .cke_toolbar.cv-toolbar-more.is-vazio,
.site-content .cke_toolbar.cv-toolbar-more.is-vazio {
  display: none !important;
}

.cke_button__cvmais_icon::before {
  content: "\f141"; /* ellipsis */
}

.cv-toolbar-overflow {
  display: none;
  position: absolute;
  z-index: 100;
  box-sizing: border-box;
  /* Sem o teto, os grupos saem numa tira unica de ~700px pendurada sob a
     barra: parece uma segunda toolbar solta, nao um menu do botao. */
  width: max-content;
  max-width: min(300px, calc(100% - 12px));
  padding: 5px;
  border: 1px solid #c7d8d2;
  border-radius: 10px;
  background: var(--cv-editor-surface, #ffffff);
  box-shadow: 0 12px 28px rgba(35, 72, 63, 0.18);
}

.cv-toolbar-overflow.is-open {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}

/* Cada grupo vira uma pastilha: com as fileiras quebradas, sem isso nao se
   enxerga mais onde um grupo termina e o outro comeca. */
.cke_chrome.cv-skin .cv-toolbar-overflow > .cke_toolbar,
.site-content .cv-toolbar-overflow > .cke_toolbar {
  padding: 1px 2px !important;
  border: 1px solid #e2ebe8 !important;
  border-radius: 7px !important;
  background: #f7faf9 !important;
}

/* Ações CV coladas à direita: a margem automática vai no primeiro bloco da
   direita (arquivos) e empurra o de ações junto. */
.cke_chrome.cv-skin .cke_toolbar:has(.cke_button__cvdownloaddoc),
.site-content .cke_toolbar:has(.cke_button__cvdownloaddoc) {
  margin-left: auto !important;
}

.cke_chrome.cv-skin .cke_toolbar_last,
.site-content .cke_toolbar_last {
  margin-left: 0 !important;
}

.cke_chrome.cv-skin .cke_toolgroup,
.site-content .cke_toolgroup {
  display: flex !important;
  align-items: center !important;
  gap: 2px !important;
  float: none !important;
  margin: 0 !important;
  padding: 2px !important;
  border: 1px solid rgba(156, 184, 176, 0.55) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.88) !important;
  background-image: none !important;
  box-shadow: 0 1px 2px rgba(35, 72, 63, 0.04) !important;
}

.cke_chrome.cv-skin .cke_toolbar_separator,
.site-content .cke_toolbar_separator {
  float: none !important;
  width: 1px !important;
  height: 18px !important;
  margin: 6px 4px !important;
  background: rgba(63, 117, 105, 0.2) !important;
  background-image: none !important;
  box-shadow: none !important;
}

.cke_chrome.cv-skin .cke_toolbar_break,
.site-content .cke_toolbar_break {
  flex-basis: 100% !important;
  width: 0 !important;
  height: 0 !important;
}

/* Botoes */
.cke_chrome.cv-skin a.cke_button,
.site-content .cke_chrome a.cke_button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  float: none !important;
  width: auto !important;
  min-width: 26px !important;
  height: 26px !important;
  margin: 0 !important;
  padding: 5px !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  cursor: pointer !important;
  opacity: 1 !important;
  transition: background-color 120ms ease, color 120ms ease, transform 120ms ease !important;
}

.cke_chrome.cv-skin a.cke_button:hover,
.site-content .cke_chrome a.cke_button:hover,
.cke_chrome.cv-skin a.cke_button:focus,
.site-content .cke_chrome a.cke_button:focus,
.cke_chrome.cv-skin a.cke_button.cv-table-btn-open,
.site-content .cke_chrome a.cke_button.cv-table-btn-open {
  border: 0 !important;
  background: var(--cv-editor-hover, var(--cv-editor-hover, #e4f0ec)) !important;
  background-image: none !important;
  box-shadow: none !important;
  outline: none !important;
}

.cke_chrome.cv-skin a.cke_button:focus-visible,
.site-content .cke_chrome a.cke_button:focus-visible,
.cke_chrome.cv-skin a.cke_combo_button:focus-visible,
.site-content .cke_chrome a.cke_combo_button:focus-visible {
  outline: 2px solid rgba(63, 117, 105, 0.55) !important;
  outline-offset: 1px !important;
}

.cke_chrome.cv-skin a.cke_button:active,
.site-content .cke_chrome a.cke_button:active {
  transform: translateY(1px) !important;
}

.cke_chrome.cv-skin a.cke_button_on,
.site-content .cke_chrome a.cke_button_on {
  border: 0 !important;
  background: var(--cv-editor-accent-strong, var(--cv-editor-accent-strong, #2f6257)) !important;
  background-image: none !important;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.04) !important;
}

/* Ativo + hover: mantém fundo escuro (evita ícone branco no menta claro) */
.cke_chrome.cv-skin a.cke_button_on:hover,
.site-content .cke_chrome a.cke_button_on:hover,
.cke_chrome.cv-skin a.cke_button_on:focus,
.site-content .cke_chrome a.cke_button_on:focus {
  background: var(--cv-editor-accent, var(--cv-editor-accent, #3f7569)) !important;
  background-image: none !important;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.06) !important;
}

.cke_chrome.cv-skin a.cke_button_disabled,
.site-content .cke_chrome a.cke_button_disabled,
.cke_chrome.cv-skin a.cke_button_disabled:hover,
.site-content .cke_chrome a.cke_button_disabled:hover {
  opacity: 0.3 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  cursor: default !important;
  transform: none !important;
}

.cke_chrome.cv-skin .cke_button_label,
.site-content .cke_chrome .cke_button_label {
  display: none !important;
}

.cke_chrome.cv-skin .cke_button_arrow,
.site-content .cke_chrome .cke_button_arrow {
  margin: 1px 0 0 3px !important;
  border-left: 3px solid transparent !important;
  border-right: 3px solid transparent !important;
  border-top: 4px solid var(--cv-editor-ink, var(--cv-editor-ink, #23483f)) !important;
}

/* Icones Font Awesome */
.cke_chrome.cv-skin .cke_button_icon,
.site-content .cke_chrome .cke_button_icon {
  display: block !important;
  position: relative !important;
  float: none !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: none !important;
  background-image: none !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

.cke_chrome.cv-skin .cke_button_icon::before,
.site-content .cke_chrome .cke_button_icon::before {
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  color: var(--cv-editor-ink, var(--cv-editor-ink, #23483f)) !important;
  font-family: "Font Awesome 6 Free" !important;
  font-size: 13px !important;
  font-style: normal !important;
  font-weight: 900 !important;
  line-height: 16px !important;
  text-align: center !important;
  speak: never;
  -webkit-font-smoothing: antialiased;
}

.cke_chrome.cv-skin a.cke_button_on .cke_button_icon::before,
.site-content .cke_chrome a.cke_button_on .cke_button_icon::before,
.cke_chrome.cv-skin a.cke_button_on:hover .cke_button_icon::before,
.site-content .cke_chrome a.cke_button_on:hover .cke_button_icon::before,
.cke_chrome.cv-skin a.cke_button_on:focus .cke_button_icon::before,
.site-content .cke_chrome a.cke_button_on:focus .cke_button_icon::before {
  color: var(--cv-editor-surface, #ffffff) !important;
}

.cke_button__undo_icon::before { content: "\f0e2"; }
.cke_button__redo_icon::before { content: "\f01e"; }
.cke_button__bold_icon::before { content: "\f032"; }
.cke_button__italic_icon::before { content: "\f033"; }
.cke_button__underline_icon::before { content: "\f0cd"; }
.cke_button__strike_icon::before { content: "\f0cc"; }
.cke_button__removeformat_icon::before { content: "\f12d"; }
.cke_button__copyformatting_icon::before { content: "\f1fc"; }
.cke_button__pastefromword_icon::before { content: "\f1c2"; } /* file-word */

/* Colar do Word: sem caixa própria — a moldura é a do grupo, como nos vizinhos.
   O ícone é um pouco maior que os outros e esse é todo o destaque.
   O .cke_button_icon tem line-height:0, então um ::before em bloco mais alto
   que 16px desce da linha de base e o ícone fica pendurado; por isso o
   alinhamento aqui é feito no próprio span, com flex. */
.cke_chrome.cv-skin a.cke_button.cke_button__pastefromword .cke_button_icon,
.site-content .cke_chrome a.cke_button.cke_button__pastefromword .cke_button_icon {
  display: flex !important;
  width: 20px !important;
  height: 20px !important;
  align-items: center !important;
  justify-content: center !important;
}

.cke_chrome.cv-skin a.cke_button.cke_button__pastefromword .cke_button_icon::before,
.site-content .cke_chrome a.cke_button.cke_button__pastefromword .cke_button_icon::before {
  width: auto !important;
  height: auto !important;
  color: #245f55 !important;
  font-size: 17px !important;
  line-height: 1 !important;
  opacity: 1 !important;
  filter: none !important;
}

.cke_button__numberedlist_icon::before { content: "\f0cb"; }
.cke_button__bulletedlist_icon::before { content: "\f0ca"; }

/* O iframe do painel é inline e senta na linha de base: sobra por baixo o
   espaço do descendente, uns 3px de faixa morta em todo combo. */
.cke_panel > iframe,
.cke_combopanel > iframe {
  display: block;
}

.cke_button__outdent_icon::before { content: "\f03b"; }
.cke_button__indent_icon::before { content: "\f03c"; }
.cke_button__justifyleft_icon::before { content: "\f036"; }
.cke_button__justifycenter_icon::before { content: "\f037"; }
.cke_button__justifyright_icon::before { content: "\f038"; }
.cke_button__justifyblock_icon::before { content: "\f039"; }
.cke_button__table_icon::before { content: "\f0ce"; }
.cke_button__horizontalrule_icon::before { content: "\f068"; }
.cke_button__showblocks_icon::before { content: "\f03e"; }
.cke_button__maximize_icon::before { content: "\f065"; }
.cke_button__source_icon::before { content: "\f121"; }
.cke_button__find_icon::before { content: "\f002"; }
.cke_button__replaceselection_icon::before { content: "\f044"; }
.cke_button__link_icon::before { content: "\f0c1"; }
.cke_button__unlink_icon::before { content: "\f127"; }

/* Ações CV na toolbar */
.cke_button__cvloadword_icon::before { content: "\f574"; } /* file-arrow-up */
.cke_button__cvdownloaddoc_icon::before { content: "\f1c2"; } /* file-word */
.cke_button__cvupdatevars_icon::before { content: "\f2f1"; } /* rotate */
.cke_button__cvloaddoc_icon::before { content: "\f56f"; } /* file-import */
.cke_button__cvsavedoc_icon::before { content: "\f0c7"; } /* floppy-disk */
.cke_button__cvformatar_icon::before { content: "\f0d0"; } /* magic */
.cke_button__cvmacros_icon::before { content: "\f5bf"; } /* stamp */
.cke_button__cvcopy_icon::before { content: "\f0c5"; } /* copy */
.cke_button__cvlimparhtml_icon::before { content: "\f12d"; } /* eraser */

/* Confirmação de "copiado": o próprio ícone vira um check por um instante */
.cke_chrome.cv-skin a.cke_button.cv-btn-copiado .cke_button_icon::before,
.site-content .cke_chrome a.cke_button.cv-btn-copiado .cke_button_icon::before {
  content: "\f00c" !important;
  color: #2e7d55 !important;
}

/* Copiar HTML: alinhado ao Ver código */
.cke_chrome.cv-skin .cv-copyhtml-wrap,
.site-content .cke_chrome .cv-copyhtml-wrap {
  display: inline-flex !important;
  align-items: center !important;
  align-self: center !important;
  margin: 0 0 0 4px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  line-height: 0 !important;
}

.cke_chrome.cv-skin .cv-copyhtml-btn,
.site-content .cke_chrome .cv-copyhtml-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: 0;
  padding: 0 9px;
  height: 28px;
  border: 1px solid rgba(156, 184, 176, 0.7);
  border-radius: 8px;
  background: #fff;
  color: var(--cv-editor-ink, #23483f);
  font-family: inherit;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.01em;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(35, 72, 63, 0.06);
  transition: background-color 120ms ease, border-color 120ms ease;
}

.cke_chrome.cv-skin .cv-copyhtml-btn i,
.site-content .cke_chrome .cv-copyhtml-btn i {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  font-size: 11px;
  font-style: normal;
  color: var(--cv-editor-accent-strong, #2f6257);
  line-height: 1;
  width: 12px;
  text-align: center;
}

.cke_chrome.cv-skin .cv-copyhtml-btn span,
.site-content .cke_chrome .cv-copyhtml-btn span {
  color: var(--cv-editor-ink, #23483f);
  font-weight: 700;
}

.cke_chrome.cv-skin .cv-copyhtml-btn:hover,
.site-content .cke_chrome .cv-copyhtml-btn:hover {
  background: var(--cv-editor-hover, #e4f0ec);
  border-color: #8fb5aa;
}

.cke_chrome.cv-skin .cv-copyhtml-btn:active,
.site-content .cke_chrome .cv-copyhtml-btn:active {
  transform: translateY(1px);
}

.cke_chrome.cv-skin .cv-copyhtml-btn:focus-visible,
.site-content .cke_chrome .cv-copyhtml-btn:focus-visible {
  outline: 2px solid rgba(63, 117, 105, 0.55);
  outline-offset: 1px;
}

.cke_button__cvvalidate_icon::before { content: "\f188"; } /* bug */
.cke_button__cvfindwhite_icon::before { content: "\f5b7"; } /* signature */
.cke_button__cvhighlightvars_icon::before {
  content: "" !important;
}

/* Ícone [[ ]] em SVG — limpo, alinhado aos outros */
.cke_chrome.cv-skin a.cke_button.cke_button__cvhighlightvars .cke_button_icon,
.site-content .cke_chrome a.cke_button.cke_button__cvhighlightvars .cke_button_icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M5.2 3.2H3.4v9.6h1.8' stroke='%2323483f' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M10.8 3.2h1.8v9.6h-1.8' stroke='%2323483f' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3Crect x='6.1' y='6.4' width='3.8' height='3.2' rx='0.7' fill='%23f0c94a'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 15px 15px !important;
}

.cke_chrome.cv-skin a.cke_button.cke_button__cvhighlightvars.cke_button_on .cke_button_icon,
.site-content .cke_chrome a.cke_button.cke_button__cvhighlightvars.cke_button_on .cke_button_icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M5.2 3.2H3.4v9.6h1.8' stroke='%23eef6f2' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M10.8 3.2h1.8v9.6h-1.8' stroke='%23eef6f2' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3Crect x='6.1' y='6.4' width='3.8' height='3.2' rx='0.7' fill='%23f0c94a'/%3E%3C/svg%3E") !important;
}

.cke_chrome.cv-skin a.cke_button.cke_button__cvhighlightvars .cke_button_icon::before,
.site-content .cke_chrome a.cke_button.cke_button__cvhighlightvars .cke_button_icon::before {
  content: "" !important;
  display: none !important;
}

/* Caixinha de padrão da variável (host page — fora do iframe contenteditable) */
.cv-var-pattern-pop {
  position: fixed;
  z-index: 100000;
  padding: 4px;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 6px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.14);
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 12px;
  color: #333;
  line-height: 1.2;
  user-select: none;
  box-sizing: border-box;
}

.cv-var-pattern-pop__row {
  display: flex;
  flex-wrap: nowrap;
  gap: 4px;
  align-items: center;
}

.cv-var-pattern-pop__field {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 3px;
  margin: 0;
  cursor: default;
}

.cv-var-pattern-pop__lab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 16px;
  height: 16px;
  padding: 0 3px;
  border-radius: 3px;
  font-size: 9px;
  font-weight: 700;
  color: var(--cv-editor-surface, #ffffff);
  background: #6b7280;
  flex-shrink: 0;
}

/* Mesmas cores do destaque no texto (contents-cv.css): a legenda só ensina o
   código de cores se pintar exatamente igual ao que aparece no contrato. */
.cv-var-pattern-pop__lab.lab-n { background: #cf3b30; }
.cv-var-pattern-pop__lab.lab-o { background: #b45309; }
.cv-var-pattern-pop__lab.lab-g { background: #1e7d3a; }
.cv-var-pattern-pop__lab.lab-m { background: #2b7fc4; }
.cv-var-pattern-pop__lab.lab-i { background: #7c4dcf; }
.cv-var-pattern-pop__lab.lab-num { background: #0e7490; }

.cv-var-pattern-pop__input {
  width: 36px;
  height: 24px;
  box-sizing: border-box;
  padding: 1px 4px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
  text-align: center;
  color: #222;
  background: #fafafa;
  outline: none;
}

.cv-var-pattern-pop__input:focus {
  border-color: #c48a12;
  background: #fff;
  box-shadow: 0 0 0 2px rgba(196, 138, 18, 0.18);
}

.cke_chrome.cv-skin a.cke_button.cke_button__cvloadword .cke_button_icon::before,
.site-content .cke_chrome a.cke_button.cke_button__cvloadword .cke_button_icon::before,
.cke_chrome.cv-skin a.cke_button.cke_button__cvdownloaddoc .cke_button_icon::before,
.site-content .cke_chrome a.cke_button.cke_button__cvdownloaddoc .cke_button_icon::before,
.cke_chrome.cv-skin a.cke_button.cke_button__cvupdatevars .cke_button_icon::before,
.site-content .cke_chrome a.cke_button.cke_button__cvupdatevars .cke_button_icon::before,
.cke_chrome.cv-skin a.cke_button.cke_button__cvloaddoc .cke_button_icon::before,
.site-content .cke_chrome a.cke_button.cke_button__cvloaddoc .cke_button_icon::before,
.cke_chrome.cv-skin a.cke_button.cke_button__cvsavedoc .cke_button_icon::before,
.site-content .cke_chrome a.cke_button.cke_button__cvsavedoc .cke_button_icon::before,
.cke_chrome.cv-skin a.cke_button.cke_button__cvformatar .cke_button_icon::before,
.site-content .cke_chrome a.cke_button.cke_button__cvformatar .cke_button_icon::before,
.cke_chrome.cv-skin a.cke_button.cke_button__cvvalidate .cke_button_icon::before,
.site-content .cke_chrome a.cke_button.cke_button__cvvalidate .cke_button_icon::before,
.cke_chrome.cv-skin a.cke_button.cke_button__cvfindwhite .cke_button_icon::before,
.site-content .cke_chrome a.cke_button.cke_button__cvfindwhite .cke_button_icon::before {
  color: var(--cv-editor-ink, var(--cv-editor-ink, #23483f)) !important;
  font-size: 13px !important;
  filter: none;
}

/* Converter variáveis: o ícone gira enquanto a conversão roda. É animação de
   transform, tocada na thread de composição — continua girando durante o
   trecho síncrono que trava o resto da página. */
@keyframes cv-girar-icone {
  to { transform: rotate(360deg); }
}

.cke_chrome.cv-skin a.cke_button.cv-girando .cke_button_icon,
.site-content .cke_chrome a.cke_button.cv-girando .cke_button_icon {
  animation: cv-girar-icone 900ms linear infinite;
}

@media (prefers-reduced-motion: reduce) {
  .cke_chrome.cv-skin a.cke_button.cv-girando .cke_button_icon,
  .site-content .cke_chrome a.cke_button.cv-girando .cke_button_icon {
    animation: none;
  }
}

/* Formatar contrato: a varinha balança e solta brilhos enquanto roda. Mesmo
   motivo do giro acima — transform e opacity seguem animando durante o trecho
   síncrono que trava a página. */
@keyframes cv-magica-varinha {
  0%, 100% { transform: rotate(0deg) scale(1); }
  20% { transform: rotate(-14deg) scale(1.06); }
  45% { transform: rotate(12deg) scale(1.1); }
  70% { transform: rotate(-8deg) scale(1.04); }
}

@keyframes cv-magica-brilho {
  0%, 100% { opacity: 0; transform: scale(0.5); }
  35% { opacity: 1; transform: scale(1.15); }
  65% { opacity: 0.35; transform: scale(0.85); }
}

/* O estado "ocupado" apaga o botão (opacity .3); durante a mágica ele fica
   aceso de propósito. */
.cke_chrome.cv-skin a.cke_button.cv-magica,
.site-content .cke_chrome a.cke_button.cv-magica {
  position: relative !important;
  opacity: 1 !important;
  background: rgba(196, 138, 18, 0.16) !important;
  box-shadow: inset 0 0 0 1px rgba(196, 138, 18, 0.4) !important;
}

.cke_chrome.cv-skin a.cke_button.cv-magica .cke_button_icon,
.site-content .cke_chrome a.cke_button.cv-magica .cke_button_icon {
  animation: cv-magica-varinha 700ms ease-in-out infinite;
}

.cke_chrome.cv-skin a.cke_button.cv-magica .cke_button_icon::before,
.site-content .cke_chrome a.cke_button.cv-magica .cke_button_icon::before {
  color: #b07d0a !important;
  text-shadow: 0 0 6px rgba(226, 179, 60, 0.75);
}

/* Três pontinhos dourados piscando ao redor da varinha */
.cke_chrome.cv-skin a.cke_button.cv-magica::after,
.site-content .cke_chrome a.cke_button.cv-magica::after {
  content: "";
  position: absolute;
  top: 4px;
  right: 4px;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: #e2b33c;
  box-shadow:
    -14px 3px 0 -0.5px #e2b33c,
    -5px 14px 0 -1px #e2b33c;
  animation: cv-magica-brilho 700ms ease-in-out infinite;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .cke_chrome.cv-skin a.cke_button.cv-magica .cke_button_icon,
  .site-content .cke_chrome a.cke_button.cv-magica .cke_button_icon,
  .cke_chrome.cv-skin a.cke_button.cv-magica::after,
  .site-content .cke_chrome a.cke_button.cv-magica::after {
    animation: none;
  }
}

/* Limpar HTML: a vassoura varre enquanto a limpeza roda. Mesma ideia do giro e
   da varinha — só transform, que segue animando durante o trecho síncrono. */
@keyframes cv-varrer-vassoura {
  0%, 100% { transform: rotate(0deg) translateX(0); }
  25% { transform: rotate(-16deg) translateX(-1.5px); }
  50% { transform: rotate(0deg) translateX(0); }
  75% { transform: rotate(16deg) translateX(1.5px); }
}

/* O estado "ocupado" apaga o botão (opacity .3); durante a varrida ele fica
   aceso, senão a animação não aparece. */
.cke_chrome.cv-skin a.cke_button.cv-varrendo,
.site-content .cke_chrome a.cke_button.cv-varrendo {
  opacity: 1 !important;
  background: rgba(63, 117, 105, 0.16) !important;
  box-shadow: inset 0 0 0 1px rgba(63, 117, 105, 0.4) !important;
}

.cke_chrome.cv-skin a.cke_button.cv-varrendo .cke_button_icon,
.site-content .cke_chrome a.cke_button.cv-varrendo .cke_button_icon {
  animation: cv-varrer-vassoura 620ms ease-in-out infinite;
}

.cke_chrome.cv-skin a.cke_button.cv-varrendo .cke_button_icon::before,
.site-content .cke_chrome a.cke_button.cv-varrendo .cke_button_icon::before {
  color: #3f7569 !important;
}

@media (prefers-reduced-motion: reduce) {
  .cke_chrome.cv-skin a.cke_button.cv-varrendo .cke_button_icon,
  .site-content .cke_chrome a.cke_button.cv-varrendo .cke_button_icon {
    animation: none;
  }
}

/* Ativo: ícone claro no fundo verde (senão some) */
.cke_chrome.cv-skin a.cke_button.cke_button_on .cke_button_icon::before,
.site-content .cke_chrome a.cke_button.cke_button_on .cke_button_icon::before,
.cke_chrome.cv-skin a.cke_button.cke_button_on:hover .cke_button_icon::before,
.site-content .cke_chrome a.cke_button.cke_button_on:hover .cke_button_icon::before,
.cke_chrome.cv-skin a.cke_button.cke_button_on:focus .cke_button_icon::before,
.site-content .cke_chrome a.cke_button.cke_button_on:focus .cke_button_icon::before {
  color: var(--cv-editor-surface, #ffffff) !important;
}

/* Substituição rápida da seleção — card próprio (não parece chip da toolbar) */
.cke_chrome.cv-skin .cv-selection-replace,
.site-content .cke_chrome .cv-selection-replace {
  position: absolute;
  z-index: 3100;
  top: 46px;
  left: auto;
  right: 20px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  width: min(470px, calc(100% - 28px));
  height: auto;
  min-height: 0;
  max-height: calc(100% - 64px);
  padding: 0;
  box-sizing: border-box;
  border: 1px solid #9eb8e8;
  border-radius: 12px;
  background: #f4f7fd;
  color: #1e2f4d;
  font-family: Arial, Helvetica, sans-serif;
  line-height: normal;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.7) inset,
    0 12px 28px rgba(40, 70, 130, 0.16),
    0 2px 6px rgba(40, 70, 130, 0.08);
  overflow: hidden;
}

.cke_chrome.cv-skin .cv-selection-replace[hidden],
.site-content .cke_chrome .cv-selection-replace[hidden] {
  display: none !important;
}

.cke_chrome.cv-skin .cv-selection-replace__head,
.site-content .cke_chrome .cv-selection-replace__head {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 7px 8px 6px 10px;
  border-bottom: 1px solid #c9d7f0;
  background: linear-gradient(180deg, #e8eefb 0%, #dde7f8 100%);
}

.cke_chrome.cv-skin .cv-selection-replace__badge,
.site-content .cke_chrome .cv-selection-replace__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  border-radius: 5px;
  background: #3d5f9a;
  color: #fff;
  font-size: 0;
  line-height: 0;
}

.cke_chrome.cv-skin .cv-selection-replace__badge::before,
.site-content .cke_chrome .cv-selection-replace__badge::before {
  content: "\f044";
  display: block;
  color: #fff;
  font-family: "Font Awesome 6 Free";
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  text-align: center;
}

.cke_chrome.cv-skin .cv-selection-replace__title,
.site-content .cke_chrome .cv-selection-replace__title {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  color: #2a4570;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.cke_chrome.cv-skin .cv-selection-replace__body,
.site-content .cke_chrome .cv-selection-replace__body {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 7px;
  padding: 8px;
  overflow-y: auto;
}

.cke_chrome.cv-skin .cv-selection-replace__selection,
.site-content .cke_chrome .cv-selection-replace__selection {
  display: none;
}

.cke_chrome.cv-skin .cv-selection-replace__pairs,
.site-content .cke_chrome .cv-selection-replace__pairs {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.cke_chrome.cv-skin .cv-selection-replace__pair,
.site-content .cke_chrome .cv-selection-replace__pair {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
}

.cke_chrome.cv-skin .cv-selection-replace__pair + .cv-selection-replace__pair,
.site-content .cke_chrome .cv-selection-replace__pair + .cv-selection-replace__pair {
  padding-top: 6px;
  border-top: 1px dashed #c3d2ee;
}

.cke_chrome.cv-skin .cv-selection-replace__field,
.site-content .cke_chrome .cv-selection-replace__field {
  display: flex;
  align-items: center;
  align-self: center;
  flex: 1 1 0;
  min-width: 0;
  height: 28px;
  margin: 0 !important;
  padding: 0 7px;
  box-sizing: border-box;
  border: 1px solid #b7c8e6;
  border-radius: 8px;
  background: #fff;
  transition: border-color 120ms ease, box-shadow 120ms ease;
}

.cke_chrome.cv-skin .cv-selection-replace__field:focus-within,
.site-content .cke_chrome .cv-selection-replace__field:focus-within {
  border-color: #4a6fad;
  box-shadow: 0 0 0 2px rgba(74, 111, 173, 0.18);
}

.cke_chrome.cv-skin .cv-selection-replace__field-label,
.site-content .cke_chrome .cv-selection-replace__field-label {
  display: block;
  flex: 0 0 28px;
  width: 28px;
  margin-right: 4px;
  color: #5a7198;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
}

.cke_chrome.cv-skin .cv-selection-replace__field input,
.site-content .cke_chrome .cv-selection-replace__field input {
  display: block;
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  height: 24px;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  border: 0;
  outline: 0;
  background: transparent;
  color: #1e2f4d;
  font: 11px/24px Arial, Helvetica, sans-serif;
}

.cke_chrome.cv-skin .cv-selection-replace__arrow,
.site-content .cke_chrome .cv-selection-replace__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  flex: 0 0 16px;
  width: 16px;
  height: 28px;
  color: #6b84ad;
  font-size: 12px;
  font-weight: 700;
  line-height: 28px;
}

.cke_chrome.cv-skin .cv-selection-replace__apply,
.site-content .cke_chrome .cv-selection-replace__apply {
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  flex: 0 0 auto;
  width: auto;
  min-width: 28px;
  min-height: 28px;
  height: 28px;
  padding: 0 8px;
  box-sizing: border-box;
  margin: 0 !important;
  border: 0;
  border-radius: 8px;
  background: #3d5f9a;
  color: #fff;
  font: 800 10px/1 Arial, Helvetica, sans-serif;
  letter-spacing: 0.03em;
  position: static !important;
  top: auto !important;
  bottom: auto !important;
  vertical-align: middle !important;
  transform: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  cursor: pointer;
}

.cke_chrome.cv-skin .cv-selection-replace__footer,
.site-content .cke_chrome .cv-selection-replace__footer {
  display: flex;
  align-items: center;
  gap: 8px;
}

.cke_chrome.cv-skin .cv-selection-replace__add,
.site-content .cke_chrome .cv-selection-replace__add {
  min-height: 28px;
  padding: 0 8px;
  border: 1px dashed #9eb8e8;
  border-radius: 8px;
  background: transparent;
  color: #3d5f9a;
  font: 700 9px/1 Arial, Helvetica, sans-serif;
  cursor: pointer;
}

.cke_chrome.cv-skin .cv-selection-replace__add:hover,
.site-content .cke_chrome .cv-selection-replace__add:hover {
  background: #e8eefb;
  border-color: #4a6fad;
}

.cke_chrome.cv-skin .cv-selection-replace__apply,
.site-content .cke_chrome .cv-selection-replace__apply { margin-left: auto !important; }

.cke_chrome.cv-skin .cv-selection-replace__remove,
.site-content .cke_chrome .cv-selection-replace__remove {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #6b84ad;
  font: 700 14px/1 Arial, Helvetica, sans-serif;
  cursor: pointer;
}

.cke_chrome.cv-skin .cv-selection-replace__remove:hover,
.site-content .cke_chrome .cv-selection-replace__remove:hover {
  color: #875a2c;
  background: #fff3dd;
}

.cke_chrome.cv-skin .cv-selection-replace__remove[hidden],
.site-content .cke_chrome .cv-selection-replace__remove[hidden] { display: none !important; }

.cke_chrome.cv-skin .cv-selection-replace__apply:hover,
.site-content .cke_chrome .cv-selection-replace__apply:hover {
  background: #314d7e;
}

.cke_chrome.cv-skin .cv-selection-replace__apply:disabled,
.site-content .cke_chrome .cv-selection-replace__apply:disabled {
  opacity: 0.45;
  cursor: default;
}

.cke_chrome.cv-skin .cv-selection-replace__close,
.site-content .cke_chrome .cv-selection-replace__close {
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  min-width: 24px;
  min-height: 24px;
  padding: 0;
  box-sizing: border-box;
  margin: 0 0 0 auto !important;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #6b84ad;
  font-size: 0;
  line-height: 0;
  position: static !important;
  top: auto !important;
  bottom: auto !important;
  vertical-align: middle !important;
  transform: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  cursor: pointer;
}

.cke_chrome.cv-skin .cv-selection-replace__close::before,
.site-content .cke_chrome .cv-selection-replace__close::before {
  content: "\f00d";
  display: block;
  width: 12px;
  height: 12px;
  color: inherit;
  font-family: "Font Awesome 6 Free";
  font-size: 11px;
  font-weight: 900;
  line-height: 12px;
  text-align: center;
}

.cke_chrome.cv-skin .cv-selection-replace__close:hover,
.site-content .cke_chrome .cv-selection-replace__close:hover {
  background: rgba(61, 95, 154, 0.12);
  color: #2a4570;
}

.cke_chrome.cv-skin .cv-selection-replace__feedback,
.site-content .cke_chrome .cv-selection-replace__feedback {
  position: static;
  top: auto;
  left: auto;
  right: auto;
  max-width: none;
  margin: 0;
  padding: 6px 10px 8px;
  border: 0;
  border-top: 1px dashed #c3d2ee;
  border-radius: 0;
  background: #eaf0fb;
  color: #4a628c;
  font-size: 10px;
  line-height: 1.35;
  box-shadow: none;
}

.cke_chrome.cv-skin .cv-selection-replace__feedback:empty,
.site-content .cke_chrome .cv-selection-replace__feedback:empty {
  display: none;
}

.cke_chrome.cv-skin .cv-selection-replace.is-error,
.site-content .cke_chrome .cv-selection-replace.is-error {
  border-color: #b8a07a;
}

.cke_chrome.cv-skin .cv-selection-replace.is-error .cv-selection-replace__head,
.site-content .cke_chrome .cv-selection-replace.is-error .cv-selection-replace__head {
  background: linear-gradient(180deg, #f8efd8 0%, #f0e4c4 100%);
  border-bottom-color: #e4d3a8;
}

.cke_chrome.cv-skin .cv-selection-replace.is-error .cv-selection-replace__feedback,
.site-content .cke_chrome .cv-selection-replace.is-error .cv-selection-replace__feedback {
  border-top-color: #e4d3a8;
  background: #fff8ea;
  color: #875a2c;
}

.cke_chrome.cv-skin .cv-selection-replace.is-error .cv-selection-replace__selection,
.site-content .cke_chrome .cv-selection-replace.is-error .cv-selection-replace__selection {
  color: #97632d;
}

@media (max-width: 760px) {
  .cke_chrome.cv-skin .cv-selection-replace,
  .site-content .cke_chrome .cv-selection-replace {
    width: min(470px, calc(100% - 28px));
    left: auto;
    right: 20px;
  }
}

@media (max-width: 520px) {
  .cke_chrome.cv-skin .cv-selection-replace__apply,
  .site-content .cke_chrome .cv-selection-replace__apply {
    flex-basis: 28px;
    width: 28px;
    padding: 0;
    overflow: hidden;
    font-size: 0;
  }

  .cke_chrome.cv-skin .cv-selection-replace__apply::before,
  .site-content .cke_chrome .cv-selection-replace__apply::before {
    content: "✓";
    font-size: 12px;
  }
}

/* Cores: mantem o A tipografico com indicador da cor */
.cke_button__textcolor_icon::before,
.cke_button__bgcolor_icon::before {
  content: "A" !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

.cke_button__textcolor_icon::after,
.cke_button__bgcolor_icon::after {
  content: "" !important;
  position: absolute !important;
  right: 1px !important;
  bottom: -1px !important;
  left: 1px !important;
  height: 3px !important;
  border-radius: 2px !important;
  pointer-events: none !important;
}

.cke_button__textcolor_icon::after { background: #27332f !important; }
.cke_button__bgcolor_icon::after { background: #e9c84b !important; }

/* Seletores de formato, fonte e tamanho */
.cke_chrome.cv-skin .cke_combo,
.site-content .cke_chrome .cke_combo {
  display: block !important;
  float: none !important;
  margin: 0 !important;
  padding: 1px !important;
  border: 1px solid rgba(156, 184, 176, 0.55) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.88) !important;
  box-shadow: 0 1px 2px rgba(35, 72, 63, 0.04) !important;
}

.cke_chrome.cv-skin .cke_combo_label,
.site-content .cke_chrome .cke_combo_label {
  display: none !important;
}

.cke_chrome.cv-skin a.cke_combo_button,
.site-content .cke_chrome a.cke_combo_button {
  display: inline-flex !important;
  align-items: center !important;
  float: none !important;
  height: 26px !important;
  margin: 0 !important;
  padding: 0 5px 0 7px !important;
  box-sizing: border-box !important;
  gap: 4px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  transition: background-color 120ms ease !important;
}

.cke_chrome.cv-skin a.cke_combo_button:hover,
.site-content .cke_chrome a.cke_combo_button:hover,
.cke_chrome.cv-skin a.cke_combo_button:focus,
.site-content .cke_chrome a.cke_combo_button:focus,
.cke_chrome.cv-skin .cke_combo_on a.cke_combo_button,
.site-content .cke_chrome .cke_combo_on a.cke_combo_button {
  border: 0 !important;
  background: var(--cv-editor-hover, var(--cv-editor-hover, #e4f0ec)) !important;
  background-image: none !important;
  box-shadow: none !important;
  outline: none !important;
}

.cke_chrome.cv-skin .cke_combo_text,
.site-content .cke_chrome .cke_combo_text,
.cke_ltr .cke_chrome.cv-skin .cke_combo_text,
.cke_ltr .site-content .cke_chrome .cke_combo_text {
  display: inline-block !important;
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 104px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  color: var(--cv-editor-ink, var(--cv-editor-ink, #23483f)) !important;
  background: transparent !important;
  font-family: "Segoe UI", system-ui, sans-serif !important;
  font-size: 11.5px !important;
  font-weight: 500 !important;
  line-height: 26px !important;
  text-overflow: ellipsis !important;
  text-shadow: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

.cke_chrome.cv-skin .cke_combo_open,
.site-content .cke_chrome .cke_combo_open,
.cke_ltr .cke_chrome.cv-skin .cke_combo_open,
.cke_ltr .site-content .cke_chrome .cke_combo_open {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  float: none !important;
  width: 10px !important;
  height: 14px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  line-height: 1 !important;
}

.cke_chrome.cv-skin .cke_combo_arrow,
.site-content .cke_chrome .cke_combo_arrow,
.cke_ltr .cke_chrome.cv-skin .cke_combo_arrow,
.cke_ltr .site-content .cke_chrome .cke_combo_arrow {
  display: block !important;
  float: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border-top: 4px solid var(--cv-editor-muted, var(--cv-editor-muted, #678179)) !important;
  border-right: 3.5px solid transparent !important;
  border-left: 3.5px solid transparent !important;
  opacity: 1 !important;
  font-size: 0 !important;
}

/* Area de conteudo e rodape */
.cke_chrome.cv-skin .cke_contents,
.site-content .cke_chrome .cke_contents {
  border: 0 !important;
  background: var(--cv-editor-surface, #ffffff) !important;
  box-shadow: inset 0 1px 0 rgba(35, 72, 63, 0.025) !important;
}

.cke_chrome.cv-skin .cke_bottom,
.site-content .cke_chrome .cke_bottom {
  min-height: 9px !important;
  padding: 2px 7px !important;
  border-top: 1px solid #e1eae7 !important;
  background: var(--cv-editor-rodape, #f8fbfa) !important;
  background-image: none !important;
  box-shadow: none !important;
}

.cke_chrome.cv-skin .cke_resizer,
.site-content .cke_chrome .cke_resizer {
  margin-top: 2px !important;
  border-color: transparent #829f97 transparent transparent !important;
  opacity: 0.75 !important;
}

/* Menus flutuantes */
.cke_panel {
  overflow: hidden !important;
  border: 1px solid #c7d8d2 !important;
  border-radius: 12px !important;
  background: var(--cv-editor-surface, #ffffff) !important;
  box-shadow: 0 16px 36px rgba(35, 72, 63, 0.18) !important;
}

.cke_panel_frame {
  border-radius: 11px !important;
  background: var(--cv-editor-surface, #ffffff) !important;
}

.cke_combopanel__format {
  width: 218px !important;
  height: 286px !important;
}

.cke_combopanel__font {
  width: 228px !important;
  height: 304px !important;
}

.cke_combopanel__fontsize {
  width: 166px !important;
  height: 304px !important;
}

.cke_panel:not(.cke_combopanel):not(.cke_menu_panel) {
  width: 202px !important;
  height: 242px !important;
}

.cke_menu_panel,
.cke_combopanel {
  border-radius: 12px !important;
}

.cke_menu_panel {
  width: 232px !important;
  min-width: 232px !important;
}

/* Dialogos do CKEditor */
.cke_dialog_body {
  overflow: hidden !important;
  border: 1px solid #c7d8d2 !important;
  border-radius: 14px !important;
  background: var(--cv-editor-surface, #ffffff) !important;
  box-shadow: 0 24px 56px rgba(28, 58, 51, 0.22) !important;
}

.cke_dialog_title {
  padding: 15px 18px !important;
  border-bottom: 1px solid #d7e3df !important;
  background: var(--cv-editor-toolbar, #f3f8f6) !important;
  background-image: none !important;
  color: var(--cv-editor-ink, #23483f) !important;
  font-family: "Segoe UI", system-ui, sans-serif !important;
  font-size: 15px !important;
  font-weight: 650 !important;
  text-shadow: none !important;
}

.cke_dialog_footer {
  padding: 10px 14px !important;
  border-top: 1px solid #d7e3df !important;
  background: var(--cv-editor-rodape, #f8fbfa) !important;
  background-image: none !important;
}

a.cke_dialog_ui_button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 76px !important;
  height: 34px !important;
  box-sizing: border-box !important;
  padding: 0 14px !important;
  border: 1px solid #bdcec8 !important;
  border-radius: 8px !important;
  background: var(--cv-editor-surface, #ffffff) !important;
  background-image: none !important;
  box-shadow: 0 1px 2px rgba(35, 72, 63, 0.07) !important;
  transition: border-color 100ms ease, background-color 100ms ease, transform 100ms ease !important;
}

a.cke_dialog_ui_button:hover,
a.cke_dialog_ui_button:focus {
  border-color: #8eafa6 !important;
  background: #edf5f2 !important;
  outline: none !important;
}

a.cke_dialog_ui_button:active {
  transform: translateY(1px) !important;
}

a.cke_dialog_ui_button span.cke_dialog_ui_button {
  display: block !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #294f46 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-family: "Segoe UI", system-ui, sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-shadow: none !important;
}

a.cke_dialog_ui_button_ok {
  border-color: var(--cv-editor-accent-strong, #2f6257) !important;
  background: var(--cv-editor-accent-strong, #2f6257) !important;
  box-shadow: 0 2px 5px rgba(47, 98, 87, 0.2) !important;
}

a.cke_dialog_ui_button_ok:hover,
a.cke_dialog_ui_button_ok:focus {
  border-color: #28564c !important;
  background: #28564c !important;
}

a.cke_dialog_ui_button_ok span.cke_dialog_ui_button {
  color: var(--cv-editor-surface, #ffffff) !important;
}

.cke_dialog_close_button {
  top: 11px !important;
  right: 12px !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 7px !important;
  background: transparent !important;
  transition: background-color 100ms ease !important;
}

.cke_dialog_close_button:hover,
.cke_dialog_close_button:focus {
  background: #e5f0ed !important;
  outline: none !important;
}

.cke_dialog_close_button .cke_label {
  display: block !important;
  width: 28px !important;
  height: 28px !important;
  color: #607a73 !important;
  font-family: "Segoe UI", system-ui, sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 28px !important;
  text-align: center !important;
}

.cke_dialog_ui_input_text,
.cke_dialog_ui_input_textarea,
.cke_dialog_ui_input_select {
  box-sizing: border-box !important;
  border-color: #bdcec8 !important;
  border-radius: 7px !important;
  background: var(--cv-editor-surface, #ffffff) !important;
  box-shadow: inset 0 1px 2px rgba(35, 72, 63, 0.06) !important;
}

.cke_dialog_ui_input_text:focus,
.cke_dialog_ui_input_textarea:focus,
.cke_dialog_ui_input_select:focus {
  border-color: #6e9b90 !important;
  outline: none !important;
  box-shadow: 0 0 0 2px rgba(63, 117, 105, 0.17) !important;
}

.cke_colordialog_table {
  border-spacing: 2px !important;
}

.cke_colordialog_colorcell {
  border-radius: 2px !important;
  outline-offset: 1px !important;
}

/* Seletor rapido de tabela */
.cv-table-picker {
  display: none;
  position: absolute;
  z-index: 10050;
  box-sizing: border-box;
  padding: 12px;
  border: 1px solid #c7d8d2;
  border-radius: 12px;
  background: var(--cv-editor-surface, #ffffff);
  box-shadow: 0 16px 36px rgba(35, 72, 63, 0.18);
  font-family: "Segoe UI", system-ui, sans-serif;
}

.cv-table-picker__grid {
  display: grid;
  grid-template-columns: repeat(5, 21px);
  grid-template-rows: repeat(5, 21px);
  gap: 4px;
}

.cv-table-picker__cell {
  width: 21px;
  height: 21px;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  border: 1px solid #cbdad5;
  border-radius: 5px;
  background: #f0f6f4;
  cursor: pointer;
  transition: background-color 90ms ease, border-color 90ms ease, transform 90ms ease;
}

.cv-table-picker__cell:hover,
.cv-table-picker__cell.is-active {
  border-color: var(--cv-editor-accent, #3f7569);
  background: #bcd9d1;
  transform: scale(1.04);
}

.cv-table-picker__label {
  margin-top: 9px;
  color: #355d53;
  font-size: 11px;
  font-weight: 600;
  text-align: center;
}

/* Menu de linhas horizontais */
.cv-line-picker {
  display: none;
  position: absolute;
  z-index: 10050;
  box-sizing: border-box;
  width: 152px;
  padding: 4px;
  border: 1px solid #c7d8d2;
  border-radius: 10px;
  background: var(--cv-editor-surface, #ffffff);
  box-shadow: 0 12px 28px rgba(35, 72, 63, 0.18);
  font-family: "Segoe UI", system-ui, sans-serif;
}

/* Barra do topo: cor à esquerda, ações à direita. */
.cv-line-picker__bar {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 4px;
  padding-bottom: 4px;
  border-bottom: 1px solid #e2ebe8;
}

.cv-line-picker__cor {
  display: flex;
  align-items: center;
  gap: 4px;
  height: 24px;
  margin: 0;
  padding: 0 4px;
  box-sizing: border-box;
  border: 0;
  border-radius: 6px;
  background: transparent;
  cursor: pointer;
  transition: background-color 90ms ease;
}

.cv-line-picker__cor:hover,
.cv-line-picker__cor:focus-visible {
  background: #e5f0ed;
  outline: none;
}

.cv-line-picker__chip {
  display: block;
  width: 23px;
  height: 13px;
  border: 1px solid rgba(35, 72, 63, 0.32);
  border-radius: 3px;
  background: #000000;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
}

.cv-line-picker__cor::after {
  content: "\f0d7";
  color: #5d7971;
  font-family: "Font Awesome 6 Free";
  font-size: 9px;
  font-weight: 900;
  line-height: 1;
}

/* Trio agrupado: le como um controle so, nao como tres botoes soltos. */
.cv-line-picker__acoes {
  display: flex;
  gap: 1px;
  align-items: center;
  height: 24px;
  margin-left: auto;
  padding: 0;
  box-sizing: border-box;
  border: 0;
  background: transparent;
}

.cv-line-picker__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 19px;
  height: 19px;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  border: 0;
  border-radius: 5px;
  color: #587a72;
  background: transparent;
  cursor: pointer;
  transition: background-color 90ms ease, border-color 90ms ease, color 90ms ease;
}

.cv-line-picker__icon::before {
  font-family: "Font Awesome 6 Free";
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
}

/* Setas cheias, nao carets: o caret de baixo era o mesmo glifo da setinha
   da casa de cor, ao lado, e os dois se confundiam. */
.cv-line-picker__icon[data-acao="acima"]::before {
  content: "\f062";
}

.cv-line-picker__icon[data-acao="abaixo"]::before {
  content: "\f063";
}

.cv-line-picker__icon[data-acao="excluir"]::before {
  content: "\f1f8";
}

.cv-line-picker__icon:hover,
.cv-line-picker__icon:focus-visible {
  color: #1f4a40;
  background: #e5f0ed;
  outline: none;
}

.cv-line-picker__icon[data-acao="excluir"] {
  margin-left: 2px;
}

.cv-line-picker__icon.is-danger:hover,
.cv-line-picker__icon.is-danger:focus-visible {
  color: #9b2c2c;
  background: #fbeceb;
}

/* Paleta: só aparece com o mouse na casa de cor. */
.cv-line-picker__palette {
  display: none;
  position: absolute;
  z-index: 2;
  top: 30px;
  right: 5px;
  left: 5px;
  grid-template-columns: repeat(8, 1fr);
  gap: 3px;
  box-sizing: border-box;
  padding: 5px;
  border: 1px solid #c7d8d2;
  border-radius: 8px;
  background: var(--cv-editor-surface, #ffffff);
  box-shadow: 0 10px 22px rgba(35, 72, 63, 0.18);
}

.cv-line-picker__palette.is-open {
  display: grid;
}

.cv-line-picker__color {
  display: block;
  width: 100%;
  height: 15px;
  min-width: 0;
  padding: 0;
  box-sizing: border-box;
  border: 1px solid rgba(35, 72, 63, 0.22);
  border-radius: 3px;
  cursor: pointer;
  overflow: hidden;
  transition: box-shadow 90ms ease, border-color 90ms ease;
}

/* Casa do seletor livre: faixa do espectro atrás do input nativo. */
.cv-line-picker__color--livre {
  position: relative;
  background: linear-gradient(
    90deg,
    #ff0000, #ffc000, #70ad47, #1f4e79, #7030a0, #ff0000
  );
}

.cv-line-picker__color--livre input {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  cursor: pointer;
  opacity: 0;
}

.cv-line-picker__color:hover,
.cv-line-picker__color:focus-visible {
  border-color: #3f7569;
  outline: none;
  box-shadow: 0 0 0 2px rgba(63, 117, 105, 0.22);
}

.cv-line-picker__color.is-active {
  border-color: var(--cv-editor-accent, #3f7569);
  box-shadow: 0 0 0 2px rgba(63, 117, 105, 0.45);
}

.cv-line-picker__list {
  display: flex;
  flex-direction: column;
}

.cv-line-picker__item {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  margin: 0;
  padding: 3px 6px;
  box-sizing: border-box;
  border: 0;
  border-radius: 5px;
  color: #23483f;
  background: transparent;
  cursor: pointer;
  text-align: left;
  transition: background-color 90ms ease, border-color 90ms ease;
}

/* Fio no lugar do título de grupo: separa espessuras de estilos sem gastar altura. */
.cv-line-picker__item.is-group-start {
  margin: 4px -4px 0;
  padding: 5px 10px 3px;
  width: auto;
  border-top: 1px solid #e2ebe8;
  border-radius: 0;
}

.cv-line-picker__item:hover,
.cv-line-picker__item:focus-visible {
  color: #1f4a40;
  background: #e5f0ed;
  outline: none;
}



.cv-line-picker__sample {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 44px;
  width: 44px;
  height: 12px;
}

.cv-line-picker__rule {
  display: block;
  width: 100%;
  height: 0;
  font-style: normal;
}

.cv-line-picker__name {
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
  font-size: 11px;
  line-height: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cv-line-picker__item.is-active {
  background: #e8f1ee;
}

.cv-line-picker__item.is-active::after {
  content: "\2713";
  flex: 0 0 auto;
  padding-left: 5px;
  color: #2f6257;
  font-size: 11px;
  font-weight: 700;
  line-height: 15px;
}

@media (max-width: 900px) {
  .cke_chrome.cv-skin .cke_top,
  .site-content .cke_top {
    padding: 4px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cke_chrome.cv-skin,
  .cke_chrome.cv-skin *,
  .site-content .cke_chrome,
  .site-content .cke_chrome *,
  .cv-table-picker__cell,
  .cv-line-picker__item,
  .cv-line-picker__icon,
  .cv-line-picker__cor,
  .cv-line-picker__color,
  .cv-paste-chip,
  .cv-paste-chip__icon,
  .cke_button.cv-paste-chip-anchor {
    transition: none !important;
    animation: none !important;
  }
}

/* ——— Chip de colagem ao lado do botão PasteFromWord ——— */
.cke_chrome.cv-skin .cke_button.cv-paste-chip-anchor,
.site-content .cke_chrome .cke_button.cv-paste-chip-anchor {
  position: relative;
  z-index: 2;
  background: #2b579a !important;
  box-shadow: 0 0 0 3px rgba(43, 87, 154, 0.28), 0 0 12px rgba(43, 87, 154, 0.35);
  animation: cv-paste-btn-glow 1.2s ease-in-out infinite;
}

.cke_chrome.cv-skin .cke_button.cv-paste-chip-anchor .cke_button_icon::before,
.site-content .cke_chrome .cke_button.cv-paste-chip-anchor .cke_button_icon::before {
  color: var(--cv-editor-surface, #ffffff) !important;
  opacity: 1 !important;
  font-size: 16px !important;
  filter: none;
  animation: cv-paste-icon-bounce 1.1s ease-in-out infinite;
}

.cv-paste-chip {
  display: inline-flex !important;
  align-items: center;
  gap: 7px;
  max-width: 0;
  height: 26px;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  opacity: 0;
  white-space: nowrap !important;
  vertical-align: middle;
  pointer-events: none;
  border-radius: 6px;
  background: linear-gradient(90deg, #2b579a 0%, #3d6eb5 100%);
  box-shadow: 0 2px 10px rgba(43, 87, 154, 0.35);
  transform: translateX(-8px) scale(0.96);
  transition:
    max-width 0.4s cubic-bezier(0.22, 1, 0.36, 1),
    opacity 0.25s ease,
    transform 0.4s cubic-bezier(0.22, 1, 0.36, 1),
    padding 0.4s ease,
    margin 0.4s ease;
}

.cv-paste-chip.cv-paste-chip--on {
  max-width: 280px;
  margin-left: 4px !important;
  padding: 0 12px 0 8px !important;
  opacity: 1;
  transform: translateX(0) scale(1);
  animation: cv-paste-chip-shake 0.55s ease-out;
}

.cv-paste-chip__icon {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  color: var(--cv-editor-surface, #ffffff);
  font-family: "Font Awesome 6 Free";
  font-size: 15px;
  font-weight: 900;
  font-style: normal;
  line-height: 16px;
  text-align: center;
  -webkit-font-smoothing: antialiased;
  animation: cv-paste-icon-bounce 1.1s ease-in-out infinite;
}

.cv-paste-chip__icon::before {
  content: "\f1c2"; /* fa-file-word */
}

.cv-paste-chip__text {
  color: var(--cv-editor-surface, #ffffff);
  font-family: "Segoe UI", system-ui, sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.01em;
  line-height: 1;
}

.cv-paste-chip kbd {
  display: inline-block;
  margin-left: 3px;
  padding: 2px 6px;
  border: 1px solid rgba(255, 255, 255, 0.55);
  border-bottom-width: 2px;
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.95);
  color: #1e3f75;
  font-family: ui-monospace, "Cascadia Code", Consolas, monospace;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.3;
  vertical-align: baseline;
}

@keyframes cv-paste-icon-bounce {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-1px) scale(1.08); }
}

@keyframes cv-paste-btn-glow {
  0%, 100% { box-shadow: 0 0 0 3px rgba(43, 87, 154, 0.25), 0 0 8px rgba(43, 87, 154, 0.3); }
  50% { box-shadow: 0 0 0 5px rgba(43, 87, 154, 0.4), 0 0 16px rgba(43, 87, 154, 0.5); }
}

@keyframes cv-paste-chip-shake {
  0% { transform: translateX(-8px) scale(0.96); }
  40% { transform: translateX(3px) scale(1.02); }
  70% { transform: translateX(-1px) scale(1); }
  100% { transform: translateX(0) scale(1); }
}

/* ——— Modo Código-fonte ——— */
.cke_chrome.cv-skin .cke_contents.cv-source-host,
.site-content .cke_chrome .cke_contents.cv-source-host {
  position: relative !important;
  background: #152824 !important;
}

.cke_chrome.cv-skin .cv-source-mirror,
.site-content .cke_chrome .cv-source-mirror {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  background:
    linear-gradient(180deg, #1a322c 0%, #152824 48%, #12221e 100%);
}

.cke_chrome.cv-skin .cv-source-pre,
.site-content .cke_chrome .cv-source-pre {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 14px 16px;
  overflow: hidden;
  color: #d5e8e1;
  font-family: ui-monospace, "Cascadia Code", "SF Mono", Consolas, monospace;
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.55;
  letter-spacing: 0.01em;
  white-space: pre-wrap;
  word-wrap: break-word;
  tab-size: 2;
}

.cke_chrome.cv-skin textarea.cke_source.cv-source-ta,
.site-content .cke_chrome textarea.cke_source.cv-source-ta {
  position: relative !important;
  z-index: 1 !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 14px 16px !important;
  border: 0 !important;
  outline: none !important;
  color: transparent !important;
  caret-color: #7dcdb8 !important;
  background: transparent !important;
  font-family: ui-monospace, "Cascadia Code", "SF Mono", Consolas, monospace !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
  letter-spacing: 0.01em !important;
  white-space: pre-wrap !important;
  word-wrap: break-word !important;
  tab-size: 2 !important;
  resize: none !important;
  -webkit-text-fill-color: transparent;
}

.cke_chrome.cv-skin textarea.cke_source.cv-source-ta::selection,
.site-content .cke_chrome textarea.cke_source.cv-source-ta::selection {
  color: transparent;
  background: rgba(125, 205, 184, 0.28);
}

.cv-src-tag { color: #7dcdb8; font-weight: 700; }
.cv-src-attr { color: #9bb8ff; }
.cv-src-val { color: #e6c27a; }
.cv-src-cmt { color: #6f8f86; font-style: italic; }

/* ——— Validação de variáveis ——— */
.cke_chrome.cv-skin .cv-validate-panel,
.site-content .cke_chrome .cv-validate-panel {
  position: absolute;
  z-index: 3100;
  top: 46px;
  left: auto;
  right: 6px;
  width: min(360px, calc(100% - 12px));
  max-height: min(42vh, 360px);
  display: flex;
  flex-direction: column;
  border: 1px solid #e6d7a8;
  border-radius: 10px;
  background: #fffdf6;
  box-shadow: 0 10px 28px rgba(120, 90, 20, 0.12);
  overflow: hidden;
}

/* Painel tão alto quanto o editor: sem faixa livre para onde desviar o trecho,
   ele fica translúcido por um instante para a marca aparecer por baixo. */
.cv-validate-panel {
  transition: opacity 140ms ease;
}

.cv-validate-panel.is-esmaecido {
  opacity: 0.18;
}

.cv-validate-panel.is-esmaecido:hover {
  opacity: 1;
}

.cv-validate-panel__head {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 8px;
  border-bottom: 1px solid #eadfae;
  background: #f8efc8;
  cursor: grab;
  touch-action: none;
  user-select: none;
}

.cv-validate-panel.is-dragging .cv-validate-panel__head {
  cursor: grabbing;
}

.cv-validate-panel__head strong {
  font-size: 11px;
  font-weight: 700;
  color: #6a5518;
}

.cv-validate-panel__summary {
  margin-left: auto;
  font-size: 10px;
  font-weight: 700;
  color: #9a8438;
}

.cv-validate-panel__summary.is-ok { color: #7a6a1e; }
.cv-validate-panel__summary.is-bad { color: #9a4540; }

.cv-validate-panel__refresh,
.cv-validate-panel__close {
  width: 22px;
  height: 22px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #7a6520;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  touch-action: manipulation;
}

.cv-validate-panel__refresh:hover,
.cv-validate-panel__close:hover {
  background: #f0e4b0;
}

.cv-validate-panel__list {
  list-style: none;
  margin: 0;
  padding: 5px;
  overflow: auto;
  flex: 1;
}

.cv-validate-panel__empty {
  padding: 12px 8px;
  color: #7a6a1e;
  font-size: 11px;
  font-weight: 650;
  text-align: center;
}

.cv-validate-panel__item {
  display: flex;
  flex-direction: column;
  gap: 1px;
  margin: 0 0 3px;
  padding: 6px 7px;
  border: 1px solid #eadfae;
  border-radius: 7px;
  background: #fff;
  cursor: pointer;
}

.cv-validate-panel__item:hover,
.cv-validate-panel__item.is-active {
  border-color: #d4bc6a;
  background: #fff8e0;
}

.cv-validate-panel__item.is-error {
  border-left: 3px solid #c46a63;
}

.cv-validate-panel__item.is-warn {
  border-left: 3px solid #d4a017;
}

.cv-validate-panel__item-title {
  font-size: 11px;
  font-weight: 700;
  color: #5c4a14;
}

.cv-validate-panel__item-detail {
  font-size: 10px;
  color: #8a7638;
  line-height: 1.3;
}

/* Onde o problema está: separa cartões iguais que são trechos diferentes. */
.cv-validate-panel__item-onde {
  margin-top: 2px;
  color: #9a8438;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.cv-validate-panel__item-onde:empty {
  display: none;
}

/* O trecho sumiu do documento desde a última validação. */
.cv-validate-panel__item.is-perdido .cv-validate-panel__item-onde::after {
  content: ' — não encontrado; valide de novo';
  font-weight: 600;
  color: #9a4540;
}

.cv-validate-panel__item-snip {
  margin-top: 2px;
  padding: 2px 4px;
  border-radius: 4px;
  background: #faf3d8;
  color: #6a5518;
  font-family: ui-monospace, Consolas, monospace;
  font-size: 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Tips da toolbar — mesmo estilo de .btn-base-tip, sempre acima (fixed no body) */
.cv-cke-tip-host {
  display: none;
  position: fixed;
  z-index: 10050;
  width: max-content;
  max-width: min(220px, calc(100vw - 48px));
  min-width: 0;
  padding: 3px 7px;
  border-radius: 5px;
  background: #2f3a36;
  color: #fff;
  font-size: 10px;
  line-height: 1.25;
  font-weight: 500;
  white-space: normal;
  text-align: center;
  pointer-events: none;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.16);
}

.cv-cke-tip-host.is-visible {
  display: block;
}

.cke_chrome.cv-skin a.cke_button.cv-has-cke-tip,
.site-content .cke_chrome a.cke_button.cv-has-cke-tip,
.cke_chrome.cv-skin a.cke_combo_button.cv-has-cke-tip,
.site-content .cke_chrome a.cke_combo_button.cv-has-cke-tip,
.cv-copyhtml-btn.cv-has-cke-tip {
  position: relative !important;
}

/* Ações da tabela (copiar / replicar) vivem no menu de contexto do editor
   (botão direito dentro da tabela) — sem barra flutuante sobre o conteúdo. */
.cv-table-tools {
  display: none !important;
}

/* ------------------------------------------------------------------ MACROS */
/* Painel do botão Macros: mesma mecânica do "Substituir seleção" (flutua sob a
   toolbar, dentro do .cke_inner), na paleta verde do site. */

.cke_chrome.cv-skin .cv-macros,
.site-content .cke_chrome .cv-macros {
  position: absolute;
  z-index: 3100;
  top: 46px;
  left: auto;
  right: 20px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  width: min(460px, calc(100% - 28px));
  height: auto;
  min-height: 0;
  padding: 0;
  box-sizing: border-box;
  border: 1px solid #a8cbbc;
  border-radius: 12px;
  background: #f2f8f5;
  color: var(--cv-editor-ink, #23483f);
  font-family: Arial, Helvetica, sans-serif;
  line-height: normal;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.7) inset,
    0 12px 28px rgba(35, 72, 63, 0.16),
    0 2px 6px rgba(35, 72, 63, 0.08);
  overflow: hidden;
}

.cke_chrome.cv-skin .cv-macros[hidden],
.site-content .cke_chrome .cv-macros[hidden] {
  display: none !important;
}

.cke_chrome.cv-skin .cv-macros__head,
.site-content .cke_chrome .cv-macros__head {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 7px 8px 6px 10px;
  border-bottom: 1px solid #bfd9cd;
  background: linear-gradient(180deg, #e6f2ec 0%, #d9eae2 100%);
}

.cke_chrome.cv-skin .cv-macros__badge,
.site-content .cke_chrome .cv-macros__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  border-radius: 5px;
  background: var(--cv-editor-accent-alt, #377260);
  color: #fff;
  font-size: 0;
  line-height: 0;
}

.cke_chrome.cv-skin .cv-macros__badge::before,
.site-content .cke_chrome .cv-macros__badge::before {
  content: "\f5bf";
  display: block;
  color: #fff;
  font-family: "Font Awesome 6 Free";
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  text-align: center;
}

.cke_chrome.cv-skin .cv-macros__title,
.site-content .cke_chrome .cv-macros__title {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  color: var(--cv-editor-ink, #23483f);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.cke_chrome.cv-skin .cv-macros__io,
.site-content .cke_chrome .cv-macros__io,
.cke_chrome.cv-skin .cv-macros__close,
.site-content .cke_chrome .cv-macros__close {
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  min-width: 24px;
  min-height: 24px;
  padding: 0;
  box-sizing: border-box;
  margin: 0 !important;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #5a8375;
  font-size: 0;
  line-height: 0;
  position: static !important;
  top: auto !important;
  bottom: auto !important;
  vertical-align: middle !important;
  transform: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  cursor: pointer;
}

.cke_chrome.cv-skin .cv-macros__io::before,
.site-content .cke_chrome .cv-macros__io::before,
.cke_chrome.cv-skin .cv-macros__close::before,
.site-content .cke_chrome .cv-macros__close::before {
  display: block;
  width: 12px;
  height: 12px;
  color: inherit;
  font-family: "Font Awesome 6 Free";
  font-size: 11px;
  font-weight: 900;
  line-height: 12px;
  text-align: center;
}

.cke_chrome.cv-skin .cv-macros__io--import::before,
.site-content .cke_chrome .cv-macros__io--import::before {
  content: "\f56f";
}

.cke_chrome.cv-skin .cv-macros__io--export::before,
.site-content .cke_chrome .cv-macros__io--export::before {
  content: "\f56e";
}

.cke_chrome.cv-skin .cv-macros__close::before,
.site-content .cke_chrome .cv-macros__close::before {
  content: "\f00d";
}

.cke_chrome.cv-skin .cv-macros__close,
.site-content .cke_chrome .cv-macros__close {
  margin-left: 2px !important;
}

.cke_chrome.cv-skin .cv-macros__io:hover,
.site-content .cke_chrome .cv-macros__io:hover,
.cke_chrome.cv-skin .cv-macros__close:hover,
.site-content .cke_chrome .cv-macros__close:hover {
  background: rgba(55, 114, 96, 0.12);
  color: var(--cv-editor-ink, #23483f);
}

.cke_chrome.cv-skin .cv-macros__body,
.site-content .cke_chrome .cv-macros__body {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 8px;
}

.cke_chrome.cv-skin .cv-macros__field,
.site-content .cke_chrome .cv-macros__field {
  display: flex;
  align-items: center;
  align-self: center;
  flex: 1 1 0;
  min-width: 0;
  height: 28px;
  margin: 0 !important;
  padding: 0 7px;
  box-sizing: border-box;
  border: 1px solid #bcd6cb;
  border-radius: 8px;
  background: #fff;
  transition: border-color 120ms ease, box-shadow 120ms ease;
}

.cke_chrome.cv-skin .cv-macros__field:focus-within,
.site-content .cke_chrome .cv-macros__field:focus-within {
  border-color: var(--cv-editor-accent-alt, #377260);
  box-shadow: 0 0 0 2px rgba(55, 114, 96, 0.18);
}

.cke_chrome.cv-skin .cv-macros__field-label,
.site-content .cke_chrome .cv-macros__field-label {
  display: block;
  flex: 0 0 28px;
  width: 28px;
  margin-right: 4px;
  color: #5a8375;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
}

.cke_chrome.cv-skin .cv-macros__field input,
.site-content .cke_chrome .cv-macros__field input {
  display: block;
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  height: 24px;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--cv-editor-ink, #23483f);
  font: 11px/24px Arial, Helvetica, sans-serif;
}

.cke_chrome.cv-skin .cv-macros__save,
.site-content .cke_chrome .cv-macros__save {
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  flex: 0 0 62px;
  width: 62px;
  min-width: 28px;
  min-height: 28px;
  height: 28px;
  padding: 0 8px;
  box-sizing: border-box;
  margin: 0 !important;
  border: 0;
  border-radius: 8px;
  background: var(--cv-editor-accent-alt, #377260);
  color: #fff;
  font: 800 10px/1 Arial, Helvetica, sans-serif;
  letter-spacing: 0.03em;
  position: static !important;
  top: auto !important;
  bottom: auto !important;
  vertical-align: middle !important;
  transform: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  cursor: pointer;
}

.cke_chrome.cv-skin .cv-macros__save:hover,
.site-content .cke_chrome .cv-macros__save:hover {
  background: #2b5b4c;
}

.cke_chrome.cv-skin .cv-macros__list,
.site-content .cke_chrome .cv-macros__list {
  max-height: 240px;
  margin: 0;
  padding: 0 8px 8px;
  overflow-y: auto;
  list-style: none;
  scrollbar-color: #91aaa3 #eaf2ee;
  scrollbar-width: thin;
}

.cke_chrome.cv-skin .cv-macros__list::-webkit-scrollbar,
.site-content .cke_chrome .cv-macros__list::-webkit-scrollbar {
  width: 8px;
}

.cke_chrome.cv-skin .cv-macros__list::-webkit-scrollbar-thumb,
.site-content .cke_chrome .cv-macros__list::-webkit-scrollbar-thumb {
  border: 2px solid #f2f8f5;
  border-radius: 999px;
  background: #91aaa3;
}

.cke_chrome.cv-skin .cv-macros__empty,
.site-content .cke_chrome .cv-macros__empty {
  margin: 0;
  padding: 10px 2px 4px;
  color: #5a8375;
  font-size: 10px;
  line-height: 1.4;
  list-style: none;
}

.cke_chrome.cv-skin .cv-macros__item,
.site-content .cke_chrome .cv-macros__item {
  display: flex;
  align-items: stretch;
  gap: 4px;
  margin: 0 0 5px;
  padding: 0;
  list-style: none;
}

.cke_chrome.cv-skin .cv-macros__apply,
.site-content .cke_chrome .cv-macros__apply {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 1px;
  flex: 1 1 auto;
  min-width: 0;
  min-height: 34px;
  padding: 5px 8px;
  box-sizing: border-box;
  margin: 0 !important;
  border: 1px solid #cfe2d9;
  border-radius: 8px;
  background: #fff;
  color: var(--cv-editor-ink, #23483f);
  text-align: left;
  position: static !important;
  transform: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  cursor: pointer;
}

.cke_chrome.cv-skin .cv-macros__apply:hover,
.site-content .cke_chrome .cv-macros__apply:hover {
  border-color: var(--cv-editor-accent-alt, #377260);
  background: #eef7f2;
}

.cke_chrome.cv-skin .cv-macros__name,
.site-content .cke_chrome .cv-macros__name {
  display: block;
  max-width: 100%;
  overflow: hidden;
  color: var(--cv-editor-ink, #23483f);
  font: 700 11px/1.3 Arial, Helvetica, sans-serif;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cke_chrome.cv-skin .cv-macros__meta,
.site-content .cke_chrome .cv-macros__meta {
  display: block;
  max-width: 100%;
  overflow: hidden;
  color: #6b8f81;
  font: 400 9px/1.3 Arial, Helvetica, sans-serif;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cke_chrome.cv-skin .cv-macros__rename-btn,
.site-content .cke_chrome .cv-macros__rename-btn,
.cke_chrome.cv-skin .cv-macros__update,
.site-content .cke_chrome .cv-macros__update,
.cke_chrome.cv-skin .cv-macros__del,
.site-content .cke_chrome .cv-macros__del {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 28px;
  width: 28px;
  min-width: 28px;
  padding: 0;
  box-sizing: border-box;
  margin: 0 !important;
  border: 1px solid #cfe2d9;
  border-radius: 8px;
  background: #fff;
  color: #5a8375;
  font-size: 0;
  line-height: 0;
  position: static !important;
  transform: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  cursor: pointer;
}

.cke_chrome.cv-skin .cv-macros__rename-btn::before,
.site-content .cke_chrome .cv-macros__rename-btn::before,
.cke_chrome.cv-skin .cv-macros__update::before,
.site-content .cke_chrome .cv-macros__update::before,
.cke_chrome.cv-skin .cv-macros__del::before,
.site-content .cke_chrome .cv-macros__del::before {
  display: block;
  width: 12px;
  height: 12px;
  color: inherit;
  font-family: "Font Awesome 6 Free";
  font-size: 11px;
  font-weight: 900;
  line-height: 12px;
  text-align: center;
}

.cke_chrome.cv-skin .cv-macros__update::before,
.site-content .cke_chrome .cv-macros__update::before {
  content: "\f0c7";
}

.cke_chrome.cv-skin .cv-macros__del::before,
.site-content .cke_chrome .cv-macros__del::before {
  content: "\f2ed";
}

.cke_chrome.cv-skin .cv-macros__rename-btn::before,
.site-content .cke_chrome .cv-macros__rename-btn::before {
  content: "\f304";
}

.cke_chrome.cv-skin .cv-macros__rename-btn:hover,
.site-content .cke_chrome .cv-macros__rename-btn:hover {
  border-color: var(--cv-editor-accent-alt, #377260);
  background: #eef7f2;
  color: var(--cv-editor-ink, #23483f);
}

/* Campo que ocupa o lugar do nome enquanto o usuário renomeia */
.cke_chrome.cv-skin .cv-macros__rename,
.site-content .cke_chrome .cv-macros__rename {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 34px;
  padding: 5px 8px;
  box-sizing: border-box;
  margin: 0 !important;
  border: 1px solid var(--cv-editor-accent-alt, #377260);
  border-radius: 8px;
  outline: 0;
  background: #fff;
  color: var(--cv-editor-ink, #23483f);
  font: 700 11px/1.3 Arial, Helvetica, sans-serif;
  box-shadow: 0 0 0 2px rgba(55, 114, 96, 0.18);
}

.cke_chrome.cv-skin .cv-macros__update:hover,
.site-content .cke_chrome .cv-macros__update:hover {
  border-color: var(--cv-editor-accent-alt, #377260);
  background: #eef7f2;
  color: var(--cv-editor-ink, #23483f);
}

.cke_chrome.cv-skin .cv-macros__del:hover,
.site-content .cke_chrome .cv-macros__del:hover {
  border-color: #c98b8b;
  background: #fdf1f1;
  color: #a13c3c;
}

.cke_chrome.cv-skin .cv-macros__feedback,
.site-content .cke_chrome .cv-macros__feedback {
  position: static;
  max-width: none;
  margin: 0;
  padding: 6px 10px 8px;
  border: 0;
  border-top: 1px dashed #c8ded4;
  border-radius: 0;
  background: #eaf3ee;
  color: #4a6d60;
  font-size: 10px;
  line-height: 1.35;
  box-shadow: none;
}

.cke_chrome.cv-skin .cv-macros__feedback:empty,
.site-content .cke_chrome .cv-macros__feedback:empty {
  display: none;
}

.cke_chrome.cv-skin .cv-macros.is-error,
.site-content .cke_chrome .cv-macros.is-error {
  border-color: #b8a07a;
}

.cke_chrome.cv-skin .cv-macros.is-error .cv-macros__head,
.site-content .cke_chrome .cv-macros.is-error .cv-macros__head {
  background: linear-gradient(180deg, #f8efd8 0%, #f0e4c4 100%);
  border-bottom-color: #e4d3a8;
}

.cke_chrome.cv-skin .cv-macros.is-error .cv-macros__feedback,
.site-content .cke_chrome .cv-macros.is-error .cv-macros__feedback {
  border-top-color: #e4d3a8;
  background: #fff8ea;
  color: #875a2c;
}

/* ——— Mapa do contrato ———
   O painel é uma gaveta do editor: ao abrir, a coluna do editor recua à
   direita e o painel ocupa a faixa liberada — o contrato reflui mais estreito
   em vez de ficar escondido atrás dele. Topo, altura e borda vêm do JS, que
   copia a caixa do .cke_contents. A largura sai da alça na borda esquerda,
   como a do painel de variáveis, e fica guardada na máquina.

   O recuo da coluna é aplicado pelo JS; aqui fica só a transição dele. */
.site-content {
  transition: padding-right 170ms cubic-bezier(0.2, 0.7, 0.3, 1);
}


.cv-mapa-panel {
  position: fixed;
  z-index: 10060;
  display: flex;
  flex-direction: column;
  width: 300px;
  border: 1px solid var(--cv-editor-line-soft, #d8e4df);
  border-radius: 10px 0 0 10px;
  background: var(--cv-editor-surface, #ffffff);
  box-shadow: -6px 0 18px rgba(20, 50, 44, 0.08);
  font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
  color: #294f46;
  overflow: visible;
  opacity: 0;
  pointer-events: none;
  /* Fora da tela, do lado em que ela mora. Antes eram 12px — a gaveta ficava
     quase no lugar, invisível, e qualquer animação até a posição final
     percorria a largura toda, parecendo vir do lado errado. */
  transform: translateX(100%);
  transition: opacity 140ms ease, transform 170ms cubic-bezier(0.2, 0.7, 0.3, 1), border-left-color 140ms ease, border-left-width 140ms ease;
}

.cv-mapa-panel.is-aberto {
  opacity: 1;
  pointer-events: auto;
  transform: none;
}

/* Enquanto a ponta está na mão a gaveta pode ser mais estreita que o conteúdo:
   ele fica no tamanho de leitura e vai aparecendo por recorte. */
.cv-mapa-panel.is-puxando {
  overflow: hidden;
  transition: none;
}

/* Mesmo piso do JS (LARGURA_MIN): o conteúdo não se espreme abaixo disso, é
   recortado. Um piso alto fazia os chips reencaixarem no meio do arrasto. */
.cv-mapa-panel__head,
.cv-mapa-panel__busca,
.cv-mapa-panel__arv {
  min-width: 170px;
}

/* Espelhado: cantos, sombra e alça trocam de lado. */
.cv-mapa-panel.is-esquerda {
  border-radius: 0 10px 10px 0;
  box-shadow: 6px 0 18px rgba(20, 50, 44, 0.08);
  transform: translateX(-100%);
}

.cv-mapa-panel.is-esquerda.is-aberto { transform: none; }
.cv-mapa-panel.is-esquerda .cv-mapa-panel__head { border-radius: 0 10px 0 0; }
.cv-mapa-panel.is-esquerda .cv-mapa-panel__arv { border-radius: 0 0 10px 0; }

.cv-mapa-panel.is-esquerda .cv-mapa-panel__resize {
  left: auto;
  right: -12px;
}

/* Puxador: a pontinha do mapa dobrado, presa na borda da tela. Arrastá-la para
   dentro abre a gaveta; um clique seco também. Com a gaveta aberta ela encosta
   na borda de dentro do painel. */
.cv-mapa-tab {
  position: fixed;
  z-index: 10061;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 84px;
  padding: 0;
  border: 0;
  background: transparent;
  /* Mesmo verde dos botões de Repetições e Comparador no header. */
  color: #3d4a45;
  touch-action: none;
  transition: background-color 120ms ease, color 120ms ease, right 170ms cubic-bezier(0.2, 0.7, 0.3, 1), left 170ms cubic-bezier(0.2, 0.7, 0.3, 1), transform 170ms cubic-bezier(0.2, 0.7, 0.3, 1);
}

/* O alvo do ponteiro é o ícone dentro do botão, não o botão: sem herdar a mão
   para os filhos, ela só aparecia depois que o arrasto começava (aí quem manda
   é o cursor da cobertura). */
/* Mão, e não a seta dupla de redimensionar: o trilho laranja já conta que ali
   se arrasta, e a mão diz "pegue isto" sem parecer ajuste de largura. Mesmo
   cursor da alça do painel de variáveis — o gesto é o mesmo nos dois.
   O !important é por causa do Bootstrap, que tem
   `button:not(:disabled){cursor:pointer}` — mais específico que a classe, ele
   devolvia a setinha ao botão. */
.cv-mapa-tab,
.cv-mapa-tab * { cursor: grab !important; }

/* Pointer capture mantém o gesto funcionando fora da alça; esta classe mantém
   também a mão fechada, para o cursor não parecer ter abandonado o arraste. */
html.cv-mapa-segurando,
html.cv-mapa-segurando * { cursor: grabbing !important; }

.cv-mapa-tab.is-puxando,
.cv-mapa-tab.is-puxando * { cursor: grabbing !important; }

.cv-mapa-tab.is-puxando { transition: none; }

/* Sem cartão branco: o puxador é o próprio ícone. */

.cv-mapa-tab[hidden] { display: none; }

/* Com Repetições ou Comparador abertos, o mapa não tem o que apontar: some
   junto com o puxador, em vez de ficar por cima da janela. */
body:has(.modal_repeticoes.is-open) .cv-mapa-tab,
body:has(.modal_repeticoes.is-open) .cv-mapa-panel,
body:has(#container-comparador.is-open) .cv-mapa-tab,
body:has(#container-comparador.is-open) .cv-mapa-panel {
  display: none !important;
}

.cv-mapa-tab.is-on { color: #1f2937; }

/* Laranja já no hover, e não só durante o arrasto: é a mesma cor da alça de
   redimensionar, e passar o mouse basta para dizer que aquilo se puxa. O
   estado do arrasto repete a regra porque, começado o gesto, uma cobertura
   assume o ponteiro e o :hover deixa de valer no meio do movimento.

   As duas últimas linhas fecham o sentido inverso: o puxador já acendia a
   borda, mas passar o mouse NA borda deixava o ícone apagado, como se fossem
   duas peças sem relação. São a mesma alça — acendem juntas dos dois lados. */
.cv-mapa-tab:hover,
.cv-mapa-tab:hover i,
.cv-mapa-tab.is-puxando,
.cv-mapa-tab.is-puxando i,
body:has(.cv-mapa-panel__resize:hover) .cv-mapa-tab,
body:has(.cv-mapa-panel__resize:hover) .cv-mapa-tab i {
  color: #da922c;
}

/* Mesma cor e mesmo traço dos botões de Repetições e Comparador no header, sem
   o brilho branco atrás, que engrossava o desenho contra o fundo claro. Um
   pouco maior que os do header: aqui o ícone é o próprio puxador da gaveta. */
.cv-mapa-tab i {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  font-size: 18px;
  font-style: normal;
  line-height: 1;
  transition: transform 120ms ease, color 120ms ease;
}

/* Resposta ao mouse: um tico maior. O deslocamento fica na regra de espiada,
   mais abaixo, junto com o da gaveta. */

/* Só o ícone: deitado, com os três ramos apontando para a tela. */
.cv-mapa-tab i { transform: rotate(-90deg); }
.cv-mapa-tab.is-esquerda i { transform: rotate(90deg); }

/* A borda é uma segunda área da mesma alça do símbolo: ambas abrem/fecham no
   clique e redimensionam com o mesmo arraste. */
.cv-mapa-panel__resize {
  position: absolute;
  top: 0;
  left: -12px;
  width: 24px;
  height: 100%;
  cursor: grab;
  touch-action: none;
  background: transparent;
}

.cv-mapa-panel__resize::before {
  content: '';
  position: absolute;
  top: 8px;
  bottom: 8px;
  left: 50%;
  transform: translateX(-50%);
  width: 3px;
  border-radius: 999px;
  background: transparent;
  opacity: 0;
  transition: background 0.18s ease, box-shadow 0.18s ease, opacity 0.18s ease;
}

.cv-mapa-panel__resize::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 6px;
  height: 28px;
  border-radius: 999px;
  background: transparent;
  opacity: 0;
  transition: background 0.18s ease, height 0.18s ease, box-shadow 0.18s ease, opacity 0.18s ease;
}

/* Arrastar por qualquer das duas áreas aplica o mesmo estado e acende o mesmo
   trilho: símbolo e borda são visualmente uma peça só. */
.cv-mapa-panel__resize:hover::before,
.cv-mapa-panel.is-puxando .cv-mapa-panel__resize::before {
  opacity: 1;
  background: linear-gradient(
    180deg,
    rgba(218, 146, 44, 0.15) 0%,
    rgb(218, 146, 44) 18%,
    rgb(218, 146, 44) 82%,
    rgba(218, 146, 44, 0.15) 100%
  );
  box-shadow: 0 0 0 3px rgba(218, 146, 44, 0.12);
}

.cv-mapa-panel__resize:hover::after,
.cv-mapa-panel.is-puxando .cv-mapa-panel__resize::after {
  opacity: 1;
  height: 36px;
  background: linear-gradient(180deg, #e8a84a 0%, #da922c 100%);
  box-shadow:
    0 1px 2px rgba(120, 70, 10, 0.18),
    inset 1px 0 0 rgba(255, 255, 255, 0.35),
    inset -1px 0 0 rgba(0, 0, 0, 0.08);
}

.cv-mapa-panel:has(.cv-mapa-panel__resize:hover),
.cv-mapa-panel.is-puxando {
  border-left-color: rgba(218, 146, 44, 0.55);
}

/* Espiar a gaveta.
 *
 * Com o mouse no puxador, a janela de verdade — não um enfeite parecido com
 * ela — vem alguns pixels para dentro da tela, o bastante para o trilho
 * laranja da borda aparecer. É o que conta ao usuário que ali existe um painel
 * encostado e que puxar dali o abre.
 *
 * Ela continua sem receber ponteiro (pointer-events fica em none enquanto não
 * está aberta), então espiar não rouba o hover do puxador nem deixa clicar no
 * que ainda está escondido.
 */
body:has(.cv-mapa-tab:hover) .cv-mapa-panel:not(.is-aberto) {
  opacity: 1;
  transform: translateX(calc(100% - 9px));
}

body:has(.cv-mapa-tab.is-esquerda:hover) .cv-mapa-panel.is-esquerda:not(.is-aberto) {
  transform: translateX(calc(-100% + 9px));
}

/* Quem desliza é o ícone, não o botão.
 *
 * Mover o botão parecia natural, mas ele é a área que recebe o mouse: a 9px
 * de deslocamento num alvo de 30px, ele saía de baixo do cursor, o :hover
 * caía, ele voltava — e o laranja ficava tremendo. Deslocando só o desenho,
 * a área de hover fica parada e o movimento continua sendo visto.
 *
 * O translate vem depois do rotate, então anda no eixo já girado do ícone:
 * -9px aproxima da borda nos dois lados, sem precisar de conta separada.
 *
 * `.is-puxando` repete cada regra porque, começado o gesto, uma cobertura
 * assume o ponteiro e o `:hover` deixa de valer: sem isso o ícone perdia os
 * 9px no instante em que era segurado e os recuperava ao soltar, mudando de
 * distância até a borda no meio do arrasto. */
body:has(.cv-mapa-tab:hover) .cv-mapa-tab i,
body:has(.cv-mapa-tab.is-puxando) .cv-mapa-tab i {
  transform: rotate(-90deg) scale(1.12);
}

body:has(.cv-mapa-tab.is-esquerda:hover) .cv-mapa-tab.is-esquerda i,
body:has(.cv-mapa-tab.is-esquerda.is-puxando) .cv-mapa-tab.is-esquerda i {
  transform: rotate(90deg) scale(1.12);
}

/* Os 9px são da espiada, e só dela: existem para fechar a fresta que a gaveta
   fechada abre ao aparecer 9px. Com a gaveta aberta não há fresta, e o mesmo
   recuo passava a afastar o ícone da borda — era o que se via ao arrastar,
   porque o arrasto abre a gaveta no primeiro movimento. Mesma condição da
   regra da espiada, lá em cima: `:not(.is-aberto)`. */
body:has(.cv-mapa-tab:hover):has(.cv-mapa-panel:not(.is-aberto)) .cv-mapa-tab i,
body:has(.cv-mapa-tab.is-puxando):has(.cv-mapa-panel:not(.is-aberto)) .cv-mapa-tab i {
  transform: rotate(-90deg) translateY(-9px) scale(1.12);
}

body:has(.cv-mapa-tab.is-esquerda:hover):has(.cv-mapa-panel:not(.is-aberto)) .cv-mapa-tab.is-esquerda i,
body:has(.cv-mapa-tab.is-esquerda.is-puxando):has(.cv-mapa-panel:not(.is-aberto)) .cv-mapa-tab.is-esquerda i {
  transform: rotate(90deg) translateY(-9px) scale(1.12);
}

/* A borda acesa NÃO depende de a gaveta estar fechada.
 *
 * Enquanto o realce vivia junto com a espiada, ele carregava o
 * `:not(.is-aberto)` dela — então, depois de arrastar e abrir, soltar o botão
 * apagava o laranja mesmo com o mouse ainda parado sobre o ícone. Agora a
 * regra do realce vale nos dois estados; só o deslocamento continua exclusivo
 * da gaveta fechada, que é o único caso em que faz sentido deslocar.
 *
 * Ela engrossa para 3px porque o puxador fica por cima da fresta: o fundo
 * dele é transparente, mas o ícone tapa justo o meio, e 1px sumia. A largura
 * extra sai para dentro do painel, então nada se move por causa dela. */
body:has(.cv-mapa-tab:hover) .cv-mapa-panel,
body:has(.cv-mapa-tab.is-puxando) .cv-mapa-panel {
  border-left-width: 3px;
  border-left-color: #da922c;
}

body:has(.cv-mapa-tab:hover) .cv-mapa-panel .cv-mapa-panel__resize::before,
body:has(.cv-mapa-tab.is-puxando) .cv-mapa-panel .cv-mapa-panel__resize::before {
  opacity: 1;
  background: linear-gradient(
    180deg,
    rgba(218, 146, 44, 0.15) 0%,
    rgb(218, 146, 44) 18%,
    rgb(218, 146, 44) 82%,
    rgba(218, 146, 44, 0.15) 100%
  );
  box-shadow: 0 0 0 3px rgba(218, 146, 44, 0.12);
}

body:has(.cv-mapa-tab:hover) .cv-mapa-panel .cv-mapa-panel__resize::after,
body:has(.cv-mapa-tab.is-puxando) .cv-mapa-panel .cv-mapa-panel__resize::after {
  opacity: 1;
  height: 36px;
  background: linear-gradient(180deg, #e8a84a 0%, #da922c 100%);
  box-shadow:
    0 1px 2px rgba(120, 70, 10, 0.18),
    inset 1px 0 0 rgba(255, 255, 255, 0.35),
    inset -1px 0 0 rgba(0, 0, 0, 0.08);
}

/* O recuo da direita é 2px, e não 9, para os controles ficarem centrados na
   coluna da barra de rolagem da árvore (25px, encostada na borda). Com 9px
   eles paravam 9px antes dela e a fileira inteira lia como desalinhada. */
.cv-mapa-panel__head {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  padding: 7px 2px 7px 9px;
  border-bottom: 1px solid var(--cv-editor-line-soft, #d8e4df);
  background: var(--cv-editor-toolbar, #f3f8f6);
  border-radius: 10px 0 0 0;
  user-select: none;
}


.cv-mapa-panel__head button {
  width: 22px;
  height: 22px;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #65877e;
  font-size: 13px;
  line-height: 1;
  cursor: pointer;
}

.cv-mapa-panel__head button:hover { background: #e2ece9; color: var(--cv-editor-ink, #23483f); }

.cv-mapa-panel__filtros {
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  min-width: 0;
}

.cv-mapa-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 7px 2px 5px;
  border: 1px solid var(--cv-editor-line-soft, #d8e4df);
  border-radius: 99px;
  background: #fff;
  font-size: 10.5px;
  color: #4b6862;
  cursor: pointer;
  user-select: none;
}

.cv-mapa-chip i { width: 7px; height: 7px; border-radius: 2px; background: var(--cv-editor-muted-soft, #9aaeaa); }
.cv-mapa-chip b { color: #8ba49e; font-weight: 600; font-variant-numeric: tabular-nums; }
.cv-mapa-chip:hover { border-color: #b9cdc7; }
.cv-mapa-chip.is-off { opacity: 0.38; }
.cv-mapa-chip.is-varivel i { background: #2563eb; }
.cv-mapa-chip.is-se i { background: #c9821a; }
.cv-mapa-chip.is-laco i { background: #7c3aed; }
.cv-mapa-chip.is-texto i { background: var(--cv-editor-muted-soft, #9aaeaa); }
.cv-mapa-chip.is-vazio i { background: #dc2626; }

/* Busca: uma linha só, entre os filtros e a árvore. */
.cv-mapa-panel__busca {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 2px 5px 9px;
  border-bottom: 1px solid var(--cv-editor-line-soft, #d8e4df);
  background: var(--cv-editor-surface, #ffffff);
}

.cv-mapa-panel__busca i {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  font-size: 10px;
  font-style: normal;
  color: #9ab0aa;
}

.cv-mapa-panel__busca input {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: 0;
  padding: 2px 0;
  background: transparent;
  color: #294f46;
  font-family: "Cascadia Mono", Consolas, monospace;
  font-size: 11px;
}

.cv-mapa-panel__busca input::placeholder {
  color: #a8bcb7;
  font-family: "Segoe UI", system-ui, sans-serif;
}

.cv-mapa-panel__limpar {
  width: 18px;
  height: 18px;
  padding: 0;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: #9ab0aa;
  font-size: 12px;
  line-height: 1;
  cursor: pointer;
}

.cv-mapa-panel__limpar:hover { background: #eef3f1; color: var(--cv-editor-ink, #23483f); }
.cv-mapa-panel__limpar[hidden] { display: none; }

/* Etiqueta do filtro em curso, ao lado do funil. */
.cv-mapa-filtro-ativo {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 60%;
  padding: 1px 2px 1px 6px;
  border: 1px solid #e3d3b3;
  border-radius: 999px;
  background: #fdf6e9;
  color: #8a5a11;
  font-size: 10.5px;
  white-space: nowrap;
}

.cv-mapa-filtro-ativo[hidden] { display: none; }

.cv-mapa-filtro-ativo span {
  overflow: hidden;
  text-overflow: ellipsis;
}

.cv-mapa-filtro-ativo .cv-mapa-filtro__pt { opacity: 1; }

.cv-mapa-filtro-ativo.is-varivel .cv-mapa-filtro__pt { background: #2563eb; }
.cv-mapa-filtro-ativo.is-se .cv-mapa-filtro__pt { background: #c9821a; }
.cv-mapa-filtro-ativo.is-laco .cv-mapa-filtro__pt { background: #7c3aed; }
.cv-mapa-filtro-ativo.is-texto .cv-mapa-filtro__pt { background: var(--cv-editor-muted-soft, #9aaeaa); }
.cv-mapa-filtro-ativo.is-vazio .cv-mapa-filtro__pt { background: #dc2626; }

.cv-mapa-filtro-ativo__x {
  width: 15px;
  height: 15px;
  flex: 0 0 15px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #a3803f;
  font-size: 11px;
  line-height: 1;
  cursor: pointer;
}

.cv-mapa-filtro-ativo__x:hover { background: #f0e0c2; color: #6a4508; }

/* Funil no fim da busca: o menu abre ao passar o mouse (e ao focar pelo
   teclado), com os mesmos tipos das pastilhas. */
.cv-mapa-filtro {
  position: relative;
  flex: 0 0 auto;
}

.cv-mapa-filtro__btn {
  position: relative;
  width: 20px;
  height: 20px;
  padding: 0;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: #9ab0aa;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cv-mapa-filtro__btn i {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  font-size: 10px;
  font-style: normal;
}

.cv-mapa-filtro__btn:hover { background: #eef3f1; color: var(--cv-editor-ink, #23483f); }
.cv-mapa-filtro__btn.is-parcial { color: #da922c; }

/* A contagem muda o próprio símbolo do funil quando há tipos ocultos. */
.cv-mapa-filtro__btn.is-parcial::after {
  content: attr(data-ocultos);
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 11px;
  height: 11px;
  padding: 0 2px;
  border-radius: 999px;
  background: #da922c;
  color: #fff;
  font: 700 7px/11px "Segoe UI", sans-serif;
  text-align: center;
  box-sizing: border-box;
}

/* Isolar uma pastilha já decide sozinho o conteúdo do mapa; nesse estado o
   segundo filtro fica quieto até o usuário voltar para tudo. */
.cv-mapa-filtro.is-inativo .cv-mapa-filtro__btn {
  opacity: 0.35;
  cursor: default;
}
.cv-mapa-filtro.is-inativo .cv-mapa-filtro__menu { display: none !important; }

.cv-mapa-filtro__menu {
  position: absolute;
  z-index: 10062;
  top: 100%;
  right: -4px;
  margin-top: 4px;
  min-width: 168px;
  padding: 4px;
  border: 1px solid var(--cv-editor-line-soft, #d8e4df);
  border-radius: 8px;
  background: var(--cv-editor-surface, #ffffff);
  box-shadow: 0 8px 22px rgba(20, 50, 44, 0.16);
  display: none;
}

/* A ponte invisível entre o botão e o menu: sem ela o menu fecha no vão. */
.cv-mapa-filtro__menu::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: -6px;
  height: 6px;
}

.cv-mapa-filtro:hover .cv-mapa-filtro__menu,
.cv-mapa-filtro:focus-within .cv-mapa-filtro__menu { display: block; }

.cv-mapa-filtro__item {
  display: flex;
  align-items: center;
  gap: 7px;
  width: 100%;
  padding: 4px 6px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #6d857f;
  font-family: "Segoe UI", system-ui, sans-serif;
  font-size: 11px;
  text-align: left;
  cursor: pointer;
}

.cv-mapa-filtro__item:hover { background: var(--cv-editor-toolbar, #f3f8f6); }
.cv-mapa-filtro__item.is-on { color: var(--cv-editor-ink, #23483f); }
.cv-mapa-filtro__item span { flex: 1; }
.cv-mapa-filtro__item b { color: #9ab0aa; font-weight: 600; font-variant-numeric: tabular-nums; }

.cv-mapa-filtro__pt {
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  border-radius: 2px;
  background: #c8d8d3;
}

.cv-mapa-filtro__item.is-varivel .cv-mapa-filtro__pt { background: #2563eb; }
.cv-mapa-filtro__item.is-se .cv-mapa-filtro__pt { background: #c9821a; }
.cv-mapa-filtro__item.is-laco .cv-mapa-filtro__pt { background: #7c3aed; }
.cv-mapa-filtro__item.is-texto .cv-mapa-filtro__pt { background: var(--cv-editor-muted-soft, #9aaeaa); }
.cv-mapa-filtro__item.is-vazio .cv-mapa-filtro__pt { background: #dc2626; }
.cv-mapa-filtro__item.is-tudo .cv-mapa-filtro__pt {
  background: linear-gradient(135deg, #2563eb 0 33%, #c9821a 33% 66%, #7c3aed 66% 100%);
}

.cv-mapa-filtro__item.is-on { background: #eef5f2; font-weight: 600; }
.cv-mapa-filtro__item.is-on:hover { background: #e4efeb; }

/* separa o "tudo" dos tipos */
.cv-mapa-filtro__item.is-tudo {
  margin-bottom: 3px;
  padding-bottom: 6px;
  border-bottom: 1px solid #eef3f1;
  border-radius: 6px 6px 0 0;
}

.cv-mapa-filtro__ok {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  font-size: 9px;
  font-style: normal;
  color: #4d7168;
  opacity: 0;
}

.cv-mapa-filtro__item.is-on .cv-mapa-filtro__ok { opacity: 1; }

.cv-mapa-filtro__vazio {
  margin: 4px 6px;
  color: #a8bcb7;
  font-size: 11px;
}

.cv-mapa-panel__arv {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 5px 6px 10px;
  border-radius: 0 0 0 10px;
  font-size: 12px;
}

/* Barra de rolagem igual à da lista de variáveis (.ul-lista-variaveis): é a
   mesma pegada, no mesmo site. */
/* Só as regras webkit, como na lista de variáveis: definir as propriedades
   padrão (scrollbar-width / scrollbar-color) faz o Chrome ignorar o
   ::-webkit-scrollbar e devolver a barra fina do sistema. */
.cv-mapa-panel__arv::-webkit-scrollbar { width: 25px; }

.cv-mapa-panel__arv::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 10px;
}

.cv-mapa-panel__arv::-webkit-scrollbar-thumb {
  background: #888888;
  border-radius: 10px;
  cursor: grab;
}

.cv-mapa-panel__arv::-webkit-scrollbar-thumb:hover { background: #555555; }
.cv-mapa-panel__arv::-webkit-scrollbar-thumb:active { cursor: grabbing; }
.cv-mapa-panel__arv::-webkit-scrollbar-button { display: none; height: 0; }


.cv-mapa-vazio {
  margin: 10px 6px;
  color: #8ba49e;
  font-size: 11px;
}

/* grupos: ${SE_…} e ${ENQUANTO_…} */
/* O cabeçalho gruda no topo enquanto se rola o conteúdo dele: em árvore funda,
   saber dentro de qual condicional se está era o que mais faltava. */
.cv-mapa-cab {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 1px 0;
  padding: 3px 6px;
  border-left: 2px solid transparent;
  border-radius: 0 6px 6px 0;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
}

.cv-mapa-cab { background: var(--cv-editor-surface, #ffffff); }
.cv-mapa-cab:hover { background: var(--cv-editor-toolbar, #f3f8f6); }
.cv-mapa-cab.is-ativa { background: #e6f1ee; }
.cv-mapa-cab.is-ativa:hover { background: #d7e9e3; }
.cv-mapa-tw { width: 11px; flex: 0 0 11px; color: #9ab0aa; font-size: 9px; text-align: center; }

/* Ícone sem caixa cheia: em árvore funda, dezenas de quadradinhos coloridos
   viram ruído. A cor do glifo já diz a espécie. */
.cv-mapa-ic {
  width: 12px;
  flex: 0 0 12px;
  height: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cv-mapa-ic i {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  font-size: 9px;
  font-style: normal;
  line-height: 1;
}

.cv-mapa-rot {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: "Cascadia Mono", Consolas, monospace;
  font-size: 10.5px;
}

.cv-mapa-qtd {
  padding: 0 5px;
  border-radius: 999px;
  background: #eff3f2;
  color: #8ba49e;
  font-size: 9px;
  line-height: 15px;
  font-variant-numeric: tabular-nums;
}

/* Cada estrutura recebe um tom estável pelo nome. Condicionais permanecem na
   família quente; repetições, na fria — distingue os nós sem perder o tipo. */
.cv-mapa-no.is-se.is-tom-0 { --cv-grupo-cor: #b66d11; }
.cv-mapa-no.is-se.is-tom-1 { --cv-grupo-cor: #a16207; }
.cv-mapa-no.is-se.is-tom-2 { --cv-grupo-cor: #c05621; }
.cv-mapa-no.is-se.is-tom-3 { --cv-grupo-cor: #8f6b12; }
.cv-mapa-no.is-se.is-tom-4 { --cv-grupo-cor: #9a5f2e; }
.cv-mapa-no.is-se.is-tom-5 { --cv-grupo-cor: #ad6f00; }
.cv-mapa-no.is-laco.is-tom-0 { --cv-grupo-cor: #7c3aed; }
.cv-mapa-no.is-laco.is-tom-1 { --cv-grupo-cor: #4f46e5; }
.cv-mapa-no.is-laco.is-tom-2 { --cv-grupo-cor: #0f766e; }
.cv-mapa-no.is-laco.is-tom-3 { --cv-grupo-cor: #087f8c; }
.cv-mapa-no.is-laco.is-tom-4 { --cv-grupo-cor: #2563eb; }
.cv-mapa-no.is-laco.is-tom-5 { --cv-grupo-cor: #6d28d9; }

.cv-mapa-no.is-se > .cv-mapa-cab,
.cv-mapa-no.is-laco > .cv-mapa-cab {
  border-left-color: color-mix(in srgb, var(--cv-grupo-cor) 48%, #fff);
  background: color-mix(in srgb, var(--cv-grupo-cor) 7%, #fff);
}
.cv-mapa-no.is-se > .cv-mapa-cab .cv-mapa-ic,
.cv-mapa-no.is-se > .cv-mapa-cab .cv-mapa-rot,
.cv-mapa-no.is-laco > .cv-mapa-cab .cv-mapa-ic,
.cv-mapa-no.is-laco > .cv-mapa-cab .cv-mapa-rot { color: var(--cv-grupo-cor); }
.cv-mapa-no.is-se > .cv-mapa-cab:hover,
.cv-mapa-no.is-se > .cv-mapa-cab.is-ativa:hover,
.cv-mapa-no.is-laco > .cv-mapa-cab:hover,
.cv-mapa-no.is-laco > .cv-mapa-cab.is-ativa:hover {
  background: color-mix(in srgb, var(--cv-grupo-cor) 13%, #fff);
}

/* Passar o mouse no cabeçalho acende o que está dentro: dá para ver a extensão
   do trecho antes de clicar. */
.cv-mapa-no.is-se > .cv-mapa-cab:hover + .cv-mapa-filhos,
.cv-mapa-no.is-laco > .cv-mapa-cab:hover + .cv-mapa-filhos {
  background: color-mix(in srgb, var(--cv-grupo-cor) 6%, transparent);
}

.cv-mapa-filhos {
  margin-left: 7px;
  padding-left: 7px;
  border-left: 1px solid #e6ecea;
  border-radius: 0 0 0 4px;
}

.cv-mapa-no.is-se > .cv-mapa-filhos,
.cv-mapa-no.is-laco > .cv-mapa-filhos {
  border-left-color: color-mix(in srgb, var(--cv-grupo-cor) 34%, #fff);
}
.cv-mapa-no.is-fechado > .cv-mapa-filhos { display: none; }

/* Problemas: o nó fica vermelho e ganha o triângulo. */

/* A pastilha de problemas leva o besouro do botão Conferir, e não o quadradinho
   dos outros tipos: é o mesmo assunto dos dois lugares, e o mapa acusa as
   mesmas coisas — variável quebrada inclusive. Quem já conhece o besouro da
   barra reconhece aqui sem ler o rótulo. */
.cv-mapa-chip.is-erro i,
.cv-mapa-filtro__item.is-erro .cv-mapa-filtro__pt,
.cv-mapa-filtro-ativo.is-erro .cv-mapa-filtro__pt {
  width: auto;
  height: auto;
  flex: 0 0 auto;
  border-radius: 0;
  background: none;
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  font-style: normal;
  font-size: 10px;
  line-height: 1;
  color: #dc2626;
}

.cv-mapa-chip.is-erro i::before,
.cv-mapa-filtro__item.is-erro .cv-mapa-filtro__pt::before,
.cv-mapa-filtro-ativo.is-erro .cv-mapa-filtro__pt::before { content: "\f188"; }

.cv-mapa-no.is-erro > .cv-mapa-cab { border-left-color: #e9a3a3; background: #fdf3f3; }
.cv-mapa-no.is-erro > .cv-mapa-cab .cv-mapa-ic { color: #dc2626; }
.cv-mapa-no.is-erro > .cv-mapa-cab .cv-mapa-rot { color: #b91c1c; }
.cv-mapa-no.is-erro > .cv-mapa-cab:hover,
.cv-mapa-no.is-erro > .cv-mapa-cab.is-ativa:hover { background: #fbe9e9; }
.cv-mapa-no.is-erro > .cv-mapa-filhos { border-left-color: #f3cccc; }

.cv-mapa-lin.is-erro .cv-mapa-bar { background: #dc2626; }
.cv-mapa-lin.is-erro .cv-mapa-nome { color: #b91c1c; }

.cv-mapa-alerta {
  flex: 0 0 auto;
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  font-size: 9px;
  font-style: normal;
  color: #dc2626;
}

/* linhas: uma por variável, ou o texto do parágrafo comum */
.cv-mapa-lin {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  box-sizing: border-box;
  padding: 2.5px 5px;
  border-radius: 6px;
  cursor: pointer;
}

/* A linha que está à vista no editor já tem fundo próprio, e com a mesma
   especificidade do :hover ela vencia por vir depois — passar o mouse nessas
   não mostrava nada. */
.cv-mapa-lin:hover { background: var(--cv-editor-toolbar, #f3f8f6); }
.cv-mapa-lin.is-ativa { background: #e6f1ee; }
.cv-mapa-lin.is-ativa:hover { background: #d7e9e3; }

.cv-mapa-bar {
  width: 2.5px;
  height: 13px;
  flex: 0 0 2.5px;
  border-radius: 2px;
  background: var(--cv-editor-muted-soft, #9aaeaa);
}

.cv-mapa-lin.is-var .cv-mapa-bar { background: #2563eb; }
.cv-mapa-lin.is-vazio .cv-mapa-bar { background: #dc2626; }
.cv-mapa-lin.is-titulo .cv-mapa-bar { background: #0f766e; height: 15px; }
.cv-mapa-lin.is-tabela .cv-mapa-bar { background: #0891b2; }
.cv-mapa-lin.is-imagem .cv-mapa-bar { background: #7c5cd6; }
.cv-mapa-lin.is-linha .cv-mapa-bar { background: #b0791f; }

/* Linha horizontal: não tem texto nenhum para mostrar, então vale o mesmo
   tratamento da figura — descrição em itálico com o ícone do que é. */
.cv-mapa-lin.is-linha .cv-mapa-prev {
  display: flex;
  align-items: center;
  gap: 5px;
  color: #8a6115;
  font-style: italic;
}

.cv-mapa-lin.is-linha .cv-mapa-prev::before {
  content: "\f068"; /* minus */
  flex: 0 0 auto;
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  font-size: 9px;
  font-style: normal;
}

/* Parágrafo só com figura: sem texto para mostrar, a linha diz o que há
   ali. Em itálico porque é descrição do mapa, e não conteúdo do contrato. */
.cv-mapa-lin.is-imagem .cv-mapa-prev {
  display: flex;
  align-items: center;
  gap: 5px;
  color: #6b5aa6;
  font-style: italic;
}

.cv-mapa-lin.is-imagem .cv-mapa-prev::before {
  content: "\f03e"; /* image */
  flex: 0 0 auto;
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  font-size: 9px;
  font-style: normal;
}

.cv-mapa-nome {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: "Cascadia Mono", Consolas, monospace;
  font-size: 10.5px;
  color: #1d4ed8;
}

.cv-mapa-prev {
  flex: 1 1 0;
  width: 0;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
  color: #6d857f;
}

.cv-mapa-lin.is-titulo .cv-mapa-prev {
  color: var(--cv-editor-ink, #23483f);
  font-weight: 600;
  font-size: 10px;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

/* variáveis do mesmo parágrafo, sob um trilho leve */
.cv-mapa-blk {
  margin-left: 6px;
  padding-left: 6px;
  border-left: 1px solid #f0f3f2;
}

.cv-mapa-blk__cab {
  padding: 1px 5px;
  font-size: 9.5px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #a8bcb7;
}

/* índices: [N] [O] [G] por preencher em vermelho, [1] [2] [3] uma cor cada */
.cv-mapa-ix { font-weight: 700; }
.cv-mapa-ix.is-vazio { color: #dc2626; }
.cv-mapa-ix.is-n0 { color: #0d9488; }
.cv-mapa-ix.is-n1 { color: #c2410c; }
.cv-mapa-ix.is-n2 { color: #7c3aed; }
.cv-mapa-ix.is-n3 { color: #be185d; }
.cv-mapa-ix.is-n4 { color: #0369a1; }
.cv-mapa-ix.is-n5 { color: #a16207; }

/* piscada do clique: desenhada por cima do iframe, nunca dentro do contrato */
.cv-mapa-pisca {
  position: fixed;
  z-index: 10059;
  pointer-events: none;
  border-radius: 3px;
  background: rgba(255, 213, 64, 0.42);
  box-shadow: 0 0 0 2px rgba(225, 164, 0, 0.35);
  opacity: 1;
  transition: opacity 780ms ease;
}

.cv-mapa-pisca.is-saindo { opacity: 0; }

/* Trecho inteiro de uma condicional/laço: preenchimento leve (ele pode tomar a
   tela toda) e contorno firme, para se ver onde começa e onde acaba. */
.cv-mapa-pisca.is-faixa {
  background: rgba(255, 213, 64, 0.16);
  box-shadow:
    inset 0 0 0 2px rgba(225, 164, 0, 0.55),
    0 0 0 1px rgba(225, 164, 0, 0.18);
}

/* ——— Avisos do CKEditor (ex.: "Pressione Ctrl+V para colar") ———
   O balão nasce fora do chrome, filho direto do <body>: as regras aqui não
   podem descender de .cke_chrome.cv-skin, ou não pegariam nada. O visual é o
   mesmo do status das tarefas (.ce-status-tarefa), para o aviso não parecer
   de outro programa. */
.cke_notifications_area .cke_notification {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  width: min(360px, calc(100vw - 32px));
  margin: 0 0 8px;
  padding: 12px 32px 12px 14px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 12px;
  background: #245f55;
  color: #fff;
  box-shadow: 0 16px 38px rgba(7, 32, 28, 0.28);
  font-family: "Segoe UI", system-ui, sans-serif;
  text-align: left;
  opacity: 1;
  filter: none;
  animation: cv-aviso-entrar 200ms ease-out both;
}

.cke_notifications_area .cke_notification_info { background: #245f55; }
.cke_notifications_area .cke_notification_success { background: #1f7c70; }
.cke_notifications_area .cke_notification_warning { background: #a43838; }

/* Selo redondo à esquerda, como o do status das tarefas. */
.cke_notifications_area .cke_notification::before {
  content: "i";
  flex: 0 0 auto;
  display: grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border-radius: 50%;
  background: #fff;
  color: #245f55;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 14px;
  font-style: italic;
  font-weight: 700;
  line-height: 1;
}

.cke_notifications_area .cke_notification_success::before {
  content: "\2713";
  color: #1f7c70;
  font-family: "Segoe UI", system-ui, sans-serif;
  font-style: normal;
  font-weight: 900;
}

.cke_notifications_area .cke_notification_warning::before {
  content: "!";
  color: #a43838;
  font-family: "Segoe UI", system-ui, sans-serif;
  font-style: normal;
  font-weight: 900;
}

/* Sem ellipsis: a mensagem do "colar" tem três linhas e precisa aparecer toda. */
.cke_notifications_area .cke_notification_message {
  margin: 0;
  overflow: visible;
  font-family: inherit;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.4;
  text-overflow: clip;
  white-space: normal;
}

.cke_notifications_area .cke_notification_message kbd {
  display: inline-block;
  margin: 0 1px;
  padding: 1px 6px;
  border: 1px solid rgba(255, 255, 255, 0.45);
  border-bottom-width: 2px;
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.16);
  font-family: "Segoe UI", system-ui, sans-serif;
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.5;
  white-space: nowrap;
}

.cke_notifications_area a.cke_notification_close {
  top: 8px;
  right: 8px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background-image: none;
  color: #fff;
  text-decoration: none;
  opacity: 0.7;
  filter: none;
  transition: background-color 120ms ease, opacity 120ms ease;
}

.cke_notifications_area a.cke_notification_close::before {
  content: "\00d7";
  display: grid;
  width: 18px;
  height: 18px;
  place-items: center;
  font-family: "Segoe UI", system-ui, sans-serif;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
}

.cke_notifications_area a.cke_notification_close:hover,
.cke_notifications_area a.cke_notification_close:focus {
  background-color: rgba(255, 255, 255, 0.2);
  opacity: 1;
  filter: none;
}

@keyframes cv-aviso-entrar {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .cke_notifications_area .cke_notification { animation: none; }
}