/* ============================================================
   飞马自学堂 · 全站通用 UI 样式（ui.css）
   ------------------------------------------------------------
   作用：把各模板里重复出现的内联 style 抽取成可复用类，减少冗余。
   本文件被 学生端 / 家长端 / 管理端 各模板统一引用。
   ============================================================ */

/* ---- 弹窗右上角关闭 ✕ 按钮（统一样式） ---- */
.ui-x-close {
  position: absolute;
  top: 12px; right: 14px;
  border: none; background: none;
  font-size: 20px; line-height: 1;
  cursor: pointer; color: #8a97a8;
  padding: 4px; z-index: 5;
}
.ui-x-close:hover { color: #e74c3c; }
/* 大号 ✕（标题较宽的内容弹窗：方法/报告等） */
.ui-x-close.lg { top: 14px; right: 16px; font-size: 22px; }
/* 小号 ✕（窄卡片弹窗：登录二维码/到期等） */
.ui-x-close.sm { top: 10px; right: 12px; font-size: 20px; }

/* ---- 白色圆角弹窗卡片（背景 / 圆角 / 阴影 / 相对定位 通用） ----
   宽度 / 内边距 / 高度 / 对齐 等仍按各弹窗需要内联覆盖。 */
.ui-modal-card {
  background: #fff;
  border-radius: 22px;
  box-shadow: 0 26px 80px rgba(0, 0, 0, .45);
  position: relative;
}

/* ---- 绿色渐变动作按钮（保存 / 完成 等主操作） ---- */
.ui-btn-green {
  background: linear-gradient(135deg, #27ae60, #1e8e4e);
  color: #fff;
  border: none;
  border-radius: 11px;
  padding: 10px 20px;
  cursor: pointer;
  font-weight: 800;
}
.ui-btn-green:hover { filter: brightness(1.08); }

/* ---- 下拉菜单里的二级子菜单：从右侧向左滑入（替代向下展开） ----
   用在 ☰ 更多 下拉里 "🎮 游戏 → 泡泡龙/俄罗斯方块" 这类二级菜单。
   默认隐藏(display:none), 点击父级才显示(.open + 滑入动画)。
   元素本身也带内联 display:none 兜底, 即使 ui.css 未加载/缓存旧版也不会直接显示。 */
.ud-sub {
  display: none;
  position: absolute;
  top: 0; right: 100%;
  margin-right: 6px;
  min-width: 140px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .18);
  padding: 6px;
  z-index: 5;
}
.ud-sub.open {
  display: block;
  animation: udSubIn .22s ease;
}
@keyframes udSubIn {
  from { opacity: 0; transform: translateX(16px); }
  to { opacity: 1; transform: translateX(0); }
}
.ud-sub .user-link { white-space: nowrap; }