/* Classroom Admin help-section — extends pro/admin/switch-roles.css */

/* Admin dashboard card value override */
.ds-card-val { font-size: 12px; }

/* ---- HELP PAGE SCENE ---- */
.sc-help { background: #fff; display: flex; }
.hp-body { flex: 1; padding: 12px 16px; overflow: hidden; }

.hp-page-hd { font-size: 16px; font-weight: 700; color: #1a1a1a; margin-bottom: 14px;
  opacity: 0; transform: translateY(-4px); transition: opacity .3s ease, transform .3s ease; }
.hp-page-hd.pop { opacity: 1; transform: translateY(0); }

.hp-card { border: 1px solid #eee; border-radius: 11px; padding: 14px 18px;
  display: flex; gap: 0;
  opacity: 0; transform: translateY(8px); transition: opacity .4s ease, transform .4s ease; }
.hp-card.pop { opacity: 1; transform: translateY(0); }

.hp-col { flex: 1; }
.hp-col-title { font-size: 11px; font-weight: 700; color: #1a1a1a; margin-bottom: 8px;
  opacity: 0; transform: translateX(-4px); transition: opacity .3s ease, transform .3s ease; }
.hp-col-title.pop { opacity: 1; transform: translateX(0); }

.hp-link { font-size: 10px; color: #4285f4; padding: 7px 6px; border-radius: 4px;
  display: block; cursor: default;
  opacity: 0; transform: translateX(-6px);
  transition: opacity .3s ease, transform .3s ease, color .2s, background .2s, padding .2s; }
.hp-link.pop { opacity: 1; transform: translateX(0); }
.hp-link.hl { color: #1967D2; background: #f0f4ff; text-decoration: underline; padding-left: 10px; }

.hp-col-divider { width: 1px; background: #eee; margin: 0 18px; align-self: stretch; }