/* AI课程培训平台主题配置 - 全面覆盖版本 */
/* 基于 cmn.css 的完整主题重写 */

:root {
    /* 主要主题色 - 科技蓝系 */
    --primary-color: #2563eb;        /* 主蓝色，替换原来的 #116e63 */
    --primary-dark: #1d4ed8;         /* 深蓝色 */
    --primary-light: #60a5fa;        /* 浅蓝色 */
    --primary-gradient: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
    --primary-hover: #06b6d4;        /* 替换原来的 #00ffe1 */
    
    /* 辅助色 - AI科技感 */
    --secondary-color: #06b6d4;      /* 青蓝色 */
    --accent-color: #8b5cf6;         /* 紫色点缀 */
    --success-color: #10b981;        /* 成功绿 */
    --warning-color: #f59e0b;        /* 警告橙，替换原来的 #f2a227 */
    --danger-color: #ef4444;         /* 危险红 */
    
    /* 背景色 - 清新科技感 */
    --bg-primary: #f8fafc;           /* 主背景，替换原来的 #f6f7fb */
    --bg-secondary: #ffffff;         /* 卡片背景 */
    --bg-dark: #0f172a;              /* 深色背景 */
    --bg-light: #f1f5f9;             /* 浅色背景，替换原来的 #cfe2e0 */
    
    /* 文字色 - 现代感 */
    --text-primary: #1e293b;         /* 主要文字，替换原来的 #0d102d, #0d0f2c */
    --text-secondary: #64748b;       /* 次要文字，替换原来的 #54556a */
    --text-light: #94a3b8;           /* 浅色文字 */
    --text-white: #ffffff;           /* 白色文字 */
    
    /* 边框和阴影 */
    --border-color: #e2e8f0;         /* 边框色，替换原来的 #f1f4f5 */
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    --shadow-ai: 0 8px 32px rgba(37, 99, 235, 0.15);
}

/* ===========================================
   全局重置和基础样式覆盖
   =========================================== */

/* 背景色主题化 */
body.index {
    background-color: var(--bg-primary) !important;
}

/* ===========================================
   头部样式覆盖
   =========================================== */

/* 头部搜索框 */
.headerConSearch {
    border-left: var(--primary-color) solid 1px !important;
    border-top: var(--primary-color) solid 1px !important;
    border-bottom: var(--primary-color) solid 1px !important;
    transition: all 0.3s ease;
}

.headerConSearch:focus-within {
    border-color: var(--primary-light);
    box-shadow: var(--shadow-ai);
    transform: translateY(-1px);
}

/* 头部登录注册按钮 */
.headerConRegisterBtn, .headerConLoginBtn {
    border: var(--primary-color) solid 1px !important;
    color: var(--primary-color) !important;
    transition: all 0.3s ease;
}

.headerConLoginBtn {
    background-color: var(--primary-color) !important;
    color: var(--text-white) !important;
}

.headerConRegisterBtn:hover {
    background-color: var(--primary-color) !important;
    color: var(--text-white) !important;
}

.headerConRegisterBtn, .headerConNickname {
    color: var(--primary-color) !important;
}

/* ===========================================
   导航栏样式全覆盖
   =========================================== */

/* 主导航栏 menuList */
.menuList {
    background: var(--primary-gradient) !important;
    box-shadow: var(--shadow-ai);
}

.menuList ul li a, .subMenuList ul li a {
    color: var(--text-white) !important;
    transition: all 0.3s ease;
    position: relative;
}

.menuList ul li a:hover, .subMenuList ul li a:hover {
    color: var(--primary-hover) !important;
    transform: translateY(-1px);
}

.menuList ul li a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 2px;
    background: var(--primary-hover);
    transition: all 0.3s ease;
    transform: translateX(-50%);
}

.menuList ul li a:hover::after {
    width: 80%;
}

/* 子菜单样式 */
.subMenuList {
    background: var(--primary-gradient) !important;
    border-top: var(--primary-dark) solid 2px !important;
}

.menuList .subBlock {
    background: var(--primary-gradient) !important;
    border-top: var(--primary-dark) solid 2px !important;
    z-index: 1000 !important;
}

.menuList .subBlock ul.sub li a:hover,
.subMenuList ul li a:hover {
    background: rgba(255, 255, 255, 0.1);
}

/* ===========================================
   首页内容区域样式覆盖
   =========================================== */

/* 轮播图分页指示器 */
.bannerBlock .swiper-pagination-bullet-active {
    background: var(--primary-color) !important;
}

/* 菜单悬停效果 */
.indexBlock1 {
	margin: 20px auto 0;
}
.indexBlock1 .menuBlock ul li.ac,
.indexBlock1 .menuBlock ul li:hover {
    background-color: var(--bg-light) !important;
    color: var(--primary-color) !important;
}

/* Tab 列表样式 */
.indexBlock2 ul.tabList li.ac {
    color: var(--primary-color) !important;
    border-bottom: var(--primary-color) solid 3px !important;
}

/* 文字颜色 */
.indexBlock2 ul.tabList li,
.tab .tabL .tit,
.tab .tabR ul li .tit {
    color: var(--text-primary) !important;
}

.tab .tabL .content,
.tab .tabR ul li .content,
.tab .tabR ul li .titNew {
    color: var(--text-secondary) !important;
}

/* 标题和文字 */
.indexBlock3InnL .tit,
.indexBlock4InnL .tit,
.indexBlock5InnL .tit {
    color: var(--text-primary) !important;
}

.indexBlock3InnL .menu.ac {
    color: var(--primary-color) !important;
}

/* 按钮样式 */
.indexBlock3Inn .indexBlock3Content ul li .btn {
    background-color: var(--primary-color) !important;
    color: var(--text-white) !important;
    transition: all 0.3s ease;
}

.indexBlock3Inn .indexBlock3Content ul li .btn:hover {
    background-color: var(--text-white) !important;
    color: var(--warning-color) !important;
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.indexBlock4Inn .indexBlock4Content ul li .btn a {
    color: var(--primary-color) !important;
}

.indexBlock5Content ul li .contentIndex .btn {
    background-color: var(--primary-color) !important;
    color: var(--text-white) !important;
}

/* 进度条 */
.swiper-pagination-progress .swiper-pagination-progressbar {
    background: var(--primary-color) !important;
}

/* 卡片背景 */
.indexBlock3Inn .indexBlock3Content ul li,
.indexBlock4Inn .indexBlock4Content ul li {
    background-color: var(--bg-primary) !important;
    transition: all 0.3s ease;
}

.indexBlock3Inn .indexBlock3Content ul li:hover,
.indexBlock4Inn .indexBlock4Content ul li:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-ai);
}

/* ===========================================
   内容页面样式覆盖
   =========================================== */

/* Tab 列表 */
.content .contentInn .contentInnL ul.tabList {
    border-bottom: var(--border-color) solid 2px !important;
}

.content .contentInn .contentInnL ul.tabList li {
    color: var(--text-primary) !important;
}

.content .contentInn .contentInnL ul.tabList li.ac {
    color: var(--primary-color) !important;
    border-bottom: var(--primary-color) solid 4px !important;
}

/* 新闻列表悬停效果 */
.content .contentInn .contentInnL ul.newsList li.info:hover,
.content .contentInn .contentInnL ul.newsList li.img:hover {
    background-color: rgba(37, 99, 235, 0.05) !important;
}

/* 新闻标题和日期 */
.content .contentInn .contentInnL ul.newsList li.info div.txt,
.content .contentInn .contentInnL ul.newsList li.img div.info .tit {
    color: var(--text-primary) !important;
}

.content .contentInn .contentInnL ul.newsList li.info div.date,
.content .contentInn .contentInnL ul.newsList li.img div.info .date {
    color: var(--text-secondary) !important;
}

/* 右侧栏 */
.content .contentInn .contentInnR .contentInnRInn {
    background-color: var(--bg-primary) !important;
}

.content .contentInn .contentInnR .titIcon,
.content .contentInn .contentInnR ul.titList li div.tag {
    background-color: var(--primary-color) !important;
}

.content .contentInn .contentInnR ul.titList li div.titInfo {
    color: var(--text-primary) !important;
}

.content .contentInn .contentInnR ul.titList li div.titInfo:hover {
    color: var(--primary-color) !important;
}

.content .contentInn .contentInnR .contentInnRInn>div>div.tit::after {
    background-color: var(--primary-color) !important;
}

/* ===========================================
   面包屑导航
   =========================================== */

.crumbsBlock li.ac {
    color: var(--primary-color) !important;
}

.crumbsBlock li a {
    color: var(--text-secondary) !important;
}

/* ===========================================
   底部样式覆盖
   =========================================== */

.footerHeader {
    background: var(--primary-gradient) !important;
}

/* ===========================================
   分页样式覆盖
   =========================================== */

.pagination .active {
    background-color: var(--primary-color) !important;
    color: var(--text-white) !important;
    border-color: var(--primary-color) !important;
}

.page>b>strong {
    background-color: var(--primary-color) !important;
    color: var(--text-white) !important;
    border-color: var(--primary-color) !important;
}

/* ===========================================
   课程中心样式覆盖
   =========================================== */

body.courseCenterPage ul.courseList li {
    background-color: var(--bg-primary) !important;
    transition: all 0.3s ease;
}

body.courseCenterPage ul.courseList li:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-ai);
}

body.courseCenterPage ul.courseList li .courseInfo .tit,
body.courseCenterPage .contentInnRInn .titList li .tit {
    color: var(--text-primary) !important;
}

body.courseCenterPage ul.courseList li .courseInfo .play,
body.courseCenterPage .contentInnRInn .titList li .play {
    color: var(--text-secondary) !important;
}

body.courseCenterPage ul.courseList li.zb .courseInfo .btn,
body.courseCenterPage ul.courseList li.lb .courseInfo .btn {
    background-color: var(--primary-color) !important;
    color: var(--text-white) !important;
}

body.courseCenterPage ul.courseList li.zb .courseInfo .btn:hover,
body.courseCenterPage ul.courseList li.lb .courseInfo .btn:hover {
    background-color: var(--text-white) !important;
    color: var(--warning-color) !important;
}

body.courseCenterPage ul.courseList li.lb .courseInfo .btn {
    background-color: var(--text-white) !important;
    color: var(--primary-color) !important;
}

/* ===========================================
   课程详情页样式覆盖
   =========================================== */

body.courseDetailsPage .courseDetailsHeader {
    background-color: var(--bg-primary) !important;
}

body.courseDetailsPage .courseDetailsHeader .courseDetailsHeaderInn .courseDetailsHeaderInfo .tit {
    color: var(--text-primary) !important;
}

body.courseDetailsPage .courseDetailsContent .headerBlock,
body.queryPage .queryContent .headerBlock {
    border-bottom: var(--border-color) solid 2px !important;
}

body.courseDetailsPage .courseDetailsContentHeaderTit,
body.queryPage .queryContentHeaderTit {
    color: var(--text-primary) !important;
}

body.courseDetailsPage .courseDetailsContentHeaderMore {
    color: var(--primary-color) !important;
}

body.courseDetailsPage .courseDetailsContentInfo .courseDetailsContentList .tit {
    color: var(--text-primary) !important;
    border-bottom: var(--border-color) solid 1px !important;
}

body.courseDetailsPage .courseDetailsContentInfo .courseDetailsContentList .tit:hover {
    color: var(--primary-color) !important;
}

body.courseDetailsPage .courseDetailsContentInfo .courseDetailsContentList ul {
    background-color: var(--bg-primary) !important;
}

body.courseDetailsPage .courseDetailsContentInfo .courseDetailsContentList ul li:hover {
    background-color: rgba(37, 99, 235, 0.1) !important;
}

/* ===========================================
   我的课程页面样式覆盖
   =========================================== */

body.myCoursePage .contentInnHeader ul.tabList {
    border-bottom: var(--border-color) solid 1px !important;
}

body.myCoursePage .contentInnHeader ul.tabList li {
    color: var(--text-primary) !important;
}

body.myCoursePage .contentInnHeader ul.tabList li.ac {
    color: var(--primary-color) !important;
    border-bottom: var(--primary-color) solid 3px !important;
}

body.myCoursePage .contentInnContent ul li {
    background-color: var(--bg-primary) !important;
}

body.myCoursePage .contentInnContent ul li .courseInfo .tit {
    color: var(--text-primary) !important;
}

body.myCoursePage .contentInnContent ul li .courseInfo .btn {
    background-color: var(--primary-color) !important;
    color: var(--text-white) !important;
}

body.myCoursePage .contentInnContent ul li .courseInfo .btn:hover {
    background-color: var(--text-white) !important;
    color: var(--warning-color) !important;
}

/* ===========================================
   查询页面样式覆盖
   =========================================== */

body.queryPage .queryContentTop .formBlock ul li input {
    border: var(--primary-color) solid 1px !important;
}

body.queryPage .queryContentTop .formBlock .btn {
    background-color: var(--primary-color) !important;
}

body.queryPage table.queryTable tr th {
    background-color: var(--bg-light) !important;
    color: var(--text-secondary) !important;
}

body.queryPage table.queryTable tr td {
    color: var(--text-primary) !important;
    border-bottom: var(--border-color) solid 1px !important;
}

/* ===========================================
   认证页面样式覆盖
   =========================================== */

body.certificationPage .certificationHeaderTit {
    color: var(--text-primary) !important;
}

body.certificationPage .certificationContentListBlock {
    background-color: var(--bg-primary) !important;
}

body.certificationPage .certificationContentListBlock .certificationContentList ul li .courseInfo .tit {
    color: var(--text-primary) !important;
}

body.certificationPage .certificationContentListBlock .certificationContentList ul li .courseInfo .btn {
    background-color: var(--primary-color) !important;
    color: var(--text-white) !important;
}

body.certificationPage .certificationContentListBlock .certificationContentList ul li .courseInfo .btn:hover {
    background-color: var(--text-white) !important;
    color: var(--warning-color) !important;
}

/* ===========================================
   联系我们页面样式覆盖
   =========================================== */

body.contactusPage .contactusContent .headerBlock .info .mailtxt a,
body.contactusPage .contactusContent .headerBlock .info .mailtxt span {
    color: var(--primary-color) !important;
}

body.contactusPage .contactusContentListBlock {
    background-color: var(--bg-primary) !important;
}

body.contactusPage .contactusContentList .headerTit {
    color: var(--text-primary) !important;
    border-bottom: var(--border-color) solid 2px !important;
}

body.contactusPage table.contactusTable td input,
body.contactusPage table.contactusTable td textarea {
    border: var(--primary-color) solid 1px !important;
}

body.contactusPage .contactusContentList .btn {
    background-color: var(--primary-color) !important;
}

/* ===========================================
   播放页面样式覆盖
   =========================================== */

body.playPage .playContent .playContentHeaderTit {
    color: var(--text-primary) !important;
    border-bottom: var(--border-color) solid 2px !important;
}

body.playPage .playContent .playContentMian .kListBlock .list li .klist p:hover,
body.playPage .playContent .playContentMian .kListBlock .list li .klist div:hover {
    color: var(--warning-color) !important;
}

body.playPage .playContent .playContentMian .kListBlock .list li .klist div.ac {
    color: var(--warning-color) !important;
}

/* ===========================================
   响应式和通用增强
   =========================================== */

/* 链接颜色统一 */
a {
    color: var(--primary-color);
    transition: all 0.3s ease;
}

a:hover {
    color: var(--primary-dark);
    text-decoration: none;
}

/* 悬停效果名称链接 */
.courseList .nameLink:hover,
.certificationPage .nameLink:hover {
    color: var(--primary-color) !important;
}

/* 按钮通用样式增强 */
.btn, button, input[type="submit"], input[type="button"] {
    border-radius: 8px;
    transition: all 0.3s ease;
}

.btn:hover, button:hover, input[type="submit"]:hover, input[type="button"]:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

/* 表单元素增强 */
input, textarea, select {
    border-radius: 6px;
    transition: all 0.3s ease;
}

input:focus, textarea:focus, select:focus {
    outline: none;
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

/* 卡片通用增强 */
.courseInfo, .indexBlock3Inn .indexBlock3Content ul li, .indexBlock4Inn .indexBlock4Content ul li {
    border-radius: 15px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 响应式调整 */
@media (max-width: 768px) {
    .menuList ul li a::after {
        display: none;
    }
    
    .indexBlock3Inn .indexBlock3Content ul li:hover,
    .indexBlock4Inn .indexBlock4Content ul li:hover {
        transform: translateY(-3px);
    }
}

/* ===========================================
   首页模块样式覆盖（来自 cmn-fix.css）
   =========================================== */

/* 专家智库模块 */
.indexExpert {
    width: 1120px;
    margin: 0 auto;
    font-size: 14px;
}

.indexExpert .swiper-container {
    padding: 50px 0;
}

.indexExpertItem {
    width: 265px;
    margin-right: 20px;
    background-color: var(--bg-secondary) !important;
    border-radius: 8px;
    display: block;
    overflow: hidden;
    color: var(--text-primary) !important;
    transition: all 0.3s ease;
}

.indexExpertItem:hover {
    -webkit-box-shadow: var(--shadow-ai);
    box-shadow: var(--shadow-ai);
}

.indexExpertBrand .brand-img > img {
    width: 100%;
}

.indexExpertContent {
    padding: 16px 16px 24px;
}

.indexExpertContent .name {
    font-size: 18px;
    margin-bottom: 16px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    color: var(--text-primary) !important;
}

.indexExpertContent .course {
    border-top: 1px solid var(--border-color);
}

.indexExpertContent .course-name {
    font-size: 16px;
    padding-top: 16px;
    padding-bottom: 8px;
    color: var(--text-primary) !important;
}

.indexExpertContent .course-summary {
    height: 44px;
    line-height: 22px;
    word-wrap: break-word;
    word-break: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    color: var(--text-secondary) !important;
}

.indexExpert .swiper-button-prev,
.indexExpert .swiper-button-next {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    cursor: pointer;
    background-color: var(--bg-secondary);
    background-image: none;
    -webkit-box-shadow: var(--shadow-md);
    box-shadow: var(--shadow-md);
}

.indexExpert .swiper-button-prev::after,
.indexExpert .swiper-button-next::after {
    position: absolute;
    top: calc(50% - 6px);
    width: 12px;
    height: 12px;
    border-bottom: 2.5px solid var(--text-secondary);
    border-left: 2.5px solid var(--text-secondary);
    border-radius: 2px;
    display: block;
    content: '';
    z-index: 200;
}

.indexExpert .swiper-button-prev::after {
    right: calc(50% - 10px);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.indexExpert .swiper-button-next::after {
    left: calc(50% - 10px);
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
}

.indexExpert .swiper-button-prev:hover::after,
.indexExpert .swiper-button-next:hover::after {
    border-color: var(--primary-color) !important;
}

.indexExpert .swiper-button-next.swiper-button-disabled,
.indexExpert .swiper-button-prev.swiper-button-disabled {
    cursor: not-allowed;
    pointer-events: inherit;
}

/* 课程中心模块 */
.indexCourse {
    width: 1120px;
    margin: 0 auto;
    font-size: 14px;
}

.indexCourse .swiper-container {
    padding: 50px 0;
}

.indexCourseItem {
    width: 265px;
    margin-right: 20px;
    background-color: var(--bg-secondary) !important;
    border-radius: 8px;
    display: block;
    overflow: hidden;
    color: var(--text-primary) !important;
    transition: all 0.3s ease;
}

.indexCourseItem:hover {
    -webkit-box-shadow: var(--shadow-ai);
    box-shadow: var(--shadow-ai);
}

.indexCourseBrand .brand-img > img {
    width: 100%;
}

.indexCourseContent {
    padding: 16px 16px 24px;
}

.indexCourseContent .name {
    font-size: 18px;
    height: 48px;
    margin-bottom: 16px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    color: var(--text-primary) !important;
}

.indexCourseContent .detail {
    padding-top: 8px;
}

.indexCourseContent .detail .link {
    width: 100%;
    font-weight: 500;
    padding: 7px 5px 8px;
    border-radius: 4px;
    color: var(--primary-color) !important;
    background-color: var(--bg-light) !important;
    border: 0;
    cursor: pointer;
    vertical-align: middle;
    transition: all 0.3s ease;
}

.indexCourseContent .detail .link:hover {
    color: var(--text-white) !important;
    background-color: var(--primary-color) !important;
}

.indexCourse .swiper-button-prev,
.indexCourse .swiper-button-next {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    cursor: pointer;
    background-color: var(--bg-secondary);
    background-image: none;
    -webkit-box-shadow: var(--shadow-md);
    box-shadow: var(--shadow-md);
}

.indexCourse .swiper-button-prev::after,
.indexCourse .swiper-button-next::after {
    position: absolute;
    top: calc(50% - 6px);
    width: 12px;
    height: 12px;
    border-bottom: 2.5px solid var(--text-secondary);
    border-left: 2.5px solid var(--text-secondary);
    border-radius: 2px;
    display: block;
    content: '';
    z-index: 200;
}

.indexCourse .swiper-button-prev::after {
    right: calc(50% - 10px);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.indexCourse .swiper-button-next::after {
    left: calc(50% - 10px);
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
}

.indexCourse .swiper-button-prev:hover::after,
.indexCourse .swiper-button-next:hover::after {
    border-color: var(--primary-color) !important;
}

.indexCourse .swiper-button-next.swiper-button-disabled,
.indexCourse .swiper-button-prev.swiper-button-disabled {
    cursor: not-allowed;
    pointer-events: inherit;
}

/* 培训认证模块 */
.indexCertificate {
    width: 1120px;
    margin: 0 auto;
    font-size: 14px;
}

.indexCertificate-container {
    padding: 50px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.indexCertificateItem {
    width: 265px;
    margin-right: 20px;
    background-color: var(--bg-secondary) !important;
    border-radius: 8px;
    display: block;
    overflow: hidden;
    color: var(--text-primary) !important;
    transition: all 0.3s ease;
}

.indexCertificateItem:hover {
    -webkit-box-shadow: var(--shadow-ai);
    box-shadow: var(--shadow-ai);
}

.indexCertificateBrand .brand-img > img {
    width: 100%;
}

.indexCertificateContent {
    padding: 16px 16px 24px;
}

.indexCertificateContent .name {
    font-size: 18px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    color: var(--text-primary) !important;
}

.indexCertificateContent .course-summary {
    height: 132px;
    line-height: 22px;
    margin-top: 14px;
    margin-bottom: 16px;
    word-wrap: break-word;
    word-break: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    color: var(--text-secondary) !important;
}

.indexCertificateContent .detail {
    padding-top: 8px;
}

.indexCertificateContent .detail .link {
    width: 100%;
    font-weight: 500;
    padding: 7px 5px 8px;
    border-radius: 4px;
    color: var(--primary-color) !important;
    background-color: var(--bg-light) !important;
    border: 0;
    cursor: pointer;
    vertical-align: middle;
    transition: all 0.3s ease;
}

.indexCertificateContent .detail .link:hover {
    color: var(--text-white) !important;
    background-color: var(--primary-color) !important;
}

.indexCertificate .swiper-button-prev,
.indexCertificate .swiper-button-next {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    cursor: pointer;
    background-color: var(--bg-secondary);
    background-image: none;
    -webkit-box-shadow: var(--shadow-md);
    box-shadow: var(--shadow-md);
}

.indexCertificate .swiper-button-prev::after,
.indexCertificate .swiper-button-next::after {
    position: absolute;
    top: calc(50% - 6px);
    width: 12px;
    height: 12px;
    border-bottom: 2.5px solid var(--text-secondary);
    border-left: 2.5px solid var(--text-secondary);
    border-radius: 2px;
    display: block;
    content: '';
    z-index: 200;
}

.indexCertificate .swiper-button-prev::after {
    right: calc(50% - 10px);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.indexCertificate .swiper-button-next::after {
    left: calc(50% - 10px);
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
}

.indexCertificate .swiper-button-prev:hover::after,
.indexCertificate .swiper-button-next:hover::after {
    border-color: var(--primary-color) !important;
}

.indexCertificate .swiper-button-next.swiper-button-disabled,
.indexCertificate .swiper-button-prev.swiper-button-disabled {
    cursor: not-allowed;
    pointer-events: inherit;
}

/* 底部footer样式 */
.footer {
    padding-top: 50px;
    padding-bottom: 50px;
    background: linear-gradient(180deg, rgba(37, 99, 235, 0.1), rgba(0, 0, 0, 0)) !important;
}

.footer .footer-header {
    width: 1120px;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.footer .footer-contact {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.footer .footer-contact .title {
    font-size: 18px;
    padding-bottom: 16px;
    color: var(--text-primary) !important;
}

.footer .footer-contact .list {
    font-size: 13px;
}

.footer .footer-contact .list-item {
    margin-bottom: 12px;
    color: var(--text-secondary) !important;
}

.footer .footer-links {
    width: 320px;
}

.footer .footer-links .title {
    font-size: 18px;
    padding-bottom: 16px;
    color: var(--text-primary) !important;
}

.footer .footer-links .list {
    font-size: 13px;
}

.footer .footer-links .list-item {
    color: var(--text-secondary) !important;
    display: block;
    margin-bottom: 12px;
    transition: all 0.3s ease;
}

.footer .footer-links .list-item:hover {
    color: var(--primary-color) !important;
}

.footer .footer-qr .title {
    font-size: 18px;
    padding-bottom: 16px;
    color: var(--text-primary) !important;
}

.footer .footer-qr .list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.footer .footer-qr .list-item:first-child {
    margin-right: 40px;
}

.footer .footer-qr .qr-img {
    width: 100px;
    padding: 8px;
    background-color: var(--bg-secondary);
}

.footer .footer-qr .qr-img > img {
    width: 100%;
}

.footer .footer-qr .qr-summary {
    font-size: 12px;
    margin-top: 10px;
    text-align: center;
    color: var(--text-secondary) !important;
}

.footer .footer-content {
    width: 1120px;
    margin: 60px auto 0;
    font-size: 13px;
    text-align: center;
}

.footer .footer-content > p {
    margin-bottom: 12px;
}

.footer .footer-content > p span {
    line-height: 22px;
    color: var(--text-secondary) !important;
}

.footer .footer-content > p span::after {
    display: inline-block;
    position: relative;
    top: 1px;
    width: 1px;
    height: 11px;
    margin-right: 8px;
    padding-right: 8px;
    border-right: 1px var(--border-color) solid;
    content: '';
}

.footer .footer-content > p span:last-child::after {
    border-right: 0;
}

.footer .footer-content > p a {
    color: var(--text-secondary) !important;
    transition: all 0.3s ease;
}

.footer .footer-content > p a:hover {
    color: var(--primary-color) !important;
}