/* 教师队伍页面沿用新闻列表页面的头部尺寸，四个栏目状态共用这份样式。 */
.teacher-list-page .inner-hero { height: 440px; }
.teacher-list-page .hero-banner-image { object-position: center; }
.teacher-list-page .inner-banner-copy { top: 238px; }

/* 设计稿的主体从画布左侧开始，右侧内容距离左栏 110 像素。 */
.teacher-main { width: 1920px; margin: 0; padding: 60px 0 70px; display: grid; grid-template-columns: 440px 1130px; column-gap: 110px; }

/* 左侧系所导航：当前项为蓝色渐变尖角，其余项只有底部细线。 */
.teacher-departments { padding: 0; }
.teacher-departments.is-hidden { display: none; }
.teacher-departments a { position: relative; height: 80px; padding: 0 0 0 240px; display: flex; align-items: center; justify-content: space-between; color: #333; font-size: 18px; border-bottom: 1px solid #e5e5e5; }
.teacher-departments a span { position: relative; width: 60px; height: 1px; flex: 0 0 60px; background: #17669c; }
.teacher-departments a span::before, .teacher-departments a span::after { position: absolute; right: 0; width: 24px; height: 1px; content: ""; background: #17669c; }
.teacher-departments a span::before { top: -6px; }
.teacher-departments a span::after { top: 6px; }
/* 非激活项以蓝色竖线收口，和右侧三条引导线保持同一视觉基准。 */
.teacher-departments a:not(.department-current)::after { position: absolute; top: 0; right: 0; bottom: 0; width: 2px; content: ""; background: #17669c; }
.teacher-departments .department-current { z-index: 1; width: 460px; height: 80px; padding-left: 240px; color: #fff; background: url("../images/party-affairs-list-left.png") left center / 460px 80px no-repeat; border: 0; }
/* 激活项由矩形和箭头组成，交界处用竖向亮线明确分割。 */
.teacher-departments .department-current::before { display: none; }
.teacher-departments .department-current::after { display: none; }
/* 鼠标悬停其他栏目时，悬停项沿用 Figma 的蓝色渐变激活样式。 */
.teacher-departments a:hover,
.teacher-departments a:focus-visible { z-index: 1; width: 460px; color: #fff; background: url("../images/party-affairs-list-left.png") left center / 460px 80px no-repeat; border-bottom-color: transparent; outline: 0; }
.teacher-departments .department-current > span,
.teacher-departments a:hover > span,
.teacher-departments a:focus-visible > span { display: none; }
.teacher-departments a:hover::after,
.teacher-departments a:focus-visible::after { display: none; }
/* 存在悬停项时取消“全部教师”的固定激活背景，避免两个栏目同时高亮。 */
/* 通过脚本状态类兜底，确保悬停其他栏目时当前项完整恢复普通样式。 */

/* 右侧筛选栏：设计稿筛选条高度 60 像素，所有激活项使用相同的固定像素斜角。 */
.teacher-directory-content { min-width: 0; }
.teacher-filters { width: 1130px; height: 60px; display: grid; grid-template-columns: 420px repeat(6, 1fr); align-items: stretch; background: #f7f7f7; }
.teacher-filters.is-hidden { display: none; }
.teacher-filters a { position: relative; display: flex; align-items: center; justify-content: center; color: #333; font-size: 18px; }
.teacher-filters a:first-child { grid-column: 2; width: 160px; justify-self: start; transform: translateX(7px); }
.teacher-filters a.is-active,
/* 鼠标悬停或键盘聚焦时，筛选项显示与当前激活项一致的样式。 */
.teacher-filters a:hover,
.teacher-filters a:focus-visible { color: #fff; background: var(--orange); clip-path: polygon(28px 0, 100% 0, calc(100% - 28px) 100%, 0 100%); }
/* 导师分类增至四项，保留每项 185 像素宽度及右侧对齐，完整容纳兼职导师名称。 */
.section-graduate .teacher-filters { width: 1130px; margin-left: 0; grid-template-columns: 390px repeat(4, 185px); }
.section-support .teacher-filters { width: 1440px; margin-left: 0; grid-template-columns: 990px repeat(3, 150px); }
/* 研究生导师筛选项与网格列宽一致，利用斜角形成小间隙并保持在灰色背景内。 */
.section-graduate .teacher-filters a:first-child { width: 185px; transform: none; }
.section-support .teacher-filters a:first-child { width: 170px; transform: none; }

/* 教师名单只有每格左侧短竖线，避免整块表格边框。 */
.teacher-grid { width: 1130px; margin-top: 40px; display: grid; grid-template-columns: repeat(6, 1fr); row-gap: 0; }
/* 加载、空名单与错误提示占满整行，避免被当成单个教师挤入网格。 */
.teacher-directory-message { grid-column: 1 / -1; margin: 0; padding: 24px 0; color: #666; font-size: 18px; }
.teacher-name { position: relative; min-height: 80px; padding: 0 16px 0 22px; display: flex; align-items: center; color: #444; font-size: 18px; border: 0; }
.teacher-name::before { position: absolute; top: 20px; bottom: 20px; left: 0; width: 4px; content: ""; background: #e7e7e7; }
/* 教师默认状态统一，悬停或聚焦时统一显示激活色、图标和左侧间距。 */
.teacher-name:hover, .teacher-name:focus-visible { padding-left: 60px; color: var(--blue); outline: 0; }
.teacher-name:hover::before, .teacher-name:focus-visible::before { background: var(--blue); }
.teacher-name:hover::after, .teacher-name:focus-visible::after { position: absolute; top: 18px; left: 12px; width: 38px; height: 44px; content: ""; background: url("../images/teacher-list-active-icon.png") center / contain no-repeat; }
.section-support .teacher-grid, .section-retired .teacher-grid { width: 1440px; margin-top: 40px; grid-template-columns: repeat(8, 1fr); }
.section-support .teacher-directory-content, .section-retired .teacher-directory-content { grid-column: 1 / -1; margin-left: 240px; }
.section-retired .teacher-grid { margin-top: 0; }

/* 页脚上方的蓝色分隔线与设计稿保持 6 像素。 */
.teacher-list-page .site-footer { border-top: 6px solid var(--blue); }

/* 移动端将侧栏、筛选和名单改为纵向阅读。 */
html.is-mobile .teacher-list-page .inner-hero { height: 430px; }
html.is-mobile .teacher-list-page .inner-banner-copy { top: 138px; left: 20px; }
html.is-mobile .teacher-main { width: auto; margin: 0 16px; padding: 40px 0 56px; display: block; }
html.is-mobile .teacher-departments { margin-bottom: 34px; }
html.is-mobile .teacher-departments a, html.is-mobile .teacher-departments .department-current { width: 100%; height: 58px; padding: 0 20px; font-size: 16px; }
html.is-mobile .teacher-departments a:hover,
html.is-mobile .teacher-departments a:focus-visible { width: 100%; background-size: 100% 100%; }
/* 移动端使用容器宽度绘制背景，避免桌面端的溢出宽度影响纵向布局。 */
html.is-mobile .teacher-departments .department-current { width: 100%; background-size: 100% 100%; }
html.is-mobile .teacher-departments .department-current::after { top: 15px; right: -12px; border-top-width: 14px; border-bottom-width: 14px; border-left-width: 12px; }
/* 移动端悬停/键盘聚焦时同步缩小右侧三角，保持与当前激活项一致。 */
html.is-mobile .teacher-departments a:hover::after,
html.is-mobile .teacher-departments a:focus-visible::after { top: 15px; right: -12px; border-top-width: 14px; border-bottom-width: 14px; border-left-width: 12px; }
html.is-mobile .teacher-departments a span { width: 46px; }
html.is-mobile .teacher-filters, html.is-mobile .section-graduate .teacher-filters, html.is-mobile .section-support .teacher-filters { width: 100%; height: 56px; margin: 0; overflow-x: auto; display: flex; }
html.is-mobile .teacher-filters.is-hidden { display: none; }
html.is-mobile .teacher-filters a { width: 110px; flex: 0 0 110px; font-size: 15px; }
html.is-mobile .teacher-filters a:first-child { grid-column: auto; width: 110px; transform: none; }
html.is-mobile .section-graduate .teacher-filters a:first-child,
html.is-mobile .section-support .teacher-filters a:first-child { width: 110px; transform: none; }
/* 手机端加宽导师分类并沿用横向滚动，避免七字分类名称与斜角背景重叠。 */
html.is-mobile .section-graduate .teacher-filters a,
html.is-mobile .section-graduate .teacher-filters a:first-child { width: 170px; flex: 0 0 170px; }
html.is-mobile .teacher-grid, html.is-mobile .section-support .teacher-grid, html.is-mobile .section-retired .teacher-grid { width: 100%; margin-top: 28px; grid-template-columns: repeat(2, 1fr); }
html.is-mobile .section-support .teacher-directory-content, html.is-mobile .section-retired .teacher-directory-content { margin-left: 0; }
html.is-mobile .teacher-name, html.is-mobile .section-support .teacher-name, html.is-mobile .section-retired .teacher-name { min-height: 58px; padding: 0 12px 0 18px; font-size: 16px; }
html.is-mobile .teacher-name::before { top: 15px; bottom: 15px; }
html.is-mobile .teacher-name:hover, html.is-mobile .teacher-name:focus-visible { padding-left: 48px; }
html.is-mobile .teacher-name:hover::after, html.is-mobile .teacher-name:focus-visible::after { top: 7px; left: 8px; width: 32px; height: 38px; }
html.is-mobile .teacher-list-page .site-footer { border-top-width: 4px; }