.admin-nav {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 0 1em;

  background-color: var(--color-nav-bg);

  color: var(--color-nav-text);

  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);

  transition: background-color 0.2s;

}



.admin-nav__left {

  display: flex;

  align-items: stretch;

  gap: 2rem;

}



.admin-nav__brand {

  display: flex;

  align-items: center;

  gap: 0.5rem;

  text-decoration: none;

  color: #fff;

  margin-left: -1.5rem;

}



.admin-nav__brand:hover {

  color: var(--color-nav-muted);

}



.admin-nav__logo {

  width: 3em;

  display: block;

  flex-shrink: 0;

}



.admin-nav__title {

  font-size: 1.1rem;

  font-weight: 700;

  letter-spacing: 0.01em;

  white-space: nowrap;

}



.admin-nav__links {

  display: flex;

  align-items: center;

  gap: 0.25rem;

}



.admin-nav__link {

  padding: 0.375rem 0.75rem;

  border-radius: 4px;

  text-decoration: none;

  color: var(--color-nav-muted);

  font-size: 0.9rem;

  font-weight: 500;

  transition: background-color 0.15s, color 0.15s;

}



.admin-nav__link:hover {

  background-color: rgba(255, 255, 255, 0.1);

  color: #fff;

}



.admin-nav__link--active {

  background-color: rgba(255, 255, 255, 0.15);

  color: #fff;

}



.nav-badge {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  min-width: 1.25rem;

  height: 1.25rem;

  padding-right: 0.1rem;

  margin-left: 0.25rem;

  border-radius: 999px;

  background-color: #dc2626;

  color: #fff;

  font-size: 0.7rem;

  font-weight: 600;

  line-height: 1;

}



.admin-nav__right {

  display: flex;

  align-items: center;

  gap: 0.75rem;

}



.admin-nav__user {

  font-size: 0.875rem;

  color: var(--color-nav-muted);

}



.admin-nav__theme-toggle {

  display: flex;

  align-items: center;

  justify-content: center;

  width: 2rem;

  height: 2rem;

  padding: 0;

  background-color: transparent;

  border: 1px solid rgba(255, 255, 255, 0.4);

  border-radius: 4px;

  color: var(--color-nav-muted);

  cursor: pointer;

  transition: background-color 0.15s, color 0.15s, border-color 0.15s;

}



.admin-nav__theme-toggle:hover {

  background-color: rgba(255, 255, 255, 0.1);

  color: #fff;

  border-color: rgba(255, 255, 255, 0.7);

}



.admin-nav__theme-toggle svg {

  width: 16px;

  height: 16px;

  stroke: currentColor;

  fill: none;

  stroke-width: 2;

  stroke-linecap: round;

  stroke-linejoin: round;

}



/* Show moon in light mode, sun in dark mode */

.admin-nav__theme-toggle .icon-moon  { display: block; }

.admin-nav__theme-toggle .icon-sun   { display: none; }



[data-theme="dark"] .admin-nav__theme-toggle .icon-moon { display: none; }

[data-theme="dark"] .admin-nav__theme-toggle .icon-sun  { display: block; }



.admin-nav__logout {

  padding: 0.375rem 0.875rem;

  background-color: transparent;

  border: 1px solid rgba(255, 255, 255, 0.4);

  border-radius: 4px;

  color: var(--color-nav-muted);

  font-size: 0.875rem;

  cursor: pointer;

  transition: background-color 0.15s, color 0.15s, border-color 0.15s;

}



.admin-nav__logout:hover {

  background-color: rgba(255, 255, 255, 0.1);

  color: #fff;

  border-color: rgba(255, 255, 255, 0.7);

}



.admin-main {

  padding: 0.75rem 1.5rem;

}