/* Site nav — warm dark, cute & modern (sync with footer) */

html .modern-nav.site-nav,
html .site-nav.modern-nav {
  --nav-ink: #faf9f5;
  --nav-muted: #9a968c;
  --nav-panel: rgba(31, 30, 27, 0.92);
  --nav-panel-solid: #1f1e1b;
  --nav-coral: #cc785c;
  --nav-coral-soft: rgba(204, 120, 92, 0.18);
  background: transparent !important;
  padding: 12px 0 4px !important;
  transition: padding 220ms cubic-bezier(0.22, 1, 0.36, 1) !important;
}

html .site-nav > .container {
  padding-left: 12px !important;
  padding-right: 12px !important;
}

html .site-nav .site-nav-panel,
html .site-nav .nav-glass-panel {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  width: 100% !important;
  min-height: 64px !important;
  padding: 10px 14px !important;
  overflow: visible !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(204, 120, 92, 0.14), transparent 42%),
    linear-gradient(160deg, rgba(37, 35, 32, 0.96), var(--nav-panel-solid) 70%) !important;
  border: 1px solid rgba(250, 249, 245, 0.1) !important;
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.22) !important;
  backdrop-filter: blur(14px) saturate(1.15) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.15) !important;
  transition:
    background 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease,
    transform 220ms ease !important;
}

html .site-nav .site-nav-panel::before,
html .site-nav .site-nav-panel::after,
html .site-nav .nav-glass-panel::before,
html .site-nav .nav-glass-panel::after,
html .sticky-navbar.is-merged .site-nav-panel::after {
  content: none !important;
  display: none !important;
}

html .site-nav.scrolled .site-nav-panel,
html .site-nav.modern-nav.scrolled .nav-glass-panel {
  background:
    radial-gradient(circle at 12% 0%, rgba(204, 120, 92, 0.18), transparent 40%),
    rgba(31, 30, 27, 0.98) !important;
  border-color: rgba(250, 249, 245, 0.14) !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.3) !important;
}

/* Brand */
html .site-nav .site-nav-brand,
html .site-nav .navbar-brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 !important;
  text-decoration: none !important;
  min-width: 0 !important;
}

html .site-nav .logo-wrapper {
  width: 42px !important;
  height: 42px !important;
  padding: 2px !important;
  border-radius: 15px !important;
  background: rgba(250, 249, 245, 0.06) !important;
  border: 1px solid rgba(250, 249, 245, 0.12) !important;
  box-shadow: 0 0 0 3px rgba(204, 120, 92, 0.14) !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  flex: none !important;
  transition: transform 280ms cubic-bezier(0.22, 1.25, 0.36, 1), box-shadow 200ms ease !important;
}

html .site-nav .logo-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 12px !important;
  filter: none !important;
}

html .site-nav .logo-text {
  font-family: "Fredoka", "Quicksand", sans-serif !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
  color: var(--nav-ink) !important;
  background: none !important;
  -webkit-text-fill-color: unset !important;
  background-clip: unset !important;
  filter: none !important;
  text-shadow: none !important;
  line-height: 1 !important;
}

/* Primary links hidden — tabs merge handles center nav (avoids x2) */
html .site-nav .nav-primary-links {
  display: none !important;
}

html .site-nav .site-nav-chip {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 22px !important;
  padding: 0 8px !important;
  border-radius: 999px !important;
  background: var(--nav-coral-soft) !important;
  border: 1px solid rgba(204, 120, 92, 0.28) !important;
  color: #e8b39a !important;
  font-family: "Quicksand", sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-transform: lowercase !important;
}

html .site-nav .logo-hover:hover .logo-wrapper {
  transform: rotate(-6deg) scale(1.06) !important;
  box-shadow: 0 0 0 4px rgba(204, 120, 92, 0.22) !important;
}

html .site-nav .logo-hover:hover .logo-text {
  filter: none !important;
  color: #fff !important;
}

/* Avatar */
html .site-nav .avatar-trigger {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 44px !important;
  padding: 4px 10px 4px 4px !important;
  border-radius: 999px !important;
  background: rgba(250, 249, 245, 0.06) !important;
  border: 1px solid rgba(250, 249, 245, 0.1) !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: background 160ms ease, border-color 160ms ease, transform 200ms cubic-bezier(0.22, 1.25, 0.36, 1) !important;
}

html .site-nav .avatar-trigger:hover {
  background: var(--nav-coral-soft) !important;
  border-color: rgba(204, 120, 92, 0.3) !important;
  transform: translateY(-1px) !important;
  box-shadow: none !important;
}

html .site-nav .avatar-container {
  position: relative !important;
  width: 36px !important;
  height: 36px !important;
  flex: none !important;
}

html .site-nav .avatar-img {
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  border: 2px solid rgba(250, 249, 245, 0.16) !important;
  box-shadow: none !important;
}

html .site-nav .avatar-status {
  position: absolute !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
  background: #62c484 !important;
  border: 2px solid #1f1e1b !important;
  box-shadow: 0 0 0 2px rgba(98, 196, 132, 0.25) !important;
  animation: siteNavPulse 1.8s ease-in-out infinite !important;
}

@keyframes siteNavPulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(0.88); opacity: 0.7; }
}

html .site-nav .user-info {
  display: flex !important;
  flex-direction: column !important;
  gap: 1px !important;
  line-height: 1.15 !important;
}

html .site-nav .user-name {
  color: var(--nav-ink) !important;
  font-family: "Fredoka", "Quicksand", sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-shadow: none !important;
}

html .site-nav .user-role,
html .site-nav .user-chevron {
  color: var(--nav-muted) !important;
  text-shadow: none !important;
}

html .site-nav .user-role {
  font-family: "Quicksand", sans-serif !important;
  font-size: 11px !important;
  font-weight: 500 !important;
}

html .site-nav .user-chevron {
  font-size: 11px !important;
  transition: transform 200ms ease !important;
}

html .site-nav .avatar-trigger[aria-expanded="true"] .user-chevron {
  transform: rotate(180deg) !important;
}

/* Dropdown */
html .site-nav .modern-dropdown,
html body .site-nav .modern-dropdown,
html .site-nav-dropdown.dropdown-menu {
  min-width: 228px !important;
  margin-top: 10px !important;
  padding: 8px !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(204, 120, 92, 0.14), transparent 42%),
    #252320 !important;
  border: 1px solid rgba(250, 249, 245, 0.1) !important;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.32) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow: hidden !important;
  animation: siteNavDropIn 200ms cubic-bezier(0.22, 1, 0.36, 1) !important;
  z-index: 1050 !important;
}

html .site-nav .modern-dropdown::before,
html .site-nav .modern-dropdown::after {
  content: none !important;
  display: none !important;
}

@keyframes siteNavDropIn {
  from { opacity: 0; transform: translateY(-8px) scale(0.96); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

html .site-nav .site-nav-dropdown-head {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 8px 8px 10px !important;
}

html .site-nav .dropdown-avatar {
  width: 38px !important;
  height: 38px !important;
  border-radius: 12px !important;
  object-fit: cover !important;
  border: 1px solid rgba(250, 249, 245, 0.12) !important;
}

html .site-nav .site-nav-dropdown-name {
  display: block !important;
  color: var(--nav-ink) !important;
  font-family: "Fredoka", "Quicksand", sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
}

html .site-nav .site-nav-dropdown-handle {
  display: block !important;
  color: var(--nav-muted) !important;
  font-family: "Quicksand", sans-serif !important;
  font-size: 12px !important;
}

html .site-nav .site-nav-divider,
html .site-nav .dropdown-divider {
  border-color: rgba(250, 249, 245, 0.08) !important;
  opacity: 1 !important;
  margin: 6px 4px !important;
}

html .site-nav .dropdown-item.modern-item {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 40px !important;
  margin: 2px 0 !important;
  padding: 8px 10px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: transparent !important;
  color: rgba(250, 249, 245, 0.82) !important;
  font-family: "Quicksand", sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  text-shadow: none !important;
  transition: background 160ms ease, color 160ms ease, transform 180ms ease !important;
}

html .site-nav .dropdown-item.modern-item i {
  width: 18px !important;
  text-align: center !important;
  color: #e0a48d !important;
  filter: none !important;
}

html .site-nav .dropdown-item.modern-item:hover {
  color: #fff !important;
  background: rgba(204, 120, 92, 0.16) !important;
  transform: translateX(2px) !important;
  box-shadow: none !important;
}

/* Overlay */
html .nav-dropdown-overlay {
  background: rgba(12, 11, 10, 0.5) !important;
  backdrop-filter: blur(4px) !important;
  -webkit-backdrop-filter: blur(4px) !important;
}

html .nav-dropdown-overlay.show {
  opacity: 1 !important;
  pointer-events: auto !important;
}

@media (min-width: 900px) {
  html .site-nav .site-nav-chip {
    display: none !important;
  }
}

@media (min-width: 768px) {
  html .site-nav.modern-nav {
    padding: 14px 0 6px !important;
  }
}

@media (max-width: 575px) {
  html .site-nav.modern-nav {
    padding-top: 8px !important;
  }

  html .site-nav > .container {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  html .site-nav .site-nav-panel,
  html .site-nav .nav-glass-panel {
    min-height: 58px !important;
    padding: 8px 10px !important;
    border-radius: 20px !important;
  }

  html .site-nav .logo-wrapper {
    width: 36px !important;
    height: 36px !important;
    border-radius: 13px !important;
  }

  html .site-nav .logo-text {
    font-size: 17px !important;
  }

  html .site-nav .avatar-trigger {
    padding-right: 6px !important;
  }
}

@media (max-width: 1023px) {
  html .site-nav .site-nav-panel,
  html .site-nav .nav-glass-panel,
  html .site-nav.scrolled .site-nav-panel {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background:
      radial-gradient(circle at 10% 0%, rgba(204, 120, 92, 0.12), transparent 42%),
      #1f1e1b !important;
  }

  html .nav-dropdown-overlay {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: rgba(8, 7, 6, 0.62) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html .site-nav .logo-wrapper,
  html .site-nav .avatar-trigger,
  html .site-nav .nav-primary-link,
  html .site-nav .avatar-status,
  html .site-nav .modern-dropdown {
    animation: none !important;
    transition: none !important;
  }
}