:root {

  --bs-body-color: var(--as-text);
  --bs-body-color-rgb: var(--as-text-rgb);
  --bs-body-bg: var(--as-body);
  --bs-body-bg-rgb: var(--as-body-rgb);

  --bs-primary: var(--as-primary);
  --bs-primary-rgb: var(--as-primary-rgb);

  --bs-secondary: var(--as-secondary);
  --bs-secondary-rgb: var(--as-secondary-rgb);

  --bs-card-cap-bg: var(--as-card-cap-bg);
  --bs-card-cap-color: var(--as-card-cap-color);

  --bs-heading-color: inherit;

  --bs-link-color: var(--as-link);
  --bs-link-color-rgb: var(--as-link-rgb);
  --bs-link-decoration: underline;
  --bs-link-hover-color: var(--as-link-active);

  --bs-border-color: var(--as-border);

  --bs-focus-ring-width: 0.25rem;
  --bs-focus-ring-opacity: 0.25;
  --bs-focus-ring-color: var(--as-border);

}


/* body {
} */

@media (max-width: 767.98px) {

  /* safe area in ios and android handled */
  body {
    /* padding-top: env(safe-area-inset-top); */
    padding-top: 2rem;
    background: var(--body-inverted);
    /* padding-bottom: 2rem; */
    /* padding-bottom: env(safe-area-inset-bottom); */
  }
}

header {
  z-index: 1060;
  height: var(--as-header-height);
}

#logo {
  height: var(--as-logo-height);
  padding-left: 0.5rem;
}

.navbar a, .navbar h5 {
  color: var(--as-primary);
}

.navbar-toggler-icon {
  --bs-navbar-toggler-icon-bg: url(icons/c7916d220c06f0096466.svg) !important;
}

.btn {
  --bs-btn-color: var(--as-button);
  --bs-btn-font-weight: 500;
  --bs-btn-bg: var(--as-button-bg);
  --bs-btn-border-color: var(--as-border);
}

.btn-sm,
.btn-group-sm>.btn {
  --bs-btn-padding-y: 0.2rem;
  --bs-btn-padding-x: 0.45rem;
  max-height: 2rem;
}

.btn:hover,
.btn:active,
.btn:focus-visible {
  --bs-btn-active-color: var(--as-button-active);
  --bs-btn-active-bg: var(--as-button-active-bg);
  --bs-btn-active-border-color: var(--as-border-active);

  --bs-btn-hover-color: var(--as-button-active);
  --bs-btn-hover-bg: var(--as-button-active-bg);
  --bs-btn-hover-border-color: var(--as-border-active);
}

.btn-close,
.btn-end {
  margin: auto;
  margin-right: 0.25rem;
  filter: unset !important;
}

.dataTable {
  font-size: 0.8rem;
}

.list-group-item {
  cursor: pointer;
  border: 1px solid var(--as-body);
}

.list-group-item.active,
.list-group-item:hover,
.list-group-item:focus {
  /* font-weight: 600; */
  border: 1px solid var(--as-text);
}

.score-card {
  border: 1px solid var(--as-border);
  margin: 0.25rem;
  padding: 0;
}

.sc .row>* {
  /* padding: 0.25rem; */
}

.sc-header {
  padding: 0;
  margin: 0;
  color: var(--as-card-cap-color);
  background-color: var(--as-card-cap-bg);
  border-bottom: var(--bs-card-border-width) solid var(--bs-card-border-color);
}

.sc-header>* {
  padding: 0.25rem 0.5rem;
  font-size: 1rem;
}

.sc-row {
  margin: 0 0.25rem;
  padding: 0rem;
}

.sc-row>* {
  padding: 0.1rem 0.25rem;
  font-size: 0.9rem;
}

.sc-event {
  /* display: flex; */
  /* padding: 0rem; */
  margin: 0.25rem 0;
  /* border: 1px solid var(--as-primary-subtle); */
  text-align: center;
  font-weight: 600;
}

.sc-event-img {
  max-height: 1.5rem;
  max-width: 1.5rem;
}

.sc-final {
  /* position: relative; */
  font-size: 0.9rem;
  font-weight: 600;
  text-align: center;
}

.sc-rank {
  /* position: absolute; */
  offset: 25% 75%;
  font-size: 0.6rem;
  color: var(--as-text)
}

.sc-all-around {
  /* position: relative; */
  font-size: 1rem;
  font-weight: 600;
  text-align: center;
}

.athlete-name,
.athlete-number,
.athlete-club,
.athlete-division {
  font-weight: 600;
}

.rank1st {
  background-color: rgba(255, 215, 0, 0.8);
}

.rank2nd {
  background-color: rgb(192 192 192 / 80%);
}

.rank3rd {
  background-color: rgb(225 121 17 / 80%);
  /*color: white;*/
}

.rank4th {
  background-color: rgb(0 176 240 / 60%);
}

.rank5th {
  background-color: rgb(255 0 0 / 60%);
}

.rank6th {
  background-color: rgb(0 176 80 / 80%);
}
