/* Release notes as a release log (markup from _ext/release_notes_view.py, filters in
   js/release-notes.js). Types use the callout inks and tints from adverity.css. */

.dx-page--rn {
  --rn-breaking: var(--adv-ink-danger);   --rn-breaking-bg: var(--adv-tint-danger);
  --rn-new: var(--adv-ink-tip);           --rn-new-bg: var(--adv-tint-tip);
  --rn-changed: var(--adv-brand);         --rn-changed-bg: var(--adv-brand-soft);
  --rn-retiring: var(--adv-ink-warning);  --rn-retiring-bg: var(--adv-tint-warning);
  --rn-fixed: var(--adv-text-secondary);  --rn-fixed-bg: var(--adv-surface-2);
}
.dx-visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Filter bar: search, then type chips (styled like the row tags, with counts) and area ------ */
.dx-rn-bar {
  position: sticky; top: var(--adv-header-h); z-index: 5;
  margin: var(--adv-space-large) 0 var(--adv-space-medium); padding: var(--adv-space-small) 0;
  border-bottom: 1px solid var(--adv-border); background: var(--adv-surface);
}
.dx-rn-bar[hidden] { display: none; }
.dx-rn-search { position: relative; display: flex; align-items: center; }
.dx-rn-search svg { position: absolute; left: var(--adv-space-small); color: var(--adv-text-secondary); pointer-events: none; }
.dx-rn-search input {
  width: 100%; height: var(--adv-control-lg); padding: 0 var(--adv-space-small) 0 40px;
  border: 1px solid var(--adv-border); border-radius: var(--adv-radius-medium);
  background: var(--adv-surface); color: var(--adv-text); font: 400 15px var(--adv-font-body);
  transition: border-color var(--dx-duration) var(--dx-ease), box-shadow var(--dx-duration) var(--dx-ease);
}
.dx-rn-search input::placeholder { color: var(--adv-text-secondary); }
.dx-rn-search input:focus { outline: none; border-color: var(--adv-brand-active); box-shadow: var(--dx-ring); }
.dx-rn-bar__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--adv-space-x-small); margin-top: var(--adv-space-x-small); }
.dx-rn-types { display: flex; flex-wrap: wrap; gap: var(--adv-space-xx-small); }
.dx-rn-chip {
  display: inline-flex; align-items: center; gap: 6px; height: var(--adv-control-sm); padding: 0 var(--adv-space-x-small);
  border: 1px solid var(--adv-border); border-radius: var(--adv-radius-medium);
  background: var(--adv-surface); color: var(--adv-text-secondary); cursor: pointer;
  font: 600 12px var(--adv-font-body);
  transition: border-color var(--dx-duration) var(--dx-ease), background-color var(--dx-duration) var(--dx-ease), color var(--dx-duration) var(--dx-ease);
}
.dx-rn-chip__n { font-weight: 500; opacity: 0.75; }
.dx-rn-chip:hover { border-color: var(--rn-k, var(--adv-brand)); color: var(--rn-k, var(--adv-brand)); }
.dx-rn-chip[aria-pressed="true"] { border-color: transparent; background: var(--rn-k-bg, var(--adv-brand-tint)); color: var(--rn-k, var(--adv-brand)); }
.dx-rn-chip--breaking { --rn-k: var(--rn-breaking); --rn-k-bg: var(--rn-breaking-bg); }
.dx-rn-chip--new { --rn-k: var(--rn-new); --rn-k-bg: var(--rn-new-bg); }
.dx-rn-chip--changed { --rn-k: var(--rn-changed); --rn-k-bg: var(--rn-changed-bg); }
.dx-rn-chip--retiring { --rn-k: var(--rn-retiring); --rn-k-bg: var(--rn-retiring-bg); }
.dx-rn-chip--fixed { --rn-k: var(--rn-fixed); --rn-k-bg: var(--rn-fixed-bg); }
.dx-rn-seg { display: inline-flex; padding: 2px; border: 1px solid var(--adv-border); border-radius: var(--adv-radius-medium); }
.dx-rn-seg button {
  height: 20px; padding: 0 var(--adv-space-x-small); border: 0; border-radius: var(--adv-radius-small);
  background: transparent; color: var(--adv-text-secondary); cursor: pointer; font: 600 12px var(--adv-font-body);
  transition: background-color var(--dx-duration) var(--dx-ease), color var(--dx-duration) var(--dx-ease);
}
.dx-rn-seg button:hover { color: var(--adv-text); }
.dx-rn-seg button[aria-pressed="true"] { background: var(--adv-brand-tint); color: var(--adv-brand); }
.dx-rn-bar__status { display: flex; align-items: center; gap: var(--adv-space-small); margin-top: var(--adv-space-x-small); }
.dx-rn-bar__status:has(p:empty):has(.dx-rn-clear[hidden]) { display: none; }
.dx-prose .dx-rn-bar__status p { margin: 0; font-size: 13px; color: var(--adv-text-secondary); }
.dx-rn-clear { padding: 0; border: 0; background: none; color: var(--adv-brand); cursor: pointer; font: 600 13px var(--adv-font-body); }
.dx-rn-clear:hover { text-decoration: underline; text-underline-offset: 3px; }

/* Release ------------------------------------------------------------------------ */
.dx-prose .dx-rn-release { margin: 0 0 var(--adv-space-xx-large); }
.dx-prose .dx-rn-release[hidden] { display: none; }
.dx-rn-release__head {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--adv-space-xx-small) var(--adv-space-small);
  padding-bottom: var(--adv-space-small); border-bottom: 1px solid var(--adv-border);
}
.dx-prose .dx-rn-release__lead { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--adv-space-xx-small) var(--adv-space-small); color: var(--adv-text-secondary); }
.dx-prose .dx-rn-release__lead time { margin-right: var(--adv-space-x-small); }
.dx-rn-release__lead .dx-rn-count { font-size: 14px; font-weight: 600; color: var(--rn-c); }
.dx-prose .dx-rn-release__date { margin: 0; font-size: 14px; color: var(--adv-text-secondary); }
.dx-prose ul.dx-rn-release__counts { display: flex; flex-wrap: wrap; gap: var(--adv-space-x-small); margin: 0 0 0 auto; padding: 0; list-style: none; }
.dx-prose ul.dx-rn-release__counts li { margin: 0; font-size: 13px; font-weight: 600; color: var(--rn-c); }
.dx-rn-count--breaking { --rn-c: var(--rn-breaking); }
.dx-rn-count--new { --rn-c: var(--rn-new); }
.dx-rn-count--changed { --rn-c: var(--rn-changed); }
.dx-rn-count--retiring { --rn-c: var(--rn-retiring); }
.dx-rn-count--fixed { --rn-c: var(--rn-fixed); }

/* One change ------------------------------------------------------------------- */
.dx-rn-item {
  display: grid; grid-template-columns: 168px minmax(0, 1fr); gap: var(--adv-space-medium);
  padding: var(--adv-space-medium) 0; border-bottom: 1px solid var(--adv-border);
}
.dx-rn-item[hidden] { display: none; }
.dx-rn-item:target .dx-rn-item__title { color: var(--adv-brand); }
.dx-rn-item__meta { display: flex; flex-direction: column; align-items: flex-start; gap: var(--adv-space-xx-small); padding-top: 3px; }
.dx-rn-kind {
  display: inline-flex; align-items: center; height: var(--adv-control-sm); padding: 0 var(--adv-space-x-small);
  border-radius: var(--adv-radius-medium); background: var(--rn-k-bg); color: var(--rn-k);
  font-size: 12px; font-weight: 700; letter-spacing: 0.02em;
}
.dx-rn-kind--breaking { --rn-k: var(--rn-breaking); --rn-k-bg: var(--rn-breaking-bg); }
.dx-rn-kind--new { --rn-k: var(--rn-new); --rn-k-bg: var(--rn-new-bg); }
.dx-rn-kind--changed { --rn-k: var(--rn-changed); --rn-k-bg: var(--rn-changed-bg); }
.dx-rn-kind--retiring { --rn-k: var(--rn-retiring); --rn-k-bg: var(--rn-retiring-bg); }
.dx-rn-kind--fixed { --rn-k: var(--rn-fixed); --rn-k-bg: var(--rn-fixed-bg); }
.dx-rn-area { font-size: 13px; line-height: 18px; color: var(--adv-text-secondary); }
.dx-prose .dx-rn-item__title { margin: 0 0 var(--adv-space-xx-small); font-size: 17px; line-height: 26px; font-weight: 600; }
.dx-prose .dx-rn-item__body > :first-child { margin-top: 0; }
.dx-prose .dx-rn-item__body > :last-child { margin-bottom: 0; }
.dx-prose .dx-rn-item__body p { margin: 0 0 var(--adv-space-x-small); font-size: 15px; line-height: 24px; }
.dx-prose .dx-rn-item__body:empty { display: none; }
.dx-prose .dx-rn-item__body .rn-endpoints-label { margin-top: var(--adv-space-small); font-size: 13px; font-weight: 600; color: var(--adv-text-secondary); }
.dx-prose .dx-rn-item__body ul.rn-endpoints { margin: 0; padding: 0; list-style: none; }
.dx-prose .dx-rn-item__body ul.rn-endpoints li p { margin: 2px 0; font-size: 13px; color: var(--adv-text-secondary); }

/* Release page: "On this page" lists the change headlines under one label per type ---------------- */
.dx-outline .dx-rn-toc ul a { padding-left: var(--adv-space-small); }
.dx-outline .dx-rn-toc > li + li { margin-top: var(--adv-space-small); }
.dx-outline .dx-rn-toc__label {
  display: flex; gap: 6px; margin: 0; padding: var(--adv-space-xx-small) 0 var(--adv-space-xx-small) var(--adv-space-small);
  font-size: 12px; font-weight: 600; line-height: 16px; color: var(--adv-text-strong);
}
.dx-outline .dx-rn-toc__label span { font-weight: 400; color: var(--adv-text-muted); }

/* Release page: older and newer release */
.dx-rn-pager { display: flex; gap: var(--adv-space-small); margin-top: var(--adv-space-x-large); }
.dx-rn-pager a {
  display: flex; flex-direction: column; flex: 1; max-width: 50%; padding: var(--adv-space-small) var(--adv-space-medium);
  border: 1px solid var(--adv-border); border-radius: var(--adv-radius-medium);
  color: var(--adv-text-strong); font-weight: 600; text-decoration: none;
  transition: border-color var(--dx-duration) var(--dx-ease);
}
.dx-rn-pager a:hover { border-color: var(--adv-brand); }
.dx-rn-pager a span { font-size: 13px; font-weight: 400; color: var(--adv-text-secondary); }
.dx-rn-pager__newer { margin-left: auto; text-align: right; }

/* Landing page: every release by year, one line per change ----------------------------- */
.dx-prose .dx-rn-year > h2 { margin: var(--adv-space-x-large) 0 var(--adv-space-medium); }
.dx-prose .dx-rn-year[hidden] { display: none; }
.dx-prose .dx-rn-year .dx-rn-release { margin-bottom: var(--adv-space-x-large); }
.dx-prose .dx-rn-release__head h3 { margin: 0; font-size: 20px; line-height: 28px; }
.dx-prose .dx-rn-release__head h3 a { color: var(--adv-text-strong); text-decoration: none; }
.dx-prose .dx-rn-release__head h3 a:hover { color: var(--adv-brand); }
.dx-rn-year .dx-rn-item { padding: var(--adv-space-small) 0; }
.dx-prose .dx-rn-year .dx-rn-item__title { margin: 0; font-size: 15px; line-height: 22px; }
.dx-prose .dx-rn-year .dx-rn-item__title a { color: var(--adv-text-strong); text-decoration: none; }
.dx-prose .dx-rn-year .dx-rn-item__title a:hover { color: var(--adv-brand); text-decoration: underline; text-underline-offset: 3px; }
.dx-prose .dx-rn-item__excerpt { margin: 2px 0 0; font-size: 14px; line-height: 21px; color: var(--adv-text-secondary); }

/* Left sidebar: every release by year ------------------------------------------------- */
.dx-rn-nav__year { margin: var(--adv-space-small) 0 var(--adv-space-xx-small); padding: 0 var(--adv-space-x-small); font-size: 12px; font-weight: 700; letter-spacing: 0.06em; color: var(--adv-text-secondary); }
.dx-nav .dx-rn-nav a { display: flex; justify-content: space-between; gap: var(--adv-space-x-small); }
.dx-rn-nav__date { font-size: 12px; color: var(--adv-text-muted); }

@media (max-width: 767px) {
  .dx-rn-item { grid-template-columns: minmax(0, 1fr); gap: var(--adv-space-x-small); }
  .dx-rn-item__meta { flex-direction: row; align-items: center; gap: var(--adv-space-x-small); }
  .dx-prose ul.dx-rn-release__counts { margin-left: 0; }
  .dx-rn-pager a { max-width: none; }
}
