/* Painel de publicação da AMMA.
   Folha própria: o painel é ferramenta de trabalho, não segue o tema do site. */

:root {
  --pn-tinta:    #0F1B3D;
  --pn-tinta2:   #46567A;
  --pn-fraco:    #8A99B8;
  --pn-linha:    #E1E7F3;
  --pn-fundo:    #F4F6FB;
  --pn-branco:   #FFFFFF;
  --pn-azul:     #2B5BE8;
  --pn-azul-esc: #1A3FBF;
  --pn-marinho:  #0C1B3F;
  --pn-ouro:     #C9A84C;
  --pn-verde:    #146B4A;
  --pn-vermelho: #B02A2A;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body.pn {
  font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 15px; line-height: 1.55;
  color: var(--pn-tinta); background: var(--pn-fundo);
  -webkit-font-smoothing: antialiased;
}
a { color: var(--pn-azul); text-decoration: none; }
a:hover { text-decoration: underline; }
code { font-family: ui-monospace, 'SF Mono', Menlo, monospace; font-size: 13px;
       background: var(--pn-fundo); padding: 2px 6px; border-radius: 5px; }

/* ---------------- topo ---------------- */
.pn-topo {
  position: sticky; top: 0; z-index: 40;
  display: flex; align-items: center; gap: 28px;
  height: 60px; padding: 0 24px;
  background: var(--pn-marinho); color: #fff;
}
.pn-topo-marca { display: flex; align-items: center; gap: 10px; color: #fff; }
.pn-topo-marca:hover { text-decoration: none; }
.pn-topo-marca img { height: 34px; width: auto; display: block; }
.pn-topo-marca span {
  font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: var(--pn-ouro);
}
.pn-menu { display: flex; gap: 4px; }
.pn-menu a {
  color: rgba(255,255,255,.76); font-size: 13.5px; font-weight: 500;
  padding: 8px 13px; border-radius: 8px;
}
.pn-menu a:hover { color: #fff; background: rgba(255,255,255,.10); text-decoration: none; }
.pn-menu a.ativo { color: #fff; background: rgba(255,255,255,.16); font-weight: 600; }

.pn-topo-usuario { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.pn-topo-nome { font-size: 13px; color: rgba(255,255,255,.78); }
.pn-topo-usuario button {
  font: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; color: #fff;
  background: rgba(255,255,255,.14); border: 0; border-radius: 7px; padding: 6px 13px;
}
.pn-topo-usuario button:hover { background: rgba(255,255,255,.24); }

.pn-selo {
  font-size: 10.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
  border-radius: 20px; padding: 3px 9px; white-space: nowrap;
}
.pn-selo--superadmin  { background: rgba(201,168,76,.22); color: var(--pn-ouro); }
.pn-selo--colaborador { background: rgba(255,255,255,.14); color: rgba(255,255,255,.86); }
.pn-tabela .pn-selo--superadmin  { background: #FBF3DC; color: #7A5F14; }
.pn-tabela .pn-selo--colaborador { background: var(--pn-fundo); color: var(--pn-tinta2); }

/* ---------------- corpo ---------------- */
.pn-corpo { padding: 32px 24px 80px; }
.pn-largura { max-width: 1120px; margin: 0 auto; }
.pn-largura--editor { max-width: 1320px; }

.pn-titulo { font-size: 27px; letter-spacing: -.02em; }
.pn-subtitulo { font-size: 18px; margin: 36px 0 14px; }
.pn-cabeca { display: flex; align-items: center; gap: 16px; margin-bottom: 6px; }
.pn-cabeca .pn-titulo { margin-right: auto; }
.pn-nota { color: var(--pn-tinta2); font-size: 14px; margin-bottom: 18px; max-width: 84ch; }
.pn-nota-pequena { color: var(--pn-fraco); font-size: 12.5px; margin-top: 8px; }
.pn-conta { color: var(--pn-fraco); font-size: 13px; margin: 14px 0 10px; }
.pn-nowrap { white-space: nowrap; }
.pn-num { font-variant-numeric: tabular-nums; }
.pn-vazio { color: var(--pn-fraco); font-size: 13px; }

/* ---------------- botões ---------------- */
.pn-botao {
  display: inline-block; cursor: pointer; text-align: center;
  font: inherit; font-size: 13.5px; font-weight: 600;
  border: 1px solid transparent; border-radius: 9px; padding: 10px 18px;
  transition: background .15s, border-color .15s;
}
.pn-botao:hover { text-decoration: none; }
.pn-botao--principal { background: var(--pn-azul); color: #fff; }
.pn-botao--principal:hover { background: var(--pn-azul-esc); }
.pn-botao--claro { background: var(--pn-branco); color: var(--pn-tinta); border-color: var(--pn-linha); }
.pn-botao--claro:hover { border-color: var(--pn-azul); color: var(--pn-azul); }
.pn-botao--largo { width: 100%; margin-top: 10px; }
.pn-botao:disabled { opacity: .6; cursor: default; }

.pn-mini {
  font: inherit; font-size: 12px; font-weight: 600; cursor: pointer;
  color: var(--pn-tinta2); background: var(--pn-branco);
  border: 1px solid var(--pn-linha); border-radius: 7px; padding: 5px 11px;
}
.pn-mini:hover { border-color: var(--pn-azul); color: var(--pn-azul); }
.pn-mini--perigo:hover { border-color: var(--pn-vermelho); color: var(--pn-vermelho); }
.pn-acoes-linha { display: flex; gap: 6px; }
.pn-acoes-rapidas { display: flex; gap: 10px; margin: 24px 0 8px; flex-wrap: wrap; }
.pn-ver { font-size: 12.5px; color: var(--pn-fraco); }
.pn-ver:hover { color: var(--pn-azul); }
.pn-link-forte { font-weight: 600; color: var(--pn-tinta); }
.pn-link-forte:hover { color: var(--pn-azul); }
.pn-inativo { color: var(--pn-vermelho); }

/* ---------------- avisos ---------------- */
.pn-aviso {
  font-size: 13.5px; line-height: 1.5; border-radius: 9px;
  padding: 11px 14px; margin: 0 0 18px;
}
.pn-aviso--erro  { background: #FDECEC; color: #8E1C1C; border: 1px solid #F3C9C9; }
.pn-aviso--certo { background: #E9F6EF; color: var(--pn-verde); border: 1px solid #BFE3D2; }

/* ---------------- números ---------------- */
.pn-numeros {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(165px, 1fr));
  gap: 12px; margin-top: 22px;
}
.pn-numero {
  background: var(--pn-branco); border: 1px solid var(--pn-linha);
  border-radius: 12px; padding: 18px 18px 16px; color: var(--pn-tinta);
}
.pn-numero:hover { border-color: var(--pn-azul); text-decoration: none; }
.pn-numero-valor { display: block; font-size: 30px; font-weight: 800; letter-spacing: -.03em; }
.pn-numero-rotulo { display: block; font-size: 12.5px; color: var(--pn-fraco); margin-top: 2px; }

/* ---------------- filtros ---------------- */
.pn-filtros { display: flex; flex-wrap: wrap; gap: 7px; margin: 18px 0 4px; }
.pn-filtro {
  font-size: 12.5px; font-weight: 600; color: var(--pn-tinta2);
  background: var(--pn-branco); border: 1px solid var(--pn-linha);
  border-radius: 20px; padding: 6px 14px;
}
.pn-filtro:hover { border-color: var(--pn-azul); color: var(--pn-azul); text-decoration: none; }
.pn-filtro.ativo { background: var(--pn-marinho); border-color: var(--pn-marinho); color: #fff; }

/* ---------------- tabela ---------------- */
.pn-tabela {
  width: 100%; border-collapse: separate; border-spacing: 0;
  background: var(--pn-branco); border: 1px solid var(--pn-linha);
  border-radius: 12px; overflow: hidden; font-size: 14px;
}
.pn-tabela th {
  text-align: left; font-size: 11px; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: var(--pn-fraco);
  padding: 12px 16px; background: #FAFBFE; border-bottom: 1px solid var(--pn-linha);
}
.pn-tabela td { padding: 13px 16px; border-bottom: 1px solid var(--pn-linha); vertical-align: middle; }
.pn-tabela tbody tr:last-child td { border-bottom: 0; }
.pn-tabela tbody tr:hover td { background: #FCFDFF; }

.pn-situacao {
  font-size: 11px; font-weight: 700; letter-spacing: .04em;
  border-radius: 20px; padding: 3px 10px; background: var(--pn-fundo); color: var(--pn-tinta2);
}
.pn-situacao--publicado { background: #E9F6EF; color: var(--pn-verde); }
.pn-situacao--rascunho  { background: #FFF6E5; color: #7A5200; }
.pn-situacao--privado   { background: #EEF1F8; color: var(--pn-tinta2); }
/* Convênio encerrado não é rascunho: saiu do ar, mas foi publicado um dia.
   Cinza-vermelho para o colaborador distinguir a lista na diagonal. */
.pn-situacao--encerrado { background: #FBEDEE; color: #8A2733; }
.pn-situacao--arquivado { background: #EEF1F8; color: var(--pn-fraco); }
/* Reservas. O dourado é do PEDIDO de propósito: é o estado que exige ação
   humana — alguém tem de ligar. Confirmada é verde porque a data está trancada. */
.pn-situacao--pedido     { background: #FDF3DC; color: #7A5200; }
.pn-situacao--confirmada { background: #E9F6EF; color: var(--pn-verde); }
.pn-situacao--bloqueio   { background: #EEF1F8; color: var(--pn-tinta2); }
.pn-situacao--cancelada  { background: #FBEDEE; color: #8A2733; }

.pn-botao--perigo { background: #fff; color: #8A2733; border-color: rgba(138,39,51,.35); }
.pn-botao--perigo:hover { background: #FBEDEE; }

.pn-paginacao { display: flex; align-items: center; gap: 12px; margin-top: 18px; font-size: 13px; }
.pn-pg { background: var(--pn-branco); border: 1px solid var(--pn-linha); border-radius: 8px; padding: 7px 13px; }
.pn-pg-atual { color: var(--pn-fraco); }

/* ---------------- formulários ---------------- */
.pn-campo { display: block; margin-bottom: 15px; }
.pn-campo > span {
  display: block; font-size: 11px; font-weight: 700; letter-spacing: .09em;
  text-transform: uppercase; color: var(--pn-tinta2); margin-bottom: 6px;
}
.pn-campo > span em { font-style: normal; text-transform: none; letter-spacing: 0;
                      font-weight: 500; color: var(--pn-fraco); }
.pn-campo input, .pn-campo select, .pn-campo textarea {
  width: 100%; font: inherit; font-size: 15px; color: var(--pn-tinta);
  background: var(--pn-branco); border: 1px solid var(--pn-linha);
  border-radius: 9px; padding: 10px 13px;
}
.pn-campo textarea { resize: vertical; line-height: 1.5; }
.pn-campo input:focus, .pn-campo select:focus, .pn-campo textarea:focus {
  outline: none; border-color: var(--pn-azul); box-shadow: 0 0 0 3px rgba(43,91,232,.13);
}
.pn-campo--titulo input { font-size: 21px; font-weight: 700; letter-spacing: -.02em; padding: 13px 15px; }

.pn-caixa { display: flex; align-items: center; gap: 9px; font-size: 13.5px; margin-bottom: 9px; cursor: pointer; }
.pn-caixa input { width: auto; }
.pn-categorias { max-height: 260px; overflow-y: auto; }

.pn-form-linha {
  display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap;
  background: var(--pn-branco); border: 1px solid var(--pn-linha);
  border-radius: 12px; padding: 18px;
}
.pn-form-linha .pn-campo { margin-bottom: 0; flex: 1; min-width: 180px; }

.pn-busca { display: flex; gap: 9px; margin: 16px 0 4px; flex-wrap: wrap; }
.pn-busca input {
  flex: 1; max-width: 380px; font: inherit; font-size: 15px;
  border: 1px solid var(--pn-linha); border-radius: 9px; padding: 10px 13px; background: #fff;
}
.pn-busca select {
  font: inherit; font-size: 15px; max-width: 260px;
  border: 1px solid var(--pn-linha); border-radius: 9px; padding: 10px 13px; background: #fff;
}

/* ---------------- editor ---------------- */
.pn-editor { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 22px; margin-top: 18px; }
.pn-editor-principal { min-width: 0; }
.pn-editor-lado { display: flex; flex-direction: column; gap: 14px; }
.pn-bloco {
  background: var(--pn-branco); border: 1px solid var(--pn-linha);
  border-radius: 12px; padding: 18px;
}
.pn-bloco h3 {
  font-size: 12px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase;
  color: var(--pn-fraco); margin-bottom: 14px;
}
/* O mesmo bloco fora da coluna lateral do editor — usado na lista de convênios. */
.pn-bloco--largo { margin-top: 18px; }
.pn-bloco--largo .pn-form-linha { border: 0; padding: 0; background: none; margin-top: 12px; }
.pn-bloco--largo input[type="file"] { font-size: 13.5px; }

.pn-destaque {
  border: 1px dashed var(--pn-linha); border-radius: 9px; padding: 10px;
  min-height: 90px; display: flex; align-items: center; justify-content: center;
}
.pn-destaque img { max-width: 100%; height: auto; border-radius: 6px; display: block; }

.pn-anexos { list-style: none; display: flex; flex-direction: column; gap: 7px; margin-bottom: 4px; }
.pn-anexos li {
  display: flex; align-items: center; gap: 9px; font-size: 13px;
  background: var(--pn-fundo); border-radius: 8px; padding: 9px 11px;
}
.pn-anexo-nome { flex: 1; word-break: break-word; }
.pn-remover {
  font: inherit; font-size: 11.5px; cursor: pointer; color: var(--pn-vermelho);
  background: none; border: 0; padding: 0; text-decoration: underline;
}

/* ---------------- senha emitida ---------------- */
.pn-senha-emitida {
  background: #FFF9E8; border: 1px solid #F0DFAE; border-radius: 12px;
  padding: 20px 22px; margin: 18px 0; max-width: 640px;
}
.pn-senha-emitida h3 { font-size: 15px; margin-bottom: 10px; }
.pn-senha-emitida p { font-size: 13.5px; color: #6B5518; margin-bottom: 8px; }
.pn-senha-valor {
  font-family: ui-monospace, 'SF Mono', Menlo, monospace;
  font-size: 26px !important; font-weight: 700; letter-spacing: .08em;
  color: var(--pn-tinta) !important; background: #fff;
  border: 1px dashed #E0CE9A; border-radius: 9px;
  padding: 14px 18px; margin: 4px 0 12px !important; user-select: all;
}

/* ---------------- entrada ---------------- */
body.pn-entrada-corpo { background: var(--pn-marinho); }
.pn-entrada { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 40px 20px; }
.pn-cartao {
  width: 100%; max-width: 400px; background: #fff; border-radius: 16px;
  padding: 38px 34px 28px; text-align: center;
  box-shadow: 0 24px 60px rgba(0,0,0,.3);
}
.pn-marca { height: 54px; width: auto; display: block; margin: 0 auto 22px; }
.pn-cartao h1 { font-size: 22px; letter-spacing: -.02em; margin-bottom: 6px; }
.pn-sub { font-size: 13.5px; color: var(--pn-fraco); margin-bottom: 22px; }
.pn-cartao form { text-align: left; }
.pn-cartao .pn-botao { width: 100%; margin-top: 6px; }
.pn-rodape {
  font-size: 12.5px; color: var(--pn-fraco); margin-top: 20px;
  padding-top: 16px; border-top: 1px solid var(--pn-linha);
}

@media (max-width: 1000px) {
  .pn-editor { grid-template-columns: 1fr; }
  .pn-topo { flex-wrap: wrap; height: auto; padding: 10px 16px; gap: 12px; }
  .pn-menu { order: 3; width: 100%; overflow-x: auto; }
  .pn-corpo { padding: 22px 16px 60px; }
  .pn-tabela { font-size: 13px; }
  .pn-tabela th, .pn-tabela td { padding: 10px 11px; }
}

/* Atalho para a área restrita, no menu do painel. Vai para fora do painel,
   por isso a seta e o tratamento diferente dos outros itens. */
.pn-menu-fora {
  margin-left: 8px;
  color: var(--pn-ouro) !important;
  border: 1px solid rgba(201, 168, 76, .35);
}
.pn-menu-fora:hover { background: rgba(201, 168, 76, .16) !important; }

/* ---------------- fila de correção de cadastro ---------------- */
.pc-lista { display: grid; gap: 14px; margin-top: 16px; }
.pc-cartao {
  background: var(--pn-branco); border: 1px solid var(--pn-linha);
  border-radius: 12px; padding: 18px 20px;
}
.pc-topo { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.pc-topo h3 { font-size: 16px; letter-spacing: -.02em; color: var(--pn-tinta); }
.pc-quem { font-size: 12.5px; color: var(--pn-fraco); margin-top: 3px; }
.pc-quando { font-size: 12px; color: var(--pn-fraco); white-space: nowrap; }

.pc-diff { width: 100%; border-collapse: collapse; margin-top: 14px; font-size: 13.5px; }
.pc-diff th {
  text-align: left; font-size: 10.5px; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: var(--pn-fraco); padding: 7px 10px;
  background: #FAFBFE; border-bottom: 1px solid var(--pn-linha);
}
.pc-diff td { padding: 10px; border-bottom: 1px solid var(--pn-linha); vertical-align: top; word-break: break-word; }
.pc-diff tr:last-child td { border-bottom: 0; }
.pc-campo { width: 170px; color: var(--pn-tinta2); }
/* O valor gravado fica apagado e o pedido em destaque: o olho vai para o que
   precisa ser digitado no SISAMMA, não para o que já está lá. */
.pc-de { color: var(--pn-fraco); }
.pc-para { font-weight: 600; color: var(--pn-tinta); }
.pc-obs { font-size: 13px; color: var(--pn-tinta2); font-style: italic; margin-top: 12px; }

.pc-acoes { display: flex; gap: 9px; margin-top: 14px; flex-wrap: wrap; align-items: center; }
.pc-resposta {
  flex: 1; min-width: 220px; font: inherit; font-size: 14px;
  border: 1px solid var(--pn-linha); border-radius: 9px; padding: 9px 12px; background: #fff;
}
.pc-lembrete { font-size: 12px; color: var(--pn-fraco); margin-top: 9px; }
.pc-fechado { font-size: 12.5px; color: var(--pn-fraco); margin-top: 14px; line-height: 1.6; }

/* Texto da mensagem da ouvidoria: é texto corrido escrito por gente, com
   quebras de linha que importam. */
.ms-texto {
  white-space: pre-wrap; font-size: 14.5px; line-height: 1.65;
  color: var(--pn-tinta); margin-top: 14px;
  background: var(--pn-fundo); border-radius: 10px; padding: 14px 16px;
}
.pn-situacao--ouvidoria { background: #EEF1F8; color: var(--pn-tinta2); }
.pn-situacao--redacao   { background: #FDF3DC; color: #7A5200; }

/* ---------------------------------------------------------------------------
   Biblioteca de mídia
   ---------------------------------------------------------------------------
   Modal usado em dois lugares: dentro do editor (botão de imagem e de documento)
   e na imagem de destaque, que fica fora do editor. Por isso é CSS da casa e não
   o diálogo do TinyMCE — o da imagem de destaque não teria acesso a ele. */
.pn-modal-fundo {
  position: fixed; inset: 0; z-index: 9000;
  background: rgba(9, 17, 40, .55);
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
}
.pn-modal {
  background: #fff; border-radius: 14px;
  width: min(940px, 100%); max-height: min(80vh, 720px);
  display: flex; flex-direction: column;
  box-shadow: 0 24px 60px rgba(9, 17, 40, .28);
}
.pn-modal-topo {
  display: flex; gap: 10px; align-items: center;
  padding: 14px 16px; border-bottom: 1px solid var(--pn-borda, #D7E0F2);
}
.pn-modal-busca {
  flex: 1; border: 1px solid var(--pn-borda, #D7E0F2); border-radius: 8px;
  padding: 9px 12px; font: inherit; font-size: 15px;
}
.pn-modal-fechar {
  border: 0; background: transparent; cursor: pointer;
  font-size: 18px; line-height: 1; padding: 8px; color: var(--pn-tinta2, #2A3A5C);
}
/* O corpo é quem rola, não a página. Sem isto o modal empurra o formulário
   inteiro para baixo e a pessoa perde a posição ao fechar. */
.pn-modal-corpo { overflow-y: auto; padding: 16px; flex: 1; }
.pn-modal-rodape {
  display: flex; gap: 10px; justify-content: space-between;
  padding: 12px 16px; border-top: 1px solid var(--pn-borda, #D7E0F2);
}

.pn-modal-grade {
  display: grid; gap: 12px;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
}
.pn-modal-grade--lista { grid-template-columns: 1fr; gap: 6px; }

.pn-modal-item {
  border: 1px solid var(--pn-borda, #D7E0F2); border-radius: 10px;
  background: #fff; cursor: pointer; padding: 0; overflow: hidden;
  display: flex; flex-direction: column; text-align: left;
}
.pn-modal-item:hover, .pn-modal-item:focus-visible {
  border-color: var(--pn-acento, #2B5BE8);
  box-shadow: 0 0 0 3px rgba(43, 91, 232, .15);
  outline: none;
}
.pn-modal-item img {
  width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block;
  background: #F1F4FB;
}
/* Duas linhas e corta: nome de arquivo do WhatsApp é enorme e sem o corte cada
   cartão fica de uma altura, quebrando a grade. */
.pn-modal-item span {
  font-size: 12px; line-height: 1.35; padding: 8px 10px;
  color: var(--pn-tinta2, #2A3A5C);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; word-break: break-word;
}
.pn-modal-grade--lista .pn-modal-item { flex-direction: row; align-items: center; }
.pn-modal-grade--lista .pn-modal-item span { -webkit-line-clamp: 1; font-size: 14px; padding: 12px 14px; }