.quality-strip { margin: 9px 0; padding: 10px 12px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); font-size: 12px; }
.quality-strip-main { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 10px; }
.quality-strip-label { color: var(--muted); white-space: nowrap; font-size: 11px; }
.quality-strip-score { text-align: center; white-space: nowrap; }
.quality-strip-score strong { color: var(--ink); font-weight: 750; }
.quality-strip-score .quality-grade-expired, .quality-grade-expired { color: var(--muted); }
.quality-strip .quality-action { justify-self: end; min-height: 32px; height: 32px; padding: 0 9px; font-size: 11px; white-space: nowrap; }
.quality-credential-main { grid-template-columns: auto minmax(0, 1fr) auto auto; gap: 12px; }
.quality-credential-main .quality-strip-score { text-align: left; }
.quality-score-heading { color: var(--ink); font-size: 13px; font-weight: 750; line-height: 1.3; }
.quality-strip-admin .quality-score-heading { font-weight: 700; }
.quality-strip-time { text-align: center; color: var(--muted); font-size: 11px; white-space: nowrap; }
.quality-strip-validity { color: var(--muted); font-size: 11px; white-space: nowrap; }
.quality-emphasis, .quality-strip-score strong.quality-emphasis, .credential-fact-grid strong.quality-emphasis { color: var(--ink); font-weight: 750; }
.credential-fact-grid strong.quality-status-disabled { color: var(--muted); font-weight: 400; }
.quality-list-summary { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.quality-list-grade { font-size: 12px; }
.quality-validity-tag { display: inline-block; border: 1px solid var(--line); border-radius: 4px; padding: 1px 5px; color: var(--muted); background: var(--surface-soft, #f5f7f9); font-size: 10px; font-weight: 500; line-height: 16px; font-variant-numeric: tabular-nums; }
.quality-operation-message { margin-top: 8px; color: var(--danger, #b94b4b); font-size: 11px; overflow-wrap: anywhere; }
.quality-result-line { display: flex; align-items: baseline; flex-wrap: wrap; gap: 5px; margin-top: 9px; padding-top: 8px; border-top: 1px solid var(--line); font-size: 11px; }
.quality-result-details { flex-basis: 100%; }
.quality-result-details > summary { width: fit-content; color: var(--muted); cursor: pointer; }
.quality-result-details dl { display: grid; gap: 6px; margin: 9px 0 0; }
.quality-result-details dl > div { display: grid; grid-template-columns: 78px minmax(0, 1fr); gap: 8px; }
.quality-result-details dt { color: var(--muted); }
.quality-result-details dd { margin: 0; overflow-wrap: anywhere; }
.quality-result-details:not([open]) { flex-basis: auto; margin-left: auto; }
.quality-history-panel { flex: 1; min-width: 0; min-height: 0; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); overflow: hidden; }
.quality-history-toolbar { display: flex; flex: none; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 12px; border-bottom: 1px solid var(--line); }
.quality-history-toolbar > span { color: var(--muted); font-size: 11px; }
.quality-history-scroll { min-height: 0; flex: 1; overflow: auto; }
.quality-history-table { width: 100%; min-width: 472px; table-layout: fixed; border-spacing: 0; font-size: 11px; }
.quality-history-table .quality-col-time { width: 132px; }
.quality-history-table .quality-col-result { width: 48px; }
.quality-history-table .quality-col-validity { width: 60px; }
.quality-history-table .quality-col-duration { width: 64px; }
.quality-history-table .quality-col-version { width: 44px; }
.quality-history-table.quality-history-admin { min-width: 580px; }
.quality-history-table th, .quality-history-table td { padding: 8px 6px; text-align: center; vertical-align: middle; border-bottom: 1px solid var(--line); white-space: nowrap; }
.quality-history-table th { position: sticky; z-index: 1; top: 0; background: var(--surface-soft, #f5f7f9); color: var(--muted); font-weight: 650; white-space: nowrap; }
.quality-history-table td { line-height: 1.65; }
.quality-history-table .quality-history-left { text-align: left; }
.quality-record-copy { display: block; position: relative; width: 100%; min-width: 0; max-width: 100%; min-height: 0; height: auto; padding: 0; border: 0; background: none; color: var(--muted); font: inherit; line-height: inherit; cursor: pointer; text-align: left; }
.quality-record-copy:hover:not(:disabled) { color: var(--ink); background: none; }
.quality-record-copy code { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.quality-copy-confirm { display: none; position: absolute; left: 0; top: 0; color: var(--accent, var(--green-700, #218452)); font-size: 15px; line-height: inherit; }
.quality-copy-success code { visibility: hidden; }
.quality-copy-success .quality-copy-confirm { display: block; }
.quality-history-pagination { display: flex; flex: none; justify-content: space-between; align-items: center; gap: 10px; padding: 9px 12px; font-size: 11px; border-top: 1px solid var(--line); }
.quality-history-pagination > div { display: flex; align-items: center; gap: 8px; }
.quality-history-pagination button, .quality-history-toolbar button { min-height: 29px; height: 29px; padding: 0 8px; font-size: 11px; }
.quality-history-empty { padding: 32px 16px; text-align: center; color: var(--muted); font-size: 12px; }
@media (max-width: 480px) {
  .quality-strip { padding: 9px 8px; }
  .quality-strip-main { gap: 6px; grid-template-columns: auto minmax(0, 1fr) auto; }
  .quality-strip-label, .quality-strip-score, .quality-strip .quality-action { font-size: 10px; }
  .quality-strip .quality-action { padding: 0 6px; }
  .quality-strip .quality-credential-main { grid-template-columns: minmax(0, 1fr) auto auto; gap: 5px 10px; }
  .quality-credential-main .quality-strip-score { grid-column: 1 / 3; grid-row: 1; font-size: 12px; }
  .quality-credential-main .quality-action { grid-column: 3; grid-row: 1 / 3; }
  .quality-credential-main .quality-strip-time { grid-column: 1; grid-row: 2; justify-self: start; font-size: 10px; }
  .quality-credential-main .quality-strip-validity { grid-column: 2; grid-row: 2; font-size: 10px; }
  .quality-history-pagination { padding: 8px; gap: 6px; }
  .quality-history-pagination > div { gap: 5px; }
}

/* Keep the configuration, toolbar and pager outside the scrolling list. */
.view-content.quality-content {
  min-height: 0;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
}
.quality-settings-form {
  padding: 12px;
  margin-bottom: 9px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 9px;
}
.quality-config-grid { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 12px; }
.quality-config-grid .field { flex: 0 0 120px; }
.quality-config-grid .quality-model-field { flex-basis: 170px; }
.quality-config-grid .quality-auto-field { flex-basis: 90px; }
.quality-config-grid input { height: 35px; }
.quality-auto-control { height: 35px; display: flex; align-items: center; }
.quality-save-button { min-height: 35px; height: 35px; margin-left: auto; white-space: nowrap; }
.quality-save-message { margin-top: 8px; font-size: 11px; color: var(--muted); overflow-wrap: anywhere; }
.quality-toolbar { flex-direction: row; }
.quality-toolbar select { width: 142px; max-width: 100%; }
.quality-filters { display: flex; flex-wrap: wrap; gap: 8px; min-width: 0; }
.quality-filters select[data-quality-filter="status"] { width: 180px; }
.quality-toolbar .list-toolbar-actions { width: auto; margin-left: auto; }
.quality-records-table { min-width: 1980px; }
.quality-records-table col:nth-child(1) { width: 180px; }
.quality-records-table col:nth-child(2) { width: 260px; }
.quality-records-table col:nth-child(3) { width: 190px; }
.quality-records-table col:nth-child(4) { width: 120px; }
.quality-records-table col:nth-child(5) { width: 175px; }
.quality-records-table col:nth-child(6) { width: 60px; }
.quality-records-table col:nth-child(7) { width: 110px; }
.quality-records-table col:nth-child(8) { width: 100px; }
.quality-records-table col:nth-child(9) { width: 190px; }
.quality-records-table col:nth-child(10) { width: 85px; }
.quality-records-table col:nth-child(11) { width: 280px; }
.quality-records-table col:nth-child(12) { width: 230px; }
.quality-grade-expired { color: var(--muted); }
.quality-pagination { flex-wrap: wrap; gap: 6px 16px; }
.quality-pagination > div { flex-wrap: wrap; justify-content: flex-end; margin-left: auto; }
.quality-page-size select { width: 100px; height: 30px; padding: 0 8px; font-size: 11px; }
@media (max-width: 720px) {
  .quality-settings-form { max-height: min(250px, 35dvh); overflow: auto; padding: 10px; }
  .quality-config-grid { gap: 10px; }
  .quality-config-grid .field { flex-basis: calc((100% - 10px) / 2); }
  .quality-config-grid .quality-model-field { flex-basis: calc((100% - 10px) / 2); }
  .quality-config-grid .quality-auto-field { flex-basis: calc((100% - 10px) / 2); }
  .quality-records-table { min-width: 0; }
  .quality-filters { flex: 1; }
  .quality-filters select { flex: 1 1 calc((100% - 8px) / 2); min-width: 0; width: 0; }
  .quality-filters select[data-quality-filter="status"] { flex-basis: 100%; width: 100%; }
  .quality-pagination > div { gap: 6px; }
}

/* Keep only the history table body scrolling inside this detail tab. */
#credential-detail-panel:has(#credential-quality-panel:not([hidden])) { display: flex; flex-direction: column; overflow: hidden; }
#credential-detail-panel:has(#credential-quality-panel:not([hidden])) > .drawer-header,
#credential-detail-panel:has(#credential-quality-panel:not([hidden])) > .detail-tabs,
#credential-detail-panel:has(#credential-quality-panel:not([hidden])) > .inline-status { flex-shrink: 0; }
#credential-quality-panel:not([hidden]), #credential-quality-history { display: flex; flex: 1; min-width: 0; min-height: 0; overflow: hidden; }