/*****************************************/
/* STILI CONTENUTO: COLORI BORDI E FONTS */
/*****************************************/

/* ARTICOLO */
#article{ background: transparent; letter-spacing: 1px; font-size: 1.1em; font-family: 'Roboto', sans-serif;margin: 0; padding: 0 0 15px; height: auto !important; min-height: 440px; }

/* TITOLI E LINEE */
#article em{ width: 99%; }
/* Titolo della pagina (h1 in #conttitle): nella colonna del testo e nel colore
   del sito. Prima non aveva stile: nero, a filo del bordo sinistro mentre il
   testo ha il 10% di margine. Il viola sul bianco sta a circa 6:1, sopra il
   4.5:1 richiesto anche per il testo normale (WCAG AA). Sulle pagine con
   immagine di testata (sfondo messo in linea da bg_cont.php) resta bianco. */
#conttitle h1{ color: var(--color-accent); font-size: 2em; font-weight: 700; line-height: 1.2; text-align: left; margin: 10px 0 18px; padding: 0 10%; }
#conttitle[style*="background"] h1{ color: #fff; text-shadow: 1px 1px 4px rgba(0,0,0,.8); }
@media only screen and (max-width: 768px){ #conttitle h1{ font-size: 1.6em; margin-bottom: 14px; } }
#article h2{ color: var(--color-accent); font-size: 1.8em; font-weight: 700; line-height: 1.4em; text-align: left;text-transform:uppercase;margin: 0 0 15px; padding: 0 10%; }
#article h3{ color: var(--color-accent); font-size: 1.4em; font-weight: 700; line-height: 1.4em; text-decoration: none;text-transform:uppercase;text-align: left;margin: 25px 0; padding: 0 10%; }
#article h4{ color: var(--color-accent); font-size: 1.2em; font-weight: bold; line-height: 1.2em; text-decoration: none;text-transform:uppercase;text-align: left;margin: 25px 0; padding: 0 10%; }
#article h5{ color: var(--color-accent) !important; font-size: 1.1em; font-weight: bold; line-height: 1.1em;text-transform:uppercase;text-align: left;margin: 25px 0; padding: 0 10%; }
#article h6{ color: var(--color-accent) !important; font-size: 1.1em; font-weight: bold; line-height: 1.0em;text-transform:uppercase;text-align: left;margin: 25px 0; padding: 0 10%; }
#article hr{ color: #0000CC; border-top: none; border-bottom: 1px #ddd solid; border-right: 1px solid #ddd; border-left: none; }

/* PARAGRAFO */
#article p{background:transparent;font-size:1em;line-height:1.5em;text-align:justify;margin:5px 10% 0;padding:5px 0 5px;}
#article p strong{font-weight:bolder;}
#article p.disclaimer{font-size:0.7em; line-height: 1.2em; }
#article p.author{font-size: 0.7em; text-align: right; }
#article p.autore{margin: 1px 0; padding-right: 50px; }

/* LINKS */
/* i colori vengono dai token in screen.css (:root), non piu' scritti qui a
   mano: i valori sono gli stessi di prima, cambia solo che ora seguono la
   tavolozza del sito come tutti gli altri elementi. Il fallback dopo la
   virgola tiene il foglio autonomo se caricato senza screen.css. */
#article a{color: var(--color-article-link, #5b34cf); font-weight: 700; text-decoration: none;  }
#article a:hover 	{ color: var(--color-highlight, #c026d3); font-weight: 700; text-decoration: underline;  }
#article .link		{ border-bottom: 2px dashed var(--color-article-link, #5b34cf) }
#article .link		{ padding: 5px 0; clear: left; }
#article .link img	{ border: solid 1px var(--color-accent) }
#article .link img	{ margin: 5px 15px 5px 0; float: left; }
#article .link p	{ }

#article p.button{text-align:right;}
#article p.button a{background:var(--color-accent);color:#fff;padding:15px 35px;text-decoration:none;text-transform:uppercase;}

/* IMMAGINI */
#article img 		{ border: 0px var(--color-accent) solid; }
#article img 		{ max-width: 98%; margin: 5px 5px 0 0; padding: 5px 5px 5px 0; }
#article img.ico{background:transparent;border:none;width:32px;max-width:32px;margin:0;padding:0 1px;vertical-align:middle;}
#article img.ico a{background:transparent;border:none;}
#article img.dx 	{ margin: 5px 0 5px 15px; width: 250px; padding: 5px; float: right; clear: right; }
#article img.dxh	{ margin: 5px 0 5px 15px; height: 250px; padding: 5px; float: right; clear: right; }
#article img.sx 	{ margin: 5px 15px 5px 0; padding: 5px; float: left; clear: left; }

#article img.meteo 	{ margin: 5px 15px 5px 0; padding: 5px; clear: left; max-width: 90%; max-height: 500px; }

/* CITAZIONE */
#article blockquote{font-size:1.4em;background:#efeafd;line-height:1.8em;text-align:justify;margin:5px 10% 0;padding:5px 2%;border-left:solid 30px var(--color-accent);border-right:solid 30px var(--color-accent); }

/* ELENCHI GENERICI */
#article ul{font-size: 1em;list-style-type: none; margin: 5px 0 0; padding: 0 10% 0; }
/* Il pallino degli elenchi era graphics/bg_li.png (16x32, mostrata a 8px).
   Ora e' disegnato: un quadratino con gli angoli smussati nel colore del sito,
   che segue --color-accent invece di essere fissato dentro un file. Sta dentro
   i 20px di padding gia' riservati, quindi il testo non si sposta di un pixel.
   `position: relative` sul li serve al ::before, non cambia il flusso. */
#article ul li{list-style-image: none; margin: 0 0 0 20px; padding: 0 0 0 20px; line-height: 1.5em; position: relative;}
#article ul li::before{content: ""; position: absolute; left: 0; top: .55em; width: 8px; height: 8px; border-radius: 2px; background: var(--color-highlight, #c026d3);}
#article ul ol{font-size: 1em; font-weight: 500;margin: 5px 0 0; }
#article ol ul{font-size: 1em; font-weight: 500;margin: 5px 0 0; }
#article ul ul{font-size: 1em; font-weight: 500;margin: 5px 0 0; }
#article ol ol{font-size: 1em; font-weight: 500;margin: 5px 0 0; }
#article ol{font-size: 1em;line-height:1.5em;font-weight: 500;list-style-type: decimal; margin: 5px 0 0; padding: 0 10% 0;  }
#article ol li{background: transparent;margin-left: 15px; padding-left: 25px; }
#article ol li p{font-size:1em;line-height:1.5em;margin: 0;}
#article ul li p{font-size:1em;line-height:1.5em;margin: 0;}
/* Chi non vuole il pallino, finora lo toglieva con `background: none` sul li:
   funzionava perche' il pallino ERA lo sfondo. Ora che e' uno pseudo-elemento
   quelle regole non bastano piu', quindi lo si spegne qui in un punto solo.
   Sono le liste che non sono elenchi di testo: pulsanti admin, celle di
   tabella, paginazioni e la privacy policy generata da Iubenda. */
#article ul.admin li::before,
#article .admtable ul li::before,
#article li.footable-page::before,
#article li.footable-page-nav::before,
#article nav.admpaging li::before,
#iubenda_policy li::before{content: none;}

/* TABELLA GENERICA */
#article table                  { font-size: 0.9em;width: 95%; }
#article th                     { background: #fff; color: #333; font-weight: bold }
#article td                     { background: #fff; color: #333; border: 1px #fff solid; text-align: left;  }
#article td                     { margin: 5px 3px 5px 3px; padding: 2px 5px 2px 5px; }
#article td p                   { color: #333; font-size: 1em; text-align: left; }
#article td p strong            { color: #333; font-weight: normal; text-align: left; }

/* TABELLA X LISTE */
#article table.items 			{ background: transparent; border: solid 1px var(--color-accent);width: 96%; margin: 0 2%;}
#article table.items th 		{ background: var(--color-accent-strong); color: #FFf; letter-spacing: 2px; font-weight: bold; text-align: center; border: 0px solid var(--color-accent); }
#article table.items th 		{ padding: 5px; }
#article table.items td 		{ color: #fff; background: var(--color-accent); text-align: center; border: 0px solid #fff; }
#article table.items td 		{ padding: 5px; width: 33%; }
#article table.items td a		{ color: #fff; background: transparent; }
#article table.items td.itemlogo 	{ color: #000; background-color: #fff; border: 0px var(--color-accent) solid; text-align: center; }
#article table.items td img 		{ width: 100%; margin: 2px; padding: 0;  }

/* TABELLA X LISTE */
#article table.people 			{ background: transparent; border: solid 0px var(--color-accent);width: 96%; margin: 0 2%;}
#article table.people th 		{ background: transparent; color: #fff; letter-spacing: 2px; font-weight: bold; text-align: center; border: 0px; }
#article table.people th 		{ padding: 5px; }
#article table.people td 		{ color: var(--color-article-link); background: transparent; text-align: left; border: 0px; }
#article table.people td 		{ padding: 5px; }
#article table.people td p		{ margin:0; padding:0; }
#article table.people td a		{ color: var(--color-article-link); background: transparent; }
#article table.people td.img{ width: 20%; margin: 2px; padding: 10px; vertical-align: top; }
#article table.people td img{ width: 95%; margin: 2px; padding: 10px; }

/* ALTRE IMMAGINI SITO */
#article img.preview{display: block; margin: 5px 10px 5px 0; padding: 0; width: 450px; height: 318px; border: solid 1px #663 }
#article img.data{margin: 0px 10px -10px 0px; border: 0px none}

/* NEWS */
#article hr                             { clear: left; color: #999; }
#article img.news                       { margin: 5px 5px 5px 0px; width: 150px; padding: 5px; float: left; border-right: 1px var(--color-accent) solid; }
#article .newslist                      { display: inline-block; width: 80%; margin:0;padding:0 10%;}

#article #ansaidx{float:right;width:19%;font-size:0.8em;margin:0;padding:0 3%;}
#article #ansanws{width:69%;margin:0;padding:0 3%;}

/* Contenitore dello slider della home (markup .aw-slider, vedi
   moduli/[home]/slider.php + jq-home.php). Le regole .nivoSlider /
   .nivo-caption / .nivo-controlNav che stavano qui sono state rimosse:
   nessuno genera piu' quel markup da quando lo slider e' stato riscritto. */
#article #wrapper                       { background: transparent; }
#article #wrapper                       { float: left; width: 100%; min-height: 300px; margin: 15px 0px 10px; }

#article #post_holder p.inactive{ background: #ccc; }

/* VIDEO GALLERY */
#article #videogal iframe{padding:0;padding:0 5%;min-height:300px;}

/* AMMINISTRAZIONE
   Il blocco che stava qui (undici regole con i bg_adm_*.png, piu' geometria e
   colori del pulsante scritti a mano con #00aa00) e' passato al framework, in
   css/awvIcons.css: le icone sono SVG usate come maschera, quindi prendono da
   sole il colore del sito, e stanno in un posto solo per tutti i progetti.
   Il foglio del FW e' linkato dal <head> di index.php e content.php, prima di
   questo, cosi' quel che resta qui sotto ha comunque l'ultima parola.
   Il colore dei pulsanti si governa da --awv-admin-bg (vedi :root in
   screen.css); se non c'e', il FW ripiega su --color-accent. */

/* Il linkino di modifica testo che get_text() infila dentro l'etichetta del
   pulsante quando si e' redattori: non e' un pulsante, resta testo. */
#article ul.admin li a.text     { color: #333; background: transparent; }
#article ul.admin li a.text     { display: inline; padding: 0; margin: 0; }

#article table.browser              { width: 100%; }
#article table.browser th           { padding: 0 3px; }
#article table.browser td           { padding: 5px 8px 0 8px; }
#article table.browser td.action    { width: 24px; }
#article table.browser img a        { margin: 0; padding: 0; width: 50px }

/* TABELLE DI GESTIONE (BROWSE) */
.admtable{ width: 94% !important; margin: 0 3%; font-family: "Open Sans", Arial, Helvetica, sans-serif; border-color: #888; }
.admtable input[type="checkbox"]{ width: auto !important; height: auto !important; }
.admtable ul{ font-size: 14px !important; }
.admtable th{ line-height:2.2em !important;font-size:1.2em !important;color:#fff !important;background:var(--color-accent-strong) !important;}
.admtable tr{border-bottom: 2px solid #ddd !important;}
.admtable td{border: 2px solid #ddd !important;}
.admtable ul li{background:transparent!important}
/*.admtable td{text-align:center !important;}*/

.admtable tr.footable-filtering{padding:10px 30px;border:1px solid #777 !important;}
.footable-pagination-wrapper{ text-align: center !important; }
li.footable-page            { display: none !important; background: transparent !important;}
li.footable-page.visible    { display: inline !important; padding: 0 !important; background: transparent !important; }
li.footable-page-nav        {  background: transparent !important; }

.admtable-odd               { background-color: #f7f7f7; }

.sort-actions{ white-space: nowrap; text-align: center !important; }
.sort-btn{
    display: inline-flex; align-items: center; justify-content: center;
    width: 28px; height: 28px; margin: 0 2px;
    border-radius: 4px; background: #f1edfc; color: var(--color-accent-strong);
    text-decoration: none; vertical-align: middle;
}
.sort-btn svg{ width: 16px; height: 16px; fill: currentColor; }
.sort-btn:hover, .sort-btn:focus{ background: var(--color-accent, #6a3fd9); color: #fff; }
.sort-btn:focus-visible{
    outline: 2px solid var(--color-focus-outline, #1a73e8);
    outline-offset: 2px;
}

/* Icone azione nelle tabelle admin (awv-table): modifica/elimina/storico/
   aggiungi/attiva. Stesso linguaggio visivo di .sort-btn. */
.awv-actions{ white-space: nowrap; display: inline-flex; gap: 2px; }
.awv-action{
    display: inline-flex; align-items: center; justify-content: center;
    width: 28px; height: 28px;
    border-radius: 4px; background: #eef2f6; color: #666;
    text-decoration: none; vertical-align: middle;
}
/* Solo la misura: fill e stroke se li porta dietro l'SVG, con uno style inline
   (functions/adminIcons.php). Qui c'era "fill: currentColor" piu' l'eccezione
   ".awv-action-history svg { fill: none }" per l'unica icona che era gia' a
   tratto. Dal 2026-08-25 sono tutte a tratto e l'eccezione non serve piu'. */
.awv-action svg{ width: 16px; height: 16px; }
.awv-action:focus-visible{
    outline: 2px solid var(--color-focus-outline, #1a73e8);
    outline-offset: 2px;
}
.awv-action-edit:hover, .awv-action-edit:focus     { background: var(--color-focus-outline, #1a73e8); color: #fff; }
.awv-action-delete:hover, .awv-action-delete:focus { background: var(--color-danger, #CC0033); color: #fff; }
.awv-action-history:hover, .awv-action-history:focus { background: #666; color: #fff; }
.awv-action-add:hover, .awv-action-add:focus,
.awv-action-activate:hover, .awv-action-activate:focus { background: var(--color-accent, #6a3fd9); color: #fff; }

.menu-name{ padding-left: calc(var(--menu-depth, 0) * 1.5em) !important; }
.menu-name .tree-connector{
    display: inline-block; margin-right: 4px; color: #888; font-size: 0.9em;
}

#article a.text             { color: #333; background: transparent; }
#article table.browser      { width: 100%; }
#article table.browser		{ font-size: 0.8em; letter-spacing: 0px; border: solid 2px #3B488D; width: 94%; }
#article table.browser th  	{ color: #fff; background: var(--color-accent-strong); line-height: 2.2em; font-size: 1.4em; text-align: center; font-weight: bold; border-bottom: 2px solid #c9bdf5 }
#article table.browser th       { padding: 0 3px; }
#article table.browser tr  	{ border: 2px solid #ddd; }
#article table.browser td  	{ color: #000; background: #fff; text-align: center; vertical-align: middle; border: 2px solid #ddd; }
#article table.browser td       { padding: 5px 8px 0 8px; }
#article table.browser td.action{ width: 24px; }
#article table.browser img a    { color: #000; background: #fff; text-align: center; vertical-align: middle; border: 2px none #b99f8c; width: 50px; }
#article table.browser img a    { margin: 0; padding: 0; width: 50px }

#article #form_post             { }
#article #form_post textarea    { width: 95%; border: solid 2px #bbb; height: 4em; resize: none; }

/* PAGINAZIONE */
ul.pagination{font-size:1.0em !important;line-height:1.0em !important;padding:0 !important;}
ul.simplePagerNav ul.pagination1 li:hover,
ul.pagination2 li:hover,
ul.pagination3 li:hover             { background-color: #FF9500 !important; }
ul.pagination li{margin:0 !important;padding:0 !important;}
ul.pagination1 li,
ul.pagination2 li,
ul.pagination3 li                   { padding: 10px !important; background-color: #8890FC !important; font-size: 1.6em !important; color: #fff !important; width: 600px !important; margin-bottom: 1px !important; list-style: none !important; }

ul.red                              { outline: 10px solid red !important; }

/* ==========================================================================
   NEWS — introduzione (in evidenza + elenco), archivio, pagina singola.
   Nessuna slide/carosello: solo una griglia statica, coerente con lo stile
   già usato per lo slider della home (screen.css per le custom properties).
   ========================================================================== */

.newstop {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1.5em;
    margin: 1.5em 0;
}
.newstop .notizia {
    background: #fff;
    border: 1px solid #e4e7ec;
    border-radius: 12px;
    overflow: hidden;
    transition: box-shadow .15s ease, transform .15s ease;
}
.newstop .notizia:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,.08);
    transform: translateY(-2px);
}
.newstop .notizia img { display: block; width: 100%; height: 160px; object-fit: cover; }
.newstop .notizia p, .newstop .notizia h3 { margin: 0; padding: 0 1em; }
.newstop .notizia p:first-of-type { padding-top: 1em; }
.newstop .notizia small { color: #777; font-size: .82em; }
.newstop .notizia h3 { font-size: 1.1em; margin: .3em 0 1em; }
.newstop .notizia h3 a { color: inherit; text-decoration: none; }
.newstop .notizia h3 a:hover { color: var(--color-highlight, #c026d3); text-decoration: underline; }
.newstop .notizia a:focus-visible {
    outline: 2px solid var(--color-focus-outline, #1a73e8);
    outline-offset: 2px;
}

.newslist { list-style: none; margin: 0 0 1.5em; padding: 0; }
.newslist li {
    padding: .8em 0;
    border-bottom: 1px solid #e4e7ec;
}
.newslist li:last-child { border-bottom: none; }
.newslist small { color: #777; font-size: .85em; }
.newslist a { color: inherit; text-decoration: none; font-weight: 600; }
.newslist a:hover { color: var(--color-highlight, #c026d3); text-decoration: underline; }
.newslist a:focus-visible {
    outline: 2px solid var(--color-focus-outline, #1a73e8);
    outline-offset: 2px;
}

.news-archive-link { margin: 1em 0 2em; }
.news-archive-link a {
    display: inline-block;
    padding: 8px 20px;
    border-radius: 999px;
    background: var(--color-accent, #6a3fd9);
    color: #fff;
    text-decoration: none;
    font-weight: 600;
}
.news-archive-link a:hover { background: color-mix(in srgb, var(--color-accent, #6a3fd9) 82%, black); }
.news-archive-link a:focus-visible {
    outline: 2px solid var(--color-focus-outline, #1a73e8);
    outline-offset: 2px;
}

/* Pagina singola (mono/big.php) */
#newstitle { margin: 0 0 1em; }
#newstitle h2 { margin: .2em 0; }
#newstitle small { color: #777; }
.newsbody { line-height: 1.6; max-width: 70em; }
hr.news { border: none; border-top: 1px solid #e4e7ec; margin: 2em 0; }

/* Paginazione: le regole stanno ora nel framework, css/awvComponents.css,
   linkato dal <head> qui sopra. Erano identiche a quelle del FW e stavano
   qui in copia: la paginazione risultava stilizzata su 2 progetti su 12
   perche' ogni sito doveva copiarsela. Per personalizzarla basta
   ridichiarare le regole qui sotto: questo foglio viene dopo quello del FW
   e a parita' di specificita' vince. */

/*
.my-simple-gallery              { width: 100%; float: left; font-family: Arial; }
.my-simple-gallery img          { width: 100%; height: auto; margin: 0; padding: 0; }
.my-simple-gallery figure       { display: block; float: left;  }
.my-simple-gallery figcaption   { display: none; }
*/

#iubenda_policy ul, 
#iubenda_policy li                  { background: transparent !important; padding: 0 !important; margin: 0 !important; }

/* Codice per SMARTPHONE max 320 px  */
@media only screen and (max-width: 320px) {
    #article h2         { font-size: 1.0em; }
    #article h3         { font-size: 0.9em; }
    #article h4         { font-size: 0.8em; }
    #article h5 	{ font-size: 0.8em; }
    #article h6 	{ font-size: 0.8em; }

    #article p 		{ font-size: 0.9em; }
    #article ul 	{ font-size: 0.9em; }

    #contimages         { display: none; }
    #conttitle h2       { padding: 110px 0 0 0; font-size: 1.4em; }

    .my-simple-gallery              { width: 100%; float: left; }
    .my-simple-gallery figure       { width: 80%; float: left; }
}

/* Codice per TABLET vert SMARTPHONE oriz 321-480 px */
@media only screen and (min-width: 321px) and (max-width: 480px) {
    #article h2         { font-size: 0.9em;  }
    #article h3         { font-size: 0.9em; }
    #article h4         { font-size: 0.9em; }
    #article h5 	{ font-size: 0.9em; }
    #article h6 	{ font-size: 0.9em; }

    #article p 		{ font-size: 0.9em; }
    #article ul 	{ font-size: 0.9em; }

    #contimages         { display:none; }
    
    .my-simple-gallery              { width: 100%; float: left; }
    .my-simple-gallery figure       { width: 80%; float: left; }

}

/* Codice per TABLET vert. 481 – 768 px */
@media only screen and (min-width: 481px) and (max-width: 768px) {
    #article h2         { font-size: 1.5em;  }
    #article h3         { font-size: 1.3em; }
    #article h4         { font-size: 1.2em; }
    #article h5 	{ font-size: 1.1em; }
    #article h6 	{ font-size: 1.1em; }

    #article p 		{ font-size: 1.1em; }
    #article ul 	{ font-size: 1.1em; }

    #contimages         { display:none; }

    .my-simple-gallery              { width: 100%; float: left; }
    .my-simple-gallery figure       { width: 35%; float: left; }

}

/* Codice per TABLET oriz. 769 – 1024 px */
@media only screen and (min-width: 769px) and (max-width: 1024px) {
    .my-simple-gallery          { width: 100%; float: left; }
    .my-simple-gallery figure   { width: 40%; float: left; }

    #article h2.tititems        { clear: left; }
    #article ul.items li 	{ float: left; width: 43%; margin: 1%; padding: 1%; text-align: center; vertical-align: middle; border: 1px solid #333;background-color:rgba(256, 256, 256, 0.7); }
}

/* Codice per TABLET 1025 – 1240 px */
@media only screen and (min-width: 1025px) and (max-width: 1240px)  {

    .my-simple-gallery          { width: 100%; float: left; }
    .my-simple-gallery figure   { width: 40%; float: left; }

    #article h2.tititems        { clear: left; }
    #article ul.items li 	{ float: left; width: 27%; margin: 1%; padding: 1%; text-align: center; vertical-align: middle; border: 1px solid #333;background-color:rgba(256, 256, 256, 0.7); }
}

/* Codice per DESKTOP min. 1241 px  */
@media only screen and (min-width: 1241px) {
    #article p{font-size:1.4em;line-height:2.0em;}
    #article ol,#article ul{font-size:1.4em;line-height:2.0em;}

    .my-simple-gallery          { width: 100%; float: left; }
    .my-simple-gallery figure   { width: 40%; float: left; }

    #article h2.tititems        { clear: left; }
    #article ul.items li 	{ float: left; width: 27%; margin: 1%; padding: 1%; text-align: center; vertical-align: middle; border: 1px solid #333;background-color:rgba(256, 256, 256, 0.7); }
}
/* ==========================================================================
   Tabelle di amministrazione generiche (aWVgest e pagine di reportistica/audit)
   ========================================================================== */
/* Struttura, spaziature e righelli stanno nel framework
   (css/awvComponents.css): erano duplicati identici in tre progetti. Qui resta
   solo la tavolozza di questo sito - intestazione chiara con filetto oliva. */
:root {
    --awv-table-head-bg:   #f4f4ee;
    --awv-table-head-text: #777;
    --awv-table-head-line: #9E9D24;
}