/* Botões 1X2 da lista de Esportes (sb.js → .c-odds) no padrão dos "Jogos em destaque" da home (home-esportes.css):
   vidro com borda clara, raio na cor do tema e a odd centralizada. O 1 / X / 2 fica pequeno no canto. */
.c-odds .odd[data-v-f216093a] {
  position: relative; justify-content: center; gap: 6px; height: 46px; padding: 0 8px; border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, .16);
  background: linear-gradient(180deg, rgba(255, 255, 255, .11), rgba(255, 255, 255, .05));
  box-shadow: 0 2px 6px rgba(0, 0, 0, .3), inset 0 1px 0 rgba(255, 255, 255, .06);
  transition: border-color .15s, background .15s, transform .12s;
}
@media (hover:hover) and (pointer:fine) { .c-odds .odd[data-v-f216093a]:hover { border-color: color-mix(in srgb, var(--acc) 55%, transparent); background: linear-gradient(180deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .07)); } }
.c-odds .odd .k[data-v-f216093a] { position: absolute; left: 7px; top: 5px; font-size: 9px; font-weight: 700; line-height: 1; color: rgba(255, 255, 255, .45); }
.c-odds .odd .v[data-v-f216093a] { display: inline-flex; align-items: center; gap: 6px; font-size: 16px; font-weight: 800; color: #fff; }
.c-odds .odd .v[data-v-f216093a]::before {
  content: ""; width: 13px; height: 13px; flex: none; background: var(--acc);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.5 2 4 13.5h6.5L9 22l10-12h-6.6z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.5 2 4 13.5h6.5L9 22l10-12h-6.6z'/%3E%3C/svg%3E") center / contain no-repeat;
}
/* escolhida (no cupom): cheia na cor do tema, raio branco */
.c-odds .odd.sel[data-v-f216093a] { border-color: var(--acc-2); background: linear-gradient(180deg, var(--acc), var(--acc-deep)); box-shadow: 0 4px 14px color-mix(in srgb, var(--acc) 40%, transparent); }
.c-odds .odd.sel .k[data-v-f216093a] { color: rgba(255, 255, 255, .75); }
.c-odds .odd.sel .v[data-v-f216093a]::before { background: #fff; }
/* "mais mercados" do mesmo jeito */
.c-odds .odd-more[data-v-f216093a] { height: 46px; border-radius: 10px; border: 1px solid rgba(255, 255, 255, .16); background: linear-gradient(180deg, rgba(255, 255, 255, .11), rgba(255, 255, 255, .05)); color: rgba(255, 255, 255, .7); }

/* 23/10 etiqueta do pagamento antecipado no card do jogo */
.pa-tag{display:inline-flex;align-items:center;gap:5px;margin-left:auto;padding:0;border:0;background:none;font:inherit;font-size:11px;font-weight:600;letter-spacing:0;line-height:1;white-space:nowrap;color:#c8ccd6;cursor:pointer;flex:none}
.pa-tag .pa-ic{display:inline-grid;place-items:center;width:15px;height:15px;border-radius:3px;background:#14805e;color:#fff;flex:none}
@media (hover:hover) and (pointer:fine) { .pa-tag:hover span {color:#fff} }
@media (max-width:380px){.pa-tag span{font-size:10px}}
@media (min-width:1024px){.c-lg .pa-tag span{display:none}.c-lg .pa-tag .pa-ic{width:17px;height:17px}}   /* PC: card estreito → só o selo (texto no toque/title), igual bet365 */
.c-lg{display:flex;align-items:center;gap:6px}

/* 24/10 janela de regras do Pagamento Antecipado (sb.js paRegras) — padrão casa licenciada: neutra, sem brilho,
   letra normal; verde só no selo. Folha de baixo no celular, caixa central no PC. */
.pa-modal{position:fixed;inset:0;z-index:10050;display:flex;align-items:flex-end;justify-content:center;font-family:inherit}
.pa-fundo{position:absolute;inset:0;background:rgba(5,7,14,.66);opacity:0;transition:opacity .22s ease}
.pa-caixa{position:relative;width:100%;max-height:calc(100dvh - 24px);overflow-y:auto;overscroll-behavior:contain;box-sizing:border-box;
  background:#161a26;color:#e9ebf1;border-radius:16px 16px 0 0;padding:18px 20px calc(18px + var(--sa-b,env(safe-area-inset-bottom)));
  box-shadow:0 -1px 0 rgba(255,255,255,.06);transform:translate3d(0,100%,0);transition:transform .34s cubic-bezier(.32,.72,0,1)}
.pa-modal.on .pa-fundo{opacity:1}.pa-modal.on .pa-caixa{transform:none}
.pa-modal.sai .pa-fundo{opacity:0}.pa-modal.sai .pa-caixa{transform:translate3d(0,100%,0);transition-duration:.22s;transition-timing-function:cubic-bezier(.4,0,1,1)}
.pa-cab{display:flex;align-items:center;gap:10px}
.pa-cab h2{margin:0;flex:1;font-size:17px;font-weight:700;letter-spacing:0;line-height:1.25;color:#fff}
.pa-ic{display:inline-grid;place-items:center;width:15px;height:15px;border-radius:3px;background:#14805e;color:#fff;vertical-align:-2px;font-style:normal}
.pa-ic--g{width:22px;height:22px;border-radius:4px}.pa-ic--g svg{width:13px;height:13px}
.pa-x{width:32px;height:32px;display:grid;place-items:center;border:0;border-radius:50%;background:rgba(255,255,255,.07);color:#c9ccd6;cursor:pointer;flex:none}
@media (hover:hover) and (pointer:fine) { .pa-x:hover {background:rgba(255,255,255,.13)} }
.pa-mercado{margin:12px 0 0;font-size:12px;font-weight:600;letter-spacing:.02em;color:#8f94a6;text-transform:uppercase}
.pa-resumo{margin:6px 0 0;font-size:14.5px;line-height:1.5;letter-spacing:0;color:#e9ebf1}
.pa-resumo b{font-weight:700;color:#fff}
.pa-regras{margin:14px 0 0;padding:14px 0 0;border-top:1px solid rgba(255,255,255,.08);list-style:none;display:grid;gap:9px}
.pa-regras li{position:relative;padding-left:14px;font-size:13px;line-height:1.45;letter-spacing:0;color:#b4b8c6}
.pa-regras li::before{content:"";position:absolute;left:0;top:.6em;width:5px;height:5px;border-radius:50%;background:#5d6274}
.pa-ok{display:block;width:100%;margin-top:18px;height:46px;border:0;border-radius:10px;background:rgb(var(--primary-color,22 82 240));color:#fff;
  font:inherit;font-size:15px;font-weight:700;letter-spacing:0;cursor:pointer}
.pa-ok:focus-visible,.pa-x:focus-visible{outline:2px solid #fff;outline-offset:2px}
.pa-rodape{margin:10px 0 0;text-align:center;font-size:11px;letter-spacing:0;color:#6f7487}
@media (min-width:641px){
  .pa-modal{align-items:center}
  .pa-caixa{width:min(420px,calc(100vw - 32px));border-radius:14px;padding:20px 22px 18px;transform:translate3d(0,8px,0) scale(.97);opacity:0;
    transition:transform .26s cubic-bezier(.2,.8,.2,1),opacity .2s ease;box-shadow:0 0 0 1px rgba(255,255,255,.07),0 24px 60px rgba(0,0,0,.5)}
  .pa-modal.on .pa-caixa{transform:none;opacity:1}
  .pa-modal.sai .pa-caixa{transform:scale(.98);opacity:0;transition-duration:.16s}
}
@media (prefers-reduced-motion:reduce){.pa-fundo,.pa-caixa{transition:none!important}}
/* fonte do sistema na janela de regras (SF no iPhone, Segoe no Windows, Roboto no Android): texto corrido de termos
   fica compacto e "de casa licenciada"; a fonte de vitrine do site espaçava as letras nesse tamanho */
.pa-modal,.pa-modal button{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif!important;letter-spacing:normal!important}
.pa-modal *{letter-spacing:normal!important}
.pa-mercado{letter-spacing:.04em!important}

/* 24/10 (devjunior: "a etiqueta também"): selo do Pagamento Antecipado igual ao de casa licenciada — etiqueta verde
   chapada, cantos quase retos, letra do sistema, seta » branca solta dentro (antes: quadradinho verde + texto cinza solto
   em Montserrat). Mesmo texto no celular e no PC; o nome da liga é que encurta (…) se faltar espaço. */
.c-lg .pa-tag,.pa-tag{gap:4px;height:18px;padding:0 6px 0 4px;border-radius:3px;background:#14805e;color:#fff;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif!important;
  font-size:11px;font-weight:600;letter-spacing:normal!important;line-height:18px;transition:background .15s}
.c-lg .pa-tag .pa-ic,.pa-tag .pa-ic{width:11px;height:11px;border-radius:0;background:none}
.pa-tag .pa-ic svg{width:11px;height:11px}
.c-lg .pa-tag span,.pa-tag span{color:#fff;overflow:visible}
@media (hover:hover) and (pointer:fine) { .pa-tag:hover {background:#17946c} }
.pa-tag:focus-visible{outline:2px solid #fff;outline-offset:1px}
@media (min-width:1024px){.c-lg .pa-tag span{display:inline}.c-lg .pa-tag .pa-ic{width:11px;height:11px}}
@media (max-width:380px){.c-lg .pa-tag,.pa-tag{font-size:10px;padding:0 5px 0 3px}}
/* card estreito: não corta o nome da liga — a etiqueta vira só o selo verde » (texto no toque e no title), como a
   bet365 faz no desktop. Quem decide é o sb.js (paAjusta), card por card: se o nome da liga ia ser cortado. */
.c-lg .pa-tag.pa-so-selo span{display:none}
.c-lg .pa-tag.pa-so-selo{width:20px;height:18px;padding:0;justify-content:center}

/* 24/10 (devjunior) bugs do Ao vivo:
   - jogo suspenso (placar Kambi≠ESPN): odds travadas (.sus já apaga em brava.css) + selo ao lado do relógio
   - mercados extras do card: Chance Dupla tem 3 opções → cabem 3 na linha também no card estreito do PC
   - título da lista não fica embaixo do cabeçalho fixo ao trocar de página
   - página do jogo: relógio legível em cima do gramado */
.c-susp[data-v-f216093a]{display:inline-flex;align-items:center;margin-left:8px;padding:2px 7px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);color:#c9ccd6;font-size:10px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;line-height:1.3;vertical-align:1px}
.c-odds.sus[data-v-f216093a]{cursor:not-allowed}
.ex-odds .odd[data-v-f216093a]{min-width:64px}
.sb-sec-h[data-v-f216093a]{scroll-margin-top:84px}
.e2-mid .e2-clk{padding:3px 10px 3px 8px;border-radius:999px;background:rgba(6,9,18,.62);color:#fff;font-size:12px;letter-spacing:.2px;white-space:nowrap;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.e2-mid .e2-clk::before{background:#ff4747}
