/* Warm Notebook learning surfaces. Loaded after the focused materials/homework rules. */
.learning-page {
  --learning-paper: #fffdf9;
  --learning-paper-soft: #f7f2e9;
  --learning-blue-border: #c7d9e2;
  min-width: 0;
  color: var(--text, #202431);
}

.learning-page .learning-card,
.learning-page .learning-intro,
.learning-page .learning-section,
.learning-page .homework-material,
.learning-page .material-step,
.learning-page .form-card,
.learning-page .upload-panel,
.learning-page .review-feedback,
.learning-page .material-folder,
.learning-page .material-file,
.learning-page .answer-row,
.learning-page .student-homework-group,
.learning-page .student-homework-card {
  border-color: var(--line, #e4ddd3);
  border-radius: 16px;
  background-color: var(--learning-paper);
  box-shadow: 0 2px 9px rgb(48 39 27 / 3%);
}

.learning-page .learning-card:hover,
.learning-page .material-folder:hover,
.learning-page .student-homework-card:hover {
  border-color: #cdb9a8;
  box-shadow: 0 4px 14px rgb(48 39 27 / 6%);
}

.learning-page .learning-card-copy strong,
.learning-page .material-file strong,
.learning-page .student-homework-copy > strong {
  color: var(--text, #202431);
}

.learning-page .learning-card-copy small,
.learning-page .student-homework-copy > small,
.learning-page .material-file small {
  color: var(--muted, #666d75);
}

.learning-page .overview-icon,
.learning-page .homework-status-icon {
  background: var(--accent-soft, #f3ede4);
  color: var(--accent, #af5138);
}

.learning-page .homework-status-icon.status-checked {
  background: var(--success-soft, #eaf0e5);
  color: var(--success, #42634a);
}

.learning-page .homework-status-icon.status-todo {
  background: var(--blue-soft, #e9f1f6);
  color: var(--blue, #3e657a);
}

.learning-page .homework-status-icon.status-pending {
  background: var(--pending-soft, #faf0db);
  color: var(--pending, #846128);
}

.learning-page .homework-detail-status {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin: 5px 0 8px;
  padding: 4px 10px 4px 5px;
  border-radius: 999px;
  font-size: 13px;
}

.learning-page .homework-detail-status .homework-status-icon {
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  border-radius: 50%;
}

.learning-page .homework-detail-status .homework-status-icon svg {
  width: 20px;
  height: 20px;
}

.learning-page .homework-detail-status.status-todo {
  background: var(--blue-soft, #e9f1f6);
  color: var(--blue, #3e657a);
}

.learning-page .homework-detail-status.status-pending {
  background: var(--pending-soft, #faf0db);
  color: var(--pending, #846128);
}

.learning-page .homework-detail-status.status-checked {
  background: var(--success-soft, #eaf0e5);
  color: var(--success, #42634a);
}

.learning-page .review-notice-label,
.learning-page .answer-correct {
  color: var(--success, #42634a);
}

.learning-page .answer-incorrect {
  color: #a43f32;
}

.learning-page .learning-intro,
.learning-page .homework-material,
.learning-page .material-step,
.learning-page .form-card {
  position: relative;
  overflow: hidden;
}

.learning-page .learning-intro::before,
.learning-page .homework-material::before,
.learning-page .material-step::before,
.learning-page .form-card::before {
  position: absolute;
  top: 12px;
  bottom: 12px;
  left: 8px;
  width: 3px;
  background: radial-gradient(circle, #e7d8c7 1px, transparent 1.5px) center top / 3px 9px repeat-y;
  content: "";
  pointer-events: none;
}

.learning-page .learning-intro,
.learning-page .homework-material,
.learning-page .material-step,
.learning-page .form-card {
  padding-left: 22px;
}

.learning-page .learning-intro h2,
.learning-page .learning-section h2,
.learning-page .material-step h2,
.learning-page .form-card h2 {
  color: var(--text, #202431);
  letter-spacing: -.025em;
}

.learning-page .learning-section {
  margin-top: 24px;
}

.learning-page .learning-card-list {
  gap: 12px;
}

.learning-page .learning-card {
  min-height: 84px;
  padding: 16px;
}

.learning-page .assignment-card .learning-card-copy {
  gap: 5px;
}

.learning-page .learning-note,
.learning-page .material-empty,
.learning-page .student-empty-copy {
  color: var(--muted, #666d75);
}

.learning-page .material-browser {
  padding-top: 2px;
}

.learning-page .material-breadcrumbs {
  gap: 7px;
  margin: 14px 0;
}

.learning-page .material-breadcrumbs a,
.learning-page .text-link {
  color: var(--accent, #af5138);
}

.learning-page .material-search input,
.learning-page .homework-answer-input,
.learning-page .field input,
.learning-page .field select,
.learning-page .field textarea {
  border-color: var(--line, #e4ddd3);
  border-radius: 12px;
  background: #fff;
  color: var(--text, #202431);
}

.learning-page .material-search input:focus,
.learning-page .homework-answer-input:focus,
.learning-page .field input:focus,
.learning-page .field select:focus,
.learning-page .field textarea:focus {
  border-color: var(--accent, #af5138);
  outline: 3px solid rgb(175 81 56 / 14%);
}

.learning-page .material-folders {
  gap: 10px;
}

.learning-page .material-folder {
  min-height: 72px;
  padding: 14px;
}

.learning-page .material-folder .overview-icon {
  background: var(--blue-soft, #e9f1f6);
  color: var(--blue, #3e657a);
}

.learning-page .material-file {
  gap: 14px;
  padding: 15px;
}

.learning-page .material-check {
  border-color: var(--line, #e4ddd3);
  border-radius: 12px;
  color: var(--text, #202431);
}

.learning-page .material-check:has(input:checked),
.learning-page .material-file.is-selected {
  border-color: var(--blue, #3e657a);
  background: var(--blue-soft, #e9f1f6);
  color: var(--blue, #3e657a);
}

.learning-page .material-check input {
  accent-color: var(--blue, #3e657a);
}

.learning-page .material-selected {
  border: 1px solid #e7dac8;
  border-radius: 14px;
  background: var(--accent-soft, #f3ede4);
}

.learning-page .selected-work-list li {
  border-color: #e3d8ca;
}

.learning-page .student-choice span {
  min-height: 48px;
  border-color: var(--line, #e4ddd3);
  border-radius: 12px;
  background: var(--learning-paper);
}

.learning-page .student-choice input:checked + span {
  border-color: var(--blue, #3e657a);
  background: var(--blue-soft, #e9f1f6);
  color: var(--blue, #3e657a);
}

.learning-page .student-choice input:focus-visible + span {
  outline-color: var(--blue, #3e657a);
}

.learning-page .deadline-modes {
  gap: 8px;
  padding: 4px;
  border-radius: 14px;
  background: var(--accent-soft, #f3ede4);
}

.learning-page .deadline-modes label {
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: 11px;
}

.learning-page .deadline-modes label:has(input:checked) {
  border-color: #e8d8c9;
  background: var(--learning-paper);
  color: var(--accent, #af5138);
  font-weight: 650;
}

.learning-page .deadline-modes input {
  accent-color: var(--accent, #af5138);
}

.learning-page .material-picker {
  padding: 0 13px;
  border: 1px solid var(--line, #e4ddd3);
  border-radius: 14px;
  background: var(--learning-paper);
}

.learning-page .material-picker summary {
  min-height: 48px;
  color: var(--blue, #3e657a);
}

.learning-page .homework-material {
  padding: 18px 18px 18px 24px;
}

.learning-page .homework-material-heading h3 {
  color: var(--text, #202431);
}

.learning-page .homework-material .answer-list {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.learning-page .homework-answer {
  padding: 11px;
  border-radius: 13px;
  box-shadow: none;
}

.learning-page .homework-answer .answer-row-heading strong {
  color: var(--text, #202431);
}

.learning-page .homework-answer-input {
  min-height: 48px;
  padding: 10px 11px;
}

.learning-page .answer-state {
  padding: 3px 8px;
  border-radius: 20px;
  background: var(--blue-soft, #e9f1f6);
  color: var(--blue, #3e657a);
  font-size: 12px;
  font-weight: 650;
}

.learning-page .answer-state.answer-correct {
  background: var(--success-soft, #eaf0e5);
}

.learning-page .answer-state.answer-incorrect {
  background: #f8e9e5;
}

.learning-page .upload-panel {
  border-color: var(--learning-blue-border);
  background: var(--blue-soft, #e9f1f6);
  color: var(--blue, #3e657a);
}

.learning-page .upload-panel .field-help,
.learning-page .upload-panel .muted {
  color: var(--blue, #3e657a);
}

.learning-page .saved-review,
.learning-page .review-feedback {
  border-color: #d3dfcc;
  background: var(--success-soft, #eaf0e5);
  color: var(--success, #42634a);
}

.learning-page .review-feedback {
  margin-top: 18px;
}

.learning-page .review-feedback .eyebrow,
.learning-page .saved-review .eyebrow {
  color: var(--success, #42634a);
}

.learning-page .homework-submit-actions .button,
.learning-page .assignment-builder > .form-actions .button-primary {
  min-height: 48px;
  border-radius: 999px;
}

.learning-page .student-homework-groups {
  display: grid;
  gap: 12px;
}

.learning-page .student-homework-group {
  overflow: hidden;
}

.learning-page .student-homework-group > summary {
  min-height: 68px;
  padding: 12px 15px;
}

.learning-page .student-homework-group-content {
  padding: 0 12px 12px;
}

.learning-page .student-homework-card {
  min-height: 72px;
  padding: 13px;
  box-shadow: none;
}

.learning-page .student-homework-card.is-review-notice {
  border-color: #d3dfcc;
  background: var(--success-soft, #eaf0e5);
}

.learning-page .student-homework-card .review-notice-label {
  color: var(--success, #42634a);
}

.learning-page .homework-toolbar .button-danger {
  min-height: 42px;
  border-radius: 999px;
}

.learning-page .form-card {
  max-width: 680px;
}

.learning-page .danger-icon {
  background: #f8e9e5;
  color: #a43f32;
}

@media (max-width: 600px) {
  .learning-page .material-folders,
  .learning-page .student-choice-grid {
    grid-template-columns: 1fr;
  }

  .learning-page .material-step,
  .learning-page .form-card {
    padding-left: 20px;
  }

  .learning-page .homework-material {
    padding: 15px 14px 15px 21px;
  }

  .learning-page .homework-material .answer-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
  }

  .learning-page .homework-answer {
    padding: 8px;
  }

  .learning-page .homework-answer-input {
    padding: 8px;
  }

  .learning-page .material-file-actions {
    align-items: stretch;
  }

  .learning-page .material-file-actions .button {
    flex: 1 1 auto;
  }
}

/* Keep the actual answer sheet compact, with the same pieces as the design kit. */
.warm-app .learning-assignment-detail-page .learning-intro{padding:18px;display:block}
.warm-app .learning-assignment-detail-page .learning-intro>.overview-icon{display:none}
.warm-app .learning-assignment-detail-page .learning-intro h2{font-size:23px;margin:0 0 8px}
.warm-app .learning-assignment-detail-page .learning-intro p{font-size:13px;line-height:1.55}
.warm-app .learning-page .homework-detail-status{align-self:flex-start;margin:0 0 4px;font-weight:500}
.warm-app .homework-note{margin-top:10px;border-top:1px solid var(--line)}
.warm-app .homework-note>summary{min-height:44px;display:flex;align-items:center;gap:8px;cursor:pointer;color:var(--accent);font-size:13px;font-weight:500}
.warm-app .homework-note>summary:after{content:"+";margin-left:auto;font-size:20px}
.warm-app .homework-note[open]>summary:after{content:"−"}
.warm-app .homework-note p{margin:4px 0 8px;color:var(--text)}
.warm-app .learning-page .learning-section{background:transparent;border-radius:0;box-shadow:none}
.warm-app .learning-page .learning-section>.section-heading p{font-size:13px;margin:4px 0 0}
.warm-app .learning-page .homework-answer{padding:0;border:0;background:transparent;border-radius:0}
.warm-app .learning-page .homework-answer .answer-row-heading{margin-bottom:8px;gap:5px}
.warm-app .learning-page .homework-answer .answer-row-heading strong{font-size:13px;font-weight:500;color:var(--muted)}
.warm-app .learning-page .homework-answer-input{font-size:16px;border-radius:12px;background:#fff;padding:10px;min-height:48px}
.warm-app .learning-assignment-detail-page #second-part{padding:18px;border:1px solid #C7D9E2;border-radius:16px;background:var(--blue-soft)}
.warm-app .learning-assignment-detail-page #second-part h2{color:var(--blue)}
.warm-app .learning-assignment-detail-page #second-part .section-heading p{font-size:13px;color:var(--blue);margin-bottom:12px}
.warm-app .learning-page .student-homework-group{border:0;background:transparent;box-shadow:none;border-radius:0;overflow:visible}
.warm-app .learning-page .student-homework-group>summary{padding:9px 0 13px;min-height:52px;font-size:19px;font-family:"Manrope",sans-serif;font-weight:800}
.warm-app .learning-page .student-homework-group>summary .homework-status-icon{display:none}
.warm-app .learning-page .student-homework-group-content{border:0;padding:0;display:grid;gap:10px}
.warm-app .learning-page .student-homework-group:not([open])>.student-homework-group-content{display:none}
.warm-app .learning-page .student-homework-card{position:relative;border:0;border-radius:14px;padding:15px 14px 15px 23px;box-shadow:none;gap:12px}
.warm-app .learning-page .student-homework-card:before{content:"";position:absolute;inset:0 auto 0 0;width:10px;border-radius:14px 0 0 14px;background:radial-gradient(circle,#FFFCF7 2px,transparent 2.3px) 4px center/10px 18px repeat-y;pointer-events:none}
.warm-app .learning-page [data-homework-status="todo"] .student-homework-card{background:var(--blue-soft)}
.warm-app .learning-page [data-homework-status="todo"] .student-homework-card:before{background-color:#BCD1DC}
.warm-app .learning-page [data-homework-status="pending"] .student-homework-card{background:var(--pending-soft)}
.warm-app .learning-page [data-homework-status="pending"] .student-homework-card:before{background-color:#E5D8B9}
.warm-app .learning-page [data-homework-status="checked"] .student-homework-card{background:var(--success-soft)}
.warm-app .learning-page [data-homework-status="checked"] .student-homework-card:before{background-color:#D0DBC8}
.warm-app .learning-page .student-homework-card .homework-status-icon{border-radius:50%;width:36px;height:36px;flex-basis:36px;background:#FFFCF7;color:var(--blue)}
.warm-app .learning-page [data-homework-status="checked"] .homework-status-icon{background:var(--success);color:#fff}
.warm-app .learning-page [data-homework-status="pending"] .homework-status-icon{color:var(--pending)}
.warm-app .learning-page .student-homework-group .student-count{background:var(--accent-soft);color:var(--muted);font:500 12px "Golos Text",sans-serif}
.warm-app .learning-page .student-homework-copy>strong{font-size:14px;font-weight:600}
.warm-app .learning-page .student-homework-copy>small{font-size:12px}
@media(max-width:370px){.warm-app .learning-page .homework-material{padding:16px}.warm-app .learning-page .homework-material:before{display:none}.warm-app .learning-page .student-homework-group>summary{font-size:18px}.warm-app .learning-page .homework-answer-input{padding:8px;font-size:16px}}
@media(max-width:600px){.warm-app .learning-assignment-builder-page .student-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.warm-app .learning-assignment-builder-page .student-choice{min-height:48px;padding:10px;font-size:13px;overflow-wrap:anywhere}}
