/* Product changelog table — Midnight rails (same language as tickets list). */

.nx-product-changelog-shell,
.nx-sysinfo-shell {
  --nx-cl-radius: 16px;
  --nx-cl-radius-sm: 12px;
  --nx-cl-row-gap: 12px;
  --nx-cl-bg: #fff;
  --nx-cl-row: rgba(0, 0, 0, 0.03);
  --nx-cl-row-hover: rgba(0, 0, 0, 0.055);
  --nx-cl-br: rgba(0, 0, 0, 0.07);
  --nx-cl-br-hover: rgba(0, 0, 0, 0.1);
  --nx-cl-muted: rgba(55, 65, 81, 0.72);
  --nx-cl-text: #1f2937;
  --nx-cl-accent: #0d6efd;
}

:is(html.prestige, html[data-bs-theme="prestige"]) .nx-product-changelog-shell,
:is(html.prestige, html[data-bs-theme="prestige"]) .nx-sysinfo-shell {
  --nx-cl-accent: #6772e5;
}

/* Plain Midnight (platinum overlay) — not AUR Midnight. */
:is(html.midnight:not(.AUR):not(.aur), html[data-bs-theme="midnight"]:not(.AUR), html.app-admin.midnight, html.app-admin[data-bs-theme="midnight"]) .nx-product-changelog-shell,
:is(html.midnight:not(.AUR):not(.aur), html[data-bs-theme="midnight"]:not(.AUR), html.app-admin.midnight, html.app-admin[data-bs-theme="midnight"]) .nx-sysinfo-shell {
  --nx-cl-bg: #121212;
  --nx-cl-row: rgba(255, 255, 255, 0.03);
  --nx-cl-row-hover: rgba(197, 205, 216, 0.06);
  --nx-cl-br: rgba(255, 255, 255, 0.12);
  --nx-cl-br-hover: rgba(197, 205, 216, 0.28);
  --nx-cl-muted: rgba(255, 255, 255, 0.5);
  --nx-cl-text: rgba(255, 255, 255, 0.88);
  --nx-cl-accent: #c5cdd8;
}

:is(html.AUR.midnight, html.aur.midnight, html[data-bs-theme="aur-midnight"], html[data-bs-theme="AUR midnight"]) .nx-product-changelog-shell,
:is(html.AUR.midnight, html.aur.midnight, html[data-bs-theme="aur-midnight"], html[data-bs-theme="AUR midnight"]) .nx-sysinfo-shell {
  --nx-cl-bg: #1a2027;
  --nx-cl-row: rgba(255, 255, 255, 0.04);
  --nx-cl-row-hover: rgba(32, 174, 227, 0.08);
  --nx-cl-br: rgba(255, 255, 255, 0.08);
  --nx-cl-br-hover: rgba(32, 174, 227, 0.28);
  --nx-cl-muted: rgba(236, 241, 243, 0.58);
  --nx-cl-text: #ecf1f3;
  --nx-cl-accent: #20aee3;
}

.nx-product-changelog-shell.card,
.card.nx-product-changelog-shell,
.nx-sysinfo-shell.card,
.card.nx-sysinfo-shell {
  border-radius: var(--nx-cl-radius) !important;
  overflow: hidden;
}

:is(html.midnight:not(.AUR):not(.aur), html[data-bs-theme="midnight"]:not(.AUR), html.app-admin.midnight, html.app-admin[data-bs-theme="midnight"]) .nx-product-changelog-shell.card,
:is(html.midnight:not(.AUR):not(.aur), html[data-bs-theme="midnight"]:not(.AUR), html.app-admin.midnight, html.app-admin[data-bs-theme="midnight"]) .card.nx-product-changelog-shell,
:is(html.midnight:not(.AUR):not(.aur), html[data-bs-theme="midnight"]:not(.AUR), html.app-admin.midnight, html.app-admin[data-bs-theme="midnight"]) .nx-sysinfo-shell.card,
:is(html.midnight:not(.AUR):not(.aur), html[data-bs-theme="midnight"]:not(.AUR), html.app-admin.midnight, html.app-admin[data-bs-theme="midnight"]) .card.nx-sysinfo-shell {
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  background-color: var(--nx-cl-bg) !important;
  background-image: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: 0 8px 28px -12px rgba(0, 0, 0, 0.45) !important;
  color: var(--nx-cl-text);
}

.nx-product-changelog-shell > .card-body,
.nx-product-changelog-wrap.nx-product-changelog-shell,
.nx-sysinfo-shell > .card-body,
.nx-sysinfo-shell:not(.card) {
  padding: 16px 16px 14px !important;
}

:is(html.midnight:not(.AUR):not(.aur), html[data-bs-theme="midnight"]:not(.AUR)) .nx-product-changelog-wrap.nx-product-changelog-shell,
:is(html.midnight:not(.AUR):not(.aur), html[data-bs-theme="midnight"]:not(.AUR)) .nx-sysinfo-shell:not(.card) {
  border-radius: var(--nx-cl-radius);
  border: 1px solid rgba(255, 255, 255, 0.12);
  background-color: #121212;
  box-shadow: 0 8px 28px -12px rgba(0, 0, 0, 0.45);
}

:is(html.AUR.midnight, html.aur.midnight, html[data-bs-theme="aur-midnight"], html[data-bs-theme="AUR midnight"]) .nx-product-changelog-wrap.nx-product-changelog-shell,
:is(html.AUR.midnight, html.aur.midnight, html[data-bs-theme="aur-midnight"], html[data-bs-theme="AUR midnight"]) .nx-sysinfo-shell:not(.card) {
  border-radius: var(--nx-cl-radius);
  border: 1px solid rgba(255, 255, 255, 0.1);
  background-color: #1a2027;
  box-shadow: 0 8px 28px -12px rgba(0, 0, 0, 0.4);
}

.nx-product-changelog-shell .nx-product-changelog__title,
.nx-product-changelog-shell > .card-body > h5,
.nx-sysinfo-shell .nx-sysinfo__title,
.nx-sysinfo-shell > .card-body > h5 {
  margin: 0 0 14px !important;
  font-size: 0.92rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--nx-cl-text);
}

.nx-product-changelog-shell .table-responsive.nx-product-changelog {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: var(--nx-cl-radius-sm);
}

.nx-product-changelog-shell .nx-product-changelog__table {
  border-collapse: separate !important;
  border-spacing: 0 var(--nx-cl-row-gap) !important;
  width: 100%;
  background: transparent !important;
  margin: 0 !important;
  color: var(--nx-cl-text);
}

.nx-product-changelog-shell .nx-product-changelog__table > thead > tr > th {
  padding: 10px 14px 8px !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--nx-cl-muted) !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-bottom: 1px solid var(--nx-cl-br) !important;
  vertical-align: bottom !important;
  white-space: nowrap;
}

.nx-product-changelog-shell .nx-product-changelog__table > tbody > tr > td {
  padding: 16px 14px !important;
  vertical-align: top !important;
  font-size: 0.92rem !important;
  color: var(--nx-cl-text) !important;
  background: var(--nx-cl-row) !important;
  background-color: var(--nx-cl-row) !important;
  border: none !important;
  border-top: 1px solid var(--nx-cl-br) !important;
  border-bottom: 1px solid var(--nx-cl-br) !important;
  box-shadow: none !important;
}

.nx-product-changelog-shell .nx-product-changelog__table > tbody > tr > td:first-child {
  border-left: 1px solid var(--nx-cl-br) !important;
  border-radius: var(--nx-cl-radius-sm) 0 0 var(--nx-cl-radius-sm);
}

.nx-product-changelog-shell .nx-product-changelog__table > tbody > tr > td:last-child {
  border-right: 1px solid var(--nx-cl-br) !important;
  border-radius: 0 var(--nx-cl-radius-sm) var(--nx-cl-radius-sm) 0;
}

.nx-product-changelog-shell .nx-product-changelog__table > tbody > tr:hover > td {
  background: var(--nx-cl-row-hover) !important;
  background-color: var(--nx-cl-row-hover) !important;
  border-color: var(--nx-cl-br-hover) !important;
}

.nx-product-changelog-shell .nx-product-changelog__td--date {
  white-space: nowrap;
  width: 10.5rem;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: var(--nx-cl-muted) !important;
  letter-spacing: 0.01em;
}

.nx-product-changelog-shell .nx-product-changelog__td--date strong {
  font-weight: 600;
  color: inherit;
}

.nx-product-changelog-shell .nx-product-changelog__td--theme {
  white-space: nowrap;
  width: 11.5rem;
}

.nx-product-changelog-shell .nx-product-changelog__td--status {
  width: 11rem;
}

.nx-product-changelog-shell .nx-product-changelog__td--ver {
  white-space: nowrap;
  width: 8rem;
}

.nx-product-changelog-shell .nx-changelog-theme {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  line-height: 1.25;
  color: var(--nx-cl-accent);
  background: rgba(197, 205, 216, 0.1);
  border: 1px solid rgba(197, 205, 216, 0.28);
}

:is(html.default, html[data-bs-theme="default"], html.prestige, html[data-bs-theme="prestige"]) .nx-product-changelog-shell .nx-changelog-theme {
  background: rgba(13, 110, 253, 0.08);
  border-color: rgba(13, 110, 253, 0.18);
}

.nx-product-changelog-shell .nx-changelog-pills {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
}

.nx-product-changelog-shell .nx-changelog-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  padding: 4px 10px 4px 8px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.25;
  white-space: nowrap;
}

.nx-product-changelog-shell .nx-changelog-pill .ph {
  font-size: 14px;
  line-height: 1;
  flex: 0 0 auto;
}

.nx-product-changelog-shell .nx-changelog-pill__text {
  min-width: 0;
}

.nx-product-changelog-shell .nx-changelog-pill--added {
  color: #24d2b5;
  background: rgba(36, 210, 181, 0.12);
  border: 1px solid rgba(36, 210, 181, 0.38);
}

.nx-product-changelog-shell .nx-changelog-pill--improved {
  color: #20aee3;
  background: rgba(32, 174, 227, 0.12);
  border: 1px solid rgba(32, 174, 227, 0.38);
}

.nx-product-changelog-shell .nx-changelog-pill--supplemented {
  color: #7460ee;
  background: rgba(116, 96, 238, 0.14);
  border: 1px solid rgba(116, 96, 238, 0.4);
}

.nx-product-changelog-shell .nx-changelog-pill--fixed {
  color: #ff5c6c;
  background: rgba(255, 92, 108, 0.12);
  border: 1px solid rgba(255, 92, 108, 0.4);
}

.nx-product-changelog-shell .nx-changelog-pill--maintenance {
  color: #c5cdd8;
  background: rgba(197, 205, 216, 0.1);
  border: 1px solid rgba(197, 205, 216, 0.28);
}

:is(html.default, html[data-bs-theme="default"], html.prestige, html[data-bs-theme="prestige"]) .nx-product-changelog-shell .nx-changelog-pill--improved {
  color: #0d6efd;
  background: rgba(13, 110, 253, 0.1);
  border-color: rgba(13, 110, 253, 0.28);
}

:is(html.default, html[data-bs-theme="default"], html.prestige, html[data-bs-theme="prestige"]) .nx-product-changelog-shell .nx-changelog-pill--supplemented {
  color: #6f42c1;
  background: rgba(111, 66, 193, 0.1);
  border-color: rgba(111, 66, 193, 0.28);
}

:is(html.default, html[data-bs-theme="default"], html.prestige, html[data-bs-theme="prestige"]) .nx-product-changelog-shell .nx-changelog-pill--maintenance {
  color: #4b5563;
  background: rgba(107, 114, 128, 0.1);
  border-color: rgba(107, 114, 128, 0.22);
}

.nx-product-changelog-shell .nx-changelog-desc {
  max-width: 46rem;
}

.nx-product-changelog-shell .nx-changelog-desc__p {
  margin: 0 0 0.65em;
  font-size: 0.88rem;
  font-weight: 400;
  line-height: 1.55;
  color: var(--nx-cl-text);
}

.nx-product-changelog-shell .nx-changelog-desc__p:last-child {
  margin-bottom: 0;
}

.nx-product-changelog-shell .nx-changelog-desc__p strong {
  font-weight: 600;
  color: var(--nx-cl-text);
}

.nx-product-changelog-shell .nx-changelog-desc__p code {
  font-size: 0.84em;
  padding: 0.05em 0.35em;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.06);
}

.nx-product-changelog-shell .nx-product-version-mark {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--nx-cl-text);
}

.nx-product-changelog-shell .nx-product-version-mark__icon {
  display: block;
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  border-radius: 4px;
  object-fit: cover;
}

.nx-product-changelog-shell .nx-product-changelog__empty {
  margin: 0;
  font-size: 0.84rem;
  color: var(--nx-cl-muted);
}

/* System information + storage — rails, same tokens as changelog. */
.nx-sysinfo-shell + .nx-sysinfo-shell,
.nx-sysinfo-shell + .nx-product-changelog-wrap,
.nx-sysinfo-shell + .nx-product-changelog-shell,
.nx-product-changelog-shell + .nx-sysinfo-shell,
.card.nx-product-changelog-shell + .card.nx-sysinfo-shell,
#system-info-disc-usage.nx-sysinfo-shell {
  margin-top: 18px;
}

#system-info-disc-usage.nx-sysinfo-shell {
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 16px 16px 14px !important;
}

.nx-sysinfo {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.nx-sysinfo__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 52px;
  padding: 12px 16px;
  border-radius: var(--nx-cl-radius-sm);
  background: var(--nx-cl-row);
  border: 1px solid var(--nx-cl-br);
  color: var(--nx-cl-text);
}

.nx-sysinfo__row:hover {
  background: var(--nx-cl-row-hover);
  border-color: var(--nx-cl-br-hover);
}

.nx-sysinfo__label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  font-size: 0.84rem;
  font-weight: 500;
  color: var(--nx-cl-muted);
  line-height: 1.35;
}

.nx-sysinfo__label .ph {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  font-size: 0.95rem;
  line-height: 1;
  color: var(--nx-cl-accent);
  flex: 0 0 28px;
  background: color-mix(in srgb, var(--nx-cl-accent) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--nx-cl-accent) 22%, transparent);
}

.nx-sysinfo__hint {
  display: inline-flex;
  align-items: center;
  margin-left: 4px;
  color: var(--nx-cl-accent);
  cursor: help;
  opacity: 0.8;
}

.nx-sysinfo__hint .ph {
  font-size: 0.95rem;
}

.nx-sysinfo__value {
  flex: 0 1 auto;
  text-align: right;
  font-size: 0.92rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.01em;
  color: var(--nx-cl-text);
  white-space: nowrap;
}

.nx-sysinfo__row--total {
  background: color-mix(in srgb, var(--nx-cl-accent) 10%, var(--nx-cl-row));
  border-color: color-mix(in srgb, var(--nx-cl-accent) 32%, var(--nx-cl-br));
}

.nx-sysinfo__row--total .nx-sysinfo__label,
.nx-sysinfo__row--total .nx-sysinfo__value {
  color: var(--nx-cl-text);
  font-weight: 600;
}

.nx-sysinfo-shell .nx-product-version-mark {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-weight: 600;
  color: var(--nx-cl-text);
}

.nx-sysinfo-shell .nx-product-version-mark__icon {
  display: block;
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  border-radius: 4px;
  object-fit: cover;
}

.nx-sysinfo-note {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: var(--nx-cl-radius-sm);
  background: color-mix(in srgb, var(--nx-cl-accent) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--nx-cl-accent) 28%, transparent);
  color: var(--nx-cl-text);
}

.nx-sysinfo-note__icon {
  flex: 0 0 auto;
  margin-top: 1px;
  color: var(--nx-cl-accent);
  font-size: 1.15rem;
  line-height: 1;
}

.nx-sysinfo-note__title {
  margin: 0 0 4px;
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--nx-cl-accent);
}

.nx-sysinfo-note__text {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.45;
  color: var(--nx-cl-muted);
}

.nx-sysinfo__actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 14px;
}

.nx-sysinfo-cleanup {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 18px;
  border-radius: 999px;
  border: 1px solid var(--nx-cl-accent);
  background: var(--nx-cl-accent);
  color: #0c0c0c !important;
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.2;
  cursor: pointer;
  box-shadow: none !important;
}

.nx-sysinfo-cleanup .ph {
  font-size: 1rem;
  line-height: 1;
}

.nx-sysinfo-cleanup:hover,
.nx-sysinfo-cleanup:focus {
  filter: brightness(1.06);
  color: #0c0c0c !important;
}

:is(html.default, html[data-bs-theme="default"]) .nx-sysinfo-cleanup {
  color: #fff !important;
}

:is(html.default, html[data-bs-theme="default"]) .nx-sysinfo-cleanup:hover,
:is(html.default, html[data-bs-theme="default"]) .nx-sysinfo-cleanup:focus {
  color: #fff !important;
}

:is(html.default, html[data-bs-theme="default"], html.prestige, html[data-bs-theme="prestige"]) .nx-sysinfo-shell:not(.card),
:is(html.default, html[data-bs-theme="default"], html.prestige, html[data-bs-theme="prestige"]) .nx-product-changelog-wrap.nx-product-changelog-shell {
  border-radius: var(--nx-cl-radius);
  border: 1px solid rgba(0, 0, 0, 0.07);
  background-color: #fff;
  box-shadow: 0 4px 24px -4px rgba(0, 0, 0, 0.08);
}

:is(html.AUR.midnight, html.aur.midnight, html[data-bs-theme="aur-midnight"], html[data-bs-theme="AUR midnight"]) .nx-sysinfo-shell.card,
:is(html.AUR.midnight, html.aur.midnight, html[data-bs-theme="aur-midnight"], html[data-bs-theme="AUR midnight"]) .card.nx-sysinfo-shell,
:is(html.AUR.midnight, html.aur.midnight, html[data-bs-theme="aur-midnight"], html[data-bs-theme="AUR midnight"]) .card.nx-product-changelog-shell {
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  background-color: #1a2027 !important;
  box-shadow: 0 8px 28px -12px rgba(0, 0, 0, 0.4) !important;
  color: var(--nx-cl-text);
}

.nx-sysinfo-shell .loading-placeholder-container {
  color: var(--nx-cl-muted);
  font-weight: 500;
}

@media (max-width: 767px) {
  .nx-sysinfo__row {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    padding: 12px 14px;
  }

  .nx-sysinfo__value {
    text-align: left;
    white-space: normal;
  }
}

/* Phone + tablet (incl. settings with open left rail): stack changelog as cards */
@media (max-width: 1023.98px) {
  .nx-product-changelog-shell .table-responsive.nx-product-changelog,
  .nx-product-changelog-shell .table-responsive.nx-product-changelog.list-table-wrapper {
    overflow: visible !important;
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .nx-product-changelog-shell .nx-product-changelog__table {
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
  }

  .nx-product-changelog-shell .nx-product-changelog__table > thead {
    display: none !important;
    height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    visibility: hidden !important;
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
  }

  .nx-product-changelog-shell .nx-product-changelog__table > thead > tr,
  .nx-product-changelog-shell .nx-product-changelog__table > thead > tr > th {
    display: none !important;
    border: 0 !important;
    padding: 0 !important;
    height: 0 !important;
    background: transparent !important;
  }

  .nx-product-changelog-shell .nx-product-changelog__table > tbody {
    display: block !important;
    width: 100% !important;
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .nx-product-changelog-shell .nx-product-changelog__table > tbody > tr,
  .nx-product-changelog-shell .nx-product-changelog__table > tbody > tr > td {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .nx-product-changelog-shell .nx-product-changelog__table > tbody > tr {
    margin: 0 0 12px !important;
    padding: 12px 14px !important;
    border: 1px solid var(--nx-cl-br) !important;
    border-radius: var(--nx-cl-radius-sm) !important;
    background: var(--nx-cl-row) !important;
    background-color: var(--nx-cl-row) !important;
    overflow: hidden;
    box-shadow: none !important;
  }

  .nx-product-changelog-shell .nx-product-changelog__table > tbody > tr:first-child {
    margin-top: 0 !important;
  }

  .nx-product-changelog-shell .nx-product-changelog__table > tbody > tr:last-child {
    margin-bottom: 0 !important;
  }

  .nx-product-changelog-shell .nx-product-changelog__table > tbody > tr:hover {
    background: var(--nx-cl-row-hover) !important;
    background-color: var(--nx-cl-row-hover) !important;
    border-color: var(--nx-cl-br-hover) !important;
  }

  .nx-product-changelog-shell .nx-product-changelog__table > tbody > tr > td {
    padding: 8px 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    white-space: normal !important;
    width: auto !important;
  }

  .nx-product-changelog-shell .nx-product-changelog__table > tbody > tr > td:first-child,
  .nx-product-changelog-shell .nx-product-changelog__table > tbody > tr > td:last-child {
    border: 0 !important;
    border-radius: 0 !important;
  }

  .nx-product-changelog-shell .nx-product-changelog__table > tbody > tr:hover > td {
    background: transparent !important;
    background-color: transparent !important;
    border-color: transparent !important;
  }

  .nx-product-changelog-shell .nx-product-changelog__table > tbody > tr > td + td {
    border-top: 1px solid var(--nx-cl-br) !important;
    padding-top: 10px !important;
    margin-top: 2px !important;
  }

  .nx-product-changelog-shell .nx-product-changelog__table > tbody > tr > td::before {
    content: attr(data-label);
    display: block !important;
    margin: 0 0 4px !important;
    font-size: 0.68rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--nx-cl-muted) !important;
  }

  .nx-product-changelog-shell .nx-product-changelog__td--date,
  .nx-product-changelog-shell .nx-product-changelog__td--theme,
  .nx-product-changelog-shell .nx-product-changelog__td--status,
  .nx-product-changelog-shell .nx-product-changelog__td--ver {
    width: auto !important;
    white-space: normal !important;
  }

  .nx-product-changelog-shell .nx-changelog-desc {
    max-width: none !important;
  }

  .nx-product-changelog-shell .nx-changelog-pills {
    flex-wrap: wrap;
  }
}