/* =========================================================================
   PORTAL DE LEGALIZACOES — base do design system
   -------------------------------------------------------------------------
   Este ficheiro e a unica fonte de tokens e primitivas do portal. Os ficheiros
   -planozero / -partner / -settings / -viewer consomem estes tokens e nao
   devem redefinir cores, raios, sombras nem escalas tipograficas.

   Regra: nada de CSS ad hoc. Se falta um valor, cria-se um token aqui.
   ========================================================================= */

/* ---------------------------------------------------------------- Tipografia
   Inter self-hosted (variavel, subsets latin + latin-ext). Sem pedidos a
   servidores externos: o portal e privado e tem de funcionar isolado.        */

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/inter-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/inter-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
    U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
    U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* -------------------------------------------------------------------- Tokens */

:root {
  /* =======================================================================
     PLANOZERO Legalizações — sistema visual (V4)

     Uma regra explica o ficheiro inteiro: a interface é neutra e a marca
     aparece como SINAL DE MOVIMENTO OPERACIONAL — aconteceu alguma coisa,
     estamos aqui, isto precisa de atenção. O laranja não significa sucesso,
     erro, espera nem categoria; essas coisas dizem-se com texto, símbolo,
     peso e posição. Por isso os antigos sete estados coloridos (âmbar,
     ardósia, ciano, verde, vermelho) colapsaram todos em cinzentos: o que
     distinguia "a aguardar o IMT" de "a aguardar o parceiro" nunca foi a
     cor — era a frase.

     Os nomes dos tokens não mudaram, para não partir os ~600 var() que já
     existem. Mudaram os valores.
     ======================================================================= */

  /* --- Superfícies escuras ----------------------------------------------
     Grafite, nunca preto absoluto nem navy. O preto puro pesava demais em
     mobile, onde o painel escuro chega a ocupar meio ecrã. */
  --pz-ink-900: #14171b;
  --pz-ink-800: #1b1f24;
  --pz-ink-700: #232830;

  /* Os nomes "navy" ficam por compatibilidade com o CSS existente; o azul
     desapareceu da paleta. */
  --pz-navy-900: #0f1216;
  --pz-navy-800: #14171b;
  --pz-navy-700: #1b1f24;
  --pz-navy-600: #232830;

  /* --- Signal ------------------------------------------------------------
     Uma cor. Ocupa 3–5% do ecrã. --pz-orange-500 é o marcador (pontos,
     barras de 2px, segmento atual do percurso) e nunca carrega texto
     pequeno: sobre branco fica em 3,1:1. Quando o sinal precisa mesmo de
     ser palavra, usa-se --pz-orange-600, medido a 4,9:1. */
  --pz-orange-700: #9a3412;
  --pz-orange-600: #c2410c;
  --pz-orange-500: #f15a24;
  --pz-orange-400: #f8814f;
  --pz-orange-100: #fbd9c8;
  --pz-orange-050: #fdece4;
  --pz-signal: var(--pz-orange-500);
  --pz-signal-ink: var(--pz-orange-600);
  --pz-signal-soft: var(--pz-orange-050);

  /* --- Superfícies claras ------------------------------------------------
     Três níveis com diferenças pequenas mas percetíveis, em neutro frio.
     O neutro quente anterior (#f4f3f1) puxava a interface para o bege. */
  --pz-bg: #f1f3f5;
  --pz-surface: #ffffff;
  --pz-surface-2: #fafbfc;
  --pz-surface-3: #eef0f3;
  --pz-border: #e5e8ec;
  --pz-border-strong: #8b93a3;
  --pz-divider: #e5e8ec;

  /* --- Texto -------------------------------------------------------------
     Contrastes medidos sobre --pz-surface. O secundário anterior estava a
     3,3:1: legível para quem já sabe o que lá está escrito, não para quem
     está a ler. */
  --pz-text: #16191e;
  --pz-text-2: #414954;
  --pz-text-3: #626b7b;
  --pz-text-4: #8b93a0;
  --pz-text-inv: #ffffff;

  /* --- Estados -----------------------------------------------------------
     Cada estado tem fg (texto), bg (superfície), bd (contorno) e ac (ponto
     de acento). Só o estado que representa MOVIMENTO leva Signal no ponto;
     todos os outros são neutros e distinguem-se por símbolo e por peso.
     Nenhum estado depende da cor para ser compreendido. */

  /* Ação necessária: neutro com um ponto Signal. Nunca fundo laranja. */
  --pz-attention-fg: #16191e;
  --pz-attention-bg: #ffffff;
  --pz-attention-bd: #d3d8de;
  --pz-attention-ac: #f15a24;

  /* Com o parceiro — é espera, não alarme. */
  --pz-partner-fg: #414954;
  --pz-partner-bg: #fafbfc;
  --pz-partner-bd: #e5e8ec;
  --pz-partner-ac: #8b93a0;

  /* A aguardar entidades externas (IMT, AT, marca, inspeção). */
  --pz-external-fg: #414954;
  --pz-external-bg: #fafbfc;
  --pz-external-bd: #e5e8ec;
  --pz-external-ac: #8b93a0;

  --pz-scheduled-fg: #414954;
  --pz-scheduled-bg: #fafbfc;
  --pz-scheduled-bd: #e5e8ec;
  --pz-scheduled-ac: #8b93a0;

  /* Bloqueado operacional: mais peso e mais contraste, não vermelho. Um
     processo parado à espera de uma decisão não é uma falha do sistema. */
  --pz-blocked-fg: #16191e;
  --pz-blocked-bg: #f1f3f5;
  --pz-blocked-bd: #c9cfd7;
  --pz-blocked-ac: #232830;

  /* Concluído: neutro. O símbolo e a palavra já comunicam o estado. */
  --pz-success-fg: #414954;
  --pz-success-bg: #fafbfc;
  --pz-success-bd: #e5e8ec;
  --pz-success-ac: #667085;

  --pz-neutral-fg: #414954;
  --pz-neutral-bg: #f4f5f7;
  --pz-neutral-bd: #e5e8ec;
  --pz-neutral-ac: #8b93a0;

  /* Erro real, ficheiro inválido, operação destrutiva. É o único vermelho
     do sistema e não deve aparecer em mais lado nenhum. */
  --pz-danger-fg: #a3231b;
  --pz-danger-bg: #fdf2f1;
  --pz-danger-bd: #ecc8c5;
  --pz-danger-ac: #b3261e;

  /* --- Espaçamento ------------------------------------------------------ */
  --pz-s1: 4px;
  --pz-s2: 8px;
  --pz-s3: 12px;
  --pz-s4: 16px;
  --pz-s5: 20px;
  --pz-s6: 24px;
  --pz-s7: 32px;
  --pz-s8: 40px;

  /* --- Raio ------------------------------------------------------------- */
  --pz-r-xs: 4px;
  --pz-r-sm: 8px;
  --pz-r-md: 10px;
  --pz-r-lg: 12px;
  --pz-r-xl: 14px;
  --pz-r-2xl: 16px;
  --pz-r-full: 999px;

  /* --- Sombra ------------------------------------------------------------
     A profundidade vem do contorno e da tonalidade. A sombra só existe para
     o que está mesmo por cima do conteúdo. */
  --pz-shadow-sm: 0 1px 2px rgba(22, 25, 30, .04);
  --pz-shadow-md: 0 16px 40px rgba(22, 25, 30, .16), 0 2px 6px rgba(22, 25, 30, .06);

  /* --- Foco --------------------------------------------------------------
     Anel de 2px sempre visível, em qualquer superfície. É a única utilização
     de Signal que não é opcional: sem ela não há navegação por teclado. */
  --pz-focus: 0 0 0 2px var(--pz-surface), 0 0 0 4px var(--pz-orange-500);
  --pz-focus-dark: 0 0 0 2px var(--pz-ink-800), 0 0 0 4px var(--pz-orange-500);

  /* --- Gradientes --------------------------------------------------------
     Material e luz, não decoração. Se se nota que há um gradiente, é demais.
     O CTA passou a escuro: a ação principal impõe-se pelo material, não pela
     cor da marca. */
  --pz-grad-navy: linear-gradient(180deg, #14171b 0%, #1b1f24 100%);
  --pz-grad-ink: linear-gradient(180deg, #1b1f24 0%, #232830 100%);
  --pz-grad-cta: linear-gradient(180deg, #1f242b 0%, #171a1e 100%);
  --pz-grad-cta-hover: linear-gradient(180deg, #2a3038 0%, #1f242b 100%);
  --pz-grad-attention: linear-gradient(180deg, #ffffff 0%, #fafbfc 100%);
  --pz-grad-external: linear-gradient(180deg, #ffffff 0%, #fafbfc 100%);
  --pz-grad-success: linear-gradient(180deg, #ffffff 0%, #fafbfc 100%);
  --pz-grad-surface: linear-gradient(180deg, #ffffff 0%, #fcfcfd 100%);

  /* --- Tipografia -------------------------------------------------------- */
  --pz-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI Variable Text",
    "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  /* --- Ícones ------------------------------------------------------------
     Tamanhos fixos. Os SVG levam width/height próprios: sem dimensão
     intrínseca, um SVG sem CSS assume 300x300 e destrói a página. */
  --pz-icon-xs: 14px;
  --pz-icon-sm: 16px;
  --pz-icon-md: 20px;
  --pz-icon-lg: 26px;

  /* --- Layout ------------------------------------------------------------ */
  --pz-sidebar: 244px;
  --pz-content-max: 1520px;

  /* --- Compatibilidade com nomes antigos (a remover quando não houver uso) */
  --pzln-ink: var(--pz-text);
  --pzln-muted: var(--pz-text-3);
  --pzln-line: var(--pz-border);
  --pzln-paper: var(--pz-bg);
  --pzln-surface: var(--pz-surface);
  --pzln-navy: var(--pz-navy-800);
  --pzln-navy-2: var(--pz-navy-700);
  --pzln-accent: var(--pz-orange-500);
  --pzln-accent-dark: var(--pz-orange-600);
  --pzln-green: var(--pz-success-ac);
  --pzln-amber: var(--pz-partner-fg);
  --pzln-red: var(--pz-danger-ac);
  --pzln-blue: var(--pz-external-ac);
  --pzln-radius: var(--pz-r-sm);
  --pzln-shadow: var(--pz-shadow-md);
  --pzln-sidebar: var(--pz-sidebar);
}

/* ---------------------------------------------------------------- Base ---- */

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

html { background: var(--pz-bg); -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--pz-bg);
  color: var(--pz-text);
  font-family: var(--pz-font);
  font-size: 14px;
  line-height: 1.5;
  font-feature-settings: "cv05" 1, "ss03" 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

button, input, select, textarea { font: inherit; color: inherit; }
a { color: inherit; }
h1, h2, h3, h4, p { margin-top: 0; }
h1, h2, h3, h4 { font-weight: 600; letter-spacing: -.011em; }

/* Numeros sempre alinhados em colunas (tabelas, cartoes, contadores). */
.pzln-num, .pzln-table td, .pzln-kpi strong, time { font-variant-numeric: tabular-nums; }

/* Um anel de duas camadas: o Signal por fora e um contorno da propria
   superficie por dentro. Assim o foco continua visivel tanto sobre branco
   como sobre a barra lateral escura, onde um anel laranja sozinho quase
   desaparecia contra o grafite. */
:focus-visible {
  outline: 2px solid var(--pz-orange-500);
  outline-offset: 2px;
  border-radius: var(--pz-r-xs);
}

.pzln-sidebar :focus-visible,
.pzln-shell__aside :focus-visible,
[class*="--on-dark"] :focus-visible {
  outline-color: var(--pz-orange-500);
  box-shadow: 0 0 0 2px var(--pz-ink-900);
}

.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%);
  white-space: nowrap; border: 0;
}

.pzln-body { min-height: 100vh; }

/* ---------------------------------------------------------- Escala tipo --- */

.pzln-eyebrow {
  display: block;
  color: var(--pz-text-3);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .07em;
  text-transform: uppercase;
}

/* ----------------------------------------------------------------- Shell -- */

.pzln-app {
  display: grid;
  grid-template-columns: var(--pz-sidebar) minmax(0, 1fr);
  min-height: 100vh;
}

.pzln-sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--pz-grad-navy);
  color: #e2e6ea;
  z-index: 30;
}
.pzln-sidebar::after {
  content: "";
  position: absolute;
  inset: 0 0 0 auto;
  width: 1px;
  background: linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.04));
  pointer-events: none;
}

/* Lockup: [ wordmark PLANOZERO ] | Legalizacoes.
   O wordmark tem de se LER — um símbolo minúsculo ao lado de texto não é
   assinatura de marca, é um favicon perdido. */
/* Escala do lockup: o wordmark ganha os 34px que tinha no laboratorio e o
   nome do produto recua para 12.5px. A marca e que assina a barra; o
   "Legalizacoes" e uma qualificacao, nao um titulo. */
.pzln-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 22px 20px 24px;
  text-decoration: none;
  color: #fff;
}
.pzln-brand__logo {
  display: block;
  height: 34px;
  width: auto;
  max-width: 128px;
  object-fit: contain;
  object-position: left center;
}
/* Marca tipografica de recurso (sem logotipo carregado). Fundo escuro em vez
   do laranja: branco sobre laranja a 13px nao chega a 4.5:1. */
.pzln-brand__mark {
  display: grid;
  place-items: center;
  width: 34px; height: 34px;
  border-radius: var(--pz-r-sm);
  background: var(--pz-ink-800);
  border: 1px solid var(--pz-orange-500);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -.03em;
}
.pzln-brand__rule {
  width: 1px;
  height: 24px;
  background: rgba(255, 255, 255, .2);
  flex: none;
}
.pzln-brand__name {
  font-size: 12.5px;
  font-weight: 500;
  letter-spacing: .005em;
  color: #c3cad3;
  white-space: nowrap;
}

/* Micro-rotulo em maiusculas, na escala do laboratorio: 10.5px com um
   tracking de .08em. Mais pequeno do que isto deixa de se ler; mais espacado
   deixa de ser uma palavra e passa a ser um padrao. */
.pzln-context {
  padding: 0 20px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, .09);
}
.pzln-context span, .pzln-context strong { display: block; }
.pzln-context span {
  color: #8a929d;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.pzln-context strong { margin-top: 5px; font-size: 13.5px; font-weight: 600; color: #e8ebee; letter-spacing: -.005em; }

.pzln-nav { display: grid; gap: 2px; padding: 14px 10px; }
.pzln-nav a {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 9px 10px;
  border-radius: var(--pz-r-sm);
  color: #a7aeb8;
  font-size: 13.5px;
  font-weight: 450;
  text-decoration: none;
  transition: background-color .14s ease, color .14s ease;
}
.pzln-nav a svg { width: 16px; height: 16px; flex: none; opacity: .8; }
.pzln-nav a:hover { color: #fff; background: rgba(255, 255, 255, .05); }
/* Estado ativo sóbrio: a página já se sabe pelo conteúdo. Uma mancha laranja
   grande na barra lateral gastava o accent no sítio errado — fica só um
   filete e o ícone. */
.pzln-nav a.is-active {
  position: relative;
  color: #fff;
  background: rgba(255, 255, 255, .07);
  font-weight: 600;
}
/* O marcador desenha-se a parte: como sombra interior seguia o raio do item
   e ficava com as duas pontas curvas, a ler-se como um parentese solto. Uma
   barra propria mantem o topo e a base retos. */
.pzln-nav a.is-active::before {
  content: "";
  position: absolute;
  left: -6px;
  top: 7px;
  bottom: 7px;
  width: 3px;
  border-radius: 3px;
  background: var(--pz-orange-500);
}
.pzln-nav a.is-active svg { opacity: 1; color: #fff; }
.pzln-nav__count {
  margin-left: auto;
  min-width: 21px;
  padding: 1px 7px;
  border-radius: var(--pz-r-full);
  background: rgba(255, 255, 255, .1);
  color: #c3cad3;
  font-size: 11px;
  font-weight: 600;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.pzln-nav a.is-active .pzln-nav__count { background: rgba(255, 255, 255, .14); color: #fff; }

/* O rodape espelha o topo: mesmo recuo, mesma escala. A conta em maiusculas
   pequenas, a accao em texto normal — a conta identifica, o link e que se
   clica, e nao devem pesar o mesmo. */
.pzln-sidebar__foot {
  margin-top: auto;
  padding: 14px 20px 18px;
  border-top: 1px solid rgba(255, 255, 255, .09);
}
.pzln-sidebar__foot span, .pzln-sidebar__foot a { display: block; }
.pzln-sidebar__foot span {
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #8a929d;
}
.pzln-sidebar__foot a {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  margin-top: 4px;
  color: #c3cad3;
  font-size: 13px;
  text-decoration: none;
}
.pzln-sidebar__foot a:hover { color: #fff; text-decoration: underline; }

.pzln-main { min-width: 0; display: flex; flex-direction: column; }

/* O cabeçalho pertence ao canvas, não é uma faixa branca colada por cima: fica
   no tom do fundo, com um contorno fino a separar. */
.pzln-topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  gap: 16px;
  height: 58px;
  padding: 0 28px;
  background: rgba(244, 243, 241, .9);
  border-bottom: 1px solid var(--pz-border);
  backdrop-filter: saturate(150%) blur(12px);
}
.pzln-menu-toggle { display: none; }

.pzln-content {
  width: 100%;
  max-width: var(--pz-content-max);
  margin: 0 auto;
  padding: 24px 28px 56px;
}

/* -------------------------------------------------------------- Cabecalho - */

.pzln-page-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
  margin-bottom: 20px;
}
.pzln-page-head > div:first-child { max-width: 780px; }
.pzln-page-head span {
  display: block;
  color: var(--pz-text-3);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.pzln-page-head h1 {
  margin: 6px 0 4px;
  font-size: 26px;
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: -.022em;
}
.pzln-page-head p { margin: 0; color: var(--pz-text-3); font-size: 14px; }
.pzln-page-head__actions { display: flex; gap: 8px; flex: none; }

/* ----------------------------------------------------------------- Botoes - */

.pzln-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 36px;
  padding: 8px 14px;
  border: 1px solid var(--pz-border-strong);
  border-radius: var(--pz-r-md);
  background: var(--pz-surface);
  color: var(--pz-text);
  font-size: 13.5px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.pzln-button svg { width: 16px; height: 16px; }
.pzln-button:hover { background: var(--pz-surface-2); border-color: var(--pz-border-strong); }
.pzln-button:disabled, .pzln-button[aria-disabled="true"] {
  opacity: .5;
  cursor: not-allowed;
  pointer-events: none;
}

.pzln-button--primary {
  border-color: var(--pz-ink-900);
  background: var(--pz-grad-cta);
  color: #fff;
  box-shadow: 0 1px 2px rgba(120, 44, 5, .3);
}
.pzln-button--primary:hover { background: var(--pz-grad-cta-hover); border-color: var(--pz-ink-900); }

.pzln-button--dark {
  border-color: var(--pz-navy-800);
  background: var(--pz-navy-800);
  color: #fff;
}
.pzln-button--dark:hover { background: var(--pz-navy-700); border-color: var(--pz-navy-700); }

.pzln-button--secondary { background: var(--pz-surface-2); }
.pzln-button--ghost { border-color: transparent; background: transparent; }
.pzln-button--ghost:hover { background: var(--pz-surface-3); border-color: transparent; }
.pzln-button--danger {
  border-color: var(--pz-danger-bd);
  background: var(--pz-danger-bg);
  color: var(--pz-danger-fg);
}
.pzln-button--small { min-height: 30px; padding: 5px 10px; font-size: 12.5px; border-radius: var(--pz-r-sm); }
.pzln-button--large { min-height: 42px; padding: 11px 20px; font-size: 14.5px; }
.pzln-button--wide { width: 100%; }

/* ------------------------------------------------------------------ Pills - */

/* Estado = ponto + palavra.
   Sem cápsula, sem contorno, sem fundo: numa tabela onde quase todas as linhas
   têm estado, cinquenta cápsulas coloridas passam a ser o próprio ruído que
   impedem de ler. A cápsula fica reservada aos sítios onde o estado aparece
   sozinho (cabeçalho do processo, cartão). */
.pzln-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: max-content;
  max-width: 100%;
  color: var(--pz-neutral-fg);
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.5;
  white-space: nowrap;
}
.pzln-pill::before {
  content: "";
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--pz-neutral-ac);
  flex: none;
}
/* Versão em cápsula, quando o estado precisa mesmo de se destacar. */
.pzln-pill--chip {
  padding: 3px 10px 3px 8px;
  border: 1px solid var(--pz-neutral-bd);
  border-radius: var(--pz-r-full);
  background: var(--pz-neutral-bg);
  font-size: 12px;
  font-weight: 600;
}
/* A cor vive no ponto e no texto — mas em tom escuro, não em cápsula. Assim o
   estado lê-se à distância sem encher a tabela de blocos coloridos. */
.pzln-pill--attention { color: var(--pz-attention-fg); }
.pzln-pill--attention::before { background: var(--pz-attention-ac); }
.pzln-pill--partner { color: var(--pz-partner-fg); }
.pzln-pill--partner::before { background: var(--pz-partner-ac); }
.pzln-pill--external { color: var(--pz-external-fg); }
.pzln-pill--external::before { background: var(--pz-external-ac); }
.pzln-pill--scheduled { color: var(--pz-scheduled-fg); }
.pzln-pill--scheduled::before { background: var(--pz-scheduled-ac); }
.pzln-pill--blocked { color: var(--pz-blocked-fg); }
.pzln-pill--blocked::before { background: var(--pz-blocked-ac); }
.pzln-pill--success { color: var(--pz-success-fg); }
.pzln-pill--success::before { background: var(--pz-success-ac); }

/* Em cápsula, o tom completo. */
.pzln-pill--chip.pzln-pill--attention { background: var(--pz-attention-bg); border-color: var(--pz-attention-bd); color: var(--pz-attention-fg); }
.pzln-pill--chip.pzln-pill--partner { background: var(--pz-partner-bg); border-color: var(--pz-partner-bd); color: var(--pz-partner-fg); }
.pzln-pill--chip.pzln-pill--external { background: var(--pz-external-bg); border-color: var(--pz-external-bd); color: var(--pz-external-fg); }
.pzln-pill--chip.pzln-pill--scheduled { background: var(--pz-scheduled-bg); border-color: var(--pz-scheduled-bd); color: var(--pz-scheduled-fg); }
.pzln-pill--chip.pzln-pill--blocked { background: var(--pz-blocked-bg); border-color: var(--pz-blocked-bd); color: var(--pz-blocked-fg); }
.pzln-pill--chip.pzln-pill--success { background: var(--pz-success-bg); border-color: var(--pz-success-bd); color: var(--pz-success-fg); }
.pzln-pill--plain::before { display: none; }

/* Compatibilidade: .pzln-status era a pill antiga. */
.pzln-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: max-content;
  padding: 3px 9px 3px 7px;
  border: 1px solid var(--pz-neutral-bd);
  border-radius: var(--pz-r-full);
  background: var(--pz-neutral-bg);
  color: var(--pz-neutral-fg) !important;
  font-size: 11.5px !important;
  font-weight: 600;
  white-space: nowrap;
}
.pzln-status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex: none; opacity: .85; }
.pzln-status--new { background: var(--pz-attention-bg); border-color: var(--pz-attention-bd); color: var(--pz-attention-fg) !important; }
.pzln-status--blocked { background: var(--pz-blocked-bg); border-color: var(--pz-blocked-bd); color: var(--pz-blocked-fg) !important; }
.pzln-status--waiting_partner { background: var(--pz-partner-bg); border-color: var(--pz-partner-bd); color: var(--pz-partner-fg) !important; }
.pzln-status--in_progress, .pzln-status--analysis { background: var(--pz-external-bg); border-color: var(--pz-external-bd); color: var(--pz-external-fg) !important; }
.pzln-status--completed { background: var(--pz-success-bg); border-color: var(--pz-success-bd); color: var(--pz-success-fg) !important; }
.pzln-status--cancelled { background: var(--pz-neutral-bg); border-color: var(--pz-neutral-bd); color: var(--pz-neutral-fg) !important; }

/* ---------------------------------------------------------------- Paineis - */

.pzln-panel {
  margin-bottom: 16px;
  background: var(--pz-surface);
  border: 1px solid var(--pz-border);
  border-radius: var(--pz-r-lg);
  box-shadow: var(--pz-shadow-sm);
  overflow: hidden;
}
.pzln-panel__head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--pz-divider);
  background: var(--pz-grad-surface);
}
/* Só o sobretítulo, não qualquer <span> lá dentro: a regra genérica estava a
   pôr as pills do cabeçalho em maiúsculas ("PUBLICADA V3"). */
.pzln-panel__head > div > span:not(.pzln-pill) {
  display: block;
  color: var(--pz-text-3);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.pzln-panel__head h2 { margin: 4px 0 0; font-size: 17px; font-weight: 700; letter-spacing: -.015em; }
/* Os links de seccao ("Ver todos", "Ver percurso") deixaram de ser laranja:
   sao navegacao, nao acontecimento. O sublinhado da a afordancia que a cor
   dava, e o Signal fica livre para o que muda. */
.pzln-panel__head > a {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 2px;
  font-size: 13px;
  font-weight: 500;
  color: var(--pz-text-2);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: var(--pz-border-strong);
  white-space: nowrap;
}
.pzln-panel__head > a:hover { text-decoration: underline; }
.pzln-panel__head small { color: var(--pz-text-3); }
.pzln-panel__body { padding: 16px 18px; }

/* ---------------------------------------------------------------- Tabelas - */

.pzln-table-wrap { overflow-x: auto; }
.pzln-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.pzln-table th {
  padding: 9px 14px;
  background: var(--pz-surface-2);
  border-bottom: 1px solid var(--pz-border);
  color: var(--pz-text-3);
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: normal;
  text-align: left;
  text-transform: none;
  white-space: nowrap;
}
.pzln-table td { padding: 10px 14px; border-top: 1px solid var(--pz-divider); vertical-align: middle; }
.pzln-table tbody tr:first-child td { border-top: 0; }
.pzln-table tbody tr:hover { background: var(--pz-surface-2); }
/* Destaque reservado ao que é MESMO excecional (bloqueado). Se todas as linhas
   levarem barra laranja, a barra deixa de querer dizer alguma coisa. */
.pzln-table tr.is-critical td:first-child { box-shadow: inset 3px 0 var(--pz-blocked-ac); }
.pzln-table tr.pzln-row-link, .pzln-table tr.pzln-row-link td { cursor: pointer; }
.pzln-table tr.pzln-row-link a,
.pzln-table tr.pzln-row-link button,
.pzln-table tr.pzln-row-link input,
.pzln-table tr.pzln-row-link select { cursor: auto; }
/* Sublinha da célula (VIN, contexto). Exclui as pills: sem :not(), esta regra
   ganhava por especificidade e apagava a cor do estado, deixando a coluna toda
   cinzenta. */
.pzln-table td > span:not(.pzln-pill), .pzln-table__link span {
  display: block;
  margin-top: 2px;
  color: var(--pz-text-3);
  font-size: 12px;
}
/* Controlos dentro de tabelas também são alvos de toque. */
.pzln-table select,
.pzln-table input:not([type="hidden"]):not([type="checkbox"]) {
  min-height: 32px;
  padding: 5px 9px;
  border: 1px solid var(--pz-border-strong);
  border-radius: var(--pz-r-sm);
  background: var(--pz-surface);
  font-size: 13px;
}
.pzln-table__link { display: block; min-height: 26px; text-decoration: none; }
.pzln-table__link strong { font-weight: 600; }
.pzln-table__link:hover strong { color: var(--pz-text); }

/* ---------------------------------------------------------------- Avisos -- */

.pzln-notice {
  display: flex;
  gap: 10px;
  margin-bottom: 16px;
  padding: 12px 14px;
  border: 1px solid var(--pz-external-bd);
  border-left: 3px solid var(--pz-external-ac);
  border-radius: var(--pz-r-md);
  background: var(--pz-external-bg);
  color: var(--pz-external-fg);
  font-weight: 500;
}
.pzln-notice--success { border-color: var(--pz-success-bd); border-left-color: var(--pz-success-ac); background: var(--pz-success-bg); color: var(--pz-success-fg); }
.pzln-notice--error { border-color: var(--pz-danger-bd); border-left-color: var(--pz-danger-ac); background: var(--pz-danger-bg); color: var(--pz-danger-fg); }
.pzln-notice--warning { border-color: var(--pz-partner-bd); border-left-color: var(--pz-partner-ac); background: var(--pz-partner-bg); color: var(--pz-partner-fg); }
.pzln-notice ul { margin: 4px 0 0; }
/* Ligações dentro de um aviso continuam a ser alvos de toque. */
.pzln-notice a {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 4px;
  font-weight: 600;
}

/* ------------------------------------------------------------ Vazio ------- */

.pzln-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 168px;
  padding: 28px;
  color: var(--pz-text-3);
  text-align: center;
}
.pzln-empty strong { color: var(--pz-text); font-size: 15px; font-weight: 600; }
.pzln-empty--compact { min-height: 96px; padding: 20px; }

/* ------------------------------------------------------------ Formularios - */

.pzln-form label > span,
.pzln-filterbar label > span,
.pzln-upload label > span,
.pzln-request-box label > span,
.pzln-field > span {
  display: block;
  margin-bottom: 5px;
  color: var(--pz-text-2);
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .01em;
}

.pzln-form input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.pzln-form select,
.pzln-form textarea,
.pzln-filterbar input,
.pzln-filterbar select,
.pzln-upload input:not([type="file"]),
.pzln-upload select,
.pzln-request-box textarea {
  width: 100%;
  min-height: 38px;
  padding: 8px 11px;
  border: 1px solid var(--pz-border-strong);
  border-radius: var(--pz-r-sm);
  background: var(--pz-surface);
  color: var(--pz-text);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.pzln-form textarea { resize: vertical; min-height: 76px; }
.pzln-form input:focus, .pzln-form select:focus, .pzln-form textarea:focus,
.pzln-filterbar input:focus, .pzln-filterbar select:focus, .pzln-upload select:focus {
  outline: none;
  border-color: var(--pz-orange-500);
  box-shadow: 0 0 0 3px rgba(241, 90, 36, .3);
}

.pzln-check { display: flex !important; align-items: center; gap: 8px; min-height: 26px; }
.pzln-check input {
  width: 16px !important;
  height: 16px;
  min-height: 16px !important;
  flex: none;
  accent-color: var(--pz-orange-600);
}
.pzln-check span { margin: 0 !important; font-size: 13px !important; font-weight: 500 !important; letter-spacing: 0 !important; }
.pzln-check--filter { align-self: center; padding-top: 18px; }

.pzln-filterbar {
  display: grid;
  grid-template-columns: minmax(220px, 1.8fr) repeat(4, minmax(135px, .8fr)) auto auto;
  gap: 10px;
  align-items: end;
  margin-bottom: 14px;
  padding: 14px;
  background: var(--pz-surface);
  border: 1px solid var(--pz-border);
  border-radius: var(--pz-r-lg);
  box-shadow: var(--pz-shadow-sm);
}

.pzln-form--stack { display: grid; gap: 12px; }

/* ------------------------------------------------------------- Paginacao -- */

/* Rede de segurança: mesmo condensada, a paginação nunca pode empurrar a
   página para o lado. Muda de linha em vez de transbordar. */
.pzln-pagination { display: flex; flex-wrap: wrap; gap: 4px; justify-content: center; margin: 20px 0; }
.pzln-pagination__gap { align-self: center; padding: 0 2px; color: var(--pz-text-3); }
.pzln-pagination a {
  display: grid;
  place-items: center;
  min-width: 34px; height: 34px;
  padding: 0 8px;
  border: 1px solid var(--pz-border);
  border-radius: var(--pz-r-sm);
  background: var(--pz-surface);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}
.pzln-pagination a:hover { background: var(--pz-surface-2); }
.pzln-pagination a.is-active { background: var(--pz-navy-800); border-color: var(--pz-navy-800); color: #fff; }

/* --------------------------------------------------------------- Dialogos - */

dialog.pzln-dialog {
  width: min(620px, calc(100vw - 32px));
  max-height: calc(100vh - 64px);
  padding: 0;
  border: 1px solid var(--pz-border);
  border-radius: var(--pz-r-lg);
  background: var(--pz-surface);
  box-shadow: var(--pz-shadow-md);
  color: var(--pz-text);
}
dialog.pzln-dialog::backdrop { background: rgba(6, 22, 33, .48); backdrop-filter: blur(2px); }
dialog.pzln-dialog--wide { width: min(900px, calc(100vw - 32px)); }
.pzln-dialog__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  padding: 18px 20px 14px;
  border-bottom: 1px solid var(--pz-divider);
}
.pzln-dialog__head h2 { margin: 0; font-size: 17px; font-weight: 700; }
.pzln-dialog__head p { margin: 4px 0 0; color: var(--pz-text-3); font-size: 13px; }
.pzln-dialog__body { padding: 18px 20px; overflow-y: auto; }
.pzln-dialog__foot {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 14px 20px;
  border-top: 1px solid var(--pz-divider);
  background: var(--pz-surface-2);
}
.pzln-dialog__close {
  border: 0;
  background: transparent;
  color: var(--pz-text-3);
  font-size: 20px;
  line-height: 1;
  padding: 4px 6px;
  border-radius: var(--pz-r-sm);
  cursor: pointer;
}
.pzln-dialog__close:hover { background: var(--pz-surface-3); color: var(--pz-text); }

/* ------------------------------------------------------------- Dropzone --- */

.pzln-dropzone {
  display: grid;
  place-items: center;
  min-height: 116px;
  padding: 20px;
  border: 1.5px dashed var(--pz-border-strong);
  border-radius: var(--pz-r-md);
  background: var(--pz-surface-2);
  text-align: center;
  cursor: pointer;
  transition: border-color .15s ease, background-color .15s ease;
}
.pzln-dropzone:hover { border-color: var(--pz-orange-400); background: var(--pz-orange-050); }
.pzln-dropzone.is-dragging { border-color: var(--pz-orange-500); background: var(--pz-orange-050); }
.pzln-dropzone input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.pzln-dropzone strong, .pzln-dropzone span, .pzln-dropzone small { display: block; }
.pzln-dropzone strong { font-size: 14.5px; font-weight: 600; }
.pzln-dropzone span { margin-top: 4px !important; color: var(--pz-text-3); font-size: 13px; font-weight: 400 !important; letter-spacing: 0 !important; }
.pzln-dropzone small { margin-top: 8px; color: var(--pz-text-2); font-weight: 600; }

/* ------------------------------------------------------- Lista de ficheiros
   Componente unico: o mesmo upload serve os dois perfis.                     */

[data-pzp-file-list] { margin: 12px 0 0; padding: 0; list-style: none; display: grid; gap: 6px; }
[data-pzp-file-list]:empty { display: none; }
[data-pzp-file-list] li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid var(--pz-border);
  border-radius: var(--pz-r-sm);
  background: var(--pz-surface);
  font-size: 12.5px;
}
.pzln-file__ext {
  padding: 2px 6px;
  border-radius: var(--pz-r-xs);
  background: var(--pz-navy-800);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .04em;
}
.pzln-file__name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.pzln-file__size { color: var(--pz-text-3); font-variant-numeric: tabular-nums; }
/* Ler um scan de várias páginas demora minutos. Sem sinal nenhum a página
   parecia parada e o parceiro não sabia se podia enviar. É um estado, não um
   aviso: discreto, sem barra de progresso falsa, e nunca impede o envio. */
.pzln-file__reading {
  color: var(--pz-text-3);
  font-size: 11.5px;
  font-style: italic;
  white-space: nowrap;
}
/* Ja lido: deixa de ser um estado a decorrer e passa a ser um resultado.
   Continua discreto — a conclusao util do documento aparece depois de guardar,
   no proprio processo, e nao aqui. */
.pzln-file__reading--ok { font-style: normal; color: var(--pz-ok-fg, var(--pz-text-2)); }
/* "4 de 9 lidos" — a unica contagem honesta que temos: documentos inteiros.
   Nao ha percentagem porque nao ha maneira de a saber sem a inventar. */
.pzln-file__summary {
  display: block;
  padding: 6px 2px 8px;
  color: var(--pz-text-3);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  border-bottom: 1px solid var(--pz-line, rgba(0,0,0,.08));
  margin-bottom: 6px;
}
.pzln-file__remove {
  width: 22px; height: 22px;
  padding: 0;
  border: 0;
  border-radius: var(--pz-r-full);
  background: transparent;
  color: var(--pz-text-3);
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
}
.pzln-file__remove:hover { background: var(--pz-blocked-bg); color: var(--pz-blocked-fg); }

/* -------------------------------------------------------------- Timeline -- */

.pzln-timeline { margin: 0; padding: 16px 20px 20px; list-style: none; }
.pzln-timeline li { display: grid; grid-template-columns: 108px 14px minmax(0, 1fr); gap: 10px; padding-bottom: 16px; }
.pzln-timeline li::before {
  content: "";
  grid-column: 2; grid-row: 1;
  width: 8px; height: 8px;
  margin-top: 6px;
  border-radius: 50%;
  background: var(--pz-external-ac);
  box-shadow: 0 0 0 3px var(--pz-external-bg);
}
.pzln-timeline li::after {
  content: "";
  grid-column: 2; grid-row: 1;
  width: 1px;
  height: calc(100% + 12px);
  margin: 14px 0 0 4px;
  background: var(--pz-border);
}
.pzln-timeline li:last-child::after { display: none; }
.pzln-timeline li.is-internal::before { background: var(--pz-orange-500); box-shadow: 0 0 0 3px var(--pz-orange-050); }
.pzln-timeline time { color: var(--pz-text-3); font-size: 12px; font-variant-numeric: tabular-nums; }
.pzln-timeline li > div { grid-column: 3; }
.pzln-timeline li > div span { display: block; color: var(--pz-text-3); font-size: 12px; }

/* Cabecalho de dia: repetir a data em cada linha transforma a timeline num
   log. Uma vez por dia chega, e as horas passam a ler-se em coluna. */
.pzln-timeline__day { display: block !important; padding: 2px 0 10px; }
.pzln-timeline__day::before, .pzln-timeline__day::after { display: none !important; }
.pzln-timeline li + .pzln-timeline__day { padding-top: 8px; }
.pzln-timeline__day span {
  color: var(--pz-text-3);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: normal;
  text-transform: none;
}
.pzln-timeline details { margin-top: 4px; }
.pzln-timeline details > summary {
  color: var(--pz-text-3);
  font-size: 12px;
  cursor: pointer;
  list-style: none;
}
.pzln-timeline details > summary::-webkit-details-marker { display: none; }
.pzln-timeline details > summary::before { content: "▸ "; }
.pzln-timeline details[open] > summary::before { content: "▾ "; }
.pzln-timeline details p { margin: 4px 0 0; color: var(--pz-text-2); font-size: 12.5px; }

/* ------------------------------------------------------- Cartoes numericos -
   Compactos, o cartao inteiro e o alvo de clique. Sem "Abrir lista".         */

/* Indicadores numéricos.
   Rótulo pequeno com um ícone de 16px, número grande por baixo. Sem barras
   coloridas no topo: sete barras de sete cores não são hierarquia, são
   confusão. A cor entra só onde há trabalho para alguém, e o peso do cartão
   diz-se pelo tamanho do número, não por mais uma cor. */
/* Os indicadores sao UM instrumento, nao seis caixas.
   Seis cartoes iguais lado a lado davam o mesmo peso visual a "75 para tratar"
   e a "0 concluidos": a grelha desenhava-os iguais, e a hierarquia so aparecia
   no numero. Numa superficie unica dividida por fios, a proporcao entre os
   valores volta a ser a primeira coisa que se le. */
.pzln-cards {
  display: grid;
  gap: 0;
  margin-bottom: 18px;
  border: 1px solid var(--pz-border);
  border-radius: var(--pz-r-xl);
  background: var(--pz-surface);
  box-shadow: var(--pz-shadow-sm);
  overflow: hidden;
}
.pzln-card {
  position: relative;
  display: block;
  padding: 16px 20px 18px;
  border: 0;
  border-left: 1px solid var(--pz-divider);
  border-radius: 0;
  background: transparent;
  text-decoration: none;
  color: inherit;
  transition: background-color .14s ease;
}
.pzln-card:first-child { border-left: 0; }
.pzln-card__label {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  /* Duas linhas reservadas: "A aguardar entidades" ocupa duas e, sem isto,
     empurrava o número para baixo e desalinhava-o dos vizinhos. */
  min-height: 31px;
  color: var(--pz-text-3);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.3;
}
/* Os rotulos ("Para tratar", "Bloqueados") dizem tudo sozinhos. Seis icones
   decorativos numa faixa de numeros so acrescentam ruido. */
.pzln-card__icon { display: none; }
.pzln-card > strong {
  display: block;
  margin-top: 9px;
  font-size: 26px;
  line-height: 1;
  font-weight: 600;
  letter-spacing: -.03em;
  color: var(--pz-text);
  font-variant-numeric: tabular-nums;
}
.pzln-card > small { display: block; margin-top: 5px; color: var(--pz-text-3); font-size: 11.5px; }
a.pzln-card:hover { background: var(--pz-surface-2); }
a.pzln-card:focus-visible { outline-offset: -2px; }

/* Peso: o indicador que manda no dia é maior; o histórico é discreto. */
.pzln-card--primary > strong { font-size: 40px; font-weight: 600; letter-spacing: -.04em; }
.pzln-card--primary .pzln-card__label { color: var(--pz-text-2); }
.pzln-card--quiet > strong { font-size: 21px; color: var(--pz-text-2); }
/* Um zero nao merece a mesma tinta que um 75. */
.pzln-card.is-zero > strong { color: var(--pz-text-3); font-weight: 500; }

/* O que exige alguem distingue-se pelo ponto, nao por um fundo colorido:
   Signal e sinal, nao superficie. */
.pzln-card--attention .pzln-card__label::before {
  content: "";
  width: 6px; height: 6px; margin-top: 5px;
  border-radius: 50%;
  background: var(--pz-attention-ac);
  flex: none;
}
.pzln-card--attention > strong { color: var(--pz-attention-fg); }
.pzln-card--attention .pzln-card__label { color: var(--pz-text-2); }
.pzln-card--attention .pzln-card__icon { display: none; }

/* Bloqueado distingue-se por peso, nunca por vermelho: um processo parado à
   espera de uma decisão não é uma falha do sistema. */
.pzln-card--blocked > strong { color: var(--pz-blocked-fg); font-weight: 700; }
.pzln-card--blocked .pzln-card__label { color: var(--pz-text-2); }

/* Espera, conclusão e zero: neutros. O estado lê-se no rótulo. */
.pzln-card.is-zero { background: var(--pz-surface-2); }
.pzln-card.is-zero .pzln-card__icon { opacity: .35; }
.pzln-card.is-zero .pzln-card__label::before { background: var(--pz-neutral-ac); }

/* Quando a faixa quebra para várias linhas, os fios têm de acompanhar: sem
   isto, a primeira célula de cada linha nova ficava com um fio à esquerda
   pendurado no meio da superfície. */
@media (max-width: 1240px) {
  .pzo-cards > .pzln-card:nth-child(3n+1) { border-left: 0; }
  .pzo-cards > .pzln-card:nth-child(n+4) { border-top: 1px solid var(--pz-divider); }
}
@media (max-width: 720px) {
  .pzo-cards > .pzln-card:nth-child(n) { border-left: 1px solid var(--pz-divider); border-top: 1px solid var(--pz-divider); }
  .pzo-cards > .pzln-card:nth-child(odd) { border-left: 0; }
  .pzo-cards > .pzln-card:nth-child(-n+2) { border-top: 0; }
}
@media (max-width: 700px) {
  .pzp-cards > .pzln-card { border-left: 0; border-top: 1px solid var(--pz-divider); }
  .pzp-cards > .pzln-card:first-child { border-top: 0; }
}
.pzln-card--attention.is-zero {
  border-color: var(--pz-border);
  background: var(--pz-surface-2);
}
.pzln-card--attention.is-zero > strong,
.pzln-card--attention.is-zero .pzln-card__label { color: var(--pz-text-3); }

/* --------------------------------------------------------------- Stepper ---
   Responde a "onde estamos". Nunca substitui a checklist da etapa.           */

/* O percurso rola quando não cabe; o esbatimento à direita diz que há mais
   etapas — sem ele o stepper parecia simplesmente cortado. */
.pzln-stepper-scroll { position: relative; }
/* As sombras laterais so aparecem quando ha mesmo mais percurso para ver — o
   JS marca has-more/has-before. Sem isso a sombra estava sempre la e deixava
   de significar seja o que for. */
.pzln-stepper-scroll::after,
.pzln-stepper-scroll::before {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  width: 42px;
  opacity: 0;
  transition: opacity .15s ease;
  pointer-events: none;
}
.pzln-stepper-scroll::after {
  right: 0;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0), var(--pz-surface) 78%);
}
.pzln-stepper-scroll::before {
  left: 0;
  background: linear-gradient(270deg, rgba(255, 255, 255, 0), var(--pz-surface) 78%);
}
.pzln-stepper-scroll.has-more::after { opacity: 1; }
.pzln-stepper-scroll.has-before::before { opacity: 1; }
.pzln-stepper { display: flex; gap: 0; overflow-x: auto; padding: 2px; scrollbar-width: thin; }
.pzln-step {
  position: relative;
  flex: 1 0 auto;
  min-width: 128px;
  padding: 10px 12px 11px 14px;
  border: 1px solid var(--pz-border);
  border-right: 0;
  background: var(--pz-surface-2);
  color: var(--pz-text-3);
  text-decoration: none;
}
.pzln-step:first-child { border-radius: var(--pz-r-md) 0 0 var(--pz-r-md); }
.pzln-step:last-child { border-right: 1px solid var(--pz-border); border-radius: 0 var(--pz-r-md) var(--pz-r-md) 0; }
.pzln-step__mark {
  display: inline-grid;
  place-items: center;
  width: 19px; height: 19px;
  margin-bottom: 6px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  font-size: 10.5px;
  font-weight: 700;
  line-height: 1;
}
.pzln-step__name { display: block; font-size: 12px; font-weight: 600; line-height: 1.25; color: var(--pz-text-2); }
.pzln-step__note { display: block; margin-top: 3px; font-size: 11px; }
.pzln-step.is-done { background: var(--pz-success-bg); border-color: var(--pz-success-bd); color: var(--pz-success-fg); }
.pzln-step.is-done .pzln-step__mark { background: var(--pz-success-ac); border-color: var(--pz-success-ac); color: #fff; }
.pzln-step.is-done .pzln-step__name { color: var(--pz-success-fg); }
.pzln-step.is-current { background: var(--pz-grad-attention); border-color: var(--pz-attention-bd); color: var(--pz-attention-fg); z-index: 1; }
/* Numero branco sobre laranja: usa-se a versao profunda, tal como no CTA. */
.pzln-step.is-current .pzln-step__mark { background: var(--pz-orange-500); border-color: var(--pz-orange-500); color: #fff; }
.pzln-step.is-current .pzln-step__name { color: var(--pz-attention-fg); font-weight: 700; }
.pzln-step.is-skipped { background: var(--pz-surface-2); }
.pzln-step.is-skipped .pzln-step__mark { border-style: dashed; }

/* ------------------------------------------------------------------ Tabs --- */

.pzln-tabs {
  display: flex;
  gap: 2px;
  margin-bottom: 16px;
  padding: 3px;
  border: 1px solid var(--pz-border);
  border-radius: var(--pz-r-md);
  background: var(--pz-surface);
  box-shadow: var(--pz-shadow-sm);
  overflow-x: auto;
}
.pzln-tabs a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 13px;
  border-radius: var(--pz-r-sm);
  color: var(--pz-text-2);
  font-size: 13.5px;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color .15s ease, color .15s ease;
}
.pzln-tabs a:hover { background: var(--pz-surface-3); color: var(--pz-text); }
.pzln-tabs a.is-active { background: var(--pz-navy-800); color: #fff; }
.pzln-tabs__count {
  min-width: 18px;
  padding: 0 5px;
  border-radius: var(--pz-r-full);
  background: var(--pz-surface-3);
  color: var(--pz-text-2);
  font-size: 11px;
  font-weight: 700;
  text-align: center;
}
/* Fundo opaco de proposito: sobre o separador ativo, um branco a 18% deixa o
   contraste do numero dependente do que estiver por baixo. */
.pzln-tabs a.is-active .pzln-tabs__count { background: var(--pz-ink-700); color: #fff; }
.pzln-tabs__count--alert { background: var(--pz-attention-bg); color: var(--pz-attention-fg); }

/* --------------------------------------------------------------- Login ----- */

.pzln-auth {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 1.1fr minmax(380px, .9fr);
  background: var(--pz-navy-800);
}
.pzln-auth__brand {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 6vw;
  color: #fff;
  background: var(--pz-grad-navy);
  overflow: hidden;
}
.pzln-auth__brand::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(90% 70% at 12% 88%, rgba(255, 104, 29, .16), transparent 62%),
    repeating-linear-gradient(90deg, transparent 0 79px, rgba(255, 255, 255, .028) 80px);
}
.pzln-auth__brand > * { position: relative; }
.pzln-auth__logo { height: 34px; width: auto; max-width: 220px; margin-bottom: 26px; object-fit: contain; }
.pzln-auth__wordmark { width: 176px; height: 46px; margin-bottom: 26px; }
.pzln-auth__brand span { color: #8a929d; font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.pzln-auth__brand h1 { margin: 0; font-size: clamp(32px, 4vw, 46px); line-height: 1.05; font-weight: 600; letter-spacing: -.03em; }
.pzln-auth__brand p { max-width: 520px; margin: 16px 0 0; color: #a7aeb8; font-size: 15px; }
.pzln-auth__panel {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(32px, 6vw, 80px);
  background: var(--pz-surface);
}
.pzln-auth__eyebrow {
  color: var(--pz-text-3);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.pzln-auth__panel h1, .pzln-auth__panel h2 { margin: 12px 0 6px; font-size: 27px; font-weight: 700; letter-spacing: -.024em; }
.pzln-auth__panel > p { color: var(--pz-text-3); }
.pzln-auth__help { display: inline-block; margin-top: 18px; font-size: 13px; font-weight: 600; color: var(--pz-text-2); text-decoration: underline; text-underline-offset: 3px; }

/* ------------------------------------------------- Blocos ainda em uso ----- */

.pzln-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; }
.pzln-field--wide { grid-column: span 2; }
.pzln-fields--files { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pzln-edit-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; padding: 16px 18px; }
.pzln-edit-grid__wide { grid-column: 1 / -1; }

.pzln-notification-list { display: grid; }
.pzln-notification {
  display: grid;
  grid-template-columns: 125px 1fr;
  gap: 16px;
  padding: 14px 18px;
  border-top: 1px solid var(--pz-divider);
  text-decoration: none;
}
.pzln-notification:first-child { border-top: 0; }
.pzln-notification time { color: var(--pz-text-3); font-size: 12px; }
.pzln-notification span { display: block; margin-top: 3px; color: var(--pz-text-3); }
.pzln-notification.is-unread { background: var(--pz-orange-050); box-shadow: inset 3px 0 var(--pz-orange-500); }

/* Relatorios */
.pzln-report-builder { padding: 18px; }
/* SEIS COLUNAS FIXAS DE 130px SAO 840px QUE NEM SEMPRE EXISTEM.
 *
 * repeat(6, minmax(130px, 1fr)) nao e um minimo por coluna: e um minimo
 * para a grelha inteira. Entre os 900px e os 1199px de janela — com a barra
 * lateral aberta, portanto um portatil normal — a grelha ficava mais larga
 * do que o painel e era CORTADA por ele. Medido: a 1000px sobravam 193px
 * de grelha do lado de fora, e o documento nem sequer ganhava scroll, por
 * isso os ultimos filtros (Matricula, Parceiro, Dados, Pre-visualizar)
 * deixavam de existir para quem estava a olhar.
 *
 * auto-fit conta as colunas que cabem em vez de exigir seis. Acima dos
 * 1200px o resultado e o mesmo de sempre; abaixo, quebra de linha em vez de
 * corte. */
.pzln-report-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 12px; align-items: end; }
.pzln-report-steps label b {
  display: inline-grid;
  place-items: center;
  width: 19px; height: 19px;
  margin-right: 6px;
  border-radius: var(--pz-r-xs);
  background: var(--pz-navy-800);
  color: #fff;
  font-size: 10px;
}
.pzln-report-preview {
  display: grid;
  grid-template-columns: 170px minmax(260px, 1fr) auto;
  gap: 20px;
  align-items: center;
  margin-top: 18px;
  padding: 18px;
  border: 1px solid var(--pz-attention-bd);
  border-radius: var(--pz-r-md);
  background: var(--pz-grad-attention);
}
.pzln-report-preview > div:first-child span,
.pzln-report-preview > div:first-child strong,
.pzln-report-preview > div:first-child small { display: block; }
.pzln-report-preview > div:first-child strong { font-size: 32px; font-weight: 700; letter-spacing: -.03em; }
.pzln-report-preview p { margin: 0; color: var(--pz-text-3); }
/* A 768px estas duas colunas de accao (PDF e Excel) eram espremidas para 52px
 * cada uma — estreitas de mais para o proprio rotulo de uma coluna caber la
 * dentro, quanto mais para se carregar no botao. Quebram de linha em vez de
 * encolher, e cada uma fica com largura utilizavel. */
.pzln-report-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.pzln-report-actions form { margin: 0; flex: 1 1 190px; min-width: 0; }
.pzln-report-content {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--pz-border);
  border-radius: var(--pz-r-md);
  background: var(--pz-surface);
}
.pzln-report-content summary { cursor: pointer; font-weight: 600; }
/* O selector de colunas vive dentro de um item flex estreito (cada formato
 * tem o seu). Duas colunas de 150px sao 300px que esse item nao tem: a lista
 * saia por fora ao abrir. auto-fit usa o que houver — duas colunas quando ha
 * espaco, uma quando nao ha — e o min(140px, 100%) deixa essa unica coluna
 * encolher abaixo dos 140px quando o proprio item e mais estreito do que isso,
 * que e o caso medido: 115px de contentor contra 140px de minimo. */
.pzln-report-content > div { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(140px, 100%), 1fr)); gap: 7px 14px; margin-top: 10px; }
.pzln-report-content label { font-size: 13px; }
.pzln-report-audience {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 14px 0;
  padding: 12px 14px;
  border-radius: var(--pz-r-md);
  background: var(--pz-surface-2);
}
/* "Versão do ficheiro" e um rotulo comprido ao lado de um select comprido:
 * a 390px os dois lado a lado nao cabiam e transbordavam o painel. Quebram. */
.pzln-report-audience label { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 9px; font-weight: 600; }
.pzln-report-audience select { max-width: 100%; }
.pzln-report-audience small { color: var(--pz-text-3); }
.pzln-report-advanced { margin: 12px 0; }
.pzln-report-advanced summary { cursor: pointer; font-weight: 600; }
.pzln-report-advanced form { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; margin-top: 10px; }
.pzln-report-advanced label { display: grid; gap: 5px; font-weight: 600; }
.pzln-report-advanced input { min-width: 170px; }
.pzln-report-periods { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.pzln-report-periods a {
  padding: 6px 12px;
  border: 1px solid var(--pz-border);
  border-radius: var(--pz-r-full);
  background: var(--pz-surface);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}
.pzln-report-periods a:hover { background: var(--pz-surface-2); }

/* ------------------------------------------------------------- Responsivo - */

@media (max-width: 1200px) {
  .pzln-filterbar { grid-template-columns: repeat(3, minmax(150px, 1fr)); }
  .pzln-fields, .pzln-edit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  .pzln-app { display: block; }
  .pzln-sidebar {
    position: fixed;
    left: 0; top: 0;
    width: min(288px, 86vw);
    transform: translateX(-105%);
    transition: transform .22s ease;
  }
  .pzln-sidebar.is-open { transform: none; box-shadow: var(--pz-shadow-md); }
  .pzln-menu-toggle {
    display: inline-grid;
    place-items: center;
    width: 38px; height: 38px;
    padding: 0;
    border: 1px solid var(--pz-border);
    border-radius: var(--pz-r-md);
    background: var(--pz-surface);
    cursor: pointer;
  }
  .pzln-menu-toggle svg { width: 18px; height: 18px; }
  .pzln-content { padding: 18px 16px 48px; }
  .pzln-auth { grid-template-columns: 1fr; }
  .pzln-auth__brand { min-height: 32vh; padding: 32px; }
  .pzln-auth__panel { padding: 32px; }
}

@media (max-width: 680px) {
  .pzln-topbar { height: 56px; padding: 0 14px; gap: 10px; }
  .pzln-content { padding: 14px 12px 44px; }
  .pzln-page-head { display: block; }
  .pzln-page-head h1 { font-size: 22px; }
  .pzln-page-head__actions { margin-top: 14px; flex-wrap: wrap; }
  .pzln-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pzln-filterbar { grid-template-columns: 1fr; }
  .pzln-check--filter { padding-top: 0; }
  .pzln-table thead { display: none; }
  .pzln-table, .pzln-table tbody, .pzln-table tr, .pzln-table td { display: block; width: 100%; }
  .pzln-table tr { padding: 10px 14px; border-top: 1px solid var(--pz-border); }
  .pzln-table tbody tr:first-child { border-top: 0; }
  .pzln-table td { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 8px; padding: 4px 0; border: 0; }
  .pzln-table td::before {
    content: attr(data-label);
    color: var(--pz-text-3);
    font-size: 11px;
    font-weight: 600;
  }
  .pzln-table td:first-child:not([data-label]) { display: block; }
  .pzln-table tr.is-priority td:first-child { box-shadow: none; }
  /* Cada linha vira um cartão, não uma ficha de seis campos. A referência é o
     título (sem rótulo), o estado e a próxima ação ficam à vista, e o resto
     encolhe para uma linha de contexto. Seis pares rótulo/valor por processo
     davam um scroll interminável para dizer o mesmo. */
  .pzln-table td[data-label="Referência"],
  .pzln-table td[data-label="Processo"] { display: block; margin-bottom: 2px; }
  .pzln-table td[data-label="Referência"]::before,
  .pzln-table td[data-label="Processo"]::before { display: none; }
  .pzln-table td[data-label="Referência"] strong,
  .pzln-table td[data-label="Processo"] strong { font-size: 14.5px; }
  .pzln-table td[data-label="Estado"],
  .pzln-table td[data-label="Próxima ação"],
  .pzln-table td[data-label="Porquê"],
  .pzln-table td[data-label="O que falta"] { grid-template-columns: 92px minmax(0, 1fr); }
  .pzln-table td[data-label="Parceiro"],
  .pzln-table td[data-label="Viatura"],
  .pzln-table td[data-label="Há quanto tempo"],
  .pzln-table td[data-label="Atualizado"] {
    display: inline-flex;
    width: auto;
    gap: 5px;
    padding: 2px 0 0;
    color: var(--pz-text-3);
    font-size: 12px;
  }
  .pzln-table td[data-label="Parceiro"]::before,
  .pzln-table td[data-label="Viatura"]::before,
  .pzln-table td[data-label="Há quanto tempo"]::before,
  .pzln-table td[data-label="Atualizado"]::before { display: none; }
  .pzln-table td[data-label="Viatura"]::after,
  .pzln-table td[data-label="Parceiro"]::after { content: "·"; margin-left: 5px; color: var(--pz-border-strong); }
  .pzln-table td[data-label="Viatura"] strong,
  .pzln-table td[data-label="Viatura"] span { display: inline; font-size: 12px; font-weight: 400; }
  .pzln-fields, .pzln-fields--files, .pzln-edit-grid { grid-template-columns: 1fr; }
  .pzln-field--wide { grid-column: auto; }
  .pzln-timeline li { grid-template-columns: 84px 12px minmax(0, 1fr); }
  /* Seis separadores nao cabem em 390px. Rolam, com margem a direita para se
     ver que ha mais — cortados a meio pareciam partidos. */
  .pzln-tabs {
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .pzln-tabs::-webkit-scrollbar { display: none; }
  .pzln-tabs a { flex: none; }
  .pzln-tabs::after { content: ""; flex: none; width: 12px; }
  /* O cabecalho do painel deixa de ser uma linha: o titulo e a nota lado a lado
     em 390px davam "Dados / identificados" partido em duas com o texto por
     cima. */
  .pzln-panel__head { flex-direction: column; align-items: flex-start; gap: 6px; }
  .pzln-panel__head > a, .pzln-panel__head small { align-self: flex-start; }
  .pzln-notification { grid-template-columns: 1fr; gap: 4px; }
  .pzln-report-steps, .pzln-report-preview { grid-template-columns: 1fr; }
  .pzln-report-actions { flex-wrap: wrap; }
  /* No telemóvel a marca é um cabeçalho, não meio ecrã: o formulário tem de
     estar visível sem rolar. 32vh de navy empurrava o campo do email para
     baixo da dobra e a primeira coisa a fazer no portal ficava escondida. */
  /* Linhas explicitas: a marca ocupa o que precisa, o formulario fica com o
     resto. Sem isto, num ecra alto a grelha distribuia a altura em partes
     iguais e o navy voltava a comer meio telemovel. */
  .pzln-auth { min-height: 100dvh; grid-template-rows: auto 1fr; }
  .pzln-auth__brand { min-height: 0; padding: 22px 24px 20px; justify-content: flex-start; }
  .pzln-auth__brand p { display: none; }
  .pzln-auth__brand h1 { font-size: 26px; }
  .pzln-auth__wordmark { width: 132px; height: 34px; margin-bottom: 12px; }
  .pzln-auth__logo { height: 28px; margin-bottom: 12px; }
  .pzln-auth__panel { justify-content: flex-start; padding: 26px 24px 40px; }
  .pzln-stepper { padding: 0; }
  .pzln-step { min-width: 118px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; }
}

/* ------------------------------------------------------- Wordmark da marca
   Embutido no CSS de proposito: o CDN do alojamento recusa PNG servido a
   partir da pasta do plugin (422 "Invalid source image"), e a assinatura da
   marca nao pode depender de um otimizador de imagens de terceiros. Fica
   tambem um pedido HTTP a menos numa peca que aparece em todas as paginas.  */
.pzln-wordmark {
  display: block;
  width: 118px;
  height: 30px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: contain;
}
.pzln-wordmark--light { background-image: url("data:image/png;base64,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"); }
.pzln-wordmark--dark { background-image: url("data:image/png;base64,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"); }

/* =========================================================================
   Conta, organizacao e decisoes — componentes partilhados pelos dois portais

   Tudo o que esta aqui obedece as mesmas regras do resto da V4: quase
   monocromatico, contorno em vez de sombra, radius contido, e Signal so
   quando ha MOVIMENTO OPERACIONAL — um pedido por decidir, um convite por
   aceitar. Nada disto introduz uma estetica de "administracao": se
   escondermos a barra lateral, estas paginas continuam a ser o mesmo produto.
   ========================================================================= */

/* --- Menu da conta, no cabecalho ---------------------------------------
   <details>/<summary> em vez de JavaScript: abre e fecha com teclado, fecha
   com ESC, e nao ha estado nosso para se dessincronizar. */
.pzln-account { position: relative; margin-left: auto; }
.pzln-account > summary {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 8px 5px 5px;
  border: 1px solid transparent;
  border-radius: var(--pz-r-full);
  color: var(--pz-text-2);
  cursor: pointer;
  list-style: none;
  user-select: none;
}
.pzln-account > summary::-webkit-details-marker { display: none; }
.pzln-account > summary:hover { border-color: var(--pz-border); background: var(--pz-surface-2); }
.pzln-account > summary:focus-visible { outline: none; box-shadow: var(--pz-focus); }
.pzln-account__avatar {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: var(--pz-r-full);
  background: var(--pz-ink-800);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .02em;
}
.pzln-account__name {
  max-width: 168px;
  overflow: hidden;
  font-size: 13px;
  font-weight: 550;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pzln-account__caret { color: var(--pz-text-4); transition: transform .12s ease; }
.pzln-account[open] .pzln-account__caret { transform: rotate(180deg); }
.pzln-account__menu {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 60;
  min-width: 248px;
  padding: 6px;
  border: 1px solid var(--pz-border);
  border-radius: var(--pz-r-lg);
  background: var(--pz-surface);
  box-shadow: var(--pz-shadow-md);
}
.pzln-account__id { padding: 9px 10px 11px; border-bottom: 1px solid var(--pz-divider); margin-bottom: 5px; }
.pzln-account__id strong { display: block; font-size: 13.5px; color: var(--pz-text); }
.pzln-account__id small { display: block; margin-top: 2px; font-size: 11.5px; color: var(--pz-text-3); word-break: break-all; }
.pzln-account__menu a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 10px;
  border-radius: var(--pz-r-sm);
  color: var(--pz-text-2);
  font-size: 13.5px;
  text-decoration: none;
}
.pzln-account__menu a svg { color: var(--pz-text-4); }
.pzln-account__menu a:hover { background: var(--pz-surface-3); color: var(--pz-text); }
.pzln-account__menu a:hover svg { color: var(--pz-text-2); }
.pzln-account__out { margin-top: 4px; border-top: 1px solid var(--pz-divider); border-radius: 0 0 var(--pz-r-sm) var(--pz-r-sm); padding-top: 11px !important; }

/* --- Menu secundario "⋯" nas listas ------------------------------------ */
.pzln-more { position: relative; display: inline-block; }
.pzln-more > summary {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 1px solid transparent;
  border-radius: var(--pz-r-sm);
  color: var(--pz-text-3);
  font-size: 15px;
  line-height: 1;
  cursor: pointer;
  list-style: none;
}
.pzln-more > summary::-webkit-details-marker { display: none; }
.pzln-more > summary:hover { border-color: var(--pz-border); background: var(--pz-surface-2); color: var(--pz-text); }
.pzln-more > summary:focus-visible { outline: none; box-shadow: var(--pz-focus); }
.pzln-more__menu {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  z-index: 50;
  min-width: 190px;
  padding: 5px;
  border: 1px solid var(--pz-border);
  border-radius: var(--pz-r-md);
  background: var(--pz-surface);
  box-shadow: var(--pz-shadow-md);
  text-align: left;
}
.pzln-more__menu a,
.pzln-more__menu button {
  display: block;
  width: 100%;
  padding: 8px 10px;
  border: 0;
  border-radius: var(--pz-r-xs);
  background: none;
  color: var(--pz-text-2);
  font: inherit;
  font-size: 13px;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}
.pzln-more__menu a:hover,
.pzln-more__menu button:hover { background: var(--pz-surface-3); color: var(--pz-text); }
.pzln-more__menu form { margin: 0; }
/* O unico vermelho destas listas, e so para o que e mesmo destrutivo. */
.pzln-more__danger { color: var(--pz-danger-fg) !important; }
.pzln-more__danger:hover { background: var(--pz-danger-bg) !important; }

/* --- Estado humano de um membro ---------------------------------------- */
.pzln-state {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  color: var(--pz-text-2);
  white-space: nowrap;
}
.pzln-state::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--pz-neutral-ac);
}
.pzln-state--active::before { background: var(--pz-success-ac); }
.pzln-state--disabled::before { background: var(--pz-text-4); opacity: .5; }
/* Convite por aceitar E movimento operacional: alguem tem de fazer algo. */
.pzln-state--invite_pending::before { background: var(--pz-orange-500); }
.pzln-state--invite_expired::before { background: var(--pz-blocked-ac); }

/* --- Grelha de capacidades --------------------------------------------- */
.pzln-table__cap { text-align: center; }
.pzln-table__cap span[title] { font-size: 11.5px; font-weight: 500; }
.pzln-cap { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: var(--pz-r-xs); }
.pzln-cap--on { background: var(--pz-surface-3); color: var(--pz-text); }
.pzln-cap--off { color: var(--pz-text-4); }
.pzln-table__actions { text-align: right; white-space: nowrap; }
.pzln-muted { color: var(--pz-text-4); font-size: 12.5px; }

/* --- Painel com movimento operacional ----------------------------------
   A barra de 2px a esquerda e o unico Signal do painel. Nao ha fundo
   laranja: um bloco de cor por cima do painel roubava a atencao ao que
   importa, que e a decisao. */
.pzln-panel--signal { border-left: 2px solid var(--pz-orange-500); }

/* --- Pedidos por decidir ------------------------------------------------ */
.pzln-decisions { display: flex; flex-direction: column; }
.pzln-decision {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(0, 2fr) auto;
  gap: 18px;
  align-items: center;
  padding: 14px 18px;
  border-top: 1px solid var(--pz-divider);
}
.pzln-decision:first-child { border-top: 0; }
.pzln-decision__id a { color: var(--pz-text); text-decoration: none; }
.pzln-decision__id a:hover { text-decoration: underline; }
.pzln-decision__id strong { display: block; font-size: 14px; }
.pzln-decision__id span { display: block; margin-top: 2px; color: var(--pz-text-3); font-size: 12.5px; }
.pzln-decision__why p { margin: 0; font-size: 13px; color: var(--pz-text-2); }
.pzln-decision__note { margin-top: 3px !important; color: var(--pz-text-3) !important; }
.pzln-decision__why small { display: block; margin-top: 5px; color: var(--pz-text-4); font-size: 11.5px; }
.pzln-decision__actions { display: flex; gap: 8px; justify-content: flex-end; }
.pzln-decision__actions form { margin: 0; }

/* --- Nota em linha ------------------------------------------------------ */
.pzln-inline-note {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 12px 0 0;
  padding: 10px 12px;
  border: 1px solid var(--pz-border);
  border-radius: var(--pz-r-md);
  background: var(--pz-surface-2);
  color: var(--pz-text-2);
  font-size: 12.5px;
}
.pzln-inline-note svg { flex: none; margin-top: 1px; color: var(--pz-text-4); }

/* --- Estado vazio com titulo proprio ------------------------------------ */
.pzln-empty h2, .pzln-empty h3 { margin: 0 0 6px; font-size: 15px; color: var(--pz-text); }
.pzln-empty p { margin: 0; color: var(--pz-text-3); font-size: 13px; }

.pzln-auth__hint { margin: -4px 0 4px; color: var(--pz-text-3); font-size: 12px; }

@media (max-width: 720px) {
  .pzln-account__name { display: none; }
  .pzln-account__menu { min-width: 232px; }
  .pzln-decision { grid-template-columns: 1fr; gap: 10px; }
  .pzln-decision__actions { justify-content: flex-start; }
}
/* --- Resumo de capacidades numa linha ---------------------------------- */
.pzln-caps { display: flex; flex-wrap: wrap; gap: 4px; }
.pzln-caps__item,
.pzln-caps__more {
  display: inline-block;
  padding: 2px 8px;
  border: 1px solid var(--pz-border);
  border-radius: var(--pz-r-full);
  background: var(--pz-surface-2);
  color: var(--pz-text-2);
  font-size: 11.5px;
  white-space: nowrap;
}
.pzln-caps__more { border-style: dashed; color: var(--pz-text-3); }

/* Um campo desactivado tem de PARECER desactivado. No convite, o email vinha
   com a mesma moldura dos campos editáveis e as pessoas tentavam escrevê-lo. */
.pzln-form input:disabled,
.pzln-form textarea:disabled,
.pzln-form select:disabled {
  background: var(--pz-surface-3);
  border-color: var(--pz-border);
  color: var(--pz-text-3);
  cursor: not-allowed;
}

/* Tabelas largas rolam dentro do painel em vez de serem cortadas por ele. */
.pzln-table-wrap { overflow-x: auto; }
/* Endereços de email não têm espaços: sem isto empurram a linha para fora do
   ecrã a 390px e a coluna seguinte desaparece. */
.pzln-table__mail { overflow-wrap: anywhere; word-break: break-word; }
/* --- Pontos de regresso -------------------------------------------------
   Voltar de um POST tem de devolver a pessoa ao sitio onde estava. O servidor
   reconstrói o contexto e o URL traz a âncora como fragmento; falta garantir
   que o elemento não fica escondido debaixo da barra fixa de 58px — sem isto o
   browser rola até ao alvo e a barra tapa-o, que na prática é o mesmo que ter
   perdido a posição.
   -------------------------------------------------------------------------- */
[id^="campo-"],
[id^="conflito-"],
[id^="grupo-"],
[id^="doc-"] {
  scroll-margin-top: 76px;
}

/* Acção sobre a leitura de um ficheiro (parar / tentar de novo). Discreta: é
   uma saída, não uma chamada de atenção. */
.pzln-file__ocr-action {
  padding: 2px 8px;
  border: 1px solid var(--pz-border);
  border-radius: var(--pz-r-sm);
  background: transparent;
  color: var(--pz-text-3);
  font-size: 11.5px;
  cursor: pointer;
  white-space: nowrap;
}
.pzln-file__ocr-action:hover { border-color: var(--pz-border-strong); color: var(--pz-text); }
.pzln-file__ocr-action:focus-visible { outline: 2px solid var(--pz-signal); outline-offset: 1px; }

/* ---------------------------------------------- Um botão que está a trabalhar
   Não há barra de percentagem em lado nenhum: não sabemos quanto falta, e
   inventá-lo era mentir. Só uma roda que gira e a frase do que se está a
   fazer. O véu aparece passado quase um segundo — antes disso a transição
   ainda parece imediata e um véu só piscava.                                */
.pzln-spinner {
  display: inline-block;
  width: 13px;
  height: 13px;
  flex: 0 0 auto;
  border: 2px solid currentColor;
  border-top-color: transparent;
  border-radius: 50%;
  animation: pzln-rodar .7s linear infinite;
  opacity: .85;
}
@keyframes pzln-rodar { to { transform: rotate(360deg); } }

.pzln-veu {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(22, 25, 30, .28);
  backdrop-filter: blur(1.5px);
}
.pzln-veu__caixa {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  max-width: 100%;
  padding: 13px 18px;
  border: 1px solid var(--pz-border);
  border-radius: var(--pz-r-md);
  background: var(--pz-surface);
  color: var(--pz-text);
  font-size: 13.5px;
  font-weight: 600;
  box-shadow: var(--pz-shadow-md);
}

/* Um botão ocupado continua legível: não se apaga, fica só claramente inerte. */
.pzln-button[disabled] { cursor: default; opacity: .82; }
form[aria-busy="true"] .pzln-button[disabled] { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  .pzln-spinner { animation-duration: 2.4s; }
  .pzln-veu { backdrop-filter: none; }
}

/* ------------------------------------------- A fila de leitura, depois do envio
   Aparece por cima do processo enquanto o browser lê os documentos que já
   estão guardados. Não é um bloqueio: é um aviso de que há trabalho a decorrer
   sobre coisas que já estão em segurança.                                    */
.pzo-autoread {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 14px;
  padding: 10px 14px;
  border: 1px solid var(--pz-border);
  border-left: 3px solid var(--pz-signal);
  border-radius: var(--pz-r-md);
  background: var(--pz-surface-2);
}
.pzo-autoread__state {
  margin: 0;
  font-size: 13px;
  color: var(--pz-text);
}
/* A RODA VIVE DO ESTADO, NÃO DA EXISTÊNCIA DO ELEMENTO.
 *
 * Estava presa ao próprio bloco: enquanto o bloco existisse na página, a roda
 * girava — incluindo depois de a leitura ter acabado e de a mesma linha já
 * dizer "Leitura concluída". Girar depois do trabalho feito não é um detalhe
 * visual: é a página a afirmar que ainda está a processar quando não está.
 *
 * Agora só gira com `aria-busy="true"`, que é escrito quando a fila arranca de
 * facto e apagado em TODOS os fins — leu, não deu nada, não conseguiu ler,
 * está outro separador a ler, não há motor. Sem JavaScript nunca chega a
 * arrancar, e por isso nunca aparece roda nenhuma. */
.pzo-autoread::before {
  content: "";
  flex: 0 0 auto;
  width: 13px;
  height: 13px;
  border: 2px solid var(--pz-border-strong, var(--pz-border));
  border-radius: 50%;
}
.pzo-autoread[aria-busy="true"]::before {
  border-color: var(--pz-signal);
  border-top-color: transparent;
  animation: pzln-rodar .7s linear infinite;
}
