/* Global color variables. */
:root {
  --tms-blue-team-header: rgb(109, 158, 235);
  --tms-blue-team: rgb(201, 218, 248);
  --tms-red-team-header: rgb(224, 102, 102);
  --tms-red-team: rgb(244, 204, 204);

  --tms-match-result-header: rgb(255, 217, 102);
  --tms-match-result: rgb(255, 242, 204);
  --tms-fight-header: var(--bs-gray-400);
  --tms-round-header: var(--bs-gray-300);

  --tms-match-status-CALLED_TO_HOLDING: rgb(242, 229, 205);
  --tms-match-status-IN_STAGING: rgb(183, 225, 205);
  --tms-match-status-ON_ROUTE_TO_RING: rgb(180, 167, 214);
  --tms-match-status-CHECKED_IN_AT_RING: rgb(217, 210, 233);
  --tms-match-status-COMPETING: rgb(201, 218, 248);
  --tms-match-status-DONE: rgb(164, 194, 244);
  --tms-match-status-CANCELED: rgb(244, 204, 204);

  --tms-ring-status-needs-attention: rgb(255, 0, 0);
  --tms-ring-status-SETTING_UP: var(--bs-gray-400);
  --tms-ring-status-UP_AND_RUNNING: rgb(183, 225, 205);
  --tms-ring-status-NEEDS_MATCH: rgb(255, 145, 249);
  --tms-ring-status-INJURY: var(--tms-ring-status-needs-attention);
  --tms-ring-status-TECH_ISSUE_DAEDO: var(--tms-ring-status-needs-attention);
  --tms-ring-status-TECH_ISSUE_TMS: var(--tms-ring-status-needs-attention);
  --tms-ring-status-SHORT_STAFF_TC: var(--tms-ring-status-needs-attention);
  --tms-ring-status-SHORT_JUDGES: var(--tms-ring-status-needs-attention);
  --tms-ring-status-MISSING_CENTER_REF: var(--tms-ring-status-needs-attention);
  --tms-ring-status-ON_BREAK: rgb(249, 203, 156);
  --tms-ring-status-RUNNING_EXHIBITION: rgb(255, 229, 153);
  --tms-ring-status-DONE_FOR_DAY: rgb(164, 194, 244);
}

.fixed-bottom-right {
  position: fixed !important;
  right: 0 !important;
  bottom: 0 !important;
}

/* Make a table column as small as it can be (disable text wrapping). */
.small-col {
  width: 0;
  white-space: nowrap;
}

/* Don't wrap the header rows of tables. */
table > thead > tr {
  white-space: nowrap;
}

/* Contains a table that scrolls in both directions. Can be resized with `width`
   and `height` to force the table to be a certain size.
 */
.table-overflow {
  overflow-x: scroll;
  overflow-y: scroll;
  /* Force the vertical scroll bar to be outside any content (".p-3"). */
  padding-right: 1rem;
  /* Set a default minimum height for the container. */
  min-height: 100px;
}

/* Special group dividers needed for ".table-overflow".
   Do not apply the style if it follows a divider with a bottom border already.
 */
:not(.table-of-group-divider-bottom)
  + .table-of-group-divider
  > :not(.d-none)
  > * {
  /* Override the top border of the `td` and `th` elements in the first row of
     this group.
   */
  border-top: var(--divider-width, calc(var(--bs-border-width) * 2))
    var(--divider-style, solid) var(--divider-color, currentcolor) !important;
}
/* This is a workaround to only apply the styles to the first child without the
   class ".d-none". Using ":first-child" worked well until the Scheduling View
   made it possible to hide the first row of a group.
 */
:not(.table-of-group-divider-bottom)
  + .table-of-group-divider
  > :not(.d-none)
  ~ :not(.d-none)
  > * {
  --divider-width: 0;
}
.table-of-group-divider-bottom > :last-child > * {
  /* Override the bottom border of the `td` and `th` elements in the last row of
     this group.
   */
  border-bottom: var(--divider-width, calc(var(--bs-border-width) * 2))
    var(--divider-style, solid) var(--divider-color, currentcolor) !important;
}

/* For tables that have the header row frozen:
   - Separate borders so a border can be attached to the bottom of the sticky
     header row
   - Make the first row sticky
 */
table.table-header-frozen {
  border-collapse: separate;
  border-spacing: 0;
}
table.table-header-frozen > thead {
  position: sticky;
  top: 0;
  /* A little higher so that it's above any other sticky elements (such as the
     first column of every row).
   */
  z-index: 10;
}
/* For tables that have the first column frozen. */
table.table-col1-frozen tr > :first-child {
  position: sticky;
  left: 0;
}

/* Remove a table cell's background color. */
.cell-clear {
  --bs-table-bg: rgba(0, 0, 0, 0);
}

/* Custom colors for table cells relating to teams and match results. */
.blue-team-header-cell {
  --bs-table-bg: var(--tms-blue-team-header);
}
.blue-team-cell {
  --bs-table-bg: var(--tms-blue-team);
}
.red-team-header-cell {
  --bs-table-bg: var(--tms-red-team-header);
}
.red-team-cell {
  --bs-table-bg: var(--tms-red-team);
}
.match-result-header-cell {
  --bs-table-bg: var(--tms-match-result-header);
}
.match-result-cell {
  --bs-table-bg: var(--tms-match-result);
}
.fight-header-cell {
  --bs-table-bg: var(--tms-fight-header);
}
.round-header-cell {
  --bs-table-bg: var(--tms-round-header);
}

.form-control,
.form-select {
  /* Don't have inputs be full width unless explicitly specified. */
  width: unset;
}

/* A Bootstrap spinner between the regular and small versions. */
.spinner-border-md {
  --bs-spinner-width: 1.5rem;
  --bs-spinner-height: 1.5rem;
  --bs-spinner-border-width: 0.25em;
}

/* A custom color for a ".btn" that defines `--btn-custom-color`. */
.btn-outline-custom {
  --bs-btn-color: var(--btn-custom-color);
  --bs-btn-border-color: var(--btn-custom-color);
  --bs-btn-active-bg: var(--btn-custom-color);
  --bs-btn-active-border-color: var(--btn-custom-color);
}

/* Like Bootstrap's ".badge.rounded-pill", but with less of the default
   settings.
 */
.pill {
  --pill-padding-x: 0.65em;
  --pill-padding-y: 0.35em;
  --pill-margin-x: 0;
  --pill-margin-y: 0.2em;
  display: inline-block;
  padding: var(--pill-padding-y) var(--pill-padding-x);
  margin: var(--pill-margin-y) var(--pill-margin-x);
  font-size: var(--pill-font-size);
  line-height: 1;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: var(--bs-border-radius-pill);
}

.pill-sm {
  --pill-font-size: 0.75em;
}

/* Athlete pills in the "Called to Holding" view. Expected to modify an element
   with ".pill".
 */
.athlete-pill {
  /* A little more than the default. */
  --pill-padding-y: 0.4em;
}

.resizer-handle {
  cursor: row-resize;
  width: 100%;
  height: 12px;
  background-color: rgb(224, 224, 224);
}
.resizer-handle.resizing {
  background-color: rgb(200, 200, 200);
}
/* Mostly copied from ".bi.bi-grip-horizontal". */
.resizer-handle-icon::before {
  position: relative;
  top: -0.4em;
  content: "\f3fd";
  display: inline-block;
  font-family: bootstrap-icons !important;
  font-style: normal;
  font-weight: normal !important;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  vertical-align: -0.125em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.fight-row-border-top {
  border-top: 1.5px solid black !important;
}
