/**
 * Stili per le schede informative (CCNL, fondi di settore).
 *
 * Usati da:
 *  - field_scheda sul tipo di contenuto "contratti";
 *  - body delle pagine /fopen e /fisde.
 *
 * Palette presa dal tema: verde istituzionale #006d44, testo #454545.
 */

.ccnl-intro,
.fondo-intro {
  font-size: 1.08em;
  line-height: 1.6;
  padding: 16px 20px;
  margin-bottom: 28px;
  border-left: 4px solid #006d44;
  background: #f8f8f8;
  color: #454545;
}

/* Indice ancorato. */
.ccnl-indice,
.fondo-indice {
  margin: 0 0 32px;
  padding: 16px 20px;
  border: 1px solid #ccc;
  background: #fff;
}

.ccnl-indice h2,
.fondo-indice h2 {
  margin: 0 0 12px;
  font-size: 1.15em;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #006d44;
}

.ccnl-indice ul,
.fondo-indice ul {
  margin: 0;
  padding: 0;
  list-style: none;
  columns: 2;
  column-gap: 32px;
}

.ccnl-indice li,
.fondo-indice li {
  margin: 0 0 8px;
  break-inside: avoid;
}

.ccnl-indice a,
.fondo-indice a {
  color: #454545;
  text-decoration: none;
  border-bottom: 1px solid transparent;
}

.ccnl-indice a:hover,
.ccnl-indice a:focus,
.fondo-indice a:hover,
.fondo-indice a:focus {
  color: #006d44;
  border-bottom-color: #006d44;
}

@media (max-width: 700px) {
  .ccnl-indice ul,
  .fondo-indice ul {
    columns: 1;
  }
}

/* I titoli di sezione ricevono uno stacco visibile e lasciano spazio
   all'ancora quando ci si arriva da un link dell'indice.
   L'aggancio è il wrapper .scheda-flaei, che sta DENTRO il contenuto: le
   classi che Drupal genera attorno al campo (field--name-field-scheda) sono
   sovrascrivibili dal tema, questa no. */
.scheda-flaei h2 {
  margin-top: 40px;
  padding-top: 8px;
  border-top: 2px solid #006d44;
  color: #454545;
  scroll-margin-top: 120px;
}

.scheda-flaei h3 {
  margin-top: 28px;
  color: #006d44;
  scroll-margin-top: 120px;
}

/* L'indice non deve avere il filetto verde sopra il proprio titolo. */
.ccnl-indice h2,
.fondo-indice h2 {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

/* Tabelle: leggibili, e mai più larghe dello schermo. */
.ccnl-tabella,
.fondo-tabella {
  width: 100%;
  border-collapse: collapse;
  margin: 20px 0 8px;
  font-size: .95em;
}

.ccnl-tabella caption,
.fondo-tabella caption {
  caption-side: top;
  text-align: left;
  padding: 0 0 8px;
  font-size: .9em;
  font-style: italic;
  color: #454545;
}

.ccnl-tabella th,
.ccnl-tabella td,
.fondo-tabella th,
.fondo-tabella td {
  padding: 8px 10px;
  border: 1px solid #ccc;
  text-align: left;
  vertical-align: top;
}

.ccnl-tabella thead th,
.fondo-tabella thead th {
  background: #006d44;
  color: #fff;
  font-weight: 600;
}

.ccnl-tabella tbody th,
.fondo-tabella tbody th {
  background: #f1f1f1;
  font-weight: 600;
  white-space: nowrap;
}

.ccnl-tabella tbody tr:nth-child(even) td,
.fondo-tabella tbody tr:nth-child(even) td {
  background: #f8f8f8;
}

/* La tabella dei minimi ha sette colonne di numeri: allineati a destra
   e su schermi stretti scorre da sola invece di allargare la pagina. */
.ccnl-tabella--minimi td {
  text-align: right;
  white-space: nowrap;
}

.ccnl-tabella-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: 20px 0;
}

/* Note di fonte e avvertenze. */
.fonte,
.fondo-disclaimer {
  font-size: .88em;
  color: #454545;
  opacity: .85;
}

.fondo-disclaimer {
  margin-top: 36px;
  padding-top: 16px;
  border-top: 1px solid #ccc;
}

/* Il blocco del PDF sotto la scheda, nella pagina del contratto. */
/* Stacco fra la scheda e il testo integrale del contratto.
 *
 * Si applica ai contratti che mostrano l'embed dell'allegato. La pagina del
 * CCNL 2025 fa eccezione e non lo usa: ha il body valorizzato (copertina e
 * pulsanti, blocco .bm-featured), quindi il ramo dell'allegato nel template
 * non si attiva. Li' lo stacco non serve, perche' la scheda si chiude con la
 * propria sezione "Testo integrale del contratto", che ha gia' la riga di
 * separazione: aggiungerne una seconda sopra la copertina produce due
 * separatori a poca distanza (provato e scartato il 13/08/2026). */
.ccnl-testo-integrale {
  margin-top: 40px;
  padding-top: 8px;
  border-top: 2px solid #006d44;
}