:root {
  --top-bar-h: 60px;
}

/* The bar: solid hex background = fully opaque */
#top-bar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: var(--top-bar-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  background: #86b93a;
  color: #ffffff;
  font-size: 0.875rem;
  z-index: 1040;            /* above Bootstrap's fixed navbar (1030) */
  padding: 0 1rem;  
}

#top-bar a {
  color: inherit;
  text-decoration: none;
}

/* Push the navbar and page content down by the bar's height */
#quarto-header.fixed-top {
  top: var(--top-bar-h);
}
body {
  margin-top: var(--top-bar-h);
}

/* Keep anchor jumps from landing under the bars */
html {
  scroll-padding-top: calc(var(--top-bar-h) + 70px);
}


#top-bar .strip-item:last-child { position: absolute; right: 1rem; }



#bottom-bar {
  width: 100%;
  min-height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  padding: 0.5rem 1rem;
  background: #86b93a;   /* solid hex = fully opaque */
  color: #ffffff;
  font-size: 0.875rem;
}
#bottom-bar a {
  color: inherit;
  text-decoration: underline;
}



/* hide-title */
.navbar-title { display: none; }

.navbar-logo {
  max-height: 45px; /* Adjust this value to fit your navbar height */
  margin-left: 100px;
}


/* Quarto page footer */
.nav-footer,
.nav-footer a {
  font-size: 1.2rem;
}