/* ============================================================================
 * clib-skin-picker-v1.css — 大课堂「选课」点选式下拉 · 末尾覆盖层（2026-10-16 · lane cto · 第 2 版）
 * ----------------------------------------------------------------------------
 * 本轮改向（兄弟要求）：照站内「等级 / 行业 / 技术」那种**点选下拉**做 —— 点一下展开、里面有搜索框 +
 *   可滚动列表，选一项就进；**收起只占一行 44px**（整体不占空间）。
 * 上一版已批的硬要求照旧：两栏严格各 50%（左＝专业课 · 右＝选修课）· 左栏搬真实左栏 · 右栏＝内功课 ·
 *   点课程直接进 · 撤掉左侧那栏 ⇒ 学习区加宽 · 间距只用一套刻度：块距 12 · 条高 44 · 圆角 10/14 · 面板内边距 8 · 行距 6 · 两栏间 16。
 * 不动：DOM 结构（只搬不造）、今日卡、状态条、便签、导航、文案、按钮数量。
 * 回退：删 index.html 里指向本文件的那一行 <link>。
 * ========================================================================== */

/* ---------- 收起状态：一条，两栏各 50% ---------- */
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick.fp-bar{
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
  margin: 12px 0 12px !important;
  padding: 0 !important;
  align-items: start !important;
}
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-dd{ position: relative !important; min-width: 0 !important; }
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-trigger{
  width: 100% !important;
  height: 44px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 14px !important;
  background: #fff !important;
  border: 1px solid #E8E8ED !important;
  border-radius: 14px !important;
  font: inherit !important;
  font-size: 13px !important;
  color: inherit !important;
  text-align: left !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
}
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-trigger:hover,
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-dd.open .fp-trigger{ border-color: #4F6BED !important; }
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-lab{ font-weight: 600 !important; white-space: nowrap !important; }
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-val{
  margin-left: auto !important; color: #6E6E73 !important; font-size: 13px !important;
  overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important;
}
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-caret{ font-size: 12px !important; color: #6E6E73 !important; transition: transform .16s ease-out; }
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-dd.open .fp-caret{ transform: rotate(180deg); }

/* ---------- 展开状态：面板（搜索框 + 滚动列表），浮在下面、不占版面高度 ---------- */
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-menu{
  display: none !important;
  position: absolute !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 60 !important;
  background: #fff !important;
  border: 1px solid #E8E8ED !important;
  border-radius: 14px !important;
  box-shadow: 0 12px 32px rgba(15,24,40,.12) !important;
  padding: 8px !important;
  box-sizing: border-box !important;
}
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-dd.open .fp-menu{ display: grid !important; grid-template-rows: auto 1fr !important; }
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-search{
  width: 100% !important;
  height: 36px !important;
  box-sizing: border-box !important;
  padding: 0 12px !important;
  margin-bottom: 8px !important;
  border: 1px solid #E8E8ED !important;
  border-radius: 999px !important;
  font: inherit !important;
  font-size: 13px !important;
  color: inherit !important;
  background: #fff !important;
}
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-body{
  /* 高度自适应、上限 440px：8 个模块（≈400px）**一屏全露、不用滚**（原来死高 268px，
     第 7/8 行被裁掉 ⇒ 那两行点不到，"点不了"）；展开某个模块后内容超高才出现滚动条。 */
  height: auto !important;
  max-height: 440px !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  padding: 0 !important;
}

/* ---------- 行（右栏：选修课） ---------- */
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-item{
  border: 1px solid #E8E8ED !important; border-radius: 14px !important; background: #fff !important;
  overflow: hidden !important; margin: 0 0 6px !important;
}
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-item:last-child{ margin-bottom: 0 !important; }
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-line{
  width: 100% !important; display: flex !important; align-items: center !important; gap: 10px !important;
  padding: 8px 10px !important; background: transparent !important; border: 0 !important;
  font: inherit !important; color: inherit !important; text-align: left !important; cursor: pointer !important;
}
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-grow{ flex: 1 1 auto !important; min-width: 0 !important; display: block !important; }
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-nm{ display: block !important; font-size: 13px !important; line-height: 1.35 !important; }
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-mt{ display: block !important; font-size: 12px !important; color: #6E6E73 !important; }
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-arrow{ font-size: 12px !important; color: #6E6E73 !important; }
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-item.open .fp-arrow{ transform: rotate(180deg); }
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-subs{ display: none !important; padding: 0 10px 8px !important; }
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-item.open .fp-subs{ display: block !important; }
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-subs-h{ font-size: 12px !important; color: #6E6E73 !important; padding: 2px 0 6px !important; }
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-sub{
  display: flex !important; align-items: center !important; gap: 8px !important;
  padding: 6px 8px !important; margin-bottom: 6px !important;
  border: 1px solid #E8E8ED !important; border-radius: 14px !important;
  text-decoration: none !important; color: inherit !important; font-size: 13px !important;
}
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-sub:last-child{ margin-bottom: 0 !important; }
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-sub:hover{ border-color: #4F6BED !important; }
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-tag{
  font-size: 11px !important; padding: 2px 8px !important; border-radius: 999px !important;
  border: 1px solid #E8E8ED !important; color: #6E6E73 !important; white-space: nowrap !important;
}
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-tag.free{ color: #1E7B37 !important; border-color: #CDEBD7 !important; }
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-go{
  font-size: 12px !important; padding: 4px 12px !important; border-radius: 999px !important;
  background: #4F6BED !important; color: #fff !important; white-space: nowrap !important;
}
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-slot .kd-day .fp-go{ margin-left: auto !important; }

/* ---------- 行（左栏：搬进来的真实左栏 .kd-acc / .kd-day 走同一套行样式） ---------- */
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-body > #knowledgeSidebar{
  width: auto !important; padding: 0 !important; margin: 0 !important; background: transparent !important; border: 0 !important;
}
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-body .kd-acc{
  border: 1px solid #E8E8ED !important; border-radius: 14px !important; background: #fff !important;
  overflow: hidden !important; margin: 0 0 6px !important; padding: 0 !important;
}
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-body .kd-acc:last-child{ margin-bottom: 0 !important; }
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-body .kd-acc-head{
  width: 100% !important; min-height: 0 !important; height: auto !important;
  display: flex !important; align-items: center !important; gap: 10px !important;
  padding: 8px 10px !important; background: transparent !important; border: 0 !important;
  font: inherit !important; font-size: 13px !important; line-height: 1.35 !important;
  color: inherit !important; text-align: left !important; cursor: pointer !important;
  /* 必须 relative：站内「扩大点击区」补丁给 .kd-acc-head 加了一层绝对定位的隐形块（::after）。
     若这里设 static，那层会就近锚到下拉框上、**膨胀成整个下拉框那么大盖住所有行**
     ⇒ 点哪一行都被最下面那个模块接走（"点不了"的机械原因）。 */
  position: relative !important;
}
/* 下拉里不需要那层扩大点击区（桌面端下拉本来就够大）——直接关掉，消除隐形遮挡 */
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-body .kd-acc-head::after{
  display: none !important;
  content: none !important;
}
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-body .kd-acc-body{ padding: 0 10px 8px !important; }
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-body .kd-day{
  display: flex !important; align-items: center !important; gap: 8px !important;
  width: 100% !important; min-height: 0 !important; height: auto !important;
  padding: 6px 8px !important; margin: 0 0 6px !important;
  border: 1px solid #E8E8ED !important; border-radius: 14px !important; background: #fff !important;
  font: inherit !important; font-size: 13px !important; color: inherit !important;
  text-align: left !important; cursor: pointer !important;
}
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-body .kd-day:last-child{ margin-bottom: 0 !important; }
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) #fdePick .fp-body .kd-day.active{ border-color: #4F6BED !important; background: #F2F4FF !important; }

/* ---------- 撤掉左侧那栏 ⇒ 学习区加宽（三栏变两栏） ---------- */
body:not(.hc-home) :not(#clibNone):not(#clibNone):not(#clibNone) .knowledge-layout{
  grid-template-columns: minmax(0, 1fr) 228px !important;
}
