/* Clear fixed navbar (base_nav.html) */
body.has-fixed-nav {
  padding-top: 4.5rem;
}

:root {

  --bk-accent-ink: #235f2e;
  --bk-accent-soft: #e9f3e9;
  --bk-brown: #9a614d;

  --bk-accent: #3a8f42;
  --bk-accent-line: #c4d9c4;
}


/* Bottom-sheet style modal */
.modal-bottom-sheet {
    width: 100vw;
    max-width: none;
    margin: 0;
    bottom: 0;
    position: absolute;
}

.modal-bottom-sheet .modal-body {
  max-height: 85vh;
  overflow-y: auto;
}

.modal-backdrop {
  background-color: rgba(0, 0, 0, 0.3);
}

.resource-icon {
  height: 40px;
}

.resource-icon-small {
  height: 20px;
}


.navbar-nav .nav-link.active {
  background-color: var(--bk-accent-soft);
  color: var(--bk-accent-ink);
}

.text-brown {
  color: var(--bk-brown);
}

.badge-bk-accent {
  background-color: var(--bk-accent-soft);
  color: var(--bk-accent-ink);
}

/* Tutorial */
.tutorial-popover {
  --bs-popover-border-color: var(--bs-purple);
  --bs-popover-header-bg: var(--bs-purple);
  --bs-popover-header-color: var(--bs-white);
  box-shadow: 0 0 7px 0 rgba(0, 0, 0, 1);
}