/* [OPP-UX-V1] Oportunidades — painel de filtros e balão do score (22/10/2026) */
#opp-fp-slot { margin-bottom:14px; }
#oppx-painel { background:var(--bg-card); border:1px solid var(--border); border-radius:var(--lx-r-lg, 14px); padding:6px 16px; margin:0 0 16px; }
.oppx-linha { display:flex; align-items:center; gap:14px; padding:10px 0; min-width:0; }
.oppx-linha + .oppx-linha { border-top:1px solid var(--border); }
.oppx-rot { flex:0 0 118px; font-size:10.5px; font-weight:700; letter-spacing:1.2px; text-transform:uppercase; color:var(--text-mid); }
.oppx-linha > #opp-tabs, .oppx-linha > #opp-rec-counts, .oppx-linha > #opp-faixas { margin:0 !important; flex:1; min-width:0; display:flex !important; flex-wrap:wrap; gap:8px !important; align-items:center; }
#opp-faixa-bar.oppx-fx-orig { display:none !important; }

/* Visão: abas segmentadas com contagem */
#opp-tabs button { background:var(--bg-2) !important; color:var(--text-mid) !important; border:1px solid var(--border) !important; border-radius:9px !important; padding:7px 12px !important; font-size:12.5px !important; font-weight:500 !important; letter-spacing:0 !important; text-transform:none !important; display:inline-flex; align-items:center; gap:7px; height:34px; }
#opp-tabs button:hover { color:var(--text) !important; border-color:var(--border-hi) !important; }
#opp-tabs button:not(.btn-gray) { background:var(--terracota) !important; border-color:var(--terracota) !important; color:#fff !important; font-weight:600 !important; }
#opp-tabs .oppx-n { font-size:11px; font-weight:700; padding:1px 7px; border-radius:999px; background:rgba(127,127,127,.16); }
#opp-tabs button:not(.btn-gray) .oppx-n { background:rgba(255,255,255,.22); }

/* Recorrência: chips legíveis e clicáveis */
#opp-rec-counts .rec-badge { cursor:pointer; height:28px; padding:0 11px !important; font-size:12px !important; font-weight:500 !important; letter-spacing:0 !important; border-radius:999px !important; border:1px solid var(--border) !important; background:var(--bg-1) !important; color:var(--text) !important; gap:6px !important; transition:border-color .15s, opacity .15s; }
#opp-rec-counts .rec-badge:hover { border-color:var(--border-hi) !important; }
#opp-rec-counts .rec-badge:focus-visible { outline:2px solid var(--terracota); outline-offset:2px; }
#opp-rec-counts.oppx-filtrando .rec-badge:not(.oppx-on) { opacity:.45; }
#opp-rec-counts .rec-badge.oppx-on { border-color:var(--terracota) !important; box-shadow:0 0 0 2px rgba(99,102,241,.18); font-weight:600 !important; }

/* Tempo sem pedido: mesmos chips */
#opp-faixas .opp-faixa-btn { height:30px; border-radius:999px !important; padding:0 12px !important; font-size:12px !important; border:1px solid var(--border) !important; background:var(--bg-1) !important; color:var(--text-mid) !important; }
#opp-faixas .opp-faixa-btn.ativo { background:var(--terracota) !important; border-color:var(--terracota) !important; color:#fff !important; }
#opp-faixas .opp-faixa-qtd { border-radius:999px; }

/* Score: indica que tem detalhe */
#opp-lista .opp-card-score[data-oppx] { cursor:help; position:relative; }
#opp-lista .opp-card-score[data-oppx]::after { content:'i'; position:absolute; top:-6px; right:-6px; width:15px; height:15px; border-radius:50%; background:var(--bg-card); color:var(--text-mid); border:1px solid var(--border-hi); font:700 10px/13px var(--font-display, sans-serif); text-align:center; }
#opp-lista .opp-card-score[data-oppx]:focus-visible { outline:2px solid var(--terracota); outline-offset:2px; }

/* balão */
#oppx-tip { position:fixed; z-index:100060; width:300px; max-width:calc(100vw - 20px); background:var(--bg-card); color:var(--text); border:1px solid var(--border); border-radius:12px; box-shadow:0 16px 40px rgba(0,0,0,.28); padding:12px 14px; font-size:12.5px; line-height:1.4; display:none; }
#oppx-tip.on { display:block; }
.oppx-tip-h { display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.oppx-tip-sc { min-width:40px; height:40px; padding:0 6px; border-radius:10px; background:var(--terracota); color:#fff; font-weight:800; font-size:16px; display:flex; align-items:center; justify-content:center; }
.oppx-tip-h b { display:block; font-size:13px; } .oppx-tip-h small { color:var(--text-mid); font-size:11.5px; }
.oppx-tip-l { list-style:none; margin:0 0 8px; padding:0; }
.oppx-tip-l li { display:flex; gap:8px; padding:4px 0; border-top:1px dashed var(--border); }
.oppx-tip-l li:first-child { border-top:0; }
.oppx-tip-l li b { flex:0 0 38px; text-align:right; color:var(--verde, #16A34A); font-variant-numeric:tabular-nums; }
.oppx-tip-l li b.neg { color:var(--vermelho, #DC2626); }
.oppx-tip-vz { color:var(--text-mid); margin-bottom:8px; }
.oppx-tip-lim { background:var(--bg-2); border-radius:8px; padding:6px 9px; font-size:11.5px; color:var(--text-mid); margin-bottom:6px; }
.oppx-tip-lim b { color:var(--text); }
.oppx-tip-f { font-size:11.5px; color:var(--text-mid); }
.oppx-tip-r { font-size:10.5px; color:var(--text-low, var(--text-mid)); margin-top:6px; opacity:.8; }

@media (max-width: 900px) {
  #oppx-painel { padding:4px 12px; max-width:100%; }
  .oppx-linha { flex-direction:column; align-items:stretch; gap:8px; }
  .oppx-linha > #opp-tabs, .oppx-linha > #opp-rec-counts, .oppx-linha > #opp-faixas { width:100%; max-width:100%; }
  .opp-cards { grid-template-columns:minmax(0, 1fr) !important; }
  .opp-card { min-width:0; padding:14px !important; }
  .opp-card-actions { flex-wrap:wrap; }
  .opp-card-hdr { flex-wrap:wrap; gap:8px; }
  .oppx-rot { flex:none; }
  #opp-tabs { overflow-x:auto; flex-wrap:nowrap !important; width:100%; scrollbar-width:none; position:relative; } /* relative: o emoji escondido (.icsf-eh, absoluto) não vaza a página */
  #opp-tabs button { flex:0 0 auto; }
}
