/* country.css - pagine Paese di Betandlink ("Bookmakers in <Paese>")
   Va caricato dopo scheda.css: qui ci sono solo le regole nuove, tutto il resto e' quello delle schede. */

/* ===== Menu' scambiati (lingue nella barra in alto, Bookmakers nella barra del logo): dall'8/10/2026 le regole stanno
   in scheda.css, perche' la stessa disposizione vale anche per le schede dei bookmaker ===== */

/* ===== Percorso: i nomi lunghi (Saint Vincent & Grenadines) restano interi perche' il corpo scende con lo schermo;
   --nw e' la larghezza del nome in em, scritta nella pagina solo per i nomi lunghi. Sotto i 10.5 px il nome si accorcia con i puntini ===== */
.crumb .path{overflow:hidden}
.crumb .path b{min-width:0;overflow:hidden;text-overflow:ellipsis;font-size:clamp(10.5px,calc((min(100vw,520px) - 230px)/var(--nw)),12px)}

/* ===== Testata: etichetta e bandiere (Paese, valuta) sulla prima riga, titolo su una riga sotto ===== */
.c-tb{align-items:start}
.c-tb::before{grid-column:1;grid-row:1}
.c-tb .apps{grid-column:2;grid-row:1;gap:10px;margin-top:2px}
/* il corpo del titolo segue la larghezza dello schermo: --tw e' la larghezza del testo in em, scritta nella pagina;
   la pagina non supera i 520 px di larghezza fino alla versione per PC (900 px), percio' il calcolo si ferma a 520;
   sotto i 18 px non scende: i nomi troppo lunghi vanno su due righe. Il corpo massimo e' quello del titolo delle schede
   (24 px dal 7/10/2026 sera, anche nella versione per PC; prima 28 e 34) */
.c-tb h1{grid-column:1/-1;grid-row:2;letter-spacing:-.021em;font-size:20px;font-size:clamp(18px,calc((min(100vw,520px) - 70px)/var(--tw)),24px);-webkit-text-size-adjust:100%;text-size-adjust:100%}
.app.c-id{width:auto;min-width:26px;padding:0;cursor:default}
.app.c-id img{display:block;width:26px;height:26px;border-radius:50%}
.hero .rt-num span{font-size:12px}
.hero>p:last-child{margin-bottom:0}

@media(min-width:900px){.c-tb h1{font-size:24px}}

/* ===== Striscia dei dati: quattro colonne uguali, che si allargano solo se un valore e' piu' lungo (es. Portuguese) ===== */
.facts.c-facts{grid-template-columns:repeat(4,minmax(min-content,1fr))}
.facts.c-facts b{font-size:18px;white-space:nowrap}
.facts.c-facts span{white-space:nowrap}
/* c-long = un valore di 9 lettere o piu': sui telefoni il corpo scende, cosi' le colonne restano equilibrate */
@media(max-width:389px){.facts.c-facts.c-long b{font-size:16px}}
@media(max-width:350px){.facts.c-facts b{font-size:16px}.facts.c-facts span{font-size:10px}.facts.c-facts.c-long b{font-size:14px}}

/* ===== Riquadri a scomparsa ===== */
.acc summary small{padding-left:10px;white-space:nowrap}       /* il numero a destra non tocca il titolo e resta su una riga */
@media(max-width:389px){.acc summary small.c-s9{font-size:12px}}       /* sigla di 9 lettere (Lottstift): un punto in meno, cosi' il titolo resta su una riga a 360 px */
.ct li b{grid-column:2;color:#fff;font-weight:700;font-size:16px}
.ct li a.c-ext{word-break:normal;text-decoration:underline;text-underline-offset:3px;text-decoration-color:#555}
.ct li:last-child{border-bottom:0}
.c-p{margin:12px 0 0;font-size:14px;line-height:1.5;color:var(--soft)}
.c-p.c-first{margin:0 0 12px}
.c-filters{display:flex;flex-wrap:wrap;gap:7px;margin:2px 0 12px}
button.chip{display:inline-flex;align-items:center;gap:6px;font-family:"JetBrains Mono",Menlo,Consolas,monospace;font-weight:500;line-height:1.3;color:var(--ink);cursor:pointer;-webkit-appearance:none;appearance:none}
.chip.on{background:var(--grad);border-color:#555;color:#fff}
.c-filters .chip{padding:7px 10px;font-size:12px}
a.chip{color:var(--ink);text-decoration:none}
a.chip:hover{border-color:#555}
.more-row[hidden],.bkl[hidden],.c-p[hidden]{display:none}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.fg{display:block;width:16px;height:16px;border-radius:50%;flex:none}

/* ===== Lista dei bookmaker: nome a sinistra; a destra, in colonna, bandiera della lingua, valuta, Review e Visit ===== */
.tb-body{padding-left:12px;padding-right:12px}
.bkl{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:12px;background:var(--field);overflow:hidden}
.bkl li{display:flex;align-items:center;gap:6px;padding:9px;border-bottom:1px solid var(--line2)}
.bkl li:last-child{border-bottom:0}
.bkl li.extra{display:none}
.bkl.is-open li.extra,.bkl.is-filtered li.extra{display:flex}
.bkl .nm{flex:1;min-width:0;font-size:13px;font-weight:700;letter-spacing:.2px;color:#fff;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bkl .la{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:5px;min-width:22px;height:22px;padding:0 1px;border:1px solid #505050;border-radius:7px;background:linear-gradient(180deg,#383838,#1f1f1f)}
.bkl .la .fg{width:18px;height:18px}
.bkl .la b{display:none;font-family:"JetBrains Mono",Menlo,Consolas,monospace;font-size:12px;font-weight:600;color:var(--soft)}     /* la sigla (GER, ENG) si vede solo dove c'e' spazio */
.bkl .cu{flex:none;display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:32px;padding:0 3px;border:1px solid var(--line);border-radius:10px;background:var(--card);font-family:"JetBrains Mono",Menlo,Consolas,monospace;font-size:12px;font-weight:600;color:#fff}
.bkl .cu.fb{color:var(--mute)}                                 /* valuta di riserva: il bookmaker non ha la valuta della pagina */
.bkl .bt{flex:none;display:inline-flex;align-items:center;height:32px;padding:0 9px;border:1px solid #555;border-radius:10px;background:var(--card2);color:#fff;font-size:12px;font-weight:700;text-decoration:none;white-space:nowrap}
.bkl .bt.v{background:var(--grad)}
/* telefoni sotto i 390 px: margini e pulsanti un po' piu' piccoli, cosi' anche il nome piu' lungo (MARATHONBET) resta intero a 360 px */
@media(max-width:389px){
  .tb-body{padding-left:8px;padding-right:8px}
  .bkl li{gap:5px;padding:9px 8px}
  .bkl .nm{font-size:12.5px}
  .bkl .cu{min-width:38px}
  .bkl .bt{padding:0 7px}
}
/* sotto i 360 px resta Visit: la recensione si apre dal nome */
@media(max-width:359px){.bkl .bt.rv{display:none}}
@media(min-width:900px){
  .tb-body{padding-left:32px;padding-right:32px}
  .c-filters{margin-bottom:14px}
  .bkl li{gap:10px;padding:9px 16px}
  .bkl .nm{font-size:14px}
  .bkl .la{min-width:66px;height:32px;padding:0 8px;border-radius:10px}
  .bkl .la b{display:inline}
  .bkl .cu{min-width:56px}
  .bkl .bt{padding:0 14px}
}

/* ===== Valuta in testata (9/10/2026): moneta con il simbolo al posto della bandiera, prima della bandiera del Paese.
   Cerchio di 26 px come le bandiere, grigio con il bordo a rilievo; il corpo del simbolo scala con la lunghezza
   (l2 = due caratteri, l3 = tre). I segni che mancano in JetBrains Mono (₹ ₩ ₪ ₦ ₱ ₴ ₸ ₭ ₵ ₲ ฿ ₺ ₡ ₾ ₼ ֏ ৳) li disegna il font di sistema ===== */
.c-coin{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;border:1px solid #9a9a9a;background:linear-gradient(180deg,#4a4a4a,#262626);color:#fff;font-family:"JetBrains Mono",Menlo,Consolas,"Segoe UI",Roboto,system-ui,sans-serif;font-weight:700;font-size:14px;line-height:1;letter-spacing:-.02em;box-shadow:inset 0 0 0 2px #1c1c1c,inset 0 0 0 3px #6a6a6a;user-select:none}
.c-coin.l2{font-size:11.5px}
.c-coin.l3{font-size:9.5px;letter-spacing:-.04em}

/* ===== Titolo con "Bookmakers" in piccolo (9/10/2026): solo per i due nomi che non stanno su una riga nemmeno a 18 px
   (Central African Republic, Dominican Republic). La parola resta nell'h1, al 58% del corpo e in grigio chiaro ===== */
.c-tb h1 small{font-size:.58em;font-weight:600;color:var(--soft);letter-spacing:0;margin-left:.15em}

/* ===== Etichetta sopra il titolo (9/10/2026): "For <X> Players" con la spunta verde del box promo code (stessi colori di .bc-ok),
   corpo 10 px e spaziatura .05em cosi' sta su una riga anche a 360 px; la spunta e' uno sfondo a destra del testo ===== */
.c-tb::before{font-size:10px;letter-spacing:.05em;padding:6px 32px 6px 9px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='%23143529' stroke='%231f4a38'/%3E%3Cpath d='M17.5 8.5 10.5 15.5 7 12' fill='none' stroke='%236fd39c' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 7px center/18px 18px,rgba(255,255,255,.04)}

/* ===== Menu dei Paesi (9/10/2026): nella barra in alto, prima delle lingue, con lo stile del menu dei siti regionali delle schede (.cc);
   la riga del Paese corrente e' evidenziata; la ricerca usa lo script data-filter gia' presente ===== */
.cc-menu li.now a{background:var(--card2)}
.cc-menu li.now .cn{color:var(--acc)}
/* pagine senza traduzione: distintivo EN al posto del menu delle lingue */
.lang-1{display:inline-flex;align-items:center;gap:4px;padding:4px 7px;border:1px solid #3a3a3a;border-radius:999px;background:rgba(40,40,40,.6);font-family:"JetBrains Mono",Menlo,Consolas,monospace;font-size:12px;color:var(--ink);white-space:nowrap;user-select:none}.lang-1 .cf{margin-right:0;vertical-align:0}