/* La previa comparte la paleta y los controles del resumen final. */
.bb-pregame-prediction {
  --bb-final-navy: #01133b;
  --bb-final-red: #a80523;
  --bb-final-line: #dce3ec;
}

.bb-pregame-prediction [hidden] {
  display: none !important;
}

.bb-pregame-prediction button:focus-visible {
  outline: 3px solid #4195ed;
  outline-offset: 3px;
}

:is(.bb-final-summary, .bb-pregame-prediction) .bb-lidom-mvp {
  margin: 0 0 22px;
  padding: 16px;
  border: 1px solid var(--bb-final-line);
  border-radius: 12px;
  background: #f3f6fb;
  color: var(--bb-final-navy);
}

:is(.bb-final-summary, .bb-pregame-prediction) .bb-lidom-mvp h3 {
  margin: 0 0 8px;
  color: inherit;
  font-size: 18px;
  font-weight: 900;
}

.bb-lidom-mvp p {
  margin: 0 0 12px;
  color: #526077;
  font-size: 14px;
}

.bb-lidom-mvp [role="status"] {
  margin: 12px 0 0;
  font-weight: 700;
}

.bb-lidom-mvp [role="status"]:empty {
  display: none;
}

.bb-lidom-mvp fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.bb-lidom-mvp legend {
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 800;
}

.bb-lidom-mvp-choice {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 54px;
  margin-bottom: 7px;
  padding: 8px 10px;
  border: 1px solid var(--bb-final-line);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
}

.bb-lidom-mvp-choice:has(input:checked) {
  border-color: var(--bb-final-red);
}

.bb-lidom-mvp-choice:has(input:disabled) {
  cursor: default;
}

.bb-lidom-mvp-choice input {
  flex: none;
  width: 17px;
  height: 17px;
  margin: 0;
  accent-color: var(--bb-final-red);
}

.bb-lidom-mvp-candidate {
  flex: 1;
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 14px;
}

.bb-lidom-mvp small {
  display: block;
  color: #526077;
  font-size: 12px;
}

.bb-lidom-mvp-result {
  flex: 0 0 min(35%, 135px);
  min-width: 0;
  text-align: right;
}

.bb-lidom-mvp-result progress {
  display: block;
  width: 100%;
  height: 7px;
  margin-top: 4px;
  accent-color: var(--bb-final-red);
}

.bb-lidom-mvp-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  margin-top: 8px;
}

:is(.bb-final-summary, .bb-pregame-prediction) .bb-lidom-mvp button {
  min-height: 44px;
  padding: 8px 13px;
  border: 1px solid transparent;
  border-radius: 8px;
  font: inherit;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
}

:is(.bb-final-summary, .bb-pregame-prediction) .bb-lidom-mvp-primary {
  background: var(--bb-final-red);
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

:is(.bb-final-summary, .bb-pregame-prediction) .bb-lidom-mvp-refresh {
  border-color: var(--bb-final-line);
  background: #fff;
  color: var(--bb-final-navy);
}

.bb-lidom-mvp button:disabled {
  opacity: .65;
  cursor: default;
}

.bb-prediction-logo { display: none; }

@media (max-width: 767.98px) {
  [data-prediction-logo] .bb-lidom-mvp-choice {
    display: grid;
    grid-template-columns: 20px 48px minmax(0, 1fr);
    gap: 4px 12px;
    min-height: 104px;
    padding: 14px 12px;
    margin-bottom: 12px;
    border-width: 2px;
    border-radius: 12px;
    -webkit-tap-highlight-color: transparent;
  }

  [data-prediction-logo] .bb-lidom-mvp-choice:has(input:checked) {
    background: #fff4f6;
    border-color: var(--bb-final-red);
  }

  [data-prediction-logo] .bb-lidom-mvp-choice:focus-within {
    outline: 3px solid #4195ed;
    outline-offset: 2px;
  }

  [data-prediction-logo] .bb-lidom-mvp-choice input {
    grid-column: 1;
    grid-row: 1 / 3;
    width: 20px;
    height: 20px;
  }

  [data-prediction-logo] .bb-prediction-logo {
    display: block;
    grid-column: 2;
    grid-row: 1 / 3;
    object-fit: contain;
  }

  [data-prediction-logo] .bb-lidom-mvp-candidate {
    grid-column: 3;
    font-size: 15px;
    line-height: 1.35;
  }

  [data-prediction-logo] .bb-lidom-mvp-result {
    grid-column: 3;
    width: 100%;
    text-align: left;
  }

  [data-prediction-logo] .bb-lidom-mvp-actions {
    flex-direction: column;
    gap: 10px;
  }

  .bb-pregame-prediction [data-prediction-logo] button {
    width: 100%;
    min-height: 48px;
    font-size: 16px;
  }
}

.bb-final-prediction {
  margin: 12px auto 22px;
  padding: 16px;
  border: 1px solid #dce3ec;
  border-radius: 12px;
  background: #f3f6fb;
  color: #01133b;
}

.bb-final-prediction h3 {
  margin: 0 0 8px;
  font-size: 18px;
  font-weight: 900;
}

.bb-final-prediction [data-prediction-verdict] {
  color: inherit;
  font-weight: 700;
}

.bb-final-prediction ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0 0 8px;
  padding: 0;
  list-style: none;
}

.bb-final-prediction li {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 4px 8px;
  padding: 8px 10px;
  border: 1px solid #dce3ec;
  border-radius: 8px;
  background: #fff;
  overflow-wrap: anywhere;
}

.bb-final-prediction li strong { color: #a80523; }
.bb-final-prediction [data-prediction-total] { margin: 0; }
.bb-final-prediction[hidden], .bb-final-prediction [hidden] { display: none !important; }

@media (min-width: 992px) {
  .bb-final-prediction { width: 83.333333%; }
}