/* Refined global navigation accents: keep the cream shell, add R.O.O.T.S. colour and hierarchy. */

.flw-navbar {
  position: relative;
  border-bottom: 0;
  background:
    linear-gradient(90deg, rgba(255, 250, 240, 0.99) 0%, rgba(255, 250, 240, 0.99) 68%, rgba(241, 247, 239, 0.98) 100%);
  box-shadow: 0 1px 0 rgba(6, 79, 51, 0.09);
}

.flw-navbar::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 0.24rem;
  pointer-events: none;
  background: linear-gradient(
    90deg,
    #07683f 0%,
    #07683f 56%,
    #e9a300 56%,
    #e9a300 84%,
    #a84e31 84%,
    #a84e31 100%
  );
}

.flw-navbar .flw-primary-nav .nav-link {
  position: relative;
  border: 1px solid transparent;
  transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.flw-navbar .flw-primary-nav .nav-link::after {
  content: "";
  position: absolute;
  right: 0.7rem;
  bottom: 0.48rem;
  left: 0.7rem;
  height: 0.12rem;
  background: transparent;
  transform: scaleX(0);
  transform-origin: left;
  transition: background-color 160ms ease, transform 160ms ease;
}

.flw-navbar .flw-primary-nav .nav-link.active,
.flw-navbar .flw-primary-nav .show > .nav-link {
  border-color: rgba(6, 104, 63, 0.11);
  background: rgba(6, 104, 63, 0.07);
  color: #064f33;
  text-decoration: none;
}

.flw-navbar .flw-primary-nav .nav-link.active::after,
.flw-navbar .flw-primary-nav .show > .nav-link::after {
  background: #e9a300;
  transform: scaleX(1);
}

.flw-live-search .input-group,
.flw-account-link {
  border-color: rgba(6, 104, 63, 0.24);
  background: rgba(255, 253, 248, 0.72);
  transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.flw-live-search .input-group:focus-within,
.flw-account-link:active {
  border-color: rgba(6, 104, 63, 0.52);
  background: rgba(236, 245, 233, 0.86);
}

.flw-donate-link {
  border-color: #d99600;
  background: linear-gradient(135deg, #e9a300, #f5bd2e);
  color: #241900 !important;
  box-shadow: 0 8px 18px rgba(132, 91, 0, 0.12);
  transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.flw-donate-link:active {
  border-color: #c88d00;
  background: linear-gradient(135deg, #f1b219, #f7c74b);
  color: #241900 !important;
  transform: translateY(1px);
}

.flw-navbar .dropdown-menu {
  border-top: 0.22rem solid #07683f;
}

.flw-navbar .dropdown-item {
  padding: 0.7rem 1rem;
  border-radius: 0.3rem;
  color: #173f2b;
  font-weight: 600;
  line-height: 1.35;
  white-space: normal;
}

.flw-navbar .dropdown-item:hover,
.flw-navbar .dropdown-item.active {
  background: rgba(6, 104, 63, 0.07);
  color: #064f33;
}

.flw-navbar .dropdown-item:focus-visible {
  outline: 0.18rem solid #07683f;
  outline-offset: -0.18rem;
  background: rgba(6, 104, 63, 0.1);
  color: #064f33;
}

@media (min-width: 1200px) {
  .flw-navbar .dropdown-menu {
    width: max-content;
    min-width: 13rem;
    max-width: min(22rem, calc(100vw - 2rem));
    padding: 0.45rem;
    margin-top: 0.35rem;
    overflow-wrap: anywhere;
    box-shadow: 0 0.75rem 1.75rem rgba(23, 63, 43, 0.18);
  }

  .flw-navbar .nav-item:last-child .dropdown-menu {
    right: 0;
    left: auto;
  }
}

@media (max-width: 1199.98px) {
  .flw-navbar .navbar-collapse {
    border-top: 0.24rem solid #07683f;
    background:
      linear-gradient(180deg, rgba(255, 253, 248, 0.99), rgba(246, 250, 243, 0.99));
  }

  .flw-navbar .flw-primary-nav .nav-link.active::after,
  .flw-navbar .flw-primary-nav .show > .nav-link::after {
    right: auto;
    bottom: 0.35rem;
    left: 0.7rem;
    width: 2.2rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .flw-navbar .flw-primary-nav .nav-link,
  .flw-navbar .flw-primary-nav .nav-link::after,
  .flw-live-search .input-group,
  .flw-account-link,
  .flw-donate-link {
    transition: none;
  }

  .flw-donate-link {
    transform: none !important;
  }
}
