/* v2.19.1: explicit, accessible Claim Mishnah card states. */
body.app-theme-jewel .tractate-card {
  --catalog-status-color: var(--jewel-line-strong);
  --catalog-status-tint: var(--jewel-neutral-tint);
  border-inline-start: 4px solid var(--catalog-status-color);
}

body.app-theme-jewel .tractate-card.is-status-available {
  --catalog-status-color: var(--jewel-green);
  --catalog-status-tint: var(--jewel-success-tint);
}

body.app-theme-jewel .tractate-card.is-status-held {
  --catalog-status-color: var(--jewel-gold);
  --catalog-status-tint: var(--jewel-gold-tint);
}

body.app-theme-jewel .tractate-card.is-status-partial {
  --catalog-status-color: var(--jewel-violet);
  --catalog-status-tint: var(--jewel-violet-tint);
}

body.app-theme-jewel .tractate-card.is-status-claimed {
  --catalog-status-color: var(--jewel-blue);
  --catalog-status-tint: var(--jewel-blue-tint);
}

body.app-theme-jewel .tractate-card.is-status-done {
  --catalog-status-color: var(--jewel-teal);
  --catalog-status-tint: var(--jewel-teal-tint);
}

body.app-theme-jewel .tractate-card > summary,
body.app-theme-jewel .tractate-card[open] > summary {
  background: color-mix(in srgb, var(--catalog-status-tint) 68%, var(--jewel-surface));
}

body.app-theme-jewel .tractate-card[open],
body.app-theme-jewel .tractate-card:hover {
  border-color: color-mix(in srgb, var(--catalog-status-color) 58%, var(--jewel-line));
  border-inline-start-color: var(--catalog-status-color);
}

body.app-theme-jewel .catalog-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 3px;
  width: fit-content;
  max-width: 190px;
  padding: 3px 7px;
  color: var(--catalog-status-color);
  border: 1px solid color-mix(in srgb, var(--catalog-status-color) 48%, var(--jewel-line));
  border-radius: 999px;
  background: var(--catalog-status-tint);
  font-size: .57rem;
  font-weight: 900;
  letter-spacing: .035em;
  line-height: 1.25;
  text-align: end;
  text-transform: uppercase;
}

body.app-theme-jewel .catalog-status-badge.status-held {
  --catalog-status-color: var(--jewel-gold);
  --catalog-status-tint: var(--jewel-gold-tint);
  white-space: normal;
}

body.app-theme-jewel .catalog-status-badge.status-available {
  --catalog-status-color: var(--jewel-green);
  --catalog-status-tint: var(--jewel-success-tint);
}

body.app-theme-jewel .catalog-status-badge.status-partial {
  --catalog-status-color: var(--jewel-violet);
  --catalog-status-tint: var(--jewel-violet-tint);
}

body.app-theme-jewel .catalog-status-badge.status-claimed {
  --catalog-status-color: var(--jewel-blue);
  --catalog-status-tint: var(--jewel-blue-tint);
}

body.app-theme-jewel .catalog-status-badge.status-done {
  --catalog-status-color: var(--jewel-teal);
  --catalog-status-tint: var(--jewel-teal-tint);
}

body.app-theme-jewel .hold-release-updates {
  border-color: color-mix(in srgb, var(--jewel-teal) 38%, var(--jewel-line));
}

body.app-theme-jewel .hold-release-update-row {
  background: color-mix(in srgb, var(--jewel-teal-tint) 52%, var(--jewel-surface));
}

@media (max-width: 720px) {
  body.app-theme-jewel .catalog-status-badge { max-width: 150px; }
}
