/* =====================================================================
   layout-fix.css — online-casinos.ws
   Foglio di sovrascrittura del kit per la famiglia G (il tema proprio del
   sito: css/main.css da normalize.css, css/override.css con le liste
   modern-extable e modern-casino-data, review-C.css e casino-specs-C.css).
   Si carica per ultimo su tutte le pagine, con il parametro di versione
   (css/layout-fix.css?v=AAAAMMGG). I fogli del tema restano come sono:
   ogni correzione sta qui, e si ritira togliendo una riga.

   Che cosa corregge e aggiunge:
    1. le variabili del sito (:root): l'unico blocco che cambia fra siti;
    2. la scala del testo di lettura: main.css porta html a 13 px (12 sotto
       i 980) e la prosa a 1rem; qui 16 px sul telefono e 17 da 961 px;
    3. il menu principale: ul fuori dall'a, tendina larga e leggibile,
       raggiungibile da tastiera, sottomenu sempre aperti sul telefono;
    4. la lista rapida: striscia scorrevole sotto i 1024 px che non allarga
       la pagina; voce attiva con testo scuro (il bianco sul verde era 2,0:1);
    5. i pulsanti verdi con testo scuro (8,4:1) al posto del bianco;
    6. il piè di pagina: frase sui mercati, divulgazione, aiuto, link a 4,5:1;
    7. il riquadro in evidenza della colonna con una sola scheda;
    8. le schede degli operatori e le liste sul telefono: niente colonne
       strette, immagini dentro la scheda, tabelle scorrevoli;
    9. i riquadri colorati: informazione, avvertenza, conferma, testimonianza
       storica, divulgazione, mercati (classi .oc-box);
   10. le briciole di pane (prima in uno <style> inline su ogni pagina);
   11. il banner del consenso del kit (.cc-) e la pagina 404;
   12. il carosello della colonna (owl) chiuso nel suo contenitore;
   13. l'accessibilità: fuoco visibile, movimento ridotto, parole lunghe;
   14. le testate chiare di override.css dentro le sezioni scure di main.css;
   15. il pulsante «Visit» in fondo alle recensioni;
   16. il riquadro d'apertura della home, delle liste e delle slot alla stessa scala di lettura;
   17. i testi piccoli sul telefono e la prosa sotto la lista della home.
   ===================================================================== */

/* ---------- 1. Variabili ---------- */
:root{
  --c-brand:#bf0000;          /* il rosso del tema: 6,5:1 con il bianco */
  --c-brand-dark:#8f0000;
  --c-green:#9fc438;          /* il verde del tema: testo scuro sopra (8,4:1), mai bianco */
  --c-green-dark:#55780f;     /* verde per testo su bianco: 5,6:1 */
  --c-ink:#1d1d1d;
  --c-text:#2c2c2c;
  --c-muted:#5f6368;          /* grigio per note: 5,9:1 su bianco */
  --c-line:#e1e1e3;
  --c-focus:#1d4ed8;
  --c-link-footer:#ffe08a;    /* link sul rosso del piè di pagina: 9,1:1 */
  --c-link-banner:#ffd24d;
  --fs-read:16px;
  --fs-read-lg:17px;
  --lh-read:1.65;
  --radius:10px;
  --box-info-bg:#eef4fb;  --box-info-line:#2b6cb0;  --box-info-ink:#17365d;
  --box-warn-bg:#fff4e5;  --box-warn-line:#d97706;  --box-warn-ink:#7a3b00;
  --box-ok-bg:#eaf5ee;    --box-ok-line:#1f7a3d;    --box-ok-ink:#0f5226;
  --box-hist-bg:#f4f1ea;  --box-hist-line:#8a6d3b;  --box-hist-ink:#4a3a1f;
  --box-disc-bg:#f1f2f5;  --box-disc-line:#6b6f7a;  --box-disc-ink:#3a3d44;
}

/* ---------- 2. Testo di lettura: una sola scala ---------- */
/* main.css lega html a 13 px (12 sotto i 980) e il colore del testo a #a4a4a4: qui la colonna
   dei contenuti eredita una misura e un colore leggibili; i componenti con le loro misure in rem
   non cambiano, perché rem resta legato a html */
.main_body,.main_content,.simple-center-content{ color:var(--c-text); font-size:var(--fs-read); line-height:var(--lh-read); }
.main_sidebar{ color:var(--c-text); }
.main_body p,.main_body li,.main_body td,.main_body th,.main_body dd,.main_body dt,.main_body blockquote,.main_body span:not([class]),.main_body font{ color:inherit; }
.main_content article p:not([class]),
.main_content article li:not([class]),
.main_content article blockquote p,
.main_content .oc-prose p,
.main_content.oc-prose p,
.main_content .oc-prose li,
.main_content.oc-prose li,
.main_content .oc-prose-lead,
.main_content .simple-center-content p,
.page-404 .lead-404,
.page-404 li{ font-size:var(--fs-read); line-height:var(--lh-read); }
.main_content article p:not([class]) a,.main_content article li:not([class]) a,.main_content .oc-prose p a,.main_content.oc-prose p a{ font-size:inherit; line-height:inherit; }
.main_body h2,.main_body h3,.main_body h4{ color:var(--c-ink); }
.main_content article h2,.main_content .oc-prose h2,.main_content.oc-prose h2{ font-size:1.5rem; line-height:1.3; margin:1.4em 0 .6em; }
.main_content article h3,.main_content .oc-prose h3,.main_content.oc-prose h3{ font-size:1.25rem; line-height:1.35; margin:1.2em 0 .5em; }
.main_content article h4{ font-size:1.1rem; line-height:1.35; }
@media (min-width:961px){
  .main_body,.main_content,.simple-center-content{ font-size:var(--fs-read-lg); line-height:1.7; }
  .main_content article p:not([class]),
  .main_content article li:not([class]),
  .main_content article blockquote p,
  .main_content .oc-prose p,
  .main_content.oc-prose p,
  .main_content .oc-prose li,
  .main_content.oc-prose li,
  .main_content .oc-prose-lead{ font-size:var(--fs-read-lg); line-height:1.7; }
}
/* le testate scure del tema (article>header, aside>header, .casinoReview_table>header): titolo bianco */
/* main.css: «.casinoListing header, .casinoReview_details header, .gameListing header, .jeuxCasino header,
   .machineInfo header, .main_sidebar>aside header, .slotReview_details header, .softwareReview header,
   .topTenCasino header, .topTenCasinos header {background-color:#303030; color:#a4a4a4}» (2,3:1): titolo bianco */
.casinoListing>header,.casinoReviewInfo>header,.casinoReview_details>header,.gameListing>header,.jeuxCasino>header,
.machineInfo>header,.slotReview_details>header,.softwareReview>header,.topTenCasino>header,.topTenCasinos>header,
.casinoReview_table>header,.casinoListing>header *,.casinoReviewInfo>header *,.casinoReview_details>header *,
.gameListing>header *,.jeuxCasino>header *,.machineInfo>header *,.slotReview_details>header *,.softwareReview>header *,
.topTenCasino>header *,.topTenCasinos>header *,.casinoReview_table>header *{ color:#fff; }
/* le testate della colonna hanno la sfumatura chiara di override.css con il testo #5c1b1b: restano così */
.casinoListing>header .oc-byline,.jeuxCasino>header .oc-byline,.gameListing>header .oc-byline,.topTenCasinos>header .oc-byline,
.casinoListing>header p,.jeuxCasino>header p,.gameListing>header p,.topTenCasinos>header p{ color:#e6e6e6; }
.main_body article>header h1{ font-size:1.6rem; line-height:1.25; }
/* le testate verdi delle liste di affiliazione e delle classifiche: testo scuro */
.gameListing_casinos li>header h2,.topTenCasinos_list>li>header h2,.topTenCasinos_list>li>header h2 *{ color:var(--c-ink); }
.main_content article ul:not([class]),.main_content .oc-prose ul:not([class]){ list-style:disc; margin:0 0 1.2em 1.3em; }
.main_content article ol:not([class]),.main_content .oc-prose ol:not([class]){ list-style:decimal; margin:0 0 1.2em 1.3em; }
.main_content article ul:not([class]) li,.main_content article ol:not([class]) li{ margin:0 0 .45em; }
.main_content p.oc-byline,.main_content .oc-byline{ font-size:14px; color:var(--c-muted); }
.main_content strong,.main_content b{ color:inherit; }
.main_content .Stile1{ color:inherit; }

/* ---------- 3. Menu principale ---------- */
.nav-main .navList>li>a{ padding:0 8px; min-height:44px; display:flex; align-items:center; justify-content:center; }
.nav-main .navList-inner>a{ position:relative; padding-right:22px; }
.nav-main .navList-inner .icon{ right:6px; }
@media only screen and (min-width:981px){
  .nav-main .navList-inner ul{ height:auto; width:max(100%,260px); left:0; padding:5px 0 6px; background:var(--c-brand); box-shadow:0 10px 24px rgba(0,0,0,.25); z-index:50; text-align:left; }
  .nav-main .navList-inner:last-child ul{ left:auto; right:0; }
  .nav-main .navList-inner ul li{ padding:0; }
  .nav-main .navList-inner ul li a{ display:block; padding:9px 14px; text-align:left; font-size:.95rem; line-height:1.3; text-transform:none; }
  .nav-main .navList-inner ul li.active a{ background:#000; }
  .nav-main .navList-inner:hover ul,
  .nav-main .navList-inner:focus-within ul{ display:block; }
  .nav-main .navList-inner[data-wide] ul{ width:max(100%,520px); columns:2; column-gap:0; }
  .nav-main .navList-inner[data-wide] ul li{ break-inside:avoid; }
}
@media only screen and (max-width:980px){
  .nav-main .navList-inner ul{ display:block; background:#000; }
  .nav-main .navList-inner ul li a{ padding:9px 15px 9px 28px; font-size:.95rem; text-transform:none; }
  .nav-main .navList>li>a{ justify-content:flex-start; }
}

/* ---------- 4. Lista rapida ---------- */
.nav-quick{ overflow:hidden; }
.nav-quick .container{ max-width:100%; }
.nav-quickList{ display:flex; flex-wrap:wrap; justify-content:center; gap:8px; padding:8px 0; margin:0; list-style:none; }
.nav-quickList li{ list-style:none; margin:0; }
.nav-quickList li+li{ margin-left:0; }
.nav-quickList li a{ display:inline-block; padding:8px 14px; font-weight:700; font-size:.95rem; line-height:1.3; color:var(--c-text); border-radius:999px; text-decoration:none; }
.nav-quickList li a:hover,
.nav-quickList li.active a{ background-color:var(--c-green); color:var(--c-ink); }
@media (max-width:1024px){
  .nav-quickList{ flex-wrap:nowrap; justify-content:flex-start; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; padding:8px 12px; max-width:100%; }
  .nav-quickList::-webkit-scrollbar{ display:none; }
  .nav-quickList li{ flex:0 0 auto; }
  .nav-quickList li a{ white-space:nowrap; font-size:.9rem; padding:6px 12px; border:1px solid #ccc; background:#f9f9f9; }
}

/* ---------- 5. Pulsanti verdi: testo scuro ---------- */
.btn-full-green,
.btn-full-green:hover,
.extable-col.cta-col .btn,
.extable-col.cta-col .btn:hover,
.play-now-btn,
.play-now-btn:hover,
.position-icon,
.badge-top,
.topTenCasinos_list header h2{ color:var(--c-ink) !important; }
/* contrasto dei testi piccoli e dei distintivi (misurato nel browser il 9 ottobre 2026) */
.bonus-offer,.bonus-offer.no-deposit,.bonus-offer.welcome-bonus{ color:var(--c-ink); }
.casino-badge{ background:#1565c0 !important; color:#fff !important; }
.badge-new,.bonus-banner,.casino-badge-new{ background:#c62828 !important; color:#fff !important; }
.badge-hot,.casino-badge-hot{ background:#ffb300 !important; color:var(--c-ink) !important; }
.legal-note,.legal-text,.oc-legal,.oc-hero-eyebrow,.oc-rating small,.oc-restricted__body,.promo-tc,.oc-fact>span>span{ color:var(--c-muted) !important; }
.rating-stars,.emoji-stars,.oc-stars{ color:#b45309; }
.topTenCasinos_list section:nth-child(2) a:first-child{ color:#fff !important; }
.topTenCasinos_list section .right a{ color:#fff; }
.extable-col.cta-col .casino-review-link,.read-review-link,.casino-review-link{ color:var(--c-text) !important; }
.oc-feature__tx a,.oc-chips .oc-chip .oc-chip__sym,.oc-card a,.sidebar-features-list a,.sidebar-info-list a,
.oc-simcard__rev,.oc-simcard a{ color:var(--c-green-dark); }
.oc-simcard__prov,.oc-simcard b,.bonus-subtext,.main_body h5,.main_body h6{ color:var(--c-muted); }
/* link nella prosa: il rosso del tema; i pulsanti del tema (testo bianco su rosso o verde) restano esclusi */
.main_body a:not([class]),.oc-prose p a,.oc-prose li a,.main_body article>section>p a:not([class]),.main_body article>p a:not([class]){ color:var(--c-brand); }
.main_body .topTenCasinos_list section a+a,.main_body .casinoListing_tables .more a{ color:var(--c-brand); }
.main_body .gameListing_casinos li section a,.main_body .topTenCasinos_list section:nth-child(2) a:first-child,
.main_body .casinoListing_tables table td a,.main_body a.nav-main,.main_body .machine-card a:not([class]),.main_body .modern-slot-list a:not([class]){ color:#fff; }
.main_body .machine-card a:not([class]),.main_body .modern-slot-list a:not([class]){ color:var(--c-ink); }
.main_body .gameListing>header .oc-byline,.main_body .casinoListing>header .oc-byline,.main_body .jeuxCasino>header .oc-byline,
.main_body .topTenCasinos>header .oc-byline,.main_body .casinoReview_details>header .oc-byline,
.main_body .gameListing>header .oc-byline strong,.main_body .casinoListing>header .oc-byline strong,.main_body .jeuxCasino>header .oc-byline strong,
.main_body .topTenCasinos>header .oc-byline strong,.main_body .casinoReview_details>header .oc-byline strong{ color:#e6e6e6; }
.main_body .oc-simcard b,.main_body .oc-simcard .oc-simcard__prov{ color:var(--c-muted) !important; }
.oc-avail.oc-avail--no{ color:var(--c-muted); }
a.btn-claim,a.btn-claim:hover{ background:#2e7d32 !important; }
.main_body .an-ch a,.main_body p.slot-footer-link a,.main_body p.slot-footer-link a strong,.main_body a.nav-main{ color:#fff !important; }
.main_body .jeuxCasinoList p a{ color:var(--c-brand); }
.main_body .oc-specs b,.main_body .oc-specs .spec b{ color:var(--c-muted) !important; }
.main_sidebar .sidebarLeCasino .imgWithInfo a{ color:var(--c-ink); }
.main_body .topTenCasinos_list section .right a:first-child{ color:#fff; }
.main_body .topTenCasinos_list section .right a+a{ color:var(--c-brand); }
.main_body .casinoListing>header a,.main_body .casinoReview_details>header a,.main_body .gameListing>header a,.main_body .jeuxCasino>header a,.main_body .topTenCasinos>header a,.main_body .topTenCasino>header a{ color:var(--c-link-footer); }
.page-404 .nav-main a{ color:#fff; }
.main_body h1 a:not([class]),.main_body h2 a:not([class]),.main_body h3 a:not([class]){ color:inherit; text-decoration:underline; }
.main_body .casinoListing header h1,.main_body .casinoListing header h2,.main_body .casinoListing header h3,.main_body .jeuxCasino header h1,.main_body .jeuxCasino header h2,.main_body .jeuxCasino header h3,.main_body .gameListing header h2,.main_body .topTenCasinos header h2,.main_body .casinoReview_details header h2,.main_body .slotReview_details header h2,.main_body .softwareReview header h2,.main_body header.badgeStyle h1,.main_body header.badgeStyle h2{ color:#fff; }
.main_body .gameListing_casinos li header h2,.main_body .gameListing_casinos li header h2 *,.main_body .topTenCasinos_list>li>header h2{ color:var(--c-ink); }
.main_sidebar .sidebarLesmeilleurs p+a,.main_sidebar .sidebarLesmeilleurs p+a:hover{ color:var(--c-ink); }
.main_body p.slot-footer-link a{ background:#0b5ed7 !important; }
.main_body .casinoreview-screenshot-section h2,.main_body .casinoreview-screenshot-title,.main_body .oc-shots h2,.main_body section>h2:not([class]){ color:var(--c-ink); }
.main_body .casinoReview_table>header h2,.main_body .casinoReview_table>header h2 *{ color:#fff; }
.oc-btn,.oc-btn:hover,a.btn-claim,a.btn-claim:hover,.btn-promo-cta,.casino-cta-button,.cta-button{ color:#fff !important; }
.casino-badge-exclusive,.casino-badge-top{ background:#1565c0 !important; color:#fff !important; }
.main_sidebar .sidebarLesmeilleurs>section h3{ color:#fff; }
:root{ --oc-muted:#5f6368; }  /* review-C.css e casino-specs-C.css leggono questa variabile per i testi piccoli */
.extable-col.cta-col .btn:hover,
.btn-full-green:hover{ background:#b9d85c !important; }
.extable-col.cta-col .casino-review-link{ color:var(--c-text); }
.sidebarLesmeilleurs p+a{ color:var(--c-ink); }
.footer .trademark ul a{ color:var(--c-link-footer); text-decoration:underline; }
.oc-breadcrumb a{ color:var(--c-green-dark); }

/* ---------- 6. Piè di pagina ---------- */
.footer{ color:#fff; }
.footer .trademark{ display:block; margin:0 auto 14px; max-width:860px; }
.footer .trademark h6,.footer .trademark h5{ color:#fff; font-size:14px; line-height:1.5; margin:0 0 8px; font-weight:700; }
.footer .trademark ul{ display:block; margin:0; padding:0; }
.footer .trademark li{ display:inline-block; margin:0 6px 6px; line-height:1.5; }
.footer .trademark li+li{ margin-left:6px; }
.footer .trademark li a{ font-size:14px; }
.footer .footer-markets p{ color:#fff; font-size:14px; line-height:1.55; margin:0 0 8px; opacity:.95; }
.footer .footer-help h5{ font-weight:400; }
.footer .footer-help h5 img{ vertical-align:middle; margin-right:4px; }
.footer .footer-help ul{ display:inline; }
.footer .footer-help li{ margin:0 4px; }
.footer .footer-help li a{ font-weight:700; }
.footer .logoBottom{ display:inline-block; margin-bottom:1.2rem; }
.footer .nav-quick{ background:#fff; }

/* ---------- 7. Colonna laterale: riquadro in evidenza con una sola scheda ---------- */
.sidebarLesmeilleurs>section>div:only-child{ width:100%; float:none; border-left:0; }
.sidebarLesmeilleurs h3{ font-size:1.3rem; line-height:1.2; color:#fff; margin:0 0 .76923rem; }
.sidebarLesmeilleurs img{ display:inline-block; max-width:110px; height:auto; }
.main_sidebar>aside header h2,.main_sidebar>aside h2{ line-height:1.25; }
.sidebarLesmeilleurs2 .featured-casinos{ display:grid; gap:12px; }
.sidebarNewsletterModern p{ font-size:.95rem; line-height:1.55; }
.sidebarNewsletterModern .cta-center-box{ margin-top:10px; text-align:center; }
.sidebarPromotion img,.sidebarSlotReview_Ads img,.ads img{ max-width:100%; height:auto; }

/* ---------- 8. Schede e liste sul telefono ---------- */
img{ max-width:100%; height:auto; }
.modern-extable-casino-card,.modern-casino-data-card{ max-width:100%; box-sizing:border-box; }
.modern-extable-casino-card>*,.modern-casino-data-card>*{ min-width:0; }
@media (max-width:768px){
  .modern-extable-casino-card{ padding:16px 12px; gap:8px; }
  .extable-col.logo-col{ margin:0; }
  .extable-col.flags-col{ flex-direction:row; gap:6px; margin:0 0 6px; }
  .extable-col.bonus-text-col{ width:100%; align-items:center; }
  .extable-col.cta-col{ width:100%; align-items:center; }
  .extable-col.cta-col .btn{ width:100%; max-width:260px; text-align:center; box-sizing:border-box; }
  .modern-casino-data-card{ padding:16px 12px; }
  .modern-casino-data-card .data-col{ width:100%; margin:6px 0; align-items:center; text-align:center; }
  .modern-casino-data-card .play-now-btn{ display:inline-block; width:100%; max-width:260px; text-align:center; box-sizing:border-box; }
  .topTenCasinos_list section .left,.topTenCasinos_list section .right{ float:none; width:100%; text-align:center; margin:0 0 8px; }
  .oc-review-hero .oc-hero-top{ flex-wrap:wrap; }
  .oc-facts{ grid-template-columns:1fr 1fr; }
  .casino-bonus-cards-grid{ grid-template-columns:1fr; }
}
@media (max-width:480px){
  .oc-facts{ grid-template-columns:1fr; }
  .flags-mobile{ justify-content:center; }
}
/* le liste vecchie del tema erano larghe il 107 % e spostate di 10 px: dentro la colonna */
.casinoListing_tables,.softwareReview_tables{ left:0; width:100%; }
/* tabelle: dentro un contenitore scorrevole, mai più larghe della pagina */
.table-scroll{ width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; margin:0 0 1.2em; }
.table-scroll>table{ margin-bottom:0; min-width:560px; }
.main_content table{ width:100%; border-collapse:collapse; font-size:.95rem; line-height:1.5; }
.main_content table th,.main_content table td{ border:1px solid var(--c-line); padding:8px 10px; text-align:left; vertical-align:top; }
.main_content table th{ background:#f6f6f7; color:var(--c-ink); }
.main_content,.main_sidebar{ min-width:0; }
.main_content article,.main_content .oc-prose{ overflow-wrap:anywhere; }
.main_content article img.left,.main_content article img.right{ max-width:45%; }
@media (max-width:600px){
  .main_content article img.left,.main_content article img.right{ float:none; display:block; max-width:100%; margin:0 auto 12px; }
}

/* ---------- 9. Riquadri colorati ---------- */
.oc-box{ position:relative; margin:0 0 1.4em; padding:16px 18px 14px 20px; border-radius:var(--radius); border:1px solid var(--c-line); border-left:6px solid var(--c-muted); background:#f7f7f8; color:var(--c-text); font-size:var(--fs-read); line-height:var(--lh-read); }
.oc-box>:last-child{ margin-bottom:0; }
.oc-box p{ margin:0 0 .6em; font-size:inherit; line-height:inherit; color:inherit; }
.oc-box ul,.oc-box ol{ margin:0 0 .6em 1.2em; }
.oc-box li{ font-size:inherit; line-height:inherit; }
.oc-box a{ color:inherit; text-decoration:underline; font-weight:700; }
.oc-box__title{ display:block; margin:0 0 6px; font-size:13px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:var(--c-ink); }
.oc-box__title::before{ display:inline-block; width:1.1em; margin-right:6px; text-align:center; font-weight:900; }
.oc-box--info{ background:var(--box-info-bg); border-left-color:var(--box-info-line); color:var(--box-info-ink); }
.oc-box--info .oc-box__title{ color:var(--box-info-line); } .oc-box--info .oc-box__title::before{ content:"i"; }
.oc-box--warn{ background:var(--box-warn-bg); border-left-color:var(--box-warn-line); color:var(--box-warn-ink); }
.oc-box--warn .oc-box__title{ color:var(--box-warn-ink); } .oc-box--warn .oc-box__title::before{ content:"!"; }
.oc-box--ok{ background:var(--box-ok-bg); border-left-color:var(--box-ok-line); color:var(--box-ok-ink); }
.oc-box--ok .oc-box__title{ color:var(--box-ok-ink); } .oc-box--ok .oc-box__title::before{ content:"\2713"; }
.oc-box--history{ background:var(--box-hist-bg); border-left-color:var(--box-hist-line); color:var(--box-hist-ink); }
.oc-box--history .oc-box__title{ color:var(--box-hist-ink); } .oc-box--history .oc-box__title::before{ content:"\231B"; }
.oc-box--disclosure{ background:var(--box-disc-bg); border-left-color:var(--box-disc-line); color:var(--box-disc-ink); font-size:.95rem; padding:12px 16px 10px; }
.oc-box--disclosure .oc-box__title{ color:var(--box-disc-ink); font-size:12.5px; } .oc-box--disclosure .oc-box__title::before{ content:"\00A7"; }
.oc-box--markets{ background:#fff; border-left-color:var(--c-brand); color:var(--c-text); font-size:.95rem; }
.oc-box--markets .oc-box__title{ color:var(--c-brand); } .oc-box--markets .oc-box__title::before{ content:"\2691"; }
.oc-box--tested{ background:var(--box-ok-bg); border-left-color:var(--box-ok-line); color:var(--box-ok-ink); }
.oc-box--tested .oc-box__title{ color:var(--box-ok-ink); } .oc-box--tested .oc-box__title::before{ content:"\2713"; }
.oc-box--demo{ background:var(--box-info-bg); border-left-color:var(--box-info-line); color:var(--box-info-ink); }
.oc-box--demo .oc-box__title{ color:var(--box-info-line); } .oc-box--demo .oc-box__title::before{ content:"\25B6"; }
/* FAQ visibili (label/div del sito e dettagli) */
.oc-faq details{ border:1px solid var(--c-line); border-radius:var(--radius); margin:0 0 10px; background:#fff; }
.oc-faq summary{ cursor:pointer; padding:12px 16px; font-weight:700; color:var(--c-ink); font-size:1rem; line-height:1.4; }
.oc-faq summary:hover{ background:#fafbfc; }
.oc-faq details>div{ padding:4px 16px 12px; }
.oc-faq details>div p{ font-size:var(--fs-read); line-height:var(--lh-read); margin:0 0 .6em; }
/* firma e data */
.oc-signature{ margin:1.6em 0 0; padding-top:12px; border-top:1px solid var(--c-line); font-size:14px; color:var(--c-muted); line-height:1.5; }

/* ---------- 10. Briciole di pane ---------- */
.oc-breadcrumb{ max-width:1200px; margin:14px auto 0; padding:0 15px; font-size:13px; color:var(--c-muted); box-sizing:border-box; }
.oc-breadcrumb ol{ list-style:none; display:flex; flex-wrap:wrap; gap:6px; margin:0; padding:0; }
.oc-breadcrumb li{ display:flex; align-items:center; gap:6px; }
.oc-breadcrumb li+li::before{ content:"\203A"; color:#999; }
.oc-breadcrumb a{ text-decoration:none; }
.oc-breadcrumb a:hover{ text-decoration:underline; }
.oc-breadcrumb [aria-current]{ color:var(--c-ink); font-weight:600; }

/* ---------- 11. Banner del consenso (js/cookie-consent.js) e pagina 404 ---------- */
.cc-banner{position:fixed;left:0;right:0;bottom:0;z-index:9999;display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;justify-content:center;
  padding:14px 16px;background:#1d1d1d;color:#fff;font-size:14px;line-height:1.5;box-shadow:0 -2px 12px rgba(0,0,0,.35)}
.cc-banner .cc-text{margin:0;max-width:760px;color:#fff;font-size:14px}
.cc-banner a{color:var(--c-link-banner);text-decoration:underline}
.cc-banner .cc-btns{display:flex;gap:10px}
.cc-banner .cc-btn{min-height:44px;min-width:110px;padding:8px 18px;border:2px solid #fff;border-radius:4px;background:#fff;color:#1d1d1d;font-weight:700;cursor:pointer;font-size:14px}
.cc-banner .cc-btn:hover{background:#e9ecf1}
@media only screen and (max-width:480px){
  .cc-banner{padding:10px 12px;font-size:13px;line-height:1.4}
  .cc-banner .cc-btns{width:100%}
  .cc-banner .cc-btn{flex:1 1 0;min-width:0}
}
.cc-reopen{ display:inline-block; min-height:44px; padding:10px 20px; margin:4px 0 18px; border:0; border-radius:5px; background:var(--c-brand); color:#fff; font:bold 15px/1.4 "Trebuchet MS",Arial,sans-serif; cursor:pointer; }
.cc-reopen:hover{ background:var(--c-brand-dark); }
.page-404 .main_body{ padding:24px 0 40px; }
.page-404 h1{ font-size:1.8rem; color:var(--c-ink); margin:0 0 .6em; }
.page-404 ul{ margin:0 0 1.5em 1.2em; list-style:disc; }
.page-404 li{ margin:0 0 .5em; list-style:disc; }
.page-404 li a{ color:var(--c-brand); text-decoration:underline; }

/* ---------- 12. Carosello della colonna ---------- */
.sidebarBonus .owl-wrapper-outer{ overflow:hidden; max-width:100%; }
.sidebarBonus .owl-item,.sidebarBonus .owl-item>li{ max-width:100%; box-sizing:border-box; }
.sidebarBonus .owl-item img{ max-width:100%; height:auto; }

/* ---------- 13. Accessibilità ---------- */
a:focus-visible,button:focus-visible,summary:focus-visible,[tabindex]:focus-visible{ outline:3px solid var(--c-focus); outline-offset:2px; }
.cc-banner .cc-btn:focus-visible,.cc-banner a:focus-visible{ outline-color:var(--c-link-banner); }
.nav-main a:focus-visible{ outline-color:#fff; outline-offset:-3px; }
.mobile-nav{ min-width:44px; min-height:44px; display:block; border:0; padding:0; cursor:pointer; background-color:transparent; background-position:center; background-repeat:no-repeat; }
@media only screen and (min-width:981px){ .mobile-nav{ display:none; } }
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}

/* 14. le testate chiare di override.css dentro le sezioni che main.css fa scure (.topTenCasino,
   .casinoListing…): main.css e le regole del titolo bianco qui sopra le colorano per uno sfondo scuro che
   lì non c'è, e il titolo sparisce sul bianco; si riporta il testo scuro di override.css. La classe ripetuta
   alza la specificità sopra «.main_body .casinoListing header h2». */
.main_body .section-casino-header.section-casino-header,
.main_body .section-casino-header.section-casino-header h2{ color:#222; }
.main_body .section-casino-header.section-casino-header .tagline{ color:#555; }
.main_body .section-casino-header.section-casino-header{ padding:18px 22px !important; }
.main_body .section-casino-header.section-casino-header h2{ padding:0; margin:0; }
.main_body .article-box-header.article-box-header,
.main_body .article-box-header.article-box-header h2{ color:#303030; }
.main_body .main_sidebar aside header h2{ color:#5c1b1b; }

/* 16. il riquadro d'apertura (.intro-highlight-box) sta fuori da .main_content: la scala di lettura non lo
   raggiungeva (13,65 px, 12 sul telefono), e il contenitore interno aggiungeva 41 px vuoti in fondo */
.main_body .intro-highlight-box p{ font-size:var(--fs-read); line-height:1.65; color:var(--c-text); }
.main_body .intro-highlight-box>.container{ padding-bottom:0; }
.main_body .intro-highlight-box>.container>:last-child{ margin-bottom:0; }
@media only screen and (min-width:961px){ .main_body .intro-highlight-box p{ font-size:var(--fs-read-lg); } }
.main_body .intro-highlight-box p{ text-align:left; }
.main_body .intro-highlight-box p.oc-byline{ font-size:14px; color:var(--c-muted); }
/* sul telefono il testo giustificato apre buchi fra le parole: allineato a sinistra */
@media (max-width:768px){ .main_body p, .main_body li{ text-align:left; } }

/* 15. la chiamata all'azione in fondo alle recensioni: un pulsante grande, uguale su tutte le recensioni,
   bianco sul rosso del marchio (6,5:1); a tutta larghezza sul telefono */
.main_body .oc-cta{ margin:32px 0 12px; text-align:center; }
.main_body a.oc-cta__btn{ display:inline-flex; align-items:center; justify-content:center; gap:.5em; min-height:52px; min-width:min(100%,320px);
  padding:16px 38px; border-radius:10px; background:var(--c-brand); color:#fff !important; font-size:1.2rem; font-weight:700; line-height:1.25;
  text-decoration:none; box-shadow:0 6px 18px rgba(191,0,0,.30); transition:background-color .15s ease, transform .15s ease, box-shadow .15s ease; }
.main_body a.oc-cta__btn::after{ content:"\2192"; font-size:1.15em; }
.main_body a.oc-cta__btn:hover,.main_body a.oc-cta__btn:focus-visible{ background:#990000; transform:translateY(-1px); box-shadow:0 8px 22px rgba(191,0,0,.38); }
.main_body a.oc-cta__btn:focus-visible{ outline:3px solid var(--c-ink); outline-offset:3px; }
.main_body .oc-cta__note{ display:block; margin-top:10px; font-size:13px; color:var(--c-muted); }
@media (max-width:600px){ .main_body a.oc-cta__btn{ display:flex; width:100%; box-sizing:border-box; } }

/* 17. i testi piccoli: main.css porta la radice a 13 px, e a 12 sotto i 980 px, così tutto quello che è in
   rem (menu, lista rapida, piè di pagina, colonna) scendeva sotto i 12 px sul telefono; lì la radice va a
   14 px. I testi del kit hanno misure in px, e la prosa fuori da .main_content (le sezioni sotto la lista
   della home, .main_contentAfter) prende la stessa scala di lettura */
@media only screen and (max-width:980px){ html{ font-size:14px; } }
.main_body .main_contentAfter p,.main_body .main_contentAfter li,.main_body .article-box-content p{ font-size:var(--fs-read); line-height:1.65; }
@media only screen and (min-width:961px){ .main_body .main_contentAfter p,.main_body .main_contentAfter li,.main_body .article-box-content p{ font-size:var(--fs-read-lg); } }
.main_body .oc-review-hero p.oc-byline{ font-size:14px; }
.main_body .oc-legal{ font-size:12px; }
.main_body .oc-facts b,.main_body .oc-fact b{ font-size:12.5px; }
.main_body .oc-specs .spec b,.main_body .oc-simcard .oc-legal,.main_body .oc-simcard__prov{ font-size:12px; }
