/*!
 * EBL Microsite
 * Copyright 2017 - EBL
 * Author: Fotis Skoularikis
 */

@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i');

body {
    font-family: 'Open Sans', sans-serif;
    background-color: #0c3e0c;
}
p{font-size: 1em;;}
a{cursor: pointer; color:#075f07; font-weight: bold;}
h4{font-size: 1.3em}
h2{font-size: 1.7em;}
h3{font-size: 1.5em}
.background-container {
    background-color: #0c3e0c;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden !important;
}
.background-container:after {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#logo, #ioc {
    text-align: center;
    padding: 9px;
}
#logo img, #ioc img{/*border:3px solid #eee;*/}

 #logo #ioc img {
    margin: 0 auto;
}

.site-title {
    font-weight: 600;
    border-bottom:1px solid #ddd;
    display:block;
}
.innercontent {
    margin:0 auto;
    background-color: #fff;
    position: relative;
    height: 100%;
    z-index:1;
    color:#252525; 
    padding-bottom:4px;
}

.table {
    margin-top:15px;
    width: 100%;
    margin-bottom: 30px;
    overflow-x:auto;
}
th{
    background: #087dc4;
    color:#fff;
}
#table-scroll {
    overflow-x:auto;
}
.center {
    text-align: center;
}
footer p {
    color:#fff;
}
footer {
    background: #075f07;
    text-align: center;
    padding: 15px;
    width: 120%;
    margin-left:-10%;
    z-index: 2;
    position: relative;  
    padding: 1% 10%;
}
footer a {
    color: #075f07;
    background: none!important;
}
footer a:hover{
    text-decoration: underline;
}
.contentEBLMP {
    height: 100%;
    background-color: #fff;
    position: relative;
    min-height: 500px;
    height: 100%;
    z-index:1;
    color:#252525;   
    padding-top:10px
}
strong {
    font-weight: bold;
}

@media only screen and (max-width: 768px){
    #header-row1 {
      height: auto;
      text-align:center;
      padding:15px 0px;
      margin: 0px;        
    }  
    .background-container {
      padding: 0px 5%;
    }
}

#header {
    color: #fff;
    background: #0c3e0c;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 5px;
}
div#header h1 {
    display: block;
    background: #075f07;    
    color:#fff;
    font-size: 25px;
    padding: 5px;
}
#data {
    display: block;
    margin-top:-5px;
    background: #019932;
    color: #fff;
    font-size: 18px;
}
#menu-bar {
    background: #00223E;
    height: 100px;
    width:100%;
    display: block;
}
#menu-info ul {
    list-style-type: none;
}
#menu-info ul li{ margin-bottom: 4px; border-bottom: 1px dotted #ddd; padding-bottom: 1px;}
#menu-info {
    margin-top: -10px;
    padding: 10px 10px 5px;
    border-bottom: 10px solid #075f07;
}
#menu-info a{font-weight: 600; color:#075f07; padding: 2px;  display: inline-block; background: none!important;}
.tba, .tba a {
    color:#d20128!important;background: none!important;
}
h2{color:#075f07; display:block; width:100%;}
h3{color:#019932; display:block; width:100%;}
h4{color:#075f07; display:block; width:100%; }
.page-content a {
    color: #075f07;background: #eee;
}
.page-content a:hover{text-decoration: none;text-decoration: underline;}
.border-right {
    border-right: 2px solid #075f07 ;
    min-height: 100px;
    height: auto;
}
table a{color: #075f07; text-decoration: none; border-bottom: none!important; background: none!important;}
.medium {
    width:60%;
    margin:0 auto;
}
.medium th{background:#075f07; padding: 0px!important;}
.medium h3{color:#fff; text-align: center; margin-top: 10px!important;
    margin-bottom: 10px!important; border:none!important}
.medium tr td {
    text-align: center;
    border:1px solid #075f07;
}
blockquote p{
    color:#5c5c5c;
    font-size: 0.8em;
    font-style: italic;
}
.divider {
    display: block;
    height: 3em;
}
@media (max-width: 768px) {
  .medium {width:100%;}
  #topbar{display:block; min-height: 255px;}
  #ioc{display:none;}
}
.bulletin-table {
    text-align: center;
    border:2px solid #075f07;
}
.bulletin-table td{text-align: center; border:1px solid #ddd; vertical-align: middle;}
.bulletin-table th{background: #075f07;}
.bulletin-table tr th{background: #075f07; text-align: center; vertical-align: middle; border: 1px solid #075f07; }
.bulletin-table tr{border-bottom: 2px solid #075f07; }
.page-content {
    padding-bottom:30px;
}
.rp-title {
    display: block;
    margin-top:-5px;
    background: #019932;
    color: #fff;
    font-size: 18px;
    border:2px solid #fff
}
h1.rp {
    display: inline;
    padding:0px;
}
.subtitle {
    font-style: italic;
    color: green;
}
a.winner {
    color: #E4232B;
}

/* Icone participation/roster */
.icon-status{
  font-size:18px;
  margin:0 2px;
  vertical-align:middle;
}
.icon-yes{ color:#019932; }   /* verde */
.icon-no { color:#d20128; }   /* rosso */

/* Ogni blocco (Participation / Roster) tiene sempre le sue due icone su UNA riga */
.icon-block{
  display:inline-flex;
  align-items:center;
  gap:4px;
  white-space:nowrap;   /* qui il trucco anti-a-capo */
  margin:0 8px;
}

/* Impila SOLO i due blocchi su mobile, senza spezzare le icone interne */
@media (max-width:768px){
  a.status-icons{                 /* il contenitore dei due blocchi */
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:6px;                      /* spazio verticale tra Participation e Roster */
  }
  .icon-block{
    margin:0;                     /* il padding orizzontale non serve quando sono in colonna */
  }
}

/* Legend pulita */
.legend {
  border: 1px solid #ddd;
  border-radius: 6px;
  overflow: hidden;
  margin: 6px 0 12px;
}
.legend-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 10px;
  border-top: 1px solid #eee;
  background: #fff;
}
.legend-row:first-child { border-top: 0; }

/* Coppia icone con larghezza fissa per allineare il testo */
.legend-icons {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 80px;      /* regola se vuoi più/meno spazio */
}

/* Icone coerenti */
.legend .icon-status {
  font-size: 18px;
  line-height: 1;       /* niente salti verticali */
  vertical-align: middle;
}
.icon-yes { color: #019932; }   /* verde */
.icon-no  { color: #d20128; }   /* rosso */

/* ====== Layout & tipografia soft-refresh ====== */
:root{
  --ebl-green:#075f07;
  --ebl-green-2:#019932;
  --ebl-red:#d20128;
  --ebl-accent:#087dc4;
  --ebl-border:#e6e6e6;
  --ebl-bg:#ffffff;
  --ebl-muted:#5c5c5c;
}
.innercontent{max-width:1100px;}
.page-content{padding-bottom:40px;}
#header .site-title{font-size:14px; opacity:.9}

/* Titoli microsito più puliti */
#header h1{
  font-size:26px;
  line-height:1.25;
  letter-spacing:.2px;
}

/* Link d’azione più chiari */
.page-content a{
  background:transparent;
  border-bottom:1px solid transparent;
}
.page-content a:hover{
  text-decoration:none;
  border-bottom:1px solid var(--ebl-accent);
}

/* ====== Tabella partecipanti: polishing ====== */
.bulletin-table{
  border:1px solid var(--ebl-green);
  border-radius:12px;
  overflow:hidden;
  background:var(--ebl-bg);
}
.bulletin-table tr{
  transition:background .15s ease, box-shadow .15s ease;
}
.bulletin-table tbody tr:hover{
  background:#f8fff8;
  box-shadow:inset 0 0 0 9999px rgba(1,153,50,.03);
}
.bulletin-table td{
  padding:10px 12px;
}
.bulletin-table td img[alt]{
  border:1px solid #000;
}

/* Stato/icone: blocchi separati, sempre dritti */
.icon-status{font-size:18px;line-height:1;vertical-align:middle;margin:0 2px}
.icon-yes{color:var(--ebl-green-2)}
.icon-no{color:var(--ebl-red)}
.icon-block{
  display:inline-flex;align-items:center;gap:6px;margin:0 10px;white-space:nowrap
}
/* Il contenitore dei due blocchi si impila su mobile ma i blocchi non si spezzano */
a.status-icons{display:inline-flex;align-items:center}

/* ====== Legenda moderna e sticky ====== */
.legend{
  border:1px solid var(--ebl-border);
  border-radius:10px;
  overflow:hidden;
  margin:10px 0 16px;
  position:sticky; top:10px; z-index:3;
  background:#fff;
}
.legend-row{
  display:flex; align-items:center; gap:12px;
  padding:8px 12px; border-top:1px solid var(--ebl-border);
}
.legend-row:first-child{border-top:0}
.legend-icons{
  display:inline-flex; align-items:center; gap:6px; min-width:88px;
}
.legend .icon-status{font-size:18px}

/* ====== Mobile: righe come card leggibili ====== */
@media (max-width:768px){
  .bulletin-table{
    border:0; border-radius:0; background:transparent;
  }
  .bulletin-table tbody tr{
    display:grid; grid-template-columns:56px 1fr; gap:8px;
    border:2px solid var(--ebl-green); border-radius:12px;
    background:#fff; margin:10px 0; padding:10px;
  }
  .bulletin-table tbody tr > td:nth-child(1){grid-row:1/3}
  .bulletin-table tbody tr > td:nth-child(2){align-self:end; text-align:left!important}
  .bulletin-table tbody tr > td:nth-child(3){grid-column:2; align-self:start}
  a.status-icons{display:flex; flex-direction:column; align-items:flex-start; gap:8px}
  .icon-block{margin:0}
  .legend{top:0; border-radius:8px}
}

/* ====== Focus visibili per tastiera ====== */
a:focus{
  outline:2px solid var(--ebl-accent);
  outline-offset:2px;
  border-radius:6px;
}

/* ===== MOBILE ROLLBACK: torna al layout semplice di prima ===== */
@media (max-width: 768px) {
  /* Tabella: basta grid/card. Torna tabella normale. */
  .bulletin-table { border: 2px solid #075f07; border-radius: 0; background: #fff; }
  .bulletin-table tbody tr {
    display: table-row;
    box-shadow: none;
    margin: 0;
    padding: 0;
    background: #fff;
  }
  .bulletin-table td {
    display: table-cell;
    padding: 8px 10px;
    text-align: center !important;
    border: 1px solid #ddd;
  }

  /* Legenda: niente sticky, margini compatti */
  .legend { position: static; margin: 6px 0 10px; }
  .legend-row { padding: 6px 8px; gap: 8px; }
  .legend-icons { min-width: 80px; }

  /* Icone stato: i DUE BLOCCHI (Participation, Roster) vanno uno sotto l'altro,
     ma le ICONE dentro ogni blocco restano sulla stessa riga. */
  a.status-icons {
    display: flex;
    flex-direction: column;   /* blocchi uno sopra l'altro */
    align-items: center;      /* centrati come prima */
    gap: 6px;                 /* spazio verticale tra i due blocchi */
  }
  .icon-block {
    display: inline-flex;     /* tiene insieme 👥 + ✔/✖ o 🚩 + ✔/✖ */
    align-items: center;
    gap: 4px;
    margin: 0;                /* niente margini laterali esagerati */
    white-space: nowrap;      /* vieta l'andare a capo tra le due icone */
    text-align: center;
  }

  /* Coerenza dimensioni icone */
  .icon-status { font-size: 18px; line-height: 1; vertical-align: middle; }
}

/* ——— Header della tabella: basta verde pieno ——— */
/* Primo “header row” (Teams/Series) del markup attuale */
.bulletin-table tbody tr:first-child td[bgcolor]{
  background: #f6faf6 !important;   /* fondo chiaro */
  color: #0c3e0c !important;         /* verde scuro EBL */
  border-bottom: 2px solid #075f07;  /* riga di separazione */
  font-weight: 700;
  text-transform: none;               /* niente urlati */
  border-top-left-radius: 0;          /* niente angoli gommosi */
  border-top-right-radius: 0;
}

/* Seconda riga di intestazione (Open/Women) */
.bulletin-table tbody tr:nth-child(2) td{
  background: #ffffff !important;
  color: #075f07 !important;
  font-weight: 600;
  border-top: 0;
  border-bottom: 2px solid #075f07;
}

/* ——— Allinea i nomi delle nazioni (2a colonna) a sinistra ——— */
.bulletin-table tbody tr td:nth-child(2){
  text-align: left !important;
  padding-left: 12px;                 /* un filo di aria */
}

/* Mantieni centrati flag (colonna 1) e icone stato (colonna 3) */
.bulletin-table tbody tr td:first-child,
.bulletin-table tbody tr td:nth-child(3){
  text-align: center !important;
}

/* Coerenza verticale */
.bulletin-table td{ vertical-align: middle; }

/* ——— Sfondo generale: da verdone a chiaro ——— */
body,
.background-container { 
  background: #f7f9f8 !important;   /* chiaro neutro */
}
.background-container:after { 
  display: none !important;          /* rimuove overlay pieno verde */
}

/* Header più pulito: niente tapparella */
#header { 
  background: #ffffff !important; 
  color: #0c3e0c !important; 
}
#header .site-title { 
  border-bottom: 1px solid #e6e6e6 !important; 
}
div#header h1 { 
  background: transparent !important; 
  color: #0c3e0c !important; 
  border-bottom: 3px solid #075f07;  /* verde come accento, non come secchiata */
  padding-bottom: 8px;
}
#data { 
  background: #e9f6ec !important;    /* verde chiarissimo */
  color: #075f07 !important; 
  border: 1px solid #cfead4; 
}

/* “Testata verdona” della tabella: rendi chiaro e leggibile */
.bulletin-table tbody tr:first-child td[bgcolor]{
  background: #f6faf6 !important;
  color: #0c3e0c !important;
  border-bottom: 2px solid #075f07;
  font-weight: 700;
}
.bulletin-table tbody tr:nth-child(2) td{
  background: #ffffff !important;
  color: #075f07 !important;
  font-weight: 600;
  border-top: 0;
  border-bottom: 2px solid #075f07;
}

/* ——— Allinea i nomi delle nazioni a sinistra (colonna 2) ——— */
.bulletin-table tbody tr td:nth-child(2){
  text-align: left !important;
  padding-left: 12px;
}
/* Flag (col.1) e stato (col.3) centrati */
.bulletin-table tbody tr td:first-child,
.bulletin-table tbody tr td:nth-child(3){
  text-align: center !important;
}

/* Footer meno invadente */
/*
footer { background: #0f5a0f !important; }  // leggermente meno scuro, oppure
footer { background: #ffffff !important; color:#075f07 !important; }
footer p { color: inherit !important; }
*/

/* ===== Background: gradient elegante, niente prato sintetico né corsia d'ospedale ===== */

/* Scegli la palette: lascia ATTIVO un blocco e commenta gli altri */

/* 1) Forest dusk (default): verde profondo + teal/charcoal */
:root{
  --bg1:#0d2b0d;   /* forest dark */
  --bg2:#0a3a2a;   /* deep teal green */
  --bg3:#0b1f26;   /* charcoal-teal */
}

/* 2) Emerald night (più saturo) */
/*
:root{
  --bg1:#08320f;
  --bg2:#0b4d2e;
  --bg3:#0a1e26;
}
*/

/* 3) Teal graphite (meno verde) */
/*
:root{
  --bg1:#0b2b33;
  --bg2:#0e3a2a;
  --bg3:#111821;
}
*/

.background-container{
  /* layer di luce morbida + gradiente diagonale */
  background:
    radial-gradient(1000px 600px at 12% 0%, rgba(255,255,255,.06), transparent 60%),
    radial-gradient(800px 500px at 100% 100%, rgba(255,255,255,.04), transparent 50%),
    linear-gradient(135deg, var(--bg1) 0%, var(--bg2) 55%, var(--bg3) 100%) !important;
}
.background-container:after{ display:none !important; } /* rimuove il tappetone verde originale */

/* Carta del contenuto: leggermente “frosted”, non bianco clinico */
.innercontent{
  background: rgba(255,255,255,.94) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.25);
  border-radius: 12px;
}

/* Header dentro la carta: niente barre piatte */
#header{ background: transparent !important; color:#fff; }
#header .site-title{ color:#e7efe9; border-bottom:1px solid rgba(255,255,255,.12) !important; }
div#header h1{
  background: transparent !important;
  color: #ffffff !important;
  border-bottom: 3px solid #019932;
  padding-bottom: 8px;
}
#data{
  background: rgba(1,153,50,.15) !important;
  color:#eaffef !important;
  border:1px solid rgba(1,153,50,.25);
}

/* Testo standard dentro la carta resta scuro per leggibilità */
.innercontent, .contentEBLMP, .contentEBLMP p, .contentEBLMP a{
  color:#252525;
}

/* Header tabella meno “verdone piatto” ma coerente col tema */
.bulletin-table tbody tr:first-child td[bgcolor]{
  background: rgba(1,153,50,.12) !important;
  color:#0c3e0c !important;
  border-bottom: 2px solid #075f07;
  font-weight:700;
}
.bulletin-table tbody tr:nth-child(2) td{
  background:#fff !important;
  color:#075f07 !important;
  font-weight:600;
  border-top:0;
  border-bottom:2px solid #075f07;
}

/* Nomi nazioni a sinistra, come chiesto */
.bulletin-table tbody tr td:nth-child(2){ text-align:left !important; padding-left:12px; }
.bulletin-table tbody tr td:first-child,
.bulletin-table tbody tr td:nth-child(3){ text-align:center !important; }

/* Mobile */
@media (max-width:768px){
  .legend{ position: static; }
}

/* Links for status icons: no underline */
.page-content a.status-icons,
.page-content a.status-icons:hover{ text-decoration:none!important; border-bottom:0!important; }
.status-icons i{ text-decoration:none!important; }

/* Footer strip */
#site-footer{ border-top:0!important; }

/* Footer text contrast */
#site-footer p,
#site-footer small,
#site-footer b,
#site-footer a{ color:#e7efe9!important; }
#site-footer a:hover{ color:#ffffff!important; text-decoration:underline; }

/* Header title contrast */
div#header h1{ color:#0c3e0c!important; border-bottom:3px solid #019932; padding-bottom:8px; }

/* Header refresh: contrast & spacing */
#header{
  background: linear-gradient(180deg,#0f3a2e 0%,#0c2e24 100%) !important;
  color:#fff!important;
  border-radius:12px;
  padding:24px 16px 18px;
}
div#header h1{
  color:#fff!important;
  font-weight:700;
  font-size:32px;
  line-height:1.2;
  margin:0 0 10px;
  border:none!important;
  text-shadow:0 1px 0 rgba(0,0,0,.25);
}
/* Place/date chip: high contrast */
#data{
  display:inline-block;
  background:rgba(0,0,0,.38)!important;
  color:#f3fff7!important;
  border:1px solid rgba(255,255,255,.18)!important;
  padding:6px 12px;
  border-radius:999px;
  font-weight:600;
  letter-spacing:.2px;
}

/* Remove green bars/underlines around the header zone */
#header .site-title{border-bottom:0!important;color:#dfe9e4!important;opacity:.9}

/* Icons link: no underline on hover */
.page-content a.status-icons,
.page-content a.status-icons:hover{ text-decoration:none!important; border-bottom:0!important; }

/* Footer logo strip cleanup + brighter footer text */
#site-footer{ border-top:0!important; }
#site-footer p,
#site-footer small,
#site-footer b,
#site-footer a{ color:#e7efe9!important; }
#site-footer a:hover{ color:#ffffff!important; text-decoration:underline; }

/* Mobile tuning */
@media (max-width:768px){
  div#header h1{ font-size:24px; }
  #data{ font-size:14px; padding:6px 10px; }
}

/* Typography: ordinal superscripts */
#header sup.ord{font-size:.6em;vertical-align:super;line-height:0}

/* Table rows: consistent vertical centering */
.bulletin-table td{padding:12px 10px;vertical-align:middle}
.bulletin-table td img{vertical-align:middle}
a.status-icons{display:inline-flex;align-items:center;gap:10px}
.icon-block{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.icon-status{line-height:1;vertical-align:middle}

/* Header: hide the "Series" label (structure preserved) */
.bulletin-table tbody tr:first-child td:last-child b{display:none}

/* Legend: same visual tone as table header */
.legend{background:rgba(1,153,50,.12);border:1px solid #cfead4}
.legend-row{border-top:1px solid #e5f3ea}
.legend-row:first-child{border-top:0}

/* Table rows: hard vertical centering */
.bulletin-table tbody tr > td{
  padding: 12px 10px;
  vertical-align: middle;
}

/* Remove image baseline gap so rows don’t look top-heavy */
.bulletin-table tbody tr > td:first-child img{
  display:block;           /* no extra space below the flag */
}

/* Use flex inside cells to align content perfectly */
.bulletin-table tbody tr > td:first-child,
.bulletin-table tbody tr > td:nth-child(2),
.bulletin-table tbody tr > td:nth-child(3){
  display:flex;
  align-items:center;
}

/* Column-specific alignment */
.bulletin-table tbody tr > td:first-child{ justify-content:center; }   /* flag */
.bulletin-table tbody tr > td:nth-child(2){ justify-content:flex-start; }/* country name */
.bulletin-table tbody tr > td:nth-child(3){ justify-content:center; }  /* icons */

/* Icons stay on a single line and share baseline */
a.status-icons{ display:inline-flex; align-items:center; gap:10px; }
.icon-block{ display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }

/* Table rows: hard vertical centering */
.bulletin-table tbody tr > td{
  padding: 12px 10px;
  vertical-align: middle;
}

/* Remove image baseline gap so rows don’t look top-heavy */
.bulletin-table tbody tr > td:first-child img{
  display:block;           /* no extra space below the flag */
}

/* Use flex inside cells to align content perfectly */
.bulletin-table tbody tr > td:first-child,
.bulletin-table tbody tr > td:nth-child(2),
.bulletin-table tbody tr > td:nth-child(3){
  display:flex;
  align-items:center;
}

/* Column-specific alignment */
.bulletin-table tbody tr > td:first-child{ justify-content:center; }   /* flag */
.bulletin-table tbody tr > td:nth-child(2){ justify-content:flex-start; }/* country name */
.bulletin-table tbody tr > td:nth-child(3){ justify-content:center; }  /* icons */

/* Icons stay on a single line and share baseline */
a.status-icons{ display:inline-flex; align-items:center; gap:10px; }
.icon-block{ display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }

/* Table cells: back to classic layout */
.bulletin-table tbody tr > td{
  display: table-cell !important;
  vertical-align: middle !important;
  padding: 8px 10px;
}

/* Flags: inline again (remove block gap effects) */
.bulletin-table tbody tr > td:first-child img{
  display: inline-block !important;
  vertical-align: middle;
}

/* Status icons: inline on desktop, stacked blocks on mobile */
a.status-icons{ display: inline-flex; align-items: center; gap: 10px; }
.icon-block{ display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }

@media (max-width:768px){
  a.status-icons{ display: flex; flex-direction: column; align-items: center; gap: 6px; }
}

/* Legend: same tone as table header + tighter spacing */
.legend{
  background: rgba(1,153,50,.12);
  border: 1px solid #cfead4;
  border-radius: 10px;
  margin: 6px 0 8px;
}
.legend-row{ border-top: 1px solid #e5f3ea; padding: 8px 12px; }
.legend-row:first-child{ border-top: 0; }

/* Pull the table closer to the legend */
.legend + .table.bulletin-table{ margin-top: 6px !important; }

/* Legend background + spacing (both new block and legacy table) */

/* New block legend */
.legend{
  background: rgba(1,153,50,.12)!important;
  border: 1px solid #cfead4;
  border-radius: 10px;
  margin: 6px 0 8px;
}
.legend-row{ padding: 8px 12px; border-top: 1px solid #e5f3ea; }
.legend-row:first-child{ border-top: 0; }

/* Legacy legend: nested textTable */
table.textTable table.textTable{
  background: rgba(1,153,50,.12)!important;
  border: 1px solid #cfead4;
  border-radius: 10px;
  border-collapse: separate;
  overflow: hidden;
}
table.textTable table.textTable td{ padding: 8px 12px; }
table.textTable table.textTable tr+tr td{ border-top: 1px solid #e5f3ea; }

/* Reduce gap before the participants table */
table.textTable + br{ display: none; }
table.textTable + br + .table.bulletin-table{ margin-top: 8px!important; }

/* Legend (new block, if present) */
.legend{
  background: rgba(1,153,50,.12) !important;
  border: 1px solid #cfead4 !important;
  border-radius: 10px !important;
  margin: 6px 0 8px !important;
}
.legend-row{ padding: 8px 12px !important; border-top: 1px solid #e5f3ea !important; }
.legend-row:first-child{ border-top: 0 !important; }

/* Legend (legacy nested table: left column) */
.textTable > tbody > tr > td:first-child > table.textTable{
  background: rgba(1,153,50,.12) !important;
  border: 1px solid #cfead4 !important;
  border-radius: 10px !important;
  border-collapse: separate !important;
  overflow: hidden !important;
}
.textTable > tbody > tr > td:first-child > table.textTable td{
  background: transparent !important;
  padding: 8px 12px !important;
}
.textTable > tbody > tr > td:first-child > table.textTable tr + tr td{
  border-top: 1px solid #e5f3ea !important;
}

/* Pull the participants table closer */
table.textTable + br{ display: none !important; }
table.textTable + br + .table.bulletin-table{ margin-top: 8px !important; }

/* Legend (new block, if present) */
.legend{
  background: rgba(1,153,50,.12) !important;
  border: 1px solid #cfead4 !important;
  border-radius: 10px !important;
  margin: 6px 0 8px !important;
}
.legend-row{ padding: 8px 12px !important; border-top: 1px solid #e5f3ea !important; }
.legend-row:first-child{ border-top: 0 !important; }

/* Legend (legacy nested table: left column) */
.textTable > tbody > tr > td:first-child > table.textTable{
  background: rgba(1,153,50,.12) !important;
  border: 1px solid #cfead4 !important;
  border-radius: 10px !important;
  border-collapse: separate !important;
  overflow: hidden !important;
}
.textTable > tbody > tr > td:first-child > table.textTable td{
  background: transparent !important;
  padding: 8px 12px !important;
}
.textTable > tbody > tr > td:first-child > table.textTable tr + tr td{
  border-top: 1px solid #e5f3ea !important;
}

/* Pull the participants table closer */
table.textTable + br{ display: none !important; }
table.textTable + br + .table.bulletin-table{ margin-top: 8px !important; }

/* Legend: match table header tone */
table.legend{
  background: rgba(1,153,50,.12) !important;
  border: 1px solid #cfead4 !important;
  border-radius: 10px !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  overflow: hidden !important;
}
table.legend td{ 
  background: transparent !important; 
  padding: 8px 12px !important; 
}
table.legend tr + tr td{ 
  border-top: 1px solid #e5f3ea !important; 
}

/* Bring legend closer to participants table */
table.textTable + br{ display: none !important; }
table.textTable + br + .table.bulletin-table{ margin-top: 8px !important; }

/* Legend background and spacing – final override */
.legend{
  background: rgba(1,153,50,.12) !important;
  border: 1px solid #cfead4 !important;
  border-radius: 10px !important;
  margin: 6px 0 8px !important;
}
/* remove the white paint on each row */
.legend .legend-row{ 
  background: transparent !important; 
}

/* tighten gap with the table even if a <br> sits there */
.legend + br{ display: none !important; }
.legend + br + table.bulletin-table{ margin-top: 8px !important; }

/* Legend background and spacing – final override */
.legend{
  background: rgba(1,153,50,.12) !important;
  border: 1px solid #cfead4 !important;
  border-radius: 10px !important;
  margin: 6px 0 8px !important;
}
/* remove the white paint on each row */
.legend .legend-row{ 
  background: transparent !important; 
}

/* tighten gap with the table even if a <br> sits there */
.legend + br{ display: none !important; }
.legend + br + table.bulletin-table{ margin-top: 8px !important; }

/* Forza colore leggibile per la colonna dei nomi (2ª colonna) */
.bulletin-table tbody tr td:nth-child(2),
.bulletin-table tbody tr td:nth-child(2) a,
.bulletin-table tbody tr td:nth-child(2) span {
  color: #0c3e0c !important;   /* o #252525 se preferisci */
}

/* Se qualche tr porta il bianco ereditato, scurisci tutto il testo della tabella */
.bulletin-table td, 
.bulletin-table td a, 
.bulletin-table td span {
  color: #0c3e0c !important;
}

.legend-row {
  display: flex;
  align-items: center;   /* centra verticalmente icona e testo */
  gap: 6px;              /* spazio fra icona e testo */
  margin-bottom: 4px;
}

/* === Participants page cleanup overrides (append at end) ================== */

/* 1) Bold coerente anche con <b> */
b { font-weight: 700 !important; }

/* 2) Niente overlay fantasma sullo sfondo */
.background-container:after { display: none !important; }

/* 3) Legenda: una sola verità.
      Uniforma sia il blocco .legend moderno, sia le varianti a tabella legacy. */
.legend,
table.legend,
.textTable > tbody > tr > td:first-child > table.textTable {
  background: rgba(1,153,50,.12) !important;
  border: 1px solid #cfead4 !important;
  border-radius: 10px !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  overflow: hidden !important;
  margin: 6px 0 8px !important;
}

/* Riga singola, icona+testo allineati al centro verticalmente */
.legend-row { 
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 12px !important;
  border-top: 1px solid #e5f3ea !important;
  background: transparent !important;
}
.legend-row:first-child { border-top: 0 !important; }

/* Variante legacy: rendi le celle come righe “row” */
table.legend td,
.textTable > tbody > tr > td:first-child > table.textTable td {
  background: transparent !important;
  padding: 8px 12px !important;
  border: 0 !important;
}
table.legend tr + tr td,
.textTable > tbody > tr > td:first-child > table.textTable tr + tr td {
  border-top: 1px solid #e5f3ea !important;
}

/* Coppia icone a larghezza fissa così il testo della legenda è allineato */
.legend-icons { 
  display: inline-flex !important; 
  align-items: center !important; 
  gap: 6px !important; 
  min-width: 88px !important; 
}

/* Icone consistenti */
.legend .icon-status { 
  font-size: 18px !important; 
  line-height: 1 !important; 
  vertical-align: middle !important; 
}

/* Avvicina tabella partecipanti alla legenda anche se c’è un <br> dispettoso */
.legend + br { display: none !important; }
.legend + br + .table.bulletin-table,
table.textTable + br + .table.bulletin-table {
  margin-top: 8px !important;
}

/* Mobile: niente sticky, niente impasti, blocchi puliti uno sotto l’altro */
@media (max-width: 768px) {
  .legend { position: static !important; }
  .legend-row { padding: 6px 10px !important; gap: 6px !important; }
  .legend-icons { min-width: 80px !important; }

  /* Gli stati (Participation/Roster) si impilano, ma le due icone restano in linea */
  a.status-icons { 
    display: flex !important; 
    flex-direction: column !important; 
    align-items: center !important; 
    gap: 6px !important; 
  }
  .icon-block {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    white-space: nowrap !important;
    margin: 0 !important;
    text-align: center !important;
  }
}

/* Leggibilità colonna nomi (seconda colonna) in tabella partecipanti */
.bulletin-table tbody tr td:nth-child(2),
.bulletin-table tbody tr td:nth-child(2) a,
.bulletin-table tbody tr td:nth-child(2) span {
  color: #0c3e0c !important;
}

/* === Hotfix: legend + background ghost + bold (<b>) ====================== */

/* <b> che sia davvero bold ovunque (Fotis può usare <strong> o <b>) */
b { font-weight: 700 !important; }

/* Niente overlay extra */
.background-container:after { display: none !important; }

/* Mobile: spegni gli "spotlight" radiali e la trasparenza della carta */
@media (max-width: 768px) {
  .background-container{
    /* solo il gradiente lineare, niente bagliori che sembrano bottoni */
    background: linear-gradient(
      135deg, var(--bg1) 0%, var(--bg2) 55%, var(--bg3) 100%
    ) !important;
  }
  /* carta non traslucida: smette di “vedersi dietro” */
  .innercontent{ background: #fff !important; box-shadow: 0 8px 24px rgba(0,0,0,.20); }
}

/* Legenda: una sola verità semplice e coerente (nuova e legacy) */
.legend,
table.legend,
.textTable > tbody > tr > td:first-child > table.textTable {
  background: rgba(1,153,50,.12) !important;
  border: 1px solid #cfead4 !important;
  border-radius: 10px !important;
  margin: 6px 0 8px !important;
  overflow: hidden !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}
.legend-row,
table.legend tr td,
.textTable > tbody > tr > td:first-child > table.textTable tr td {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 12px !important;
  background: transparent !important;
}
table.legend tr + tr td,
.textTable > tbody > tr > td:first-child > table.textTable tr + tr td {
  border-top: 1px solid #e5f3ea !important;
}
.legend-row:first-child { border-top: 0 !important; }
.legend-icons { display:inline-flex !important; align-items:center !important; gap:6px !important; min-width:88px !important; }

/* Spazio compatto tra legenda e tabella */
.legend + br { display: none !important; }
.legend + br + .table.bulletin-table,
table.textTable + br + .table.bulletin-table { margin-top: 8px !important; }

/* Legenda: layout solido e allineato */
.legend-row{
  display:flex !important;
  align-items:center !important;   /* centro verticale */
  gap:8px !important;
  padding:8px 12px !important;
}
.legend-icons{
  display:inline-flex !important;
  align-items:center !important;
  gap:6px !important;
  min-width:88px !important;       /* “colonna” icone fissa */
}
/* Icone coerenti */
.legend .icon-status{
  font-size:18px !important;
  line-height:1 !important;
  vertical-align:middle !important;
}

/* Variante legacy (se la legenda è markuppata come tabella annidata) */
.textTable > tbody > tr > td:first-child > table.textTable tr td{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  padding:8px 12px !important;
}
.textTable > tbody > tr > td:first-child > table.textTable tr td:first-child{
  min-width:88px !important;       /* “colonna” icone fissa anche qui */
  display:inline-flex !important;
  gap:6px !important;
}

/* Mobile: margini compatti, no sticky */
@media (max-width:768px){
  .legend{ position:static !important; }
  .legend-row{ padding:6px 10px !important; gap:6px !important; }
  .legend-icons{ min-width:80px !important; }
}

/* LEGEND: layout a griglia con colonna icone fissa */
.legend{ text-align:left !important; }
.legend-row{
  display:grid !important;
  grid-template-columns: 92px 1fr !important;  /* colonna icone + colonna testo */
  align-items:center !important;
  column-gap:8px !important;
  padding:8px 12px !important;
}

/* Blocco icone: non si restringe e resta in linea */
.legend-icons{
  display:inline-flex !important;
  align-items:center !important;
  gap:6px !important;
  min-width:92px !important;
  flex-shrink:0 !important;
}

/* Icone FontAwesome con larghezza fissa: niente “ballo” della riga */
.legend .icon-status{
  display:inline-block !important;
  width:1.25em !important;       /* stessa larghezza per ✓ e ✗ */
  text-align:center !important;
  line-height:1 !important;
  vertical-align:middle !important;
}

/* Compatta su schermi stretti */
@media (max-width: 480px){
  .legend-row{ grid-template-columns: 82px 1fr !important; }
  .legend-icons{ min-width:82px !important; }
}

/* Se la legenda sta dentro una cella centrata, annulla l’allineamento */
.legend *{ text-align:left !important; }