/* Listado completo del curso, sin contenedores con desplazamiento interno. */
@media screen {
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones,
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones :is(.grade-sheet-card, .grade-table-wrap) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet {
    display: table !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet :is(th, td) {
    position: static !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    padding: 1px !important;
    font-size: var(--grade-font-size, 11px) !important;
    font-family: Calibri, "Segoe UI", Arial, sans-serif !important;
    line-height: 1.15 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    overflow: visible !important;
    text-overflow: clip !important;
    box-shadow: none !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet :is(th, td):first-child { width: 24px !important; }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet :is(th, td):nth-child(2) {
    width: 22% !important;
    text-align: left !important;
  }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet :is(th, td):nth-last-child(2) { width: 54px !important; }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet :is(th, td):last-child { width: 12% !important; }

  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet .grade-input {
    box-sizing: border-box !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: calc(var(--grade-row-height, 22px) - 3px) !important;
    min-height: calc(var(--grade-row-height, 22px) - 3px) !important;
    margin: 0 !important;
    padding: 1px 0 !important;
    font-size: var(--grade-font-size, 11px) !important;
    font-family: Calibri, "Segoe UI", Arial, sans-serif !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    text-align: center !important;
    border-radius: 4px !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet .student-risk-badges {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 2px !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet .student-risk-badge,
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet .student-risk-badge b {
    min-width: 0 !important;
    max-width: 100% !important;
    padding: 1px 2px !important;
    font-size: 10px !important;
    line-height: 1.1 !important;
    white-space: normal !important;
    overflow: visible !important;
  }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones .grade-dashboard-compact {
    padding: 6px !important;
    gap: 6px !important;
    margin-bottom: 6px !important;
  }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones .grade-sheet-card { padding: 8px !important; }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones .grade-sheet-card h3 {
    margin: 0 0 4px !important;
    font-size: 16px !important;
  }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones .grade-spreadsheet-help {
    padding: 4px 6px !important;
    margin: 0 0 5px !important;
    font-size: 11px !important;
  }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones .grade-dashboard-compact :is(.layout-insight-wrap, .layout-insight, .metric, .course-context, .grade-filter-card) {
    min-height: 0 !important;
    padding: 6px !important;
    margin-bottom: 0 !important;
  }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones .grade-dashboard-compact :is(.layout-insight b, .metric strong) { font-size: 16px !important; }
}

@media screen and (min-width: 901px) {
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet select.grade-input {
    appearance: none !important;
    padding: 0 !important;
  }
}

/* En pantallas pequenas las notas se distribuyen en filas, sin ocultar columnas. */
@media screen and (max-width: 900px) {
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet,
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody { display: block !important; }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet thead { display: none !important; }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody tr {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 4px !important;
    margin-bottom: 8px !important;
    padding: 8px !important;
    border: 1px solid #d6e4f4 !important;
    border-radius: 8px !important;
  }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody td {
    display: block !important;
    width: auto !important;
    padding: 0 !important;
    border: 0 !important;
    font-size: 12px !important;
  }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody td:is(:first-child, :nth-child(2), :nth-last-child(2), :last-child) { width: auto !important; }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody td:first-child { grid-column: 1 !important; }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody td:nth-child(2) { grid-column: 2 / -1 !important; }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody td:nth-last-child(2) { grid-column: 1 / 3 !important; }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody td:last-child { grid-column: 3 / -1 !important; }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody td[colspan] { grid-column: 1 / -1 !important; }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody td[data-label]::before {
    content: attr(data-label);
    display: block;
    margin-bottom: 2px;
    color: #53657d;
    font-size: 10px;
  }
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet .grade-input {
    height: 36px !important;
    min-height: 36px !important;
    font-size: 14px !important;
  }
}