/* === MY LAB — custom.css for Quarto === */

/* IBM Plex font family — technical/engineered feel, matches the lab's
   EE + neuroscience/hardware identity. Includes a mono variant for code
   blocks and technical tables. */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

body {
  font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, "Helvetica Neue", Arial, sans-serif;
}

h1, h2, h3, h4, h5, h6,
.navbar-brand,
.listing-title,
.card-title {
  font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, "Helvetica Neue", Arial, sans-serif;
  font-weight: 600;
}

code, pre, kbd, samp,
.sourceCode {
  font-family: 'IBM Plex Mono', SFMono-Regular, Menlo, Consolas, monospace;
}

/* Justified body text */
p {
  text-align: justify;
}

/* Magenta branding (matches your original) */
h1, h2, h3, h4, h5, .caption {
  color: #b70e82 !important;
}


/* Card titles */
.card-body strong a,
.card-body a {
  color: #0000ff !important;
  font-weight: bold;
  text-decoration: none;
}

/* Quarto listing cards */
.quarto-grid-item .listing-title {
  color: #0000ff !important;
  font-weight: bold;
}

/* Funder logos: equal height, centered, with spacing */
.text-center img {
  object-fit: contain;
  max-width: 160px;
  margin: 1rem auto;
  display: block;
}

/* Navbar brand color */
.navbar-brand {
  color: #b70e82 !important;
  font-weight: bold;
}

/* Badge replacements (replaces {bdg-primary} etc.) */
.badge-primary   { background: #0d6efd; color: white; padding: 2px 8px; border-radius: 4px; font-size: 0.8em; }
.badge-info      { background: #0dcaf0; color: white; padding: 2px 8px; border-radius: 4px; font-size: 0.8em; }
.badge-secondary { background: #6c757d; color: white; padding: 2px 8px; border-radius: 4px; font-size: 0.8em; }


/* === Left sidebar: make sections and pages visually distinct === */

/* Section headers (Ephys Workshop, Ephys Pipeline, ...) */
#quarto-sidebar .sidebar-item-section > .sidebar-item-container {
  margin-top: 0.9rem;
  padding: 0.35rem 0.5rem;
  border-bottom: 2px solid #b70e82;
}
#quarto-sidebar .sidebar-item-section > .sidebar-item-container .menu-text,
#quarto-sidebar .sidebar-item-section > .sidebar-item-container a {
  color: #b70e82 !important;
  font-weight: 700;
  font-size: 0.8rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

/* Pages under a section: smaller, indented, with a guide line */
#quarto-sidebar .sidebar-section.depth1 {
  margin: 0.25rem 0 0.5rem 0.4rem;
  padding-left: 0.4rem;
  border-left: 2px solid rgba(183, 14, 130, 0.25);
}
#quarto-sidebar .sidebar-section .sidebar-item .sidebar-item-container a {
  font-size: 0.85rem;
  font-weight: 400;
  opacity: 0.85;
  padding: 0.15rem 0.5rem;
  border-radius: 4px;
}
#quarto-sidebar .sidebar-section .sidebar-item .sidebar-item-container a:hover {
  opacity: 1;
  background: rgba(183, 14, 130, 0.08);
}

/* Current page */
#quarto-sidebar .sidebar-section .sidebar-item .sidebar-item-container a.active {
  opacity: 1;
  font-weight: 600;
  color: #b70e82 !important;
  background: rgba(183, 14, 130, 0.12);
  box-shadow: inset 3px 0 0 #b70e82;
}


/* Nested sub-sections (for example JumpLVM inside Neural Population Dynamics) */
#quarto-sidebar .sidebar-section.depth1 .sidebar-item-section > .sidebar-item-container {
  margin-top: 0.35rem;
  padding: 0.15rem 0.5rem;
  border-bottom: none;
}
#quarto-sidebar .sidebar-section.depth1 .sidebar-item-section > .sidebar-item-container .menu-text,
#quarto-sidebar .sidebar-section.depth1 .sidebar-item-section > .sidebar-item-container a {
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: normal;
  text-transform: none;
}
#quarto-sidebar .sidebar-section.depth2 {
  margin: 0.1rem 0 0.3rem 0.5rem;
  padding-left: 0.4rem;
  border-left: 1px solid rgba(183, 14, 130, 0.2);
}