/*
  Account sidebar menu.
  Bootstrap 5 utilities are used in the template for spacing, flex, borders,
  typography utilities, lists and responsive column sizing.
  Keep this file only for brand-specific values that Bootstrap should not own.
*/

.lm-acct-nav {
  top: calc(var(--nav-h, 0px) + 24px);
}

.lm-acct-nav__head {
  color: #464646;
  font-size: 18px;
  line-height: 1.2;
  letter-spacing: var(--ls-wide, .02em);
}

.lm-acct-nav__link,
.lm-acct-nav__item {
  color: var(--fg-1, #301905);
  line-height: 1.35;
  border-color: #d9d9d9 !important;
  transition: color .2s ease, border-color .2s ease;
}

.lm-acct-nav__item--logout {
  color: var(--fg-2, #6c757d);
}

.lm-acct-nav__icon {
  width: 18px;
  height: 18px;
  color: var(--color-orange, var(--ui-orange-1, #c76a29));
  transition: color .2s ease;
}

.lm-acct-nav__icon--sm {
  width: 14px;
  height: 14px;
}

.lm-acct-nav__link:hover,
.lm-acct-nav__link:focus,
.lm-acct-nav__link.is-active,
.lm-acct-nav__link.active,
.lm-acct-nav__item:hover,
.lm-acct-nav__item:focus {
  color: var(--ui-orange-1, #c76a29);
  border-color: var(--ui-orange-1, #c76a29) !important;
}

.lm-acct-nav__link:hover .lm-acct-nav__icon,
.lm-acct-nav__link:focus .lm-acct-nav__icon,
.lm-acct-nav__link.is-active .lm-acct-nav__icon,
.lm-acct-nav__link.active .lm-acct-nav__icon,
.lm-acct-nav__item:hover .lm-acct-nav__icon,
.lm-acct-nav__item:focus .lm-acct-nav__icon {
  color: var(--ui-orange-1, #c76a29);
}

@media (max-width: 1024px) {
  .lm-acct-nav {
    top: auto;
  }
}