/* ============================================================================================================================================================================ */
/* 全局设定 */

/* 强制覆盖所有组件 */
:root {
  --kendo-font-size: .9rem !important;
  --kendo-font-size-md: .9rem !important;
  --kendo-font-size-xl: .9rem !important;
  --kendo-font-size-xxl: .9rem !important;
  --kendo-font-size-lg: .9rem !important;
  --kendo-font-size-xs: .9rem !important;
  --kendo-font-size-xxs: .9rem !important;
  --kd-show-color: #00a8ae;
}

/* ---------------------------------------------------------------------- */
/* 原生标签全局设置 */

* {
  font-size: .95rem;
  font-family: 'Helvetica Neue', Helvetica, Avenir, 'Microsoft YaHei', Arial, 'Hiragino Sans GB', system-ui;

  /* 防止内容溢出 */
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  padding: 0 .5rem !important;
}

/* 超链接 */
a,
a:focus,
a:hover {
  text-decoration: none !important;
}

h1, h2, h3, h4, h5, h6 {
  display: inline-flex;
  align-items: center;
  gap: .2rem;
}

/* small 标签文字大小 */
small {
  font-size: smaller;
}

/* 图标相关 */
img {
  cursor: pointer; /* 图片统一用 pointer */
  z-index: initial;
}
.kd-imgsize1 {
  width: 1rem;
  height: 1rem;
}
.kd-imgsize1-2 {
  width: 1.2rem;
  height: 1.2rem;
}
.kd-imgsize1-4 {
  width: 1.4rem;
  height: 1.4rem;
}
.kd-imgsize1-8 {
  width: 1.8rem;
  height: 1.8rem;
}
.kd-imgsize2 {
  width: 2.2rem;
  height: 2.2rem;
}
.kd-imgsize2-2 {
  width: 2.6rem;
  height: 2.6rem;
}
.kd-imgsize3 {
  width: 3rem;
  height: 3rem;
}
.kd-imgsize3-5 {
  width: 3.5rem;
  height: 3.5rem;
}
.kd-imgsize5 {
  width: 5rem;
  height: 5rem;
}
.kd-imgsize8 {
  width: 8rem;
  height: 8rem;
}
.kd-imgsize12 {
  width: 12rem;
  height: 12rem;
}
.kd-imgsize18 {
  width: 18rem;
  height: 18rem;
}

/* ---------------------------------------------------------------------- */
/* 自定义全局设置 */

/* KD 主色文字 */
.kd-text-primary {
  color: #365e98 !important;
}
.kd-text-secondary {
  color: #b45b65 !important;
}

/* 金额样式 */
.kd-text-income {
  color: var(
      --kendo-color-success,
      #4c9a41
  ) !important;
}
.kd-text-outlay {
  color: var(
      --kendo-color-error,
      #b45b65
  ) !important;
}

/* 重要数据 */
.kd-main-data {
  font-size: large;
  /*vertical-align: middle;*/
}

.kd-text-important {
  color: var(
      --kendo-color-warning,
      #e6ad15
  ) !important;
  font-weight: bold !important;
}

/* 课程文字信息 */
.kd-course-info {
  font-size: small;
  /*display: inline-block;*/
  /*transform: skewX(-10deg);*/
  /* %从左到右依次是：渐变的结束颜色占总宽度的%；从%开始，背景变为透明；背景在%处保持透明 */
  background: linear-gradient(
      to right,
      #d3d3d3,
      #ffffff 90%,
      transparent 100%
  );
  padding-left: .3rem;
  padding-right: .3rem;
}
.kd-course-info span {
  font-size: small;
}

/* 课室名称 */
.kd-classroom {
  text-shadow: -1px -1px 0 white,
  1px -1px 0 white,
  -1px 1px 0 white,
  1px 1px 0 white;
  padding: .1rem .3rem !important;
  border-color: #9f9f9f !important;
}

.kd-week {
  font-size: smaller;
}

/* 仿分数显示 */
.kd-fraction {
  display: flex;
  flex-direction: column;
  line-height: .7; /* 压缩行高 */
}
.kd-fraction .kd-fraction-number {
  display: block; /* 确保换行显示 */
}
.kd-fraction hr {
  margin: .3rem;
}

/* 删除线（可用于整个元素） */
.kd-line-through {
  text-decoration: line-through;
  text-decoration-color: #c25463;
}

/* Ajax 动画样式 */
#kd-loading-msg {
  margin-top: 0.5rem;
}
.kd-mask {
  display: none;
  position: fixed;
  _position: absolute; /* IE6 及以下浏览器使用 absolute */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 20000;
}

/* 移动端（工作后台）样式 */
.list-group .row {
  padding: .3rem .6rem;
}
/* KD 主色按钮 */
.kd-btn-main {
  color: #ffffff !important;
  background-color: #5c84c2 !important;
}

/* 地图画布 */
.kd-map-canvas {
  min-height: 30rem; /* 实际不影响其最小高度，但没有此项会令 Ajax 加载后高度丢失导致地图缩放异常 */
  border: 1px solid #e0e0e0;
  border-radius: .4rem;
}

/* ---------------------------------------------------------------------- */
/* Bootstrap 全局设置 */

/* Bootstrap 容器 */
.container {
  margin: .3rem;
  padding: 0 .2rem !important;
}

/* ---------------------------------------------------------------------- */
/* Kendo 全局设置 */

/* 降低 Frame 窗口标题栏高度 */
.k-window-titlebar {
  height: 2.5rem !important;
  padding: .5rem !important;
}
/* 增加 Frame 窗口字体大小 */
.k-window-title {
  font-size: 1.2rem !important;
}
/* 统一 Frame 本体 padding（Fluent 主题通常很大） */
.k-window-content:not(#win-new):not(.k-popup-edit-form), .kd-frame {
  padding: 0 .2rem !important;
}

/* 统一内部输入框内间距（这已经是目前兼容所有主题的最佳设置了） */
.k-input-inner {
  padding-left: .2rem !important;
  padding-right: .2rem !important;
}

/* 统一输入框分隔符高度，使其占满上下空间 */
/*.k-input-separator.k-input-separator-vertical {*/
/*  height: 2.25rem !important;*/
/*  margin-top: 0 !important;*/
/*}*/
/* 统一多选框内部「选中状态和数量框」的大小 */
.k-multiselect .k-chip {
  height: 1.6rem !important;
  padding: .3rem !important;
}
/* 统一输入框高度，使所有主题尽量一致，需排除分页组件、textarea */
.k-dropdownlist, .k-multiselect, .k-numerictextbox:not(.kd-pagination .k-numerictextbox), .k-datepicker, #scr-keyword, .k-input:not(.kd-pagination .k-input):not(.k-textarea) {
  height: 2.25rem !important;
}
/* 固定各主题间按钮的间距 */
.k-button-md {
  padding: .3rem .5rem !important;
}
/* 减少选框组换行后的间距 */
.k-radio-list .k-radio-list-item,
.k-checkbox-list .k-checkbox-list-item {
  padding: 0;
}
/* 减少选框组选框之间的间距 */
.k-radio-list .k-radio-list-item:not(:last-child), .k-checkbox-list .k-checkbox-list-item:not(:last-child) {
  margin-right: -.3rem !important;
}
/* 让选框组与其他元素在一行内显示 */
.k-radio-list, .k-checkbox-list {
  display: inline-flex !important;
}

/* 统一按钮组高度 */
.k-button-group {
  height: 2.5rem;
}

/* 统一日期控件日历弹出层的尺寸（外层容器 + 内层日历），特别针对 material */
.k-calendar-container.k-popup,
.k-datetime-container.k-popup {
  width: fit-content !important;
  min-width: 0 !important;
  font-size: .75rem !important;
  line-height: 1.2 !important;
}
.k-calendar-container.k-popup .k-calendar,
.k-datetime-container.k-popup .k-calendar {
  --INTERNAL--kendo-calendar-view-width: 17rem;
  --INTERNAL--kendo-calendar-cell-padding-x: .35rem;
  --INTERNAL--kendo-calendar-cell-padding-y: .35rem;
  font-size: .75rem;
  line-height: 1.2;
}
.k-calendar-container.k-popup .k-calendar .k-calendar-view,
.k-datetime-container.k-popup .k-calendar .k-calendar-view {
  min-height: auto !important;
  height: auto !important;
  gap: .25rem !important;
}
.k-calendar-container.k-popup .k-calendar.k-month-calendar,
.k-calendar-container.k-popup .k-calendar .k-calendar-monthview,
.k-datetime-container.k-popup .k-calendar.k-month-calendar,
.k-datetime-container.k-popup .k-calendar .k-calendar-monthview {
  --INTERNAL--kendo-calendar-cell-size: 2rem;
}
.k-calendar-container.k-popup .k-calendar.k-year-calendar,
.k-calendar-container.k-popup .k-calendar .k-calendar-yearview,
.k-calendar-container.k-popup .k-calendar.k-decade-calendar,
.k-calendar-container.k-popup .k-calendar .k-calendar-decadeview,
.k-calendar-container.k-popup .k-calendar.k-century-calendar,
.k-calendar-container.k-popup .k-calendar .k-calendar-centuryview,
.k-datetime-container.k-popup .k-calendar.k-year-calendar,
.k-datetime-container.k-popup .k-calendar .k-calendar-yearview,
.k-datetime-container.k-popup .k-calendar.k-decade-calendar,
.k-datetime-container.k-popup .k-calendar .k-calendar-decadeview,
.k-datetime-container.k-popup .k-calendar.k-century-calendar,
.k-datetime-container.k-popup .k-calendar .k-calendar-centuryview {
  --INTERNAL--kendo-calendar-cell-size: 4rem;
}

/** 卡片调整 */
.k-card {
  display: inline-block !important;
  width: 100%;
  padding: .2rem !important;
}
.k-card-header,
.k-card-body,
.k-card-footer {
  padding: .2rem !important;
}

/* 只能说，尽量在各主题间保持正确间距，但某些主题（如 Fluent）下间距还是会被遮挡一点 */
.k-progress-status-wrap {
  margin-top: -.1rem !important;
}

/* 统一消息框的宽度（bootstrap 主题特别宽） */
.k-messagebox {
  padding-top: .3rem !important;
  padding-bottom: .3rem !important;
}

/* 确保深色的 tooltip 底色上的超链接颜色可见 */
.k-tooltip-content a {
  color: #8baad7;
}

.k-block {
  padding: 0 .3rem !important;
}

/* 徽章 */

/* 全局基线补偿：仅限于纯文字 + badge */
.k-badge.k-badge-inline:not(.k-event .k-badge):not(.kd-map-marker .k-badge):not(#add-form .k-badge) {
  /*margin-top: -.2rem;*/
}
/* 与图片相邻时不需要补偿，否则会出现 badge 偏上 */
/*img + .k-badge.k-badge-inline,*/
/*img ~ .k-badge.k-badge-inline,*/
/*a:has(> img) + .k-badge.k-badge-inline,*/
/*a:has(> img) ~ .k-badge.k-badge-inline {*/
/*  margin-top: 0 !important;*/
/*}*/

.kd-badge-campus, .kd-badge-outside, .kd-badge-show, .kd-badge-user, .kd-badge-id, .kd-badge-tag, .kd-badge-serial, .kd-badge-tertiary,
.kd-badge-success, .kd-badge-warning, .kd-badge-error, .kd-badge-secondary, .kd-badge-dark, .kd-badge-background {
  padding: .2rem .25rem !important;
  font-size: .85rem !important;
}
/* 大部分主题下背景不明显，因此增加一个边框 */
.kd-badge-outside, .kd-badge-background {
  border: 1px solid #cccccc !important;
}
.kd-badge-show {
  background-color: var(--kd-show-color) !important;
  border-color: var(--kd-show-color) !important;
  color: #ffffff !important;
}
.kd-badge-user {
  /*transform: skewX(-5deg);*/
  /* 参数依次是：渐变角度、透明开始、透明结束、半透明开始、半透明结束 */
  background: repeating-linear-gradient(
      -10deg,
      transparent,
      transparent 16px,
      rgba(255, 255, 255, 0.4) 16px,
      rgba(255, 255, 255, 0.4) 40px
  );
  /*opacity: 0.9;*/
  font-weight: bold !important;
}
.kd-badge-warning, .kd-badge-success {
  color: #ffffff !important;
}
.kd-badge-secondary {
  color: #f3f3f3 !important;
}
.kd-badge-age, .kd-badge-age-unknow {
  background: linear-gradient(rgba(255, 255, 255, .95), rgb(255, 255, 255, .95));
  font-size: smaller !important;
  font-weight: bold !important;
  width: 1.4rem !important;
  height: 1.4rem !important;
}
.kd-badge-age {
  color: #408558 !important;
}
.kd-badge-age-unknow {
  color: #f19d38 !important;
}
.kd-badge-id {
  cursor: pointer;
}
.kd-badge-number-light {
  font-size: smaller !important;
  color: #bdbdbd !important;
}
.kd-badge-number, .kd-badge-number-info, .kd-badge-number-warning, .kd-badge-number-error {
  background: linear-gradient(
      rgba(255, 255, 255, 0.5),
      rgb(255, 255, 255, 0.5)
  );
  color: #000000 !important;
  font-size: smaller !important;
  width: 1.5rem !important; /* 固定宽度 */
}
.kd-badge-serial {
  background: linear-gradient(
      rgba(188, 102, 111, 0.9),
      rgb(188, 102, 111, 0.9)
  );
  width: 2.5rem;
  font-weight: bold !important;
}
.kd-badge-sup, .kd-badge-sup-warning, .kd-badge-sup-success {
  margin-left: -.8rem; /* 使与其他无角标的图标对齐 */
  margin-bottom: -.6rem;
  opacity: 80%;
  color: #ffffff !important;
  font-size: .7rem !important;
  width: 1.15rem !important; /* 固定宽度 */
}

/* -------------------------------------------------- */
/* Font Awesome 全局设置 */

/* 排除部分容器，否则会导致里面的图标与文字不对齐 */
.fa, .fa-solid, .fa-regular, .fa-light, .fa-thin, .fa-brands {
  cursor: pointer;
}
.fa-2x {
  font-size: 1.4rem !important;
  vertical-align: middle !important; /* 虽然其他类已经适配了垂直居中，但这里确保在统计栏的图标也垂直居中 */
}

/* -------------------------------------------------- */
/* Highcharts 全局设置 */

/* 修正 Highcharts 的文字外框大小（暗黑主题明显） */
.highcharts-text-outline {
  font-size: .7rem;
}

/* ============================================================================================================================================================================ */
/* 响应式设置 */

/* 触发响应式表格的屏幕最小宽度（数值越小代表需要在更小屏幕设备上才触发响应式表格） */
/* 数值拉大一点反而会令一些长表格更容易触发响应，从而避免硬硬挤变形 */
@media (max-width: 1681px) {
  .table-responsive {
    width: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
  }

  .table-responsive > .table {
    margin-bottom: 0;
  }

  .table-responsive > table > thead > tr > th,
  .table-responsive > table > tbody > tr > th,
  .table-responsive > table > tfoot > tr > th,
  .table-responsive > table > thead > tr > td,
  .table-responsive > table > tbody > tr > td,
  .table-responsive > table > tfoot > tr > td {
    white-space: nowrap;
  }
}

/* 可在此处加入触发小于指定宽度的设备时需要设置的 CSS */
@media (max-width: 1280px) {
  /* 不显示周 */
  .kd-week {
    display: none;
  }

  /* 自动换行 */
  .kd-auto-wrap:not(div) {
    word-break: break-all !important; /* 强制换行 */
    overflow-wrap: break-word !important;
    white-space: normal !important; /* 在移动端响应页面状态下生效的强制换行 */
    min-width: 180px; /* 强制最小宽度（所有调用了此 class 的都将被强制）*/
  }

  .kd-auto-wrap-long { /* 此处本来在 @media 外面，但会令到某些页面表格被撑开，现在搬到里面观察 */
    word-break: break-all !important; /* 强制换行 */
    overflow-wrap: break-word !important;
    white-space: normal !important; /* 在移动端响应页面状态下生效的强制换行 */
    min-width: 290px; /* 强制最小宽度（所有调用了此 class 的都将被强制） */
  }
}

@media (max-width: 768px) {
  /* 可让 .row 行撑高并将元素保持垂直居中 */
  .kd-data-row .row > [class*="col-"] {
    line-height: 2rem;
    align-items: center;
  }
}

/* Kendo 移动端特制组件，让其靠下显示、紧凑内容 */
.k-actionsheet {
  padding: 0 !important;
  /*max-height: 60vh !important; !* 限制高度避免撑满（ios 不能滚动，打开后在 ios 滚动不到最后的选项） *!*/
}
.k-actionsheet-titlebar {
  padding: 0 !important;
  min-height: 0 !important;
}
/* 关闭按钮紧凑化 */
.k-actionsheet-titlebar .k-button.k-icon-button {
  height: 1rem !important;
  padding: .8rem .8rem 0 0 !important;
  right: 0 !important;
}
/* 隐藏无意义的标题 */
.k-actionsheet-title {
  visibility: hidden !important;
}
.k-actionsheet-content {
  padding: .3rem 0 !important;
}

/* 确保打印内容样式正确 */
@media print {
  .kd-print-area {
    width: auto;
    height: auto;
    border: none;
  }

  .kd-no-print {
    display: none !important;
  }
}

/* 可在此处加入只针对 Safari 调整的样式 */
@supports (-webkit-backdrop-filter: blur(10px)) {
}

/* ============================================================================================================================================================================ */
/* 顶部区域设置 */

.kd-pos-top, .kd-pos-top-mobile {
  width: 100%;
  z-index: 3;
}

.kd-pos-top {
  position: fixed;
  margin-left: -.48rem !important; /* 减少左侧空隙 */
}

/* 移动端顶部保留间距 */
.kd-pos-top-mobile {
  margin-top: .5rem;
}

/* ============================================================================================================================================================================ */
/* 菜单设置 */

/* 菜单开关按钮动效 */
.neon-border {
  position: relative;
  padding: 0 .2rem;
  background: linear-gradient(
      45deg,
      #e14758 0%,
      #3d89ed 50%,
      #e14758 100%
  );
  background-size: 200% 200%;
  border-radius: .5rem;
  animation: border-glow 6s linear infinite; /* 速度6秒 */
}
.neon-border img {
  display: block;
  position: relative;
  z-index: 1;
  border-radius: .5rem;
  margin-top: 0 !important;
}
@keyframes border-glow {
  0%, 100% {
    background-position: 0 50%; /* 渐变位移 */
  }
  50% {
    background-position: 100% 50%;
  }
}

/* 当前位置 */
.kd-current-pos {
  font-weight: bold;
  /* 让其与主 Logo 重叠一些，制造效果 */
  margin-left: -1.7rem;
  padding-left: 1rem !important;
  padding-top: .1rem !important;
  border-radius: .3rem;
  /* 弹性布局，保证垂直对齐 */
  display: inline-flex;
  align-items: center;
  gap: .3rem;
}

/* 抽屉菜单控制区 */
#drawer-menu-control {
  position: sticky;
  /* 使用 Kendo 变量设置背景（否则会透明） */
  background-color: var(
      --kendo-color-base,
      #ffffff
  );
  z-index: 2;
  height: 3.7rem !important; /* 防止内容挤压撑大容器 */
}
/* 抽屉开关时固定内部内容宽度，避免菜单项横向挤压抖动 */
#drawer-menu .k-drawer-items {
  min-width: 17rem;
}
#drawer-menu .k-drawer-content {
  overflow-x: hidden;
}
/* 抽屉菜单顶部区域（桌面端使用） */
#drawer-menu-control.drawer-control-top {
  top: 0;
}
/* 抽屉菜单顶部区域（移动端使用） */
#drawer-menu-control.drawer-control-bottom {
  bottom: 0;
}

/* 关于对话框 */
#win-about {
  display: none;
}

/* 移动端底部菜单 */
#bottom-menu {
  z-index: 3;
  background-color: var(
      --kendo-color-base,
      #ffffff
  );
  padding: .3rem;
}

/* ============================================================================================================================================================================ */
/* 工具栏设置 */

/* 统一 padding（Fluent 主题通常很大） */
.k-toolbar {
  padding: .3rem !important;
}
/* 文字与组件垂直居中 */
.k-toolbar .k-toolbar-item {
  align-items: center !important;
}
/* 适配其他组件垂直居中 */
.k-toolbar .k-toolbar-item img {
  margin-top: .2rem;
}
/* 搜索框项目固定靠右，换行后也保持右对齐 */
.k-toolbar .k-toolbar-item.kd-toolbar-search-item {
  margin-left: auto !important;
}
.k-toolbar .k-label.k-input-label {
  font-weight: bold;
  padding-right: 0;
  margin-right: .2rem;
}
.k-toolbar .k-dropdownlist:not(.k-rpanel .k-dropdownlist) {
  width: 6.9rem !important;
}
.k-toolbar .k-multiselect:not(.k-rpanel .k-multiselect) {
  width: 9rem !important;
}
.k-toolbar .k-numerictextbox {
  width: 7rem !important;
}
.k-toolbar .k-autocomplete {
  width: 9rem !important;
}
.k-toolbar .k-datepicker {
  width: 8rem !important;
}
.k-toolbar .k-datepicker.date-ym {
  width: 6.5rem !important;
}
.k-toolbar .k-datepicker.date-y {
  width: 5rem !important;
}
.k-toolbar .k-datepicker.date-m {
  width: 4rem !important;
}
.k-toolbar .k-card {
  margin-bottom: -.3rem;
}
/* 多数用于统计功能页面部分文字显示 */
.k-toolbar small {
  margin-right: .2rem;
}
/* 筛选项标题 */
.filter-text {
  margin: 0 .1rem;
  font-weight: bold;
}
.filter-text, .k-toolbar-item .k-label {
  color: #605e5c;
}

/* ============================================================================================================================================================================ */
/* 新建窗口表单设置 */

/* 初始隐藏所有新建窗口 */
#win-new {
  display: none;
  padding: .5rem;
}
/* label 样式 */
#add-form label {
  width: 95%;
  font-weight: bold;
}
/* 固定所有控件的宽度 */
#add-form .k-input,
#add-form .k-dropdownlist:not(.kd-not-input) {
  width: 14rem !important;
}

/* 必填项样式（仅星号右对齐） */
.kd-required {
  position: relative;
  display: inline-block;
}
.kd-required::after {
  content: '\f069'; /* Font Awesome 星号图标 */
  position: absolute;
  right: 0; /* 定位到元素右侧 */
  top: 50%;
  transform: translateY(-50%); /* 垂直居中 */
  font-family: 'Font Awesome\ 5 Free', serif;
  font-weight: 100;
  color: #c25463;
}

.k-form-error {
  display: inline-flex !important;
  padding-left: .2rem;
}

/* ============================================================================================================================================================================ */
/* 统计区域设置 */

.kd-stat-area {
  padding: .5rem 0;
  /*vertical-align: middle;*/
}
/* 带 -special 的类用于不想在移动端被折叠的统计数据 */
.kd-stat-title, .kd-stat-title-special {
  color: #777777;
  vertical-align: middle;
}
/* 修复 .k-badge 偏下 */
.kd-stat-title .k-badge.k-badge-inline {
  margin-top: -.3rem;
}
.kd-stat-item {
  color: #17a2b8;
  font-size: larger;
  padding: 0 .1rem;
  margin-left: .2rem;
  background-color: var(
      --kendo-color-base,
      #f8f8f8
  );
  border: 1px solid #eeeeee;
  border-radius: .25rem;
}
.kd-stat-important, .kd-stat-important * {
  font-size: 1.1rem;
  font-weight: bold;
}

/* 图例 */
.kd-legend {
  padding: .2rem;
  margin-right: .5rem;
  border: 1px solid #eeeeee;
  border-radius: .25rem;
  color: var(
      --kendo-color-on-base,
      #858585
  );
  background-color: var(
      --kendo-color-base,
      #f8f8f8
  );
  vertical-align: middle;
}
/* 修复 .k-badge 偏下 */
.kd-legend .k-badge.k-badge-inline {
  margin-top: -.2rem;
}

/* ============================================================================================================================================================================ */
/* 表格区域设置 */

/* 固定式表头 */
.kd-scrollable {
  /* 父容器 div */
  max-height: 70vh; /* 加载前先设置一次防止页面跳跃 */
  overflow: auto; /* 允许滚动（没设置会导致移动端不能滚动） */
  position: relative;
  z-index: 0; /* 创建独立叠层，避免 sticky 表头越过抽屉菜单 */
  will-change: scroll-position; /* 预提示浏览器 */
  /* transform: translateZ(0); */ /* 与 sticky 冲突时会抖动/错位，先关闭 */
}
.kd-scrollable thead {
  position: sticky; /* 会使 .k-badge 样式抖动，已在 entry.php 在页面加载完成后调用 KD.buildLayout() 解决 */
  top: 0; /* ⚠️在 Chrome 模拟移动端环境，缩放 75% 会造成 thead 上方小缝隙，真实环境无此问题 */
  z-index: 3; /* 使用相对叠层值，3能刚好盖过表格所有内容和 .kd-scrollable-col */
}
/* 下边框（从左到右渐变） */
.kd-scroller-border-line {
  position: relative; /* 为伪元素设置上边框做准备 */
  border-bottom: .1rem solid transparent;
  /* 最后一个数字表示切片（slice）的数量。它将整个边框图像切分成此数量的等份，然后根据属性来分配每块的大小和重复方式 */
  /* 100意味着边框图像会被切成100等份，每一份都会按照定义来显示。具体的切片和显示方式由其他 border-image 属性值决定 */
  border-image: linear-gradient(
      to left,
      #365e98 0%,
      #c25463 50%,
      transparent 95%
  ) 1;
}
/* 上边框（从右到左渐变） */
.kd-scroller-border-line thead::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: .1rem; /* 边框高度 */
  background: linear-gradient(
      to right,
      #365e98 0%,
      #c25463 50%,
      transparent 95%
  );
}

/* 固定列 */
.kd-scrollable-col {
  position: sticky;
  left: 0;
  z-index: 2; /* 使用相对叠层值，2能刚好盖过 Kendo Dropdownlist */
}

/* Bootstrap 表格 */
.table a {
  color: #365e98;
}
.table th,
.table td {
  height: 3.3rem !important;
  vertical-align: middle !important;
  background-color: transparent !important; /* 新版 Bootstrap 表格为非透明，会影响到高亮行的功能，所以将其设回透明（‼️注意如果 th/td 上再挂其他背景类 CSS，均会被此覆盖掉，只能挂在 tr 上） */
}
.table-active {
  color: #777777 !important;
}

/* 可排序组件 */
.kd-sortable {
  color: var(
      --kendo-color-primary,
      #365e98
  );
  font-weight: bold;
  cursor: pointer;
  position: relative; /* 为伪元素定位准备 */
  /* 统一 sortable 内文字与图标的垂直对齐，不依赖全局 .fa 的 vertical-align */
  display: inline-flex;
  align-items: center;
  gap: .15rem;
  vertical-align: middle;
}
/* 仅修正 sortable + fa 的图标对齐，不影响全局 fa 行为 */
.kd-sortable:is(.fa, .fa-solid, .fa-regular, .fa-light, .fa-thin, .fa-brands),
.kd-sortable + :is(.fa, .fa-solid, .fa-regular, .fa-light, .fa-thin, .fa-brands),
.kd-sortable + :is(.fa, .fa-solid, .fa-regular, .fa-light, .fa-thin, .fa-brands).fa-fw {
  vertical-align: middle;
}
/* 当前排序列颜色标记 */
.kd-sortable.kd-sort-active {
  color: var(
      --kendo-color-tertiary,
      #e16329
  );
}
/* 箭头公共样式 */
.kd-sortable.kd-sort-active::after {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  border: .3rem solid transparent;
}
/* 正序（上箭头） */
.kd-sortable.kd-sort-asc::after {
  top: -.65rem;
  /* ▼ 箭头向下（逻辑为升序） */
  border-bottom-color: var(
      --kendo-color-tertiary,
      #e16329
  );
}
/* 倒序（下箭头） */
.kd-sortable.kd-sort-desc::after {
  bottom: -.65rem;
  /* ▲ 箭头向上（逻辑为降序） */
  border-top-color: var(
      --kendo-color-tertiary,
      #e16329
  );
}
/* 高级排序样式 */
.kd-sortable-adv {
  border-radius: .25rem;
  padding: .2rem;
}

/* 操作功能按钮 */
.kd-btn-op {
  font-size: 1.5rem !important;
  vertical-align: middle;
  color: var(
      --kendo-color-primary,
      #4ba0b5
  );
  position: relative; /* 为伪元素提供定位上下文 */
  display: inline-block; /* 确保定位和布局正确，根据需要也可使用 inline-flex */
  cursor: pointer; /* 通常按钮需要指针样式 */
}
.kd-btn-op:hover {
  color: #c25463 !important;
}
/* 当按钮有数据时，添加 .kd-has-data 类 */
.kd-btn-op.kd-has-data::after {
  content: ''; /* 伪元素必需 */
  position: absolute; /* 绝对定位，相对于 .kd-btn-op */
  top: 0; /* 定位到右上角 - 垂直方向 */
  right: .2rem; /* 定位到右上角 - 水平方向 */
  width: .5rem;
  height: .5rem;
  background-color: var(
      --kendo-color-info,
      #4ba0b5
  );
  border-radius: 50%; /* 圆形 */
  transform: translate(60%, -40%); /* 微调位置：将角标稍微移出一点，避免完全重叠在边框上 */
  box-shadow: 0 0 .2rem rgba(0, 0, 0, 0.5); /* 添加一点阴影增加可见性 */
}
/* 悬停时角标颜色同步改变 */
.kd-btn-op.kd-has-data:hover::after {
  background-color: var(
      --kendo-color-error-emphasis,
      #c25463
  );
}

/* 可编辑的数据 */
.kd-editron:hover {
  cursor: copy;
}

/* 可点选的区域鼠标样式 */
.kd-toggle {
  cursor: pointer;
}

/* 高亮行 */
.highlight-row {
  background-color: var(
      --kendo-color-primary-subtle,
      #edf7f8
  ) !important;
}

/* KD 主色表格（特定情况才用） */
.kd-default-table {
  width: 99.5%;
  margin: .1rem .2rem;
}
.kd-default-table th,
.kd-default-table td {
  height: 3.5rem;
  padding: .2rem;
}
/* KD 主色 thead（特定情况才用） */
.kd-thead {
  background-color: #365e98;
}
.kd-thead th, .kd-thead td {
  color: #ffffff !important;
}

/* 编辑 NumericTextBox 时不显示右方步进器 */
.kd-editron .k-numerictextbox {
  padding-right: 0;
}

/* Kendo 日程编辑器使用粗体的 label 文字 */
.k-edit-label label {
  font-weight: bold;
}

/* ============================================================================================================================================================================ */
/* 分页设置 */

.kd-pagination .btn-group {
  padding: .2rem 0;
  height: 2rem;
}
.kd-pagination .kd-jump-page-box {
  border-radius: 0;
}
.kd-paging-box {
  padding: .3rem 0;
  height: 2.5rem;
}
/* 修正 bootstrap 与 Kendo 按钮组的结合 */
.btn-group .k-button + .btn-group,
.btn-group .btn-group + .k-button,
.btn-group .btn-group + .btn-group,
.btn-group .kd-page-button + .kd-page-button {
  margin-left: -.1rem;
}
.btn-group > .kd-page-button:not(:first-child):not(:last-child) {
  border-radius: 0;
}
.btn-group > .kd-page-button:first-child {
  margin-left: 0;
  padding-top: .4rem;
  padding-bottom: .4rem;
}
.btn-group > .kd-page-button:first-child:not(:last-child) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.btn-group > .kd-page-button:last-child:not(:first-child) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

/* ============================================================================================================================================================================ */
/* 暗黑模式设置 */

body.kd-dark-mode {
  background-color: var(
      --kendo-color-surface-alt
  ) !important;
  /* 保底其他覆盖不到的情况 */
  color: var(
      --kendo-color-on-base
  ) !important;
}

/* 组件背景色 */
body.kd-dark-mode .list-group-item {
  /* 不能设为 !important，否则 focusRow() 不能改变此颜色 */
  background-color: var(
      --kendo-color-base,
      #4d4d4d
  );
}

/* 鼠标悬停时高亮 */
body.kd-dark-mode .table-hover tbody tr:hover td,
body.kd-dark-mode .table-hover tbody tr:hover th {
  background-color: var(
      --kendo-color-base-hover,
      #3c3c3c
  ) !important;
}

/* 其他组件上的文字颜色 */
body.kd-dark-mode table td,
body.kd-dark-mode table th,
body.kd-dark-mode #toolbar label,
body.kd-dark-mode #toolbar .filter-text,
body.kd-dark-mode .list-group-item {
  color: var(
      --kendo-color-on-base
  );
}
/* 两个模式中次要文字折中方案 */
body.kd-dark-mode .kd-stat-title,
body.kd-dark-mode .kd-stat-title-special,
body.kd-dark-mode .k-text-dark-emphasis {
  color: #cccccc !important;
}

/* 表格内链接 */
body.kd-dark-mode th a {
  color: var(
      --kendo-color-info-active,
      #7adee8
  );
}

/* 课程信息组件 */
body.kd-dark-mode .kd-course-info {
  color: #ffffff !important;
  background: linear-gradient(
      to right,
      #bababa,
      #434343 90%,
      transparent 100%
  );
}
body.kd-dark-mode .kd-course-info.k-text-dark-emphasis {
  color: #ffffff !important;
}

/* 课室信息组件 */
body.kd-dark-mode .kd-classroom {
  color: #4d4d4d;
}