/**
 * Hamed Academic Dashboard 5.0.40
 * Late, record-agnostic layout repairs requested after the production review.
 */

/* Keep the established screen transition while removing avoidable perceived
   navigation delay after the server/cache repair. */
body.had-theme .had-screen {
  animation-duration: .18s !important;
}

/* --------------------------------------------------------------------------
 * 1. Research projects: card geometry must never depend on record count.
 * ----------------------------------------------------------------------- */
.had-research-v502 .had-project-grid > .had-project-card:only-child {
  grid-column: auto !important;
}

.had-research-v502 .had-project-card,
.had-research-v502 .had-project-card:nth-child(n),
.had-research-v502 .had-project-grid > .had-project-card:only-child {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 326px !important;
  align-self: stretch !important;
}

.had-research-v502 .had-project-card-image,
.had-research-v502 .had-project-group-completed .had-project-card-image,
.had-research-v502 .had-project-grid > .had-project-card:only-child .had-project-card-image {
  width: calc(100% + 28px) !important;
  height: 152px !important;
  min-height: 152px !important;
  flex: 0 0 152px !important;
  margin: -14px -14px 11px !important;
}

.had-research-v502 .had-project-card h3,
.had-research-v502 .had-project-grid > .had-project-card:only-child h3 {
  min-height: 0 !important;
  max-height: none !important;
  font-size: 16.5px !important;
  line-height: 1.26 !important;
  -webkit-line-clamp: 3 !important;
}

.had-research-v502 .had-project-card > p,
.had-research-v502 .had-project-grid > .had-project-card:only-child > p {
  max-width: none !important;
  font-size: 10.5px !important;
  line-height: 1.48 !important;
  -webkit-line-clamp: 3 !important;
}

.had-v5040-project-placeholder {
  background:
    radial-gradient(circle at 78% 34%, rgba(34, 211, 238, .22), transparent 18%),
    repeating-linear-gradient(132deg, transparent 0 38px, rgba(12, 123, 145, .14) 39px 40px),
    linear-gradient(135deg, #eef9fb, #d9edf1) !important;
}
.had-v5040-project-placeholder::after {
  content: "RESEARCH PROJECT" !important;
  z-index: 3 !important;
  inset: auto auto 16px 18px !important;
  color: #08798a !important;
  background: none !important;
  box-shadow: none !important;
  font: 700 10px/1 ui-monospace, SFMono-Regular, Consolas, monospace !important;
  letter-spacing: .14em !important;
}

/* --------------------------------------------------------------------------
 * 2. Popup media: size the white board from each image's own aspect ratio.
 *    No title-specific rules are required, so newly added records inherit it.
 * ----------------------------------------------------------------------- */
.had-detail-drawer:not(.is-blog-summary) .had-record-cover.has-record-image.had-v5040-intrinsic-stage {
  position: sticky !important;
  top: 0 !important;
  align-self: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: min(62vh, 590px) !important;
  aspect-ratio: var(--had-v5040-image-ratio, 3 / 4) !important;
  margin: 0 !important;
  padding: 10px !important;
  overflow: hidden !important;
  border: 1px solid #bfd4da !important;
  border-radius: 2px !important;
  background: #fff !important;
  box-shadow: 0 18px 38px rgba(0, 31, 48, .16) !important;
}

.had-detail-drawer:not(.is-blog-summary) .had-record-cover.has-record-image.had-v5040-intrinsic-stage::before,
.had-detail-drawer:not(.is-blog-summary) .had-record-cover.has-record-image.had-v5040-intrinsic-stage::after,
.had-detail-drawer:not(.is-blog-summary) .had-record-cover.has-record-image.had-v5040-intrinsic-stage > i,
.had-detail-drawer:not(.is-blog-summary) .had-record-cover.has-record-image.had-v5040-intrinsic-stage > .had-media-motion {
  display: none !important;
}

.had-detail-drawer:not(.is-blog-summary) .had-record-cover.has-record-image.had-v5040-intrinsic-stage > img,
.had-detail-drawer:not(.is-blog-summary) .had-record-cover.has-record-image.had-v5040-intrinsic-stage.is-portrait > img,
.had-detail-drawer:not(.is-blog-summary) .had-record-cover.has-record-image.had-v5040-intrinsic-stage.is-landscape > img,
.had-detail-drawer:not(.is-blog-summary) .had-record-cover.has-record-image.had-v5040-intrinsic-stage.is-square > img {
  position: relative !important;
  inset: auto !important;
  z-index: 2 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: #fff !important;
  filter: none !important;
  transform: none !important;
}

/* Avoid a tiny stage for unusually panoramic uploads while retaining the full
   image via object-fit. */
.had-detail-drawer:not(.is-blog-summary) .had-record-cover.has-record-image.had-v5040-intrinsic-stage.is-landscape {
  min-height: 190px !important;
}

/* --------------------------------------------------------------------------
 * 3. Credentials: balanced desktop split and a complete, compact certificate.
 * ----------------------------------------------------------------------- */
@media (min-width: 901px) {
  .had-credentials-v3 .had-credential-layout {
    grid-template-columns: minmax(0, 1.14fr) minmax(330px, .86fr) !important;
    gap: 10px !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    align-items: stretch !important;
  }

  .had-credentials-v3 .had-credential-detail {
    grid-column: 1 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: clamp(14px, 1.35vw, 22px) !important;
    justify-content: flex-start !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  .had-credentials-v3 .had-credential-list {
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    min-height: 0 !important;
  }

  .had-credentials-v3 .had-credential-detail h2,
  .had-credentials-v3 [data-had-credential-title] {
    margin: 7px 0 3px !important;
    font-size: clamp(21px, 1.55vw, 29px) !important;
    line-height: 1.1 !important;
  }

  .had-credentials-v3 [data-had-credential-issuer] {
    margin: 0 !important;
    font-size: 11px !important;
    line-height: 1.3 !important;
  }

  .had-credentials-v3 .had-credential-certificate {
    width: 100% !important;
    height: clamp(160px, 23vh, 225px) !important;
    min-height: 150px !important;
    max-height: 225px !important;
    margin: 8px 0 !important;
    padding: 9px !important;
    flex: 0 0 auto !important;
  }

  .had-credentials-v3 .had-credential-certificate::before {
    inset: 6px !important;
  }

  .had-credentials-v3 .had-credential-certificate .had-credential-image,
  .had-credentials-v3 .had-credential-certificate.is-portrait .had-credential-image,
  .had-credentials-v3 .had-credential-certificate.is-landscape .had-credential-image,
  .had-credentials-v3 .had-credential-certificate.is-square .had-credential-image {
    position: relative !important;
    inset: auto !important;
    z-index: 2 !important;
    width: calc(100% - 8px) !important;
    height: calc(100% - 8px) !important;
    max-width: calc(100% - 8px) !important;
    max-height: calc(100% - 8px) !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain !important;
    object-position: center center !important;
    background: #fff !important;
    filter: none !important;
    transform: none !important;
  }

  .had-credentials-v3 .had-credential-meta {
    width: 100% !important;
    margin: 0 0 7px !important;
  }
  .had-credentials-v3 .had-credential-meta span { padding: 7px 9px !important; }
  .had-credentials-v3 .had-credential-meta b { font-size: 14px !important; }

  .had-credentials-v3 .had-credential-summary {
    margin: 0 0 7px !important;
    font-size: 11px !important;
    line-height: 1.42 !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 4 !important;
    overflow: hidden !important;
  }

  .had-credentials-v3 .had-skill-grid { gap: 4px !important; }
  .had-credentials-v3 .had-skill-grid span {
    padding: 4px 6px !important;
    font-size: 8.5px !important;
    line-height: 1.2 !important;
  }
  .had-credentials-v3 .had-credential-actions {
    margin-top: 7px !important;
    gap: 6px !important;
  }
  .had-credentials-v3 .had-credential-actions a {
    min-height: 32px !important;
    padding: 7px 9px !important;
    font-size: 8.5px !important;
  }

  .had-credential-list .had-credential-scroll > button {
    min-height: 64px !important;
    padding: 8px 10px !important;
  }
}

/* --------------------------------------------------------------------------
 * 4. Annual charts: keep both axes inside the visible chart frame.
 * ----------------------------------------------------------------------- */
:is(
  [data-had-collection-type="journal-papers"],
  [data-had-collection-type="book"],
  [data-had-collection-type="theses"],
  [data-had-collection-type="persian-articles"],
  [data-had-collection-type="conference-presentations"],
  [data-had-collection-type="editorial-referee"],
  [data-had-collection-type="media"],
  [data-had-collection-type="pedagogical-training"],
  [data-had-collection-type="teaching-experience"]
) .had-year-trend {
  width: 100% !important;
  height: 100% !important;
  min-height: 150px !important;
  padding: 2px 4px 8px !important;
  overflow: visible !important;
}

:is(
  [data-had-collection-type="journal-papers"],
  [data-had-collection-type="book"],
  [data-had-collection-type="theses"],
  [data-had-collection-type="persian-articles"],
  [data-had-collection-type="conference-presentations"],
  [data-had-collection-type="editorial-referee"],
  [data-had-collection-type="media"],
  [data-had-collection-type="pedagogical-training"],
  [data-had-collection-type="teaching-experience"]
) .had-year-trend-svg {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 150px !important;
  overflow: visible !important;
}

.had-year-trend-axis-value,
.had-year-trend-year {
  fill: #92b7c2 !important;
  opacity: 1 !important;
  visibility: visible !important;
  font-size: 10px !important;
  font-weight: 650 !important;
}
.had-year-trend-axis-value { text-anchor: end; }
.had-year-trend-year { text-anchor: middle; }
.had-year-trend-value {
  fill: #f9d77d !important;
  opacity: 1 !important;
  visibility: visible !important;
  font-size: 11px !important;
  font-weight: 750 !important;
}

@media (min-width: 901px) {
  :is(
    [data-had-collection-type="journal-papers"],
    [data-had-collection-type="book"],
    [data-had-collection-type="theses"],
    [data-had-collection-type="persian-articles"],
    [data-had-collection-type="conference-presentations"],
    [data-had-collection-type="editorial-referee"],
    [data-had-collection-type="media"],
    [data-had-collection-type="teaching-experience"]
  ) .had-analytics-grid {
    grid-template-rows: minmax(132px, .74fr) minmax(180px, 1fr) !important;
  }

  :is(
    .had-journal-trend-panel,
    .had-book-trend-panel,
    .had-thesis-trend-panel,
    .had-persian-trend-panel,
    .had-presentation-trend-panel,
    .had-editorial-trend-panel,
    .had-media-trend-panel,
    .had-teaching-trend-panel
  ) {
    min-height: 180px !important;
    height: 100% !important;
    max-height: none !important;
    overflow: hidden !important;
    padding-bottom: 11px !important;
  }

  :is(
    .had-journal-trend-panel,
    .had-book-trend-panel,
    .had-thesis-trend-panel,
    .had-persian-trend-panel,
    .had-presentation-trend-panel,
    .had-editorial-trend-panel,
    .had-media-trend-panel,
    .had-teaching-trend-panel
  ) > div:not(.had-analytics-title) {
    height: calc(100% - 38px) !important;
    min-height: 145px !important;
    max-height: none !important;
    overflow: visible !important;
  }
}

/* --------------------------------------------------------------------------
 * 5. Pedagogical Training: two summaries above one full-width annual trend.
 * ----------------------------------------------------------------------- */
[data-had-collection-type="pedagogical-training"] .had-pedagogy-volume {
  display: none !important;
}

[data-had-collection-type="pedagogical-training"] .had-analytics-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-template-rows: minmax(145px, .8fr) minmax(190px, 1.2fr) !important;
  gap: 8px !important;
}

[data-had-collection-type="pedagogical-training"] .had-pedagogy-trend-panel {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  min-height: 190px !important;
  height: 100% !important;
  overflow: hidden !important;
  padding-bottom: 11px !important;
}

[data-had-collection-type="pedagogical-training"] .had-pedagogy-trend-panel > [data-had-pedagogy-analytics-body="years"] {
  height: calc(100% - 38px) !important;
  min-height: 155px !important;
  overflow: visible !important;
}

/* --------------------------------------------------------------------------
 * 6. Reusable chart enlargement control and modal (no external-profile CTA).
 * ----------------------------------------------------------------------- */
.had-analytics-title > em { margin-left: auto; }

.had-v5040-chart-enlarge {
  position: relative;
  z-index: 4;
  min-height: 27px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 7px;
  border: 1px solid #286176;
  border-radius: 3px;
  background: #082333;
  color: #8be8ef !important;
  font: 700 8px/1 ui-monospace, SFMono-Regular, Consolas, monospace !important;
  letter-spacing: .04em;
  white-space: nowrap;
}
.had-v5040-chart-enlarge:hover,
.had-v5040-chart-enlarge:focus-visible {
  border-color: #26d7e8;
  background: #0a3545;
  color: #fff !important;
}
.had-v5040-chart-enlarge > i {
  font: normal 15px/1 system-ui, sans-serif;
}

.had-v5040-chart-modal[hidden] { display: none !important; }
.had-v5040-chart-modal {
  position: fixed;
  z-index: 220000;
  inset: 0;
  display: grid;
  place-items: center;
  padding: clamp(14px, 3vw, 46px);
}
.had-v5040-chart-scrim {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(0, 7, 12, .84);
  backdrop-filter: blur(6px);
}
.had-v5040-chart-dialog {
  position: relative;
  z-index: 1;
  width: min(1120px, 94vw);
  max-height: min(820px, 90vh);
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  border: 1px solid #1d6378;
  border-radius: 9px;
  background: #041722;
  color: #eaf6f8;
  box-shadow: 0 35px 90px rgba(0, 0, 0, .56);
}
.had-v5040-chart-dialog > header {
  min-height: 84px;
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 17px 20px;
  border-bottom: 1px solid #1b4e61;
  background: linear-gradient(135deg, #062939, #075b63);
}
.had-v5040-chart-dialog > header > div { min-width: 0; }
.had-v5040-chart-dialog > header small {
  display: block;
  color: #64dce8;
  font: 700 9px/1 ui-monospace, SFMono-Regular, Consolas, monospace;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.had-v5040-chart-dialog h2 {
  margin: 7px 0 0;
  color: #fff;
  font-size: clamp(20px, 2vw, 32px);
  line-height: 1.12;
}
.had-v5040-chart-close {
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  margin-left: auto;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .35);
  border-radius: 4px;
  background: rgba(2, 22, 31, .48);
  color: #fff !important;
  font-size: 24px !important;
  line-height: 1 !important;
}
.had-v5040-chart-body {
  min-height: 0;
  overflow: auto;
  padding: clamp(14px, 2.2vw, 26px);
}
.had-v5040-chart-body .had-v5040-modal-panel {
  width: 100%;
  min-height: min(590px, 66vh) !important;
  height: auto !important;
  max-height: none !important;
  display: block !important;
  padding: 18px !important;
  overflow: visible !important;
  border: 1px solid #1d5368;
  background: rgba(4, 24, 36, .96);
}
.had-v5040-chart-body .had-v5040-modal-panel::after { display: none !important; }
.had-v5040-chart-body .had-v5040-modal-panel > .had-analytics-title { display: none !important; }
.had-v5040-chart-body .had-year-trend,
.had-v5040-chart-body [data-had-pedagogy-analytics-body="years"],
.had-v5040-chart-body [data-had-editorial-analytics-body="years"],
.had-v5040-chart-body [data-had-journal-analytics-body="years"],
.had-v5040-chart-body [data-had-book-analytics-body="years"],
.had-v5040-chart-body [data-had-thesis-analytics-body="years"],
.had-v5040-chart-body [data-had-persian-analytics-body="years"],
.had-v5040-chart-body [data-had-presentation-analytics-body="years"],
.had-v5040-chart-body [data-had-media-analytics-body="years"],
.had-v5040-chart-body [data-had-teaching-analytics-body="years"] {
  width: 100% !important;
  height: min(580px, 62vh) !important;
  min-height: 360px !important;
  max-height: none !important;
  overflow: visible !important;
}
.had-v5040-chart-body .had-year-trend-svg {
  width: 100% !important;
  height: 100% !important;
  min-height: 360px !important;
  overflow: visible !important;
}
.had-v5040-chart-body .had-advanced-year-bars,
.had-v5040-chart-body .had-funding-trend {
  width: 100% !important;
  height: min(540px, 58vh) !important;
  min-height: 360px !important;
  max-height: none !important;
  overflow: visible !important;
}
.had-v5040-chart-body .had-funding-chart {
  display: grid !important;
  grid-template-columns: minmax(180px, .28fr) minmax(0, 1fr) !important;
  gap: 18px !important;
}

html.had-v5040-chart-open { overflow: hidden !important; }

@media (max-width: 1180px) and (min-width: 901px) {
  .had-research-v502 .had-project-card h3,
  .had-research-v502 .had-project-grid > .had-project-card:only-child h3 {
    font-size: 15.5px !important;
  }
}

@media (max-width: 900px) {
  .had-research-v502 .had-project-grid > .had-project-card:only-child {
    grid-column: auto !important;
  }
  .had-research-v502 .had-project-card,
  .had-research-v502 .had-project-card:nth-child(n),
  .had-research-v502 .had-project-grid > .had-project-card:only-child {
    min-height: 0 !important;
  }
  .had-research-v502 .had-project-card-image,
  .had-research-v502 .had-project-group-completed .had-project-card-image,
  .had-research-v502 .had-project-grid > .had-project-card:only-child .had-project-card-image {
    height: 176px !important;
    min-height: 176px !important;
    flex-basis: 176px !important;
  }
  .had-detail-drawer:not(.is-blog-summary) .had-record-cover.has-record-image.had-v5040-intrinsic-stage {
    position: relative !important;
    width: min(100%, 560px) !important;
    max-height: none !important;
    margin: 0 auto 22px !important;
  }
  [data-had-collection-type="pedagogical-training"] .had-analytics-grid {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto !important;
  }
  [data-had-collection-type="pedagogical-training"] .had-pedagogy-trend-panel {
    grid-column: 1 !important;
    grid-row: auto !important;
  }
  .had-v5040-chart-enlarge > span { display: none; }
  .had-v5040-chart-body .had-v5040-modal-panel { min-height: 430px !important; }
  .had-v5040-chart-body .had-year-trend,
  .had-v5040-chart-body .had-year-trend-svg { min-height: 300px !important; }
}

@media (max-width: 560px) {
  .had-research-v502 .had-project-card-image,
  .had-research-v502 .had-project-group-completed .had-project-card-image,
  .had-research-v502 .had-project-grid > .had-project-card:only-child .had-project-card-image {
    width: calc(100% + 24px) !important;
    height: 154px !important;
    min-height: 154px !important;
    flex-basis: 154px !important;
    margin: -12px -12px 10px !important;
  }
  .had-research-v502 .had-project-card h3,
  .had-research-v502 .had-project-grid > .had-project-card:only-child h3 {
    font-size: 16px !important;
  }
  .had-v5040-chart-modal { padding: 0; }
  .had-v5040-chart-dialog {
    width: 100vw;
    height: 100dvh;
    max-height: none;
    border-radius: 0;
  }
  .had-v5040-chart-dialog > header { padding: 14px 16px; }
  .had-v5040-chart-body { padding: 10px; }
  .had-v5040-chart-body .had-v5040-modal-panel { min-height: 390px !important; padding: 10px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .had-v5040-chart-modal *,
  .had-v5040-chart-enlarge { animation: none !important; transition: none !important; }
}
