/*
 * "In This Section" A–Z scroll panel (prototype).
 * Pairs with js/section-list.js. Only applies once enhanced (>25 items).
 */

@media (min-width: 1000px) {
  /* Sidebar sticks beside the essay so page length follows the body, not the
     list. align-self keeps the flex item from stretching (sticky needs that). */
  .regional-essay__sidebar.section-list-enhanced,
  .thematic-essay__sidebar.section-list-enhanced {
    position: sticky;
    top: 1rem;
    align-self: flex-start;
  }
}

/* The WHOLE enhanced sidebar caps to the viewport and scrolls as one region
   (TOC + filter + A–Z list together). This avoids a tall TOC squishing a
   separately-capped list. Everything stays in the DOM, so Ctrl+F is intact. */
.regional-essay__sidebar.section-list-enhanced,
.thematic-essay__sidebar.section-list-enhanced {
  max-height: calc(100vh - 2rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  /* No top padding on the scroll container, so sticky letter dividers stick
     flush to the top edge instead of leaving a strip where the previous row
     shows through. The breathing room moves to the first child below. */
  padding-top: 0;
}

.section-list-enhanced > :first-child {
  padding-top: 1rem;
}

.section-list-enhanced .section-list {
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 4px;
}

/* Live filter box above the panel — a white field with dark, legible text and
   placeholder (Olivero forces inputs white, so light-on-translucent vanished).
   Scoped to .section-list-enhanced for the specificity to beat Olivero. */
.section-list-enhanced .section-list__filter {
  width: 100%;
  box-sizing: border-box;
  margin-bottom: 0.6rem;
  padding: 0.4rem 0.6rem;
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 4px;
  background: #fff;
  color: #014360;
  font-size: 0.85rem;
}

.section-list-enhanced .section-list__filter::placeholder {
  color: #5a7282;
  opacity: 1; /* Firefox dims placeholders by default */
}

.section-list-enhanced .section-list__filter:focus {
  outline: 2px solid #c3e8f3;
  outline-offset: 1px;
}

/* Sticky letter dividers ride the top of the scroll area. */
.section-list__divider {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #014360;
  color: #e8f4f8;
  font-family: var(--sah-font-head);
  font-weight: 700;
  font-size: 0.8rem;
  letter-spacing: 0.06em;
  padding: 0.2rem 0.6rem;
}

/* Tighten rows inside the panel; kill Olivero's default row margins. */
.section-list .views-row {
  margin: 0;
  padding: 0.25rem 0.6rem;
  line-height: 1.35;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.section-list .views-row:last-child {
  border-bottom: 0;
}
