/* Resume popover styles - lightweight, won't affect existing classes */
.resume-popover {
  position: absolute;
  top: 48px;
  right: 16px;
  min-width: 100px;
  max-width: 200px;
  background: #ffffff;
  color: #111;
  border-radius: 14px;
  box-shadow: 0 12px 30px rgba(16,24,40,0.12), 0 2px 8px rgba(16,24,40,0.06);
  padding: 6px 0;
  display: none;
  z-index: 12000;
  /* font-family: inherit; */
  transition: transform 160ms cubic-bezier(.2,.9,.3,1), opacity 120ms ease;
  transform-origin: top center;
  opacity: 0;
}
.resume-popover.visible {
  display: block;
  opacity: 1;
  transform: translateY(0);
}
.resume-popover__item {
  display: block;
  padding: 14px 20px;
  color: inherit;
  text-decoration: none;
  /* font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.1; */
}
.resume-popover__item:hover,
.resume-popover__item:focus {
  background: rgba(16,24,40,0.03);
  outline: none;
}
.resume-popover__item + .resume-popover__item { margin-top: 6px; }

/* small arrow (subtle) */
.resume-popover::before{
  content: '';
  position: absolute;
  top: -6px;
  left: var(--arrow-left, 18px);
  width: 12px;
  height: 12px;
  background: #fff;
  transform: rotate(45deg);
  box-shadow: -2px -2px 6px rgba(16,24,40,0.06);
}

@media (max-width: 700px){
  .resume-popover{ right: 8px; left: 8px; top: 56px; border-radius: 10px; }
}

/* Mobile: center the popover under the Resume link and allow above/below placement */
@media (max-width: 700px) {
  /* render the popover inline so it affects layout and does not overlap the toggle */
  .navbar__list-links { align-items: center; }
  /* ensure each nav item stacks and centers its contents so adding the popover doesn't shift the link */
  .navbar__list-links .link__button { position: relative; display: flex; flex-direction: column; align-items: center; }

  .resume-popover.mobile {
    position: static !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    box-shadow: 0 6px 18px rgba(16,24,40,0.06) !important;
    background: #ffffff !important;
    margin: 8px auto !important;
    border-radius: 10px !important;
    padding: 6px 0 !important;
    z-index: 12001 !important;
    /* width: min(320px, calc(100% - 48px)) !important; */
    align-self: center !important;
  }

  .resume-popover.mobile::before { display: none !important; }

  .resume-popover.mobile.mobile-above {
    /* when moved above, keep same block styling but place it before the li so layout shows it above */
    margin-bottom: 8px !important;
    margin-top: 0 !important;
  }

  .resume-popover.mobile .resume-popover__item {
    padding: 12px 18px !important;
    border-bottom: 1px solid rgba(16,24,40,0.03) !important;
  }

  .resume-popover.mobile a,
  .resume-popover.mobile a:link,
  .resume-popover.mobile a:visited {
    width: 100% !important;
    display: block !important;
    padding: 10px 14px !important;
    text-align: left !important;
    font-size: 16px !important;
  }
}

/* Ensure anchors inside the popover do NOT inherit global/nav anchor styles */
.resume-popover a,
.resume-popover a:link,
.resume-popover a:visited {
  all: unset; /* reset inherited properties */
  display: block;
  box-sizing: border-box;
  width: 100%;
  padding: 14px 20px;
  color: inherit;
  /* font-family: inherit; */
  /* font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.1; */
  text-decoration: none;
  cursor: pointer;
   font-size: 16px;
  font-family: "Lexend", sans-serif;
  line-height: 24px;
  font-weight: 600;
}
.resume-popover a:hover,
.resume-popover a:focus {
  background: rgba(16,24,40,0.03);
  outline: none;
}


/* Make the nav "Resume" <button> look and behave like the other nav links */
.link__button > button {
  background: transparent;
  border: 0;
  padding: 0;
  padding-bottom: 1rem;
  color: #9f9f9f;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  cursor: pointer;
  /* -webkit-transition: 0.3s ease all;
  transition: 0.3s ease all; */
}
.link__button > button:hover,
.link__button > button:focus {
  color: #864b22;
  outline: none;
  border-bottom: 3px solid #864b22;
}

/* Active state (match .link__button.active a) */
.link__button.active > button {
  color: #a75e2a;
  border-bottom: 3px solid #a75e2a;
}

/* Remove default button hit-area quirks: make it inline like links */
.link__button > button {
  display: inline-block;
}

/* Ensure navbar link anchors and the Resume button align vertically */
.navbar__list-links .link__button a,
.navbar__list-links .link__button > button {
  display: inline-block;
  vertical-align: middle;
}

/* Align the toggle switch with the nav links */
.navbar__icon-link {
  display: inline-flex;
  align-items: center;
  padding-bottom: 0.7rem;
}
.navbar__icon-link #toggle {
  display: inline-block;
  vertical-align: middle;
  margin: 0;
  padding: 0;
  line-height: inherit;
}
.navbar__icon-link .indicator {
  display: inline-block;
  vertical-align: middle;
}