/* rn_SP12EPIC88.css (v1)
   EPIC88: Sprint cards progressive disclosure using native <details>/<summary>
   - Reuses caret styling from rn.css (.rn-archive__summary::after + .rn-archive[open] ...)
   - Keeps scope to the sprint cards grid only
*/

/* Toolbar above the sprint cards */
.rn88-toolbar{
  display:flex;
  gap: 12px;
  align-items:center;
  justify-content:flex-start;
  margin: 10px 0 14px 0;
  flex-wrap: wrap;
}

/* Make controls look like refined text buttons (not stickers) */
.rn88-btn{
  appearance: none;
  border: none;
  background: transparent;
  padding: 6px 2px;
  font: inherit;
  color: rgba(77, 85, 91, 0.86);
  cursor: pointer;
  letter-spacing: 0.02em;
}

.rn88-btn:hover{
  text-decoration: underline;
  text-underline-offset: 3px;
}

.rn88-btn:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px rgba(242, 192, 120, 0.35);
  border-radius: 10px;
  padding: 6px 8px;
  margin-left: -6px;
}

/* --- Sprint card disclosure (details/summary) --- */
/* We attach rn-archive + rn-archive__summary to reuse the caret. We neutralize rn-archive's container visuals here. */
#release-grid-dynamic .release-card .rn88-details.rn-archive{
  border: none;
  background: transparent;
  border-radius: 0;
  overflow: visible;
  margin: 0;
}

/* summary should not look like a separate banner */
#release-grid-dynamic .release-card .rn88-summary.rn-archive__summary{
  padding: 0;
  background: transparent;
  border: none;
  align-items: flex-start; /* allow multi-line titles without awkward centering */
}

/* remove hover background inherited from rn.css archive hover */
@media (hover: hover) and (pointer: fine) {
  #release-grid-dynamic .release-card .rn88-summary.rn-archive__summary:hover{
    background: transparent;
  }
}

/* caret placement: keep it subtle and aligned with the first line */
#release-grid-dynamic .release-card .rn88-summary.rn-archive__summary::after{
  margin-left: 10px; /* a touch more breathing room in cards */
}

/* content wrapper inside summary */
#release-grid-dynamic .rn88-summary__content{
  min-width: 0;
}

/* panel (bullets) spacing: appears as continuation of the card */
#release-grid-dynamic .rn88-panel{
  padding-top: 10px;
}

/* minor rhythm improvements when collapsed (details closed) */
#release-grid-dynamic .rn88-details:not([open]) .release-meta{
  margin-bottom: 0;
}

/* -------------------------------------------------------
   EPIC88 Timeline table progressive disclosure (v3)
   - Reuses rn.css caret via rn-archive__summary on a <summary>
   - Toggle row placed between first two rows and total row
-------------------------------------------------------- */

#release-macro-body .rn88-tl-toggle-row td{
  padding: 10px 0;
  border-top: 1px solid rgba(0,0,0,0.06);
  border-bottom: 1px solid rgba(0,0,0,0.06);
}

#release-macro-body .rn88-tl-toggle-cell{
  text-align: center;
}

#release-macro-body .rn88-tl-details.rn-archive{
  border: none;
  background: transparent;
  margin: 0;
  display: inline-block;
}

/* Summary: caret only (no pill, no banner) */
#release-macro-body summary.rn88-tl-summary.rn-archive__summary{
  padding: 0;
  background: transparent;
  border: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px; /* tap target */
}

/* Keep caret centered; reduce spacing since no label */
#release-macro-body summary.rn88-tl-summary.rn-archive__summary::after{
  margin-left: 0;
}

/* Hide the default marker triangle in some browsers */
#release-macro-body summary.rn88-tl-summary{
  list-style: none;
}

#release-macro-body summary.rn88-tl-summary::-webkit-details-marker{
  display: none;
}

/* Screen-reader only helper */
.rn88-sr-only{
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

/* Mobile-first adjustments */
@media (max-width: 520px){
  .rn88-toolbar{
    gap: 10px;
  }
  .rn88-btn{
    padding: 8px 2px; /* slightly larger tap target on mobile */
  }
  #release-macro-body .rn88-tl-toggle-row td{
    padding: 12px 0;
  }
}

@media (pointer: coarse){
  #release-macro-body summary.rn88-tl-summary.rn-archive__summary{
    min-height: 36px;
  }
}

/* Release Notes: micro orientation line */
.rn-readguide{
  margin: 0.8rem 0 1.1rem 0;
  padding: 0.65rem 0.85rem;
  font-size: 0.90rem;
  line-height: 1.45;
  color: #555;
  background: rgba(0,0,0,0.03);
  border-radius: 10px;
}

.rn-readguide strong{
  font-weight: 600;
  color: #444;
}

/* RN Top grouping: prevent rn-readguide from becoming a 2nd “box” */
.rn-top-instructions .rn-readguide{
  margin: 10px 0 0 0;
  padding: 0;
  background: transparent;
  border-radius: 0;
  color: inherit;
}