/* Mercado de Cartoleiros — CSS /mercado/. .mkt-* VERBATIM de
   e:\cartomante_provaveis\style.css (L8419-8588), com adaptações de TEMA marcadas
   "HUB:" — textos de página via tokens (--ink/--ink-soft) pro claro/escuro; cards,
   listas e modais mantêm o design FIXO claro do provaveis (mesmo esquema de cores). */

/* moldura da página + cabeçalho (via tokens → seguem o tema) + loading (padrão das feature-pages) */
.br-page { max-width: min(96vw, 1180px); margin: 0 auto; padding: 18px 16px 64px; }
.br-page .section__header { text-align: center; max-width: 700px; margin: 0 auto 18px; }
.br-page .section__title { font-size: clamp(22px, 3.2vw, 32px); font-weight: 800; line-height: 1.15; letter-spacing: -.02em; color: var(--ink); margin: 0 0 8px; }
.br-page .section__desc { font-size: 14px; color: var(--ink-soft); line-height: 1.55; margin: 0; }
.confrontos__loading { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 44px 16px; color: var(--ink-soft); }
.catalogo__spinner { width: 34px; height: 34px; border: 3px solid rgba(77,82,175,.25); border-top-color: #4D52AF; border-radius: 50%; animation: brSpin 1s linear infinite; }
@keyframes brSpin { to { transform: rotate(360deg); } }
.obj-empty { text-align: center; color: var(--ink-soft); padding: 24px 12px; font-size: 14px; }

/* HUB: ações da página (ⓘ o que é / ↻ atualizar) — moravam no header do SPA do provaveis */
.mkt-pgacts { display: flex; justify-content: flex-end; gap: 8px; margin: 0 0 8px; }
.mkt-hbtn { width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--line); background: var(--surface); color: var(--ink-soft); font-size: 17px; line-height: 1; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: color .15s, border-color .15s; }
.mkt-hbtn:hover { color: var(--color-accent); border-color: var(--color-accent); }

/* -- style.css L582-606 | .confrontos-view-toggle (base do toggle de sub-abas) — HUB: tema-aware
   (claro = pílula branca com borda, como no /parciais light; escuro = superfície escura) -- */
.confrontos-view-toggle { display: flex; width: fit-content; margin: 0 auto 14px; gap: 4px; padding: 4px; background: var(--surface); border: 1px solid var(--line); border-radius: 999px; box-shadow: 0 1px 4px rgba(45,46,110,.08); }
.confrontos-view-toggle__btn { appearance: none; border: 0; background: transparent; color: var(--ink-soft); font: inherit; font-size: 13px; font-weight: 700; padding: 7px 18px; border-radius: 999px; cursor: pointer; transition: background .15s ease, color .15s ease; }
.confrontos-view-toggle__btn:hover { color: var(--ink); }
.confrontos-view-toggle__btn.is-active { background: var(--color-accent); color: #fff; } /* laranja accent = texto SEMPRE branco */

/* ══════ VERBATIM style.css L8419-8588 (adaptações marcadas HUB) ══════ */

.mkt-head { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin:4px 0 16px; }
.mkt-head__txt { min-width:0; flex:1 1 300px; }
.mkt-head__desc { font-size:14px; color: var(--ink-soft); line-height:1.5; margin:0; } /* HUB: era rgba(255,255,255,.72) (página escura do provaveis) */

/* sub-abas (Minhas compras / Mercado / Minhas vendas) — reusa o toggle padrão .confrontos-view-toggle */
.mkt-toggle { margin-top:6px; margin-bottom:18px; flex-wrap:wrap; }
.mkt-toggle .confrontos-view-toggle__btn { display:inline-flex; align-items:center; gap:6px; } /* desktop: ícone + label inline (HUB: cores pelo tema, na base acima) */
/* No MOBILE a sub-nav do Mercado vira barra fixa embaixo — MESMO padrão da nav inferior do Parciais: ícone em cima, label embaixo. */
@media (max-width:600px) {
  [data-br-pane="mercado"] .mkt-toggle {
    position:fixed; left:0; right:0; bottom:0; z-index:8500;
    margin:0; gap:0; width:auto; border:none; border-top:1px solid rgba(255,255,255,.12); border-radius:0;
    background:#14153a; box-shadow:0 -6px 20px rgba(0,0,0,.4); padding:0 0 env(safe-area-inset-bottom); flex-wrap:nowrap;
  }
  [data-br-pane="mercado"] .mkt-toggle .confrontos-view-toggle__btn {
    flex:1 1 0; min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:flex-start;
    gap:3px; padding:7px 3px 6px; margin:0; font-size:11px; line-height:1.12; font-weight:700; text-align:center;
    border:none; border-top:2.5px solid transparent; border-radius:0; background:transparent; color:rgba(255,255,255,.55);
  }
  [data-br-pane="mercado"] .mkt-toggle .mkt-toggle__ic { font-size:19px; line-height:1; }
  [data-br-pane="mercado"] .mkt-toggle .mkt-toggle__lbl { max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  [data-br-pane="mercado"] .mkt-toggle .confrontos-view-toggle__btn.is-active { color:#fff; border-top-color:var(--color-accent); background:rgba(245,146,26,.10); }
  [data-br-pane="mercado"] { padding-bottom:calc(66px + env(safe-area-inset-bottom)); } /* conteúdo não fica atrás da barra */
}

/* cards em lista (compras/vendas/ativos) */
.mkt-sec { font-size:15px; font-weight:800; color: var(--ink); margin:20px 0 10px; padding-left:11px; border-left:4px solid var(--color-accent); line-height:1.1; } /* HUB: era #fff */
.mkt-list { display:flex; flex-direction:column; gap:10px; }
.mkt-lc { display:flex; align-items:center; gap:12px; background:#fff; border:1px solid var(--color-border); border-radius:14px; padding:10px 14px; box-shadow:0 2px 8px rgba(45,46,110,.06); }
.mkt-lc__esc { width:46px; height:46px; object-fit:contain; flex:0 0 auto; }
.mkt-lc__id { min-width:0; flex:1 1 auto; display:flex; flex-direction:column; }
.mkt-lc__id b { font-size:15px; color:#1E293B; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mkt-lc__id small { font-size:12.5px; color: var(--color-muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mkt-lc__right { display:flex; align-items:center; gap:14px; flex:0 0 auto; }
.mkt-lc__stat { display:flex; flex-direction:column; text-align:right; }
.mkt-lc__stat small { font-size:10px; color: var(--color-muted); line-height:1.1; }
.mkt-lc__stat b { font-size:15px; color: var(--color-dark-purple); }
.mkt-lc__free { font-size:10px; font-style:normal; font-weight:800; color: var(--color-win); }
.mkt-lc__go { padding:8px 14px; font-size:13px; }
.mkt-empty--sm { padding:20px 12px; font-size:14px; }
.mkt-disclaimer { font-size:12.5px; color: var(--ink-faint); margin:-2px 0 12px; padding-left:11px; line-height:1.45; } /* HUB: era rgba(255,255,255,.62) */
@media (max-width:560px) { .mkt-lc__stat small { display:none; } .mkt-lc__right { gap:10px; } }
.mkt-head__acts { display:flex; gap:8px; flex-wrap:wrap; flex:0 0 auto; }
.mkt-btn { border:none; border-radius:10px; font-family:inherit; font-size:14px; font-weight:800; padding:10px 14px; cursor:pointer; background: var(--color-alt); color: var(--color-dark-purple); transition: filter .15s, transform .05s; }
.mkt-btn:hover { filter:brightness(.97); } .mkt-btn:active { transform: translateY(1px); }
.mkt-btn--share { background: var(--color-accent); color:#fff; }
.mkt-btn--ghost { background:#EEF0FA; }
.mkt-btn--stats { background: var(--color-primary); color:#fff; }
.mkt-empty { text-align:center; color: var(--color-muted); padding:40px 20px; line-height:1.7; font-size:15px; background:#fff; border:1px solid var(--color-border); border-radius:16px; box-shadow:0 3px 12px rgba(45,46,110,.10); }
.mkt-empty b { color: var(--color-dark-purple); }

.mkt-grid { display:grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap:16px; margin-top:8px; }
.mkt-card { border-radius:16px; padding:14px 14px 12px; box-shadow:0 3px 12px rgba(45,46,110,.10); display:flex; flex-direction:column; gap:10px; }
.mkt-card--a { background:#DEF6E4; } .mkt-card--b { background:#FBEECB; } .mkt-card--c { background:#F7DCE0; }
.mkt-card__top { display:grid; grid-template-columns:auto 1fr auto; gap:10px; align-items:start; }
.mkt-card__esc { display:flex; flex-direction:column; align-items:center; gap:2px; width:64px; }
.mkt-card__esc img { width:56px; height:56px; object-fit:contain; }
.mkt-card__rank { font-size:13px; font-weight:800; color: var(--color-dark-purple); }
.mkt-card__id { min-width:0; }
.mkt-card__nome { display:block; font-size:16px; font-weight:800; color:#1E293B; line-height:1.15; }
.mkt-card__cart { font-size:13px; color:#475569; } /* HUB: --color-muted fixado (card claro nos 2 temas) */
.mkt-card__metrics { display:flex; flex-direction:column; gap:2px; text-align:right; }
.mkt-card__metrics span { display:flex; flex-direction:column; }
.mkt-card__metrics small { font-size:10px; color:#475569; line-height:1.1; }
.mkt-card__metrics b { font-size:14px; color:#1E293B; }
.mkt-card__precos { display:flex; justify-content:center; gap:16px; flex-wrap:wrap; font-size:12.5px; color:#475569; }
.mkt-card__precos b { color: var(--color-dark-purple); }
.mkt-card__acts { display:flex; align-items:center; justify-content:space-around; }
.mkt-fab { width:52px; height:52px; border:none; border-radius:50%; cursor:pointer; font-size:20px; font-weight:900; color:#fff; box-shadow:0 3px 8px rgba(0,0,0,.18); transition: transform .05s, filter .15s; display:inline-flex; align-items:center; justify-content:center; }
.mkt-fab svg { display:block; }
.mkt-fab:hover { filter:brightness(1.06); } .mkt-fab:active { transform: translateY(1px); }
.mkt-fab--stats, .mkt-fab--share { background: var(--color-primary); }
.mkt-fab--buy { background: var(--color-accent); width:60px; height:60px; font-size:26px; }
/* mercado fechado: compra bloqueada */
.mkt-fab--buy.is-locked { background:#94A3B8; font-size:24px; box-shadow:none; cursor:not-allowed; }
.mkt-fab--buy.is-locked:hover { filter:none; } .mkt-fab--buy.is-locked:active { transform:none; }
/* métrica do meio com a parcial ao vivo (mercado fechado) */
.mkt-card__parcial small { color: var(--color-accent) !important; font-weight:800; }
.mkt-card__parcial b { color: var(--color-accent) !important; }

/* modal de detalhe (campinho) e de PIX */
.mkt-modal-ov { position:fixed; inset:0; background:rgba(20,20,40,.55); display:flex; align-items:center; justify-content:center; z-index:9000; padding:16px; }
.mkt-modal { background:#fff; border-radius:18px; width:100%; max-width:780px; max-height:92vh; display:flex; flex-direction:column; overflow:hidden; box-shadow:0 20px 60px rgba(0,0,0,.4); }
.mkt-modal--pix { max-width:520px; }
.mkt-modal__head { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:14px 16px; background: var(--color-dark-purple); color:#fff; font-weight:800; font-size:15px; }
.mkt-modal__head b { color: var(--color-accent); }
.mkt-modal__x { background:none; border:none; color:#fff; font-size:26px; line-height:1; cursor:pointer; padding:0 4px; }
.mkt-modal__body { padding:14px 16px; overflow-y:auto; }
/* card-resumo do time no modal de compra (mesmos dados do card do mercado) */
.mkt-buyinfo { display:flex; gap:14px; align-items:center; padding:12px 14px; margin:0 0 14px; background:#F1F5F9; border-radius:12px; }
.mkt-buyinfo__esc img { width:54px; height:54px; object-fit:contain; display:block; }
.mkt-buyinfo__main { flex:1; min-width:0; }
.mkt-buyinfo__nome { display:block; font-size:16px; font-weight:800; color:#1E293B; line-height:1.15; }
.mkt-buyinfo__cart { display:block; font-size:12.5px; color: var(--color-muted); margin-bottom:8px; }
.mkt-buyinfo__metrics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px 14px; }
.mkt-buyinfo__metrics span { display:flex; flex-direction:column; min-width:0; }
.mkt-buyinfo__metrics small { font-size:10px; color: var(--color-muted); text-transform:uppercase; letter-spacing:.03em; line-height:1.1; }
.mkt-buyinfo__metrics b { font-size:14px; font-weight:800; color:#1E293B; }
.mkt-buyinfo__metrics .mkt-buyinfo__rank { color: var(--color-accent); }
.mkt-modal__foot { padding:12px 16px; border-top:1px solid var(--color-border); display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }

/* campinho do detalhe (mesmo motor initRaiozinhoLineup do stats/escalar) */
/* -- style.css L7158-7159 | .st-pitch-field -- */
.st-pitch-field.ind-delivery__root { padding: 0; background: transparent; border: none; box-shadow: none; border-radius: 0; min-height: 0; overflow: hidden; width: 100%; position: relative; }
.st-pitch-field > div, .st-pitch-field .re-wrap { width: 100% !important; max-width: 100% !important; }

/* formulário PIX */
.mkt-pix__lead { font-size:13px; color:#475569; margin:0 0 12px; line-height:1.5; }
.mkt-fld { display:block; margin-bottom:10px; }
.mkt-fld span { display:block; font-size:12px; font-weight:700; color:#475569; margin-bottom:4px; }
.mkt-fld input { width:100%; box-sizing:border-box; border:1px solid var(--color-border); border-radius:10px; padding:10px 12px; font-size:15px; font-family:inherit; background:#fff; color:#1E293B; } /* HUB: bg/cor fixos (modal claro nos 2 temas) */
.mkt-fld input[readonly] { background:#F1F5F9; color:#94A3B8; cursor:not-allowed; }
.mkt-pix__err { color: var(--color-loss); font-size:13px; font-weight:700; min-height:18px; margin-bottom:6px; }
.mkt-pix__go { width:100%; }
.mkt-pix__val { font-size:15px; font-weight:800; color:#1E293B; margin-bottom:8px; }
.mkt-pix__val b { color: var(--color-accent); }
.mkt-pix__qr { text-align:center; margin:6px 0 12px; min-height:180px; display:flex; align-items:center; justify-content:center; }
.mkt-pix__qr img { width:220px; max-width:70vw; height:auto; image-rendering:pixelated; background:#fff; padding:10px; border-radius:12px; box-shadow:0 4px 14px rgba(45,46,110,.14); }
.mkt-pix__qrload { color: var(--color-muted); }
.mkt-pix__code { width:100%; box-sizing:border-box; border:1px dashed var(--color-primary); border-radius:10px; padding:10px; font-size:12px; font-family:monospace; resize:none; margin-bottom:10px; word-break:break-all; background:#fff; color:#1E293B; } /* HUB: bg/cor fixos */
.mkt-pix__ok { text-align:center; color: var(--color-win); font-weight:800; font-size:16px; line-height:1.6; padding:14px; }

/* picker de conta/time */
.mkt-pick { display:flex; flex-direction:column; gap:8px; }
.mkt-pick__item { display:flex; align-items:center; gap:12px; text-align:left; width:100%; border:1px solid var(--color-border); border-radius:12px; background:#fff; padding:10px 12px; cursor:pointer; font-family:inherit; transition: background .12s, border-color .12s; }
.mkt-pick__item:hover { background: var(--color-alt); border-color: var(--color-primary); }
.mkt-pick__esc { width:40px; height:40px; object-fit:contain; flex:0 0 auto; }
.mkt-pick__id { display:flex; flex-direction:column; min-width:0; }
.mkt-pick__id b { font-size:15px; color:#1E293B; }
.mkt-pick__id small { font-size:12.5px; color: var(--color-muted); }
.mkt-chk { display:flex; align-items:flex-start; gap:8px; font-size:14px; color:#334155; margin-bottom:10px; cursor:pointer; line-height:1.4; }
.mkt-chk input { margin-top:2px; width:18px; height:18px; accent-color: var(--color-accent); flex:0 0 auto; }
.mkt-chk a { color: var(--color-primary); font-weight:700; text-decoration:underline; }

/* popup de resultado (sucesso/erro) e confirmação */
.mkt-result { background:#fff; border-radius:18px; width:100%; max-width:420px; padding:26px 24px 22px; text-align:center; box-shadow:0 20px 60px rgba(0,0,0,.4); border-top:6px solid var(--color-win); animation: mktPop .18s ease-out; }
.mkt-result--err { border-top-color: var(--color-loss); }
.mkt-result__ic { font-size:52px; line-height:1; margin-bottom:8px; }
.mkt-result__ttl { font-size:20px; font-weight:800; color: var(--color-win); margin-bottom:6px; }
.mkt-result--err .mkt-result__ttl { color: var(--color-loss); }
.mkt-result__msg { font-size:15px; color:#334155; line-height:1.55; margin-bottom:18px; }
.mkt-result__btn { border:none; border-radius:12px; font-family:inherit; font-size:15px; font-weight:800; padding:12px 34px; cursor:pointer; color:#fff; background: var(--color-win); }
.mkt-result--err .mkt-result__btn { background: var(--color-loss); }
.mkt-result--warn { border-top-color: var(--color-accent); }
.mkt-result--warn .mkt-result__ttl { color: var(--color-dark-purple); }
.mkt-confirm__btns { display:flex; gap:10px; justify-content:center; }
.mkt-cbtn { border:none; border-radius:12px; font-family:inherit; font-size:15px; font-weight:800; padding:12px 24px; cursor:pointer; }
.mkt-cbtn--no { background:#EEF0FA; color: var(--color-dark-purple); }
.mkt-cbtn--yes { background: var(--color-loss); color:#fff; }
@keyframes mktPop { from { transform:scale(.9); opacity:0; } to { transform:scale(1); opacity:1; } }

/* toast de feedback */
.mkt-toast { position:fixed; left:50%; bottom:24px; transform:translate(-50%,20px); background: var(--color-dark-purple); color:#fff; font-weight:700; font-size:14px; padding:12px 18px; border-radius:12px; box-shadow:0 8px 24px rgba(0,0,0,.3); z-index:9800; opacity:0; transition:opacity .25s, transform .25s; max-width:90vw; text-align:center; }
.mkt-toast--on { opacity:1; transform:translate(-50%,0); }
@media (max-width:600px) { .mkt-toast { bottom:calc(80px + env(safe-area-inset-bottom)); } } /* HUB: acima da barra fixa de sub-abas do mobile */

@media (max-width:560px) { .mkt-grid { grid-template-columns:1fr; } .mkt-head__acts { width:100%; } }
