/* ================================
   Bio / Timeline helpers (MkDocs Material + Neoteroi)
   File: docs/css/bio.css
   ================================ */
.swiper {
  width: 600px;   /* set desired width */
  height: 300px;  /* set desired height */
}

.swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}


.nt-timeline-content .subtle-line {
  display: block;
  height: 0;
  border-top: 1px solid var(--md-default-fg-color--lighter, #bbb); /* 👈 solid line */
  margin: .6rem 0 .3rem;
  opacity: .6;
}

/* Never wrap timeline subtitles */
.no-wrap { white-space: nowrap; }

/* Ensure the left date column can expand to fit one line */
.nt-timeline .nt-timeline-subtitle,
.nt-timeline time,
.nt-timeline .nt-timeline-item .nt-timeline-subtitle {
  white-space: nowrap !important;
  min-width: max-content;
}

/* ---- Leaves as chips ---- */
.chips { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .2rem; }
.chip {
  display: inline-flex;
  font-size: .85em;
  background: var(--md-default-fg-color--lightest, #f3f3f3);
  border: 1px solid var(--md-default-fg-color--lighter, #e0e0e0);
  padding: .1rem .6rem;
  border-radius: 999px;
  white-space: nowrap;
}

.year-badge {
  display: inline-block;
  font-weight: 700;
  font-size: 0.9em;
  padding: 0.15rem 0.5rem;
  margin-right: 0.35rem;

  /* blue square look */
  color: #0d47a1;                  /* text color (deep blue) */
  border: 2px solid #0d47a1;       /* border color */
  border-radius: 0.25rem;          /* make corners slightly rounded; set to 0 for sharp */
  background: transparent;         /* keep inside white */
}

.nt-timeline {
  position: relative;
}

.nt-timeline::before {
  /* This pseudo-element will cover the line above the first dot */
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 1.15rem;  /* Adjust this: increase to hide more, decrease to hide less */
  background: var(--md-default-bg-color, #fff); /* Should match your card background */
  pointer-events: none;
  z-index: 2; /* Make sure it's above the timeline line */
}