/* EBL Microsite — minimal, clean */

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

/* Palette */
:root{
  --aqua:        #4fd1c5;
  --aqua-200:    #7fe3db;
  --jade:        #1c9a73;
  --emerald:     #157a5a;
  --teal-deep:   #0d3f3b;
  --champagne:   #c9b27a;
  --paper:       #ffffff;
  --porcelain:   #f7fbfa;
  --ink:         #142a27;
  --ink-soft:    #274540;
  --hairline:    #cfe9e4;
}

/* Base */
body{font-family:'Open Sans',sans-serif;background:#f7f9f8;color:#252525;}
p{font-size:1em;}
a{cursor:pointer;color:var(--emerald);font-weight:bold;background:transparent;}
a:hover{text-decoration:none;border-bottom:1px solid var(--aqua);}
h2{font-size:1.7em;color:var(--emerald);display:block;width:100%;}
h3{font-size:1.5em;color:var(--aqua);display:block;width:100%;}
h4{font-size:1.3em;color:#075f07;display:block;width:100%;}

/* Background container */
.background-container{
  background:
    radial-gradient(900px 520px at 8% 0%, rgba(127,227,219,.25), transparent 60%),
    radial-gradient(700px 420px at 100% 100%, rgba(21,122,90,.12), transparent 55%),
    linear-gradient(160deg, var(--porcelain) 0%, #faffff 100%) !important;
  top:0;left:0;width:100%;height:100%;overflow:hidden !important;
}
.background-container:after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;display:none !important;}

/* Branding blocks */
#logo,#ioc{text-align:center;padding:9px;}
#logo img,#ioc img{max-width:100%;height:auto;}

/* Content card */
.innercontent{
  margin:0 auto;background:var(--paper);position:relative;min-height:500px;height:100%;
  z-index:1;color:#252525;padding-bottom:4px;border:1px solid var(--hairline);
  border-radius:14px;box-shadow:0 10px 28px rgba(13,63,59,.12);
}

/* Header */
#header{
  color:#fff;background:linear-gradient(180deg,var(--aqua) 0%,var(--jade) 60%,var(--emerald) 100%) !important;
  padding:22px 16px 16px;border-radius:14px 14px 10px 10px;border:1px solid rgba(255,255,255,.28);
}
.site-title{font-weight:600;border-bottom:1px solid rgba(255,255,255,.22);display:block;color:rgba(255,255,255,.95);}
div#header h1{display:block;color:#fff;font-size:25px;line-height:1.22;margin:0 0 10px;border:0;text-shadow:0 1px 0 rgba(0,0,0,.18);}
#data{
  display:inline-block;margin-top:-5px;background:rgba(0,0,0,.26);color:#f5fffd;
  font-size:18px;border:1px solid rgba(255,255,255,.24);border-radius:999px;padding:6px 12px;font-weight:600;letter-spacing:.2px;
}

/* Menu/info */
#menu-bar{background:#00223E;height:100px;width:100%;display:block;}
#menu-info{margin-top:-10px;padding:10px 10px 5px;border-bottom:8px solid var(--emerald);}
#menu-info ul{list-style-type:none;margin:0;padding:0;}
#menu-info ul li{margin-bottom:4px;border-bottom:1px dotted #ddd;padding-bottom:1px;}
#menu-info a{font-weight:600;color:var(--emerald);padding:2px;display:inline-block;}

/* Layout helpers */
.center{text-align:center;}
.medium{width:60%;margin:0 auto;}
.border-right{border-right:1px solid var(--hairline);min-height:100px;height:auto;}
.contentEBLMP{background:#fff;min-height:500px;height:100%;position:relative;z-index:1;color:#252525;padding-top:10px;}
.page-content{padding-bottom:40px;}
strong{font-weight:700;}

/* Tables */
.table{margin-top:15px;width:100%;margin-bottom:30px;overflow-x:auto;}
table{border-collapse:separate;border-spacing:0;width:100%;}
th{background:linear-gradient(180deg,var(--aqua-200),var(--aqua)) !important;color:#083a35;border-bottom:1px solid var(--hairline);box-shadow:inset 0 -1px 0 rgba(201,178,122,.25);}
table a{color:var(--emerald);text-decoration:none;border-bottom:none;background:none;}
#table-scroll{overflow-x:auto;}

/* Participants table */
.bulletin-table{
  text-align:center;border:1px solid var(--hairline);border-radius:12px;overflow:hidden;background:var(--paper);
}
.bulletin-table tr{transition:background .15s ease, box-shadow .15s ease;}
.bulletin-table tbody tr:hover{background:linear-gradient(180deg, rgba(79,209,197,.14), rgba(255,255,255,.7));}
.bulletin-table td{padding:10px 12px;color:var(--ink);border-bottom:1px solid var(--hairline);vertical-align:middle;}
.bulletin-table th{background:var(--emerald);color:#fff;}
.bulletin-table tr th{background:var(--emerald);text-align:center;vertical-align:middle;border:1px solid var(--emerald);}
.bulletin-table tr{border-bottom:2px solid #075f07;}
/* Legacy header rows */
.bulletin-table tbody tr:first-child td[bgcolor]{background:rgba(79,209,197,.18) !important;color:var(--teal-deep) !important;border-bottom:1px solid var(--hairline) !important;font-weight:700;}
.bulletin-table tbody tr:nth-child(2) td{background:#fff !important;color:var(--emerald) !important;font-weight:600;border-top:0 !important;border-bottom:1px solid var(--hairline) !important;}
/* Column alignment */
.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;}
.bulletin-table td img[alt]{border:1px solid #000;display:inline-block;vertical-align:middle;}

/* Status icons */
.icon-status{font-size:18px;line-height:1;vertical-align:middle;margin:0 2px;}
.icon-yes{color:#019932;}
.icon-no{color:#d20128;}
.icon-block{display:inline-flex;align-items:center;gap:6px;margin:0 10px;white-space:nowrap;}
a.status-icons{display:inline-flex;align-items:center;gap:10px;}

/* Legend */
.legend{background:rgba(79,209,197,.18);border:1px solid var(--hairline);border-radius:10px;margin:6px 0 8px;overflow:hidden;}
.legend-row{display:flex;align-items:center;gap:8px;padding:8px 12px;border-top:1px solid #e5f3ea;}
.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;line-height:1;vertical-align:middle;}
/* Tighten gap before table even with stray <br> */
.legend + br{display:none !important;}
.legend + br + .table.bulletin-table{margin-top:8px !important;}

/* Footer */
footer{background:linear-gradient(180deg,var(--teal-deep),#0a2f2c);text-align:center;padding:15px;width:120%;margin-left:-10%;position:relative;z-index:2;color:#eafff9;}
footer p{color:inherit;}
footer a{color:var(--champagne);background:none;}
footer a:hover{text-decoration:underline;color:#fff;}

/* Small tweaks */
blockquote p{color:#5c5c5c;font-size:.8em;font-style:italic;}
.subtitle{font-style:italic;color:green;}
a.winner{color:#E4232B;}

/* Responsive */
@media (max-width:768px){
  #header-row1{height:auto;text-align:center;padding:15px 0;margin:0;}
  .background-container{padding:0 5%;}
  .medium{width:100%;}
  #topbar{display:block;min-height:255px;}
  #ioc{display:none;}
  div#header h1{font-size:24px;}
  #data{font-size:14px;padding:6px 10px;}
  /* Stack status blocks, keep icons inline inside each block */
  a.status-icons{display:flex;flex-direction:column;align-items:center;gap:6px;}
  .icon-block{margin:0;gap:4px;}
}


/* Restore centered content with side gutters */
:root{
  --page-gutter: clamp(14px, 3vw, 28px);
  --max-page: 1100px;            /* tweak if you want wider/narrower */
}

.innercontent{
  max-width: var(--max-page);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--page-gutter);
  padding-right: var(--page-gutter);
  width: 100%;                   /* keep responsive */
}

/* Optional: add soft page padding so background isn't glued to edges */
.background-container{
  padding-left: max(0px, calc(50% - var(--max-page)/2));
  padding-right: max(0px, calc(50% - var(--max-page)/2));
}

/* If the footer sticking out at 120% bothers you, normalize it */
footer{
  width: auto;
  margin-left: 0;
}

/* --- Kill the random horizontal scroll --- */
html, body { overflow-x: hidden; }                /* rete di sicurezza */

/* niente padding laterale sul wrapper a larghezza piena */
.background-container { padding-left: 0; padding-right: 0; }

/* centro vero con gutters senza sforare */
:root{
  --page-gutter: clamp(14px, 3vw, 28px);
  --max-page: 1100px;
}
.innercontent{
  max-width: var(--max-page);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--page-gutter);
  padding-right: var(--page-gutter);
  box-sizing: border-box;                          /* evita overflow da padding */
}

/* footer normalizzato: niente 120%, niente -10% */
footer{
  width: 100% !important;
  margin-left: 0 !important;
  padding-left: var(--page-gutter);
  padding-right: var(--page-gutter);
}

/* immagini e tabelle non superano il viewport */
img{ max-width: 100%; height: auto; }
table{ max-width: 100%; }

/* Full-bleed header inside padded card */
:root{
  --page-gutter: clamp(14px, 3vw, 28px);
  --card-radius: 14px;
}

/* the card keeps its side padding, but clips children at the radius */
.innercontent{
  padding-left: var(--page-gutter);
  padding-right: var(--page-gutter);
  border-radius: var(--card-radius);
  overflow: hidden;                /* clip to rounded corners */
  box-sizing: border-box;
}

/* make the header stretch to the card edges */
#header{
  margin-left: calc(-1 * var(--page-gutter));
  margin-right: calc(-1 * var(--page-gutter));
  border-top-left-radius: var(--card-radius);
  border-top-right-radius: var(--card-radius);
  /* optional micro shadow for separation from content */
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.08);
}

/* keep the title line neatly aligned with the full-bleed header */
#header .site-title{
  padding-left: var(--page-gutter);
  padding-right: var(--page-gutter);
  border-bottom: 1px solid rgba(255,255,255,.22);
}

/* ensure the big H1 doesn’t reintroduce side gaps */
div#header h1{
  margin-left: var(--page-gutter);
  margin-right: var(--page-gutter);
}

/* safety on small screens: no overflow from negative margins */
@media (max-width: 768px){
  .innercontent{ padding-left: 16px; padding-right: 16px; }
  #header{ margin-left: -16px; margin-right: -16px; }
  #header .site-title, div#header h1{ margin-left: 16px; margin-right: 16px; }
}