/* SPORTLAB Tournament Bracket Modification Stylesheet (Plugin Overrides) */

/* JQBracket Overrides */
div.jQBracket {
  background-color: transparent !important;
  font-family: "Helvetica Neue LT Roman", "Inter", sans-serif !important;
  height: auto !important;
}


/* Dimmed styling for empty-bye slots */
div.jQBracket .team:has(.empty-bye-wrapper) {
  opacity: 0.15 !important;
}




/* Clean, modern match competitor card */
div.jQBracket .team {
  height: 48px !important;
  border-radius: 8px !important;
  margin-bottom: 3px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 !important;
  overflow: visible !important;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Flex layout label replacement */
div.jQBracket .team div.label {
  position: static !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  flex-grow: 1 !important;
  padding: 0 12px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

/* Custom rendered competitor content style */
.team-label-inner {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  gap: 10px;
}

.team-avatar-wrapper {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  flex-shrink: 0;
}

.team-avatar {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.team-avatar-placeholder {
  font-size: 10px;
  font-weight: 700;
  color: #ffffff;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #2b3040 0%, #151821 100%);
  letter-spacing: 0.5px;
}

.team-info-text {
  display: flex;
  flex-direction: column;
  gap: 1px;
  overflow: hidden;
  text-align: left;
}

.team-name {
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.team-club {
  font-size: 9px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* AKA / AO Badge Styling */
.badge-aka-ao {
  font-size: 8px !important;
  font-weight: 800 !important;
  padding: 2px 5px !important;
  border-radius: 4px !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  line-height: 1.1 !important;
  display: inline-block !important;
  flex-shrink: 0;
}

.badge-aka {
  background-color: rgba(241, 65, 108, 0.12) !important;
  color: #f1416c !important;
  border: 1px solid rgba(241, 65, 108, 0.25) !important;
}

.badge-ao {
  background-color: rgba(0, 158, 247, 0.12) !important;
  color: #009ef7 !important;
  border: 1px solid rgba(0, 158, 247, 0.25) !important;
}

/* Explicit scoreboard decision (HANTEI, SENSHU, etc.) */
.scoreboard-bracket-decision {
  background: var(--bs-warning-light);
  border: 1px solid color-mix(in srgb, var(--bs-warning) 35%, transparent);
  border-radius: 999px;
  color: var(--bs-warning-inverse);
  font-size: 8px;
  font-weight: 800;
  left: 50%;
  letter-spacing: 0.03em;
  max-width: 92px;
  overflow: hidden;
  padding: 2px 6px;
  position: absolute;
  text-overflow: ellipsis;
  text-transform: uppercase;
  top: 50%;
  transform: translate(-50%, -50%);
  white-space: nowrap;
  z-index: 3;
}

/* Styled score box */
div.jQBracket .team div.score {
  float: none !important;
  height: 100% !important;
  width: 42px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  flex-shrink: 0;
  border-top-right-radius: 7px !important;
  border-bottom-right-radius: 7px !important;
}

/* JQBracket Connector Path Styles - Structural Base */
div.jQBracket .connector {
  border-width: 2px !important;
  z-index: 0 !important;
  transition: border-color 0.2s ease !important;
}

div.jQBracket .connector div.connector {
  border-bottom-width: 2px !important;
  transition: border-color 0.2s ease !important;
}

/* Bubbles for positions */
div.jQBracket .bubble {
  position: absolute !important;
  text-align: center !important;
  height: 24px !important;
  line-height: 22px !important;
  width: 65px !important;
  right: -75px !important;
  border-radius: 6px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  font-family: "Helvetica Neue LT Roman", "Inter", sans-serif !important;
  letter-spacing: 0.5px !important;
  border: 1px solid transparent !important;
  box-sizing: border-box !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
}

div.jQBracket .bubble:after {
  content: "" !important;
  position: absolute !important;
  top: 7px !important;
  left: -4px !important;
  border-width: 4px 4px 4px 0 !important;
  border-style: solid !important;
  border-color: transparent !important;
  display: block !important;
  width: 0 !important;
  height: 0 !important;
}

/* --- LIGHT THEME BUBBLES --- */
[data-bs-theme="light"] #big div.jQBracket .win .bubble {
  background-color: #fff8dd !important;
  border-color: #ffeb8c !important;
  color: #b58100 !important;
}
[data-bs-theme="light"] #big div.jQBracket .win .bubble:after {
  border-right-color: #fff8dd !important;
}

[data-bs-theme="light"] #big div.jQBracket .lose .bubble {
  background-color: #f5f8fa !important;
  border-color: #e4e6ef !important;
  color: #5e6278 !important;
}
[data-bs-theme="light"] #big div.jQBracket .lose .bubble:after {
  border-right-color: #f5f8fa !important;
}

[data-bs-theme="light"] #big2 div.jQBracket .win .bubble,
[data-bs-theme="light"] #big3 div.jQBracket .win .bubble {
  background-color: #e8fff3 !important;
  border-color: #50cd89 !important;
  color: #1a8553 !important;
}
[data-bs-theme="light"] #big2 div.jQBracket .win .bubble:after,
[data-bs-theme="light"] #big3 div.jQBracket .win .bubble:after {
  border-right-color: #e8fff3 !important;
}

[data-bs-theme="light"] #big2 div.jQBracket .lose .bubble,
[data-bs-theme="light"] #big3 div.jQBracket .lose .bubble {
  background-color: #fff5f8 !important;
  border-color: #f1416c !important;
  color: #d9214e !important;
}
[data-bs-theme="light"] #big2 div.jQBracket .lose .bubble:after,
[data-bs-theme="light"] #big3 div.jQBracket .lose .bubble:after {
  border-right-color: #fff5f8 !important;
}

/* --- DARK THEME BUBBLES --- */
[data-bs-theme="dark"] #big div.jQBracket .win .bubble {
  background-color: rgba(255, 199, 0, 0.12) !important;
  border-color: rgba(255, 199, 0, 0.25) !important;
  color: #ffc700 !important;
}
[data-bs-theme="dark"] #big div.jQBracket .win .bubble:after {
  border-right-color: rgba(255, 199, 0, 0.12) !important;
}

[data-bs-theme="dark"] #big div.jQBracket .lose .bubble {
  background-color: rgba(255, 255, 255, 0.05) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: #a1a5b7 !important;
}
[data-bs-theme="dark"] #big div.jQBracket .lose .bubble:after {
  border-right-color: rgba(255, 255, 255, 0.05) !important;
}

[data-bs-theme="dark"] #big2 div.jQBracket .win .bubble,
[data-bs-theme="dark"] #big3 div.jQBracket .win .bubble {
  background-color: rgba(80, 205, 137, 0.12) !important;
  border-color: rgba(80, 205, 137, 0.25) !important;
  color: #50cd89 !important;
}
[data-bs-theme="dark"] #big2 div.jQBracket .win .bubble:after,
[data-bs-theme="dark"] #big3 div.jQBracket .win .bubble:after {
  border-right-color: rgba(80, 205, 137, 0.12) !important;
}

[data-bs-theme="dark"] #big2 div.jQBracket .lose .bubble,
[data-bs-theme="dark"] #big3 div.jQBracket .lose .bubble {
  background-color: rgba(241, 65, 108, 0.12) !important;
  border-color: rgba(241, 65, 108, 0.25) !important;
  color: #f1416c !important;
}
[data-bs-theme="dark"] #big2 div.jQBracket .lose .bubble:after,
[data-bs-theme="dark"] #big3 div.jQBracket .lose .bubble:after {
  border-right-color: rgba(241, 65, 108, 0.12) !important;
}

/* --- Path Configuration: Forces straight line paths & overrides Metronic highlight positioning overrides --- */
div.jQBracket .connector,
div.jQBracket .connector.highlight,
div.jQBracket .connector.highlightWinner,
div.jQBracket .connector.highlightLoser,
div.jQBracket .connector.highlightHoverLoser {
  position: absolute !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  background: transparent !important;
  border-left: 0 !important;
  border-left-style: none !important;
  overflow: visible !important;
}

div.jQBracket .connector div.connector,
div.jQBracket .connector div.connector.highlight,
div.jQBracket .connector div.connector.highlightWinner,
div.jQBracket .connector div.connector.highlightLoser,
div.jQBracket .connector div.connector.highlightHoverLoser {
  position: absolute !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  background: transparent !important;
  border-top: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-top-style: none !important;
  border-left-style: none !important;
  border-right-style: none !important;
  height: 0 !important;
  overflow: visible !important;
}

/* Prevent Metronic highlight positioning on contestant cards */
div.jQBracket .team,
div.jQBracket .team.highlight,
div.jQBracket .team.highlightWinner,
div.jQBracket .team.highlightLoser,
div.jQBracket .team.highlightHoverLoser {
  position: relative !important;
  padding: 0 !important;
  margin: 0 0 3px 0 !important;
  box-sizing: border-box !important;
}

/* ==================================================== */
/* ===                LIGHT THEME BRANCH            === */
/* ==================================================== */
[data-bs-theme="light"] div.jQBracket .team {
  background-color: #ffffff !important;
  border: 1px solid #e4e6ef !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04) !important;
}

[data-bs-theme="light"] div.jQBracket .team:hover {
  background-color: #f5f8fa !important;
  border-color: #b5b5c3 !important;
}

[data-bs-theme="light"] div.jQBracket .team:first-child {
  border-bottom: 1px solid #e4e6ef !important;
}

[data-bs-theme="light"] div.jQBracket .team div.label {
  color: #181c32 !important;
}

[data-bs-theme="light"] .team-name {
  color: #181c32;
}

[data-bs-theme="light"] .team-club {
  color: #7e8299;
}

[data-bs-theme="light"] div.jQBracket .team div.score {
  background-color: #f5f8fa !important;
  border-left: 1px solid #e4e6ef !important;
  color: #7e8299 !important;
}

/* states */
[data-bs-theme="light"] div.jQBracket .team.win {
  background-color: rgba(80, 205, 137, 0.08) !important;
  border-color: rgba(80, 205, 137, 0.25) !important;
}

[data-bs-theme="light"] div.jQBracket .team.win div.score {
  background-color: rgba(80, 205, 137, 0.12) !important;
  color: #50cd89 !important;
  border-left-color: rgba(80, 205, 137, 0.25) !important;
}

[data-bs-theme="light"] div.jQBracket .team.lose {
  background-color: #f5f8fa !important;
  border-color: #e4e6ef !important;
  opacity: 0.80;
}

[data-bs-theme="light"] div.jQBracket .team.lose div.score {
  color: #f1416c !important;
}

[data-bs-theme="light"] div.jQBracket .team.highlight {
  background-color: #eff2f5 !important;
  border-color: #a1a5b7 !important;
}

[data-bs-theme="light"] div.jQBracket .team.highlightWinner {
  background-color: rgba(80, 205, 137, 0.08) !important;
  border-color: #50cd89 !important;
  color: inherit !important;
}

[data-bs-theme="light"] div.jQBracket .team.highlightLoser,
[data-bs-theme="light"] div.jQBracket .team.highlightHoverLoser {
  background-color: rgba(241, 65, 108, 0.08) !important;
  border-color: #f1416c !important;
  color: inherit !important;
}

/* Light Theme Path Coloring */
[data-bs-theme="light"] div.jQBracket .connector {
  border-color: #d8dbdf !important;
}
[data-bs-theme="light"] div.jQBracket .connector div.connector {
  border-bottom-color: #d8dbdf !important;
}
[data-bs-theme="light"] div.jQBracket .connector.highlightWinner,
[data-bs-theme="light"] div.jQBracket .connector div.connector.highlightWinner {
  border-color: #50cd89 !important; /* Green Winner Path */
}
[data-bs-theme="light"] div.jQBracket .connector.highlightLoser,
[data-bs-theme="light"] div.jQBracket .connector div.connector.highlightLoser,
[data-bs-theme="light"] div.jQBracket .connector.highlightHoverLoser,
[data-bs-theme="light"] div.jQBracket .connector div.connector.highlightHoverLoser {
  border-color: #f1416c !important; /* Red Loser Path */
}
[data-bs-theme="light"] div.jQBracket .connector.highlight,
[data-bs-theme="light"] div.jQBracket .connector div.connector.highlight {
  border-color: #009ef7 !important; /* Blue Active Path */
}

/* ==================================================== */
/* ===                DARK THEME BRANCH             === */
/* ==================================================== */
[data-bs-theme="dark"] div.jQBracket .team {
  background-color: #161820 !important;
  border: 1px solid rgba(255, 255, 255, 0.05) !important;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15) !important;
}

[data-bs-theme="dark"] div.jQBracket .team:hover {
  background-color: #1e202b !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

[data-bs-theme="dark"] div.jQBracket .team:first-child {
  border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}

[data-bs-theme="dark"] div.jQBracket .team div.label {
  color: #e1e3ea !important;
}

[data-bs-theme="dark"] .team-name {
  color: #ffffff;
}

[data-bs-theme="dark"] .team-club {
  color: #7e8299;
}

[data-bs-theme="dark"] div.jQBracket .team div.score {
  background-color: rgba(255, 255, 255, 0.02) !important;
  border-left: 1px solid rgba(255, 255, 255, 0.05) !important;
  color: #5e6278 !important;
}

/* states */
[data-bs-theme="dark"] div.jQBracket .team.win {
  background-color: rgba(80, 205, 137, 0.08) !important;
  border-color: rgba(80, 205, 137, 0.2) !important;
}

[data-bs-theme="dark"] div.jQBracket .team.win div.score {
  background-color: rgba(80, 205, 137, 0.12) !important;
  color: #50cd89 !important;
  border-left-color: rgba(80, 205, 137, 0.2) !important;
}

[data-bs-theme="dark"] div.jQBracket .team.lose {
  background-color: #0e0f14 !important;
  border-color: rgba(255, 255, 255, 0.07) !important;
  
  opacity: 0.80;
}

[data-bs-theme="dark"] div.jQBracket .team.lose div.score {
  color: #f1416c !important;
}

[data-bs-theme="dark"] div.jQBracket .team.highlight {
  background-color: #212433 !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
}

[data-bs-theme="dark"] div.jQBracket .team.highlightWinner {
  background-color: rgba(80, 205, 137, 0.12) !important;
  border-color: #50cd89 !important;
  color: inherit !important;
}

[data-bs-theme="dark"] div.jQBracket .team.highlightLoser,
[data-bs-theme="dark"] div.jQBracket .team.highlightHoverLoser {
  background-color: rgba(241, 65, 108, 0.12) !important;
  border-color: #f1416c !important;
  color: inherit !important;
}

/* Dark Theme Path Coloring */
[data-bs-theme="dark"] div.jQBracket .connector {
  border-color: rgba(255, 255, 255, 0.06) !important;
}
[data-bs-theme="dark"] div.jQBracket .connector div.connector {
  border-bottom-color: rgba(255, 255, 255, 0.06) !important;
}
[data-bs-theme="dark"] div.jQBracket .connector.highlightWinner,
[data-bs-theme="dark"] div.jQBracket .connector div.connector.highlightWinner {
  border-color: #50cd89 !important; /* Green Winner Path */
}
[data-bs-theme="dark"] div.jQBracket .connector.highlightLoser,
[data-bs-theme="dark"] div.jQBracket .connector div.connector.highlightLoser,
[data-bs-theme="dark"] div.jQBracket .connector.highlightHoverLoser,
[data-bs-theme="dark"] div.jQBracket .connector div.connector.highlightHoverLoser {
  border-color: #f1416c !important; /* Red Loser Path */
}
[data-bs-theme="dark"] div.jQBracket .connector.highlight,
[data-bs-theme="dark"] div.jQBracket .connector div.connector.highlight {
  border-color: #009ef7 !important; /* Blue Active Path */
}

@media print {
  [data-bs-theme="dark"] div.jQBracket .team,
  [data-bs-theme="light"] div.jQBracket .team,
  div.jQBracket .team {
    background-color: #ffffff !important;
    border: 1px solid #b5b5c3 !important;
    color: #181c32 !important;
    box-shadow: none !important;
  }
  
  [data-bs-theme="dark"] .team-name,
  [data-bs-theme="light"] .team-name,
  .team-name {
    color: #181c32 !important;
  }
  
  [data-bs-theme="dark"] div.jQBracket .team div.score,
  [data-bs-theme="light"] div.jQBracket .team div.score,
  div.jQBracket .team div.score {
    background-color: #f5f8fa !important;
    border-left: 1px solid #b5b5c3 !important;
    color: #181c32 !important;
  }
  
  [data-bs-theme="dark"] div.jQBracket .team.win,
  [data-bs-theme="light"] div.jQBracket .team.win,
  div.jQBracket .team.win {
    background-color: rgba(80, 205, 137, 0.08) !important;
    border-color: #50cd89 !important;
  }
  
  [data-bs-theme="dark"] div.jQBracket .team.win div.score,
  [data-bs-theme="light"] div.jQBracket .team.win div.score,
  div.jQBracket .team.win div.score {
    background-color: rgba(80, 205, 137, 0.12) !important;
    color: #50cd89 !important;
    border-left-color: #50cd89 !important;
  }
  
  [data-bs-theme="dark"] div.jQBracket .team.lose,
  [data-bs-theme="light"] div.jQBracket .team.lose,
  div.jQBracket .team.lose {
    background-color: #f5f8fa !important;
    border-color: #e4e6ef !important;
    opacity: 0.75 !important;
  }
  
  [data-bs-theme="dark"] div.jQBracket .team.lose div.score,
  [data-bs-theme="light"] div.jQBracket .team.lose div.score,
  div.jQBracket .team.lose div.score {
    color: #f1416c !important;
  }

  [data-bs-theme="dark"] div.jQBracket .connector,
  [data-bs-theme="light"] div.jQBracket .connector,
  div.jQBracket .connector {
    border-color: #b5b5c3 !important;
  }

  [data-bs-theme="dark"] div.jQBracket .connector div.connector,
  [data-bs-theme="light"] div.jQBracket .connector div.connector,
  div.jQBracket .connector div.connector {
    border-bottom-color: #b5b5c3 !important;
  }

  [data-bs-theme="dark"] div.jQBracket .connector.highlightWinner,
  [data-bs-theme="light"] div.jQBracket .connector.highlightWinner,
  div.jQBracket .connector.highlightWinner,
  [data-bs-theme="dark"] div.jQBracket .connector div.connector.highlightWinner,
  [data-bs-theme="light"] div.jQBracket .connector div.connector.highlightWinner,
  div.jQBracket .connector div.connector.highlightWinner {
    border-color: #50cd89 !important;
  }

  [data-bs-theme="dark"] div.jQBracket .connector.highlightLoser,
  [data-bs-theme="light"] div.jQBracket .connector.highlightLoser,
  div.jQBracket .connector.highlightLoser,
  [data-bs-theme="dark"] div.jQBracket .connector div.connector.highlightLoser,
  [data-bs-theme="light"] div.jQBracket .connector div.connector.highlightLoser,
  div.jQBracket .connector div.connector.highlightLoser,
  [data-bs-theme="dark"] div.jQBracket .connector.highlightHoverLoser,
  [data-bs-theme="light"] div.jQBracket .connector.highlightHoverLoser,
  div.jQBracket .connector.highlightHoverLoser,
  [data-bs-theme="dark"] div.jQBracket .connector div.connector.highlightHoverLoser,
  [data-bs-theme="light"] div.jQBracket .connector div.connector.highlightHoverLoser,
  div.jQBracket .connector div.connector.highlightHoverLoser {
    border-color: #f1416c !important;
  }

  [data-bs-theme="dark"] .badge-aka,
  [data-bs-theme="light"] .badge-aka,
  .badge-aka {
    background-color: rgba(241, 65, 108, 0.12) !important;
    color: #f1416c !important;
    border: 1px solid rgba(241, 65, 108, 0.25) !important;
  }

  [data-bs-theme="dark"] .badge-ao,
  [data-bs-theme="light"] .badge-ao,
  .badge-ao {
    background-color: rgba(0, 158, 247, 0.12) !important;
    color: #009ef7 !important;
    border: 1px solid rgba(0, 158, 247, 0.25) !important;
  }

  /* --- PRINT BUBBLES --- */
  [data-bs-theme="dark"] #big div.jQBracket .win .bubble,
  [data-bs-theme="light"] #big div.jQBracket .win .bubble,
  #big div.jQBracket .win .bubble {
    background-color: #fff8dd !important;
    border-color: #ffeb8c !important;
    color: #b8860b !important;
  }
  #big div.jQBracket .win .bubble:after {
    border-right-color: #fff8dd !important;
  }

  [data-bs-theme="dark"] #big div.jQBracket .lose .bubble,
  [data-bs-theme="light"] #big div.jQBracket .lose .bubble,
  #big div.jQBracket .lose .bubble {
    background-color: #f5f8fa !important;
    border-color: #e4e6ef !important;
    color: #5e6278 !important;
  }
  #big div.jQBracket .lose .bubble:after {
    border-right-color: #f5f8fa !important;
  }

  [data-bs-theme="dark"] #big2 div.jQBracket .win .bubble,
  [data-bs-theme="light"] #big2 div.jQBracket .win .bubble,
  #big2 div.jQBracket .win .bubble,
  [data-bs-theme="dark"] #big3 div.jQBracket .win .bubble,
  [data-bs-theme="light"] #big3 div.jQBracket .win .bubble,
  #big3 div.jQBracket .win .bubble {
    background-color: #e8fff3 !important;
    border-color: #50cd89 !important;
    color: #1ea97c !important;
  }
  #big2 div.jQBracket .win .bubble:after,
  #big3 div.jQBracket .win .bubble:after {
    border-right-color: #e8fff3 !important;
  }

  [data-bs-theme="dark"] #big2 div.jQBracket .lose .bubble,
  [data-bs-theme="light"] #big2 div.jQBracket .lose .bubble,
  #big2 div.jQBracket .lose .bubble,
  [data-bs-theme="dark"] #big3 div.jQBracket .lose .bubble,
  [data-bs-theme="light"] #big3 div.jQBracket .lose .bubble,
  #big3 div.jQBracket .lose .bubble {
    background-color: #fff5f8 !important;
    border-color: #f1416c !important;
    color: #d9214e !important;
  }
  #big2 div.jQBracket .lose .bubble:after,
  #big3 div.jQBracket .lose .bubble:after {
    border-right-color: #fff5f8 !important;
  }
}