/* =====================================================================
 * 百优体育管理系统 · 门户主页专用样式（左导航 + 右侧看板）
 * 2026-08-19 v4  老板给的 LOGO（圆 BY + 百优体育 + 副标题蓝底设计稿）替代旧 brand 区
 *   - 顶栏：自用 logo 自带蓝底背景条（蓝色顶栏与之无缝过渡）
 *   - 侧栏 brand：去掉橙渐变；logo 占主导
 *   - 文字 h1 保留 sr-only，仅屏幕阅读器/SEO 可见
 * ---------------------------------------------------------------------
 */

/* ===== 顶栏 ===== */
.topbar {
  height: 64px !important;
  padding: 0 22px !important;
  display: flex;
  align-items: center;
}
.topbar-left {
  gap: 18px !important;
  flex: 1;
  min-width: 0;
  align-items: center;
}
.topbar h1 { margin: 0 !important; }

/* ===== 品牌主 LOGO（4.5:1 横向） ===== */
.brand-logo { display: block; user-select: none; }
.brand-logo-topbar  { height: 36px; width: auto; max-height: 36px; }
.brand-logo-sidebar { width: 100%; max-width: 168px; height: auto; max-height: 44px; margin: 0 auto; object-fit: contain; }

/* ===== 顶栏：嵌入新版面会撑高顶栏，让 logo 自然占地 ===== */
.topbar { padding-top: 6px !important; padding-bottom: 6px !important; }

/* ===== 侧栏 brand 区（新版只有 logo） ===== */
.sidebar-header {
  background: transparent !important;
  background-image: none !important;
  padding: 18px 12px !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 80px;
}
/* 兼容旧 .logo-circle-sm .logo-text 残留 DOM：避免样式竞态 */
.sidebar-header .logo-circle-sm,
.sidebar-header .logo-text { display: none !important; }

/* ===== 屏幕阅读器可见 · 视觉隐藏（h1/h2 SEO + 无障碍） ===== */
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* ===== 隐藏分组标签（人/财/物/角色），但保留 DOM 以便回退 ===== */
.nav-section-label { display: none !important; }

/* ===== 导航项：去掉所有下划线、边线，让条目干净 ===== */
.nav-item,
.nav-item:hover,
.nav-item:focus,
.nav-item.active {
  text-decoration: none !important;
  border-bottom: 0 !important;
  box-shadow: none;
}
.nav-item {
  position: relative;
}
/* 激活态：左侧 3px 橙色边 */
.nav-item.active::before {
  content: '';
  position: absolute;
  left: 0; top: 8px; bottom: 8px;
  width: 3px;
  background: var(--orange-500);
  border-radius: 2px;
}
.nav-item.active {
  background: rgba(240, 96, 0, 0.12);
}
.nav-divider {
  height: 1px;
  margin: 8px 12px;
  background: rgba(255, 255, 255, 0.12);
}
.nav-item-settings {
  margin-bottom: 8px;
  background: rgba(255, 255, 255, 0.04);
  border-left: 2px solid rgba(255, 255, 255, 0.2);
}
.nav-item-settings .icon { color: rgba(255, 255, 255, 0.75); }
.nav-item-settings:hover { background: rgba(255, 255, 255, 0.12); }

/* ===== 看板 tile（各系统数据卡） ===== */
.portal-tiles {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 12px;
}
.portal-tile {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 10px;
  border: 1px solid var(--gray-200);
  background: #fff;
  color: var(--gray-700);
  text-decoration: none;
  transition: all .18s ease;
  position: relative;
  min-height: 70px;
}
.portal-tile:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0, 48, 144, 0.10);
  border-color: var(--blue-500);
}
.portal-tile-icon {
  width: 40px; height: 40px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 17px; flex-shrink: 0;
}
.portal-tile-body { flex: 1; min-width: 0; }
.portal-tile-title { font-size: 14px; font-weight: 700; color: var(--gray-800); margin-bottom: 3px; }
.portal-tile-text  { font-size: 12.5px; color: var(--gray-600); line-height: 1.55; white-space: normal; }
.portal-tile-text b { color: var(--blue-700); font-weight: 700; }
.portal-tile-arrow {
  font-size: 12px; color: var(--gray-400);
  flex-shrink: 0;
  transition: transform .15s ease, color .15s ease;
}
.portal-tile:hover .portal-tile-arrow { transform: translateX(3px); color: var(--blue-600); }

/* 各色 tile 图标背景 */
.portal-tile-blue   .portal-tile-icon { background: var(--blue-50);  color: var(--blue-600); }
.portal-tile-orange .portal-tile-icon { background: var(--orange-50); color: var(--orange-500); }
.portal-tile-green  .portal-tile-icon { background: var(--emerald-50); color: var(--emerald-600); }
.portal-tile-red    .portal-tile-icon { background: var(--rose-50);  color: var(--rose-600); }
.portal-tile-cyan   .portal-tile-icon { background: #ECFEFF; color: #0891B2; }
.portal-tile-purple .portal-tile-icon { background: #F5F3FF; color: #7C3AED; }

.content { background: transparent; }

#portalNav .nav-item { margin: 1px 0; }

/* ===== 卡片可点击提示 ===== */
.portal-tile-clickable { cursor: pointer; }
.portal-tile-clickable:hover .portal-tile-title { color: var(--blue-600); }
.card-subtitle { font-size: 12px; color: var(--gray-400); font-weight: 400; margin-left: 8px; }
.portal-tile-arrow {
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 7px;
  color: var(--gray-400); flex-shrink: 0;
  text-decoration: none;
  transition: all .15s ease;
}
.portal-tile:hover .portal-tile-arrow { color: var(--blue-600); background: var(--blue-50); }

/* ===== 详情弹窗 ===== */
.portal-detail-mask {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(15, 23, 42, 0.55);
  display: none;
  align-items: center; justify-content: center;
  padding: 20px;
}
.portal-detail-mask.show { display: flex; }
.portal-detail-box {
  width: 100%; max-width: 640px; max-height: 86vh;
  background: #fff; border-radius: 14px;
  display: flex; flex-direction: column;
  box-shadow: 0 20px 60px rgba(15, 23, 42, 0.25);
  overflow: hidden;
}
.portal-detail-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px;
  border-bottom: 1px solid var(--gray-200);
  background: var(--blue-50);
}
.portal-detail-title { font-size: 15px; font-weight: 700; color: var(--blue-800); }
.portal-detail-close {
  width: 30px; height: 30px; border: none; border-radius: 8px;
  background: transparent; color: var(--gray-500);
  font-size: 20px; line-height: 1; cursor: pointer;
  transition: all .15s ease;
}
.portal-detail-close:hover { background: var(--gray-100); color: var(--gray-800); }
.portal-detail-body { padding: 16px 18px 20px; overflow-y: auto; }

.detail-stats {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  gap: 10px; margin-bottom: 14px;
}
.detail-stat {
  background: var(--gray-50); border: 1px solid var(--gray-200);
  border-radius: 10px; padding: 10px 12px; text-align: center;
}
.detail-stat .k { font-size: 12px; color: var(--gray-500); margin-bottom: 4px; }
.detail-stat .v { font-size: 18px; font-weight: 700; color: var(--gray-800); }
.detail-stat .v.green { color: var(--emerald-600); }
.detail-stat .v.red   { color: var(--rose-600); }
.detail-stat .v.orange { color: var(--orange-500); }

.detail-table-title { font-size: 13px; font-weight: 600; color: var(--gray-700); margin: 14px 0 6px; }
.detail-table {
  width: 100%; border-collapse: collapse;
  font-size: 13px;
}
.detail-table th {
  text-align: left; padding: 8px 10px;
  background: var(--gray-50); color: var(--gray-600);
  border-bottom: 1px solid var(--gray-200);
  font-weight: 600; white-space: nowrap;
}
.detail-table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--gray-100);
  color: var(--gray-700);
}
.detail-table tr:last-child td { border-bottom: none; }
.detail-table .text-green { color: var(--emerald-600); font-weight: 600; }
.detail-table .text-red { color: var(--rose-600); font-weight: 600; }
.detail-table .font-bold { font-weight: 700; color: var(--gray-800); }
.detail-empty { color: var(--gray-400); text-align: center; padding: 14px 0 !important; }

.detail-tip {
  background: var(--blue-50); border: 1px solid var(--blue-100);
  border-radius: 10px; padding: 14px 16px;
  font-size: 13px; color: var(--blue-800); line-height: 1.7;
  margin-bottom: 14px;
}
.detail-actions { text-align: center; margin-top: 8px; }

/* ===== 待办中心（AI 工单分派） ===== */
.task-bar {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  background: linear-gradient(90deg, #fff7ed, #fff);
  border: 1px solid #ffd9a8; border-left: 4px solid var(--orange-500, #EF6C00);
  border-radius: 10px; padding: 10px 14px; margin-bottom: 14px;
  font-size: 13.5px; cursor: pointer; transition: box-shadow .15s ease;
}
.task-bar:hover { box-shadow: var(--shadow-sm, 0 1px 6px rgba(0,0,0,.12)); }
.task-bar-p0 { background: linear-gradient(90deg, #fff0f0, #fff); border-color: #ffc9c9; border-left-color: var(--red-600, #E03131); }
.task-bar b { color: var(--red-600, #E03131); }
.task-bar-p1 b { color: var(--orange-600, #EF6C00); }
.task-more { margin-left: auto; font-size: 12px; color: var(--gray-500, #868E96); }
.task-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.task-dot-p0 { background: #E03131; }
.task-dot-p1 { background: #EF6C00; }

/* 待办弹窗 */
.task-center-overlay {
  position: fixed; inset: 0; z-index: 3000;
  background: rgba(15, 23, 42, 0.55);
  display: flex; align-items: center; justify-content: center; padding: 16px;
}
.task-center-box {
  background: #fff; border-radius: 14px; width: min(560px, 100%);
  max-height: 84vh; display: flex; flex-direction: column;
  box-shadow: 0 24px 80px rgba(0,0,0,.28);
}
.task-center-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px; border-bottom: 1px solid var(--gray-100, #f1f3f5);
  font-weight: 700; font-size: 15px; color: var(--gray-800, #343a40);
}
.task-center-body { overflow-y: auto; padding: 12px 16px 16px; }
.task-item { border: 1px solid var(--gray-100, #f1f3f5); border-radius: 10px; padding: 12px 14px; margin-bottom: 10px; background: #fcfcfd; }
.task-item-p0 { border-left: 4px solid #E03131; background: #fff7f7; }
.task-item-p1 { border-left: 4px solid #EF6C00; background: #fffaf3; }
.task-item-p2 { border-left: 4px solid #adb5bd; }
.task-item-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; flex-wrap: wrap; }
.task-tag { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 999px; color: #fff; }
.task-tag-p0 { background: #E03131; }
.task-tag-p1 { background: #EF6C00; }
.task-tag-p2 { background: #868E96; }
.task-owner { font-size: 12px; color: var(--gray-500, #868E96); }
.task-item-title { font-size: 14px; font-weight: 700; color: var(--gray-800, #343a40); margin-bottom: 4px; }
.task-item-detail { font-size: 12.5px; color: var(--gray-600, #495057); line-height: 1.7; }
.task-item-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 8px; flex-wrap: wrap; gap: 6px; }
.task-due { font-size: 11.5px; color: var(--gray-400, #adb5bd); }
.task-empty { text-align: center; color: var(--gray-400, #adb5bd); padding: 28px 0; font-size: 14px; }

/* 全局待办悬浮按钮（所有页面右下角） */
.byty-fab {
  position: fixed; right: 18px; bottom: 24px; z-index: 2500;
  width: 52px; height: 52px; border-radius: 50%;
  background: var(--blue-700, #173177); color: #fff;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 18px rgba(23, 49, 119, 0.4);
  cursor: pointer; font-size: 20px; transition: transform .15s ease, box-shadow .15s ease;
}
.byty-fab:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(23, 49, 119, 0.5); }
.byty-fab.byty-fab-p0 { background: #E03131; box-shadow: 0 6px 18px rgba(224, 49, 49, 0.45); animation: bytyFabPulse 1.4s ease infinite; }
.byty-fab.byty-fab-p1 { background: #EF6C00; box-shadow: 0 6px 18px rgba(239, 108, 0, 0.45); }
.byty-fab-count {
  position: absolute; top: -4px; right: -4px;
  min-width: 20px; height: 20px; padding: 0 5px; border-radius: 999px;
  background: #fff; color: #E03131; font-size: 11px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 1px 4px rgba(0,0,0,0.2);
}
@keyframes bytyFabPulse {
  0%, 100% { box-shadow: 0 6px 18px rgba(224, 49, 49, 0.45); }
  50% { box-shadow: 0 6px 18px rgba(224, 49, 49, 0.85), 0 0 0 6px rgba(224, 49, 49, 0.15); }
}
@media (max-width: 480px) {
  .byty-fab { right: 12px; bottom: 16px; width: 46px; height: 46px; font-size: 18px; }
  .task-center-box { max-height: 88vh; }
  .byty-topbar-bar { font-size: 12px !important; padding: 6px 12px !important; }
  .byty-topbar-more { display: none !important; }
}

/* 顶部今日待办横幅（全局，所有页面 topbar 下方） */
.byty-topbar-bar {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  background: linear-gradient(90deg, #fff7ed, #fff);
  border: 1px solid #ffd9a8; border-left: 4px solid var(--orange-500, #EF6C00);
  border-radius: 8px; padding: 8px 14px; margin: 8px 14px 0; font-size: 13px;
}
.byty-topbar-bar.byty-topbar-bar-p0 { background: linear-gradient(90deg, #fff0f0, #fff); border-color: #ffc9c9; border-left-color: var(--red-600, #E03131); }
.byty-topbar-bar.byty-topbar-bar-p1 { background: linear-gradient(90deg, #fff7ed, #fff); border-color: #ffd9a8; border-left-color: #EF6C00; }
.byty-topbar-bar b { color: #E03131; }
.byty-topbar-bar.byty-topbar-bar-p1 b { color: #EF6C00; }
.byty-topbar-bar .byty-topbar-more { margin-left: auto; font-size: 12px; color: #868E96; cursor: pointer; }
.byty-topbar-bar .byty-topbar-close { margin-left: 6px; color: #adb5bd; cursor: pointer; padding: 0 4px; }
.byty-topbar-bar .byty-topbar-close:hover { color: #E03131; }

/* ===== 移动端微调 ===== */
@media (max-width: 768px) {
  .brand-logo-topbar  { height: 36px; }
  .brand-logo-sidebar { height: 44px; }
  .portal-tiles { grid-template-columns: 1fr; }
  .portal-detail-box { max-width: 100%; }

  /* 统计卡 2 列（触屏友好） */
  .stat-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .stat-card { padding: 13px 14px; }
  .stat-card .value { font-size: 20px; }
  .stat-card .label { font-size: 12px; }
  .stat-card .meta { font-size: 11px; }

  /* 系统快览卡 1 列，点击区域加大 */
  .portal-tile { padding: 12px 14px; }
  .portal-tile-icon { width: 38px; height: 38px; font-size: 16px; }
  .portal-tile-title { font-size: 13.5px; }
  .portal-tile-text { font-size: 12px; line-height: 1.6; }
  .portal-tile-arrow { font-size: 13px; padding: 8px; }

  /* 顶栏与公告 */
  .topbar { padding: 10px 12px; }
  .announcement { flex-wrap: wrap; padding: 10px 12px; font-size: 12px; line-height: 1.7; }

  /* AI 问答区 */
  #aiAskInput { min-height: 40px; font-size: 14px; }
  #aiAnswer > div { font-size: 13px; padding: 12px 14px; }
  .card-subtitle { font-size: 11.5px; }

  /* 详情弹窗 */
  .detail-grid { grid-template-columns: 1fr !important; }
  .modal-body { max-height: 72vh; overflow: auto; -webkit-overflow-scrolling: touch; }

  /* 登录卡片 */
  .login-card { width: 100%; max-width: 340px; padding: 22px 18px; }
}
/* 品牌登录弹窗 - 取消按钮 */
.btn-login-cancel { width:100%; margin-top:8px; padding:11px 0; border:none; border-radius:8px; background:transparent; color:var(--gray-500,#868E96); font-size:14px; cursor:pointer; }
.btn-login-cancel:hover { background:var(--gray-100,#F1F3F5); color:var(--gray-700,#495057); }
/* 学员报名页 - 全宽布局（避开 .main 的 margin-left 副作用） */
.enroll-page { padding: 18px 24px; max-width: 1320px; margin: 0 auto; }
.enroll-page .card { background:#fff; border-radius:10px; box-shadow:0 1px 3px rgba(0,0,0,.06); }
.enroll-page .table-wrap { overflow-x: auto; }
.enroll-page .enroll-table { width:100%; border-collapse: collapse; }
.enroll-page .enroll-table th, .enroll-page .enroll-table td { white-space: nowrap; padding: 10px 12px; border-bottom: 1px solid var(--gray-200, #F1F3F5); }
.enroll-page .enroll-table th { background: var(--gray-100, #F8F9FA); color: var(--gray-700, #495057); font-weight: 600; text-align: left; }
