/**
 * Foxiz Child Theme - Copy Prompt Styling & Category Beautification
 * 
 * Elegant card-based prompt box with a modern floating copy button.
 * Matches the dark/minimalist aesthetic of gpt-image2.canghe.ai.
 * Designed to overlap safely with Foxiz theme hooks.
 */

/* ==========================================
   0. Global Design System Variables (亮紫色主调高亮)
   ========================================== */
:root {
    --sre-violet: #9b5de5; /* 高亮度现代紫罗兰亮紫，对比强烈，视觉华丽 */
    --sre-violet-glow: rgba(155, 93, 229, 0.45);
    --sre-violet-bg: rgba(155, 93, 229, 0.08);
}

/* ==========================================
   1. Prompt Details Box (现代化双语提示词卡片设计系统)
   ========================================== */
.sre-bilingual-prompt-wrapper {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    margin: 24px 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* 提示词单体卡片 */
.sre-prompt-card-block {
    position: relative !important;
    margin: 0 !important;
    padding: 16px !important;
    border-radius: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    
    /* 默认白天模式 (Light Mode) */
    background-color: #f8f9fa !important;
    border: 1px solid #dee2e6 !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02);
}

body.dark-mode .sre-prompt-card-block,
[data-theme='dark'] .sre-prompt-card-block,
[data-mode='dark'] .sre-prompt-card-block,
.dark-mode .sre-prompt-card-block {
    background-color: #0c0d10 !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: none !important;
}

.sre-prompt-card-block:hover {
    border-color: rgba(155, 93, 229, 0.4) !important;
    box-shadow: 0 6px 20px rgba(155, 93, 229, 0.06) !important;
}

/* 卡片 Header (标题与一键复制按钮 Flex 伸展对齐) */
.sre-prompt-card-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.sre-prompt-card-header .sre-card-title {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #2c3e50 !important;
    letter-spacing: 0.2px !important;
}

body.dark-mode .sre-prompt-card-header .sre-card-title,
[data-theme='dark'] .sre-prompt-card-header .sre-card-title,
[data-mode='dark'] .sre-prompt-card-header .sre-card-title,
.dark-mode .sre-prompt-card-header .sre-card-title {
    color: #e2e8f0 !important;
}

/* 按钮基类 */
.sre-card-copy-btn {
    all: unset !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 30px !important;
    line-height: 30px !important;
    padding: 0 14px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    user-select: none !important;
    white-space: nowrap !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    
    /* 英文复制按钮 (亮发光紫色实体) */
    color: #ffffff !important;
    background-color: var(--sre-violet) !important;
    box-shadow: 0 2px 8px var(--sre-violet-glow) !important;
}

.sre-card-copy-btn:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 14px var(--sre-violet-glow) !important;
    opacity: 0.95 !important;
}

/* 中文复制按钮 (优雅淡紫底紫边) */
.sre-card-copy-btn.sre-btn-cn {
    color: var(--sre-violet) !important;
    background-color: rgba(155, 93, 229, 0.08) !important;
    border: 1px solid rgba(155, 93, 229, 0.3) !important;
    box-shadow: none !important;
}

.sre-card-copy-btn.sre-btn-cn:hover {
    color: #ffffff !important;
    background-color: var(--sre-violet) !important;
    box-shadow: 0 4px 14px var(--sre-violet-glow) !important;
}

/* 成功状态 */
.sre-card-copy-btn.copied {
    background-color: #2ecc71 !important;
    border-color: #2ecc71 !important;
    color: #ffffff !important;
    box-shadow: 0 2px 8px rgba(46, 204, 113, 0.4) !important;
}

/* 文本/代码展示框 */
.sre-prompt-code-text {
    display: block !important;
    margin: 0 !important;
    max-height: 250px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px 14px !important;
    box-sizing: border-box !important;
    font-family: Consolas, Monaco, "Andale Mono", monospace !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
    white-space: pre-wrap !important;
    word-break: break-all !important;
    word-wrap: break-word !important;
    user-select: text !important;
    border-radius: 8px !important;
    
    /* 默认白天模式 (Light Mode) */
    background-color: #f1f3f5 !important;
    border: 1px solid #e9ecef !important;
    color: #2c3e50 !important;
}

body.dark-mode .sre-prompt-code-text,
[data-theme='dark'] .sre-prompt-code-text,
[data-mode='dark'] .sre-prompt-code-text,
.dark-mode .sre-prompt-code-text {
    background-color: #161821 !important;
    border-color: #222530 !important;
    color: #e3e8ef !important;
}

/* 微调滚动条 */
.sre-prompt-code-text::-webkit-scrollbar {
    width: 6px !important;
}
.sre-prompt-code-text::-webkit-scrollbar-thumb {
    background: #ccc !important;
    border-radius: 3px !important;
}

/* 保留旧类名 compatibility，全面映射至新 Flex 规范 */
.copy-prompt-box {
    all: unset !important;
    display: block !important;
}
.copy-prompt-box::before {
    content: none !important;
    display: none !important;
}

/* ==========================================
   2. Category Archive Card Beautification (母主题原始卡片适配，保留兜底)
   ========================================== */
.category-ai-image-prompts .p-wrap,
.category-image-portraits .p-wrap,
.category-image-products .p-wrap,
.category-image-illustration .p-wrap,
.category-image-game-assets .p-wrap,
.category-image-ui-design .p-wrap,
.category-image-architecture .p-wrap,
.category-image-landscapes .p-wrap {
    border-radius: 12px !important;
    padding: 16px !important;
    transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1), box-shadow 0.3s ease, border-color 0.3s ease !important;
    
    /* 默认白天模式 (Light Mode) */
    background: #ffffff !important;
    border: 1px solid #e9ecef !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
}

/* Card hover animation */
.category-ai-image-prompts .p-wrap:hover,
.category-image-portraits .p-wrap:hover,
.category-image-products .p-wrap:hover,
.category-image-illustration .p-wrap:hover,
.category-image-game-assets .p-wrap:hover,
.category-image-ui-design .p-wrap:hover,
.category-image-architecture .p-wrap:hover,
.category-image-landscapes .p-wrap:hover {
    transform: translateY(-4px) !important;
    border-color: var(--sre-violet) !important;
    box-shadow: 0 12px 30px rgba(155, 93, 229, 0.15) !important;
}

/* Dark mode overrides for default cards */
body.dark-mode .category-ai-image-prompts .p-wrap,
body.dark-mode .category-image-portraits .p-wrap,
body.dark-mode .category-image-products .p-wrap,
body.dark-mode .category-image-illustration .p-wrap,
body.dark-mode .category-image-game-assets .p-wrap,
body.dark-mode .category-image-ui-design .p-wrap,
body.dark-mode .category-image-architecture .p-wrap,
body.dark-mode .category-image-landscapes .p-wrap,
[data-theme='dark'] .category-ai-image-prompts .p-wrap,
[data-theme='dark'] .category-image-portraits .p-wrap,
[data-theme='dark'] .category-image-products .p-wrap,
[data-theme='dark'] .category-image-illustration .p-wrap,
[data-theme='dark'] .category-image-game-assets .p-wrap,
[data-theme='dark'] .category-image-ui-design .p-wrap,
[data-theme='dark'] .category-image-architecture .p-wrap,
[data-theme='dark'] .category-image-landscapes .p-wrap {
    background: #111317 !important;
    border: 1px solid rgba(255, 255, 255, 0.03) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}

body.dark-mode .category-ai-image-prompts .p-wrap:hover,
[data-theme='dark'] .category-ai-image-prompts .p-wrap:hover {
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.5) !important;
}

/* Enforce rounded image borders on these categories */
.category-ai-image-prompts .p-featured, 
.category-ai-image-prompts .featured-img,
.category-image-portraits .p-featured, 
.category-image-portraits .featured-img,
.category-image-products .p-featured, 
.category-image-products .featured-img,
.category-image-illustration .p-featured, 
.category-image-illustration .featured-img,
.category-image-game-assets .p-featured, 
.category-image-game-assets .featured-img,
.category-image-ui-design .p-featured, 
.category-image-ui-design .featured-img,
.category-image-architecture .p-featured, 
.category-image-architecture .featured-img,
.category-image-landscapes .p-featured, 
.category-image-landscapes .featured-img {
    border-radius: 8px !important;
    overflow: hidden !important;
}

/* ==========================================
   3. Custom Gallery Post Template Layout (图库专区单页详情美化 - 自适应白天黑夜)
   ========================================== */

/* 详情页居中极简大卡片排版 */
.sre-gallery-single-container {
    max-width: 900px;
    margin: 40px auto;
    padding: 30px;
    border-radius: 12px;
    transition: background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
    
    /* 默认白天模式 (Light Mode) */
    background-color: #ffffff !important;
    border: 1px solid #e9ecef !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.04) !important;
}

body.dark-mode .sre-gallery-single-container,
[data-theme='dark'] .sre-gallery-single-container,
[data-mode='dark'] .sre-gallery-single-container,
.dark-mode .sre-gallery-single-container {
    background-color: #0c0d10 !important; /* 纯黑底色，对齐 canghe */
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4) !important;
}

.sre-gallery-header {
    margin-bottom: 30px;
    padding-bottom: 20px;
    
    /* 默认白天模式 (Light Mode) */
    border-bottom: 1px solid #dee2e6 !important;
}

body.dark-mode .sre-gallery-header,
[data-theme='dark'] .sre-gallery-header,
[data-mode='dark'] .sre-gallery-header,
.dark-mode .sre-gallery-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.sre-gallery-title {
    font-size: 32px !important;
    font-weight: 800 !important;
    margin: 15px 0 10px 0 !important;
    
    /* 默认白天模式 (Light Mode) */
    color: #2c3e50 !important;
}

body.dark-mode .sre-gallery-title,
[data-theme='dark'] .sre-gallery-title,
[data-mode='dark'] .sre-gallery-title,
.dark-mode .sre-gallery-title {
    color: #ffffff !important;
}

.sre-gallery-meta {
    font-size: 13px;
    
    /* 默认白天模式 (Light Mode) */
    color: #7f8c8d !important;
}

body.dark-mode .sre-gallery-meta,
[data-theme='dark'] .sre-gallery-meta,
[data-mode='dark'] .sre-gallery-meta,
.dark-mode .sre-gallery-meta {
    color: #8a96a3 !important;
}

.sre-meta-divider {
    margin: 0 10px;
    
    /* 默认白天模式 (Light Mode) */
    color: #dee2e6 !important;
}

body.dark-mode .sre-meta-divider,
[data-theme='dark'] .sre-meta-divider,
[data-mode='dark'] .sre-meta-divider,
.dark-mode .sre-meta-divider {
    color: rgba(255, 255, 255, 0.15) !important;
}

/* 效果大图展示盒，突出生图细节 */
.sre-prompt-image-wrap {
    margin: 25px 0;
    text-align: center;
    border-radius: 8px;
    overflow: hidden;
    
    /* 默认白天模式 (Light Mode) */
    background-color: #f8f9fa !important;
    border: 1px solid #e9ecef !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.03) !important;
}

body.dark-mode .sre-prompt-image-wrap,
[data-theme='dark'] .sre-prompt-image-wrap,
[data-mode='dark'] .sre-prompt-image-wrap,
.dark-mode .sre-prompt-image-wrap {
    background-color: #16181d !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3) !important;
}

.sre-prompt-preview-img {
    max-width: 100%;
    max-height: 650px;
    display: inline-block;
    object-fit: contain !important; /* 不裁剪生图长宽比 */
}

/* AI 结构化解析区 */
.sre-prompt-analysis {
    margin-top: 35px;
    padding: 24px;
    border-radius: 8px;
    
    /* 默认白天模式 (Light Mode) */
    background-color: #f8f9fa !important;
    border: 1px solid #e9ecef !important;
}

body.dark-mode .sre-prompt-analysis,
[data-theme='dark'] .sre-prompt-analysis,
[data-mode='dark'] .sre-prompt-analysis,
.dark-mode .sre-prompt-analysis {
    background-color: #12141a !important;
    border: 1px solid rgba(255, 255, 255, 0.04) !important;
}

.sre-prompt-analysis h4 {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: var(--sre-violet, #9b5de5) !important; /* 统一为紫色 */
    margin: 20px 0 10px 0 !important;
    border-left: 3px solid var(--sre-violet, #9b5de5) !important;
    padding-left: 10px;
}

.sre-prompt-analysis h4:first-of-type {
    margin-top: 0 !important;
}

.sre-prompt-analysis p,
.sre-prompt-analysis li {
    font-size: 14px;
    line-height: 1.7;
    
    /* 默认白天模式 (Light Mode) */
    color: #495057 !important;
}

body.dark-mode .sre-prompt-analysis p,
body.dark-mode .sre-prompt-analysis li,
[data-theme='dark'] .sre-prompt-analysis p,
[data-theme='dark'] .sre-prompt-analysis li,
[data-mode='dark'] .sre-prompt-analysis p,
[data-mode='dark'] .sre-prompt-analysis li,
.dark-mode .sre-prompt-analysis p,
.dark-mode .sre-prompt-analysis li {
    color: #b8c1cc !important;
}

.sre-prompt-analysis ul {
    margin: 10px 0;
    padding-left: 20px;
    list-style-type: disc;
}

.sre-prompt-analysis li {
    margin-bottom: 6px;
}

/* ==========================================
   4. Force Layout Overrides for Whitelisted Categories (已废除，100% 降级使用母主题布局以对齐 aigc-news/25113)
   ========================================== */

/* ==========================================
   5. AI Prompts Masonry Archive Grid & Pill Filters (专属列表瀑布流样式)
   ========================================== */

/* 整体背景与容器布局 */
/* 整体背景与容器布局 - 自适应白天黑夜 */
.sre-archive-outer-wrap {
    padding: 10px 0 60px 0 !important;
    min-height: 100vh;
    transition: background-color 0.3s ease, color 0.3s ease;
    
    /* 默认白天模式 (Light Mode) */
    background-color: #f8f9fa !important;
    color: #2c3e50 !important;
}

body.dark-mode .sre-archive-outer-wrap,
[data-theme='dark'] .sre-archive-outer-wrap,
[data-mode='dark'] .sre-archive-outer-wrap,
.dark-mode .sre-archive-outer-wrap {
    background-color: #0b0c10 !important; /* 纯黑底色，对齐 canghe */
    color: #ffffff !important;
}

.sre-archive-container {
    max-width: 1600px !important; /* 拓宽至 1600px，对齐图库大版面宽窄 */
    margin: 0 auto;
    padding: 0 20px;
}

.sre-filters-wrapper {
    border-radius: 16px !important;
    padding: 24px !important;
    margin-top: 10px !important;
    margin-bottom: 40px !important;
    margin-left: 10px !important; /* 精确 10px 内缩对齐瀑布流图片外边缘 */
    margin-right: 10px !important; /* 精确 10px 内缩对齐瀑布流图片外边缘 */
    width: calc(100% - 20px) !important; /* 精确扣除 20px 保证等宽 */
    transition: background-color 0.3s ease, border-color 0.3s ease;
    box-sizing: border-box !important;
    
    /* 默认白天模式 (Light Mode) - 带圆角边框白色底盒 */
    background: #ffffff !important;
    border: 1px solid #e9ecef !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.02) !important;
}

body.dark-mode .sre-filters-wrapper,
[data-theme='dark'] .sre-filters-wrapper,
[data-mode='dark'] .sre-filters-wrapper,
.dark-mode .sre-filters-wrapper {
    background: #12141a !important;
    border: 1px solid #222530 !important;
    box-shadow: none !important;
}

.sre-filter-group {
    display: flex;
    align-items: flex-start;
    margin-bottom: 20px;
}

.sre-filter-group:last-child {
    margin-bottom: 0;
}

.sre-filter-label {
    width: 90px;
    min-width: 90px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding-top: 8px;
    color: #7f8c8d !important;
}

.sre-filter-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 10px;
}

/* 药丸按钮样式 */
.sre-pill-btn {
    padding: 6px 16px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    outline: none;
    
    /* 默认白天模式 (Light Mode) */
    background: #f1f3f5 !important;
    border: 1px solid #dee2e6 !important;
    color: #495057 !important;
}

.sre-pill-btn:hover {
    color: var(--sre-violet) !important;
    border-color: rgba(155, 93, 229, 0.4) !important;
    background: rgba(155, 93, 229, 0.04) !important;
}

/* 激活发光状态 (统一为提高亮度后的亮紫色) */
.sre-pill-btn.active {
    background: var(--sre-violet-bg) !important;
    border-color: var(--sre-violet) !important;
    color: var(--sre-violet) !important;
    box-shadow: 0 0 12px var(--sre-violet-glow) !important;
    font-weight: 600;
}

/* Dark mode overrides for pills */
body.dark-mode .sre-pill-btn,
[data-theme='dark'] .sre-pill-btn,
[data-mode='dark'] .sre-pill-btn,
.dark-mode .sre-pill-btn {
    background: #181b24 !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    color: #b8c1cc !important;
}

body.dark-mode .sre-pill-btn:hover,
[data-theme='dark'] .sre-pill-btn:hover,
[data-mode='dark'] .sre-pill-btn:hover,
.dark-mode .sre-pill-btn:hover {
    color: var(--sre-violet) !important;
    border-color: rgba(155, 93, 229, 0.5) !important;
    background: rgba(155, 93, 229, 0.02) !important;
}

body.dark-mode .sre-pill-btn.active,
[data-theme='dark'] .sre-pill-btn.active,
[data-mode='dark'] .sre-pill-btn.active,
.dark-mode .sre-pill-btn.active {
    background: var(--sre-violet-bg) !important;
    border-color: var(--sre-violet) !important;
    color: var(--sre-violet) !important;
    box-shadow: 0 0 12px var(--sre-violet-glow) !important;
}

/* 瀑布流容器间距 */
.sre-masonry-grid {
    width: 100% !important;
    margin: 0 auto;
}

/* 卡片单体 (外层仅负责 4 列定位和 20px 间隙 Padding，防抖动，对齐图 2) */
.sre-prompt-card {
    width: 25% !important; /* 物理 4 列布局 */
    padding: 0 10px !important; /* 左右各 10px，合计 20px 列间距 */
    margin-bottom: 20px !important; /* 卡片上下间隙 20px */
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}

/* 响应式断点自愈 */
@media (max-width: 1199px) {
    .sre-prompt-card {
        width: 33.333% !important; /* 降至 3 列 */
    }
}

@media (max-width: 991px) {
    .sre-prompt-card {
        width: 50% !important; /* 降至 2 列 */
    }
}

@media (max-width: 575px) {
    .sre-prompt-card {
        width: 100%; /* 手机端单列 */
        padding: 0;
    }
}

/* 内衬卡片容器 (实际承载视觉样式，提升性能与悬浮动效) */
.sre-prompt-card-inner {
    border-radius: 12px;
    overflow: hidden;
    transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1), box-shadow 0.3s ease, border-color 0.3s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
    
    /* 默认白天模式 (Light Mode) */
    background: #ffffff !important;
    border: 1px solid #e9ecef !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important;
}

.sre-prompt-card-inner:hover {
    transform: translateY(-5px);
    border-color: var(--sre-violet) !important;
    box-shadow: 0 12px 30px rgba(155, 93, 229, 0.15) !important;
}

/* Dark mode overrides for cards */
body.dark-mode .sre-prompt-card-inner,
[data-theme='dark'] .sre-prompt-card-inner,
[data-mode='dark'] .sre-prompt-card-inner,
.dark-mode .sre-prompt-card-inner {
    background: #12141a !important;
    border: 1px solid rgba(255, 255, 255, 0.04) !important;
    box-shadow: none !important;
}

body.dark-mode .sre-prompt-card-inner:hover,
[data-theme='dark'] .sre-prompt-card-inner:hover,
[data-mode='dark'] .sre-prompt-card-inner:hover,
.dark-mode .sre-prompt-card-inner:hover {
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.5) !important;
    border-color: rgba(155, 93, 229, 0.35) !important;
}

/* 大图与标徽 */
.sre-card-media-wrap {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #0f1015;
}

.sre-card-img {
    width: 100% !important;
    height: auto !important;
    display: block;
    transition: transform 0.5s ease;
}

.sre-prompt-card-inner:hover .sre-card-img {
    transform: scale(1.03);
}

/* Case 标徽 */
.sre-case-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    color: #ffffff;
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 700;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

/* 卡片文本区域 */
.sre-card-body {
    padding: 20px;
}

/* 第一行：大写分类与作者 */
.sre-card-meta-line {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.5px;
}

.sre-meta-cat {
    color: var(--sre-violet, #9b5de5) !important; /* 统一为紫色 */
    text-transform: uppercase;
}

.sre-meta-author {
    color: #7f8c8d;
}

/* 第二行：标题 */
.sre-card-title {
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    margin: 0 0 10px 0 !important;
}

.sre-card-title a {
    text-decoration: none !important;
    transition: color 0.2s ease;
    
    /* 默认白天模式 (Light Mode) */
    color: #2c3e50 !important;
}

.sre-card-title a:hover {
    color: var(--sre-violet) !important;
}

body.dark-mode .sre-card-title a,
[data-theme='dark'] .sre-card-title a,
[data-mode='dark'] .sre-card-title a,
.dark-mode .sre-card-title a {
    color: #ffffff !important;
}

body.dark-mode .sre-card-title a:hover,
[data-theme='dark'] .sre-card-title a:hover,
[data-mode='dark'] .sre-card-title a:hover,
.dark-mode .sre-card-title a:hover {
    color: var(--sre-violet) !important;
}

/* 第三行：文本提示词摘要 (限制展示 3 行) */
.sre-card-excerpt {
    font-size: 13px !important;
    line-height: 1.6 !important;
    margin: 0 0 16px 0 !important;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    
    /* 默认白天模式 (Light Mode) */
    color: #7f8c8d !important;
}

body.dark-mode .sre-card-excerpt,
[data-theme='dark'] .sre-card-excerpt,
[data-mode='dark'] .sre-card-excerpt,
.dark-mode .sre-card-excerpt {
    color: #95a5a6 !important;
}

/* 第四行：风格药丸 */
.sre-card-badges-line {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 20px;
}

.sre-card-badge-pill {
    border-radius: 12px;
    padding: 3px 10px;
    font-size: 11px;
    
    /* 默认白天模式 (Light Mode) */
    background: #f1f3f5 !important;
    color: #495057 !important;
    border: 1px solid #dee2e6 !important;
}

body.dark-mode .sre-card-badge-pill,
[data-theme='dark'] .sre-card-badge-pill,
[data-mode='dark'] .sre-card-badge-pill,
.dark-mode .sre-card-badge-pill {
    background: #181b24 !important;
    color: #b8c1cc !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
}

/* 第五行：交互按钮 (对齐图 3 细节，两个按钮平均平铺) */
.sre-card-actions {
    display: flex !important;
    flex-wrap: nowrap !important; /* 物理锁定，绝对不允许换行 */
    gap: 8px !important;
    justify-content: space-between !important;
}

.sre-card-btn {
    flex: 1 !important; /* 按钮宽度均分，比例完美对称 */
    padding: 8px 6px !important;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 4px;
    justify-content: center;
    transition: all 0.2s ease;
    outline: none;
    box-sizing: border-box;
    white-space: nowrap !important; /* 强制单行，绝对不折行 */
    overflow: hidden;
    text-overflow: ellipsis;
    
    /* 默认白天模式 (Light Mode) */
    background: #f1f3f5 !important;
    border: 1px solid #dee2e6 !important;
    color: #495057 !important;
}

body.dark-mode .sre-card-btn,
[data-theme='dark'] .sre-card-btn,
[data-mode='dark'] .sre-card-btn,
.dark-mode .sre-card-btn {
    background: #181b24 !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    color: #ffffff !important;
}

.sre-card-btn svg {
    width: 13px;
    height: 13px;
    display: block;
    flex-shrink: 0;
}

/* Copy Prompt 按钮悬浮及成功态 */
.sre-btn-copy-prompt:hover {
    color: var(--sre-violet) !important;
    border-color: rgba(155, 93, 229, 0.4) !important;
    background: rgba(155, 93, 229, 0.05) !important;
}

.sre-btn-copy-prompt.success {
    background: #2ecc71 !important;
    border-color: #2ecc71 !important;
    color: #ffffff !important;
    box-shadow: 0 0 10px rgba(46, 204, 113, 0.4) !important;
}

/* View Details 按钮悬浮 */
.sre-btn-view-details {
    text-decoration: none !important;
}

.sre-btn-view-details:hover {
    color: var(--sre-violet) !important;
    border-color: rgba(155, 93, 229, 0.4) !important;
    background: rgba(155, 93, 229, 0.05) !important;
}

.sre-no-posts {
    grid-column: 1 / -1;
    text-align: center;
    color: #7f8c8d;
    padding: 80px 0;
    font-size: 15px;
}

/* ==========================================
   6. Two-Column Sticky Details Page Styles (1.2.2-v6 新增)
   ========================================== */

/* 全局包装容器，自适应整站亮暗色 */
.sre-gallery-detail-wrapper {
    background-color: transparent !important;
    color: #333333;
    width: 100%;
    box-sizing: border-box;
}

body.dark-mode .sre-gallery-detail-wrapper,
[data-theme="dark"] .sre-gallery-detail-wrapper {
    color: #e0e0e0;
}

.sre-gallery-detail-container {
    max-width: 1300px;
    margin: 0 auto;
    padding: 40px 24px;
    box-sizing: border-box;
}

/* 面包屑导航样式 */
.sre-detail-breadcrumb {
    font-size: 13px;
    color: #7f8c8d;
    margin-bottom: 25px;
}

.sre-detail-breadcrumb a {
    color: #7f8c8d;
    text-decoration: none;
    transition: color 0.2s ease;
}

.sre-detail-breadcrumb a:hover {
    color: var(--sre-violet);
}

/* 强行解除主题容器的 overflow 限制，彻底激活 sticky 特效 */
#page,
.site-outer,
.single-post,
.site-wrap {
    overflow: visible !important;
}

/* 左右分栏 Grid 架构 */
.sre-gallery-detail-wrapper .sre-two-col-flex-container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 40px !important;
    width: 100% !important;
    max-width: 100% !important;
    align-items: flex-start !important;
    box-sizing: border-box !important;
}

/* 左侧大图：Sticky 随屏滚动固定 (60% 宽度) */
.sre-gallery-detail-wrapper .sre-two-col-layout-left-sidebar {
    flex: 0 0 calc(60% - 20px) !important;
    width: calc(60% - 20px) !important;
    max-width: calc(60% - 20px) !important;
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 130px !important; /* 避开主站浮动导航栏 */
    z-index: 10 !important;
    align-self: flex-start !important; /* 极重要：让左栏自身缩水高度，并在网格空间内滑动 */
    box-sizing: border-box !important;
}

.sre-detail-sticky-media {
    width: 100%;
}

.sre-detail-preview-img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.06);
    border: 1px solid #e9ecef;
    transition: border-color 0.3s ease;
}

body.dark-mode .sre-detail-preview-img,
[data-theme="dark"] .sre-detail-preview-img {
    border-color: #222530;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
}

/* 右侧提示词详细剖析区域 (40% 宽度) */
.sre-gallery-detail-wrapper .sre-two-col-layout-right-content {
    flex: 0 0 calc(40% - 20px) !important;
    width: calc(40% - 20px) !important;
    max-width: calc(40% - 20px) !important;
    min-width: 0 !important;
    align-self: flex-start !important;
    box-sizing: border-box !important;
}

/* 右侧正文高可用遮罩：隐藏在左侧已经 Sticky 展示的特色大图和说明 */
.sre-two-col-layout-right-content .sre-prompt-image-wrap,
.sre-two-col-layout-right-content .sre-original-intro,
.sre-two-col-layout-right-content .sre-prompt-preview-img,
.sre-two-col-layout-right-content img.sre-prompt-preview-img {
    display: none !important;
}

.sre-detail-title {
    font-size: 30px;
    font-weight: 700;
    line-height: 1.3;
    margin: 0 0 15px 0;
    color: #1a1a1a;
}

body.dark-mode .sre-detail-title,
[data-theme="dark"] .sre-detail-title {
    color: #ffffff;
}

/* Meta 标签条 */
.sre-detail-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 25px;
    font-size: 13px;
    color: #7f8c8d;
}

.sre-meta-item i {
    margin-right: 5px;
    color: #95a5a6;
}

.sre-author-highlight {
    color: var(--sre-violet);
    font-weight: 600;
}

/* 提示词说明块 */
.sre-detail-intro-box {
    background-color: #ffffff;
    border-left: 4px solid var(--sre-violet);
    padding: 16px 20px;
    font-size: 14px;
    line-height: 1.6;
    border-radius: 4px;
    margin-bottom: 25px;
    color: #555555;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.02);
}

body.dark-mode .sre-detail-intro-box,
[data-theme="dark"] .sre-detail-intro-box {
    background-color: #12141a;
    color: #b0b0b0;
    box-shadow: none;
}

/* 提示词复制盒子细节 */
.sre-detail-copy-box {
    margin-bottom: 30px;
}

.sre-copy-box-header {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 10px;
    color: #555555;
}

body.dark-mode .sre-copy-box-header,
[data-theme="dark"] .sre-copy-box-header {
    color: #aaaaaa;
}

.sre-detail-copy-box .copy-prompt-box {
    background-color: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 24px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02);
}

body.dark-mode .sre-detail-copy-box .copy-prompt-box,
[data-theme="dark"] .sre-detail-copy-box .copy-prompt-box {
    background-color: #12141a;
    border-color: #222530;
    box-shadow: none;
}

.sre-detail-copy-box .prompt-text {
    background: #f8f9fa !important;
    border: 1px solid #e9ecef !important;
    color: #333333 !important;
    font-size: 14px !important;
    padding: 18px !important;
    border-radius: 6px !important;
    margin-bottom: 16px !important;
    white-space: pre-wrap !important;
    word-break: break-all !important;
    max-height: 280px !important;
}

body.dark-mode .sre-detail-copy-box .prompt-text,
[data-theme="dark"] .sre-detail-copy-box .prompt-text {
    background: #191c24 !important;
    border-color: #2a2e3d !important;
    color: #e0e0e0 !important;
}

.sre-detail-copy-box .copy-prompt-btn {
    width: 100% !important;
    height: 44px !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    justify-content: center !important;
}

/* AI 解析剖析盒子 */
.sre-detail-analysis-box {
    background-color: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 24px 28px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02);
}

body.dark-mode .sre-detail-analysis-box,
[data-theme="dark"] .sre-detail-analysis-box {
    background-color: #12141a;
    border-color: #222530;
    box-shadow: none;
}

.sre-detail-analysis-box h4 {
    border-left: 3px solid var(--sre-violet);
    padding-left: 12px;
    font-size: 15px;
    font-weight: 700;
    margin: 25px 0 12px 0;
    color: #1a1a1a;
}

.sre-detail-analysis-box h4:first-of-type {
    margin-top: 0;
}

body.dark-mode .sre-detail-analysis-box h4,
[data-theme="dark"] .sre-detail-analysis-box h4 {
    color: #ffffff;
}

.sre-detail-analysis-box p,
.sre-detail-analysis-box ul {
    font-size: 14px;
    line-height: 1.7;
    color: #555555;
    margin: 0 0 15px 0;
}

body.dark-mode .sre-detail-analysis-box p,
body.dark-mode .sre-detail-analysis-box ul,
[data-theme="dark"] .sre-detail-analysis-box p,
[data-theme="dark"] .sre-detail-analysis-box ul {
    color: #b0b0b0;
}

.sre-detail-analysis-box ul {
    padding-left: 20px;
}

.sre-detail-analysis-box li {
    margin-bottom: 8px;
}

.sre-detail-analysis-box li strong {
    color: #333333;
}

body.dark-mode .sre-detail-analysis-box li strong,
[data-theme="dark"] .sre-detail-analysis-box li strong {
    color: #ffffff;
}

/* 底部全宽评论区域 */
.sre-detail-comments-section {
    margin-top: 60px;
    padding-top: 40px;
    border-top: 1px solid #e9ecef;
}

body.dark-mode .sre-detail-comments-section,
[data-theme="dark"] .sre-detail-comments-section {
    border-color: #222530;
}

/* 响应式断点控制 */
@media (max-width: 991px) {
    .sre-gallery-detail-wrapper .sre-two-col-flex-container {
        flex-direction: column !important;
        gap: 30px !important;
    }
    .sre-gallery-detail-wrapper .sre-two-col-layout-left-sidebar,
    .sre-gallery-detail-wrapper .sre-two-col-layout-right-content {
        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    .sre-gallery-detail-wrapper .sre-two-col-layout-left-sidebar {
        position: static !important;
    }
    .sre-detail-title {
        font-size: 24px;
    }
}

/* 相关推荐模块 (Related Posts V8) */
.sre-gallery-detail-wrapper .sre-detail-related-section {
    margin-top: 50px !important;
    padding-top: 40px !important;
    border-top: 1px solid #e9ecef !important;
    display: block !important;
    width: 100% !important;
    clear: both !important;
}

body.dark-mode .sre-gallery-detail-wrapper .sre-detail-related-section,
[data-theme="dark"] .sre-gallery-detail-wrapper .sre-detail-related-section {
    border-color: #222530 !important;
}

.sre-gallery-detail-wrapper .sre-related-title {
    font-size: 20px !important;
    font-weight: 700 !important;
    margin-bottom: 25px !important;
    color: #1a1a1a !important;
    border-left: 4px solid var(--sre-violet) !important;
    padding-left: 12px !important;
    display: block !important;
}

body.dark-mode .sre-gallery-detail-wrapper .sre-related-title,
[data-theme="dark"] .sre-gallery-detail-wrapper .sre-related-title {
    color: #ffffff !important;
}

.sre-gallery-detail-wrapper .sre-related-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 20px !important;
    width: 100% !important;
}

.sre-gallery-detail-wrapper .sre-related-card {
    background-color: #ffffff !important;
    border: 1px solid #e9ecef !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.02) !important;
    display: flex !important;
    flex-direction: column !important;
    width: auto !important;
    max-width: 100% !important;
    height: 100% !important;
}

body.dark-mode .sre-gallery-detail-wrapper .sre-related-card,
[data-theme="dark"] .sre-gallery-detail-wrapper .sre-related-card {
    background-color: #12141a !important;
    border-color: #222530 !important;
    box-shadow: none !important;
}

.sre-gallery-detail-wrapper .sre-related-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 10px 25px rgba(155, 93, 229, 0.15) !important;
    border-color: rgba(155, 93, 229, 0.3) !important;
}

.sre-gallery-detail-wrapper .sre-related-card-media {
    width: 100% !important;
    height: 180px !important;
    overflow: hidden !important;
    position: relative !important;
}

.sre-gallery-detail-wrapper .sre-related-card-media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.5s ease !important;
}

.sre-gallery-detail-wrapper .sre-related-card:hover .sre-related-card-media img {
    transform: scale(1.06) !important;
}

.sre-gallery-detail-wrapper .sre-related-card-info {
    padding: 16px !important;
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important;
    justify-content: space-between !important;
}

.sre-gallery-detail-wrapper .sre-related-card-title {
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin: 0 0 12px 0 !important;
}

.sre-gallery-detail-wrapper .sre-related-card-title a {
    color: #2c3e50 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

body.dark-mode .sre-gallery-detail-wrapper .sre-related-card-title a,
[data-theme="dark"] .sre-gallery-detail-wrapper .sre-related-card-title a {
    color: #e0e0e0 !important;
}

.sre-gallery-detail-wrapper .sre-related-card-title a:hover {
    color: var(--sre-violet) !important;
}

.sre-gallery-detail-wrapper .sre-related-copy-btn {
    all: unset !important; /* 清空 absolute 所有干扰 */
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 36px !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
    transition: all 0.2s ease !important;
    margin-top: 12px !important;
    
    /* 默认白天模式 (Light Mode) */
    background: rgba(155, 93, 229, 0.05) !important;
    border: 1px solid rgba(155, 93, 229, 0.3) !important;
    color: var(--sre-violet) !important;
}

.sre-gallery-detail-wrapper .sre-related-copy-btn:hover {
    background: var(--sre-violet) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px var(--sre-violet-glow) !important;
}

body.dark-mode .sre-gallery-detail-wrapper .sre-related-copy-btn,
[data-theme="dark"] .sre-gallery-detail-wrapper .sre-related-copy-btn {
    background: rgba(155, 93, 229, 0.1) !important;
    border: 1px solid rgba(155, 93, 229, 0.4) !important;
    color: #ffffff !important;
}

body.dark-mode .sre-gallery-detail-wrapper .sre-related-copy-btn:hover,
[data-theme="dark"] .sre-gallery-detail-wrapper .sre-related-copy-btn:hover {
    background: var(--sre-violet) !important;
    color: #ffffff !important;
}

@media (max-width: 991px) {
    .sre-gallery-detail-wrapper .sre-related-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 575px) {
    .sre-gallery-detail-wrapper .sre-related-grid {
        grid-template-columns: 1fr !important;
    }
}