/* ====== Reset leve dentro do wrapper ====== */
#og-arb-wrap, #og-arb-wrap * { box-sizing: border-box; }

/* ====== Toolbar ====== */
.og-toolbar { display:flex; gap:12px; align-items:center; margin-bottom:16px; }
.og-btn { background:#2457ff; color:#fff; border:none; border-radius:10px; padding:8px 14px; cursor:pointer; }
.og-btn:hover { filter:brightness(1.1); }
.og-btn.og-btn-outline { background:transparent; border:1px solid rgba(255,255,255,.2); color:#fff; }
.og-search input { width:100%; min-width:320px; padding:10px 12px; border-radius:10px; border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.05); color:#fff; }

/* ====== Layout principal (tabela + filtro fixo) ====== */
.og-layout{
  display:grid !important;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap:24px;
  align-items:start;
}
.og-table-col{ min-width:0; }

/* Painel de filtros fixo, sem sobrepor a tabela */
.og-filter{
  position: sticky;
  top: 84px;
  width: 360px;
  max-height: calc(100vh - 110px);
  overflow:auto;
  background: rgba(34,40,52,.9);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 12px;
  padding: 14px;
  z-index: 0;
}
.og-filter h3{ margin:0 0 10px 0; color:#2ea0ff; font-size:18px; }
.og-filter label{ display:block; margin:10px 0 6px 0; color:#cfd6e6; font-size:13px; }
.og-filter input{
  width:100%;
  padding:9px 10px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.2);
  background:rgba(255,255,255,.06);
  color:#fff;
  font-size:14px;
}
.og-filter .og-row{ display:flex; gap:10px; }
.og-filter .og-btn{ width:auto; }
@media (max-width: 1024px){
  .og-layout{ grid-template-columns: 1fr; }
  .og-filter{ position:static; width:auto; max-height:none; }
}

/* ====== Tabela ====== */
.og-table{
  width:100%;
  border-collapse: separate;
  border-spacing: 0;
  background: rgba(17,20,27,.85);
  border:1px solid rgba(255,255,255,.12);
  border-radius: 12px;
  overflow:hidden;
  font-size:14px;
}
.og-table thead th{
  background:#1f2738;
  color:#cfe2ff;
  padding:12px 10px;
  text-align:left;
  border-bottom:1px solid rgba(255,255,255,.1);
  white-space:nowrap;
  font-weight:700;
}
.og-table tbody td{
  padding:14px 12px;
  border-bottom:1px solid rgba(255,255,255,.08);
  vertical-align:top;
  color:#dee6f5;
}
.og-table tbody tr:hover td{ background:rgba(255,255,255,.03); }

/* Colunas e tipografia internas, estilo compacto */
.og-cell-profit{ width:110px; }
.og-profit{ font-weight:800; color:#4fffa1; }

.og-cell-bk .og-bk,
.og-cell-mkt .og-mkt,
.og-cell-odd .og-odd-wrap{ margin:4px 0; line-height:1.25; }

.og-cell-bk a{ color:#9bc8ff; text-decoration: underline; }
.og-cell-bk a:hover{ color:#cfe2ff; }

.og-evt-title{ font-weight:800; color:#eaf2ff; }
.og-evt-sub{ color:#aeb8cc; margin-top:2px; }
.og-evt-sport{ color:#96a3bd; margin-top:2px; font-size:13px; }

/* Data e hora com timer verde */
.og-cell-dt .og-dt-str{ color:#eaf2ff; }
.og-cell-dt .og-timer{
  margin-top:4px;
  font-weight:800;
  color:#00d26a;
  line-height:1.15;
}
.og-cell-dt .og-live{ color:#00d26a; font-weight:800; }
.og-cell-dt .og-risk{ color:#ff5b5b; font-weight:700; }

/* Odds em blocos sutis */
.og-odd-wrap{
  display:inline-block;
  padding:2px 8px;
  border-radius:8px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
}
.og-odd{ font-weight:800; color:#ffffff; }

/* Botão calculadora discreto */
.og-calc-btn{
  margin-top:8px;
  padding:6px 10px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  color:#fff;
  cursor:pointer;
  font-size:13px;
}
.og-calc-btn:hover{ background:rgba(255,255,255,.12); }

/* Estado vazio */
.og-empty{ padding:30px !important; text-align:center; color:#a9b4c9; }

/* ====== Modal da Calculadora (compacto, branco, arredondado) ====== */
#og-calc-modal{
  position:fixed; inset:0;
  background:rgba(0,0,0,.7);
  display:none; align-items:center; justify-content:center;
  z-index: 9999;
}
#og-calc-modal.open{ display:flex; }
#og-calc-modal .og-modal-content{
  width:560px; max-width:95vw;
  background:#fff; color:#111;
  border-radius:14px; overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.35);
}
#og-calc-modal .og-modal-header{
  background:#0d6efd; color:#fff;
  padding:12px 16px;
  display:flex; align-items:center; justify-content:space-between;
}
#og-calc-modal .og-event-title{ font-size:20px; font-weight:800; margin:0; }
#og-calc-modal .og-close{ cursor:pointer; font-size:20px; line-height:1; }

#og-calc-modal .og-modal-body{ padding:16px; }
#og-calc-modal h3{ margin:0 0 10px 0; font-size:16px; }

#og-calc-modal .og-stake-row{
  display:grid;
  grid-template-columns:auto 1fr auto 1fr;
  gap:10px; align-items:center;
  margin-bottom:12px;
}
#og-stake, #og-return{
  padding:8px; border:1px solid #ddd; border-radius:8px;
  text-align:center; font-weight:700;
}

#og-calc-modal .og-lines{ margin-top:4px; }
#og-calc-modal .og-line{
  display:grid;
  grid-template-columns:1.2fr 1.2fr 1fr 1fr 1fr;
  gap:8px; align-items:center;
  background:#f6f8fa; padding:8px; border-radius:8px;
  margin-bottom:8px;
}
#og-calc-modal .og-book{ font-weight:800; color:#0d6efd; }
#og-calc-modal .og-mkt{ color:#333; }
#og-calc-modal .og-odd-in, #og-calc-modal .og-stake-in{
  padding:6px; border:1px solid #ddd; border-radius:6px; text-align:center;
}
#og-calc-modal .og-ret{ text-align:center; font-weight:800; color:#0d6efd; }

#og-calc-modal .og-summary{
  display:grid; grid-template-columns:repeat(2,1fr);
  gap:10px; margin-top:10px;
}
#og-calc-modal .og-summary div{
  background:#f3f5f7; padding:10px; border-radius:8px; text-align:center;
}
#og-calc-modal .og-summary span{ display:block; color:#666; font-size:13px; }
#og-calc-modal .og-summary b{ color:#0a7f4f; font-size:16px; }