/* =========================================================================
   layout-fix.css — meilleurscasinos.net
   Va caricato PER ULTIMO su tutte le pagine, con il parametro di versione:
       <link href="/css/layout-fix.css?v=2026101402" rel="stylesheet">

   Corregge gli sforamenti e le misure del tema di base (Bootstrap 3.3.7,
   style.css, responsive.css). Non tocca il markup: un foglio che non lo
   tocca si ritira togliendo una riga.
   ========================================================================= */

/* ---------- 1. Niente sfora dal contenitore ------------------------------
   Le `.row` di Bootstrap portano margini negativi di 15 px per lato: un
   blocco che sta fuori da `.container` e contiene una `.row` sfonda di
   trenta pixel. Questi blocchi sono figli di `section` o di
   `.casino-contant`, non di `.container`. */
.welcome-wrap,
.guide-text-wrap,
.play-slots-wrap,
.policy-wrap,
.review-wrap,
.similar-promo{
  float:none;
  clear:both;
  width:auto;
  max-width:1170px;
  margin-left:auto;
  margin-right:auto;
  padding-left:15px;
  padding-right:15px;
  box-sizing:border-box;
}

/* un `.container` annidato in un altro riprende la larghezza fissa di
   Bootstrap e somma un secondo riempimento: qui si adatta al padre */
.container .container{width:auto;max-width:100%;padding-left:0;padding-right:0}

/* il carosello si chiude su sé stesso: la striscia delle immagini è più
   larga del riquadro per costruzione e non deve trascinare la pagina */
.play-slots-wrap,
.slick-slider{overflow:hidden;max-width:100%}
.slick-list{overflow:hidden!important;max-width:100%}

/* ---------- 1-bis. La prosa non flotta -----------------------------------
   Il tema fa flottare a sinistra `.text` e i suoi paragrafi, con
   `width:100%`: finché occupano tutta la riga non si nota. Appena la
   colonna di lettura viene limitata a 68 battute, i paragrafi diventano
   più stretti della riga, e i titoli e i riquadri, che non flottano, si
   dispongono accanto invece che sotto: il testo si spezza in due colonne
   che nessuno ha voluto. La prosa torna nel flusso normale. */
.casino-contant .text > p,
.casino-contant .text > ul,
.casino-contant .text > ol,
.casino-contant .text > figure,
.guide-text > p,
.guide-text > ul,
.overflow-text > p{float:none;width:auto}

/* Il tema fa flottare `.text` e ogni `p` che vi sta dentro, a qualunque
   profondità: dentro una figura o un riquadro, il paragrafo d'asse flotta e
   la prima riga del grafico si dispone accanto a lui invece che sotto. Il
   flottamento si toglie a tutta la prosa annidata, non ai soli figli
   diretti, perché il difetto non si vede nei numeri: si vede guardando. */
.casino-contant .text p,
.casino-contant .text figure,
.casino-contant .text ul,
.casino-contant .text ol,
.casino-contant .text table,
.casino-contant .text .gr,
.casino-contant .text .gr__riga,
.casino-contant .text .ar-fiche,
.casino-contant .text .mc-box{float:none}

/* i titoli e i riquadri cominciano sempre una riga nuova */
.casino-contant .text > h2,
.casino-contant .text > h3,
.casino-contant .text > h4,
.casino-contant .text > .mc-box,
.casino-contant .text > .mc-registro{clear:both}

/* le parole lunghe vanno a capo invece di allargare la pagina */
h1,h2,h3,h4,h5,h6,
.casino-contant p,.casino-contant li,
.guide-text p,.guide-text li,
.overflow-text p,
.popup-content p,
td,th{overflow-wrap:break-word;word-wrap:break-word}

/* nessun elemento del contenuto è più largo del suo contenitore */
.casino-contant img,
.casino-contant iframe,
.casino-contant video,
.guide-text img,
.review-thumb img{max-width:100%;height:auto}

/* ---------- 2. Le tabelle degli operatori --------------------------------
   La lista degli operatori è una tabella con sette colonne
   (`rank-td`, `name-td`, `badge-td`, `bonus-td`, `features-td`,
   `rating-td`, `play-td`). Sotto i 768 px non ci sta: scorre dentro il
   suo riquadro invece di trascinare la pagina. */
.casino-contant table,
.guide-text table,
.table-responsive > table{
  display:block;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  max-width:100%;
  width:100%;
}
.casino-contant table th,
.casino-contant table td{white-space:normal}
.bonus-td,.features-td{min-width:160px}
.name-td{min-width:130px}
.play-td{min-width:120px}

/* la colonna delle caratteristiche non si schiaccia a una parola per riga */
.features-list,
.key-features{padding-left:18px;margin:0}
.features-list li,
.key-features li{line-height:1.55}

/* ---------- 3. Il testo espandibile -------------------------------------
   `.overflow-text` si apre e si chiude con `.open` e `.close`: senza
   JavaScript il contenuto resta leggibile invece di restare nascosto. */
.overflow-text{max-width:100%}
.no-js .overflow-text{max-height:none!important;overflow:visible!important}

/* ---------- 4. Il riquadro della finestra dei termini -------------------- */
.popup-overlay{
  position:fixed;inset:0;
  background:rgba(35,31,32,.55);
  display:none;
  align-items:center;justify-content:center;
  padding:16px;
  z-index:900;              /* sotto il banner del consenso, che sta a 1000 */
}
.popup-overlay.open{display:flex}
.popup-content{
  background:#fff;
  max-width:620px;width:100%;
  padding:22px 24px;
  position:relative;
}
.popup-content .close{
  position:absolute;top:6px;right:8px;
  cursor:pointer;color:#565d68;
}

/* ---------- 5. La griglia a otto larghezze ------------------------------
   `responsive.css` ha otto punti di rottura, fra cui 715 px, che non
   corrisponde a nessuna misura di Bootstrap. Sotto i 768 px le colonne si
   impilano invece di restare affiancate a una larghezza insufficiente. */
@media (max-width:767px){
  .welcome-wrap .row > [class*="col-"],
  .guide-text-wrap .row > [class*="col-"]{float:none;width:100%}
  .col-md-offset-2,.col-sm-offset-2{margin-left:0}
  .section-heading-1{text-align:left}
  .casino-contant .text > p,
  .guide-text > p{max-width:none}
}

/* ---------- 6. Il piè di pagina a colonne ------------------------------- */
.casino-footer .row > [class*="col-"]{min-width:0}
.casino-footer img{max-width:100%;height:auto}

/* Schede dei marchi dentro .casino-contant .text: il tema colora e sottolinea
   ogni <a> del contenuto, e il pulsante «Visiter» finiva viola su viola. */
.casino-contant .text .bnpr-cta .btn-visit,
.casino-contant .text .bnpr-cta .btn-visit:hover,
.casino-contant .text .bnpr-cta .btn-visit:focus{color:#fff;text-decoration:none}
.casino-contant .text .bnpr-cta .link-review{color:var(--mc-primary-dark)}
.casino-contant .text .bnpr-card,.casino-contant .text .bnpr-list{float:none;width:auto}
.casino-contant .text .bnpr-card p{float:none;width:auto;margin:0}
.casino-contant .text .bnpr-logo img{float:none;margin:0}

/* Domande frequenti: le classi del foglio del sito, ma sempre aperte. Il sito
   non carica più jQuery, e `faq.css` nasconde .faq-a in attesa di un clic che
   nessuno script raccoglierebbe: una risposta che non si può aprire non è una
   risposta visibile, e il FAQPage dichiarerebbe allora una cosa falsa. */
.faq-wrap .faq-a{display:block;background:transparent;border-bottom:0;padding:0 0 14px;font-size:16px;line-height:1.65}
.faq-wrap .faq-q{cursor:auto;padding:0 0 6px;border-bottom:0;font-size:clamp(17px,1.9vw,19px)}
.faq-wrap .faq-q:after{content:none}

/* Il tema tratta ogni <a> del contenuto come un pulsante: 25 px di spazio a
   sinistra e a destra, che in mezzo a una frase aprono due buchi. I link di
   prosa tornano in linea; i pulsanti veri tengono il loro spazio. */
.welcome-wrap .text a{padding-left:0;padding-right:0;margin-bottom:0}
.welcome-wrap .text .bnpr-cta .btn-visit{padding:11px 18px}
.welcome-wrap .text .btn,.welcome-wrap .text .play-now a{padding-left:18px;padding-right:18px}

/* Il titolo del tema flotta (.section-heading-1). Un blocco che viene dopo e
   non flotta parte dalla cima: il riquadro della divulgazione si stendeva
   dietro al titolo, e la colonna flessibile, che non scavalca i flottanti,
   si riduceva alla striscia rimasta accanto a lui. Ripartono sotto. */
.welcome-wrap > .mc-divulgazione,
.welcome-wrap > .mc-colonne{clear:both}
