/**
 * EduTraining 教学培训平台 - 前端样式
 * 使用主题 CSS 变量，支持动态风格切换
 *
 * @package EduTraining
 */

/* ========================================
   基础布局与通用
   ======================================== */

/* 独立页面（报名/教师申请/作品展示）隐藏主题默认的页面标题和日期 */
body.edt-hide-header .entry-title,
body.edt-hide-header .page-title,
body.edt-hide-header .post-title,
body.edt-hide-header .article-title,
body.edt-hide-header .entry-meta,
body.edt-hide-header .post-meta,
body.edt-hide-header .entry-header,
body.edt-hide-header .page-header,
body.edt-hide-header .post-header,
body.edt-hide-header .article-header,
body.edt-hide-header .entry-date,
body.edt-hide-header .post-date,
body.edt-hide-header .posted-on,
body.edt-hide-header .byline,
body.edt-hide-header .date,
body.edt-hide-header .meta,
body.edt-hide-header article > header,
body.edt-hide-header .hentry > header,
body.edt-hide-header time.entry-date,
body.edt-hide-header .wp-block-post-title,
body.edt-hide-header .wp-block-post-date,
body.edt-hide-header .single-post-header,
body.edt-hide-header .content-header {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/* 独立页面覆盖主题背景色，使用纯净白色 */
body.edt-page-active,
body.edt-page-active #site-content,
body.edt-page-active .site-content,
body.edt-page-active .content-area,
body.edt-page-active .site-main,
body.edt-page-active #content,
body.edt-page-active #primary,
body.edt-page-active .entry-content,
body.edt-page-active .page-content,
body.edt-page-active .post-content,
body.edt-page-active article,
body.edt-page-active .hentry,
body.edt-page-active main,
body.edt-page-active .main-content,
body.edt-page-active .tah-page-content,
body.edt-page-active .tah-main-content {
    background: #fff !important;
    background-color: #fff !important;
}

.edt-section {
    max-width: 100%;
}

.edt-section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 2px solid var(--border-light, #e5e7eb);
    flex-wrap: wrap;
    gap: 12px;
}

.edt-section-title {
    margin: 0;
    font-size: 24px;
    font-weight: 600;
    color: var(--text-primary, #1a1a2e);
    display: flex;
    align-items: center;
    gap: 10px;
}

.edt-section-title svg {
    color: var(--primary-color, #0066cc);
}

/* ========================================
   筛选栏
   ======================================== */

.edt-filter-bar {
    display: flex;
    gap: 8px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.edt-filter-tag {
    padding: 6px 16px;
    border-radius: var(--radius-full, 9999px);
    font-size: var(--text-sm, 0.875rem);
    color: var(--text-secondary, #4a4a68);
    background: var(--bg-tertiary, #eef1f6);
    border: 1px solid transparent;
    text-decoration: none;
    transition: all var(--transition-fast, 0.2s);
    white-space: nowrap;
}

.edt-filter-tag:hover {
    color: var(--primary-color, #0066cc);
    background: var(--primary-light, rgba(0, 102, 204, 0.08));
}

.edt-filter-tag.active {
    color: #fff;
    background: var(--primary-color, #0066cc);
    border-color: var(--primary-color, #0066cc);
}

/* ========================================
   子标签导航
   ======================================== */

.edt-sub-tabs {
    display: flex;
    gap: 4px;
    border-bottom: 2px solid var(--border-light, #e5e7eb);
    margin-bottom: 24px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.edt-sub-tab {
    padding: 10px 18px;
    color: var(--text-muted, #6b7280);
    text-decoration: none;
    font-size: var(--text-sm, 0.875rem);
    font-weight: 500;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all var(--transition-fast, 0.2s);
    white-space: nowrap;
}

.edt-sub-tab:hover {
    color: var(--primary-color, #0066cc);
}

.edt-sub-tab.active {
    color: var(--primary-color, #0066cc);
    border-bottom-color: var(--primary-color, #0066cc);
}

/* ========================================
   课程卡片网格
   ======================================== */

.edt-course-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
}

.edt-course-card {
    background: var(--card-bg, #fff);
    border: 1px solid var(--card-border, #e5e7eb);
    border-radius: var(--radius-lg, 14px);
    overflow: hidden;
    transition: all var(--transition-normal, 0.25s);
    display: flex;
    flex-direction: column;
}

.edt-course-card:hover {
    box-shadow: var(--card-hover-shadow, 0 8px 30px rgba(0, 0, 0, 0.12));
    transform: translateY(-2px);
}

.edt-course-thumb {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: var(--bg-tertiary, #eef1f6);
}

.edt-course-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.edt-thumb-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: var(--text-muted, #6b7280);
    opacity: 0.4;
}

.edt-course-body {
    padding: 16px;
    flex: 1;
}

.edt-course-title {
    margin: 0 0 8px;
    font-size: var(--text-base, 1rem);
    font-weight: 600;
    line-height: 1.4;
}

.edt-course-title a {
    color: var(--text-primary, #1a1a2e);
    text-decoration: none;
}

.edt-course-title a:hover {
    color: var(--primary-color, #0066cc);
}

.edt-course-meta {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.edt-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: var(--text-xs, 0.75rem);
    color: var(--text-muted, #6b7280);
}

.edt-course-footer {
    padding: 12px 16px;
    border-top: 1px solid var(--border-light, #e5e7eb);
    display: flex;
    justify-content: flex-end;
}

/* ========================================
   徽章与标签
   ======================================== */

.edt-badge {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: var(--radius-full, 9999px);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.4;
}

.edt-badge-success { background: var(--success-light, #ecfdf5); color: var(--success-dark, #065f46); }
.edt-badge-warning { background: var(--warning-light, #fffbeb); color: var(--warning-dark, #92400e); }
.edt-badge-danger  { background: var(--danger-light, #fef2f2); color: var(--danger-dark, #991b1b); }
.edt-badge-info    { background: var(--info-light, #eff6ff); color: var(--info-dark, #1e40af); }
.edt-badge-muted   { background: var(--bg-tertiary, #eef1f6); color: var(--text-muted, #6b7280); }

.edt-course-thumb .edt-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 1;
}

.edt-mode-tag {
    position: absolute;
    top: 10px;
    right: 10px;
    padding: 3px 10px;
    background: rgba(0,0,0,0.6);
    color: #fff;
    border-radius: var(--radius-full, 9999px);
    font-size: 12px;
    z-index: 1;
}

.edt-tag {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    background: var(--bg-tertiary, #eef1f6);
    color: var(--text-secondary, #4a4a68);
    border-radius: var(--radius-sm, 6px);
    font-size: var(--text-xs, 0.75rem);
    font-weight: 500;
}

.edt-tag-sm { padding: 2px 8px; font-size: 11px; }
.edt-tag-enrolling { background: var(--success-light, #ecfdf5); color: var(--success-dark, #065f46); }
.edt-tag-ongoing   { background: var(--warning-light, #fffbeb); color: var(--warning-dark, #92400e); }
.edt-tag-completed { background: var(--bg-tertiary, #eef1f6); color: var(--text-muted, #6b7280); }

/* ========================================
   进度条
   ======================================== */

.edt-progress-bar {
    height: 6px;
    background: var(--bg-tertiary, #eef1f6);
    border-radius: 3px;
    overflow: hidden;
    margin-top: 12px;
}

.edt-progress-sm { height: 4px; margin-top: 0; display: inline-block; width: 80px; vertical-align: middle; }

.edt-progress-fill {
    height: 100%;
    background: var(--primary-gradient, linear-gradient(135deg, #0066cc, #0052a3));
    border-radius: 3px;
    transition: width var(--transition-slow, 0.3s);
}

.edt-progress-text {
    font-size: var(--text-xs, 0.75rem);
    color: var(--text-muted, #6b7280);
    margin-top: 4px;
    display: block;
}

/* ========================================
   价格
   ======================================== */

.edt-price {
    font-size: 22px;
    font-weight: 700;
    color: var(--error-color, #ef4444);
}

.edt-price-free {
    color: var(--success-color, #10b981);
}

/* ========================================
   课程头部
   ======================================== */

.edt-course-header {
    display: flex;
    gap: 24px;
    margin-bottom: 24px;
    padding: 24px;
    background: var(--card-bg, #fff);
    border: 1px solid var(--card-border, #e5e7eb);
    border-radius: var(--radius-lg, 14px);
}

.edt-course-header-thumb {
    width: 200px;
    min-width: 200px;
    border-radius: var(--radius-md, 10px);
    overflow: hidden;
}

.edt-course-header-thumb img {
    width: 100%;
    height: auto;
    display: block;
}

.edt-course-header-info {
    flex: 1;
}

.edt-course-header-info h2 {
    margin: 0 0 12px;
    font-size: var(--text-2xl, 1.5rem);
    color: var(--text-primary, #1a1a2e);
}

.edt-course-tags {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}

.edt-course-stats-row {
    display: flex;
    gap: 16px;
    font-size: var(--text-sm, 0.875rem);
    color: var(--text-muted, #6b7280);
    flex-wrap: wrap;
}

.edt-enroll-action {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 16px;
}

/* ========================================
   面包屑
   ======================================== */

.edt-breadcrumb {
    margin-bottom: 16px;
}

.edt-breadcrumb a {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--text-muted, #6b7280);
    text-decoration: none;
    font-size: var(--text-sm, 0.875rem);
}

.edt-breadcrumb a:hover {
    color: var(--primary-color, #0066cc);
}

/* ========================================
   大纲列表
   ======================================== */

.edt-syllabus-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.edt-syllabus-chapter {
    border: 1px solid var(--border-light, #e5e7eb);
    border-radius: var(--radius-md, 10px);
    overflow: hidden;
}

.edt-syllabus-item {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 16px;
    background: var(--bg-secondary, #f8f9fc);
    border-radius: var(--radius-md, 10px);
    transition: background var(--transition-fast, 0.2s);
}

.edt-syllabus-item-chapter {
    border-radius: 0;
    padding: 16px 20px;
    background: var(--bg-secondary, #f8f9fc);
}

.edt-syllabus-item:hover {
    background: var(--bg-hover, #f3f4f6);
}

/* 章节缩略图 */
.edt-syllabus-thumb {
    width: 100px;
    height: 68px;
    min-width: 100px;
    border-radius: var(--radius-sm, 6px);
    overflow: hidden;
    flex-shrink: 0;
}
.edt-syllabus-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 子章节缩略图 */
.edt-syllabus-sub-thumb {
    width: 48px;
    height: 36px;
    min-width: 48px;
    border-radius: 4px;
    overflow: hidden;
    flex-shrink: 0;
}
.edt-syllabus-sub-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.edt-syllabus-number {
    width: 32px;
    height: 32px;
    min-width: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-color, #0066cc);
    color: #fff;
    border-radius: 50%;
    font-weight: 600;
    font-size: var(--text-sm, 0.875rem);
}

.edt-syllabus-content {
    flex: 1;
    min-width: 0;
}

.edt-syllabus-content h4 {
    margin: 0 0 4px;
    font-size: var(--text-base, 1rem);
    color: var(--text-primary, #1a1a2e);
}

.edt-syllabus-content p {
    margin: 0;
    font-size: var(--text-sm, 0.875rem);
    color: var(--text-muted, #6b7280);
}

.edt-syllabus-sub-title {
    font-size: var(--text-sm, 0.875rem);
    color: var(--text-primary, #1a1a2e);
    font-weight: 500;
}

.edt-syllabus-duration {
    margin-left: auto;
    color: var(--text-muted, #6b7280);
    font-size: var(--text-sm, 0.875rem);
    white-space: nowrap;
    flex-shrink: 0;
}

/* 子章节列表 */
.edt-syllabus-children {
    background: var(--bg-primary, #fff);
}
.edt-syllabus-item-sub {
    padding: 10px 20px 10px 68px;
    border-radius: 0;
    border-top: 1px solid var(--border-light, #f0f0f1);
    background: transparent;
    align-items: center;
    gap: 12px;
}
.edt-syllabus-item-sub:hover {
    background: var(--bg-hover, #fafafa);
}

.edt-syllabus-edit-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px;
    background: var(--bg-secondary, #f8f9fc);
    border-radius: var(--radius-sm, 6px);
    margin-bottom: 8px;
}

.edt-syllabus-edit-item input {
    padding: 6px 10px;
    border: 1px solid var(--border-light, #e5e7eb);
    border-radius: var(--radius-sm, 6px);
    font-size: var(--text-sm, 0.875rem);
    flex: 1;
    background: var(--input-bg, #fff);
    color: var(--input-text, #1a1a2e);
}

/* ========================================
   教学资料列表
   ======================================== */

.edt-materials-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.edt-material-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    background: var(--card-bg, #fff);
    border: 1px solid var(--border-light, #e5e7eb);
    border-radius: var(--radius-md, 10px);
    transition: all var(--transition-fast, 0.2s);
}

.edt-material-item:hover {
    box-shadow: var(--shadow-sm, 0 1px 3px rgba(0,0,0,0.08));
}

.edt-material-icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-light, rgba(0,102,204,0.08));
    color: var(--primary-color, #0066cc);
    border-radius: var(--radius-sm, 6px);
}

.edt-material-info {
    flex: 1;
    min-width: 0;
}

.edt-material-info h4 {
    margin: 0 0 4px;
    font-size: var(--text-sm, 0.875rem);
    color: var(--text-primary, #1a1a2e);
    font-weight: 600;
}

.edt-material-meta {
    display: flex;
    gap: 12px;
    font-size: var(--text-xs, 0.75rem);
    color: var(--text-muted, #6b7280);
}

/* ========================================
   作业列表
   ======================================== */

.edt-homework-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.edt-homework-item {
    padding: 18px;
    background: var(--card-bg, #fff);
    border: 1px solid var(--border-light, #e5e7eb);
    border-radius: var(--radius-md, 10px);
    transition: all var(--transition-fast, 0.2s);
}

.edt-homework-item:hover {
    box-shadow: var(--shadow-sm, 0 1px 3px rgba(0,0,0,0.08));
}

.edt-homework-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 8px;
}

.edt-homework-header h4 {
    margin: 0;
    font-size: var(--text-base, 1rem);
    color: var(--text-primary, #1a1a2e);
}

.edt-homework-desc {
    font-size: var(--text-sm, 0.875rem);
    color: var(--text-secondary, #4a4a68);
    line-height: 1.6;
    margin-bottom: 12px;
}

.edt-homework-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.edt-deadline {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: var(--text-xs, 0.75rem);
    color: var(--text-muted, #6b7280);
}

.edt-deadline.expired {
    color: var(--error-color, #ef4444);
}

.edt-feedback-box {
    margin-top: 12px;
    padding: 12px;
    background: var(--info-light, #eff6ff);
    border-radius: var(--radius-sm, 6px);
    font-size: var(--text-sm, 0.875rem);
    color: var(--text-secondary, #4a4a68);
    border-left: 3px solid var(--info-color, #3b82f6);
}

/* ========================================
   作品展示网格
   ======================================== */

.edt-showcase-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 20px;
}

.edt-showcase-card {
    background: var(--card-bg, #fff);
    border: 1px solid var(--card-border, #e5e7eb);
    border-radius: var(--radius-lg, 14px);
    overflow: hidden;
    transition: all var(--transition-normal, 0.25s);
}

.edt-showcase-card:hover {
    box-shadow: var(--card-hover-shadow, 0 8px 30px rgba(0,0,0,0.12));
    transform: translateY(-2px);
}

.edt-showcase-card.featured {
    border-color: var(--warning-color, #f59e0b);
}

.edt-showcase-thumb {
    position: relative;
    aspect-ratio: 4 / 3;
    overflow: hidden;
}

.edt-showcase-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.edt-featured-badge {
    position: absolute;
    top: 8px;
    right: 8px;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    background: var(--warning-color, #f59e0b);
    color: #fff;
    border-radius: var(--radius-full, 9999px);
    font-size: 12px;
}

.edt-showcase-body {
    padding: 14px;
}

.edt-showcase-body h4 {
    margin: 0 0 8px;
    font-size: var(--text-sm, 0.875rem);
    font-weight: 600;
}

.edt-showcase-body h4 a {
    color: var(--text-primary, #1a1a2e);
    text-decoration: none;
}

.edt-showcase-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.edt-showcase-author {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: var(--text-xs, 0.75rem);
    color: var(--text-muted, #6b7280);
}

.edt-showcase-author img {
    border-radius: 50%;
}

.edt-showcase-course {
    font-size: 11px;
    color: var(--text-muted, #6b7280);
    margin-top: 6px;
    display: block;
}

.edt-showcase-footer {
    padding: 10px 14px;
    border-top: 1px solid var(--border-light, #e5e7eb);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.edt-like-btn {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted, #6b7280);
    padding: 4px;
    transition: color var(--transition-fast, 0.2s);
}

.edt-like-btn:hover {
    color: var(--error-color, #ef4444);
}

/* ========================================
   统计卡片
   ======================================== */

.edt-stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 16px;
    margin-bottom: 28px;
}

.edt-stat-card {
    background: var(--card-bg, #fff);
    border: 1px solid var(--card-border, #e5e7eb);
    border-radius: var(--radius-md, 10px);
    padding: 20px;
    text-align: center;
}

.edt-stat-value {
    font-size: 28px;
    font-weight: 700;
    line-height: 1.2;
}

.edt-stat-label {
    font-size: var(--text-sm, 0.875rem);
    color: var(--text-muted, #6b7280);
    margin-top: 4px;
}

/* ========================================
   趋势图表
   ======================================== */

.edt-chart-section {
    margin-bottom: 28px;
}

.edt-chart-section h3 {
    font-size: var(--text-lg, 1.125rem);
    margin-bottom: 16px;
    color: var(--text-primary, #1a1a2e);
}

.edt-trend-chart {
    display: flex;
    align-items: flex-end;
    gap: 4px;
    height: 160px;
    padding: 12px;
    background: var(--bg-secondary, #f8f9fc);
    border-radius: var(--radius-md, 10px);
}

.edt-trend-bar {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
    justify-content: flex-end;
}

.edt-trend-fill {
    width: 100%;
    background: var(--primary-gradient, linear-gradient(135deg, #0066cc, #0052a3));
    border-radius: 3px 3px 0 0;
    min-height: 4px;
    transition: height var(--transition-slow, 0.3s);
}

.edt-trend-date {
    font-size: 10px;
    color: var(--text-muted, #6b7280);
    margin-top: 4px;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
}

.edt-direction-stats {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.edt-direction-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.edt-direction-name {
    width: 100px;
    font-size: var(--text-sm, 0.875rem);
    font-weight: 500;
    color: var(--text-primary, #1a1a2e);
}

.edt-direction-bar {
    flex: 1;
    height: 28px;
    background: var(--bg-tertiary, #eef1f6);
    border-radius: var(--radius-sm, 6px);
    overflow: hidden;
}

.edt-direction-fill {
    height: 100%;
    background: var(--primary-gradient, linear-gradient(135deg, #0066cc, #0052a3));
    color: #fff;
    font-size: 12px;
    display: flex;
    align-items: center;
    padding: 0 10px;
    border-radius: var(--radius-sm, 6px);
    min-width: 60px;
}

.edt-direction-count {
    font-size: var(--text-xs, 0.75rem);
    color: var(--text-muted, #6b7280);
    white-space: nowrap;
}

/* ========================================
   表格
   ======================================== */

.edt-table-wrapper {
    overflow-x: auto;
}

.edt-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--text-sm, 0.875rem);
}

.edt-table th {
    background: var(--bg-tertiary, #eef1f6);
    color: var(--text-secondary, #4a4a68);
    font-weight: 600;
    padding: 10px 14px;
    text-align: left;
    border-bottom: 2px solid var(--border-light, #e5e7eb);
}

.edt-table td {
    padding: 10px 14px;
    border-bottom: 1px solid var(--border-light, #e5e7eb);
    color: var(--text-primary, #1a1a2e);
    vertical-align: middle;
}

.edt-table td img {
    border-radius: 50%;
    vertical-align: middle;
    margin-right: 6px;
}

/* ========================================
   表单
   ======================================== */

.edt-form-group {
    margin-bottom: 16px;
}

.edt-form-group label {
    display: block;
    font-weight: 600;
    margin-bottom: 6px;
    font-size: var(--text-sm, 0.875rem);
    color: var(--text-primary, #1a1a2e);
}

.edt-form-group input,
.edt-form-group select,
.edt-form-group textarea {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid var(--input-border, #d1d5db);
    border-radius: var(--radius-sm, 6px);
    font-size: var(--text-sm, 0.875rem);
    background: var(--input-bg, #fff);
    color: var(--input-text, #1a1a2e);
    transition: border-color var(--transition-fast, 0.2s), box-shadow var(--transition-fast, 0.2s);
}

.edt-form-group input:focus,
.edt-form-group select:focus,
.edt-form-group textarea:focus {
    border-color: var(--input-border-focus, #0066cc);
    box-shadow: var(--input-shadow-focus, 0 0 0 3px rgba(0,102,204,0.15));
    outline: none;
}

.edt-form-group textarea {
    resize: vertical;
    min-height: 80px;
}

.edt-form-hint {
    font-size: var(--text-xs, 0.75rem);
    color: var(--text-muted, #6b7280);
    margin-top: 4px;
}

.edt-form-row {
    display: flex;
    gap: 12px;
    align-items: flex-end;
    flex-wrap: wrap;
}

.edt-form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 20px;
}

.edt-checkbox-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: var(--text-sm, 0.875rem);
    cursor: pointer;
    white-space: nowrap;
}

.required { color: var(--error-color, #ef4444); }

/* ========================================
   上传表单
   ======================================== */

.edt-upload-form {
    padding: 16px;
    background: var(--bg-secondary, #f8f9fc);
    border-radius: var(--radius-md, 10px);
    border: 1px dashed var(--border-color, #d1d5db);
}

.edt-upload-form input[type="text"],
.edt-upload-form input[type="file"] {
    padding: 8px 12px;
    border: 1px solid var(--input-border, #d1d5db);
    border-radius: var(--radius-sm, 6px);
    font-size: var(--text-sm, 0.875rem);
    background: var(--input-bg, #fff);
    color: var(--input-text, #1a1a2e);
}

/* ========================================
   批改卡片
   ======================================== */

.edt-grading-card {
    padding: 18px;
    background: var(--card-bg, #fff);
    border: 1px solid var(--border-light, #e5e7eb);
    border-radius: var(--radius-md, 10px);
    margin-bottom: 14px;
}

.edt-grading-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.edt-grading-student {
    display: flex;
    align-items: center;
    gap: 10px;
}

.edt-grading-student img {
    border-radius: 50%;
}

.edt-grading-content {
    padding: 12px;
    background: var(--bg-secondary, #f8f9fc);
    border-radius: var(--radius-sm, 6px);
    margin-bottom: 12px;
    font-size: var(--text-sm, 0.875rem);
    line-height: 1.6;
}

.edt-grading-file {
    margin-bottom: 12px;
}

.edt-grade-form .edt-form-row {
    gap: 8px;
}

.edt-grade-form input {
    padding: 8px 12px;
    border: 1px solid var(--input-border, #d1d5db);
    border-radius: var(--radius-sm, 6px);
    font-size: var(--text-sm, 0.875rem);
    background: var(--input-bg, #fff);
    color: var(--input-text, #1a1a2e);
}

/* ========================================
   报名卡片
   ======================================== */

.edt-enrollment-card {
    background: var(--card-bg, #fff);
    border: 1px solid var(--card-border, #e5e7eb);
    border-radius: var(--radius-lg, 14px);
    padding: 28px;
}

.edt-enrollment-header {
    display: flex;
    gap: 20px;
    margin-bottom: 24px;
}

.edt-enrollment-thumb {
    width: 160px;
    height: auto;
    border-radius: var(--radius-md, 10px);
    object-fit: cover;
}

.edt-enrollment-details {
    border-top: 1px solid var(--border-light, #e5e7eb);
    padding-top: 16px;
}

.edt-detail-row {
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px solid var(--border-light, #e5e7eb);
    font-size: var(--text-sm, 0.875rem);
}

.edt-detail-row > span:first-child {
    color: var(--text-muted, #6b7280);
}

.edt-detail-price .edt-price {
    font-size: 20px;
}

.edt-enrollment-action {
    text-align: center;
    margin-top: 24px;
}

.edt-enrollment-status {
    text-align: center;
    padding: 24px 0;
}

.edt-enrollment-status svg {
    margin-bottom: 12px;
}

/* ========================================
   空状态
   ======================================== */

.edt-empty-state {
    text-align: center;
    padding: 48px 20px;
    color: var(--text-muted, #6b7280);
}

.edt-empty-state svg {
    margin-bottom: 16px;
    opacity: 0.4;
}

.edt-empty-state p {
    margin: 0 0 16px;
    font-size: var(--text-base, 1rem);
}

.edt-empty-sm {
    padding: 24px 16px;
}

/* ========================================
   分页
   ======================================== */

.edt-pagination {
    display: flex;
    justify-content: center;
    gap: 6px;
    margin-top: 28px;
}

.edt-page {
    padding: 8px 14px;
    border: 1px solid var(--border-light, #e5e7eb);
    border-radius: var(--radius-sm, 6px);
    color: var(--text-primary, #1a1a2e);
    text-decoration: none;
    font-size: var(--text-sm, 0.875rem);
    background: var(--bg-primary, #fff);
    transition: all var(--transition-fast, 0.2s);
}

.edt-page:hover {
    background: var(--primary-color, #0066cc);
    color: #fff;
    border-color: var(--primary-color, #0066cc);
}

.edt-page.current {
    background: var(--primary-color, #0066cc);
    color: #fff;
    border-color: var(--primary-color, #0066cc);
}

/* ========================================
   辅助类
   ======================================== */

.edt-text-muted {
    color: var(--text-muted, #6b7280);
    font-size: var(--text-xs, 0.75rem);
}

/* ========================================
   课程描述
   ======================================== */

.edt-course-description {
    line-height: 1.8;
    color: var(--text-secondary, #4a4a68);
}

.edt-features ul {
    list-style: none;
    padding: 0;
}

.edt-features li {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 0;
    font-size: var(--text-sm, 0.875rem);
    color: var(--text-primary, #1a1a2e);
}

/* ========================================
   响应式
   ======================================== */

@media (max-width: 768px) {
    .edt-course-grid {
        grid-template-columns: 1fr;
    }

    .edt-showcase-grid {
        grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    }

    .edt-stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .edt-course-header {
        flex-direction: column;
    }

    .edt-course-header-thumb {
        width: 100%;
        min-width: auto;
    }

    .edt-enrollment-header {
        flex-direction: column;
    }

    .edt-enrollment-thumb {
        width: 100%;
    }

    .edt-sub-tabs {
        gap: 0;
    }

    .edt-modal-content {
        padding: 20px;
    }

    .edt-form-row {
        flex-direction: column;
    }
}


/* ========================================
   作品展示独立页面样式
   ======================================== */

.edt-showcase-page {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 var(--spacing-md);
}

/* Hero 区域 */
.edt-sp-hero {
    text-align: center;
    padding: var(--spacing-xl) 0;
    margin-bottom: var(--spacing-lg);
    background: var(--primary-gradient);
    border-radius: var(--radius-lg);
    position: relative;
    overflow: hidden;
}

.edt-sp-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 30% 50%, rgba(255,255,255,0.1) 0%, transparent 60%);
    pointer-events: none;
}

.edt-sp-hero-inner {
    position: relative;
    z-index: 1;
    padding: 0 var(--spacing-lg);
}

.edt-sp-hero-title {
    font-size: 2rem;
    font-weight: 700;
    color: var(--text-light);
    margin: 0 0 var(--spacing-sm);
}

.edt-sp-hero-desc {
    color: rgba(255,255,255,0.85);
    font-size: 1.05rem;
    margin: 0 0 var(--spacing-md);
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.edt-sp-hero-stats {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-lg);
}

.edt-sp-stat-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: rgba(255,255,255,0.9);
    font-size: 0.95rem;
    font-weight: 500;
}

.edt-sp-stat-item svg {
    opacity: 0.8;
}

/* 筛选栏 */
.edt-sp-filter-bar {
    margin-bottom: var(--spacing-lg);
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-sm) var(--spacing-md);
    box-shadow: var(--shadow-sm);
}

.edt-sp-filter-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--spacing-md);
    flex-wrap: wrap;
}

.edt-sp-filter-tabs {
    display: flex;
    gap: var(--spacing-xs);
    flex-wrap: wrap;
}

.edt-sp-filter-tab {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 8px 16px;
    border: none;
    background: transparent;
    color: var(--text-secondary);
    font-size: 0.9rem;
    font-weight: 500;
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: all var(--transition-normal);
}

.edt-sp-filter-tab:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
}

.edt-sp-filter-tab.active {
    background: var(--primary-light);
    color: var(--primary-color);
    font-weight: 600;
}

.edt-sp-filter-select select {
    padding: 8px 32px 8px 12px;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-sm);
    background: var(--input-bg);
    color: var(--input-text);
    font-size: 0.9rem;
    cursor: pointer;
    appearance: none;
    background-image: var(--select-arrow);
    background-repeat: no-repeat;
    background-position: right 10px center;
}

/* 作品网格 */
.edt-sp-grid {
    display: grid;
    gap: var(--spacing-md);
    transition: opacity 0.3s ease;
}

.edt-sp-cols-2 { grid-template-columns: repeat(2, 1fr); }
.edt-sp-cols-3 { grid-template-columns: repeat(3, 1fr); }
.edt-sp-cols-4 { grid-template-columns: repeat(4, 1fr); }

/* 作品卡片 */
.edt-showcase-card {
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.edt-showcase-card:hover {
    box-shadow: var(--card-hover-shadow);
    transform: translateY(-4px);
}

.edt-showcase-card-thumb {
    position: relative;
    aspect-ratio: 16/10;
    overflow: hidden;
    background: var(--bg-tertiary);
}

.edt-showcase-card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.edt-showcase-card:hover .edt-showcase-card-thumb img {
    transform: scale(1.05);
}

.edt-showcase-badge {
    position: absolute;
    top: 10px;
    padding: 3px 10px;
    border-radius: var(--radius-full);
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.5;
    z-index: 1;
}

.edt-showcase-badge-featured {
    left: 10px;
    background: linear-gradient(135deg, #f59e0b, #f97316);
    color: #fff;
}

.edt-showcase-badge-role {
    right: 10px;
}

.edt-showcase-badge-teacher {
    background: rgba(99, 102, 241, 0.9);
    color: #fff;
}

.edt-showcase-badge-student {
    background: rgba(16, 185, 129, 0.9);
    color: #fff;
}

.edt-showcase-card-body {
    padding: var(--spacing-sm) var(--spacing-md) var(--spacing-md);
}

.edt-showcase-card-title {
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 6px;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.edt-showcase-card-title a {
    color: var(--text-primary);
    text-decoration: none;
    transition: color var(--transition-normal);
}

.edt-showcase-card-title a:hover {
    color: var(--primary-color);
}

.edt-showcase-card-course {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 0.8rem;
    color: var(--text-muted);
    margin-bottom: var(--spacing-sm);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.edt-showcase-card-course svg {
    flex-shrink: 0;
}

.edt-showcase-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: var(--spacing-sm);
    border-top: 1px solid var(--border-light);
}

.edt-showcase-card-author {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    color: var(--text-secondary);
    min-width: 0;
}

.edt-showcase-avatar {
    width: 28px;
    height: 28px;
    border-radius: var(--radius-full);
    object-fit: cover;
    flex-shrink: 0;
}

.edt-showcase-card-stats {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    flex-shrink: 0;
}

.edt-showcase-stat {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.8rem;
    color: var(--text-muted);
    background: none;
    border: none;
    padding: 0;
    cursor: default;
}

.edt-showcase-like-btn {
    cursor: pointer;
    transition: color var(--transition-normal);
    border-radius: var(--radius-sm);
    padding: 3px 6px !important;
}

.edt-showcase-like-btn:hover {
    color: #ef4444;
    background: rgba(239, 68, 68, 0.08);
}

.edt-showcase-like-btn.liked {
    color: #ef4444;
}

.edt-showcase-like-btn.liked svg {
    fill: #ef4444;
}

/* 加载更多 */
.edt-sp-load-more-wrap {
    text-align: center;
    margin: var(--spacing-xl) 0 var(--spacing-lg);
}

.edt-sp-load-more-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 32px;
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    color: var(--text-secondary);
    font-size: 0.95rem;
    font-weight: 500;
    cursor: pointer;
    transition: all var(--transition-normal);
    box-shadow: var(--shadow-sm);
}

.edt-sp-load-more-btn:hover {
    border-color: var(--primary-color);
    color: var(--primary-color);
    box-shadow: var(--shadow-md);
}

.edt-sp-load-more-btn.loading {
    opacity: 0.6;
    pointer-events: none;
}

.edt-sp-remaining {
    color: var(--text-muted);
    font-size: 0.85rem;
}

/* 空状态 */
.edt-sp-empty {
    text-align: center;
    padding: var(--spacing-xl) 0;
    color: var(--text-muted);
}

.edt-sp-empty svg {
    margin-bottom: var(--spacing-md);
}

.edt-sp-empty h3 {
    font-size: 1.2rem;
    color: var(--text-secondary);
    margin: 0 0 var(--spacing-xs);
}

.edt-sp-empty p {
    margin: 0;
}

/* 响应式 */
@media (max-width: 1024px) {
    .edt-sp-cols-4 { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 768px) {
    .edt-sp-hero-title { font-size: 1.5rem; }

    .edt-sp-hero-stats {
        flex-direction: column;
        gap: var(--spacing-xs);
    }

    .edt-sp-filter-inner {
        flex-direction: column;
        align-items: stretch;
    }

    .edt-sp-filter-tabs {
        justify-content: center;
    }

    .edt-sp-cols-3,
    .edt-sp-cols-4 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .edt-showcase-page { padding: 0 var(--spacing-sm); }

    .edt-sp-cols-2,
    .edt-sp-cols-3,
    .edt-sp-cols-4 {
        grid-template-columns: 1fr;
    }

    .edt-sp-filter-tab {
        padding: 6px 12px;
        font-size: 0.85rem;
    }
}

/* ============================================================
 * 课程报名页面
 * ============================================================ */

.edt-enrollment-page {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 var(--spacing-md, 16px);
}

.edt-ep-hero {
    text-align: center;
    padding: 48px 24px 32px;
}
.edt-ep-hero-title {
    margin: 0 0 12px;
    font-size: 2rem;
    font-weight: 700;
    color: var(--text-primary, #1f2937);
}
.edt-ep-hero-desc {
    margin: 0;
    font-size: 1.0625rem;
    color: var(--text-secondary, #6b7280);
}

.edt-ep-login-notice {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px 24px;
    margin-bottom: 24px;
    background: linear-gradient(135deg, rgba(var(--primary-rgb, 0,102,204), 0.06), rgba(var(--primary-rgb, 0,102,204), 0.02));
    border: 1px solid rgba(var(--primary-rgb, 0,102,204), 0.15);
    border-radius: var(--radius-lg, 12px);
}
.edt-ep-login-notice-icon {
    flex-shrink: 0;
    color: var(--primary-color, #0066cc);
}
.edt-ep-login-notice-text {
    flex: 1;
}
.edt-ep-login-notice-text strong {
    font-size: 1rem;
    color: var(--text-primary, #1f2937);
}
.edt-ep-login-notice-text p {
    margin: 4px 0 0;
    font-size: 0.875rem;
    color: var(--text-secondary, #6b7280);
}
.edt-ep-login-notice-actions {
    flex-shrink: 0;
    display: flex;
    gap: 10px;
}

.edt-ep-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 20px;
    border: none;
    border-radius: var(--radius-md, 8px);
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.2s ease;
    line-height: 1.4;
}
.edt-ep-btn-primary {
    background: var(--primary-gradient, linear-gradient(135deg, #0066cc, #0052a3));
    color: #fff;
}
.edt-ep-btn-primary:hover { opacity: 0.9; color: #fff; }
.edt-ep-btn-outline {
    background: transparent;
    border: 1px solid var(--primary-color, #0066cc);
    color: var(--primary-color, #0066cc);
}
.edt-ep-btn-outline:hover {
    background: var(--primary-color, #0066cc);
    color: #fff;
}
.edt-ep-btn-enrolled {
    background: var(--success-color, #10b981);
    color: #fff;
    cursor: default;
    opacity: 0.8;
}
.edt-ep-btn.loading {
    opacity: 0.6;
    pointer-events: none;
}

.edt-ep-filter-bar {
    margin-bottom: 24px;
    padding: 16px 20px;
    background: var(--card-bg, #fff);
    border-radius: var(--radius-lg, 12px);
    box-shadow: var(--shadow-sm, 0 1px 3px rgba(0,0,0,0.08));
}
.edt-ep-filter-inner {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.edt-ep-filter-group {
    display: flex;
    align-items: center;
    gap: 12px;
}
.edt-ep-filter-group > label {
    flex-shrink: 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--text-secondary, #6b7280);
    min-width: 70px;
}
.edt-ep-filter-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.edt-ep-filter-tab {
    padding: 6px 14px;
    border-radius: var(--radius-full, 20px);
    font-size: 0.8125rem;
    text-decoration: none;
    color: var(--text-secondary, #6b7280);
    background: var(--bg-secondary, #f3f4f6);
    transition: all 0.2s ease;
}
.edt-ep-filter-tab:hover {
    color: var(--primary-color, #0066cc);
    background: rgba(var(--primary-rgb, 0,102,204), 0.08);
}
.edt-ep-filter-tab.active {
    color: #fff;
    background: var(--primary-color, #0066cc);
}

.edt-ep-grid {
    display: grid;
    gap: var(--spacing-md, 16px);
}
.edt-ep-cols-2 { grid-template-columns: repeat(2, 1fr); }
.edt-ep-cols-3 { grid-template-columns: repeat(3, 1fr); }
.edt-ep-cols-4 { grid-template-columns: repeat(4, 1fr); }

.edt-ep-card {
    background: var(--card-bg, #fff);
    border-radius: var(--radius-lg, 12px);
    overflow: hidden;
    box-shadow: var(--shadow-sm, 0 1px 3px rgba(0,0,0,0.08));
    transition: all 0.3s ease;
}
.edt-ep-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--card-hover-shadow, 0 10px 25px rgba(0,0,0,0.12));
}
.edt-ep-card-thumb {
    position: relative;
    aspect-ratio: 16/9;
    background: var(--bg-tertiary, #e5e7eb);
    overflow: hidden;
}
.edt-ep-card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}
.edt-ep-card:hover .edt-ep-card-thumb img { transform: scale(1.05); }
.edt-ep-card-placeholder {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-gradient, linear-gradient(135deg, #0066cc, #0052a3));
    color: rgba(255,255,255,0.6);
}
.edt-ep-card-badges {
    position: absolute;
    top: 8px;
    left: 8px;
    display: flex;
    gap: 6px;
}
.edt-ep-badge {
    padding: 3px 8px;
    font-size: 10px;
    font-weight: 600;
    border-radius: var(--radius-xs, 4px);
    color: #fff;
}
.edt-ep-badge-mode { background: rgba(99, 102, 241, 0.9); }
.edt-ep-badge-level { background: rgba(16, 185, 129, 0.9); }

.edt-ep-card-body { padding: 14px 16px; }
.edt-ep-card-title {
    margin: 0 0 8px;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.4;
    color: var(--text-primary, #1f2937);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.edt-ep-card-teacher {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
    font-size: 0.8125rem;
    color: var(--text-secondary, #6b7280);
}
.edt-ep-card-meta {
    display: flex;
    gap: 12px;
    margin-bottom: 12px;
    font-size: 0.75rem;
    color: var(--text-muted, #9ca3af);
}
.edt-ep-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 12px;
    border-top: 1px solid var(--border-light, #f3f4f6);
}
.edt-ep-card-price {
    display: flex;
    align-items: baseline;
    gap: 6px;
    flex-wrap: wrap;
}
.edt-ep-price {
    font-size: 1.125rem;
    font-weight: 700;
    color: #ef4444;
}
.edt-ep-price-label {
    font-size: 0.6875rem;
    color: var(--text-muted, #9ca3af);
}
.edt-ep-original-price {
    font-size: 0.75rem;
    color: var(--text-muted, #9ca3af);
    text-decoration: line-through;
}
.edt-ep-course-fee {
    font-size: 0.75rem;
    font-weight: 500;
    color: #d97706;
    padding: 1px 6px;
    background: #fffbeb;
    border-radius: 4px;
}
.edt-ep-free {
    color: var(--success-color, #10b981);
}
.edt-ep-vip-tag {
    font-size: 0.625rem;
    font-weight: 700;
    color: #fff;
    background: linear-gradient(135deg, #f59e0b, #f97316);
    padding: 1px 6px;
    border-radius: 4px;
    white-space: nowrap;
}
.edt-ep-badge-promo {
    background: linear-gradient(135deg, #ef4444, #f97316) !important;
    color: #fff !important;
    font-weight: 600 !important;
    animation: edt-promo-pulse 2s ease-in-out infinite;
}
@keyframes edt-promo-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.75; }
}

.edt-ep-pagination {
    display: flex;
    justify-content: center;
    gap: 4px;
    margin-top: 32px;
    padding: 16px 0;
}
.edt-ep-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    border-radius: var(--radius-md, 8px);
    font-size: 0.875rem;
    text-decoration: none;
    color: var(--text-secondary, #6b7280);
    background: var(--card-bg, #fff);
    box-shadow: var(--shadow-sm, 0 1px 3px rgba(0,0,0,0.08));
    transition: all 0.2s ease;
}
.edt-ep-pagination .page-numbers:hover { color: var(--primary-color, #0066cc); }
.edt-ep-pagination .page-numbers.current {
    background: var(--primary-color, #0066cc);
    color: #fff;
}

.edt-ep-empty {
    text-align: center;
    padding: 64px 24px;
    color: var(--text-muted, #9ca3af);
}
.edt-ep-empty h3 {
    margin: 16px 0 8px;
    font-size: 1.125rem;
    color: var(--text-secondary, #6b7280);
}
.edt-ep-empty p { margin: 0; font-size: 0.9375rem; }

@media (max-width: 768px) {
    .edt-ep-login-notice { flex-direction: column; text-align: center; }
    .edt-ep-filter-group { flex-direction: column; align-items: flex-start; }
    .edt-ep-cols-3, .edt-ep-cols-4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
    .edt-ep-cols-2, .edt-ep-cols-3, .edt-ep-cols-4 { grid-template-columns: 1fr; }
    .edt-ep-hero-title { font-size: 1.5rem; }
}


/* ============================================================
 * 教师申请页面
 * ============================================================ */

.edt-teacher-apply-page {
    max-width: 900px;
    margin: 0 auto;
    padding: 0 var(--spacing-md, 16px);
}

.edt-ta-hero {
    text-align: center;
    padding: 48px 24px 24px;
}
.edt-ta-hero-title {
    margin: 0 0 12px;
    font-size: 2rem;
    font-weight: 700;
    color: var(--text-primary, #1f2937);
}
.edt-ta-hero-desc {
    margin: 0;
    font-size: 1.0625rem;
    color: var(--text-secondary, #6b7280);
}

.edt-ta-benefits {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-md, 16px);
    margin-bottom: 32px;
}
.edt-ta-benefit-item {
    text-align: center;
    padding: 24px 16px;
    background: var(--card-bg, #fff);
    border-radius: var(--radius-lg, 12px);
    box-shadow: var(--shadow-sm, 0 1px 3px rgba(0,0,0,0.08));
}
.edt-ta-benefit-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin-bottom: 12px;
    border-radius: 50%;
    background: rgba(var(--primary-rgb, 0,102,204), 0.08);
    color: var(--primary-color, #0066cc);
}
.edt-ta-benefit-item h3 {
    margin: 0 0 6px;
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary, #1f2937);
}
.edt-ta-benefit-item p {
    margin: 0;
    font-size: 0.8125rem;
    color: var(--text-secondary, #6b7280);
    line-height: 1.5;
}

.edt-ta-main {
    margin-bottom: 48px;
}

/* 未登录 & 状态卡片 */
.edt-ta-login-notice,
.edt-ta-status-card {
    text-align: center;
    padding: 48px 24px;
    background: var(--card-bg, #fff);
    border-radius: var(--radius-lg, 12px);
    box-shadow: var(--shadow-sm, 0 1px 3px rgba(0,0,0,0.08));
}
.edt-ta-notice-icon,
.edt-ta-status-icon {
    margin-bottom: 16px;
    color: var(--text-muted, #9ca3af);
}
.edt-ta-login-notice h3,
.edt-ta-status-card h3 {
    margin: 0 0 8px;
    font-size: 1.25rem;
    color: var(--text-primary, #1f2937);
}
.edt-ta-login-notice p,
.edt-ta-status-card p {
    margin: 0 0 20px;
    font-size: 0.9375rem;
    color: var(--text-secondary, #6b7280);
}
.edt-ta-notice-actions {
    display: flex;
    justify-content: center;
    gap: 12px;
}

.edt-ta-status-teacher .edt-ta-status-icon { color: var(--success-color, #10b981); }
.edt-ta-status-pending .edt-ta-status-icon { color: #f59e0b; }

.edt-ta-app-summary {
    display: inline-flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px 24px;
    margin-top: 8px;
    background: var(--bg-secondary, #f9fafb);
    border-radius: var(--radius-md, 8px);
    text-align: left;
    font-size: 0.875rem;
}
.edt-ta-summary-row {
    display: flex;
    gap: 8px;
}
.edt-ta-summary-row span { color: var(--text-muted, #9ca3af); }
.edt-ta-summary-row strong { color: var(--text-primary, #1f2937); }

/* 拒绝提示 */
.edt-ta-reject-notice {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 20px;
    margin-bottom: 20px;
    background: rgba(239, 68, 68, 0.06);
    border: 1px solid rgba(239, 68, 68, 0.2);
    border-radius: var(--radius-lg, 12px);
    color: #b91c1c;
}
.edt-ta-reject-notice svg { flex-shrink: 0; margin-top: 2px; }
.edt-ta-reject-notice p {
    margin: 4px 0 0;
    font-size: 0.875rem;
    color: var(--text-secondary, #6b7280);
}

/* 申请表单 */
.edt-ta-form-wrap {
    background: var(--card-bg, #fff);
    border-radius: var(--radius-lg, 12px);
    box-shadow: var(--shadow-sm, 0 1px 3px rgba(0,0,0,0.08));
    padding: 32px;
}
.edt-ta-form-title {
    margin: 0 0 8px;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--text-primary, #1f2937);
}
.edt-ta-form-desc {
    margin: 0 0 24px;
    font-size: 0.875rem;
    color: var(--text-secondary, #6b7280);
}

.edt-ta-form-section {
    margin-bottom: 24px;
    padding-bottom: 24px;
    border-bottom: 1px solid var(--border-light, #f3f4f6);
}
.edt-ta-form-section:last-of-type {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}
.edt-ta-section-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 16px;
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary, #1f2937);
}
.edt-ta-section-title svg { color: var(--primary-color, #0066cc); }

.edt-ta-form-row {
    display: flex;
    gap: 16px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}
.edt-ta-form-field {
    flex: 1;
    min-width: 200px;
}
.edt-ta-form-field.edt-ta-full {
    flex-basis: 100%;
    min-width: 100%;
}
.edt-ta-form-field label {
    display: block;
    margin-bottom: 6px;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--text-primary, #1f2937);
}
.edt-ta-form-field input,
.edt-ta-form-field textarea,
.edt-ta-form-field select {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid var(--border-color, #d1d5db);
    border-radius: var(--radius-md, 8px);
    font-size: 0.9375rem;
    color: var(--text-primary, #1f2937);
    background: var(--input-bg, #fff);
    transition: border-color 0.2s, box-shadow 0.2s;
    box-sizing: border-box;
}
.edt-ta-form-field input:focus,
.edt-ta-form-field textarea:focus {
    outline: none;
    border-color: var(--primary-color, #0066cc);
    box-shadow: 0 0 0 3px rgba(var(--primary-rgb, 0,102,204), 0.1);
}
.edt-ta-form-field textarea {
    resize: vertical;
    min-height: 80px;
}

.edt-ta-direction-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
}
.edt-ta-tag-btn {
    padding: 4px 12px;
    border: 1px solid var(--border-color, #d1d5db);
    border-radius: var(--radius-full, 20px);
    background: var(--bg-secondary, #f9fafb);
    font-size: 0.75rem;
    color: var(--text-secondary, #6b7280);
    cursor: pointer;
    transition: all 0.2s ease;
}
.edt-ta-tag-btn:hover,
.edt-ta-tag-btn.selected {
    background: var(--primary-color, #0066cc);
    border-color: var(--primary-color, #0066cc);
    color: #fff;
}

.edt-ta-form-actions {
    text-align: center;
    padding-top: 24px;
}

.edt-ta-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 32px;
    border: none;
    border-radius: var(--radius-md, 8px);
    font-size: 1rem;
    font-weight: 500;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.2s ease;
}
.edt-ta-btn-primary {
    background: var(--primary-gradient, linear-gradient(135deg, #0066cc, #0052a3));
    color: #fff;
}
.edt-ta-btn-primary:hover { opacity: 0.9; color: #fff; }
.edt-ta-btn-outline {
    background: transparent;
    border: 1px solid var(--primary-color, #0066cc);
    color: var(--primary-color, #0066cc);
}
.edt-ta-btn-outline:hover {
    background: var(--primary-color, #0066cc);
    color: #fff;
}
.edt-ta-submit-btn {
    min-width: 200px;
    padding: 14px 40px;
    font-size: 1.0625rem;
}
.edt-ta-submit-btn.loading {
    opacity: 0.6;
    pointer-events: none;
}

@media (max-width: 768px) {
    .edt-ta-benefits { grid-template-columns: 1fr; }
    .edt-ta-form-wrap { padding: 20px 16px; }
    .edt-ta-form-row { flex-direction: column; }
    .edt-ta-form-field { min-width: 100%; }
}
@media (max-width: 480px) {
    .edt-ta-hero-title { font-size: 1.5rem; }
    .edt-ta-notice-actions { flex-direction: column; }
}

/* ========================================
   课程详情弹窗
   ======================================== */

.edt-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: var(--z-modal, 999999);
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    align-items: center;
    justify-content: center;
    padding: 24px;
    opacity: 0;
    transition: opacity 0.35s ease;
}
.edt-modal-overlay.active { opacity: 1; }

.edt-modal-container {
    position: relative;
    width: 94%;
    max-width: 520px;
    max-height: 88vh;
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 25px 60px -12px rgba(0, 0, 0, 0.3);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transform: scale(0.92) translateY(30px);
    opacity: 0;
    transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1),
                opacity 0.35s ease;
}
.edt-modal-overlay.active .edt-modal-container {
    transform: scale(1) translateY(0);
    opacity: 1;
}

/* 顶部渐变条（已禁用） */
.edt-modal-accent { display: none; }

/* 关闭按钮 */
.edt-modal-overlay .edt-modal-close {
    position: absolute;
    top: 16px;
    right: 16px;
    z-index: 10;
    border: none;
    background: #f1f3f5;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    color: #868e96;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}
.edt-modal-overlay .edt-modal-close:hover {
    background: #e9ecef;
    color: #495057;
}
.edt-modal-overlay .edt-modal-close:active { transform: scale(0.9); }

/* 主体滚动区 */
.edt-modal-body {
    overflow-y: auto;
    padding: 24px 28px 20px;
    flex: 1;
}

/* 加载 */
.edt-modal-overlay .edt-modal-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 80px 0;
    color: #adb5bd;
    font-size: 13px;
}
.edt-modal-spinner {
    width: 28px;
    height: 28px;
    border: 2.5px solid #e9ecef;
    border-top-color: #6c5ce7;
    border-radius: 50%;
    animation: edt-spin 0.7s linear infinite;
}
@keyframes edt-spin { to { transform: rotate(360deg); } }

/* ---- 头部 ---- */
.edt-modal-overlay .edt-modal-header {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid #f1f3f5;
}
.edt-modal-overlay .edt-modal-thumb-wrap {
    width: 100%;
    border-radius: 12px;
    overflow: hidden;
}
.edt-modal-overlay .edt-modal-thumb-wrap img {
    width: 100%;
    height: 180px;
    object-fit: cover;
    display: block;
}
.edt-modal-overlay .edt-modal-info {
    display: flex;
    flex-direction: column;
}
.edt-modal-overlay .edt-modal-title {
    margin: 0 0 10px;
    font-size: 1.2rem;
    font-weight: 700;
    color: #212529;
    line-height: 1.45;
}
.edt-modal-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 8px;
}
.edt-modal-tag {
    padding: 3px 10px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 600;
    background: #f3f0ff;
    color: #6c5ce7;
}
.edt-modal-stats {
    font-size: 12px;
    color: #868e96;
    line-height: 1.6;
}

/* ---- 内容区段 ---- */
.edt-modal-sections {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.edt-modal-desc-section,
.edt-modal-features-section,
.edt-modal-syllabus-section {
    padding: 0;
    background: none;
    border: none;
    border-radius: 0;
}
.edt-modal-desc-section h3,
.edt-modal-features-section h3,
.edt-modal-syllabus-section h3 {
    font-size: 14px;
    font-weight: 700;
    color: #212529;
    margin: 0 0 10px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.edt-modal-section-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 7px;
    background: #f3f0ff;
    color: #6c5ce7;
    flex-shrink: 0;
}
.edt-modal-section-icon svg { width: 13px; height: 13px; }
.edt-modal-syl-count {
    font-weight: 400;
    font-size: 12px;
    color: #adb5bd;
    margin-left: 4px;
}
.edt-modal-desc {
    font-size: 13.5px;
    line-height: 1.75;
    color: #495057;
}
.edt-modal-features {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
}
.edt-modal-features li {
    font-size: 12.5px;
    padding: 6px 8px 6px 24px;
    position: relative;
    color: #495057;
    line-height: 1.5;
}
.edt-modal-features li::before {
    content: '✓';
    position: absolute;
    left: 6px;
    top: 6px;
    color: #6c5ce7;
    font-weight: 800;
    font-size: 11px;
}

/* ---- 大纲 ---- */
.edt-modal-chapter {
    border: 1px solid #f1f3f5;
    border-radius: 10px;
    margin-bottom: 8px;
    overflow: hidden;
    transition: border-color 0.2s;
}
.edt-modal-chapter:hover { border-color: #dee2e6; }
.edt-modal-ch-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    background: #f8f9fa;
}
.edt-modal-ch-thumb { width: 48px; height: 34px; object-fit: cover; border-radius: 6px; flex-shrink: 0; }
.edt-modal-ch-num {
    width: 24px;
    height: 24px;
    min-width: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #6c5ce7;
    color: #fff;
    border-radius: 50%;
    font-size: 11px;
    font-weight: 700;
}
.edt-modal-ch-info { flex: 1; min-width: 0; }
.edt-modal-ch-info h4 { margin: 0; font-size: 13px; font-weight: 600; color: #212529; }
.edt-modal-ch-info p { margin: 2px 0 0; font-size: 11px; color: #adb5bd; }
.edt-modal-ch-dur { font-size: 11px; color: #adb5bd; white-space: nowrap; flex-shrink: 0; }
.edt-modal-subs { border-top: 1px solid #f1f3f5; }
.edt-modal-sub {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px 8px 48px;
    border-bottom: 1px solid #f8f9fa;
    font-size: 12px;
}
.edt-modal-sub:last-child { border-bottom: none; }
.edt-modal-sub-thumb { width: 32px; height: 24px; object-fit: cover; border-radius: 4px; flex-shrink: 0; }
.edt-modal-sub-title { flex: 1; color: #495057; }
.edt-modal-sub-dur { font-size: 11px; color: #adb5bd; white-space: nowrap; }

/* ---- 底部操作栏 ---- */
.edt-modal-footer {
    background: #fff;
    border-top: 1px solid #f1f3f5;
    padding: 14px 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-shrink: 0;
}
.edt-modal-price-area {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
    min-width: 0;
}
.edt-modal-price-row {
    display: flex;
    align-items: baseline;
    gap: 6px;
    flex-wrap: wrap;
}
.edt-modal-fee-amount {
    font-size: 1.3rem;
    font-weight: 800;
    color: #e03131;
    letter-spacing: -0.02em;
}
.edt-modal-fee-free { color: #6c5ce7; }
.edt-modal-fee-course {
    font-size: 0.9rem;
    font-weight: 700;
    color: #e8590c;
}
.edt-modal-fee-label {
    font-size: 11px;
    font-weight: 500;
    color: #868e96;
}
.edt-modal-fee-note {
    font-size: 10px;
    padding: 2px 6px;
    border-radius: 4px;
    font-weight: 600;
}
.edt-modal-price-enroll .edt-modal-fee-note {
    background: #fff5f5;
    color: #e03131;
}
.edt-modal-price-course .edt-modal-fee-note {
    background: #fff4e6;
    color: #e8590c;
}
.edt-modal-fee-orig {
    font-size: 0.75rem;
    color: #ced4da;
    text-decoration: line-through;
}
.edt-modal-vip-tag {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    color: #fff;
    background: linear-gradient(135deg, #f59f00, #e8590c);
    padding: 1px 6px;
    border-radius: 3px;
    white-space: nowrap;
}
.edt-modal-promo-tag {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    color: #fff;
    background: linear-gradient(135deg, #e03131, #e8590c);
    padding: 1px 6px;
    border-radius: 3px;
    white-space: nowrap;
    animation: edt-promo-pulse 2s ease-in-out infinite;
}
.edt-modal-countdown {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 3px;
    flex-wrap: wrap;
}
.edt-countdown-label {
    font-size: 11px;
    color: #e03131;
    font-weight: 600;
    margin-right: 2px;
}
.edt-cd-block {
    display: inline-flex;
    align-items: baseline;
    gap: 1px;
    background: #212529;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 5px;
    border-radius: 3px;
    min-width: 26px;
    justify-content: center;
    font-variant-numeric: tabular-nums;
}
.edt-cd-block small {
    font-size: 8px;
    font-weight: 400;
    opacity: 0.6;
    margin-left: 1px;
}
.edt-countdown-ended { font-size: 11px; color: #ced4da; }

.edt-modal-action .edt-ep-btn {
    white-space: nowrap;
    padding: 11px 28px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 12px;
    background: #6c5ce7;
    border: none;
    color: #fff;
    cursor: pointer;
    transition: all 0.2s ease;
}
.edt-modal-action .edt-ep-btn:hover {
    background: #5f3dc4;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(108, 92, 231, 0.3);
}
.edt-modal-action .edt-ep-btn-outline {
    background: transparent;
    color: #6c5ce7;
    border: 1.5px solid #6c5ce7;
}
.edt-modal-action .edt-ep-btn-outline:hover {
    background: #f3f0ff;
    box-shadow: none;
    transform: none;
}

/* 响应式 */
@media (max-width: 768px) {
    .edt-modal-overlay { padding: 0; align-items: flex-end; }
    .edt-modal-container {
        width: 100%; max-width: 100%; max-height: 92vh;
        border-radius: 20px 20px 0 0;
        transform: translateY(100%); opacity: 1;
    }
    .edt-modal-overlay.active .edt-modal-container { transform: translateY(0); }
    .edt-modal-body { padding: 20px 22px 16px; }
    .edt-modal-footer { padding: 12px 22px; }
}
@media (max-width: 480px) {
    .edt-modal-overlay .edt-modal-features { grid-template-columns: 1fr; }
    .edt-modal-overlay .edt-modal-title { font-size: 1.05rem; }
    .edt-modal-footer { flex-direction: column; gap: 10px; }
    .edt-modal-action { width: 100%; }
    .edt-modal-action .edt-ep-btn { width: 100%; box-sizing: border-box; text-align: center; }
}

/* 深色主题 */
[data-theme="dark"] .edt-modal-overlay { background: rgba(0, 0, 0, 0.65); }
[data-theme="dark"] .edt-modal-container {
    background: #1e1e2e;
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.5);
}
[data-theme="dark"] .edt-modal-close { background: rgba(255,255,255,0.08); color: #868e96; }
[data-theme="dark"] .edt-modal-close:hover { background: rgba(255,255,255,0.14); color: #dee2e6; }
[data-theme="dark"] .edt-modal-title { color: #f1f3f5; }
[data-theme="dark"] .edt-modal-header { border-bottom-color: rgba(255,255,255,0.06); }
[data-theme="dark"] .edt-modal-tag { background: rgba(108,92,231,0.15); color: #a29bfe; }
[data-theme="dark"] .edt-modal-desc { color: #ced4da; }
[data-theme="dark"] .edt-modal-desc-section h3,
[data-theme="dark"] .edt-modal-features-section h3,
[data-theme="dark"] .edt-modal-syllabus-section h3 { color: #f1f3f5; }
[data-theme="dark"] .edt-modal-section-icon { background: rgba(108,92,231,0.15); color: #a29bfe; }
[data-theme="dark"] .edt-modal-features li { color: #ced4da; }
[data-theme="dark"] .edt-modal-features li::before { color: #a29bfe; }
[data-theme="dark"] .edt-modal-chapter { border-color: rgba(255,255,255,0.06); }
[data-theme="dark"] .edt-modal-ch-header { background: rgba(255,255,255,0.03); }
[data-theme="dark"] .edt-modal-ch-info h4 { color: #f1f3f5; }
[data-theme="dark"] .edt-modal-sub-title { color: #ced4da; }
[data-theme="dark"] .edt-modal-footer { background: #1e1e2e; border-top-color: rgba(255,255,255,0.06); }
[data-theme="dark"] .edt-cd-block { background: #11111b; }

/* 毛玻璃主题 */
[data-theme="glass"] .edt-modal-overlay {
    background: rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}
[data-theme="glass"] .edt-modal-container {
    background: rgba(255, 255, 255, 0.88);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.5);
}

/* 滚动条 */
.edt-modal-body::-webkit-scrollbar { width: 4px; }
.edt-modal-body::-webkit-scrollbar-track { background: transparent; }
.edt-modal-body::-webkit-scrollbar-thumb { background: #dee2e6; border-radius: 2px; }
.edt-modal-body::-webkit-scrollbar-thumb:hover { background: #6c5ce7; }

/* ==================== 自定义弹窗补充样式 ==================== */

/* 取消按钮：透明背景 + 边框 */
.tah-toast-dialog__btn--cancel {
    background: transparent !important;
    color: var(--text-secondary, #4a4a68) !important;
    border: 1px solid var(--border-color, #d1d5db) !important;
}
.tah-toast-dialog__btn--cancel:hover {
    background: var(--bg-secondary, #f3f4f6) !important;
}

/* 输入框 */
.tah-toast-dialog__input-wrap {
    margin-bottom: 20px;
    padding: 0 4px;
}
.tah-toast-dialog__input {
    width: 100%;
    padding: 10px 14px;
    font-size: 0.875rem;
    color: var(--text-primary, #1a1a2e);
    background: var(--input-bg, var(--bg-primary, #fff));
    border: 1px solid var(--border-color, #d1d5db);
    border-radius: var(--radius-md, 10px);
    outline: none;
    transition: border-color 0.2s;
    box-sizing: border-box;
}
.tah-toast-dialog__input:focus {
    border-color: var(--primary-color, #0066cc);
    box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.1);
}

/* 插件自含弹窗基础样式（主题未加载时回退） */
#tah-toast-root {
    position: fixed;
    inset: 0;
    z-index: 1000000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    pointer-events: none;
    box-sizing: border-box;
}
#tah-toast-root .tah-toast-dialog {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    pointer-events: auto;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease, visibility 0.2s ease;
    box-sizing: border-box;
}
#tah-toast-root .tah-toast-dialog.tah-toast-dialog--visible {
    opacity: 1;
    visibility: visible;
}
.tah-toast-dialog__backdrop {
    position: absolute;
    inset: 0;
    background: transparent;
    cursor: default;
}
.tah-toast-dialog__box {
    position: relative;
    z-index: 1;
    min-width: 280px;
    max-width: 420px;
    background: var(--modal-bg, var(--card-bg, #fff));
    border: 1px solid var(--card-border, transparent);
    border-radius: 14px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    padding: 24px;
    text-align: center;
}
.tah-toast-dialog__icon {
    width: 48px;
    height: 48px;
    margin: 0 auto 16px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    font-weight: bold;
    color: #fff;
}
.tah-toast-dialog--success .tah-toast-dialog__icon { background: var(--success-color, #10b981); }
.tah-toast-dialog--error .tah-toast-dialog__icon   { background: var(--error-color, #ef4444); }
.tah-toast-dialog--warning .tah-toast-dialog__icon  { background: var(--warning-color, #f59e0b); }
.tah-toast-dialog--info .tah-toast-dialog__icon     { background: var(--info-color, #3b82f6); }
.tah-toast-dialog__message {
    font-size: 0.875rem;
    color: var(--text-secondary, #4a4a68);
    line-height: 1.5;
    margin-bottom: 20px;
}
.tah-toast-dialog__actions {
    display: flex;
    justify-content: center;
    gap: 12px;
}
.tah-toast-dialog__btn {
    min-width: 100px;
    padding: 10px 20px;
    font-size: 0.875rem;
    font-weight: 500;
    color: #fff;
    background: var(--primary-color, #0066cc);
    border: none;
    border-radius: 10px;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.05s ease;
}
.tah-toast-dialog__btn:hover {
    background: var(--primary-hover, #0052a3);
}
.tah-toast-dialog__btn:active {
    transform: scale(0.98);
}
