@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');

:root{ --nav-height: 64px; }

.site-nav{
  position: fixed;
  top: 0; left: 0; right: 0; height: var(--nav-height);
  z-index: 1000;
  backdrop-filter: blur(18px);
  background-color: rgba(5,6,10,0.85);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  box-shadow: 0 8px 24px rgba(0,0,0,0.25);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow: visible;
  will-change: auto;
}

body{ padding-top: var(--nav-height); }
.site-nav + *{ margin-top: 0 !important; }

.site-nav, .site-nav *{ font-family: var(--font-body); }

.site-nav .inner{
  display: flex; align-items: center; justify-content: space-between;
  gap: 1.5rem; padding: 0 16px; height: var(--nav-height); flex-wrap: nowrap;
}

/* Forçar largura total do container dentro do header */
.site-nav .container{ width: 100% !important; padding-left: 16px; padding-right: 16px; }

.site-nav .brand{ line-height: 1; }

.site-nav .nav-links{
  display:flex; align-items:center; gap:1.5rem;
  color: var(--text-muted); font-size: .95rem;
  flex-wrap: nowrap; white-space: nowrap;
}

.site-nav .nav-links a{ position:relative; padding:.25rem 0; transition:color .2s ease; white-space:nowrap; line-height:1; font-weight:500; letter-spacing:.01em; }
.site-nav .nav-links a::after{ content:""; position:absolute; inset:auto 0 -.25rem; height:2px; border-radius:999px; background: var(--accent); transform: scaleX(0); transform-origin:left center; transition: transform .25s ease; }
.site-nav .nav-links a:hover, .site-nav .nav-links a:focus-visible{ color: var(--text); }
.site-nav .nav-links a:hover::after, .site-nav .nav-links a:focus-visible::after, .site-nav .nav-links a.active::after{ transform: scaleX(1); }

.site-nav .btn, .site-nav .btn-ghost, .site-nav .badge{ font-weight:500; }
.site-nav .btn, .site-nav .btn-ghost{ padding:.5rem 1rem; border-width:1px; }
.site-nav .nav-toggle{ line-height:1; }

/* Unified Profile Menu */
.site-nav .profile-menu-container { position: relative; display: inline-block; }
.site-nav .profile-trigger {
  display: flex; align-items: center; gap: 0.5rem;
  padding: 0.25rem;
  background: transparent; border: none; cursor: pointer;
  color: var(--text);
}
.site-nav .profile-trigger:hover .avatar { box-shadow: 0 0 0 2px rgba(167,139,250,0.5); }

.site-nav .avatar {
  width: 32px !important; height: 32px !important;
  border-radius: 999px !important;
  overflow: hidden;
  background: linear-gradient(135deg, var(--accent), var(--accent-blue));
  color: #000;
  display: flex; align-items: center; justify-content: center;
  font-weight: 600;
}
.site-nav .avatar i { width: 18px; height: 18px; }
.site-nav .avatar .lucide { width: 18px; height: 18px; display:block; }
.site-nav .avatar svg.lucide { width: 18px; height: 18px; display:block; }

.site-nav .profile-list {
  position: absolute; top: 100%; right: 0;
  margin-top: 0.5rem; min-width: 200px;
  background: #1a1d2d; border: 1px solid rgba(255,255,255,0.1);
  border-radius: 12px;
  box-shadow: 0 10px 25px -5px rgba(0,0,0,0.5);
  padding: 0.5rem;
  display: none; flex-direction: column; gap: 0.25rem;
  z-index: 100;
  animation: slideDown 0.2s ease-out;
}
.site-nav .profile-list.is-visible{ display: flex; }

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

.profile-list a, .profile-list button {
  display: flex; align-items: center; gap: 0.75rem;
  padding: 0.6rem 1rem;
  border-radius: 8px;
  color: var(--text-muted);
  text-decoration: none;
  font-size: 0.9rem;
  transition: all 0.2s;
  background: transparent; border: none; width: 100%; text-align: left; cursor: pointer;
}
.profile-list a:hover, .profile-list button:hover {
  background: rgba(255,255,255,0.05);
  color: var(--text);
}
.profile-list i { width: 16px; height: 16px; opacity: 0.8; }

.profile-list-divider {
  height: 1px; background: rgba(255,255,255,0.1);
  margin: 0.25rem 0;
}
.logout-item { color: #ef4444 !important; }
.logout-item:hover { background: rgba(239,68,68,0.1) !important; }
