/* CSS/site.css */

:root {
  --color-nonact: #3051c6; /* menu bar default */  
  --color-act:    #0f2e6d; /* menu bar hover/active */
  --color-text:   #4B4B4B; /* default body text */
  --site-max-width: 750px;
}

/* Global font + text defaults */
body {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  line-height: 1.5;
  color: var(--color-text);
}

/* ============================= */
/* Articles view (list + content)*/
/* ============================= */

.article-list {
  display: flex;
  flex-direction: column;
  row-gap: 4px;           /* space between items */
  max-height: 250px;      /* trial-and-error: ~4.5 items? */
  overflow-y: auto;       /* make it scroll */
}

/* Smooth swap for article body */
.article-content {
  transition: opacity 180ms ease;
}
.article-content.is-loading {
  opacity: 0.4;           /* dim instead of flashing blank */
  pointer-events: none;
}

/* shared scroll bar style for both list and content */
.article-list,
.article-content {
  scrollbar-width: thin;            /* Firefox */
  scrollbar-color: #3051c6 #f1f1f1; /* Firefox (thumb, track) */
}

.article-list::-webkit-scrollbar,
.article-content::-webkit-scrollbar {
  width: 8px;
}

.article-list::-webkit-scrollbar-track,
.article-content::-webkit-scrollbar-track {
  background: #f1f1f1;
}

.article-list::-webkit-scrollbar-thumb,
.article-content::-webkit-scrollbar-thumb {
  background-color: #3051c6; /* same as menu bar color */
  border-radius: 4px;
}

/* References scroll box */
.references {
  max-height: 700px;     /* adjust to taste */
  overflow-y: auto;
  padding: 8px 0;
  text-align: center;    /* center logos horizontally */
}

/* Logo images */
.references img {
  display: block;
  max-width: 500px;      /* fixed max width */
  width: 100%;
  height: auto;          /* keep proportions */
  margin: 0 auto 24px;   /* center + spacing */
}

/* Reuse scrollbar style */
.references {
  scrollbar-width: thin;            /* Firefox */
  scrollbar-color: #3051c6 #f1f1f1; /* thumb, track */
}
.references::-webkit-scrollbar {
  width: 8px;
}
.references::-webkit-scrollbar-track {
  background: #f1f1f1;
}
.references::-webkit-scrollbar-thumb {
  background-color: #3051c6;
  border-radius: 4px;
}