/*  phpBB3 Style Sheet
    --------------------------------------------------------------
	Style name:			DVGFX
	Based on style:		prosilver (the default phpBB 3.3.x style)
	Original author:	Tom Beddard ( http://www.subblue.com/ )
	Modified by:		Prosk8er ( https://gotskillslounge.com/ )
    --------------------------------------------------------------
*/

@import url("normalize.css?hash=48eb3f89");
@import url("base.css?hash=7c5543be");
@import url("utilities.css?hash=d8f72c42");
@import url("common.css?hash=6bd6a3d6");
@import url("links.css?hash=18286e16");
@import url("content.css?hash=d5c673c4");
@import url("buttons.css?hash=b3a5f618");
@import url("cp.css?hash=50d868ab");
@import url("forms.css?hash=581ff634");
@import url("icons.css?hash=64da33ce");
@import url("colours.css?hash=1320509b");
@import url("responsive.css?hash=4a96d9aa");
/* --- PERSONALIZZAZIONE DRAGONERO: WRAP E BANNER SFUMATO --- */

/* 1. Allargamento e centratura del forum */
#wrap {
    max-width: 1350px;
    width: 95%;
    margin: 0 auto;
}

/* 2. Banner nell'header con sfumatura ai lati */
.headerbar {
    background: url("./images/site_logo.jpg") no-repeat center center !important;
    background-size: cover !important;
    height: 160px !important;
    position: relative !important;
    -webkit-mask-image: linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 12%, rgba(0,0,0,1) 88%, rgba(0,0,0,0) 100%);
    mask-image: linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 12%, rgba(0,0,0,1) 88%, rgba(0,0,0,0) 100%);
}
/* Imposta il banner panoramico di sfondo con sfumatura ai lati */
.headerbar {
    background: url("./images/site_logo.jpg") no-repeat center center !important; /* Inserisci il nome esatto della tua immagine */
    background-size: cover !important;
    height: 180px !important;
    position: relative !important;
    
    /* Effetto sfumatura ai lati */
    -webkit-mask-image: linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 12%, rgba(0,0,0,1) 88%, rgba(0,0,0,0) 100%);
    mask-image: linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 12%, rgba(0,0,0,1) 88%, rgba(0,0,0,0) 100%);
}
/* 1. Nasconde il vecchio logo e il testo originale */
.site-description a.logo,
.site-description h1,
.site-description p {
    display: none !important;
}

/* 2. Banner con altezza regolabile */
.headerbar {
    background-color: transparent !important;
    background-image: url("./images/site_logo.png") !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: cover !important;
    height: 220px !important; /* <--- Aumenta o diminuisci questo valore (es. 200px, 220px, 250px) */
    margin-bottom: 0 !important;
    position: relative !important;
}
/* ============================================================
   LAYOUT PULITO E DEFINITIVO: ICONE E TESTI A SINISTRA
   ============================================================ */

/* 1. Reset della colonna del titolo e riserva lo spazio a sinistra per l'icona */
ul.topiclist dl.row-item dt,
li.row dl.row-item dt {
    position: relative !important;
    padding-left: 52px !important; /* Spazio esatto per l'icona a sinistra */
    margin-left: 0 !important;
}

/* 2. Posizionamento fisso e pulito dell'icona personalizzata vicino al bordo */
.forum-image, 
span.forum-image, 
dt .forum-image {
    position: absolute !important;
    left: 4px !important;          
    top: 5px !important;           
    width: 32px !important;
    height: 32px !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    display: block !important;
}

/* 3. Contenitore dei testi a destra dello spazio riservato all'icona */
ul.topiclist dt .list-inner,
li.row dt .list-inner {
    display: block !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* 4. Incolonnamento ordinato di titoli, descrizioni e subforum */
ul.topiclist dt a.forumtitle,
.forum-description,
.subforums,
dt .subforums {
    display: block !important;
    clear: both !important;
    width: 100% !important;
    margin-left: 0 !important;
}

.subforums {
    margin-top: 3px !important;
}

/* ============================================================
   RIDUZIONE ALTEZZA / SPAZIATURA VERTICALE BOX SEZIONI
   ============================================================ */

/* 1. Riduce il padding verticale complessivo della riga del forum */
li.row {
    padding: 2px 0 !important; /* Riduce lo spazio sopra e sotto all'interno della riga */
}

/* 2. Compatta lo spazio del blocco sinistro (titolo, descrizione e subforum) */
ul.topiclist dl.row-item dt,
li.row dl.row-item dt {
    padding-top: 1px !important;
    padding-bottom: 2px !important;
}

/* 3. Evita margini verticali esagerati sui testi interni */
ul.topiclist dt a.forumtitle,
.forum-description,
.subforums {
    margin-top: 1px !important;
    margin-bottom: 1px !important;
}
/* ============================================================
   RIDUZIONE AGGRESSIVA ALTEZZA BOX SEZIONI
   ============================================================ */

/* 1. Azzeramento quasi totale dei padding verticali sulla riga */
li.row {
    padding-top: 1px !important;
    padding-bottom: 1px !important;
    min-height: auto !important;
}

/* 2. Riduzione altezza e spazi interni del contenitore principale */
ul.topiclist dl.row-item dt,
li.row dl.row-item dt,
li.row dl.row-item dd {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    min-height: auto !important;
}

/* 3. Compattamento dei testi (Titolo, Descrizione, Subforum) */
ul.topiclist dt a.forumtitle {
    line-height: 1.2 !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

.forum-description,
.subforums {
    line-height: 1.2 !important;
    margin-top: 1px !important;
    margin-bottom: 0px !important;
}

/* 4. Centratura verticale dell'icona personalizzata per la nuova altezza */
.forum-image, 
span.forum-image, 
dt .forum-image,
ul.topiclist dt img,
li.row dt img {
    top: 2px !important;
}
/* ============================================================
   COMPATTIMENTO ESTREMO ALTEZZA SEZIONI
   ============================================================ */

/* 1. Riduce al minimo l'altezza complessiva della riga */
li.row {
    padding: 0px !important;
    margin: 0px !important;
}

ul.topiclist dl.row-item,
li.row dl.row-item {
    padding: 2px 0 !important;
    margin: 0 !important;
}

/* 2. Rimuove qualsiasi margine o spaziatura residua dai testi */
ul.topiclist dt a.forumtitle,
.forum-description,
.subforums,
dt .subforums {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.1 !important;
}
/* ============================================================
   MANTIENI SOLO "ULTIMO MESSAGGIO" E RIMUOVI GLI ALTRI
   ============================================================ */

/* 1. Nasconde le colonne intermedie di argomenti e messaggi nelle righe */
ul.topiclist dd.topics,
ul.topiclist dd.posts,
li.row dd.topics,
li.row dd.posts {
    display: none !important;
}

/* 2. Nasconde le relative intestazioni in alto (Argomenti e Messaggi) */
ul.topiclist.header .topics,
ul.topiclist.header .posts {
    display: none !important;
}

/* 3. Assicura che la colonna "Ultimo messaggio" si espanda correttamente a destra */
ul.topiclist dd.lastpost,
li.row dd.lastpost {
    width: auto !important;
    float: right !important;
}
/* ============================================================
   STYLING RIQUADRI PROFESSIONALI PER "ULTIMO MESSAGGIO"
   ============================================================ */

/* 1. Definizione della struttura del riquadro */
ul.topiclist dd.lastpost,
li.row dd.lastpost {
    background: linear-gradient(180deg, #181818 0%, #111111 100%) !important;
    border: 1px solid #2a2a2a !important;
    border-left: 3px solid #aa0000 !important; /* Dettaglio rosso elegante a sinistra del riquadro */
    border-radius: 6px !important;
    padding: 6px 10px !important;
    margin: 4px 6px 4px 0 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 2px 4px rgba(0, 0, 0, 0.4) !important;
    width: 240px !important;                 /* Larghezza fissa e uniforme per tutti i box */
    box-sizing: border-box !important;
    transition: all 0.2s ease-in-out !important;
}

/* 2. Effetto Hover elegante al passaggio del mouse */
ul.topiclist dd.lastpost:hover,
li.row dd.lastpost:hover {
    border-color: #aa0000 !important;
    background: linear-gradient(180deg, #202020 0%, #151515 100%) !important;
    box-shadow: 0 0 8px rgba(170, 0, 0, 0.25) !important;
}

/* 3. Spaziatura e allineamento del testo interno */
ul.topiclist dd.lastpost span,
li.row dd.lastpost span,
li.row dd.lastpost a {
    line-height: 1.3 !important;
}

/* Titolo dell'ultimo topic (troncato pulito se troppo lungo) */
li.row dd.lastpost a.topictitle,
li.row dd.lastpost a.lastsubject {
    font-weight: bold !important;
    color: #e0e0e0 !important;
    display: block !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    margin-bottom: 2px !important;
}

/* Link del titolo al passaggio del mouse */
li.row dd.lastpost a.topictitle:hover,
li.row dd.lastpost a.lastsubject:hover {
    color: #ff3333 !important;
    text-decoration: none !important;
}

/* Data e ora dell'ultimo messaggio */
li.row dd.lastpost {
    color: #888888 !important;
    font-size: 0.85em !important;
}
/* ============================================================
   EFFETTO HOVER E FASCIA ROSSA SULLA RIGA DEL FORUM
   ============================================================ */

/* 1. Imposta lo stato base della riga del forum */
li.row {
    border-left: 3px solid transparent !important; /* Spazio riservato per evitare salti visivi */
    transition: all 0.2s ease-in-out !important;
}

/* 2. Quando passi il mouse sulla riga, appare il bordo sinistro rosso e lo sfondo coordinato */
li.row:hover {
    border-left: 3px solid #aa0000 !important;
    background-color: rgba(170, 0, 0, 0.04) !important; /* Leggerissimo riflesso rosso scuro sullo sfondo */
}
/* ============================================================
   INGRANDIMENTO LEGGERO ICONE (SENZA ALTERARE L'ALTEZZA DEL BOX)
   ============================================================ */

/* 1. Dimensionamento e posizionamento ottimizzato dell'icona */
.forum-image, 
span.forum-image, 
dt .forum-image,
ul.topiclist dt img,
li.row dt img {
    width: 39px !important;  /* Ingrandita leggermente da 32px a 36px */
    height: 39px !important;
    left: 4px !important;    /* Mantiene l'icona vicina al bordo sinistro */
    top: 15px !important;     /* Mantiene il centraggio perfetto */
}

/* 2. Assicura che il margine di rientro del testo rimanga proporzionato */
ul.topiclist dl.row-item dt,
li.row dl.row-item dt {
    padding-left: 54px !important; /* Riserva lo spazio esatto per l'icona da 36px */
}


/* 2. Intestazioni dei box inferiori (es. "CHI C'È IN LINEA", "COMPLEANNI") */
.stat-block h3, 
.panel h3,
.stat-block h4,
#page-body > h3 {
    background-color: #1a1a1a !important;
    color: #ffffff !important;
    font-size: 0.95em !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    padding: 8px 12px !important;
    margin: -12px -15px 12px -15px !important;
    border-top-left-radius: 8px !important;
    border-top-right-radius: 8px !important;
    border-bottom: 2px solid #aa0000 !important; /* Dettaglio distintivo rosso in linea con lo stile */
}

/* 3. Pulizia e leggibilità dei testi e della legenda dei gruppi */
.stat-block p, 
.stat-block div,
.stat-block span {
    color: #cccccc !important;
    line-height: 1.4 !important;
}

/* Evidenziazione pulita dei link normali nelle statistiche, lasciando intatti tutti i colori dei gruppi e degli utenti */

}

/* ============================================================
   FORZATURA SUPREMA COLORI UTENTI E LEGENDA STATISTICHE
   ============================================================ */
div.stat-block a.username-coloured,
.stat-block p a.username-coloured,
.stat-block .legend a,
.stat-block .legend span {
    color: inherit !important;
    filter: none !important;
}

/* Impedisce al colore grigio di sovrascrivere lo stile inline del gruppo */
span.username-coloured *, 
a.username-coloured * {
    color: inherit !important;
}

.stat-block a:hover {
    color: #ff3333 !important;
    text-decoration: none !important;
}
/* ============================================================
   MIGLIORAMENTO LEGGIBILITÀ E CONTRASTO NEI POST / EDITOR
   ============================================================ */

/* 1. Rende il testo nei post e nelle finestre di risposta/messaggi bianco/grigio chiaro ben visibile */
.postbody .content, 
.postbody, 
textarea, 
#message, 
.message-box textarea {
    color: #e0e0e0 !important; /* Colore testo chiaro e riposante */
    font-size: 1.10em !important;
    line-height: 1.5 !important;
}

/* 2. Imposta lo sfondo del box di scrittura/risposta per massimo contrasto */
textarea, 
#message {
    background-color: #121212 !important;
    border: 1px solid #2a2a2a !important;
    border-left: 3px solid #aa0000 !important; /* Dettaglio rosso in stile */
    border-radius: 6px !important;
    padding: 10px !important;
}

/* 3. Evidenzia la selezione del testo nell'editor */
textarea::selection,
.postbody .content::selection {
    background: #aa0000 !important;
    color: #ffffff !important;
}

/* 4. Colore dei tag informativi (BBCode, Emoticon, ecc.) sopra l'editor */
.fields1 label, 
#format-buttons, 
.post-editor-menu {
    color: #aaaaaa !important;
}
/* ============================================================
   RESTYLING EDITOR DI POST (TAG, CAMPO TITOLO E BARRA BBCODE)
   ============================================================ */

/* 1. Input Titolo Topic */
input#subject, 
input.inputbox {
    background-color: #121212 !important;
    color: #ffffff !important;
    border: 1px solid #2a2a2a !important;
    border-left: 3px solid #aa0000 !important; /* Dettaglio bordo rosso */
    border-radius: 5px !important;
    padding: 6px 10px !important;
}

/* 2. Contenitore e campo dei Tag selezionati */
.tags-input,
#tags_tag,
#tags_tagsinput,
ul.tagit,
.tagit {
    background-color: #121212 !important;
    border: 1px solid #2a2a2a !important;
    border-left: 3px solid #aa0000 !important;
    border-radius: 6px !important;
    color: #ffffff !important;
}

/* Targhette dei Tag selezionati */
ul.tagit li.tagit-choice,
.tagit-choice {
    background: linear-gradient(180deg, #222222 0%, #151515 100%) !important;
    border: 1px solid #333333 !important;
    color: #e0e0e0 !important;
    border-radius: 4px !important;
}

/* 3. Barra dei pulsanti BBCode e pulsanti di formattazione */
#format-buttons,
.format-buttons,
.message-box #format-buttons {
    background: linear-gradient(180deg, #181818 0%, #101010 100%) !important;
    border: 1px solid #222222 !important;
    border-radius: 6px 6px 0 0 !important;
    padding: 8px !important;
}

/* Styling dei singoli bottoni BBCode */
#format-buttons input.button2, 
#format-buttons button,
.format-buttons input,
.format-buttons button {
    background: linear-gradient(180deg, #252525 0%, #181818 100%) !important;
    border: 1px solid #333333 !important;
    color: #dddddd !important;
    border-radius: 4px !important;
    transition: all 0.15s ease-in-out !important;
}

#format-buttons input.button2:hover,
#format-buttons button:hover {
    border-color: #aa0000 !important;
    color: #ffffff !important;
    background: #aa0000 !important;
}
/* ============================================================
   RIPRISTINO VISIBILITÀ E CONTRASTO ICONE BBCODE
   ============================================================ */

/* 1. Forza la massima visibilità per le immagini e le icone dentro i pulsanti BBCode */
#format-buttons input,
#format-buttons button,
.format-buttons input,
.format-buttons button,
#format-buttons img,
.format-buttons img {
    opacity: 1 !important;
    filter: none !important; /* Rimuove eventuali filtri d'ombra o scurimento */
    visibility: visible !important;
}

/* 2. Sfondo neutro scuro e bordo definito per far risaltare ogni icona/pulsante */
#format-buttons input.button2, 
#format-buttons button,
.format-buttons input,
.format-buttons button {
    background: #1f1f1f !important;
    border: 1px solid #3a3a3a !important;
    color: #ffffff !important;
    padding: 3px 6px !important;
    margin: 2px !important;
    border-radius: 4px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5) !important;
}

/* 3. Evidenziazione in rosso al passaggio del mouse sui pulsanti */
#format-buttons input.button2:hover, 
#format-buttons button:hover,
.format-buttons input:hover,
.format-buttons button:hover {
    background-color: #aa0000 !important;
    border-color: #ff3333 !important;
    box-shadow: 0 0 6px rgba(255, 51, 51, 0.4) !important;
}
/* ============================================================
   FIX COMPLETO BARRA BBCODE (SFONDO DARK + ICONE VISIBILI)
   ============================================================ */

/* 1. Sfondo scuro per l'intera barra/contenitore BBCode */
#format-buttons,
.format-buttons,
.bbcode-status,
div[id*="format-buttons"] {
    background: #141414 !important;
    background-image: none !important;
    border: 1px solid #282828 !important;
    border-left: 3px solid #aa0000 !important;
    border-radius: 6px 6px 0 0 !important;
    padding: 8px !important;
}

/* 2. Sfondo chiaro/neutro sui singoli pulsanti per far risaltare le icone scure */
#format-buttons input,
#format-buttons button,
.format-buttons input,
.format-buttons button,
.bbcode-icon {
    background: linear-gradient(180deg, #ffffff 0%, #e0e0e0 100%) !important;
    border: 1px solid #444444 !important;
    border-radius: 4px !important;
    padding: 3px 5px !important;
    margin: 2px !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4) !important;
}

/* 3. Effetto Hover sui pulsanti BBCode */
#format-buttons input:hover,
#format-buttons button:hover {
    background: #aa0000 !important;
    border-color: #ff3333 !important;
    color: #ffffff !important;
}

/* 4. Rimuove qualsiasi trasparenza o filtro scuro applicato direttamente alle icone/immagini */
#format-buttons img,
.format-buttons img,
#format-buttons input[type="button"] {
    opacity: 1 !important;
    filter: none !important;
    -webkit-filter: none !important;
}

/* 5. Menu a tendina (es. Caratteri, Dimensione carattere) */
#format-buttons select,
.format-buttons select {
    background-color: #1a1a1a !important;
    color: #ffffff !important;
    border: 1px solid #333333 !important;
    border-radius: 4px !important;
    padding: 4px 6px !important;
}
/* ============================================================
   FORZATURA ASSOLUTA CLICCABILITÀ LOGO
   ============================================================ */

/* 1. Mette la headerbar su un livello neutro */
.headerbar {
    position: relative !important;
    z-index: 10 !important;
}

/* 2. Forza il link del logo a coprire l'area ed essere il primo elemento cliccabile */
a.logo {
    display: block !important;
    position: relative !important;
    z-index: 99999 !important;
    pointer-events: auto !important;
    cursor: pointer !important;
    text-decoration: none !important;
}

/* 3. Evita che il blocco della descrizione del sito copra il link */
.site-description {
    position: relative !important;
    z-index: 99998 !important;
    pointer-events: auto !important;
}

/* 4. Assicura che l'immagine risponda perfettamente al mouse */
a.logo img {
    position: relative !important;
    z-index: 99999 !important;
    pointer-events: auto !important;
    cursor: pointer !important;
}
/* ============================================================
   FIX DEFINITIVO SPAN SITE_LOGO (PER DARE DIMENSIONE AL LINK)
   ============================================================ */

/* 1. Forza il link a comportarsi come un contenitore visibile */
a#logo, 
a.logo {
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    cursor: pointer !important;
    position: relative !important;
    z-index: 99 !important;
}

/* 2. Dà corpo e visibilità allo span con l'immagine di sfondo */
span.site_logo {
    display: block !important;
    width: 300px !important;  /* Inserisci qui la LARGHEZZA esatta del tuo logo in pixel */
    height: 100px !important; /* Inserisci qui l'ALTEZZA esatta del tuo logo in pixel */
    background-repeat: no-repeat !important;
    background-position: left center !important;
    background-size: contain !important;
    cursor: pointer !important;
}
/* ============================================================
   BANNER A TUTTA LARGHEZZA SENZA SPAZI VUOTI
   ============================================================ */

/* 1. Headerbar che si adatta al banner */
.headerbar {
    background: #0f0f0f !important;
    border: 1px solid #222222 !important;
    border-left: 3px solid #aa0000 !important;
    border-radius: 8px !important;
    margin-bottom: 4px !important;
    padding: 0 !important;
    overflow: hidden !important;
}

.headerbar .inner {
    padding: 0 !important;
}

/* 2. Contenitore a larghezza piena */
.site-description {
    float: none !important;
    width: 100% !important;
    height: 150px !important; /* Regola se serve un'altezza diversa */
    margin: 0 !important;
}

/* 3. Link cliccabile su tutta l'area */
a#logo, 
a.logo {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    position: relative !important;
    z-index: 50 !important;
    cursor: pointer !important;
}

/* 4. Banner a tutta larghezza (100% width) */
span.site_logo {
    display: block !important;
    width: 100% !important;
    height: 140% !important;
    background-size: 100% 100% !important; /* Forza l'immagine a riempire tutto il rettangolo */
    background-position: center !important;
    background-repeat: no-repeat !important;
}
/* ============================================================
   RIPRISTINO CLICCABILITÀ ICONA ULTIMO MESSAGGIO
   ============================================================ */

/* 1. Forza l'interattività del link dell'ultimo messaggio */
.stat-block a, 
.forumbg .lastpost a, 
.forum-stat a,
ul.topiclist .lastpost a,
.row .lastpost a {
    pointer-events: auto !important;
    cursor: pointer !important;
    position: relative !important;
    z-index: 20 !important;
}

/* 2. Assicura che l'icona della freccina risponda ai click ed evidenzi il passaggio */
.stat-block a img, 
.forumbg .lastpost img,
ul.topiclist .lastpost img,
.row .lastpost span.images,
a.lastpost-icon {
    pointer-events: auto !important;
    cursor: pointer !important;
    opacity: 0.85 !important;
    transition: opacity 0.15s ease-in-out !important;
}

/* 3. Effetto hover luminoso quando passi sopra l'icona */
.stat-block a:hover img, 
.forumbg .lastpost a:hover img,
ul.topiclist .lastpost a:hover img {
    opacity: 1 !important;
    filter: brightness(1.2) !important;
}

/* ============================================================
   ALLARGAMENTO BOX ULTIMO MESSAGGIO VERSO SINISTRA
   ============================================================ */

/* 1. Riduce la larghezza della colonna sinistra (Titoli forum) per fare spazio */
ul.topiclist dt {
    width: 58% !important;
}

/* 2. Allarga la colonna di destra "Ultimo messaggio" verso sinistra */
ul.topiclist dd.lastpost,
dd.lastpost {
    width: 25% !important;
}
/* ============================================================
   SPAZIATURA E RESTYLING BARRA DATA / ULTIMO ACCESSO
   ============================================================ */

/* Seleziona il blocco della barra orizzontale (es. jumpbox / stat-block / timezone) */
div.navbar, p.rightside, .time-content, .stat-block, .copyright {
    padding-left: 15px !important;
    padding-right: 15px !important;
}

/* Specifico per la barra della data e ultimo accesso (sposta i testi lontano dai bordi) */
.navbar .inner, div.stat-block div {
    padding: 10px 15px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

/* Distanzia i testi laterali dai bordi estremi del monitor/box */
p.leftside, div.leftside {
    margin-left: 8px !important;
}

p.rightside, div.rightside {
    margin-right: 8px !important;
}
/* ============================================================
   DISTANZIAMENTO FORZATO TESTO SINISTRA (DATA / ORA)
   ============================================================ */

/* Forza un margine sinistro pulito sul testo iniziale della navbar o dei blocchi */
p.leftside, 
.navbar p.leftside,
.stat-block p.leftside {
    margin-left: 12px !important;
}

/* Assicura che anche il contenitore generale abbia un respiro laterale uniforme */
.navbar, .stat-block {
    padding-left: 8px !important;
    padding-right: 8px !important;
}
/* ============================================================
   RIPRISTINO ALLINEAMENTO NAVBAR E FIX MARGINI SENZA FLEX
   ============================================================ */

/* 1. Annulla l'effetto flex che ha invertito la barra principale */
.navbar .inner {
    display: block !important;
}

/* 2. Ripristina il corretto posizionamento dei breadcrumbs (Prima pagina) a sinistra */
.breadcrumbs {
    float: left !important;
}

/* 3. Sposta i collegamenti e il profilo utente a destra o al loro posto naturale */
.nav-links .rightside, 
.navbar .rightside {
    float: right !important;
}

/* 4. Distanzia delicatamente la data "Oggi è..." dal bordo sinistro senza rompere i float */
p.leftside, 
.navbar p.leftside, 
.stat-block p.leftside {
    padding-left: 12px !important;
    float: left !important;
}

p.rightside, 
.navbar p.rightside, 
.stat-block p.rightside {
    padding-right: 12px !important;
    float: right !important;
}
/* ============================================================
   MESSA IN RILIEVO INTESTAZIONI E BARRE CATEGORIA (DRAGONERO)
   ============================================================ */

/* 1. Intestazioni principali dei blocchi e delle categorie */
.forumbg .header th, 
.forumpattern .header th,
.stat-block h3, 
.panel h3,
.stat-block h4,
#page-body > h3,
.forumbg header,
.forumbg h2,
.forum-name h2,
li.header dt,
li.header dd {
    background: linear-gradient(180deg, #1f1f1f 0%, #121212 100%) !important;
    border: 1px solid #2a2a2a !important;
    border-left: 4px solid #aa0000 !important; /* Dettaglio rosso distintivo a sinistra */
    border-radius: 6px !important;
    padding: 8px 12px !important;
    color: #ffffff !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 2px 5px rgba(0, 0, 0, 0.5) !important;
}

/* 2. Migliora anche la barra di navigazione/breadcrumbs se rientra nelle zone indicate */
div.navbar {
    background: linear-gradient(180deg, #181818 0%, #0d0d0d 100%) !important;
    border: 1px solid #282828 !important;
    border-left: 4px solid #aa0000 !important;
    border-radius: 6px !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4) !important;
}
/* ============================================================
   CORREZIONE GLITCH INTESTAZIONI E PULSANTI INTERNI (DRAGONERO)
   ============================================================ */

/* 1. Ripristina l'intestazione principale con il bordo rosso a sinistra ma pulita */
.forumbg .header th, 
.forumpattern .header th,
.stat-block h3, 
.panel h3,
.stat-block h4,
#page-body > h3,
.forumbg header,
.forumbg h2,
.forum-name h2,
li.header dt,
li.header dd {
    background: linear-gradient(180deg, #1f1f1f 0%, #121212 100%) !important;
    border: 1px solid #2a2a2a !important;
    border-left: 4px solid #aa0000 !important;
    border-radius: 6px !important;
    padding: 8px 12px !important;
    color: #ffffff !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 2px 5px rgba(0, 0, 0, 0.5) !important;
}

/* ============================================================
   FIX DEFINITIVO INTETSTAZIONI E PULSANTE COLLAPSE (DRAGONERO)
   ============================================================ */

/* 1. Inserisce il rilievo e la fascia rossa SOLO sul titolo/colonna sinistra della barra header */
li.header dt,
.stat-block h3, 
.panel h3,
.stat-block h4,
#page-body > h3 {
    background: linear-gradient(180deg, #1f1f1f 0%, #121212 100%) !important;
    border: 1px solid #2a2a2a !important;
    border-left: 4px solid #aa0000 !important;
    border-radius: 6px !important;
    padding: 8px 12px !important;
    color: #ffffff !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 2px 5px rgba(0, 0, 0, 0.5) !important;
}

/* 2. Rimuove lo sfondo e il bordo rosso dalle colonne destre (dd) e dai pulsanti dentro l'header */
li.header dd,
li.header dd *,
li.header a,
li.header a.collapse-btn,
li.header .icon,
li.header span {
    background: transparent !important;
    border: none !important;
    border-left: none !important;
    box-shadow: none !important;
}
/* ============================================================
   CHICCHE GRAFICHE FINALI - DRAGONERO EXTRA STYLING
   ============================================================ */

/* 1. Effetto Glow tenue sui titoli dei topic e delle sezioni al passaggio del mouse */
a.topictitle:hover, 
a.forumtitle:hover,
a.lastsubject:hover {
    color: #ff3333 !important;
    text-shadow: 0 0 8px rgba(255, 51, 51, 0.6) !important;
    transition: all 0.2s ease-in-out !important;
}

/* 2. Campo di ricerca nell'header in stile Dark coordinato */
#search-box input.inputbox, 
.search-header input.inputbox,
#search-box button,
.search-header button {
    background-color: #121212 !important;
    color: #ffffff !important;
    border: 1px solid #333333 !important;
    border-radius: 4px !important;
}

#search-box input.inputbox:focus,
.search-header input.inputbox:focus {
    border-color: #aa0000 !important;
    box-shadow: 0 0 6px rgba(170, 0, 0, 0.6) !important;
    outline: none !important;
}

/* 3. Personalizzazione Scrollbar della finestra (Chrome, Edge, Brave, Safari) */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: #0a0a0a;
}

::-webkit-scrollbar-thumb {
    background: #1f1f1f;
    border: 1px solid #aa0000;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #aa0000;
    box-shadow: 0 0 6px rgba(170, 0, 0, 0.8);
}
/* ============================================================
   PERFEZIONAMENTO BANNER/LOGO DRAGONERO (SFUMATURA AI LATI)
   ============================================================ */

.headerbar {
    /* Sfumatura dolce sui bordi sinistro e destro per integrarsi con lo sfondo */
    -webkit-mask-image: linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 10%, rgba(0,0,0,1) 90%, rgba(0,0,0,0) 100%) !important;
    mask-image: linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 10%, rgba(0,0,0,1) 90%, rgba(0,0,0,0) 100%) !important;
    border: none !important; /* Rimuove eventuali bordi netti attorno all'immagine */
}
/* ============================================================
   ABBASSA SOLTANTO IL TESTO DELLE INTESTAZIONI (VISITE / RISPOSTE)
   ============================================================ */

/* Forza l'abbassamento del testo contenuto nelle intestazioni della lista topic */
ul.topiclist li.header dd {
    margin-top: 8px !important; /* Aumenta questo valore (es. 10px o 12px) se vuoi abbassarlo ancora di più */
    padding-top: 4px !important;
    position: relative !important;
    top: 2px !important; /* Abbassa fisicamente il testo di 5px */
}

/* Assicura che la barra non tagli il testo mentre scende */
ul.topiclist li.header {
    overflow: visible !important;
}

/* Se l'ora è inserita come elemento assoluto sopra il calendario, la riposizioniamo */
.postbody .author img + span,
.postbody .author a + span {
    margin-top: 4px !important;
}

/* ============================================================
   RISALTO GRAFICO BOX SEZIONI FORUM (DRAGONERO STYLE)
   ============================================================ */

/* 1. Stile base per ciascun box sezione */
ul.topiclist.forums li.row {
    background: linear-gradient(180deg, #181818 0%, #101010 100%) !important;
    border: 1px solid #222222 !important;
    border-left: 3px solid #660000 !important; /* Profilo rosso scuro a sinistra */
    margin-bottom: 4px !important;
    border-radius: 4px !important;
    transition: all 0.25s ease-in-out !important;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4) !important;
}

/* 2. Effetto al passaggio del mouse (Hover) */
ul.topiclist.forums li.row:hover {
    background: linear-gradient(180deg, #222222 0%, #151515 100%) !important;
    border-color: #333333 !important;
    border-left: 3px solid #ff0000 !important; /* Il bordo rosso si illumina */
    box-shadow: 0 4px 12px rgba(255, 0, 0, 0.15) !important;
    transform: translateX(2px);
}

/* 3. Risalto dei titoli delle sezioni */
ul.topiclist.forums a.forumtitle {
    color: #ffffff !important;
    font-weight: bold !important;
    font-size: 1.05em !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8) !important;
}

ul.topiclist.forums li.row:hover a.forumtitle {
    color: #ff3333 !important; /* Il titolo diventa rosso brillante al passaggio del mouse */
}

/* 4. Messa in evidenza delle etichette 'Subforum' e 'Moderatori' */
.subforum_list, 
.forum-description, 
ul.topiclist.forums li.row .list-inner {
    line-height: 1.5 !important;
}

ul.topiclist.forums .subforum {
    background: rgba(255, 255, 255, 0.03) !important;
    padding: 1px 6px !important;
    border-radius: 3px !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
}
/* ============================================================
   CORREZIONE COMPLETA COLONNA MESSAGGI PRIVATI (UCP)
   ============================================================ */

/* 1. Allinea l'intestazione SELEZIONA esattamente sopra i quadratini */
#ucp .header dd.mark,
.ucp-main .header dd.mark,
dl.icon dd.mark {
    width: 87px !important;
    min-width: 80px !important;
    text-align: center !important;
    padding-right: 0 !important;
    float: right !important;
}

/* 2. Stringe leggermente la colonna del testo per non invadere lo spazio a destra */
#ucp dl.icon dt,
.ucp-main dl.icon dt {
    margin-right: 85px !important;
}

/* 3. Forza la cliccabilità e la posizione dei quadratini */
#ucp dd.mark, 
.ucp-main dd.mark {
    width: 80px !important;
    text-align: center !important;
    position: relative !important;
    z-index: 10 !important;
    pointer-events: auto !important;
}

#ucp dd.mark input[type="checkbox"], 
.ucp-main dd.mark input[type="checkbox"] {
    cursor: pointer !important;
    position: relative !important;
    z-index: 20 !important;
    pointer-events: auto !important;
    margin: 0 auto !important;
}
/* ============================================================
   RISOLUZIONE DATA/ORA TOP STATS (SOLO BLOCCO ULTIMI UTENTI)
   ============================================================ */

.ts_block_stats .lastpost,
#ts_block_stats .lastpost {
    line-height: normal !important;
    height: auto !important;
    color: #cccccc !important;
}
/* ============================================================
   EVIDENZIATORE SEZIONI CON NUOVI POST - DRAGONERO
   ============================================================ */

/* 1. Colorazione del bordo sinistro della sezione non letta */
li.row.row-unread {
    border-left: 4px solid #ff3b3b !important;
    background-color: rgba(255, 59, 59, 0.04) !important;
}

/* 2. Rende il titolo della sezione non letta bianco e in evidenza */
li.row.row-unread a.forumtitle {
    color: #ffffff !important;
    font-weight: bold !important;
}

/* 3. Aggiunge un'etichetta testuale "NUOVO" accanto al titolo della sezione */
li.row.row-unread a.forumtitle::after {
    content: "NUOVO" !important;
    background-color: #ff3b3b !important;
    color: #ffffff !important;
    font-size: 8px !important;
    font-weight: bold !important;
    padding: 2px 5px !important;
    margin-left: 8px !important;
    border-radius: 3px !important;
    vertical-align: middle !important;
    display: inline-block !important;
    letter-spacing: 0.5px;
    box-shadow: 0 0 6px rgba(255, 59, 59, 0.6);
}
.postprofile a[href*="search.php?author_id"] {
    margin-left: 2px !important;
    display: inline-block !important;
}
/* Sposta l'etichetta "Le mie release:" verso destra */
.postprofile dt {
    margin-left: 10px !important;
}

/* Mantiene gli altri riquadri al loro posto senza farli scivolare */
.postprofile dd {
    margin-left: 0 !important;
}
/* Allarga il box arancione del profilo e crea spazio a sinistra */
.postprofile {
    width: 220px !important;       /* Aumenta la larghezza totale del box */
    padding-left: 10px !important; /* Stacca la linea arancione dai testi/box grigi */
}
/* Porta il menu a comparsa delle notifiche in primissimo piano */
.dropdown-extended .dropdown,
#notification_list,
.pointer-inner {
    z-index: 9999 !important;
}
/* Riallinea correttamente i blocchi nella gestione notifiche UCP */
.ucp_notifications .action-bar, 
#ucp .action-bar {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

/* Riporta il pulsante/testo "SEGNA COME GIÀ LETTI" al suo posto naturale */
.ucp_notifications .action-bar .mark-read,
#ucp .mark-read {
    position: static !important;
    display: inline-block !important;
    margin: 0 !important;
}

/* Avvicina i quadratini di spunta tirandoli verso destra */
.notification_list dd.mark,
.ucp_notifications dd.mark {
    position: relative !important;
    left: 380px !important; /* Sposta il quadratino verso destra: aumenta o diminuisci questo valore a piacimento */
}
/* Sposta l'intestazione VISITE verso destra per allinearla ai numeri */
.search .topiclist .header dt + dd,
.active-topics .topiclist .header dt + dd,
.topiclist.forums .header dd,
.topiclist .header dd.info,
.topiclist .header dd.stats {
    text-align: right !important;
    padding-right: 25px !important;
}

/* Se l'intestazione usa una classe specifica per le statistiche/visite nella ricerca */
.search-results .topiclist .header dd.views,
.search .topiclist .header dd.views,
.active-topics .topiclist .header dd.views {
    float: right !important;
    text-align: right !important;
    margin-right: 20px !important; /* Aumenta o diminuisci per regolare lo spostamento millimetrico */
}
/* Per muovere la scritta VISITE nell'intestazione */
.search li.header dd.views,
.active-topics li.header dd.views,
li.header dd.views {
    margin-left: 250px !important; /* Aumenta questo valore per spingerla a destra */
}
/* ==========================================================
   ALLINEAMENTO COLONNE PANNELLO MODERATORE (MCP)
   ========================================================== */

/* Allarga e gestisce lo spazio del blocco centrale "Argomento & Forum" */
.mcp-main .topiclist dt {
    width: 65% !important;
    float: left !important;
}

/* Gestisce la colonna delle spunte "Seleziona" a destra */
.mcp-main .topiclist dd.mark,
.mcp-main ul.topiclist dd.mark {
    width: 15% !important;
    float: right !important;
    text-align: center !important;
}

/* Intestazione superiore del Pannello Moderatore */
.mcp-main li.header dt {
    width: 65% !important;
    float: left !important;
}

.mcp-main li.header dd.mark {
    width: 15% !important;
    float: right !important;
    text-align: center !important;
}
/* ==========================================================
   SPOSTAMENTO QUADRATINI SOLO NEI MESSAGGI PRIVATI (UCP)
   ========================================================== */

#ucp dl.row-item dd.mark,
.ucp-main dl.row-item dd.mark {
    position: relative !important;
    right: -410px !important; /* Aumenta o diminuisci questi pixel per spostare i quadratini a destra o sinistra */
}
/* ==========================================================
   EVIDENZIAZIONE NOTIFICHE NON LETTE NEL MENU A TENDINA
   ========================================================== */

/* Notifiche non lette: sfondo leggermente più chiaro/evidenziato */
.notification_list li.notification-un-read {
    background-color: #222222 !important; /* Sfondo leggermente più chiaro rispetto al nero */
    border-left: 3px solid #e03232 !important; /* Bordo rosso a sinistra per farla risaltare */
}

/* Notifiche già lette (normali) */
.notification_list li.notification-read {
    background-color: transparent !important;
    border-left: 3px solid transparent !important;
}

/* Effetto

/* =========================================================
   PULSANTI METALLICI AVANZATI (DESIGN PROFESSIONALE + HOVER ROSSO)
   ========================================================= */

.button, 
a.button, 
.post-buttons a, 
.buttons .button {
    background: linear-gradient(to bottom, #383838 0%, #222222 50%, #111111 51%, #1a1a1a 100%) !important;
    border: 1px solid #4d4d4d !important;
    border-top: 1px solid #666666 !important;
    border-bottom: 1px solid #0a0a0a !important;
    border-radius: 6px !important;
    color: #f0f0f0 !important;
    font-weight: 600 !important;
    text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.9) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), inset 0 -1px 0 rgba(0, 0, 0, 0.4), 0 3px 6px rgba(0, 0, 0, 0.4) !important;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

.button i, 
.button span,
.post-buttons a i {
    color: #e6e6e6 !important;
    text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.8) !important;
}

.button:hover, 
a.button:hover, 
.post-buttons a:hover, 
.buttons .button:hover {
    background: linear-gradient(to bottom, #cc0000 0%, #b30000 50%, #800000 51%, #800000 100%) !important;
    border-color: #ff3333 #800000 #660000 #800000 !important;
    color: #ffffff !important;
    box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.4), inset 0 -1px 1px rgba(0, 0, 0, 0.5), 0 0 12px rgba(153, 0, 0, 0.6) !important;
    transform: translateY(-1px);
}

.button:hover i, 
.button:hover span {
    color: #ffffff !important;
}

.button:active, 
a.button:active {
    background: linear-gradient(to bottom, #660000 0%, #800000 100%) !important;
    border-color: #400000 !important;
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.6) !important;
    transform: translateY(1px);
}

/* ============================================================
   RILIEVO E PROFONDITÀ METALLICA PER BARRA E BOX
   ============================================================ */

/* 1. Rilievo marcato per la barra dell'intestazione (FORUM / ULTIMO MESSAGGIO) */
li.header, 
.forabg ul.topiclist li.header, 
.forumbg ul.topiclist li.header {
    background: linear-gradient(180deg, #2a2a2a 0%, #181818 50%, #0d0d0d 100%) !important;
    border: 1px solid #3d3d3d !important;
    border-top: 1px solid #555555 !important;
    border-bottom: 1px solid #000000 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 3px 6px rgba(0, 0, 0, 0.6) !important;
    border-radius: 6px 6px 0 0 !important;
}

/* 2. Rilievo e stacco per i box delle righe delle sezioni */
ul.topiclist.forums li.row, 
li.row {
    background: linear-gradient(180deg, #1c1c1c 0%, #121212 100%) !important;
    border: 1px solid #2b2b2b !important;
    border-top: 1px solid #383838 !important;
    border-bottom: 1px solid #0a0a0a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 2px 5px rgba(0, 0, 0, 0.5) !important;
    margin-bottom: 3px !important;
}

/* 3. Accentua il rilievo del riquadro "ULTIMO MESSAGGIO" a destra */
ul.topiclist dd.lastpost,
li.row dd.lastpost {
    background: linear-gradient(180deg, #222222 0%, #141414 50%, #0a0a0a 100%) !important;
    border: 1px solid #383838 !important;
    border-left: 3px solid #aa0000 !important; /* Mantiene la fascia rossa distintiva */
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 3px 6px rgba(0, 0, 0, 0.6) !important;
}
/* Fix isolato per il box CHI C'È IN LINEA / Statistiche in fondo alla home */
body.section-index .stat-block,
body.section-index div.stat-block,
body.section-index #online-list {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    overflow: hidden !important;
}

body.section-index .stat-block h3,
body.section-index div.stat-block h3 {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    left: 0 !important;
}
/* ============================================================
   PERSONALIZZAZIONE BARRA DI SCORRIMENTO (SCROLLBAR)
   ============================================================ */

/* Dimensioni della barra di scorrimento */
::-webkit-scrollbar {
    width: 18px !important;
    height: 18px !important;
}

/* Sfondo della pista di scorrimento */
::-webkit-scrollbar-track {
    background: #0a0a0a !important;
}

/* Cursore scorrevole (Thumb) in stile scuro con bordo rosso */
::-webkit-scrollbar-thumb {
    background: #1f1f1f !important;
    border: 1px solid #CC6600 !important;
    border-radius: 4px !important;
}

/* Effetto luminosi al passaggio del mouse sul cursore */
::-webkit-scrollbar-thumb:hover {
    background: #CC6600!important;
    box-shadow: 0 0 8px rgba(170, 0, 0, 0.8) !important;
}
/* ============================================================
   EFFETTO LUCIDO E RILIEVO METALLICO SU BARRA DI NAVIGAZIONE
   ============================================================ */

.navbar, 
#page-header .navbar, 
div.navbar {
    /* Sfumatura metallica scura lucida con riflesso di luce in alto */
    background: linear-gradient(
        180deg, 
        #353535 0%, 
        #242424 48%, 
        #121212 50%, 
        #1c1c1c 100%
    ) !important;
    
    /* Bordo sottile di riflesso chiaro in alto e scuro in basso */
    border: 1px solid #3d3d3d !important;
    border-top: 1px solid #666666 !important;
    border-bottom: 1px solid #000000 !important;
    
    /* Ombra esterna + riflesso interno lucido */
    box-shadow: 
        inset 0 1px 1px rgba(255, 255, 255, 0.25), 
        inset 0 -1px 2px rgba(0, 0, 0, 0.6), 
        0 4px 10px rgba(0, 0, 0, 0.7) !important;
}
/* ==========================================================
   BAGLIORE PULITO PER I BOTTONI "nav-button" (HOVER GLOW)
   ========================================================== */

li.nav-button {
    transition: all 0.3s ease-in-out !important;
}

li.nav-button:hover {
    /* Mantiene lo sfondo scuro senza farlo diventare arancione/rosso pieno */
    background: #1e1c1c !important; 
    background-color: #1e1c1c !important;
    
    /* Bagliore luminoso esterno arancione/fuoco */
    box-shadow: 0 0 12px #ff4500, 0 0 22px rgba(255, 69, 0, 0.5) !important;
    
    border-radius: 10px !important;
}

/* Assicura che il link interno rimanga trasparente al passaggio del mouse */
li.nav-button a:hover {
    background: transparent !important;
    background-color: transparent !important;
}
/* ============================================================
   RIMOZIONE ICONE NATIVE SOLO NELLA HOME (.section-index)
   ============================================================ */

/* Spegne l'immagine di sfondo nativa delle righe solo nella home */
body.section-index li.row dl.row-item,
body.section-index li.row dl.row-item dt,
body.section-index .forum_read,
body.section-index .forum_unread,
body.section-index .forum_read_locked,
body.section-index .forum_unread_locked,
body.section-index .forum_read_subforum,
body.section-index .forum_unread_subforum {
    background-image: none !important;
}

/* Spegne gli elementi/cerchi nativi ereditati solo nella home */
body.section-index li.row dl.row-item dt::before,
body.section-index li.row dl.row-item dt::after,
body.section-index .row-item dt::before,
body.section-index .row-item dt::after {
    display: none !important;
    content: none !important;
    background: none !important;
}
/* ============================================================
   FUSIONE E SFUMATURA GIUNZIONE LOGO DRAGONERO
   ============================================================ */

.headerbar {
    /* Applica una sfumatura di fusione morbida per nascondere la giunzione verticale */
    background-blend-mode: soft-light !important;
    filter: contrast(100%) brightness(130%) !important;
}
/* ============================================================
   OTTIMIZZAZIONE CONTRASTO SCURI PER TUTTI I MONITOR
   ============================================================ */

/* 1. Stacco dei box delle sezioni e ultimo messaggio per schermi a basso contrasto */
ul.topiclist.forums li.row, 
li.row,
ul.topiclist dd.lastpost,
li.row dd.lastpost {
    border-color: #383838 !important;
    border-top-color: #4a4a4a !important; /* Riflesso chiaro superiore ben visibile su ogni schermo */
}

/* 2. Risalto dei contorni della navbar e delle intestazioni */
.navbar, 
#page-header .navbar, 
div.navbar,
li.header, 
.forabg ul.topiclist li.header {
    border-color: #404040 !important;
    border-top-color: #555555 !important;
}

/* 3. Aumento del riflesso di luce interno (Glow/Highlight) per creare profondità visiva */
ul.topiclist dd.lastpost,
li.row dd.lastpost,
.navbar,
li.header {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 3px 8px rgba(0, 0, 0, 0.8) !important;
}