/* components.css — Componenti editoriali per Bonus Sem Depósito
   Estendono il design del sito (Open Sans, accento #d81d04, blocchi arrotondati,
   palette a gradienti). Prefisso .ed- per evitare conflitti con styles.css.
   Le icone usano "Font Awesome 5 Free" (già caricato nelle pagine). */

/* ---- Pannello pagina: card bianca che si solleva sull'hero scuro ---- */
.ed-page{
  background:#fff;
  border-radius:10px;
  box-shadow:0 12px 30px rgba(0,0,0,.10);
  padding:48px;
  margin:-56px auto 0;
  position:relative;
  z-index:2;
}

/* ---- Riga meta (autore / aggiornamento) per freschezza E-E-A-T ---- */
.ed-meta{
  font-size:13px;
  color:#6b6f7a;
  margin:0 0 28px;
  padding-bottom:16px;
  border-bottom:1px solid #e6e8ef;
}
.ed-meta strong{color:#1d1d1d;font-weight:700;}

/* ---- Paragrafo introduttivo ---- */
.ed-lead{font-size:18px;line-height:1.7;color:#2a2d35;margin-bottom:28px;}

/* ---- Tipografia long-form (ritmo più leggibile del default 35px) ---- */
.ed-article h2{font-size:1.85em;font-weight:700;margin:42px 0 16px;}
.ed-article > :first-child{margin-top:0;}
.ed-article h3{font-size:1.35em;font-weight:700;margin:30px 0 12px;}
.ed-article p{margin-bottom:18px;}
.ed-article ul,.ed-article ol{margin:0 0 18px 22px;}
.ed-article li{margin-bottom:8px;}
.ed-article a{color:#d81d04;font-weight:600;}
.ed-article a:hover{color:#a21805;}
.ed-article a:focus-visible{outline:2px solid #005687;outline-offset:2px;}

/* ---- Callout (box informativi) ---- */
.ed-callout{
  position:relative;
  background:#f7f7f7;
  border-radius:8px;
  border-left:6px solid #d81d04;
  padding:20px 24px;
  margin:0 0 28px;
}
.ed-callout-title{
  display:flex;align-items:center;gap:10px;
  font-weight:800;font-size:14px;text-transform:uppercase;letter-spacing:.04em;
  margin:0 0 10px;color:#1d1d1d;
}
.ed-callout-title::before{font-family:"Font Awesome 5 Free";font-weight:900;font-size:18px;line-height:1;}
.ed-callout > :last-child{margin-bottom:0;}
.ed-callout--info{background:#eef4f9;border-left-color:#005687;}
.ed-callout--info .ed-callout-title{color:#0a3252;}
.ed-callout--info .ed-callout-title::before{content:"\f05a";color:#005687;}      /* info */
.ed-callout--risk{background:#fdecea;border-left-color:#d81d04;}
.ed-callout--risk .ed-callout-title{color:#a21805;}
.ed-callout--risk .ed-callout-title::before{content:"\f071";color:#d81d04;}      /* attenzione */
.ed-callout--safe{background:#eaf5ee;border-left-color:#1f7a3d;}
.ed-callout--safe .ed-callout-title{color:#0f5226;}
.ed-callout--safe .ed-callout-title::before{content:"\f058";color:#1f7a3d;}      /* ok */
.ed-callout--note{background:#f1f2f5;border-left-color:#8a8f9a;}
.ed-callout--note .ed-callout-title{color:#3a3d44;}
.ed-callout--note .ed-callout-title::before{content:"\f0c1";color:#6b6f7a;}      /* disclosure (link) */

/* ---- Griglia criteri (metodologia) ---- */
.ed-criteria{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px;
  margin:0 0 28px;padding:0;list-style:none;
}
.ed-criteria li{margin:0;background:#fff;border:1px solid #e6e8ef;border-radius:8px;padding:18px 20px;}
.ed-crit-name{display:flex;align-items:center;gap:10px;font-weight:700;font-size:15px;margin-bottom:8px;color:#1d1d1d;}
.ed-crit-name::before{font-family:"Font Awesome 5 Free";font-weight:900;color:#d81d04;font-size:17px;width:22px;text-align:center;flex:none;}
.ed-crit-desc{font-size:13px;color:#4a4d57;line-height:1.6;margin:0;}
.ic-license::before{content:"\f3ed";}   /* shield */
.ic-terms::before{content:"\f15c";}     /* documento */
.ic-payout::before{content:"\f51e";}    /* moedas */
.ic-games::before{content:"\f522";}     /* dado */
.ic-support::before{content:"\f590";}   /* headset */
.ic-mobile::before{content:"\f3cd";}    /* celular */
.ic-rep::before{content:"\f005";}       /* estrela */

/* ---- Indice (TOC) per articoli lunghi ---- */
.ed-toc{background:#fff;border:1px solid #e6e8ef;border-left:6px solid #1d1d1d;border-radius:8px;padding:18px 24px;margin:0 0 28px;}
.ed-toc-title{font-weight:800;text-transform:uppercase;font-size:12px;letter-spacing:.06em;margin-bottom:10px;}
.ed-toc ul{margin:0 0 0 18px;padding:0;}
.ed-toc li{margin-bottom:6px;}

/* ---- Archivio: scheda "Encerrado" ---- */
.ed-encerrado{background:#f1f2f5;border:1px solid #d9dbe3;border-radius:8px;padding:20px 24px;margin:0 0 22px;}
.ed-badge{display:inline-block;background:#6b6f7a;color:#fff;font-weight:800;font-size:11px;text-transform:uppercase;letter-spacing:.06em;padding:4px 11px;border-radius:4px;margin-bottom:10px;}
.ed-encerrado h3{margin:6px 0 8px;font-size:1.3em;}
.ed-encerrado > :last-child{margin-bottom:0;}

/* ---- Responsive ---- */
@media(max-width:767px){
  .ed-page{padding:26px;margin-top:-28px;}
  .ed-lead{font-size:16px;}
  .ed-article h2{font-size:1.55em;}
}
