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

   Corregge due difetti di impaginazione del tema originale:
   1. tre blocchi di sezione stanno fuori da `.container`, quindi occupano
      tutta la larghezza della finestra e le loro `.row`, che portano i
      margini negativi di Bootstrap, sfondano di 15 px per lato;
   2. il testo del corpo sta a 14 px e la riga arriva a un centinaio di
      caratteri sugli schermi larghi.
   ========================================================================= */

/* ---------- 1. Il contenitore che manca ----------------------------------
   Questi blocchi sono figli diretti di `section` o di `.casino-wrapper`,
   non di `.container`:
   `.play-slots-wrap` (griglia degli automati), `.guide-text-wrap` (guida e
   domande frequenti), `.review-outer-wrap` (fisarmonica dei criteri),
   `.similar-promo` e i blocchi gemelli delle pagine di recensione.
   Qui ricevono le stesse misure di `.container`: larghezza massima 1170 px,
   margini automatici e i 15 px di riempimento che compensano i margini
   negativi delle `.row` che contengono. */
.play-slots-wrap,
.guide-text-wrap,
.review-outer-wrap,
.similar-promo,
.summary-wrap,
.like-dislike-wrap,
.software-wrap{
  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;
}

/* la griglia degli automati aveva 140 px fissi per lato, che su uno schermo
   stretto lasciavano meno di cento pixel al contenuto */
.play-slots-wrap{padding-left:15px;padding-right:15px}

/* il carosello degli automati resta dentro il suo riquadro */
.slick-slider,.play-slots-slider{max-width:100%}
.slick-list{overflow:hidden!important;max-width:100%}

/* un `.container` annidato dentro 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}

/* la fascia del carosello si chiude su sé stessa: la striscia delle immagini
   è più larga del riquadro per costruzione e non deve trascinare la pagina */
.play-slots-wrap{overflow:hidden}

/* le parole lunghe vanno a capo invece di allargare la pagina: un titolo
   della pagina degli automati sforava da solo di 34 px su schermo stretto */
h1,h2,h3,h4,h5,h6,
.casino-contant p,.casino-contant li,.art p,.art li,
.nk-wrap p,.rev-wrap p,.met-wrap p,td,th{overflow-wrap:break-word;word-wrap:break-word}

/* nessun elemento del contenuto può essere più largo del suo contenitore */
.casino-contant img,
.casino-contant iframe,
.casino-contant video{max-width:100%;height:auto}

/* le tabelle larghe scorrono dentro il loro riquadro, non trascinano la pagina.
   Le pagine ricostruite stanno in `.art`, `.met-wrap` e `.rev-wrap`, che non
   sono dentro `.casino-contant`: il selettore le prende tutte. */
.art table,.met-wrap table,.rev-wrap table,.nk-wrap table,.casino-contant table{
  display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%;width:100%}

/* il piè di pagina a colonne della toplist porta `flex` negli attributi di
   stile delle colonne, che non si lasciano restringere: qui tornano elastiche */
.nk-footer-cols{display:flex;flex-wrap:wrap;gap:24px;width:100%;max-width:1080px;margin:0 auto;box-sizing:border-box}
.nk-footer-cols > *{min-width:0;max-width:100%;flex:1 1 280px!important}

/* ---------- 2. Un solo sistema tipografico -------------------------------
   Il corpo stava a 14 px, e i fogli delle pagine ricostruite portavano
   misure proprie. Qui il testo del contenuto ha due misure sole e una
   lunghezza di riga leggibile. */
.casino-contant,
.casino-contant p,
.casino-contant li,
.casino-contant .text p,
.guide-text p,
.guide-text li{font-size:16px;line-height:1.7}
@media (min-width:768px){
  .casino-contant,
  .casino-contant p,
  .casino-contant li,
  .casino-contant .text p,
  .guide-text p,
  .guide-text li{font-size:17px}
}
/* la colonna di testo non supera le ottanta battute circa */
.guide-text p,
.casino-contant .text > p{max-width:68ch}
.guide-text-wrap .col-md-12 .guide-text p{max-width:68ch}

/* ---------- 3. Accessibilità di base ------------------------------------- */
.casino-contant a:focus-visible,
.casino-header a:focus-visible,
.nk-footer a:focus-visible,
button:focus-visible{outline:3px solid #4d0099;outline-offset:2px}
.navbar-nav > li > a{min-height:44px;display:flex;align-items:center}
@media (prefers-reduced-motion:reduce){
  .thumb-block,.bnpr-card,.casino-contant *{transition:none!important;animation:none!important}
}
/* il testo del piè di pagina stava a rgba(0,0,0,.3): illeggibile */
.casino-footer .text p{color:#5b6370}
