/**
 * 文章编辑器内容样式
 * 用于美化文章中的各种元素（表格、引用、代码块等）
 * 
 * @theme 通用中性主题
 */

/* ============================================
   表格样式 (Table Styles)
   ============================================ */

/* 表格容器 - 直接作用于 table 标签 */
.article-content > table,
.apk_left_title > table {
    width: 100%;
    max-width: 800px;
    margin: 20px auto;
    border-collapse: collapse;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    background-color: #ffffff;
    border: 1px solid #e0e0e0;
}

/* 表头样式 */
.article-content > table thead tr,
.apk_left_title > table thead tr {
    background-color: #f5f5f5;
}

.article-content > table thead th,
.apk_left_title > table thead th {
    padding: 14px 18px;
    text-align: left;
    font-weight: 600;
    color: #333;
    font-size: 14px;
    border-bottom: 2px solid #ddd;
    white-space: nowrap;
}

/* 表格主体 */
.article-content > table tbody tr,
.apk_left_title > table tbody tr {
    background-color: #ffffff;
    border-bottom: 1px solid #eee;
}

.article-content > table tbody tr:last-child,
.apk_left_title > table tbody tr:last-child {
    border-bottom: none;
}

/* 斑马纹 - 固定隔行颜色 */
.article-content > table tbody tr:nth-child(odd),
.apk_left_title > table tbody tr:nth-child(odd) {
    background-color: #fafafa;
}

.article-content > table tbody tr:nth-child(even),
.apk_left_title > table tbody tr:nth-child(even) {
    background-color: #ffffff;
}

/* 表格单元格 */
.article-content > table td,
.apk_left_title > table td {
    padding: 12px 18px;
    font-size: 14px;
    color: #555;
    vertical-align: middle;
    white-space: nowrap;
}

/* 日期列 */
.article-content > table tbody td:first-child,
.apk_left_title > table tbody td:first-child {
    color: #888;
    font-size: 13px;
    white-space: nowrap;
}

/* 昵称列 */
.article-content > table tbody td:nth-child(2),
.apk_left_title > table tbody td:nth-child(2) {
    max-width: 250px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #333;
}

/* 金额列（或其他数值列） */
.article-content > table td,
.apk_left_title > table td {
    font-size: 14px;
    white-space: nowrap;
}

/* ============================================
   引用块样式 (Blockquote Styles)
   ============================================ */

.article-content blockquote,
.apk_left_title blockquote {
    margin: 20px auto;
    padding: 15px 20px;
    max-width: 800px;
    border-left: 3px solid #ddd;
    background-color: #f9f9f9;
    color: #666;
    font-size: 14px;
    line-height: 1.8;
}

.article-content blockquote p,
.apk_left_title blockquote p {
    margin: 0;
}

/* 引用来源 */
.article-content blockquote cite,
.apk_left_title blockquote cite {
    display: block;
    margin-top: 8px;
    font-size: 12px;
    color: #999;
    font-style: normal;
}

/* ============================================
   代码块样式 (Code Block Styles)
   ============================================ */

.article-content pre,
.apk_left_title pre {
    margin: 20px auto;
    padding: 15px;
    max-width: 800px;
    background-color: #f5f5f5;
    overflow-x: auto;
    font-family: "SF Mono", "Fira Code", "Consolas", monospace;
    font-size: 13px;
    line-height: 1.6;
    color: #333;
    border: 1px solid #e0e0e0;
}

.article-content code,
.apk_left_title code {
    font-family: inherit;
    background-color: #eee;
    padding: 2px 5px;
    border-radius: 3px;
    font-size: 0.9em;
    color: #c7254e;
}

.article-content pre code,
.apk_left_title pre code {
    background-color: transparent;
    padding: 0;
    color: inherit;
}

/* ============================================
   提示框样式 (Alert/Note Styles)
   ============================================ */

.article-content .alert,
.apk_left_title .alert {
    margin: 20px auto;
    padding: 12px 15px;
    max-width: 800px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 14px;
    line-height: 1.6;
}

.article-content .alert-info,
.apk_left_title .alert-info {
    background-color: #f0f7ff;
    border: 1px solid #cce5ff;
    color: #004085;
}

.article-content .alert-success,
.apk_left_title .alert-success {
    background-color: #f0fff4;
    border: 1px solid #c3e6cb;
    color: #155724;
}

.article-content .alert-warning,
.apk_left_title .alert-warning {
    background-color: #fffaf0;
    border: 1px solid #ffeeba;
    color: #856404;
}

.article-content .alert-danger,
.apk_left_title .alert-danger {
    background-color: #fff5f5;
    border: 1px solid #f5c6cb;
    color: #721c24;
}

/* ============================================
   响应式设计 (Responsive Design)
   ============================================ */

@media (max-width: 768px) {
    .article-content > table,
    .apk_left_title > table {
        font-size: 13px;
    }

    .article-content > table thead th,
    .apk_left_title > table thead th,
    .article-content > table td,
    .apk_left_title > table td {
        padding: 10px 12px;
    }

    .article-content > table tbody td:nth-child(2),
    .apk_left_title > table tbody td:nth-child(2) {
        max-width: 150px;
    }

    .article-content blockquote,
    .apk_left_title blockquote {
        padding: 12px 15px;
        margin: 15px 10px;
    }

    .article-content .alert,
    .apk_left_title .alert {
        margin: 15px 10px;
    }
}

@media (max-width: 480px) {
    .article-content > table,
    .apk_left_title > table {
        margin: 10px 0;
    }

    .article-content > table thead th,
    .apk_left_title > table thead th,
    .article-content > table td,
    .apk_left_title > table td {
        padding: 8px 10px;
        font-size: 12px;
    }

    .article-content > table tbody td:nth-child(2),
    .apk_left_title > table tbody td:nth-child(2) {
        max-width: 100px;
    }

    .article-content pre,
    .apk_left_title pre {
        padding: 12px 10px;
        font-size: 12px;
    }
}

/* ============================================
   动画效果 (Animations)
   ============================================ */

/* 表格行淡入动画 */
@keyframes tableFadeIn {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.article-content > table tbody tr,
.apk_left_title > table tbody tr {
    animation: tableFadeIn 0.35s ease forwards;
}

/* 为每一行添加延迟 */
.article-content > table tbody tr:nth-child(1),
.apk_left_title > table tbody tr:nth-child(1) { animation-delay: 0.04s; }

.article-content > table tbody tr:nth-child(2),
.apk_left_title > table tbody tr:nth-child(2) { animation-delay: 0.08s; }

.article-content > table tbody tr:nth-child(3),
.apk_left_title > table tbody tr:nth-child(3) { animation-delay: 0.12s; }

.article-content > table tbody tr:nth-child(4),
.apk_left_title > table tbody tr:nth-child(4) { animation-delay: 0.16s; }

.article-content > table tbody tr:nth-child(5),
.apk_left_title > table tbody tr:nth-child(5) { animation-delay: 0.2s; }

.article-content > table tbody tr:nth-child(6),
.apk_left_title > table tbody tr:nth-child(6) { animation-delay: 0.24s; }

.article-content > table tbody tr:nth-child(7),
.apk_left_title > table tbody tr:nth-child(7) { animation-delay: 0.28s; }

.article-content > table tbody tr:nth-child(8),
.apk_left_title > table tbody tr:nth-child(8) { animation-delay: 0.32s; }

.article-content > table tbody tr:nth-child(9),
.apk_left_title > table tbody tr:nth-child(9) { animation-delay: 0.36s; }