/* ==========================================================================
   USC Canvas – hover effects for course pages
   Requested by: Clayton Yonker (AP Physics C), cyonker@uscsd.k12.pa.us

   How to install (Canvas admin):
   Admin > Themes > (district theme) > Open in Theme Editor > Upload tab >
   "CSS file" (or append to the existing custom CSS file) > Preview > Apply.

   Scope: these rules ONLY affect elements a teacher has deliberately tagged
   with the classes below (usc-pop, usc-tile, usc-icon, usc-row, usc-btn),
   inside page content (.user_content). Nothing else in Canvas changes.
   Respects students' "reduce motion" accessibility setting.
   ========================================================================== */

.user_content .usc-pop,
.user_content .usc-row,
.user_content .usc-icon {
  transition: transform 0.25s ease, box-shadow 0.25s ease, filter 0.25s ease,
              background-color 0.25s ease;
}

/* Unit tiles on the course homepage: lift, glow, and the icon grows */
.user_content a.usc-tile:hover,
.user_content a.usc-tile:focus-visible {
  transform: translateY(-6px);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18), 0 0 18px rgba(255, 210, 63, 0.55);
}
.user_content a.usc-tile:hover .usc-icon,
.user_content a.usc-tile:focus-visible .usc-icon {
  transform: scale(1.18) rotate(-4deg);
  filter: drop-shadow(0 0 12px rgba(255, 210, 63, 0.9)) brightness(1.1);
}

/* Big animated icon on each unit page */
.user_content .usc-hero:hover {
  transform: scale(1.1) rotate(3deg);
  filter: drop-shadow(0 0 16px rgba(255, 255, 255, 0.85));
}

/* Buttons (Daily Lessons, Syllabus, Next Unit, etc.) */
.user_content a.usc-btn:hover,
.user_content a.usc-btn:focus-visible {
  transform: scale(1.07);
  box-shadow: 0 0 14px rgba(209, 46, 46, 0.6);
}

/* Lesson / assignment rows on unit pages: slide and highlight */
.user_content a.usc-row:hover,
.user_content a.usc-row:focus-visible {
  transform: translateX(6px);
  background-color: rgba(255, 210, 63, 0.18);
}

@media (prefers-reduced-motion: reduce) {
  .user_content .usc-pop,
  .user_content .usc-row,
  .user_content .usc-icon { transition: none; }
  .user_content a.usc-tile:hover,
  .user_content a.usc-tile:hover .usc-icon,
  .user_content .usc-hero:hover,
  .user_content a.usc-btn:hover,
  .user_content a.usc-row:hover { transform: none; }
}
