/*
 * DIGI Consumers Forum - Modern Override CSS
 * Sovrascrive style.css con il visual language di index.html
 */

/* === VARIABILI === */
:root {
  --digi-blue-dark:   #2A3573;
  --digi-blue-medium: #00529C;
  --digi-blue:        #146EB0;
  --digi-blue-light:  #0099D2;
  --digi-gray-dark:   #1D1D1B;
  --digi-gray:        #4A4A4A;
  --digi-gray-light:  #F5F7FA;
  --digi-border:      rgba(45, 70, 151, 0.12);
  --digi-shadow:      0 4px 20px rgba(20, 33, 61, 0.07);
  --digi-radius:      12px;
}

/* === TIPOGRAFIA BASE === */
html, body,
html *, body * {
  font-family: 'DM Sans', 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, sans-serif !important;
}
/* Fix: ripristina font icone (Font Awesome, TinyMCE) sovrascritta dall'!important sopra */
.fa, .fas, .far, .fab, .fal,
[class^="fa-"], [class*=" fa-"] {
  font-family: FontAwesome !important;
}
.mce-ico {
  font-family: 'tinymce', Arial !important;
}
body {
  background: var(--digi-gray-light) !important;
  color: var(--digi-gray-dark);
  line-height: 1.6;
}

/* === LAYOUT PRINCIPALE === */
#page {
  max-width: 1140px;
  margin: 0 auto;
  padding: 1.5rem 1.5rem 3rem;
  min-height: 60vh;
}
.pageMain {
  background: #fff;
  border-radius: var(--digi-radius);
  padding: 2rem;
  box-shadow: var(--digi-shadow);
  border: 1px solid var(--digi-border);
  margin-top: 1.5rem;
}

/* === WELCOME DIV === */
.welcomeDiv {
  background: linear-gradient(135deg, var(--digi-blue-dark), var(--digi-blue-medium));
  color: #fff;
  padding: 1.5rem 2rem;
  border-radius: var(--digi-radius);
  margin-bottom: 1.5rem;
}
.welcomeDiv .biggest {
  font-size: 1.6rem;
  font-weight: 700;
  color: #fff;
}

/* === TITOLI SEZIONE (h2.header) === */
h2.header, .header {
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--digi-blue-dark);
  padding: 0.5rem 0;
  margin: 0.75rem 0 1rem;
  border-left: 4px solid var(--digi-blue-light);
  padding-left: 0.75rem;
}
h2 {
  color: var(--digi-blue-dark);
}

/* === BREADCRUMB E LABEL === */
.breadcumpblulabel {
  background: linear-gradient(135deg, var(--digi-blue-light), #007fb3);
  color: #fff !important;
  padding: 0.3rem 0.9rem;
  border-radius: 50px;
  font-size: 0.85rem;
  font-weight: 600;
  text-decoration: none !important;
  display: inline-block;
}
a .breadcumpblulabel {
  color: #fff !important;
}

/* === TABELLA DISCUSSIONI === */
table.contenttable {
  border-collapse: separate !important;
  border-spacing: 0 4px !important;
  border: none !important;
  width: 100%;
  background: transparent;
  margin-top: 0.5rem;
}
table.contenttable tr {
  transition: box-shadow 0.15s;
}
table.contenttable td,
table.contenttable th {
  border: none !important;
  background: transparent;
  padding: 10px 14px !important;
  vertical-align: middle;
}
table.contenttable > tr > td,
table.contenttable tbody > tr > td {
  background: #fff;
  border: 1px solid var(--digi-border) !important;
  border-left: none !important;
  border-right: none !important;
}
table.contenttable > tr > td:first-child,
table.contenttable tbody > tr > td:first-child {
  border-left: 1px solid var(--digi-border) !important;
  border-radius: var(--digi-radius) 0 0 var(--digi-radius);
}
table.contenttable > tr > td:last-child,
table.contenttable tbody > tr > td:last-child {
  border-right: 1px solid var(--digi-border) !important;
  border-radius: 0 var(--digi-radius) var(--digi-radius) 0;
}
table.contenttable tr[bgcolor="#ffffff"],
table.contenttable tr[bgcolor="#FFFFFF"] {
  background: #fff !important;
}
table.contenttable tr[bgcolor="#ffffff"]:hover td,
table.contenttable tr[bgcolor="#FFFFFF"]:hover td {
  background: #f0f6fb !important;
}

/* Header rows della tabella */
table.contenttable tr.headmessagelist td,
table.contenttable tr[bgcolor="#eeeeee"] td,
table.contenttable tr[bgcolor="#EEEEEE"] td {
  background: var(--digi-blue-dark) !important;
  color: #fff !important;
  font-weight: 600 !important;
  font-size: 0.85rem !important;
  letter-spacing: 0.03em !important;
  padding: 10px 14px !important;
  border: none !important;
}
table.contenttable tr.headmessagelist td:first-child,
table.contenttable tr[bgcolor="#eeeeee"] td:first-child {
  border-radius: var(--digi-radius) 0 0 var(--digi-radius) !important;
}
table.contenttable tr.headmessagelist td:last-child,
table.contenttable tr[bgcolor="#eeeeee"] td:last-child {
  border-radius: 0 var(--digi-radius) var(--digi-radius) 0 !important;
}

/* Link nelle tabelle */
table.contenttable a {
  color: var(--digi-blue-medium) !important;
  text-decoration: none !important;
  font-weight: 500;
}
table.contenttable a:hover {
  color: var(--digi-blue-light) !important;
  text-decoration: underline !important;
}

/* Riga alert */
tr.alertrow td {
  background: #FFF3CD !important;
  color: #856404 !important;
  border: 1px solid #FFEEBA !important;
  border-radius: var(--digi-radius);
}

/* === PULSANTI === */
.button, input[type=submit], input[type=button], button.button {
  background: linear-gradient(135deg, var(--digi-blue-light), #007fb3) !important;
  border: none !important;
  border-color: transparent !important;
  color: #fff !important;
  padding: 0.5rem 1.25rem !important;
  border-radius: 50px !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  cursor: pointer !important;
  transition: all 0.3s !important;
  text-decoration: none !important;
}
.button:hover, input[type=submit]:hover, input[type=button]:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px rgba(0, 153, 210, 0.35) !important;
}
.blubutton {
  background: var(--digi-blue-medium) !important;
  color: #fff !important;
  padding: 4px 12px !important;
  border-radius: 50px !important;
  font-size: 0.8rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  display: inline-block !important;
  text-decoration: none !important;
  transition: background 0.2s !important;
}
.blubutton:hover {
  background: var(--digi-blue-dark) !important;
}

/* === NOTE E FORM === */
.notes {
  background: var(--digi-gray-light);
  border-left: 3px solid var(--digi-blue-light);
  padding: 0.6rem 0.9rem;
  border-radius: 0 8px 8px 0;
  font-size: 0.88rem;
  color: var(--digi-gray);
  margin: 0.5rem 0;
  line-height: 1.5;
}
input[type=text], input[type=password], input[type=email], textarea, select {
  border: 1px solid #d6d6d6 !important;
  border-radius: 8px !important;
  padding: 0.55rem 0.85rem !important;
  font-size: 0.95rem !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
  color: var(--digi-gray-dark) !important;
  background: #fff !important;
}
input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, textarea:focus, select:focus {
  outline: none !important;
  border-color: var(--digi-blue-light) !important;
  box-shadow: 0 0 0 3px rgba(0, 153, 210, 0.12) !important;
}
label, .titolo {
  font-weight: 600;
  color: var(--digi-blue-dark);
}

/* === AREA DETTAGLIO TOPIC (leggi.asp) === */
#header {
  background: #fff;
  border-radius: var(--digi-radius) var(--digi-radius) 0 0;
  padding: 1.25rem 1.5rem;
  border: 1px solid var(--digi-border);
  border-bottom: 2px solid var(--digi-blue-medium);
  margin-bottom: 0;
}
#topicTitleArea.header {
  background: transparent;
  border-left: none;
  padding-left: 0;
  font-size: 1.4rem;
  font-weight: 700;
}
.sidebarheader {
  background: var(--digi-blue-dark);
  color: #fff;
  padding: 0.5rem 1rem;
  border-radius: 8px 8px 0 0;
  font-weight: 600;
  font-size: 0.88rem;
  margin-top: 1rem;
}

/* Messaggi del forum */
.forummessage, .post-text {
  line-height: 1.75;
  color: var(--digi-gray-dark);
  font-size: 0.97rem;
}
.post-signature {
  border-top: 1px dashed var(--digi-border);
  margin-top: 1rem;
  padding-top: 0.75rem;
  font-size: 0.82rem;
  color: #888;
}

/* User info cell nei messaggi */
td.post-user-info {
  background: var(--digi-gray-light) !important;
  border-right: 1px solid var(--digi-border) !important;
  padding: 1rem !important;
  width: 120px !important;
  text-align: center !important;
  vertical-align: top !important;
}

/* Tabella contenuto messaggio */
table#doctableheader, table[id*="doctable"] {
  border: 1px solid var(--digi-border) !important;
  border-radius: var(--digi-radius) !important;
  overflow: hidden !important;
  margin-bottom: 8px;
}

/* Bottoni azione (risposta, modifica, etc.) */
#buttons-row {
  padding: 0.75rem 0;
  border-top: 1px solid var(--digi-border);
  margin-top: 0.5rem;
}
#buttons-row a, span.editButtons a {
  color: var(--digi-blue-medium) !important;
  font-size: 0.85rem;
  margin-right: 12px;
  text-decoration: none !important;
}
#buttons-row a:hover, span.editButtons a:hover {
  color: var(--digi-blue-light) !important;
}

/* === SIDEBAR / LAYOUT === */
#container { display: flex !important; align-items: flex-start; gap: 1.5rem; flex-wrap: wrap; }
#main { flex: 1 1 0%; min-width: 0; width: auto !important; }
.sidebar { flex: 0 0 260px; width: 260px !important; float: none !important; display: block !important; }
@media (max-width: 768px) {
  #container { flex-direction: column !important; }
  .sidebar { width: 100% !important; flex: 0 0 100%; }
}

/* === NAVBAR VECCHIA (nascosta) === */
.litemenu { display: none !important; }
br + br { /* riduce doppi a-capo eccessivi */ }
#fpstats { display: none !important; }

/* === NAVIGATION / PAGINATION === */
.pagenav a, a.pagenav {
  display: inline-block;
  padding: 4px 10px;
  border: 1px solid var(--digi-border);
  border-radius: 6px;
  margin: 3px 6px;
  color: var(--digi-blue-medium) !important;
  text-decoration: none !important;
  font-size: 0.85rem;
  transition: all 0.2s;
}
.pagenav a:hover {
  background: var(--digi-blue-medium) !important;
  color: #fff !important;
  border-color: var(--digi-blue-medium) !important;
}
.pagenav a.activePage, .pagenav a[class~="activePage"] {
  background: var(--digi-blue-dark) !important;
  color: #fff !important;
  border-color: var(--digi-blue-dark) !important;
}

/* === ALERT / STATUS === */
.alertrow td {
  background: #FFF8E1 !important;
  color: #7B5800 !important;
}
.unsub {
  background: var(--digi-gray-light) !important;
  border-left: 3px solid var(--digi-blue-light) !important;
  padding: 6px 12px !important;
  font-size: 0.85rem !important;
  color: var(--digi-gray) !important;
  border-radius: 0 6px 6px 0 !important;
  margin-bottom: 3px !important;
}

/* Ordina messaggi tab */
.orderElement {
  border: 1px solid var(--digi-border) !important;
  border-radius: 6px 6px 0 0 !important;
  color: var(--digi-gray) !important;
  font-size: 0.85rem !important;
  padding: 6px 14px !important;
  transition: background 0.2s !important;
}
.orderElement:hover {
  background: var(--digi-gray-light) !important;
}
.orderSelected {
  background: var(--digi-blue-medium) !important;
  color: #fff !important;
  border-color: var(--digi-blue-medium) !important;
}

/* === PROFILO / AVATAR === */
.gravatar-wrapper-32 img, .fbprofileimg {
  border-radius: 50%;
}

/* === LINK GENERALI === */
a { color: var(--digi-blue-medium); }
a:hover { color: var(--digi-blue-light); }

/* === RESPONSIVE === */
@media (max-width: 768px) {
  #page {
    padding: 1rem 0.75rem 2rem;
  }
  .pageMain {
    padding: 1rem;
  }
  table.contenttable td:last-child,
  table.contenttable td:first-child {
    border-radius: 0 !important;
  }
  .hideCol { display: none !important; }
  h2.header { font-size: 1.1rem; }
}