/* Logo text color */
.navbar-brand .navbar-item span {
  color: #1d1d1f !important;
}

/* Show hamburger menu on mobile only */
.navbar-burger {
  display: none;
}

@media screen and (max-width: 1023px) {
  .navbar-burger {
    display: block !important;
  }
  
  .navbar-menu {
    display: none;
    position: fixed !important;
    top: 4rem !important;
    left: 0 !important;
    width: 100% !important;
    height: auto !important;
    z-index: 9999 !important;
    background-color: white !important;
    padding: 0 !important;
  }
  
  .navbar-menu.is-active {
    display: block !important;
    box-shadow: 0 8px 16px rgba(10, 10, 10, 0.1);
  }
  
  .navbar-menu .navbar-item {
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #f5f5f5;
  }
}

/* Hide sidebar */
.sidebar {
  display: none !important;
}

/* Reduce footer height */
footer.footer {
  padding: 1rem 1.5rem !important;
}

footer.footer .footer-column {
  margin-bottom: 1rem !important;
}

/* Highlight active menu item */
.navbar-item.is-active {
  color: #36454F !important;
  font-weight: 600 !important;
  border-bottom: 2px solid #36454F !important;
}

/* Hover effect for menu items only (not logo) */
.navbar-end .navbar-item:hover:not(.is-active) {
  color: #5A6B75 !important;
}

/* Override theme hover colors with higher specificity */
.navbar.is-fresh .navbar-end .navbar-item:hover {
  color: #5A6B75 !important;
}

/* Override fixed navbar hover colors */
.navbar.is-fresh.is-fixed .navbar-end .navbar-item:hover {
  color: #5A6B75 !important;
}

/* Override cloned navbar hover colors */
#navbar-clone .navbar-end .navbar-item:hover {
  color: #5A6B75 !important;
}

/* Social media icons - match footer link colors */
.footer .level-item .icon {
  color: #b5b5b5 !important;
}

.footer .level-item .icon:hover {
  color: #ffffff !important;
}

/* Standardize all tag colors to charcoal */
.tag, .tags .tag {
  background-color: #36454F !important;
  color: #ffffff !important;
}

.tag:hover, .tags .tag:hover {
  background-color: #5A6B75 !important;
  color: #ffffff !important;
}

/* Better project layout for tablets */
@media screen and (min-width: 769px) and (max-width: 1215px) {
  .projects-page .column.is-8 {
    width: 90% !important;
  }
  
  .projects-page .columns.is-gapless .column.is-7 {
    width: 60% !important;
  }
  
  .projects-page .columns.is-gapless .column.is-5 {
    width: 40% !important;
  }
}

/* Project cards - match Blog/About content width */
.projects-page .card {
  margin: 0 0 2.5rem 0 !important;
}

/* Switch to vertical layout on narrow screens */
@media screen and (max-width: 768px) {
  .projects-page .columns.is-gapless {
    display: flex !important;
    flex-direction: column !important;
  }
  
  .projects-page .columns.is-gapless .column {
    width: 100% !important;
  }
}

/* Remove any background effects from logo */
.navbar-brand .navbar-item {
  background: none !important;
}

.navbar-brand .navbar-item:hover {
  background: none !important;
  color: inherit !important;
}

/* Remove active styling from logo */
.navbar-brand .navbar-item.is-active {
  border-bottom: none !important;
}

/* Make logo normal size - removed scaling to fix sticky header */
.navbar-brand .navbar-item img {
  /* transform: scale(1.2); */
}

/* Reduce logo size when navbar is sticky/scrolled */
.navbar.is-spaced .navbar-brand .navbar-item img,
.navbar.is-fixed-top .navbar-brand .navbar-item img {
  transform: scale(1.0);
}

/* Fix sticky navbar height */
#navbar-clone {
  min-height: 4rem !important;
}

#navbar-clone .navbar-brand {
  min-height: 4rem !important;
}

#navbar-clone .navbar-item {
  min-height: 4rem !important;
  display: flex !important;
  align-items: center !important;
}

/* Hide duplicate hamburger menu in sticky header */
#navbar-clone .navbar-burger {
  display: block !important;
}

@media screen and (min-width: 1024px) {
  #navbar-clone .navbar-burger {
    display: none !important;
  }
}

/* Mobile menu for sticky header */
@media screen and (max-width: 1023px) {
  #navbar-menu-clone {
    display: none;
    position: fixed !important;
    top: 4rem !important;
    left: 0 !important;
    width: 100% !important;
    height: auto !important;
    z-index: 9999 !important;
    background-color: white !important;
    padding: 0 !important;
  }
  
  #navbar-menu-clone.is-active {
    display: block !important;
    box-shadow: 0 8px 16px rgba(10, 10, 10, 0.1);
  }
}

/* Hide one of the hamburger menus in sticky header */
#navbar-clone .navbar-start .navbar-item {
  display: none !important;
}

/* Make sidebar logo bigger */
.sidebar-header img {
  /* width: 40px !important; */
  height: 45px !important;
}

/* Ensure sidebar shows properly when active */
.sidebar.is-active {
  transform: translateX(0) !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Make navbar logo bigger */
.navbar-brand .navbar-item img {
  /* width: 60px !important; */
  /* height: 100px !important; */
}

/* Increase spacing between code blocks and following text */
.highlight + p,
.highlight + h1,
.highlight + h2,
.highlight + h3,
.highlight + h4,
.highlight + h5,
.highlight + h6,
pre + p,
pre + h1,
pre + h2,
pre + h3,
pre + h4,
pre + h5,
pre + h6 {
  margin-top: 2rem !important;
}

/* Reduce spacing between text and following code blocks */
p + .highlight,
h1 + .highlight,
h2 + .highlight,
h3 + .highlight,
h4 + .highlight,
h5 + .highlight,
h6 + .highlight,
p + pre,
h1 + pre,
h2 + pre,
h3 + pre,
h4 + pre,
h5 + pre,
h6 + pre {
  margin-top: 0.5rem !important;
}
