/* Styles for Homework page */
body {
  background: #f5f7f9;
  color: #2b2b2b;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}

.app-header .navbar { background: #24649b !important; }

.app-main {
  max-width: 980px;
  background: #fff;
  padding: 24px;
  border-radius: 6px;
  box-shadow: 0 1px 0 rgba(0,0,0,0.06);
  border: 1px solid #e6e9ec;
}

.legend { font-size: 12px; line-height: 1.6; color: #fff; }
.legend .dot { display: inline-block; width: 12px; height: 12px; border-radius: 50%; margin-right: 8px; vertical-align: middle; border: 2px solid rgba(255,255,255,0.6); }
.legend .bg-light { background: #fff !important; }
.legend .bg-success { background: #28a745 !important; }
.legend .bg-info { background: #17a2b8 !important; }
.legend .bg-danger { background: #dc3545 !important; }

.subject h5 { color: #333; font-weight: 600; }

.card.light-card { background: #f8f9fa; border: 1px solid #e6e9ec; }
.card.info-card { background: #17a2b8; border: none; }
.card.success-card { background: #28a745; border: none; }
.card.danger-card { background: #e75c78; border: none; }

.card { border-radius: 6px; }
.card .card-title { font-weight: 700; margin-bottom: 4px; }
.card .grade-badge { position: absolute; top: 12px; right: 12px; background: rgba(0,0,0,0.12); color: #fff; padding: 6px 8px; border-radius: 12px; font-weight: 700; font-size: 12px; }

.avatar { width: 36px; height: 36px; }

@media (max-width: 767px) {
  .legend { display: none !important; }
  .app-main { padding: 18px; }
}