html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

/* Add custom CSS to style the nested dropdown */
.dropdown-submenu {
  position: relative;
}

  .dropdown-submenu .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -1px;
  }

  /* Style the nested submenu's toggle link */
  .dropdown-submenu .dropdown-toggle::after {
    display: inline-block;
    content: "\f0da"; /* FontAwesome chevron-right icon (you can use any desired icon or text) */
    float: right;
  }

  /* Rotate the chevron icon when submenu is open */
  .dropdown-submenu.active .dropdown-toggle::after {
    transform: rotate(-90deg);
  }

.dropdown-menu {
  --bs-dropdown-link-active-bg: #800000;
}

.text-justify {
  text-align: justify;
}

.navbar-dark .navbar-nav .nav-link {
  color: white;
}

/* Override text color within modal */
.modal-content,
.modal-body,
.modal-footer,
.modal-header {
  color: #000000 !important; /* Set text color to black */
}

.modalbtn {
  width: 200px;
}

.highlight-btn {
  animation: pulseconsent 1s infinite;
}

@keyframes pulseconsent {
  0% {
    box-shadow: 0 0 0 0 rgba(25, 135, 84, 0.5);
  }

  70% {
    box-shadow: 0 0 0 10px rgba(25, 135, 84, 0);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(25, 135, 84, 0);
  }
}

/* Hide the video on mobile devices */
@media only screen and (max-width: 768px) {
  .video-container {
    display: none;
  }
}

.navbar-nav, .nav-link {
  padding-left: 20px; /* Adjust the value as needed */
}

.pulsate {
  animation: pulsebook 2s infinite;
}
.dropdown-submenu {
  position: relative;
}

  .dropdown-submenu > .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -1px;
  }

  .dropdown-submenu:hover > .dropdown-menu {
    display: block;
  }
/* Make only this dropdown toggle show a right arrow instead of down */
/* Right-pointing arrow, bigger & better aligned */
.dropend-toggle::after {
  display: inline-block;
  margin-left: 0.5rem; /* more space from text */
  vertical-align: middle; /* center vertically */
  content: "";
  border-top: 0.4em solid transparent; /* taller */
  border-bottom: 0.4em solid transparent;
  border-left: 0.4em solid currentColor; /* thicker arrow using text color */
  transform: translateY(-1px); /* fine-tune vertical position */
}

/* Add extra padding for balance */
.dropend-toggle {
  padding-right: 1.75rem;
}

/* Collapse breakpoint for navbar-expand-sm is <576px */
@media (max-width: 575.98px) {
  /* 1) Space the toggler ~20px from the item on its left (the brand) */
  .navbar .navbar-toggler {
    margin-left: 20px; /* if you instead want it inset from the RIGHT edge, use margin-right: 20px; */
  }

  /* 2) Indent non-dropdown top-level items to match dropdown ones */
  .navbar-nav > .nav-item:not(.dropdown) > .nav-link {
    padding-left: 20px;
  }
}