/* v0.7.4.1: resource detail density, site-container alignment and straight-edge visual system. */
.resource-detail-page-body {
  --detail-primary: var(--accent, #d85a2a);
  --detail-bg: var(--paper, #f6f2ea);
  --detail-text: var(--ink, #24221f);
  --detail-muted: var(--muted, #6c675f);
  --detail-line: var(--line, #ddd5c8);
  --detail-card: #fff;
  background: var(--detail-bg);
  color: var(--detail-text);
}

.resource-detail-page-body main:not(.home-main) {
  width: min(calc(100% - 2 * var(--site-gutter, 20px)), var(--site-content-max, 1440px));
  max-width: var(--site-content-max, 1440px);
  padding: 18px 0 56px;
}

.resource-detail-page-body .site-return {
  margin: 0 0 18px;
  color: var(--detail-muted);
  font-size: 1.05rem;
  font-weight: 700;
}

.resource-detail-page-body .site-return:hover,
.resource-detail-page-body .site-return:focus-visible {
  color: var(--detail-primary);
}

.resource-detail-page,
.resource-detail-main,
.resource-detail-sidebar,
.resource-detail-secondary-grid,
.resource-detail-secondary-grid__support {
  min-width: 0;
}

.resource-detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(320px, 26%, 380px);
  gap: clamp(20px, 2vw, 28px);
  align-items: start;
}

.resource-detail-main {
  display: grid;
  gap: 20px;
}

.resource-detail-card {
  min-width: 0;
  padding: clamp(22px, 2.2vw, 30px) clamp(22px, 2.4vw, 34px);
  border: 1px solid var(--detail-line);
  border-radius: 0;
  background: var(--detail-card);
  box-shadow: none;
}

.resource-detail-overview {
  padding-bottom: clamp(24px, 2.4vw, 32px);
}

.resource-detail-overview__head {
  display: flex;
  justify-content: space-between;
  gap: 20px;
}

.resource-detail-overview__copy {
  min-width: 0;
}

.resource-detail-overview h1 {
  margin: 10px 0 12px;
  color: var(--detail-text);
  font-size: clamp(2rem, 3.1vw, 3rem);
  line-height: 1.18;
  overflow-wrap: anywhere;
}

.resource-detail-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.resource-detail-badge {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 4px 12px;
  border: 1px solid transparent;
  border-radius: 0;
  font-weight: 700;
}

.resource-detail-badge--visibility {
  border-color: #b9ddf5;
  background: #eff8ff;
  color: #3178b7;
}

.resource-detail-badge--status {
  border-color: #9ee8c8;
  background: #effcf6;
  color: #16835e;
}

.resource-detail-summary {
  margin: 0;
  color: var(--detail-muted);
  font-size: 1.08rem;
}

.resource-detail-info-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 28px;
  margin: 28px 0 0;
  padding: 14px 20px;
  border: 1px solid var(--detail-line);
  border-radius: 0;
  background: #faf7f1;
}

.resource-detail-info-grid > div {
  display: grid;
  grid-template-columns: 94px minmax(0, 1fr);
  gap: 12px;
  align-items: baseline;
  min-width: 0;
  padding: 9px 0;
}

.resource-detail-info-grid dt {
  color: var(--detail-muted);
  font-weight: 700;
}

.resource-detail-info-grid dd {
  min-width: 0;
  margin: 0;
  color: var(--detail-text);
  overflow-wrap: anywhere;
}

.resource-detail-info-grid__wide {
  grid-column: 1 / -1;
}

.resource-detail-cloud-link dd { display: flex; min-width: 0; align-items: baseline; gap: 10px 14px; }
.resource-detail-cloud-link a { min-width: 0; overflow: hidden; color: var(--accent); text-decoration: underline; text-overflow: ellipsis; white-space: nowrap; }
.resource-detail-cloud-link__code { flex: 0 0 auto; white-space: nowrap; }
.resource-detail-cloud-link__code code { font-size: .9em; }

.resource-detail-card h2 {
  margin: 0 0 16px;
  color: var(--detail-text);
  font-size: 1.28rem;
}

.resource-detail-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.resource-detail-alert {
  border-color: #d6b27a;
  background: #fffaf0;
}

.resource-detail-alert h2 { margin-bottom: 8px; color: #8b5b00; }
.resource-detail-alert p { margin: 0 0 10px; }
.resource-detail-alert a { color: var(--detail-primary); font-weight: 700; }
.resource-detail-alert--error { border-color: #d59a94; background: #fff6f4; }
.resource-detail-alert--error h2 { color: #a92f24; }

.resource-detail-secondary-grid {
  display: grid;
  gap: 20px;
}

.resource-detail-secondary-grid__support {
  display: grid;
  gap: 20px;
  align-content: start;
}

.resource-detail-secondary-grid--history-only .resource-detail-secondary-grid__support {
  display: none;
}

.resource-detail-table-wrap {
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
}

.resource-detail-table {
  width: 100%;
  min-width: 620px;
  border-collapse: collapse;
  color: var(--detail-text);
}

.resource-detail-table th,
.resource-detail-table td {
  padding: 12px 14px;
  border-bottom: 1px solid var(--detail-line);
  text-align: left;
  vertical-align: top;
}

.resource-detail-table th {
  background: #faf7f1;
  color: var(--detail-muted);
  font-weight: 700;
  white-space: nowrap;
}

.resource-detail-table td:first-child,
.resource-detail-table th:first-child { padding-left: 14px; }
.resource-detail-table tr:last-child td { border-bottom: 0; }
.resource-detail-table a { color: #2878c8; font-weight: 700; white-space: nowrap; }
.resource-detail-task-status { color: #3c9769; font-weight: 700; }
.resource-detail-current { color: var(--detail-primary); font-size: .88em; }

.resource-detail-history-scroll {
  max-width: 100%;
  max-height: min(600px, 60vh);
  overflow: auto;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  border: 1px solid var(--detail-line);
}

.resource-detail-history-scroll .resource-detail-table { min-width: 780px; table-layout: fixed; }
.resource-detail-history-scroll thead { position: sticky; z-index: 1; top: 0; }
.resource-detail-history-scroll th,
.resource-detail-history-scroll td { height: 58px; padding: 8px 10px; vertical-align: middle; }
.resource-detail-history-scroll th:nth-child(1) { width: 72px; }
.resource-detail-history-scroll th:nth-child(2) { width: 34%; }
.resource-detail-history-scroll th:nth-child(3) { width: 118px; }
.resource-detail-history-scroll th:nth-child(4) { width: 100px; }
.resource-detail-history-scroll th:nth-child(5) { width: 132px; }
.resource-detail-history-scroll th:nth-child(6) { width: 120px; }
.resource-detail-history-scroll td > small,
.resource-detail-file-name > strong,
.resource-detail-file-name > small { display: block; min-width: 0; }
.resource-detail-file-name > strong,
.resource-detail-file-name > small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.resource-detail-file-name > small,
.resource-detail-history-scroll td > small { color: var(--detail-muted); font-size: .76rem; }
.resource-detail-file-type { display: block; overflow: hidden; font-size: .78rem; font-weight: 800; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.resource-detail-version-row--legacy { background: #faf7f1; }
.resource-detail-history-empty { height: auto !important; padding: 28px !important; color: var(--detail-muted); text-align: center !important; }

.resource-detail-attachment {
  margin-top: 18px;
  padding: 16px;
  border: 1px solid var(--detail-line);
  border-radius: 0;
  background: #fffdfa;
}

.resource-detail-attachment:first-of-type { margin-top: 0; }
.resource-detail-attachment header { display: block; min-height: 0; padding: 0 0 12px; border: 0; background: transparent; }
.resource-detail-attachment h3 { margin: 0 0 4px; color: var(--detail-text); font-size: 1rem; overflow-wrap: anywhere; }
.resource-detail-attachment p { margin: 0; }
.resource-detail-attachment--legacy { background: #faf7f1; }
.resource-detail-revision-list p { margin: 0; padding: 8px 0; border-bottom: 1px solid var(--detail-line); color: var(--detail-muted); }
.resource-detail-revision-list p:last-child { border-bottom: 0; }

.resource-detail-sidebar {
  display: grid;
  gap: 20px;
  position: sticky;
  top: calc(var(--site-header-height, 65px) + 18px);
}

.resource-detail-side-card {
  padding: 22px;
}

.resource-detail-cover {
  position: relative;
  display: grid;
  min-height: 178px;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--detail-line);
  border-radius: 0;
  background: #faf7f1;
  color: var(--detail-muted);
  text-align: center;
}

.resource-detail-cover img {
  display: block;
  width: 100%;
  height: 178px;
  object-fit: contain;
}

.resource-detail-cover span {
  position: absolute;
  inset: auto 0 14px;
  font-size: .82rem;
}

.resource-detail-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 16px;
  padding: 12px 0;
  border: 1px solid var(--detail-line);
  border-radius: 0;
  background: #faf7f1;
  text-align: center;
}

.resource-detail-stats > div + div { border-left: 1px solid var(--detail-line); }
.resource-detail-stats strong { display: block; color: var(--detail-text); font-size: 1.65rem; line-height: 1.2; }
.resource-detail-stats span { display: block; margin-top: 5px; color: var(--detail-muted); font-size: .9rem; }

.resource-detail-actions h2 { margin-bottom: 12px; font-size: 1.05rem; }
.resource-detail-action,
.resource-detail-actions form { width: 100%; }
.resource-detail-action,
.resource-detail-actions .button.resource-detail-action {
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 10px;
  padding: 9px 14px;
  border: 1px solid var(--detail-line);
  border-radius: 0;
  background: #fff;
  color: var(--detail-text);
  font-size: 1rem;
  text-align: center;
}
.resource-detail-action:first-of-type { margin-top: 0; }
.resource-detail-actions .resource-detail-action--primary,
.resource-detail-actions .button.resource-detail-action--primary {
  border-color: var(--detail-primary);
  background: var(--detail-primary);
  color: #fff;
}
.resource-detail-actions .resource-detail-action:hover,
.resource-detail-actions .resource-detail-action:focus-visible {
  border-color: var(--detail-primary);
  background: #f3ede2;
  color: #a63c1c;
  box-shadow: inset 3px 0 var(--detail-primary);
}
.resource-detail-actions .resource-detail-action--primary:hover,
.resource-detail-actions .resource-detail-action--primary:focus-visible {
  background: #c84f22;
  color: #fff;
}
.resource-detail-actions--danger h2 { color: #a92f24; }
.resource-detail-actions--danger .resource-detail-action { border-color: #d59a94; color: #a92f24; }
.resource-detail-actions--danger .resource-detail-action:hover,
.resource-detail-actions--danger .resource-detail-action:focus-visible {
  border-color: #a92f24;
  background: #fff6f4;
  color: #8f261d;
}

@media (min-width: 1200px) {
  .resource-detail-info-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0 24px;
  }

  .resource-detail-info-grid > div {
    display: block;
  }

  .resource-detail-info-grid > div dt {
    margin-bottom: 4px;
  }

  .resource-detail-info-grid__wide {
    display: grid !important;
    grid-template-columns: 94px minmax(0, 1fr);
  }

  .resource-detail-secondary-grid {
    grid-template-columns: minmax(260px, .82fr) minmax(0, 1.18fr);
    align-items: stretch;
  }

  .resource-detail-secondary-grid--history-only {
    grid-template-columns: 1fr;
  }

  .resource-detail-card--history {
    height: 100%;
  }

  .resource-detail-card--processing .resource-detail-table {
    min-width: 100%;
    table-layout: fixed;
  }

  .resource-detail-card--processing .resource-detail-table th,
  .resource-detail-card--processing .resource-detail-table td {
    padding-inline: 8px;
    overflow-wrap: anywhere;
  }

  .resource-detail-card--processing .resource-detail-table th {
    white-space: normal;
    font-size: .84rem;
    line-height: 1.25;
  }

  .resource-detail-card--processing .resource-detail-table th:nth-child(1),
  .resource-detail-card--processing .resource-detail-table td:nth-child(1) { width: 34%; }
  .resource-detail-card--processing .resource-detail-table th:nth-child(2),
  .resource-detail-card--processing .resource-detail-table td:nth-child(2) { width: 18%; }
  .resource-detail-card--processing .resource-detail-table th:nth-child(3),
  .resource-detail-card--processing .resource-detail-table td:nth-child(3) { width: 16%; }
  .resource-detail-card--processing .resource-detail-table th:nth-child(4),
  .resource-detail-card--processing .resource-detail-table td:nth-child(4) { width: 32%; }
}

@media (max-width: 1199px) {
  .resource-detail-layout {
    grid-template-columns: minmax(0, 1fr) 320px;
  }

  .resource-detail-card { padding-inline: 24px; }
  .resource-detail-side-card { padding-inline: 18px; }
  .resource-detail-info-grid { gap: 0 18px; padding-inline: 18px; }
  .resource-detail-info-grid > div { grid-template-columns: 86px minmax(0, 1fr); gap: 8px; }
}

@media (max-width: 900px) {
  .resource-detail-layout { grid-template-columns: minmax(0, 1fr) 280px; gap: 18px; }
}

@media (max-width: 760px) {
  .resource-detail-cloud-link dd { align-items: stretch; flex-direction: column; }
  .resource-detail-cloud-link a { width: 100%; }
  .resource-detail-page-body main:not(.home-main) {
    width: auto;
    margin-inline: 20px;
    padding-top: 14px;
  }

  .resource-detail-page-body .site-return { margin-bottom: 14px !important; }
  .resource-detail-layout { grid-template-columns: 1fr; }
  .resource-detail-sidebar { position: static; }
  .resource-detail-overview h1 { font-size: clamp(1.8rem, 8vw, 2.35rem); }
  .resource-detail-info-grid { grid-template-columns: 1fr; margin-top: 22px; }
  .resource-detail-info-grid__wide { grid-column: auto; }
  .resource-detail-section-head { align-items: flex-start; flex-direction: column; }
  .resource-detail-card { padding: 22px 18px; }
  .resource-detail-side-card { padding: 18px; }
  .resource-detail-cover,
  .resource-detail-cover img { height: 150px; min-height: 150px; }
  .resource-detail-table { min-width: 590px; }
}

@media (max-width: 420px) {
  .resource-detail-page-body main:not(.home-main) { margin-inline: 12px; }
  .resource-detail-info-grid { padding-inline: 14px; }
  .resource-detail-info-grid > div { grid-template-columns: 1fr; gap: 3px; }
  .resource-detail-table { min-width: 540px; }
}