/* Brand color palette. "Locked" colors are from style guide. The rest were manually added. */
:root {
  --color-grey-950: #191614;
  --color-grey-900: #242220;
  --color-grey-800: #312e2c;
  --color-grey-700: #46413f;
  --color-grey-600: #58514c;
  --color-grey-500: #6f6761;
  --color-grey-400: #9b9085;
  --color-grey-300: #bcb1a3;
  --color-grey-200: #dad2c4;
  --color-grey-100: #eae6dc;
  --color-grey-50: #f9f8f5 /* locked */;

  --color-purple-950: #20083f /* locked */;
  --color-purple-900: #2a1a42;
  --color-purple-800: #37264e;
  --color-purple-700: #4d3965 /* locked */;
  --color-purple-600: #60477d;
  --color-purple-500: #7b58a2;
  --color-purple-400: #a97edf;
  --color-purple-300: #c1a7e5;
  --color-purple-200: #daceec;
  --color-purple-100: #ebe3f6;
  --color-purple-50: #f9f7fb;

  --color-blue-950: #01182a;
  --color-blue-900: #082439;
  --color-blue-800: #0d314a;
  --color-blue-700: #003c5e /* locked */;
  --color-blue-600: #1d5779;
  --color-blue-500: #1c6b8e /* locked */;
  --color-blue-400: #269bc4 /* locked */;
  --color-blue-300: #77bbdb;
  --color-blue-200: #add9f0;
  --color-blue-100: #d3eaf5;
  --color-blue-50: #f4f9fb;

  --color-orange-950: #281006;
  --color-orange-900: #351b13;
  --color-orange-800: #47251b;
  --color-orange-700: #653527;
  --color-orange-600: #7b4330;
  --color-orange-500: #a35941 /* locked */;
  --color-orange-400: #d97757 /* locked */;
  --color-orange-300: #e6a28a;
  --color-orange-200: #f3c9c1;
  --color-orange-100: #f8e1de;
  --color-orange-50: #fcf7f6;
}

:root {
    --font-heading: 'Merriweather', Helvetica, Arial, sans-serif;
    --font-body: 'Inter',  Helvetica, Arial, sans-serif;
    --font-btn: 'Inter',  Helvetica, Arial, sans-serif;

    --color-accent: var(--color-purple-950);
    --color-primary: var(--color-accent);
    --bs-primary-bg-subtle: var(--color-purple-100);


    --color-muted: var(--color-grey-500);
    
    --color-border-strong: var(--color-grey-800);
    --color-border-weak: var(--color-grey-200);
    --color-border: var(--color-border-weak);

    --color-background-light: var(--color-grey-50);

    --color-light: var(--color-grey-200);

    --color-competitions: var(--color-purple-700);
    --color-models: var(--color-orange-400);
    --color-datasets: var(--color-blue-400);
    --color-benchmarks: var(--color-blue-500);

    --color-body: var(--color-grey-950);
    --color-heading: var(--color-accent);

    --border-radius-common: 5px;

    --bs-border-radius-2xl: 1.5rem;
    
    --color-practice: var(--color-blue-500);
    --color-success: #15803d;
    --color-info: var(--color-blue-500);
    --color-warning: var(--color-orange-500);
    --color-danger: var(--global-palette1);

    --color-prize: var(--color-accent);
    --color-completed: var(--color-success);

    --color-active: var(--color-accent);

    --background-log: var(--color-body);

    --bs-code-color: var(--color-orange-500);
    --bs-light: var(--color-background-light);
    --bs-secondary: var(--color-muted);
    --bs-success: var(--color-success);
    --bs-info: var(--color-info);
    --bs-warning: var(--color-warning);

    --bs-danger: var(--color-danger);
    --bs-primary: var(--color-accent);
    --bs-link-color: var(--color-accent);
    --bs-link-hover-color: var(--color-accent);
    --bs-btn-disabled-bg: var(--color-accent);
    --bs-btn-disabled-border-color: var(--color-accent);
    --bs-border-color: var(--color-border-weak);

    --bs-border-radius: var(--border-radius-common);

    --min-width-mobile-supported: 360px;
}

body {
  font-family: var(--font-body);
  background: var(--color-background-light);
}

.panel {
  /* box-shadow: 0 15px 25px -10px rgba(0,0,0,.05); */
  --bs-border-color: transparent;
  background: transparent !important;
}


.fw-bold {
  font-weight: 700 !important;
}

.nav-footer a {
  transition: all .2s ease-in-out;
  /* color: white; */
  /* text-decoration: none; */
  
}
.nav-footer a:hover {
  color: var(--global-palette1) !important;
}


.navbar-header li[aria-current] a {
  font-weight: 700;
}
.navbar-header a[aria-current] {
  font-weight: 700;
}
/* .navbar-header a[aria-current]:after {
  transform: scale(1, 1) translate(50%, 0);
} */
.navbar-header a {
  position: relative;
  padding: 10px 0;
  display: inline-block;
  text-decoration: none;
  color: var(--color-heading);
}


.icon-reward {
  color: var(--color-accent);
}

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--color-accent);
  --bs-btn-border-color: transparent;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--color-accent);
  --bs-btn-hover-border-color: transparent;
  --bs-btn-focus-shadow-rgb: 49,132,253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--color-accent);
  --bs-btn-active-border-color: var(--color-accent);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--color-accent);
  --bs-btn-disabled-border-color: var(--color-accent);
}
.btn-outline-primary {
    --bs-btn-color: var(--color-accent);
    --bs-btn-border-color: var(--color-accent);
    --bs-btn-hover-color: var(--color-accent);
    --bs-btn-hover-bg: transparent;
    --bs-btn-hover-border-color: var(--color-accent);
    --bs-btn-focus-shadow-rgb: 13, 110, 253;
    --bs-btn-active-color: var(--color-accent);
    --bs-btn-active-bg: transparent;
    --bs-btn-active-border-color: #var(--color-accent);
    --bs-btn-active-shadow: none;
    --bs-btn-disabled-color: var(--color-accent);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--color-accent);
    --bs-gradient: none;
}

.btn {
  font-weight: 700;
  --bs-btn-border-radius: var(--border-radius-common);
  font-family: var(--font-btn);

  /* --bs-btn-padding-x: 2rem; */
  /* --bs-btn-padding-y: 0.5rem; */

  transition: background-color 0.2s;
}
.btn-lg {
  --bs-btn-font-size: inherit;

  --bs-btn-padding-x: 0.75rem;
  --bs-btn-padding-y: 0.375rem;
}

.sidebar-toc .toc {
  padding-bottom: 0.3em;
}
.toc a {
  /* text-decoration: none; */
  color: var(--color-muted);
  /* font-size: 14px; */
}
.sidebar h2 {
  /* color: var(--color-body); */
  /* font-weight: 600; */
  font-size: 18px;
  /* margin-bottom: 1rem; */
}
.sidebar a[aria-current] {
  color: var(--color-accent);
  font-weight: 600;
}
.nav-subpages,
.sidebar-toc {
  /* background: var(--global-palette7); */
  /* padding: 1rem; */
}
.toc ul { 
  margin-left: 0;
}
.toc li + li {
    margin-top: 0.6em;
}
.nav-subpages a {
  text-decoration: none;
  color: var(--color-body);
  color: var(--color-muted);
  line-height: 2;
  width: 100%;
  display: inline-block;
}

.form-control,
.form-control-lg,
.form-select {
  padding: 0.8rem 1rem;
  border-radius: var(--border-radius-common);
  border: 1px solid var(--color-border);
}

.form-check-input[type="checkbox"] {
    margin-top: 0.23em !important;
}

.svg-icon svg {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: middle;
  fill: currentColor;
  stroke: none; 

}

.svg-icon-circle {
  display: flex;
  border: 1px currentColor solid;
}

.table thead {
  /* border-bottom: 3px solid var(--global-palette6); */
  /* border-radius: var(--border-radius-common); */
}
/* .table th {
  border-bottom: transparent;
} */
/* .table tr {
  border-bottom: transparent;
} */
.table {
  /* border: 1px solid var(--bs-border-color); */
  /* border: 1px solid var(--color-light); */
  border-radius: var(--border-radius-common);
  border-collapse: separate;
  border-spacing: 0;
}

/* .table :where(tr, td, th) { */
.table tbody tr :where(td, th) {

  /* border: none; */
  border-color: var(--color-light);
}
  .table tr:last-child :where(td, th) {

  /* border: none; */
  border-color: var(--color-light);
}
/* .well { */
/* border-color: var(--color-light); */
/* } */
/* .table tr {
  border: none;
} */

.bg-primary {
  background: var(--color-primary) !important;
}

.border-primary {
  border-color: var(--color-primary) !important;
}
.text-primary {
  color: var(--color-primary) !important;
}
.border-light {
  border-color: var(--color-light) !important;
}

.my-communities {
  display: none;
}

.panel .panel-logo {
  display: none !important;
}
.panel .panel-competition-title {
  font-weight: 600;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6,
.prose h1,
.prose h2
.prose h3
.prose h4
.prose h5
.prose h6 {
  font-weight: 700;
  text-wrap: balance;
  line-height: 1.2;
}
p { 
  text-wrap: pretty;
}

hr {
  opacity: 1;
  border-color: var(--color-light);
  /* margin: 0; */
}

*:focus-visible {
  box-shadow: none !important;
  outline-offset: 1.5px;
  outline: 4px solid var(--bs-primary) !important;
  outline: 4px solid var(--color-blue-400) !important;
}

 .nav-tabs .nav-link.active {
  background: transparent;
  font-weight: 700;

  color: var(--bs-primary);
  border-color: transparent;
 }
 .nav-tabs .nav-link:hover {
  border-color: transparent;
 }
 
.competition-hero {
  display: none;
 }

 html {
  /* By default, scrolling to anchor link will scroll a little above */
  scroll-padding-top: 1rem;
}

.prose a {
  font-weight: 700;
}

blockquote {
  border-left: 4px solid var(--color-muted);
  padding: 0.5rem 0 0.5rem 1.5rem;
}

.dataset-detail-content h2,
.dataset-detail-content .h2 {
  font-size: 1.5rem;
  display: block;
  width: 100%;
  padding-bottom: 0.2rem;
  margin-bottom: 0.75rem;
  border-bottom: 1px solid var(--color-grey-400);
}

.dataset-detail-subheading {
  font-size: 1.5rem;
  line-height: 1.3;
  display: block;
  width: 100%;
  padding-bottom: 0.2rem;
  margin-bottom: 0.75rem !important;
  border-bottom: 1px solid var(--color-grey-400);
}

.dataset-metadata-row {
  --bs-gutter-x: 1rem;
  margin-bottom: 0.5rem;
}

.dataset-metadata-row > :where(dt, dd) {
  margin-top: 0.5rem;
  margin-bottom: 0;
}

.dataset-metadata-label {
  white-space: normal;
}

.dataset-age-range-value > div + div {
  margin-top: 0.125rem;
}

.dataset-demographic-metadata {
  margin-top: 1rem;
  margin-bottom: 0;
}

@media (min-width: 1200px) {
  .dataset-metadata-row .dataset-metadata-label {
    width: 18%;
    flex: 0 0 auto;
  }

  .dataset-metadata-row .dataset-metadata-value {
    width: 82%;
    flex: 0 0 auto;
  }
}

.dataset-summary-list-metrics {
  column-gap: 1.25rem;
  row-gap: 0.25rem;
}

.dataset-summary-header-metrics {
  column-gap: 1.5rem;
  row-gap: 0.25rem;
}

.dataset-summary-metric {
  white-space: normal;
}

.dataset-file-entry {
  gap: 0.5rem;
}

.dataset-file-size {
  margin-left: 1.25rem;
  white-space: nowrap;
}

@media (max-width: 1400px) {
  #main-container .container-fluid, .competition-header .container-fluid {
    padding-left: 5%;
    padding-right: 5%;
  }
}