/* =====================================================================
   SYNAPSIS — TOKENS BASE (partilhado por todas as páginas)
   Fonte de verdade: Design System "Synapsis" (tokens.json).
   Para mudar de paleta basta alterar o atributo no <html>:
     <html lang="pt-PT" data-tema="azulejo">   (por defeito)
     <html lang="pt-PT" data-tema="ameixa">
     <html lang="pt-PT" data-tema="pinhal">
   Só mudam --accent, --accent-hover e --accent-tint.
   Regra: o accent é só de interface; nunca é cor de série num gráfico.
===================================================================== */
:root{
  /* neutros quentes */
  --surface:#faf8f4; --surface-raised:#ffffff; --surface-sunken:#f1eee7;
  --ink:#1f1d1a; --ink-muted:#4a463f; --ink-subtle:#6b665d;
  --border:#d9d4ca; --border-strong:#8c867b;
  /* accent (tema Azulejo) */
  --accent:#2347a6; --accent-hover:#1a3786; --accent-tint:#e6ebf7; --on-accent:#ffffff;
  --focus-ring:#1f1d1a;
  /* estados: sempre cor + ícone + texto */
  --success:#1e6b3a; --success-tint:#e4f1e8;
  --warning:#8a5a00; --warning-tint:#f6ecd6;
  --error:#b3261e;   --error-tint:#f8e3e1;
  --info:#3d4a57;    --info-tint:#e8ecf0;
  /* dados (Okabe-Ito): contorno de 1px em --ink-muted e rótulo direto obrigatórios */
  --data-1:#0072b2; --data-2:#d55e00; --data-3:#009e73; --data-4:#e69f00;
  --data-5:#56b4e9; --data-6:#cc79a7; --data-7:#f0e442; --data-8:#000000;
  --data-neutral:#8c867b;
  /* espaçamento, raios, elevação */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px;
  --space-5:24px; --space-6:32px; --space-7:48px; --space-8:64px;
  --radius-sm:4px; --radius-md:8px; --radius-full:9999px;
  --shadow-1:0 1px 2px rgba(31,29,26,.10);
  --shadow-2:0 4px 12px rgba(31,29,26,.14);
  /* tipografia */
  --font-serif:"Satoshi","General Sans",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;   /* títulos (nome mantido por compatibilidade) */
  --font-sans:"General Sans",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
}
html[data-tema="ameixa"]{--accent:#6a3a8c;--accent-hover:#542c71;--accent-tint:#efe8f5;}
html[data-tema="pinhal"]{--accent:#1f5c45;--accent-hover:#17483a;--accent-tint:#e3eee8;}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{font-family:var(--font-sans);color:var(--ink);background:var(--surface);font-size:16px;line-height:1.5;}
h1,h2,h3{font-family:var(--font-serif);font-weight:700;letter-spacing:-.015em;}
.brand{font-family:var(--font-serif);font-weight:700;letter-spacing:0;line-height:1;}
/* Wordmark SYNAPSIS (SVG em curvas): herda a cor do texto */
.wm{display:inline-block;height:.72em;width:calc(.72em * 6.382);fill:currentColor;vertical-align:baseline;}
button{font-family:var(--font-sans);cursor:pointer;}
a{color:var(--accent);}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--surface-raised);padding:var(--space-2) var(--space-4);z-index:300;}
.skip-link:focus{left:var(--space-2);top:var(--space-2);}
.icon{width:1em;height:1em;flex:none;vertical-align:-.125em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}

/* ---------- mensagens de estado: ícone + texto (nunca só cor) ---------- */
.error::before,.gate-error::before,.auth-error::before,.delete-error::before,.aviso::before,.sucesso::before{
  content:"";display:inline-block;width:1em;height:1em;margin-right:6px;vertical-align:-.15em;
  background:currentColor;-webkit-mask:var(--ico-alert) center/contain no-repeat;mask:var(--ico-alert) center/contain no-repeat;
}
.sucesso::before{-webkit-mask-image:var(--ico-check);mask-image:var(--ico-check);}
.auth-error.info::before{-webkit-mask-image:var(--ico-info);mask-image:var(--ico-info);}
:root{
  --ico-alert:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l10 18H2z'/%3E%3Cpath d='M12 10v5M12 18v.01'/%3E%3C/svg%3E");
  --ico-check:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12.5l3 3 5-6'/%3E%3C/svg%3E");
  --ico-info:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v6M12 7.5v.01'/%3E%3C/svg%3E");
}


/* =====================================================================
   MOVIMENTO — curto, com função (entrada, hover, foco). Desligado
   por completo se o sistema pedir menos movimento.
===================================================================== */
:root{--ease:cubic-bezier(.2,.7,.2,1);--dur-1:.18s;--dur-2:.45s;--dur-3:.7s;}
@keyframes rise{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:none;}}
@keyframes fade{from{opacity:0;}to{opacity:1;}}
@keyframes grow-x{from{transform:scaleX(0);}to{transform:scaleX(1);}}
@keyframes pop{from{opacity:0;transform:scale(.94);}to{opacity:1;transform:none;}}
.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease);}
.js .reveal.in{opacity:1;transform:none;}
.js .reveal[data-d="1"]{transition-delay:.08s;}
.js .reveal[data-d="2"]{transition-delay:.16s;}
.js .reveal[data-d="3"]{transition-delay:.24s;}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important;transition:none !important;scroll-behavior:auto !important;}
  .js .reveal{opacity:1;transform:none;}
}

/* =====================================================================
   PAINEL DE ENTRADA COM ARTE (login, recuperação de palavra-passe)
   Blocos de cor + filetes, como na capa do design system.
===================================================================== */
.auth-art{position:relative;overflow:hidden;background:var(--accent);color:var(--on-accent);
  display:flex;flex-direction:column;justify-content:flex-end;padding:var(--space-7);}
.auth-art .lines{position:absolute;inset:0;pointer-events:none;
  background-image:repeating-linear-gradient(to bottom,transparent 0,transparent 127px,rgba(255,255,255,.3) 127px,rgba(255,255,255,.3) 128px);
  -webkit-mask-image:linear-gradient(to bottom,#000 0,#000 52%,transparent 66%);mask-image:linear-gradient(to bottom,#000 0,#000 52%,transparent 66%);
  animation:fade 1.2s var(--ease) both;}
.auth-art::before{content:"";position:absolute;right:-24px;top:0;width:176px;height:232px;background:var(--ink);
  border-radius:var(--radius-md);animation:rise .9s var(--ease) .1s both;}
.auth-art::after{content:"";position:absolute;right:96px;top:104px;width:96px;height:96px;background:var(--accent-tint);
  border-radius:var(--radius-md);animation:rise .9s var(--ease) .3s both;}
.auth-art > *{position:relative;z-index:1;}
.auth-art .art-brand{position:absolute;top:var(--space-6);left:var(--space-7);font:700 30px/1 var(--font-serif);color:var(--on-accent);text-decoration:none;}
.auth-art h2{font-size:40px;line-height:44px;margin:0 0 var(--space-3);max-width:14ch;color:var(--on-accent);animation:rise .8s var(--ease) .15s both;}
.auth-art p{margin:0;font-size:16px;line-height:24px;color:var(--accent-tint);max-width:34ch;animation:rise .8s var(--ease) .3s both;}
.auth-split{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;}
.auth-pane{display:flex;align-items:center;justify-content:center;padding:var(--space-6) var(--space-5);}
.auth-card{width:100%;max-width:420px;animation:rise .6s var(--ease) .1s both;}
.auth-card h1{font-size:32px;line-height:38px;margin:0 0 var(--space-2);}
.auth-card .lead{color:var(--ink-muted);margin:0 0 var(--space-5);}
.auth-card label{display:block;font-size:14px;font-weight:600;margin:0 0 6px;}
.auth-card input[type=email],.auth-card input[type=password],.auth-card input[type=text]{
  width:100%;padding:11px 12px;min-height:44px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);
  font:400 16px/24px var(--font-sans);background:var(--surface-raised);color:var(--ink);margin-bottom:var(--space-4);
  transition:border-color var(--dur-1) var(--ease),box-shadow var(--dur-1) var(--ease);}
.auth-card input:hover{border-color:var(--ink-muted);}
.auth-card .password-field{position:relative;margin-bottom:var(--space-4);}
.auth-card .password-field input{margin-bottom:0;padding-right:48px;}
.auth-card .toggle-password{position:absolute;right:4px;top:50%;transform:translateY(-50%);background:none;border:none;
  min-width:40px;min-height:40px;display:flex;align-items:center;justify-content:center;color:var(--ink-muted);border-radius:var(--radius-sm);}
.auth-card .toggle-password:hover{color:var(--ink);}
.auth-card .btn-block{width:100%;min-height:48px;border:none;border-radius:var(--radius-md);background:var(--accent);color:var(--on-accent);
  font:600 15px/20px var(--font-sans);transition:background var(--dur-1) var(--ease),transform var(--dur-1) var(--ease);}
.auth-card .btn-block:hover{background:var(--accent-hover);transform:translateY(-1px);}
.auth-card .btn-block:active{transform:none;}
.auth-card .btn-block:disabled{background:var(--surface-sunken);color:var(--ink-subtle);cursor:not-allowed;transform:none;}
.auth-card .links{margin-top:var(--space-5);font-size:14px;color:var(--ink-muted);}
.auth-card .links a{font-weight:600;}
.auth-card .hint{font-size:14px;color:var(--ink-muted);margin:-8px 0 var(--space-4);}
.msg{display:none;padding:var(--space-3) var(--space-4);border-radius:var(--radius-sm);font-size:14px;margin-bottom:var(--space-4);}
.msg.show{display:block;}
.msg-erro{background:var(--error-tint);color:var(--error);border:1px solid var(--error);}
.msg-ok{background:var(--success-tint);color:var(--success);border:1px solid var(--success);}
.msg-erro::before,.msg-ok::before{content:"";display:inline-block;width:1em;height:1em;margin-right:6px;vertical-align:-.15em;background:currentColor;
  -webkit-mask:var(--ico-alert) center/contain no-repeat;mask:var(--ico-alert) center/contain no-repeat;}
.msg-ok::before{-webkit-mask-image:var(--ico-check);mask-image:var(--ico-check);}
.forgot{display:inline-block;margin:-6px 0 var(--space-4);font-size:14px;font-weight:600;}
@media(max-width:820px){
  .auth-split{grid-template-columns:1fr;}
  .auth-art{min-height:200px;padding:var(--space-5);}
  .auth-art .art-brand{left:var(--space-5);top:var(--space-5);}
  .auth-art h2{font-size:28px;line-height:32px;}
  .auth-art::before{width:120px;height:150px;}
  .auth-art::after{right:60px;top:70px;width:64px;height:64px;}
}

/* ---------- navegação das páginas de administração ---------- */
.admin-nav{display:flex;flex-wrap:wrap;gap:var(--space-2);margin:0 0 var(--space-5);}
.admin-nav a{display:inline-flex;align-items:center;min-height:40px;padding:8px 14px;border-radius:var(--radius-md);
  border:1px solid var(--border-strong);color:var(--ink);text-decoration:none;font-size:14px;font-weight:600;
  background:var(--surface-raised);transition:background var(--dur-1) var(--ease),border-color var(--dur-1) var(--ease);}
.admin-nav a:hover{background:var(--accent-tint);border-color:var(--accent);}
.admin-nav a[aria-current="page"]{background:var(--ink);color:var(--surface);border-color:var(--ink);}
.admin-nav a.alt{background:transparent;border-style:dashed;}
.admin-nav a.alt:hover{background:var(--accent-tint);}
