@import url("https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&display=swap");

:root {
  --oly-pink: #ff1261;
  --oly-light-pink: #ff8fdb;
  --oly-pink-light: #f3cbe8;
  --oly-green: #004733;
  --oly-success: #29823b;
  --oly-disabled: #adb5bd;
  --oly-body: #333333;
  --oly-paper: #f2ede8;
  --oly-neutral-light: #e9ecef;
  --oly-neutral-medium: #dee2e6;
  --oly-neutral-1: #f8f9fa;
  --oly-neutral-2: #f1f3f5;
  --oly-light-blue: #c7eded;
  --oly-light-blue-2: #cdebea;
  --oly-light-blue-3: #a3c9ea;
  --oly-teal: #c9d2ce;
  --oly-yellow: #ffd337;
}

html,
body {
  overscroll-behavior: none;
}

body {
  height: max-content;
}

h1,
h2,
h3,
h4,
p,
a,
li,
div {
  font-family: "Figtree", sans-serif !important;
}

h1,
h2,
h3,
h4 {
  margin-top: 0px;
}

h1 {
  font-weight: 700;
}

h2 {
  font-size: 40px;
  font-weight: 700;
}

h3 {
  font-size: 32px;
  font-weight: 600;
  line-height: 40px;
  color: black;
}

h4 {
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
  color: black;
}

p,
a,
label,
ol,
ul {
  font-size: 18px;
}

a {
  color: var(--oly-pink);
  text-decoration: underline !important;
}

a:hover {
  color: var(--oly-pink);
}

input,
select {
  border: 1px solid black !important;
}

@media (max-width: 992px) {
  h2 {
    font-size: 32px;
  }

  h3 {
    font-size: 24px;
    line-height: 32px;
  }

  h4 {
    font-size: 20px;
    font-weight: 700;
  }

  p,
  a,
  label,
  ol,
  ul {
    font-size: 16px;
  }
}

.sidebar {
  height: 100vh; /* Full viewport height */
}

.position-sticky {
  position: sticky;
  top: 0;
  z-index: 1020; /* Bootstrap default z-index for sticky elements */
}

main {
  padding-top: 20px;
}
