/*
 * PE-Class assessment screen regression guard v11673
 *
 * This file owns only:
 *  - assessment configuration card flow on desktop/iPad,
 *  - generated grade-cell visibility,
 *  - Fold-wide assessment row baselines,
 *  - the confirmed iPad side-tree spacing rhythm.
 */

@media (min-width: 769px) {
  html:not(.pe87FoldWide) #assessConfigCards > .assessCards.premiumAssessmentCards {
    display: grid !important;
    grid-template-columns: repeat(var(--assessment-count, 1), minmax(0, 1fr)) !important;
    grid-auto-flow: column !important;
    align-items: stretch !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  html:not(.pe87FoldWide) #assessTableBox .premiumAssessmentGradeHead,
  html:not(.pe87FoldWide) #assessTableBox .premiumAssessmentGradeCell {
    visibility: visible !important;
    opacity: 1 !important;
  }

  html:not(.pe87FoldWide) #assessTableBox .premiumAssessmentGradeCell {
    display: table-cell !important;
    vertical-align: middle !important;
    text-align: center !important;
  }

  html:not(.pe87FoldWide) #assessTableBox .premiumAssessmentGradeCell > .premiumAssessmentGrade {
    display: inline-grid !important;
  }
}

@media (min-width: 769px) and (max-width: 1200px) {
  html.pe87FoldWide #assessTableBox .foldAssessmentPremiumTable tbody > tr {
    align-items: stretch !important;
    min-height: 112px !important;
  }

  html.pe87FoldWide #assessTableBox .foldAssessmentPremiumTable tbody > tr > td {
    align-self: stretch !important;
    min-height: 112px !important;
    height: 112px !important;
    box-sizing: border-box !important;
  }

  html.pe87FoldWide #assessTableBox .foldAssessmentPremiumTable tbody > tr > td:nth-child(1),
  html.pe87FoldWide #assessTableBox .foldAssessmentPremiumTable tbody > tr > td:nth-child(2),
  html.pe87FoldWide #assessTableBox .foldAssessmentPremiumTable tbody > tr > td.foldAssessmentTotalCell,
  html.pe87FoldWide #assessTableBox .foldAssessmentPremiumTable tbody > tr > td.foldAssessmentGradeCell {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding-top: 28px !important;
    vertical-align: middle !important;
  }

  html.pe87FoldWide #assessTableBox .foldAssessmentPremiumTable tbody td.foldAssessmentScoreCell {
    display: grid !important;
    grid-template-rows: 28px minmax(54px, 1fr) 4px 19px !important;
    align-items: stretch !important;
    min-height: 112px !important;
    height: 112px !important;
  }

  html.pe87FoldWide #assessTableBox .foldAssessmentGradeCell,
  html.pe87FoldWide #assessTableBox .foldAssessmentGradeCell > .foldAssessmentGradeBadge {
    visibility: visible !important;
    opacity: 1 !important;
  }
}

@media (min-width: 769px) and (max-width: 1440px) {
  /*
   * The effective distance at every hierarchy boundary is 10px:
   * sideTree gap 6px + 4px, nested treeIndent gap 5px + 5px.
   */
  html[data-pe-tab="assessment"].pe87Ipad .pe87Side .sideTree > .treeYear + .treeIndent,
  html[data-pe-tab="assessment"].pe87IpadRuntime .pe87Side .sideTree > .treeYear + .treeIndent {
    margin-top: 4px !important;
    margin-bottom: 4px !important;
  }

  html[data-pe-tab="assessment"].pe87Ipad .pe87Side .sideTree > .treeYear + .treeYear,
  html[data-pe-tab="assessment"].pe87IpadRuntime .pe87Side .sideTree > .treeYear + .treeYear {
    margin-top: 4px !important;
  }

  html[data-pe-tab="assessment"].pe87Ipad .pe87Side .treeIndent > .treeSemester + .treeIndent,
  html[data-pe-tab="assessment"].pe87IpadRuntime .pe87Side .treeIndent > .treeSemester + .treeIndent {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
  }

  html[data-pe-tab="assessment"].pe87Ipad .pe87Side .treeIndent > .treeSemester + .treeSemester,
  html[data-pe-tab="assessment"].pe87IpadRuntime .pe87Side .treeIndent > .treeSemester + .treeSemester {
    margin-top: 5px !important;
  }
}
