/* Token e basi condivise da form e pannello. */
:root {
  color-scheme: light;
  --inchiostro: #1d2840;   /* testo, titoli */
  --inchiostro-soft: #2a3854;
  --grigio: #545d72;       /* testo secondario: 6.4:1 su bianco */
  --pietra: #e6e9ee;       /* sfondo pagina */
  --pietra-scura: #d5dae3;
  --carta: #ffffff;        /* superfici */
  --bordo: #b9c1cd;
  --bordo-tenue: #d8dde5;
  --segnavia: #f2c230;     /* il giallo delle frecce del Cammino: solo come segno, mai come testo */
  --segnavia-tenue: #fdf3cf;
  --timbro: #2c6a4c;       /* confermata */
  --timbro-tenue: #e3f0e8;
  --rifiuto: #9b3a2c;
  --rifiuto-tenue: #f6e4e0;
  --attesa: #3d5a8a;
  --attesa-tenue: #e4eaf4;
  --focus: #1d2840;

  --ombra-soft: 0 1px 2px rgba(29, 40, 64, .05);
  --ombra-media: 0 1px 3px rgba(29, 40, 64, .08);
  --ombra-forte: 0 2px 6px rgba(29, 40, 64, .12);

  --font: 'Atkinson Hyperlegible', 'Segoe UI', system-ui, sans-serif;
  --r-campo: 8px;
  --r-superficie: 12px;
  --transizione: .18s ease;
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--pietra);
  color: var(--inchiostro);
  font-family: var(--font);
  line-height: 1.5;
}

h1, h2, h3 { line-height: 1.15; margin: 0; }

a { color: var(--inchiostro); text-underline-offset: 3px; }

:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
  box-shadow: 0 0 0 6px var(--segnavia);
  border-radius: 4px;
}

.visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* Marchio */
.brand {
  display: flex;
  align-items: center;
  gap: .65rem;
  margin: 0;
  text-decoration: none;
  color: inherit;
}
.brand-mark {
  width: 2.5rem;
  height: 2.5rem;
  flex: 0 0 auto;
  border-radius: 10px;
  display: block;
}
.brand-testi { min-width: 0; }
.brand-nome {
  display: block;
  font-weight: 700;
  font-size: 1.05rem;
  line-height: 1.25;
  letter-spacing: -.01em;
  overflow-wrap: anywhere;
}
.brand-sotto {
  display: block;
  font-size: .78rem;
  font-weight: 400;
  opacity: .78;
  margin-top: .12rem;
  line-height: 1.25;
}
.testata .brand { color: #fff; margin-bottom: 0; }
.testata .brand-sotto { color: #c8d0dc; opacity: 1; }
.brand-compatto { margin: 0 0 .35rem; }
.brand-compatto .brand-mark { width: 2rem; height: 2rem; border-radius: 8px; }
.parrocchia { /* legacy: ora usa .brand-nome sull’home */
  margin: 0;
  font-size: .8rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.3;
}

/* Logo org in header: oggetto cover in box fisso */
.brand-mark[data-logo-ente="1"] {
  object-fit: contain;
  background: #fff;
}
.brand-piede {
  margin: 0;
  color: inherit;
  text-decoration: none;
}
.brand-piede .brand-mark {
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 6px;
}
.piede-portale .brand-piede { margin-top: 0; }
.piede-segreteria {
  margin-top: 2rem;
  padding: 1.25rem 24px 2rem;
  border-top: 1px solid var(--bordo-tenue);
  background: var(--pietra);
}
.piede-segreteria .piede-interno { max-width: 72rem; margin: 0 auto; }

/* Pulsanti */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .4em;
  min-height: 42px; padding: 0 1em;
  border: 1.5px solid var(--inchiostro); border-radius: var(--r-campo);
  background: var(--inchiostro); color: #fff;
  font: inherit; font-weight: 700; cursor: pointer; text-decoration: none;
  transition: background var(--transizione), border-color var(--transizione), transform var(--transizione), box-shadow var(--transizione);
}
.btn:hover { background: var(--inchiostro-soft); border-color: var(--inchiostro-soft); }
.btn:active:not([disabled]) { transform: translateY(1px); }
.btn[disabled] { opacity: .55; cursor: not-allowed; transform: none; }
.btn-secondario { background: var(--carta); color: var(--inchiostro); }
.btn-secondario:hover { background: var(--pietra); border-color: var(--inchiostro); }
.btn-timbro { background: var(--timbro); border-color: var(--timbro); }
.btn-timbro:hover { background: #22563d; border-color: #22563d; }
.btn-timbro[disabled], .btn-timbro[disabled]:hover { background: var(--carta); color: var(--grigio); border-color: var(--bordo-tenue); opacity: 1; }
.btn-rifiuto { background: var(--carta); color: var(--rifiuto); border-color: var(--rifiuto); }
.btn-rifiuto:hover { background: var(--rifiuto-tenue); }
.btn-piccolo { min-height: 32px; padding: 0 .7em; font-size: .85rem; border-width: 1.5px; }

/* Campi */
.campo { margin: 0 0 .9rem; }
.campo > label, .campo > .etichetta, fieldset.scelta > legend {
  display: block; font-weight: 700; margin-bottom: .28rem;
}
.aiuto { display: block; color: var(--grigio); font-size: .86em; margin: 0 0 .3rem; line-height: 1.35; }
input[type=text], input[type=email], input[type=tel], input[type=password], input[type=search],
input[type=url], input[type=number], input[type=date], input[type=datetime-local], input[type=time],
select, textarea {
  width: 100%; min-height: 44px; padding: .45rem .7rem;
  border: 1.5px solid var(--bordo); border-radius: var(--r-campo);
  background: var(--carta); color: var(--inchiostro); font: inherit;
  transition: border-color var(--transizione), box-shadow var(--transizione);
}
textarea { min-height: 5.5rem; resize: vertical; }
/* Spunte e scelte: colore dell'app ovunque. :where() non pesa, così le regole locali (.opzione, .spunta, switch) restano libere. */
:where(input[type=checkbox], input[type=radio]) { width: 1.15rem; height: 1.15rem; accent-color: var(--inchiostro); }
input:hover, select:hover, textarea:hover { border-color: var(--grigio); }
input:focus-visible, select:focus-visible, textarea:focus-visible {
  border-color: var(--inchiostro);
  box-shadow: 0 0 0 3px var(--segnavia-tenue);
}
.campo.errore input, .campo.errore select, .campo.errore textarea,
fieldset.errore .opzione { border-color: var(--rifiuto); }
.messaggio-errore { display: none; color: var(--rifiuto); font-weight: 700; margin: .1rem 0 .4rem; }
.errore > .messaggio-errore, .errore .messaggio-errore { display: block; }

/* Meta footer: copyright, privacy e versione su una riga compatta */
.piede-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: .25rem 1.25rem;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  font-size: .78rem;
  color: var(--grigio);
  line-height: 1.3;
}
.piede-meta > p { margin: 0; }
.piede-meta a {
  font-weight: 700;
  color: var(--inchiostro);
  text-underline-offset: 3px;
}
.piede-meta a:hover { color: var(--inchiostro-soft); }
.piede-versione:empty { display: none; }
.facoltativo { font-weight: 400; color: var(--grigio); }

/* Popup Dati e privacy */
.dialog-privacy {
  border: 1px solid var(--bordo-tenue);
  border-radius: var(--r-superficie);
  padding: 0;
  max-width: min(28rem, calc(100vw - 2rem));
  width: 100%;
  background: var(--carta);
  color: var(--inchiostro);
  box-shadow: var(--ombra-forte);
}
.dialog-privacy::backdrop {
  background: rgba(29, 40, 64, .55);
}
.dialog-privacy-corpo {
  padding: 1.35rem 1.25rem 1.25rem;
}
.dialog-privacy-corpo h2 {
  font-size: 1.25rem;
  margin: 0 0 .85rem;
}
.dialog-privacy-corpo p {
  margin: 0 0 .75rem;
  color: var(--grigio);
  font-size: .98rem;
  line-height: 1.45;
}
.dialog-privacy-corpo p strong { color: var(--inchiostro); }
.dialog-privacy-azioni {
  display: flex;
  justify-content: flex-end;
  margin: 1.1rem 0 0;
  padding-top: .85rem;
  border-top: 1px solid var(--bordo-tenue);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  html { scroll-behavior: auto; }
}