.wrapper {
  align-items: stretch;
  display: flex;
  width: 100%;
}

main {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.datepicker-switch:hover,
.prev:hover,
.next:hover,
.old day:hover,
.day:hover,
.new day:hover,
.month:hover,
.years:hover,
.decade:hover,
.centuries:hover,
.today:hover {
  color: black
}

.day {
  padding: 3px;
}

.page-link:focus {
  color: #7C7AD7;
}

.datepicker table tr td.range,
.datepicker table tr td.range.disabled,
.datepicker table tr td.range.disabled:hover,
.datepicker table tr td.range:hover {
  background: #bcbcbc !important;
}

.datepicker table tr td.active.active {
  background-color: #3b3b95;
  background-image: linear-gradient(to bottom, #3b3b95, #31317b);
  border-color: rgba(0, 0, 0, .1) rgba(0, 0, 0, .1) rgba(0, 0, 0, .25);
}

.datepicker table tr td span.active.active {
  background-color: #3b3b95;
  background-image: linear-gradient(to bottom, #3b3b95, #31317b);
  border-color: rgba(0, 0, 0, .1) rgba(0, 0, 0, .1) rgba(0, 0, 0, .25);
}

.datepicker table tr td.range {
  background-color: #bcbcbc;
}

/* border color on forms */
.form-control:focus {
  border-color: #4242a7;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(66, 66, 167, 0.6);
}

.form-select:focus {
  border-color: #4242a7;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(66, 66, 167, 0.6);
}

/* purple button */
.btn-purple,
.btn-purple:visited {
  background-color: #4242a7;
  color: white;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.btn-purple:hover {
  background-color: rgb(59, 59, 149);
  color: white;
}

.btn-purple:active,
.btn-purple:focus,
.btn-purple:active:focus {
  background-color: #31317b;
  color: white;
}

.btn-secondary {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}

/* theme toggle button on navbar */
#theme-toggle,
#theme-toggle:before {
  cursor: pointer;
  padding-top: 12px;
  padding-left: 6px;
}

/* dark mode and light mode */
:root[data-applied-mode="light"] {
  color-scheme: light;
}

:root[data-applied-mode="dark"] {
  color-scheme: dark;
}

/* for sidecard links */
.list-group-item {
  padding-top: .5rem;
  padding-bottom: .5rem;
  border: 0;
}

.active>.list-group-item,
.list-group-item.active {
  /* background-color: #7C7AD7 !important; */
  border-left: 2px solid #6363ca;
  background: linear-gradient(90deg, rgba(94, 94, 151, 0.1), rgba(94, 94, 151, 0.088) 50%, hsla(0, 0%, 100%, 0));
  font-weight: bold;
}

.active.nav-link,
.nav-link.active {
  padding-left: .4em;
  border-left: 2px solid #6363ca;
  background: linear-gradient(90deg, rgba(94, 94, 151, 0.1), rgba(94, 94, 151, 0.088) 50%, hsla(0, 0%, 100%, 0));
  font-weight: bold;
}

/* menu cards on index menu */
.menu-card:hover {
  transition: ease-in-out .3s;
  background-color: rgb(var(--bs-tertiary-bg-rgb));
}

.dropdown-item:active {
  background-color: #4242a7 !important;
}

.details {
  --bs-btn-padding-y: .15rem;
  --bs-btn-padding-x: .5rem;
  --bs-btn-font-size: .75rem;
  margin-bottom: 1px;
  font-weight: 600
}

@media (max-width: 1200px) {

  /* CSS rules specific to mobile devices go here */
  .side-nav {
    display: none;
  }

  .hamburger-button {
    display: none;
  }
}

/* grantor index page */

.active>.page-link,
.page-link.active {
  background-color: #4242a7;
  border-color: #4242a7;
}

.page-link {
  color: #7C7AD7;
}

.page-link:hover {
  color: #B7B6FB
}

.page-link:focus,
.page-link:active {
  border-color: #B7B6FB;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(66, 66, 167, 0.6);
}

#grantor-results-row {
  cursor: pointer;
}

.accordion-button:not(.collapsed) {
  color: white;
  background-color: #4242a7;
  box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color);
}

.accordion-button:focus {
  z-index: 3;
  border-color: #4242a7;
  outline: 0;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(66, 66, 167, 0.6);
}

.accordion-button::after {
  --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23B7B6FB'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
  --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23B7B6FB'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}

/* scroll bar */
/* width */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}


.side-nav::-webkit-scrollbar {
  width: 5px;
}



.side-nav::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 5px;
}

.side-nav::-webkit-scrollbar-thumb:hover {
  background: #555;
}

/* Dark mode styles */
@media (prefers-color-scheme: dark) {

  /* Handle */
  ::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px;
  }

  /* Handle on hover */
  ::-webkit-scrollbar-thumb:hover {
    background: #555;
  }
}

/* Light mode styles */
@media (prefers-color-scheme: light) {

  /* Handle */
  ::-webkit-scrollbar-thumb {

    background: #555;
    border-radius: 4px;
  }

  /* Handle on hover */
  ::-webkit-scrollbar-thumb:hover {
    background: #888;
  }
}




.hamburger-button {
  cursor: pointer;
}

.side-nav {
  transition: left 0.5s ease-out;
}

.show {
  display: block;
  /* Ensure it's visible when the class is applied */
}

.wrapper {
  overflow-x: hidden !important;
}

.content {
  margin-left: 250px;
}

@media screen and (max-width: 1200px) {
  .content {
    margin-left: 0px !important;
  }
}

.clear-button {
  display: flex;
  justify-content: center;
  align-items: center;
}