/* ---------- Base collapsible ---------- */

.collapsible {
  width: 100%;
  text-align: left;
  padding: 14px 16px;
  font-size: 16px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  position: relative;
  padding-right: 36px;
  border-radius: 6px;
  background-color: #e9f4fb;   /* safe default */
  color: #1a1a1a;
  margin-bottom: 6px;
}

.collapsible:hover {
  filter: brightness(0.96);
}

/* Arrow icon */
.collapsible::after {
  content: "";
  position: absolute;
  right: 16px;
  top: 50%;
  width: 0;
  height: 0;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 8px solid #1A1A1A;
  transform: translateY(-50%);
  transition: transform 0.2s ease;
}

.collapsible.active::after {
  transform: translateY(-50%) rotate(90deg);
}


/* ---------- Active states ---------- */

.collapsible.active {
  box-shadow: inset 0 0 0 2px rgba(0,0,0,0.12);
}

.collapsible.week.active {
  box-shadow:
    inset 0 0 0 2px rgba(0,0,0,0.18),
    0 2px 6px rgba(0,0,0,0.15);
}

/* ---------- Color collapsibles ---------- */

.collapsible.policy {
  font-weight: 600;
  border-radius: 6px;
}

/* ---------- Blue (GC anchor) ---------- */
.collapsible.policy.blue {
  background-color: #dbeaf4;
  color: #003554;
}

.collapsible.policy.blue:hover {
  background-color: #c9e0ee;
}

.collapsible.policy.blue + .content {
  background-color: #eef5fa;
  color: #1f3a4a;
}


/* ---------- Slate (blue-gray) ---------- */
.collapsible.policy.slate {
  background-color: #e1e6ec;
  color: #2b3a4a;
}

.collapsible.policy.slate:hover {
  background-color: #d1d8e0;
}

.collapsible.policy.slate + .content {
  background-color: #f2f5f8;
  color: #24313f;
}


/* ---------- Teal (muted green-blue) ---------- */
.collapsible.policy.teal {
  background-color: #dff0ee;
  color: #1f4a49;
}

.collapsible.policy.teal:hover {
  background-color: #cde6e3;
}

.collapsible.policy.teal + .content {
  background-color: #f0f8f7;
  color: #243d3d;
}


/* ---------- Sand (warm neutral) ---------- */
.collapsible.policy.sand {
  background-color: #f1e8d8;
  color: #5a3f1e;
}

.collapsible.policy.sand:hover {
  background-color: #e6dcc8;
}

.collapsible.policy.sand + .content {
  background-color: #faf6ee;
  color: #4a3418;
}


/* ---------- Plum (dignified purple-gray) ---------- */
.collapsible.policy.plum {
  background-color: #e6dff0;
  color: #432b5c;
}

.collapsible.policy.plum:hover {
  background-color: #d8cfe6;
}

.collapsible.policy.plum + .content {
  background-color: #f3eff8;
  color: #362347;
}


/* ---------- Stone (cool institutional gray) ---------- */
.collapsible.policy.stone {
  background-color: #e3e3e6;
  color: #2f2f33;
}

.collapsible.policy.stone:hover {
  background-color: #d6d6da;
}

.collapsible.policy.stone + .content {
  background-color: #f4f4f6;
  color: #2a2a2a;
}

/* ---------- Sky (lighter, cleaner blue) ---------- */
.collapsible.policy.sky {
  background-color: #e2eef8;
  color: #003a63;
}

.collapsible.policy.sky:hover {
  background-color: #d2e3f3;
}

.collapsible.policy.sky + .content {
  background-color: #f1f7fc;
  color: #1f3550;
}


/* ---------- Moss (earthy green-gray) ---------- */
.collapsible.policy.moss {
  background-color: #e5eee6;
  color: #314a32;
}

.collapsible.policy.moss:hover {
  background-color: #d6e3d8;
}

.collapsible.policy.moss + .content {
  background-color: #f3f8f4;
  color: #2a3f2b;
}


/* ---------- Clay (warm muted orange-brown) ---------- */
.collapsible.policy.clay {
  background-color: #f0e3dc;
  color: #6a3a26;
}

.collapsible.policy.clay:hover {
  background-color: #e4d3c9;
}

.collapsible.policy.clay + .content {
  background-color: #faf2ee;
  color: #5a2f20;
}


/* ---------- Ink (deep blue-neutral, non-black) ---------- */
.collapsible.policy.ink {
  background-color: #e4e8ee;
  color: #263248;
}

.collapsible.policy.ink:hover {
  background-color: #d4dbe4;
}

.collapsible.policy.ink + .content {
  background-color: #f3f5f8;
  color: #1f293a;
}


/* ---------- Collapsible Content ---------- */

.content {
  display: none;
  padding: 16px;
  background: #ffffff;
  border-left: 3px solid #d8eef9;
}







ol.papers {
  list-style: none;
  padding-left: 0;
  counter-reset: paper calc(var(--count) + 1);
}

ol.papers > li {
  counter-increment: paper -1;
  margin-bottom: 14px;
}

ol.papers > li > .collapsible::before {
  content: "[" counter(paper) "] ";
  font-weight: 600;
  color: #333;
}

ol.papers > li > .collapsible {
  display: block;
  width: 100%;
  text-align: left;
  padding-left: 1.00em;
  text-indent: -0.75em;
}


ul.papers {
  list-style: none;
  padding-left: 0;
  margin-left: 0; 
  counter-reset: paper calc(var(--count) + 1);
}

/* count down */
ul.papers > li {
  position: relative;
  counter-increment: paper -1;
  margin-bottom: 0.75em;

  /* text block starts here */
  padding-left: 2em;

}

/* show [N] before each item */
ul.papers > li::before {
  content: "[" counter(paper) "] ";
  font-weight: 600;
  color: #333;
  margin-right: 0.50em;
  position: absolute;
  left: 0;
  width: 2.5em;
}