﻿.am-logo-img {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  max-width: 38px !important;
  max-height: 38px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  display: inline-block !important;
  border: 1px solid rgba(95,187,212,.55) !important;
  background: #090909 !important;
}

/* Fix left sidebar overlapping page content */
main,
.page,
.content,
.container {
  box-sizing: border-box !important;
}

.sidebar,
.side-menu,
aside {
  flex: 0 0 260px !important;
  min-width: 260px !important;
  max-width: 260px !important;
  margin-right: 28px !important;
}

.sidebar + *,
.side-menu + *,
aside + * {
  margin-left: 28px !important;
}

main:has(.sidebar),
main:has(.side-menu),
main:has(aside),
.page:has(.sidebar),
.page:has(.side-menu),
.page:has(aside),
.content:has(.sidebar),
.content:has(.side-menu),
.content:has(aside) {
  display: flex !important;
  align-items: flex-start !important;
  gap: 28px !important;
}

main > section,
.page > section,
.content > section {
  min-width: 0 !important;
}

/* Keep logo from pushing header layout */
.am-logo-img {
  margin-right: 8px !important;
  vertical-align: middle !important;
}

@media (max-width: 900px) {
  main:has(.sidebar),
  main:has(.side-menu),
  main:has(aside),
  .page:has(.sidebar),
  .page:has(.side-menu),
  .page:has(aside),
  .content:has(.sidebar),
  .content:has(.side-menu),
  .content:has(aside) {
    display: block !important;
  }

  .sidebar,
  .side-menu,
  aside {
    width: 100% !important;
    max-width: 100% !important;
    margin-right: 0 !important;
    margin-bottom: 24px !important;
  }

  .sidebar + *,
  .side-menu + *,
  aside + * {
    margin-left: 0 !important;
  }
}
