:root {
  --color-bg: #f4f6f8;
  --color-surface: #ffffff;
  --color-border: #e2e5e9;
  --color-text: #1f2937;
  --color-text-muted: #6b7280;
  --color-primary: #004189;       /* azul-marinho (out/2026) */
  --color-primary-dark: #00336d;
  --color-primary-soft: #e8eff8;  /* fundo claro de itens ativos/hover */
  --color-primary-soft-2: #d3e1f2;
  --color-dark: #1f2937;
  --color-success: #16a34a;
  --color-danger: #dc2626;
  --color-warning: #d97706;
  --radius: 8px;
  --shadow: 0 1px 3px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.04);
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: 'Segoe UI', Roboto, Arial, sans-serif;
  background: var(--color-bg);
  color: var(--color-text);
  font-size: 15px;
  line-height: 1.55;
}

a { color: var(--color-primary); text-decoration: none; }
a:hover { text-decoration: underline; }

/* Topbar */
.topbar {
  background: var(--color-surface);
  border-bottom: 1px solid var(--color-border);
  padding: 10px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  position: sticky;
  top: 0;
  z-index: 20;
}
.topbar .logo img { display: block; height: 36px; }
.topbar-actions { display: flex; align-items: center; gap: 14px; }
.topbar-actions .admin-name { color: var(--color-text-muted); font-size: 13px; }

/* Busca do topo: campo arredondado, fundo suave, lupa a esquerda (Enter pesquisa) */
.search-form { display: flex; align-items: center; flex: 1; max-width: 480px; margin: 0 16px; position: relative; }
.search-form input[type="search"] {
  flex: 1; width: 100%; padding: 10px 16px 10px 42px; border: 1px solid #e3e9f4; background: #f1f5fb;
  border-radius: 999px; font-size: 14px; color: var(--color-text); outline: none; transition: background .15s, border-color .15s, box-shadow .15s;
  -webkit-appearance: none; appearance: none;
}
.search-form input[type="search"]::placeholder { color: #7b8aa3; }
.search-form input[type="search"]::-webkit-search-cancel-button { cursor: pointer; }
.search-form input[type="search"]:hover { border-color: #d3dcec; }
.search-form input[type="search"]:focus { background: #fff; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(0, 65, 137, .12); }
.search-form .search-ico {
  position: absolute; left: 6px; top: 50%; transform: translateY(-50%); width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center; border: none; background: none;
  color: #5b6b85; cursor: pointer; border-radius: 50%; padding: 0;
}
.search-form .search-ico:hover { color: var(--color-primary); }
.search-form .search-ico svg { width: 17px; height: 17px; }

.btn {
  display: inline-block; padding: 8px 16px; border-radius: var(--radius);
  border: 1px solid var(--color-border); background: var(--color-surface);
  color: var(--color-text); cursor: pointer; font-size: 14px;
}
.btn:hover { text-decoration: none; border-color: var(--color-primary); }
.btn-primary { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.btn-primary:hover { background: var(--color-primary-dark); }
.btn-danger { background: #fff; border-color: var(--color-danger); color: var(--color-danger); }
.btn-danger:hover { background: var(--color-danger); color: #fff; }
.btn-sm { padding: 5px 10px; font-size: 13px; }

/* App shell */
.app-shell { display: flex; min-height: calc(100vh - 58px); align-items: flex-start; }

.sidebar {
  width: 260px; flex-shrink: 0; background: var(--color-surface);
  border-right: 1px solid var(--color-border); padding: 20px 0; min-height: calc(100vh - 58px);
}
.sidebar h3 { font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--color-text-muted); padding: 0 20px; margin: 0 0 10px; }
.sidebar ul { list-style: none; margin: 0; padding: 0; }
.sidebar > ul > li { margin-bottom: 2px; }
.sidebar .cat-link {
  display: flex; align-items: center; padding: 9px 20px; color: var(--color-text);
  font-weight: 600; font-size: 14px; cursor: pointer; user-select: none;
}
.sidebar a.cat-link { justify-content: space-between; }
.sidebar .cat-link:hover, .sidebar .cat-link.active { background: var(--color-primary-soft); text-decoration: none; color: var(--color-primary); }
.sidebar .cat-link-row { flex: 1; display: flex; justify-content: space-between; align-items: center; }
.sidebar ul ul { padding-left: 12px; }
.sidebar ul ul a { font-weight: 400; padding: 7px 20px 7px 28px; font-size: 13.5px; }
.sidebar .count { color: var(--color-text-muted); font-weight: 400; font-size: 12px; }

/* Categorias com subcategorias (profundidade ilimitada) usando <details>/<summary>.
   Clicar em qualquer parte do nome (todo o "summary") expande/recolhe -
   nao ha link de navegacao aqui, so nas categorias de ultimo nivel. */
.sidebar details.cat-branch { margin-bottom: 2px; }
.sidebar details.cat-branch > summary { list-style: none; }
.sidebar details.cat-branch > summary::-webkit-details-marker { display: none; }
.sidebar details.cat-branch > summary.cat-link::before {
  /* Seta desenhada em SVG (nao e mais um caractere de texto), pra nao
     depender de como cada sistema/fonte renderiza o simbolo - assim fica
     sempre nitida, do mesmo tamanho, em qualquer navegador. */
  content: ''; display: inline-block; width: 18px; height: 10px; flex-shrink: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2 1 L7 5 L2 9' stroke='%236b7280' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: center; background-size: 10px 10px;
  transition: transform .15s ease;
}
.sidebar details.cat-branch[open] > summary.cat-link::before {
  transform: rotate(90deg);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2 1 L7 5 L2 9' stroke='%23004189' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.sidebar details.cat-branch ul { padding-left: 16px; }
.sidebar details.cat-branch ul .cat-link { font-weight: 400; font-size: 13.5px; }
.sidebar details.cat-branch ul details.cat-branch > summary.cat-link { font-weight: 500; }

.main { flex: 1; padding: 28px 32px; min-width: 0; }

.page-title { margin: 0 0 6px; font-size: 22px; }
.page-subtitle { color: var(--color-text-muted); margin: 0 0 22px; font-size: 14px; }

/* Post cards */
.post-card {
  background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius);
  padding: 18px 20px; margin-bottom: 14px; box-shadow: var(--shadow);
}
.post-card h2 { margin: 0 0 6px; font-size: 17px; }
.post-card .meta { color: var(--color-text-muted); font-size: 12.5px; margin-bottom: 8px; }
.post-card p { margin: 0; color: #374151; }

/* Caminho do post dentro do menu (ex: Sistema > Aco > Estoque), mostrado
   so nos resultados de busca - ajuda a saber onde o post fica sem precisar
   abrir ele (ver routes/public.js -> /busca e lib/menu.js -> getCategoryPath). */
.post-card .breadcrumb {
  display: flex; align-items: center; gap: 4px; flex-wrap: wrap;
  color: var(--color-text-muted); font-size: 12px; margin-bottom: 6px;
}
.post-card .breadcrumb .sep { color: #c6cbd2; font-size: 11px; }

.post-full {
  background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius);
  padding: 28px 32px; box-shadow: var(--shadow);
}
.post-full .meta { color: var(--color-text-muted); font-size: 13px; margin-bottom: 20px; border-bottom: 1px solid var(--color-border); padding-bottom: 16px; }
.post-content img { max-width: 100%; height: auto; cursor: zoom-in; }

/* Clique pra ampliar (lightbox) - usado principalmente pra prints de tela
   do sistema, que tem texto miudo e ficam ilegiveis espremidos na largura
   da coluna do post. So um efeito visual na hora de visualizar, nao mexe
   no arquivo nem no HTML salvo do post (public/js/image-lightbox.js). */
.lightbox-overlay {
  position: fixed; inset: 0; background: rgba(17, 24, 39, 0.85);
  display: none; align-items: center; justify-content: center;
  z-index: 1000; padding: 32px;
}
.lightbox-overlay.active { display: flex; }
.lightbox-overlay img {
  max-width: 100%; max-height: 100%; border-radius: 6px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.4); cursor: zoom-out;
}
.lightbox-close {
  position: absolute; top: 18px; right: 24px; width: 40px; height: 40px;
  border-radius: 50%; background: rgba(255,255,255,0.12); border: none;
  color: #fff; font-size: 24px; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.lightbox-close:hover { background: rgba(255,255,255,0.22); }
.lightbox-hint {
  position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%);
  color: rgba(255,255,255,0.75); font-size: 12.5px; white-space: nowrap;
}
.post-content table { border-collapse: collapse; width: 100%; margin: 12px 0; }
.post-content table, .post-content th, .post-content td { border: 1px solid var(--color-border); }
.post-content th, .post-content td { padding: 8px 10px; text-align: left; }
.post-content pre { background: #f3f4f6; padding: 12px; border-radius: 6px; overflow-x: auto; }
.post-content blockquote { border-left: 4px solid var(--color-primary); margin: 12px 0; padding: 4px 16px; color: var(--color-text-muted); }

/* Linha de acoes do post (rodape): exportar para Word (qualquer pessoa
   logada) e editar post (so ADM) lado a lado */
.post-actions-row {
  margin-top: 24px; padding-top: 18px; border-top: 1px dashed var(--color-border);
  display: flex; gap: 10px; flex-wrap: wrap;
}

/* Aviso de pre-visualizacao (post ainda nao salvo) */
.preview-banner {
  background: #fef3c7; color: #92400e; border: 1px solid #fcd34d;
  padding: 10px 16px; border-radius: 6px; margin-bottom: 18px; font-weight: 600;
}

/* Feedback widget */
.feedback-box {
  margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--color-border);
}
.feedback-box .question { font-weight: 600; margin-bottom: 10px; }
.feedback-actions { display: flex; gap: 10px; }
.feedback-reason { display: none; margin-top: 14px; }
.feedback-reason textarea {
  width: 100%; min-height: 80px; padding: 10px; border: 1px solid var(--color-border);
  border-radius: var(--radius); font-family: inherit; font-size: 14px; resize: vertical;
}
.feedback-thanks { color: var(--color-success); font-weight: 600; }

/* Tables (admin) */
table.data-table { width: 100%; border-collapse: collapse; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius); overflow: hidden; }
table.data-table th, table.data-table td { padding: 10px 14px; border-bottom: 1px solid var(--color-border); text-align: left; font-size: 13.5px; }
table.data-table th { background: #f9fafb; font-weight: 600; color: var(--color-text-muted); text-transform: uppercase; font-size: 11.5px; letter-spacing: .03em; }
table.data-table tr:last-child td { border-bottom: none; }
table.data-table tr:hover td { background: #fafbfc; }

.badge { display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: 11.5px; font-weight: 600; }
.badge-published { background: #dcfce7; color: #15803d; }
.badge-draft { background: #fef3c7; color: #b45309; }
.badge-useful { background: #dcfce7; color: #15803d; }
.badge-not-useful { background: #fee2e2; color: #b91c1c; }
.badge-role { background: #e5e7eb; color: #374151; }
.badge-admin { background: var(--color-primary-soft-2); color: var(--color-primary); }

/* Stat tiles */
.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; margin-bottom: 24px; }
.stat-tile { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius); padding: 16px 18px; box-shadow: var(--shadow); }
.stat-tile .value { font-size: 26px; font-weight: 700; color: var(--color-dark); }
.stat-tile .label { color: var(--color-text-muted); font-size: 13px; margin-top: 2px; }

.card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius); padding: 20px 22px; box-shadow: var(--shadow); margin-bottom: 20px; }
.card h3 { margin-top: 0; font-size: 15px; }

/* Forms */
.form-group { margin-bottom: 16px; }
.form-group label { display: block; font-weight: 600; margin-bottom: 6px; font-size: 13.5px; }
.form-group input[type="text"], .form-group input[type="password"], .form-group select, .form-group textarea {
  width: 100%; padding: 9px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 14px; font-family: inherit;
}
.form-group .hint { color: var(--color-text-muted); font-size: 12.5px; margin-top: 4px; }
.hint { color: var(--color-text-muted); font-size: 12.5px; }

/* Textarea de "Codigo HTML" no formulario de post (ver views/admin/post-form.ejs).
   E um textarea normal (onde a pessoa digita/cola), com uma copia colorida
   (destacando tags/atributos) exibida atras dele, alinhada pixel a pixel -
   por isso as duas caixas precisam ter exatamente a mesma fonte, tamanho,
   espacamento e borda. */
.html-code-wrap { position: relative; margin-top: 8px; }
.html-code-wrap .content-html-editor,
.html-code-wrap .content-html-highlight {
  min-height: 480px; font-family: Consolas, 'Courier New', monospace; font-size: 13.5px;
  line-height: 1.55; padding: 9px 12px; border: 1px solid var(--color-border); border-radius: var(--radius);
  white-space: pre-wrap; word-break: break-word; margin: 0; box-sizing: border-box;
}
.content-html-highlight {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%;
  overflow: auto; background: #fff; color: var(--color-text); pointer-events: none;
}
.content-html-highlight code { font-family: inherit; white-space: inherit; word-break: inherit; }
.content-html-editor {
  position: relative; width: 100%; background: transparent; color: transparent; caret-color: #111827;
}
.content-html-editor::selection { background: #bfdbfe; color: transparent; }
.hl-tag { color: var(--color-primary); font-weight: 600; }
.hl-attr { color: #b45309; }
.hl-string { color: #15803d; }
.hl-comment { color: #6b7280; font-style: italic; }

/* Arrastar-e-soltar para reordenar categorias (tela "Gerenciar menu") */
.drag-handle { cursor: grab; color: var(--color-text-muted); margin-right: 6px; }
tbody.cat-block { cursor: grab; }
tbody.cat-block.dragging { opacity: .4; }
tbody.cat-block.drop-before tr.cat-row td { box-shadow: inset 0 2px 0 0 var(--color-primary); }
tbody.cat-block.drop-after tr.cat-row td { box-shadow: inset 0 -2px 0 0 var(--color-primary); }
.form-row { display: flex; gap: 16px; }
.form-row .form-group { flex: 1; }

.admin-shell { display: flex; align-items: flex-start; }
.admin-nav { width: 220px; flex-shrink: 0; background: var(--color-dark); min-height: calc(100vh - 58px); padding: 18px 0; }
.admin-nav a { display: block; padding: 10px 22px; color: #cbd5e1; font-size: 14px; }
.admin-nav a:hover, .admin-nav a.active { background: rgba(255,255,255,0.08); color: #fff; text-decoration: none; }
.admin-main { flex: 1; padding: 28px 32px; min-width: 0; }

.empty-state { text-align: center; padding: 60px 20px; color: var(--color-text-muted); }

.top-actions { display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; flex-wrap: wrap; gap: 10px; }

.tag-row { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 18px; }
.tag-row a { padding: 6px 14px; border-radius: 999px; border: 1px solid var(--color-border); font-size: 13px; color: var(--color-text); }
.tag-row a.active, .tag-row a:hover { background: var(--color-primary); color: #fff; border-color: var(--color-primary); text-decoration: none; }

footer.site-footer { text-align: center; padding: 20px; color: var(--color-text-muted); font-size: 12.5px; }

/* Tela inicial: quadro de recados (esquerda) + links rapidos (direita) */
/* max-width 874.4px = quadro de recados 10% maior (544px -> 598.4px); a
   coluna do Acesso rapido ao lado fica igual (ja estava no teto de 260px),
   entao todo esse espaco extra vai só para o quadro. */
.home-top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(180px, 260px); gap: 16px; margin-bottom: 26px; align-items: start; max-width: 874.4px; }
.announcement-board, .quick-links-board { margin-bottom: 0; display: flex; flex-direction: column; }
/* O quadro de recados ocupa toda a largura da sua coluna (sem sobra de
   espaco entre ele e o Acesso rapido). Quem controla o tamanho do quadro
   agora e a largura da coluna do Acesso rapido ao lado, que fica entre
   180px e 260px - estreita o bastante pra poucos links, mas cresce um
   pouco sozinha se links com nomes maiores forem cadastrados. */
.announcement-board h3, .quick-links-board h3 { margin: 0 0 12px; font-size: 14px; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: .03em; }
.announcement-empty { color: var(--color-text-muted); font-size: 14px; padding: 30px 0; text-align: center; }

/* Formato fixo tipo banner (16:9) - nao estica mais para acompanhar a altura
   do quadro de acesso rapido ao lado. Tamanho de imagem recomendado: 1200x675px
   (ou qualquer imagem na proporcao 16:9); imagens fora dessa proporcao sao
   cortadas nas bordas (object-fit: cover) para preencher o retangulo sem
   distorcer. */
.announcement-slideshow { position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: var(--radius); overflow: hidden; background: #f3f4f6; }
.announcement-slide {
  position: absolute; inset: 0; margin: 0; opacity: 0; transition: opacity .6s ease;
  display: flex; align-items: center; justify-content: center;
  pointer-events: none; /* evita que um slide invisivel (empilhado por baixo) "roube"
                            o clique do link do slide ativo, que fica por cima dele */
}
.announcement-slide.active { opacity: 1; pointer-events: auto; }
.announcement-slide img { width: 100%; height: 100%; object-fit: cover; background: #111827; }
/* Quando a imagem do quadro de recados tem um link (opcional) associado */
.announcement-slide-link { position: absolute; inset: 0; display: block; cursor: pointer; }
.announcement-slide figcaption {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 8px 14px; font-size: 13px;
  background: rgba(17,24,39,0.65); color: #fff;
}
.announcement-dots { position: absolute; bottom: 8px; right: 10px; display: flex; gap: 5px; z-index: 2; }
.announcement-dots .dot { width: 7px; height: 7px; border-radius: 50%; background: rgba(255,255,255,0.55); cursor: pointer; }
.announcement-dots .dot.active { background: #fff; }

.announcement-nav {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
  width: 32px; height: 32px; border-radius: 50%; border: none; cursor: pointer;
  background: rgba(17,24,39,0.45); color: #fff; font-size: 18px; line-height: 1;
  display: flex; align-items: center; justify-content: center;
}
.announcement-nav:hover { background: rgba(17,24,39,0.7); }
.announcement-nav.prev { left: 10px; }
.announcement-nav.next { right: 10px; }

/* Lista de Acesso rapido: cada link com um "avatar" circular (inicial do
   nome) e uma linha fina separando um item do seguinte - igual ao card que
   a Keila aprovou (imagem de referencia), sem depender de icones cadastrados
   um a um (usa so a inicial do nome de cada link). */
.quick-links-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; flex: 1; }
.quick-links-list li { border-top: 1px solid var(--color-border); }
.quick-links-list li:first-child { border-top: none; }
.quick-links-list li a {
  display: flex; align-items: center; gap: 10px; padding: 10px 4px; border-radius: 6px; color: var(--color-text); font-size: 13.5px; font-weight: 600;
}
.quick-links-list li a:hover { background: var(--color-primary-soft); color: var(--color-primary); text-decoration: none; }
.quick-links-list .qlink-icon {
  width: 26px; height: 26px; border-radius: 50%; background: var(--color-primary-soft); color: var(--color-primary);
  display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; flex-shrink: 0;
}

@media (max-width: 860px) {
  .app-shell, .admin-shell { flex-direction: column; }
  .sidebar, .admin-nav { width: 100%; min-height: auto; border-right: none; border-bottom: 1px solid var(--color-border); }
  .main, .admin-main { padding: 20px; }
  .search-form { max-width: none; margin: 10px 0 0; width: 100%; }
  .home-top { grid-template-columns: 1fr; }
}

/* Modal simples (aviso central com botao OK) - usado, por exemplo, para
   mostrar erros de formulario sem depender do alert() nativo do navegador. */
.modal-overlay {
  position: fixed; inset: 0; background: rgba(17,24,39,0.5);
  display: flex; align-items: center; justify-content: center;
  z-index: 100; padding: 16px;
}
.modal-box {
  background: var(--color-surface); border-radius: var(--radius); box-shadow: var(--shadow);
  width: 100%; max-width: 360px; padding: 22px; text-align: center;
}
.modal-box p { margin: 0 0 18px; color: var(--color-text); font-size: 14.5px; line-height: 1.5; }
.modal-box .btn { min-width: 96px; }

/* Posts restritos (visiveis so para o perfil Administrador) */
.badge-restricted { background: #fee2e2; color: #b91c1c; vertical-align: middle; display: inline-flex; align-items: center; gap: 4px; }
.post-card h2 .badge-restricted { font-size: 11px; margin-left: 6px; }
.ico-lock { flex: 0 0 auto; }
.restricted-banner {
  display: flex; align-items: flex-start; gap: 10px;
  background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; border-left: 4px solid #dc2626;
  padding: 10px 14px; border-radius: 6px; margin-bottom: 18px; font-size: 14px;
}
.restricted-banner .ico-lock { width: 18px; height: 18px; margin-top: 1px; }
.restricted-toggle { margin: -4px 0 14px; font-size: 13px; color: var(--color-text-muted); }
.restricted-toggle label { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; margin: 0; font-weight: 400; }
.restricted-toggle input { width: 14px; height: 14px; margin: 0; accent-color: #dc2626; }
.restricted-toggle strong { color: var(--color-text); font-weight: 600; }

/* ---- Menu lateral: "Inicio" no topo + icones nas categorias (out/2026) ---- */
.sidebar { padding-top: 14px; }
.sidebar .side-top { margin-bottom: 14px; }
.sidebar h3 { margin-bottom: 6px; }
.sidebar .cat-link { gap: 10px; padding: 9px 16px 9px 20px; font-weight: 500; color: #374151; border-radius: 0 8px 8px 0; margin-right: 10px; }
.sidebar .cat-link .cat-name { flex: 1; min-width: 0; line-height: 1.3; }
.sidebar .cat-ico { display: inline-flex; width: 20px; justify-content: center; color: #6b7280; flex-shrink: 0; }
.sidebar .cat-link:hover .cat-ico, .sidebar .cat-link.active .cat-ico { color: var(--color-primary); }
.sidebar .cat-link.active { background: var(--color-primary-soft); color: var(--color-primary); font-weight: 600; }
.sidebar .side-home { font-weight: 600; color: var(--color-text); }
.sidebar .count {
  min-width: 22px; height: 20px; padding: 0 7px; border-radius: 999px; background: #f3f4f6;
  color: #6b7280; font-size: 11.5px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center;
}
.sidebar .cat-link.active .count { background: var(--color-primary-soft-2); color: var(--color-primary); }
.sidebar details.cat-branch > summary.cat-link::before { content: none; display: none; }
.sidebar .cat-chevron { display: inline-flex; color: #9ca3af; transition: transform .15s ease; }
.sidebar .cat-chevron .ico-chevron { width: 16px; height: 16px; }
.sidebar details.cat-branch[open] > summary .cat-chevron { transform: rotate(90deg); color: var(--color-primary); }
.sidebar details.cat-branch ul { padding-left: 0; margin: 2px 0 4px 30px; border-left: 1px solid var(--color-border); }
.sidebar details.cat-branch ul .cat-link { font-weight: 400; font-size: 13.5px; padding: 7px 14px 7px 14px; }
.sidebar details.cat-branch ul details.cat-branch > summary.cat-link { font-weight: 500; }
.sidebar details.cat-branch ul details.cat-branch ul { margin-left: 14px; }

/* ---- Acesso rapido no modelo aprovado (out/2026): faixa azul no titulo,
   circulo colorido com a inicial (cores alternadas) e seta a direita ---- */
.quick-links-board { padding: 0; overflow: hidden; }
.quick-links-board h3 {
  margin: 0; padding: 12px 16px; background: var(--color-primary); color: #fff;
  text-transform: none; letter-spacing: 0; font-size: 15px; font-weight: 700;
}
.quick-links-board .announcement-empty { padding: 30px 16px; }
.quick-links-list { padding: 4px 8px 6px; }
.quick-links-list li { border-top: 1px solid #eef0f3; }
.quick-links-list li a { padding: 10px 6px; gap: 12px; font-weight: 500; color: var(--color-text); }
.quick-links-list li a .qlink-label { flex: 1; min-width: 0; }
.quick-links-list .qlink-icon { width: 30px; height: 30px; font-size: 13px; color: #fff; background: var(--qcolor, var(--color-primary)); }
.quick-links-list li:nth-child(4n+1) .qlink-icon { --qcolor: #0062d4; }
.quick-links-list li:nth-child(4n+2) .qlink-icon { --qcolor: #2a9d69; }
.quick-links-list li:nth-child(4n+3) .qlink-icon { --qcolor: #7036d8; }
.quick-links-list li:nth-child(4n+4) .qlink-icon { --qcolor: #f7801a; }
.quick-links-list .qlink-chevron { display: inline-flex; color: #9ca3af; }
.quick-links-list .qlink-chevron svg { width: 16px; height: 16px; }
.quick-links-list li a:hover .qlink-chevron { color: var(--color-primary); }

/* ---- Cards de posts no modelo aprovado (out/2026): faixa colorida a
   esquerda (cores alternadas), seta a direita e o card inteiro clicavel ---- */
.post-card {
  position: relative; border-left: 4px solid var(--pcolor, var(--color-primary));
  padding: 16px 48px 16px 20px; border-radius: 10px; transition: box-shadow .15s ease, transform .15s ease;
}
.post-card:nth-of-type(3n+1) { --pcolor: #0062d4; }
.post-card:nth-of-type(3n+2) { --pcolor: #7036d8; }
.post-card:nth-of-type(3n+3) { --pcolor: #1f8a5b; }
.post-card h2 { font-size: 16px; }
.post-card h2 a { color: var(--color-primary); }
.post-card h2 a::after { content: ''; position: absolute; inset: 0; } /* card inteiro clicavel */
.post-card p { font-size: 13.5px; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.post-card-chevron { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); color: #9ca3af; display: inline-flex; }
.post-card-chevron svg { width: 18px; height: 18px; }
.post-card:hover { box-shadow: 0 4px 14px rgba(0, 65, 137, .12); }
.post-card:hover .post-card-chevron { color: var(--color-primary); }
.post-card:hover h2 a { text-decoration: underline; }

/* ---- Usuario no topo (out/2026): avatar com iniciais, saudacao e botao
   "Painel ADM" (so perfil Administrador) logo abaixo do nome ---- */
.user-box { display: flex; align-items: center; gap: 10px; }
.user-avatar {
  width: 38px; height: 38px; border-radius: 50%; background: var(--color-primary-soft-2); color: var(--color-primary);
  display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; flex-shrink: 0;
}
.user-info { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; line-height: 1.2; }
.user-name { font-size: 13.5px; font-weight: 600; color: var(--color-text); }
.btn-admin {
  display: inline-block; padding: 3px 10px; border-radius: 999px; background: var(--color-primary); color: #fff;
  font-size: 12px; font-weight: 600; line-height: 1.4;
}
.btn-admin:hover { background: var(--color-primary-dark); color: #fff; text-decoration: none; }
.btn-logout { margin-left: 4px; }

/* ---- Area do usuario (out/2026): menu Perfil/Sair no nome e tela de perfil ---- */
img.user-avatar { object-fit: cover; border: 1px solid var(--color-border); }
.user-menu { position: relative; }
.user-menu > summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 4px; user-select: none; }
.user-menu > summary::-webkit-details-marker { display: none; }
.user-menu .ico-caret { width: 15px; height: 15px; color: #6b7280; transition: transform .15s ease; }
.user-menu[open] .ico-caret { transform: rotate(180deg); color: var(--color-primary); }
.user-menu-panel {
  position: absolute; right: 0; top: calc(100% + 8px); min-width: 170px; z-index: 50;
  background: #fff; border: 1px solid var(--color-border); border-radius: 10px; box-shadow: 0 8px 24px rgba(17, 24, 39, .12); padding: 6px;
}
.user-menu-panel a, .user-menu-panel button {
  display: flex; align-items: center; gap: 9px; width: 100%; padding: 8px 10px; border-radius: 7px;
  font-size: 13.5px; color: var(--color-text); background: none; border: none; cursor: pointer; font-family: inherit; text-align: left;
}
.user-menu-panel a:hover, .user-menu-panel button:hover { background: var(--color-primary-soft); color: var(--color-primary); text-decoration: none; }
.user-menu-panel form { margin: 0; }
.user-menu-panel .ico-menu { width: 16px; height: 16px; color: #6b7280; }
.user-menu-panel a:hover .ico-menu, .user-menu-panel button:hover .ico-menu { color: var(--color-primary); }
.flash { padding: 10px 14px; border-radius: 8px; margin-bottom: 16px; font-size: 14px; }
.flash-ok { background: #dcfce7; color: #166534; border: 1px solid #bbf7d0; }
.flash-error { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.profile-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 18px; max-width: 900px; align-items: start; }
.profile-card h3 { margin-bottom: 16px; }
.profile-head { display: flex; align-items: center; gap: 16px; margin-bottom: 16px; }
.profile-photo { width: 88px; height: 88px; border-radius: 50%; object-fit: cover; flex-shrink: 0; border: 1px solid var(--color-border); }
.profile-photo-initials { display: inline-flex; align-items: center; justify-content: center; background: var(--color-primary-soft-2); color: var(--color-primary); font-size: 30px; font-weight: 700; border: none; }
.profile-name { font-size: 17px; font-weight: 700; margin-bottom: 4px; }
.profile-meta { font-size: 13px; color: var(--color-text-muted); margin-top: 3px; }
.profile-actions { display: inline-block; margin: 0 6px 0 0; }
.profile-actions label.btn { cursor: pointer; }
.ico-btn { width: 15px; height: 15px; vertical-align: -3px; }
.profile-hint { color: var(--color-text-muted); font-size: 12.5px; margin: 10px 0 12px; }

/* ---- Dashboard (out/2026) ---- */
.dash .top-actions { margin-bottom: 18px; }
.kpi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; margin-bottom: 20px; }
.kpi {
  display: grid; grid-template-columns: auto 1fr; grid-template-areas: "ico label" "value value" "sub sub";
  column-gap: 10px; row-gap: 4px; align-items: center; padding: 16px 18px; background: var(--color-surface);
  border: 1px solid var(--color-border); border-radius: 12px; box-shadow: var(--shadow); color: var(--color-text);
}
a.kpi:hover { text-decoration: none; border-color: var(--color-primary-soft-2); box-shadow: 0 4px 14px rgba(0, 65, 137, .10); }
.kpi-ico { grid-area: ico; width: 32px; height: 32px; border-radius: 9px; background: var(--color-primary-soft); color: var(--color-primary); display: inline-flex; align-items: center; justify-content: center; }
.kpi-ico svg { width: 17px; height: 17px; }
.kpi-label { grid-area: label; font-size: 13px; color: var(--color-text-muted); font-weight: 600; }
.kpi-value { grid-area: value; font-size: 28px; font-weight: 700; color: var(--color-text); line-height: 1.15; margin-top: 6px; font-variant-numeric: tabular-nums; }
.kpi-sub { grid-area: sub; font-size: 12px; color: var(--color-text-muted); }
.dash-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
@media (max-width: 1100px) { .dash-grid { grid-template-columns: 1fr; } }
.dash-card { margin-bottom: 0; border-radius: 12px; }
.dash-card h3 { margin: 0 0 2px; font-size: 15px; }
.dash-note { margin: 0 0 14px; color: var(--color-text-muted); font-size: 12.5px; }
.dash-empty { color: var(--color-text-muted); font-size: 13.5px; padding: 18px 0; margin: 0; }
.dash-sub { margin: 18px 0 8px; font-size: 13px; color: var(--color-text-muted); font-weight: 600; }
.chart-box { position: relative; width: 100%; }
.dash-more { display: inline-block; margin-top: 12px; font-size: 13px; font-weight: 600; }
.fb-bar { display: flex; height: 14px; border-radius: 7px; overflow: hidden; gap: 2px; background: #fff; margin-top: 12px; }
.fb-ok { background: var(--color-success); border-radius: 7px 0 0 7px; }
.fb-no { background: var(--color-danger); border-radius: 0 7px 7px 0; }
.fb-legend { display: flex; gap: 18px; margin-top: 8px; font-size: 13px; color: var(--color-text); }
.fb-legend .dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 4px; }
.dot-ok { background: var(--color-success); } .dot-no { background: var(--color-danger); }
.dash-list { list-style: none; margin: 0; padding: 0; }
.dash-list li { padding: 10px 0; border-top: 1px solid #eef0f3; }
.dash-list li:first-child { border-top: none; }
.dash-list.compact li { padding: 8px 0; }
.dl-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.dl-main { font-size: 13.5px; font-weight: 600; color: var(--color-text); min-width: 0; }
.dl-quote { font-size: 13px; color: #374151; margin-top: 3px; }
.dl-meta { font-size: 12px; color: var(--color-text-muted); margin-top: 2px; }
.rank-list { list-style: none; margin: 8px 0 0; padding: 0; }
.rank-list li { display: flex; gap: 12px; align-items: flex-start; padding: 8px 0; }
.rank-n { width: 24px; height: 24px; border-radius: 50%; background: var(--color-primary-soft); color: var(--color-primary); font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.rank-body { flex: 1; min-width: 0; }
.rank-top { display: flex; align-items: center; gap: 6px; font-size: 13.5px; font-weight: 600; }
.rank-top a { color: var(--color-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rank-v { margin-left: auto; color: var(--color-text-muted); font-weight: 600; font-variant-numeric: tabular-nums; font-size: 12.5px; }
.rank-track { height: 6px; background: #f1f3f6; border-radius: 3px; margin-top: 6px; overflow: hidden; }
.rank-track span { display: block; height: 100%; background: var(--color-primary); border-radius: 3px; }

/* ---- Lista de posts: busca e paginacao (out/2026) ---- */
.list-search { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; max-width: 640px; position: relative; }
.list-search input { flex: 1; padding: 9px 12px 9px 36px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 14px; font-family: inherit; background: #fff; }
.list-search input:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px var(--color-primary-soft); }
.list-search-ico { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: #9ca3af; display: inline-flex; }
.list-search-ico svg { width: 16px; height: 16px; }
.list-info { font-size: 13px; color: var(--color-text-muted); margin: -4px 0 12px; }
.pager { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 14px; }
.pager-info { font-size: 13px; color: var(--color-text-muted); }
.pager-links { display: flex; gap: 4px; flex-wrap: wrap; }
.pager-links a, .pager-links span { min-width: 34px; height: 34px; padding: 0 10px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; border: 1px solid var(--color-border); background: #fff; color: var(--color-text); }
.pager-links a:hover { border-color: var(--color-primary); color: var(--color-primary); text-decoration: none; }
.pager-links .current { background: var(--color-primary); border-color: var(--color-primary); color: #fff; font-weight: 600; }
.pager-links .disabled { color: #c3c8cf; }
.pager-links .gap { border: none; background: none; min-width: 20px; padding: 0; }

/* ---- Seletor de categoria do post no padrao do menu lateral (out/2026) ---- */
.cat-picker { position: relative; }
.cp-toggle {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 12px;
  border: 1px solid var(--color-border); border-radius: var(--radius); background: #fff; font: inherit; font-size: 14px; cursor: pointer; text-align: left; color: var(--color-text);
}
.cp-toggle:focus, .cp-toggle[aria-expanded="true"] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px var(--color-primary-soft); }
.cp-current.empty { color: var(--color-text-muted); }
.cp-toggle .ico-caret { width: 16px; height: 16px; color: #6b7280; flex-shrink: 0; }
.cp-panel {
  position: absolute; z-index: 40; left: 0; right: 0; top: calc(100% + 6px); background: #fff; border: 1px solid var(--color-border);
  border-radius: 10px; box-shadow: 0 12px 28px rgba(17, 24, 39, .14); padding: 8px; max-height: 380px; overflow: auto;
}
.cp-search { position: sticky; top: -8px; background: #fff; padding: 0 0 8px; display: flex; align-items: center; }
.cp-search svg { position: absolute; left: 10px; width: 15px; height: 15px; color: #9ca3af; }
.cp-search input { width: 100%; padding: 8px 10px 8px 32px; border: 1px solid var(--color-border); border-radius: 8px; font: inherit; font-size: 13.5px; }
.cp-search input:focus { outline: none; border-color: var(--color-primary); }
.cp-tree, .cp-tree ul { list-style: none; margin: 0; padding: 0; }
.cp-tree ul { display: none; margin: 2px 0 4px 21px; padding-left: 8px; border-left: 1px solid var(--color-border); }
.cp-branch.open > ul { display: block; }
.cp-row { display: flex; align-items: center; gap: 9px; padding: 7px 10px; border-radius: 7px; font-size: 13.5px; cursor: pointer; color: #374151; user-select: none; }
.cp-row:hover, .cp-row:focus { background: var(--color-primary-soft); outline: none; }
.cp-parent { font-weight: 500; }
.cp-tree > li > .cp-row { font-weight: 500; }
.cp-tree ul .cp-option { font-weight: 400; }
.cp-ico { display: inline-flex; width: 18px; justify-content: center; color: #6b7280; flex-shrink: 0; }
.cp-ico svg { width: 17px; height: 17px; }
.cp-name { flex: 1; min-width: 0; }
.cp-chevron { display: inline-flex; color: #9ca3af; transition: transform .15s ease; }
.cp-chevron svg { width: 15px; height: 15px; }
.cp-branch.open > .cp-row .cp-chevron { transform: rotate(90deg); color: var(--color-primary); }
.cp-check { visibility: hidden; color: var(--color-primary); font-weight: 700; }
.cp-row.selected { background: var(--color-primary-soft); color: var(--color-primary); font-weight: 600; }
.cp-row.selected .cp-check { visibility: visible; }
.cp-row.selected .cp-ico { color: var(--color-primary); }
.cp-legacy { color: #b45309; font-style: normal; font-size: 12px; font-weight: 400; }
.cp-none { border-bottom: 1px solid #eef0f3; margin-bottom: 4px; padding-bottom: 4px; }
.cp-empty { color: var(--color-text-muted); font-size: 13px; padding: 10px; margin: 0; }

.kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1100px) { .kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .kpi-grid { grid-template-columns: 1fr; } }

/* ---- Chat "Pergunte a intranet" (prototipo, out/2026) ---- */
.chat-fab {
  position: fixed; right: 24px; bottom: 24px; z-index: 60; display: inline-flex; align-items: center; gap: 8px;
  padding: 12px 18px; border: none; border-radius: 999px; background: var(--color-primary); color: #fff; font: inherit; font-size: 14px; font-weight: 600;
  box-shadow: 0 8px 24px rgba(0, 65, 137, .35); cursor: pointer;
}
.chat-fab:hover { background: var(--color-primary-dark); }
.chat-fab .ico-fab { width: 18px; height: 18px; }
.chat-panel {
  position: fixed; right: 24px; bottom: 24px; z-index: 61; width: 400px; height: min(620px, calc(100vh - 48px));
  background: #fff; border-radius: 16px; box-shadow: 0 18px 50px rgba(17, 24, 39, .25); display: flex; flex-direction: column; overflow: hidden;
  border: 1px solid var(--color-border);
}
.chat-panel[hidden] { display: none; }
.chat-head { background: var(--color-primary); color: #fff; padding: 12px 12px 12px 16px; display: flex; align-items: center; justify-content: space-between; }
.chat-head-title { display: flex; align-items: center; gap: 10px; }
.chat-head-title strong { display: block; font-size: 15px; }
.chat-head-title small { display: block; font-size: 12px; opacity: .8; }
.chat-bot-ico { width: 34px; height: 34px; border-radius: 50%; background: rgba(255,255,255,.15); display: inline-flex; align-items: center; justify-content: center; }
.chat-bot-ico svg { width: 18px; height: 18px; }
.chat-head-actions { display: flex; gap: 4px; }
.chat-icon-btn { width: 32px; height: 32px; border-radius: 8px; border: none; background: transparent; color: #fff; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.chat-icon-btn:hover { background: rgba(255,255,255,.15); }
.chat-icon-btn svg { width: 17px; height: 17px; }
.chat-demo-banner { background: #fef3c7; color: #92400e; font-size: 12px; padding: 7px 14px; border-bottom: 1px solid #fde68a; }
.chat-body { flex: 1; overflow-y: auto; padding: 16px 14px; background: #f7f8fa; display: flex; flex-direction: column; gap: 10px; }
.chat-msg { display: flex; }
.chat-msg.user { justify-content: flex-end; }
.chat-bubble { max-width: 86%; padding: 10px 13px; border-radius: 14px; font-size: 13.5px; line-height: 1.5; background: #fff; border: 1px solid #e8eaee; color: var(--color-text); }
.chat-msg.user .chat-bubble { background: var(--color-primary); border-color: var(--color-primary); color: #fff; border-bottom-right-radius: 4px; }
.chat-msg.bot .chat-bubble { border-bottom-left-radius: 4px; }
.chat-suggest { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; margin-top: 4px; }
.chat-suggest span { font-size: 12px; color: var(--color-text-muted); }
.chat-chip { border: 1px solid var(--color-primary-soft-2); background: #fff; color: var(--color-primary); border-radius: 999px; padding: 6px 12px; font: inherit; font-size: 12.5px; cursor: pointer; text-align: left; }
.chat-chip:hover { background: var(--color-primary-soft); }
.chat-sources { margin-top: 10px; padding-top: 8px; border-top: 1px solid #eef0f3; display: flex; flex-direction: column; gap: 5px; }
.chat-sources span { font-size: 11.5px; font-weight: 700; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: .04em; }
.chat-sources a { font-size: 12.5px; font-weight: 600; padding: 6px 9px; background: var(--color-primary-soft); border-radius: 8px; }
.chat-rate { margin-top: 8px; display: flex; gap: 6px; }
.chat-rate button { border: 1px solid var(--color-border); background: #fff; border-radius: 8px; padding: 2px 8px; cursor: pointer; font-size: 13px; }
.chat-rate button.on { border-color: var(--color-primary); background: var(--color-primary-soft); }
.chat-bubble.typing { display: inline-flex; gap: 4px; padding: 12px 14px; }
.chat-bubble.typing span { width: 7px; height: 7px; border-radius: 50%; background: #9ca3af; animation: chatdot 1s infinite ease-in-out; }
.chat-bubble.typing span:nth-child(2) { animation-delay: .15s; } .chat-bubble.typing span:nth-child(3) { animation-delay: .3s; }
@keyframes chatdot { 0%, 80%, 100% { opacity: .3; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-3px); } }
.chat-input { display: flex; align-items: flex-end; gap: 8px; padding: 10px 12px; border-top: 1px solid var(--color-border); background: #fff; }
.chat-input textarea { flex: 1; resize: none; border: 1px solid var(--color-border); border-radius: 10px; padding: 9px 11px; font: inherit; font-size: 14px; max-height: 110px; }
.chat-input textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px var(--color-primary-soft); }
.chat-send { width: 40px; height: 40px; border-radius: 10px; border: none; background: var(--color-primary); color: #fff; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.chat-send svg { width: 18px; height: 18px; }
.chat-foot { margin: 0; padding: 0 12px 10px; font-size: 11.5px; color: var(--color-text-muted); text-align: center; background: #fff; }
@media (max-width: 600px) {
  .chat-panel { right: 0; bottom: 0; width: 100%; height: 100%; border-radius: 0; }
  .chat-fab span { display: none; } .chat-fab { padding: 14px; }
}

/* ---- Painel: Assistente de IA (out/2026) ---- */
.ai-admin form { max-width: 880px; }
.ai-admin #ai-test { max-width: 880px; }
.ai-card { border-radius: 12px; }
.ai-card h3 { display: flex; align-items: center; gap: 10px; margin: 0 0 4px; font-size: 16px; }
.ai-card h3 small { font-weight: 400; color: var(--color-text-muted); font-size: 12.5px; }
.ai-step { width: 26px; height: 26px; border-radius: 50%; background: var(--color-primary); color: #fff; font-size: 13px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.ai-step svg { width: 14px; height: 14px; }
.ai-step.ai-lock { background: #6b7280; }
.ai-help { color: var(--color-text-muted); font-size: 13px; margin: 0 0 14px; }
.ai-field { margin-bottom: 14px; }
.ai-label { display: block; font-weight: 600; font-size: 13.5px; margin-bottom: 6px; }
.ai-label small { font-weight: 400; color: var(--color-text-muted); }
.ai-field input[type=text], .ai-field input[type=password], .ai-field select, .ai-field textarea, .ai-test-form input {
  width: 100%; padding: 9px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font: inherit; font-size: 14px; background: #fff;
}
.ai-field textarea { resize: vertical; }
.ai-field input:focus, .ai-field select:focus, .ai-field textarea:focus, .ai-test-form input:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px var(--color-primary-soft); }
.ai-inline { display: flex; align-items: center; gap: 12px; margin-bottom: 0; }
.ai-inline .ai-label { margin: 0; }
.ai-input-sm { width: 90px; padding: 7px 10px; border: 1px solid var(--color-border); border-radius: var(--radius); font: inherit; }
.ai-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
@media (max-width: 760px) { .ai-grid-2 { grid-template-columns: 1fr; } }
.ai-options { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ai-options.three { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 760px) { .ai-options, .ai-options.three { grid-template-columns: 1fr; } }
.ai-option { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border: 1px solid var(--color-border); border-radius: 10px; cursor: pointer; background: #fff; }
.ai-option input { margin-top: 3px; accent-color: var(--color-primary); }
.ai-option strong { display: block; font-size: 14px; }
.ai-option small { display: block; color: var(--color-text-muted); font-size: 12.5px; margin-top: 2px; }
.ai-option:has(input:checked) { border-color: var(--color-primary); background: var(--color-primary-soft); }
.ai-seg { display: inline-flex; border: 1px solid var(--color-border); border-radius: 10px; overflow: hidden; background: #fff; flex-wrap: wrap; }
.ai-seg label { cursor: pointer; }
.ai-seg input { position: absolute; opacity: 0; pointer-events: none; }
.ai-seg span { display: inline-block; padding: 8px 14px; font-size: 13.5px; border-right: 1px solid var(--color-border); }
.ai-seg label:last-child span { border-right: none; }
.ai-seg input:checked + span { background: var(--color-primary); color: #fff; font-weight: 600; }
.ai-check { display: flex; align-items: center; gap: 8px; font-size: 13.5px; margin: 0 0 10px; cursor: pointer; }
.ai-check input { accent-color: var(--color-primary); width: 16px; height: 16px; }
.ai-checks { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 16px; margin-bottom: 8px; }
@media (max-width: 760px) { .ai-checks { grid-template-columns: 1fr; } }
.ai-check-inline { font-size: 12.5px; color: var(--color-danger); margin-left: 10px; cursor: pointer; }
.ai-keystate { font-size: 13px; margin: 0 0 6px; }
.ai-card-warn { border-left: 4px solid #f59e0b; }
.ai-card-locked { background: #f9fafb; }
.ai-rules { margin: 8px 0 12px; padding-left: 20px; font-size: 13.5px; color: #374151; }
.ai-rules li { margin-bottom: 4px; }
.ai-preview summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--color-primary); }
.ai-preview pre { white-space: pre-wrap; background: #fff; border: 1px solid var(--color-border); border-radius: 8px; padding: 12px; font-size: 12px; max-height: 340px; overflow: auto; margin-top: 10px; }
.ai-status .ai-status-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.ai-status.on { border-color: #bbf7d0; }
.switch { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; user-select: none; }
.switch input { position: absolute; opacity: 0; }
.switch-track { width: 46px; height: 26px; border-radius: 999px; background: #d1d5db; position: relative; transition: background .15s; }
.switch-thumb { position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.2); transition: left .15s; }
.switch input:checked + .switch-track { background: var(--color-success); }
.switch input:checked + .switch-track .switch-thumb { left: 23px; }
.switch-label::after { content: attr(data-off); font-weight: 600; font-size: 14px; color: var(--color-text-muted); }
.switch input:checked ~ .switch-label::after { content: attr(data-on); color: #15803d; }
.ai-savebar { position: sticky; bottom: 0; z-index: 5; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 16px; margin: 0 0 20px; background: rgba(255,255,255,.95); border: 1px solid var(--color-border); border-radius: 12px; box-shadow: 0 -4px 16px rgba(17,24,39,.06); }
.ai-savebar .ai-help { margin: 0; }
.ai-test-form { display: flex; gap: 8px; }
.ai-test-out { margin-top: 14px; padding: 14px; background: #f7f8fa; border-radius: 10px; font-size: 14px; }
.ai-demo-tag { display: inline-block; font-size: 12px; background: #fef3c7; color: #92400e; padding: 2px 8px; border-radius: 6px; margin: 0 0 8px; }

/* ---- Assistente de IA: refinamento visual (out/2026) ---- */
.ai-title { display: flex; align-items: center; gap: 14px; }
.ai-title-ico { color: var(--color-primary); display: inline-flex; }
.ai-title-ico svg { width: 34px; height: 34px; }
.ai-admin .page-title { font-size: 26px; color: var(--color-primary); margin-bottom: 2px; }
.ai-admin .page-subtitle { margin-bottom: 0; }
.ai-admin .top-actions { margin-bottom: 18px; }
.ai-flash { display: flex; align-items: center; gap: 10px; font-weight: 600; max-width: 880px; }
.ai-flash-ico { display: inline-flex; color: #fff; background: var(--color-success); border-radius: 50%; padding: 2px; }
.ai-flash-ico svg { width: 16px; height: 16px; }
.ai-flash > span:nth-child(2) { flex: 1; }
.ai-flash-close { border: none; background: none; color: #166534; cursor: pointer; display: inline-flex; padding: 2px; opacity: .7; }
.ai-flash-close:hover { opacity: 1; }
.ai-flash-close svg { width: 16px; height: 16px; }
.ai-card { padding: 20px 24px; }
.ai-head { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 16px; }
.ai-head h3 { margin: 0; font-size: 17px; font-weight: 700; color: var(--color-text); display: block; }
.ai-head .ai-help { margin: 3px 0 0; }
.ai-card .ai-head .ai-step { width: 34px; height: 34px; font-size: 16px; font-weight: 700; margin-top: 0; }
.ai-card .ai-head .ai-step svg { width: 17px; height: 17px; }
.ai-head-ico { width: 34px; height: 34px; border-radius: 50%; background: var(--color-primary-soft); color: var(--color-primary); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.ai-head-ico svg { width: 18px; height: 18px; }
.ai-status .ai-status-row { align-items: center; margin-bottom: 4px; }
.ai-status .ai-status-row .ai-head { margin-bottom: 0; }
.ai-option { align-items: center; padding: 14px 16px; }
.ai-option input { margin-top: 0; }
.ai-opt-ico { display: inline-flex; color: #4b5563; }
.ai-opt-ico svg { width: 18px; height: 18px; }
.ai-option:has(input:checked) .ai-opt-ico { color: var(--color-primary); }
.ai-info { display: inline-flex; vertical-align: -3px; color: #9ca3af; cursor: help; margin-left: 4px; }
.ai-info svg { width: 15px; height: 15px; }
.ai-inline .ai-input-sm { width: 100px; padding: 8px 10px; }
.ai-field select { appearance: none; -webkit-appearance: none; padding-right: 36px; max-width: 420px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center / 16px; }
.ai-savebar-note { display: inline-flex; align-items: center; gap: 8px; }
.ai-savebar-note svg { width: 16px; height: 16px; color: #6b7280; }
.ai-save-btn { display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; font-weight: 600; }
.ai-save-btn svg { width: 16px; height: 16px; }
.ai-status .ai-status-row { margin-bottom: 16px; }

/* ---- Pagina institucional "Sobre Nos" (out/2026) ---- */
.sidebar .side-top li + li { margin-top: 2px; }
.sidebar .side-home .cat-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.institutional-page .page-title { margin-bottom: 16px; }

/* ---- Excluir post com confirmacao Sim / Nao (out/2026) ---- */
.modal-overlay[hidden] { display: none; }
.link-danger { border: none; background: none; padding: 0; color: var(--color-danger); font: inherit; font-size: inherit; cursor: pointer; }
.link-danger:hover { text-decoration: underline; }
.btn-danger-outline { background: #fff; color: var(--color-danger); border-color: #fecaca; }
.btn-danger-outline:hover { background: #fef2f2; border-color: var(--color-danger); color: var(--color-danger); }
.btn-danger-solid { background: var(--color-danger); border-color: var(--color-danger); color: #fff; }
.btn-danger-solid:hover { background: #b91c1c; border-color: #b91c1c; color: #fff; }
.confirm-box { max-width: 400px; padding: 26px 24px 22px; border-radius: 14px; box-shadow: 0 20px 50px rgba(17, 24, 39, .3); }
.confirm-ico { width: 48px; height: 48px; border-radius: 50%; background: #fee2e2; color: var(--color-danger); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 10px; }
.confirm-ico svg { width: 22px; height: 22px; }
.confirm-box h3 { margin: 0 0 8px; font-size: 18px; }
.confirm-box form { margin: 0; }
.confirm-actions { display: flex; gap: 10px; justify-content: center; }
.confirm-actions .btn { min-width: 120px; }

.form-actions-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.form-actions-row .btn-delete-post{margin-left:auto}

/* Identidade (logo + nome) na tela Sobre Nos */
.brand-card { padding: 16px 20px; }
.brand-row { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.brand-logo-box { width: 64px; height: 64px; border: 1px dashed var(--color-border); border-radius: 10px; display: flex; align-items: center; justify-content: center; background: #f8fafc; flex-shrink: 0; }
.brand-logo-box img { max-width: 48px; max-height: 48px; }
.brand-logo-actions { display: flex; flex-direction: column; gap: 4px; min-width: 170px; }
.brand-logo-actions .ai-help { margin: 0; font-size: 12px; }
.brand-btns { display: flex; align-items: center; gap: 10px; }
.brand-btns .btn { cursor: pointer; }
.link-muted { border: none; background: none; padding: 0; font: inherit; font-size: 13px; color: var(--color-text-muted); cursor: pointer; text-decoration: underline; }
.brand-names { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; min-width: 280px; }
.brand-names .ai-field { margin: 0; }
.brand-preview { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--color-border); display: flex; align-items: center; gap: 14px; }
.brand-preview-tag { font-size: 12px; color: var(--color-text-muted); }
.brand-preview-box { display: inline-flex; background: #fff; border: 1px solid var(--color-border); border-radius: 8px; padding: 6px 12px; }
.brand-err { color: var(--color-danger) !important; }
.brand-file-btn { align-self: flex-start; cursor: pointer; }
.vis-warn { color: #b45309; margin: -10px 0 16px; font-size: 12.5px; }
/* Logo + nome no canto superior esquerdo (todas as telas) */
.brand-mark-top { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }
.topbar .logo .brand-mark-top img, .brand-mark-top img { height: 34px; width: auto; max-width: 120px; object-fit: contain; display: block; }
.brand-mark-names { display: flex; flex-direction: column; line-height: 1.08; font-size: 13.5px; font-weight: 700; white-space: nowrap; }
.brand-mark-names b { color: #1f2937; }
.brand-mark-names i { font-style: normal; color: #2563eb; }
.brand-mark-names small { font-size: 9px; font-weight: 400; color: #6b7280; }
.topbar a.logo { text-decoration: none; }
.brand-login { display: inline-flex; }
.brand-login .brand-mark-top img { height: 40px; }
.brand-login .brand-mark-names { font-size: 15px; text-align: left; }
.vis-bar { display: flex; align-items: center; gap: 10px; padding: 9px 14px; margin-bottom: 18px; border: 1px solid var(--color-border); border-radius: 10px; background: #fff; font-size: 13.5px; }
.vis-bar.on { border-color: #bbf7d0; }
.vis-ico { color: var(--color-text-muted); display: inline-flex; }
.vis-ico svg { width: 16px; height: 16px; }
.vis-text { flex: 1; display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.vis-text span { color: var(--color-text-muted); font-size: 12.5px; }
.switch-sm .switch-track { width: 36px; height: 20px; }
.switch-sm .switch-thumb { width: 14px; height: 14px; }
.switch-sm input:checked + .switch-track .switch-thumb { left: 19px; }
.switch-sm .switch-label::after { font-size: 13px; }

/* Menu do usuario: Modo Admin, Modo escuro e separador */
.user-menu-panel { min-width: 210px; }
.user-menu-sep { height: 1px; background: var(--color-border); margin: 5px 4px; }
.theme-toggle .mini-switch { margin-left: auto; width: 30px; height: 17px; border-radius: 999px; background: #cbd2dc; position: relative; flex-shrink: 0; transition: background .15s; }
.theme-toggle .mini-switch span { position: absolute; top: 2px; left: 2px; width: 13px; height: 13px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.25); transition: left .15s; }
.theme-toggle[aria-checked="true"] .mini-switch { background: var(--color-primary); }
.theme-toggle[aria-checked="true"] .mini-switch span { left: 15px; }

/* ===== Modo escuro (intranet, Painel ADM e login) ===== */
html[data-theme="dark"] {
  color-scheme: dark;
  --color-bg: #0e1522;
  --color-surface: #162032;
  --color-border: #263349;
  --color-text: #e4e9f1;
  --color-text-muted: #9aa7bb;
  --color-primary: #2f6fd6;
  --color-primary-dark: #2559ad;
  --color-primary-soft: #1b2a44;
  --color-primary-soft-2: #22375a;
  --color-dark: #e4e9f1;
  --shadow: 0 1px 3px rgba(0,0,0,.45);
  --link: #7fb2ff;
}
html[data-theme="dark"] a { color: var(--link); }
html[data-theme="dark"] .btn, html[data-theme="dark"] .btn:hover { color: var(--color-text); }
html[data-theme="dark"] .btn-primary, html[data-theme="dark"] .btn-primary:hover { color: #fff; }
html[data-theme="dark"] .user-menu-panel { background: var(--color-surface); box-shadow: 0 10px 28px rgba(0,0,0,.5); }
html[data-theme="dark"] .user-menu-panel a, html[data-theme="dark"] .user-menu-panel button { color: var(--color-text); }
html[data-theme="dark"] .user-menu-panel a:hover, html[data-theme="dark"] .user-menu-panel button:hover { color: var(--link); }
html[data-theme="dark"] .user-menu-panel .ico-menu, html[data-theme="dark"] .user-menu .ico-caret { color: var(--color-text-muted); }
html[data-theme="dark"] .user-avatar { color: #cfe0ff; }
html[data-theme="dark"] .theme-toggle .mini-switch { background: #3a4760; }
html[data-theme="dark"] .search-form input[type="search"] { background: #1c2840; border-color: #2a3852; color: var(--color-text); }
html[data-theme="dark"] .search-form input[type="search"]::placeholder { color: #8796ae; }
html[data-theme="dark"] .search-form input[type="search"]:focus { background: #111a2b; border-color: var(--link); box-shadow: 0 0 0 3px rgba(127,178,255,.18); }
html[data-theme="dark"] .search-form .search-ico { color: #9aa7bb; }
html[data-theme="dark"] .brand-mark-names b { color: #f1f5fb; }
html[data-theme="dark"] .brand-mark-names i { color: #7fb2ff; }
html[data-theme="dark"] .brand-mark-names small { color: #8b97ab; }
html[data-theme="dark"] input, html[data-theme="dark"] select, html[data-theme="dark"] textarea { background: #111a2b; color: var(--color-text); border-color: var(--color-border); }
html[data-theme="dark"] .flash-ok { background: #0f2e1d; color: #86efac; border-color: #1d5a37; }
html[data-theme="dark"] .flash-error { background: #3a1416; color: #fca5a5; border-color: #6b2226; }
/* Conteudo dos posts: cores fixas do editor viram a cor do tema para continuar legivel */
html[data-theme="dark"] .post-content, html[data-theme="dark"] .post-content * { color: var(--color-text) !important; }
html[data-theme="dark"] .post-content a, html[data-theme="dark"] .post-content a * { color: var(--link) !important; }
html[data-theme="dark"] .post-content [style*="background"] { background-color: transparent !important; }
html[data-theme="dark"] .post-content table, html[data-theme="dark"] .post-content td, html[data-theme="dark"] .post-content th { border-color: var(--color-border) !important; }
html[data-theme="dark"] .post-content th { background: #1c2840 !important; }
html[data-theme="dark"] .post-content img { background: transparent; }
html[data-theme="dark"] .post-content pre, html[data-theme="dark"] .post-content code { background: #0b111c !important; }
html[data-theme="dark"] .post-content blockquote { border-left-color: var(--color-border); }
html[data-theme="dark"] .post-card p { color: #c3cbd8; }
html[data-theme="dark"] .post-content pre { background: #0b111c; }
html[data-theme="dark"] .sidebar .cat-link { color: #d3d9e3; }
html[data-theme="dark"] .sidebar .cat-ico { color: #8e9bb0; }
html[data-theme="dark"] .sidebar .count { background: #1f2b40; color: #9aa7bb; }
html[data-theme="dark"] .sidebar .cat-link:hover, html[data-theme="dark"] .sidebar .cat-link.active { color: var(--link); }
html[data-theme="dark"] .quick-links-list li { border-top-color: var(--color-border); }

html[data-theme="dark"] .quick-links-list a:hover { color: var(--link); }
html[data-theme="dark"] .quick-links-board h3 { background: #1d4f9e; }
html[data-theme="dark"] .quick-links-list li a { color: var(--color-text); }
html[data-theme="dark"] .announcement-slideshow { background: #0b111c; }
html[data-theme="dark"] .post-card-title, html[data-theme="dark"] .post-card h3 a { color: var(--link); }
html[data-theme="dark"] .chat-panel { background: var(--color-surface); box-shadow: 0 18px 50px rgba(0,0,0,.6); }
html[data-theme="dark"] .chat-body { background: #0f1828; }
html[data-theme="dark"] .chat-bubble { background: var(--color-surface); border-color: var(--color-border); color: var(--color-text); }
html[data-theme="dark"] .chat-chip { background: transparent; color: var(--link); border-color: #2f4468; }
html[data-theme="dark"] .chat-sources { border-top-color: var(--color-border); }
html[data-theme="dark"] .chat-rate button { background: transparent; color: var(--color-text); }
html[data-theme="dark"] .chat-input, html[data-theme="dark"] .chat-foot { background: var(--color-surface); }
html[data-theme="dark"] .chat-head, html[data-theme="dark"] .chat-fab { background: #1d4f9e; }
html[data-theme="dark"] .tag-row a { color: var(--color-text); }
html[data-theme="dark"] table.data-table th { background: #1c2840; }
html[data-theme="dark"] table.data-table tr:hover td { background: #1a2539; }
html[data-theme="dark"] .badge-role { background: #26324a; color: #d3d9e3; }
html[data-theme="dark"] .pager-links a { color: var(--color-text); }
html[data-theme="dark"] .sidebar .cat-link.active .cat-ico, html[data-theme="dark"] .sidebar .cat-link:hover .cat-ico { color: var(--link); }
html[data-theme="dark"] .sidebar .cat-link.active .count { color: var(--link); }

/* ---- Acesso rapido em blocos (nov/2026): grade 2 colunas, icone em
   quadrado colorido escolhido pelo nome do link, seta no canto ---- */
.home-top { grid-template-columns: minmax(0, 1fr) minmax(320px, 410px); max-width: 1070px; }
.quick-links-board { padding: 18px 18px 16px; }
.quick-links-board h3 { background: none; color: var(--color-text); padding: 0 2px 14px; font-size: 18px; font-weight: 700; }
.quick-links-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.quick-links-grid li a {
  position: relative; display: flex; align-items: center; gap: 10px; min-height: 72px; padding: 10px 12px 10px 10px;
  border-radius: 12px; background: #f6f8fc; border: 1px solid #edf1f7; color: var(--color-text);
  font-size: 13px; font-weight: 600; line-height: 1.25; transition: background .15s, border-color .15s, box-shadow .15s, transform .15s;
}
.quick-links-grid li a:hover { background: #fff; border-color: var(--color-primary-soft-2); box-shadow: 0 6px 16px rgba(0, 40, 100, .10); transform: translateY(-1px); text-decoration: none; color: var(--color-text); }
.qtile-icon {
  width: 38px; height: 38px; border-radius: 10px; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
  color: #fff; background: linear-gradient(145deg, var(--qa), var(--qb)); box-shadow: 0 4px 10px -3px var(--qb);
}
.qtile-icon svg { width: 20px; height: 20px; }
.qtile-label { min-width: 0; overflow-wrap: break-word; hyphens: auto; -webkit-hyphens: auto; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.qtile-chevron { position: absolute; right: 9px; bottom: 7px; color: #9aa6b8; display: inline-flex; }
.qtile-chevron svg { width: 14px; height: 14px; }
.quick-links-grid li a:hover .qtile-chevron { color: var(--color-primary); }
.quick-links-grid li:nth-child(4n+1) .qtile-icon { --qa: #3b8bff; --qb: #1561e0; }
.quick-links-grid li:nth-child(4n+2) .qtile-icon { --qa: #3fca6b; --qb: #1f9d4b; }
.quick-links-grid li:nth-child(4n+3) .qtile-icon { --qa: #b46cff; --qb: #7c3aed; }
.quick-links-grid li:nth-child(4n+4) .qtile-icon { --qa: #ffab3d; --qb: #f07c0c; }
html[data-theme="dark"] .quick-links-board h3 { background: none; color: var(--color-text); }
html[data-theme="dark"] .quick-links-grid li a { background: #1a2539; border-color: #24324a; color: var(--color-text); }
html[data-theme="dark"] .quick-links-grid li a:hover { background: #1f2c44; border-color: #2f4468; box-shadow: 0 6px 16px rgba(0,0,0,.35); }
.ql-count { font-size: 13px; font-weight: 600; color: var(--color-text-muted); margin-left: 4px; }
.ql-count.full { color: #b45309; }
.ql-full { background: #fef3c7; color: #92400e; border: 1px solid #fde68a; }

/* ---- Sino de notificacoes (nov/2026) ---- */
.notif { position: relative; margin-right: 4px; }
.notif-btn { position: relative; width: 38px; height: 38px; border-radius: 50%; border: none; background: transparent; color: #4b5b74; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: background .15s, color .15s; }
.notif-btn:hover, .notif-btn[aria-expanded="true"] { background: var(--color-primary-soft); color: var(--color-primary); }
.notif-btn svg { width: 21px; height: 21px; }
.notif-badge { position: absolute; top: 3px; right: 2px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: #e11d2e; color: #fff; font-size: 11px; font-weight: 700; line-height: 18px; text-align: center; box-shadow: 0 0 0 2px var(--color-surface); }
.notif-panel { position: absolute; right: -6px; top: calc(100% + 8px); width: 320px; max-width: calc(100vw - 24px); z-index: 60; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 12px; box-shadow: 0 10px 28px rgba(17, 24, 39, .14); overflow: hidden; }
.notif-head { padding: 12px 14px; font-weight: 700; font-size: 14px; border-bottom: 1px solid var(--color-border); display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.notif-head-count { font-size: 12px; font-weight: 600; color: #e11d2e; }
.notif-list { list-style: none; margin: 0; padding: 4px; max-height: 360px; overflow-y: auto; }
.notif-list a { display: flex; gap: 10px; align-items: flex-start; padding: 9px 10px; border-radius: 8px; color: var(--color-text); text-decoration: none; }
.notif-list a:hover { background: var(--color-primary-soft); text-decoration: none; }
.notif-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--color-primary); margin-top: 6px; flex-shrink: 0; }
.notif-txt { display: flex; flex-direction: column; min-width: 0; }
.notif-title { font-size: 13.5px; font-weight: 600; line-height: 1.3; }
.notif-list a:hover .notif-title { color: var(--color-primary); }
.notif-meta { font-size: 11.5px; color: var(--color-text-muted); margin-top: 2px; }
.notif-more { margin: 0; padding: 4px 14px 10px; font-size: 12px; color: var(--color-text-muted); }
.notif-empty { margin: 0; padding: 22px 14px; text-align: center; font-size: 13px; color: var(--color-text-muted); }
html[data-theme="dark"] .notif-btn { color: #aab6c9; }
html[data-theme="dark"] .notif-btn:hover, html[data-theme="dark"] .notif-btn[aria-expanded="true"] { color: var(--link); }
html[data-theme="dark"] .notif-panel { box-shadow: 0 10px 28px rgba(0,0,0,.5); }
html[data-theme="dark"] .notif-list a, html[data-theme="dark"] .notif-list a:hover .notif-title { color: var(--color-text); }
html[data-theme="dark"] .notif-list a:hover .notif-title { color: var(--link); }
html[data-theme="dark"] .notif-dot { background: var(--link); }

/* ---- Impressao / Exportar para PDF (nov/2026): so o post, igual a tela ---- */
.print-only { display: none; }
@media print {
  @page { size: A4; margin: 14mm 13mm 16mm; }
  html, body { background: #fff !important; }
  * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
  .topbar, .sidebar, .site-footer, .chat-fab, .chat-panel, .post-actions-row, .feedback-box, .preview-banner,
  .lightbox-overlay, #notif, .user-box { display: none !important; }
  .app-shell { display: block !important; min-height: 0 !important; }
  .main { padding: 0 !important; }
  .post-full { border: none !important; box-shadow: none !important; padding: 0 !important; margin: 0 !important; max-width: none !important; background: #fff !important; }
  .print-only { display: block; }
  .print-header { padding-bottom: 10px; margin-bottom: 14px; border-bottom: 2px solid var(--color-primary); }
  .print-header .brand-mark-top img { height: 30px; }
  .post-full .page-title { margin-top: 0; }
  .post-content img { cursor: default; max-width: 100% !important; height: auto !important; break-inside: avoid; page-break-inside: avoid; }
  .post-content figure, .post-content pre, .post-content blockquote, .post-content tr { break-inside: avoid; page-break-inside: avoid; }
  .post-content h1, .post-content h2, .post-content h3, .post-content h4 { break-after: avoid; page-break-after: avoid; }
  .post-content table { width: 100% !important; }
  .post-content thead { display: table-header-group; }
  .post-content a { color: inherit; }
  .post-content p, .post-content li { orphans: 3; widows: 3; }
}

/* Botao de modo escuro no topo do Painel ADM */
.admin-theme-btn { width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--color-border); background: var(--color-surface); color: #4b5b74; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.admin-theme-btn:hover { color: var(--color-primary); border-color: var(--color-primary-soft-2); }
.admin-theme-btn svg { width: 17px; height: 17px; }
.admin-theme-btn[aria-checked="true"] { background: var(--color-primary-soft); color: #ffd36b; border-color: #2f4468; }

/* ===== Modo escuro no Painel ADM e no login (nov/2026) ===== */
html[data-theme="dark"] .admin-nav { background: #0a101b; border-right: 1px solid var(--color-border); }
html[data-theme="dark"] .admin-nav a { color: #b7c2d3; }
html[data-theme="dark"] .stat-tile .value, html[data-theme="dark"] .kpi .value { color: var(--color-text); }
html[data-theme="dark"] .btn-danger, html[data-theme="dark"] .btn-danger-outline { background: transparent; color: #fca5a5; border-color: #7f2a2f; }
html[data-theme="dark"] .btn-danger:hover { background: #7f1d1d; color: #fff; }
html[data-theme="dark"] .btn-danger-outline:hover { background: #3a1416; color: #fecaca; }
html[data-theme="dark"] .btn-danger-solid, html[data-theme="dark"] .btn-danger-solid:hover { color: #fff; }
html[data-theme="dark"] input[readonly], html[data-theme="dark"] #post-link { background: #0b111c !important; color: var(--color-text-muted); }
html[data-theme="dark"] small[style*="#6b7280"] { color: var(--color-text-muted) !important; }
html[data-theme="dark"] input[type="file"] { color: var(--color-text-muted); }
html[data-theme="dark"] input::placeholder, html[data-theme="dark"] textarea::placeholder { color: #6f7d93; }
/* seletor de categoria */
html[data-theme="dark"] .cp-toggle, html[data-theme="dark"] .cp-panel, html[data-theme="dark"] .cp-search { background: #111a2b; color: var(--color-text); }
html[data-theme="dark"] .cp-panel { box-shadow: 0 12px 30px rgba(0,0,0,.55); }
html[data-theme="dark"] .cp-row { color: #d3d9e3; }
html[data-theme="dark"] .cp-row.selected, html[data-theme="dark"] .cp-row.selected .cp-ico { color: var(--link); }
html[data-theme="dark"] .cp-none { border-bottom-color: var(--color-border); }
/* editor de codigo HTML */
html[data-theme="dark"] .content-html-highlight { background: #0b111c; color: var(--color-text); }
html[data-theme="dark"] .content-html-editor { caret-color: #e4e9f1; }
html[data-theme="dark"] .hl-tag { color: #7fb2ff; } html[data-theme="dark"] .hl-attr { color: #fbbf24; } html[data-theme="dark"] .hl-string { color: #86efac; } html[data-theme="dark"] .hl-comment { color: #8b97ab; }
/* telas em blocos (Assistente de IA, Sobre Nos) */
html[data-theme="dark"] .ai-field input[type=text], html[data-theme="dark"] .ai-field input[type=password], html[data-theme="dark"] .ai-field select, html[data-theme="dark"] .ai-field textarea, html[data-theme="dark"] .ai-test-form input { background: #111a2b; color: var(--color-text); border-color: var(--color-border); }
html[data-theme="dark"] .ai-option, html[data-theme="dark"] .ai-seg { background: #111a2b; }
html[data-theme="dark"] .ai-option:has(input:checked) { background: var(--color-primary-soft); border-color: #3b6fc4; }
html[data-theme="dark"] .ai-seg span { border-right-color: var(--color-border); color: var(--color-text); }
html[data-theme="dark"] .ai-card-locked { background: #131c2c; }
html[data-theme="dark"] .ai-rules { color: #c3cbd8; }
html[data-theme="dark"] .ai-preview pre, html[data-theme="dark"] .ai-test-out { background: #0b111c; color: var(--color-text); }
html[data-theme="dark"] .ai-savebar { background: rgba(22, 32, 50, .94) !important; border-color: var(--color-border); }
html[data-theme="dark"] .ai-status.on { border-color: #1d5a37; }
html[data-theme="dark"] .vis-bar { background: var(--color-surface); }
html[data-theme="dark"] .vis-bar.on { border-color: #1d5a37; }
html[data-theme="dark"] .brand-logo-box { background: #111a2b; border-color: var(--color-border); }
html[data-theme="dark"] .brand-preview-box { background: #fff; }
html[data-theme="dark"] .brand-preview-box .brand-mark-names b { color: #1f2937; }
html[data-theme="dark"] .brand-preview-box .brand-mark-names i { color: #2563eb; }
/* dashboard e listas */
html[data-theme="dark"] .dash-list li { border-top-color: var(--color-border); }
html[data-theme="dark"] .dl-quote { color: #c3cbd8; }
html[data-theme="dark"] .rank-track { background: #1f2b40; }
html[data-theme="dark"] .fb-bar { background: #0b111c; }
html[data-theme="dark"] .list-search input { background: #111a2b; }
html[data-theme="dark"] .ql-full { background: #3a2a0c; color: #fcd34d; border-color: #6b4e12; }
html[data-theme="dark"] .preview-banner { background: #3a2a0c; color: #fcd34d; border-color: #6b4e12; }
html[data-theme="dark"] .restricted-banner { background: #3a1416; color: #fecaca; border-color: #6b2226; }
html[data-theme="dark"] .modal-box { background: var(--color-surface); color: var(--color-text); }
html[data-theme="dark"] .content-html-editor { background: transparent !important; color: transparent !important; caret-color: #e4e9f1; }

/* Inicial da empresa no lugar do logo (empresas sem logo enviado) */
.brand-initial { width: 34px; height: 34px; border-radius: 9px; background: var(--color-primary); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 17px; flex-shrink: 0; }
.brand-login .brand-initial { width: 40px; height: 40px; font-size: 20px; }
.brand-initial-lg { width: 46px; height: 46px; font-size: 22px; border-radius: 11px; }

/* ===== Painel da plataforma (varias empresas) ===== */
.painel-main { max-width: 1240px; margin: 0 auto; padding: 28px 32px 40px; }
.painel-brand { display: inline-flex; align-items: center; gap: 10px; color: var(--color-text); text-decoration: none !important; }
.painel-brand b { display: block; font-size: 15px; } .painel-brand small { display: block; font-size: 11.5px; color: var(--color-text-muted); }
.painel-logo { width: 36px; height: 36px; border-radius: 10px; background: linear-gradient(145deg, #1e6fe0, #0a3f8f); color: #fff; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.painel-logo svg { width: 20px; height: 20px; }
.painel-login-head { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.painel-login-head b { display: block; font-size: 16px; } .painel-login-head small { color: var(--color-text-muted); font-size: 12.5px; }
.aviso-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 20px; background: var(--color-bg); }
.aviso-card { max-width: 460px; text-align: center; padding: 34px 30px; }
.aviso-card h1 { font-size: 20px; margin: 10px 0 8px; } .aviso-card p { color: var(--color-text-muted); margin: 0; }
.aviso-ico { display: inline-flex; width: 46px; height: 46px; border-radius: 50%; align-items: center; justify-content: center; background: var(--color-primary-soft); color: var(--color-primary); }
.painel-search { display: flex; align-items: center; gap: 8px; padding: 12px 16px; border-bottom: 1px solid var(--color-border); }
.painel-search span { color: var(--color-text-muted); display: inline-flex; } .painel-search svg { width: 17px; height: 17px; }
.painel-search input { flex: 1; border: none; outline: none; background: transparent; font-size: 14px; color: var(--color-text); padding: 4px 0; }
.painel-empty { padding: 30px 16px; text-align: center; color: var(--color-text-muted); margin: 0; }
.table-scroll { overflow-x: auto; }
.painel-table td { vertical-align: middle; }
.painel-co { display: block; color: var(--color-text); } .painel-url { font-size: 12px; color: var(--color-text-muted); }
.painel-roles { display: block; color: var(--color-text-muted); font-size: 11.5px; white-space: nowrap; }
.painel-online { display: flex; flex-direction: column; gap: 5px; min-width: 110px; }
.painel-bar { height: 6px; background: #e8edf4; border-radius: 3px; overflow: hidden; }
.painel-bar i { display: block; height: 100%; background: var(--color-success); border-radius: 3px; }
.painel-bar.warn i { background: #f59e0b; } .painel-bar.full i { background: var(--color-danger); }
.painel-back { font-size: 13px; }
.painel-slug { display: flex; align-items: stretch; }
.painel-slug input { flex: 1; min-width: 0; border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; }
.painel-slug span { display: inline-flex; align-items: center; padding: 0 12px; border: 1px solid var(--color-border); border-left: none; border-radius: 0 var(--radius) var(--radius) 0; background: var(--color-bg); color: var(--color-text-muted); font-size: 13.5px; white-space: nowrap; }
.painel-slug.is-fixed input { background: var(--color-bg); color: var(--color-text-muted); }
.painel-h3 { margin: 0 0 4px; font-size: 16px; } .painel-h3 small { color: var(--color-text-muted); font-weight: 500; }
.painel-danger { border-color: #fecaca; margin-top: 18px; }
.painel-del { display: flex; gap: 10px; flex-wrap: wrap; } .painel-del input { max-width: 260px; }
.painel-access { max-width: 640px; margin: 10px auto; text-align: center; padding: 30px; }
.painel-ok { display: inline-flex; width: 50px; height: 50px; border-radius: 50%; background: #dcfce7; color: #15803d; align-items: center; justify-content: center; } .painel-ok svg { width: 26px; height: 26px; }
.painel-cred { text-align: left; border: 1px solid var(--color-border); border-radius: 12px; margin: 18px 0 12px; overflow: hidden; }
.painel-cred div { display: flex; justify-content: space-between; gap: 12px; padding: 11px 16px; border-top: 1px solid var(--color-border); }
.painel-cred div:first-child { border-top: none; }
.painel-cred span { color: var(--color-text-muted); font-size: 13.5px; }
.painel-pwd { font-family: Consolas, 'Courier New', monospace; font-size: 16px; letter-spacing: .5px; color: var(--color-primary); }
.painel-warn { display: flex; gap: 8px; align-items: center; justify-content: center; font-size: 13px; color: #92400e; background: #fef3c7; border-radius: 8px; padding: 9px 12px; }
.painel-warn svg { width: 16px; height: 16px; }
.painel-actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin-top: 18px; }
.painel-actions .btn svg { width: 15px; height: 15px; vertical-align: -2px; }
.painel-msg { max-width: 560px; margin: 20px auto; }
html[data-theme="dark"] .painel-bar { background: #1f2b40; }
html[data-theme="dark"] .painel-danger { border-color: #6b2226; }
html[data-theme="dark"] .painel-warn { background: #3a2a0c; color: #fcd34d; }
html[data-theme="dark"] .painel-ok { background: #0f2e1d; color: #86efac; }
@media (max-width: 760px) { .painel-main { padding: 20px 16px; } }
.ai-field input[type=number] { width: 100%; padding: 9px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font: inherit; font-size: 14px; background: #fff; color: var(--color-text); }
html[data-theme="dark"] .ai-field input[type=number] { background: #111a2b; }
.painel-main .kpi-grid { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.painel-del input { padding: 9px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font: inherit; font-size: 14px; background: var(--color-surface); color: var(--color-text); }
.painel-mod { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border: 1px solid var(--color-border); border-radius: 10px; cursor: pointer; }
.painel-mod input { margin-top: 4px; width: 17px; height: 17px; accent-color: var(--color-primary); }
.painel-mod small { display: block; color: var(--color-text-muted); font-size: 12.5px; margin-top: 3px; }
.painel-mod .badge { margin-left: 6px; vertical-align: 1px; }
.painel-modtag { display: inline-block; margin-left: 6px; font-size: 10.5px; font-weight: 700; padding: 1px 6px; border-radius: 5px; background: var(--color-primary-soft); color: var(--color-primary); }
