/* ==========================================================================
   AIEO 旗舰版 4.9 全局样式中枢 (Global Style Hub)
   涵盖：基础变量、高定导航、发光组件、卡片表格引擎、移动端自适应、页脚等
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. 全局基础样式与变量 (Global Base & Variables)
   -------------------------------------------------------------------------- */
:root { 
    --aieo-bg: #1a202c; 
    --aieo-active: #2563eb; 
    --aieo-text-main: #334155;
    --aieo-border: #e2e8f0;
    --footer-bg: #0f172a;
}

body { 
    background-color: #f8fafc; 
    font-size: 0.88rem; 
    font-family: 'Inter', 'Segoe UI', system-ui, sans-serif; 
    margin: 0;
    color: var(--aieo-text-main);
    display: block; 
    min-height: auto; 
}

/* 解除父级限制，确保 Sticky 悬浮组件和弹窗生效 */
.card, .container-fluid, .custom-table-responsive { 
    overflow-x: visible !important; 
    overflow-y: visible !important; 
}

/* 统一的卡片风格 */
.card { 
    border: none; border-radius: 12px; 
    box-shadow: 0 4px 12px rgba(0,0,0,0.05); margin-bottom: 20px; 
}

/* --------------------------------------------------------------------------
   2. 旗舰导航与页头 (Header & Navigation)
   -------------------------------------------------------------------------- */
.navbar-custom {
    background-color: var(--aieo-bg) !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    height: 68px;
}

/* 强制锁定导航悬浮 */
.navbar-custom.sticky-top { 
    position: -webkit-sticky !important; 
    position: sticky !important; 
    top: 0 !important; 
    z-index: 1030 !important; 
}

/* 主导航文字与高亮底色 */
.navbar-nav .nav-link { border-radius: 8px; padding: 8px 15px !important; margin: 0; font-size: 0.9375rem; transition: all 0.2s; letter-spacing: 0.01em; }
.navbar-nav .nav-link:hover { background-color: rgba(255,255,255,0.06); }
.navbar-nav .nav-link.active { background-color: rgba(255,255,255,0.1); color: #fff !important; font-weight: 600; }

/* 高定发光胶囊按钮 (充值/续费) */
.btn-action-pill { 
    display: inline-flex; align-items: center; justify-content: center; 
    height: 32px; padding: 0 18px; font-size: 0.75rem; font-weight: 700; 
    border-radius: 50px; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); text-decoration: none; 
}
.btn-recharge-glow { 
    background: linear-gradient(135deg, #f6ad55 0%, #ed8936 100%); color: #fff !important; border: 1px solid transparent; box-shadow: 0 0 12px rgba(237, 137, 54, 0.3); 
}
.btn-recharge-glow:hover { box-shadow: 0 0 18px rgba(237, 137, 54, 0.6); transform: translateY(-1px); }
.btn-recharge-glow.active-pulse { box-shadow: 0 0 20px rgba(237, 137, 54, 0.7); border: 1px solid #fbd38d; }
.btn-renew-outline { 
    background: transparent; color: #f6ad55 !important; border: 1px solid rgba(246, 173, 85, 0.5); 
}
.btn-renew-outline:hover { background: rgba(246, 173, 85, 0.1); border-color: #f6ad55; }
.tier-tag { font-size: 0.65rem; padding: 2px 8px; border-radius: 4px; font-weight: 800; }

/* --------------------------------------------------------------------------
   3. 旗舰高定 UI 控件 (Capsules, Toggles, Textareas) - 融合 task_list.php
   -------------------------------------------------------------------------- */
/* PC 端表格定宽保护 */
@media (min-width: 992px) { 
    .pc-table-min { min-width: 1150px; } 
}

/* 极简下拉框与输入框融合体 (带自定义缩小版箭头) */
.inline-capsule { 
    width: auto; display: inline-block; padding: 2px 18px 2px 8px; font-size: 0.7rem; 
    font-weight: 600; color: #495057; border-radius: 6px; border: 1px solid #dee2e6; 
    background-color: #f8f9fa; cursor: pointer; transition: all 0.2s;
    appearance: none; -webkit-appearance: none;
    background-image: url('data:image/svg+xml;utf8,<svg fill="gray" height="10" viewBox="0 0 24 24" width="10" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>');
    background-repeat: no-repeat; background-position: right 4px center; background-size: 10px; 
}
.inline-capsule:focus { border-color: #0d6efd; box-shadow: 0 0 0 2px rgba(13,110,253,.15); background-color: #fff; outline: none; }
.inline-capsule:disabled { background-color: #e9ecef; opacity: 0.7; cursor: not-allowed; }

/* 智能配图联动开关 */
.pic-toggle-capsule { 
    font-size: 0.7rem; padding: 2px 8px; border-radius: 6px; margin: 2px; cursor: pointer; font-weight: 600; user-select: none; transition: all 0.2s; border: 1px solid transparent; display: inline-flex; align-items: center; 
}
.pic-toggle-capsule.active { background-color: #e7f1ff; color: #0d6efd; border-color: #b6d4fe; }
.pic-toggle-capsule.inactive { background-color: #f8f9fa; color: #adb5bd; border-color: #dee2e6; text-decoration: line-through; }
.pic-toggle-capsule.locked { cursor: not-allowed; opacity: 0.6; }

/* 任务 ID、气泡与行内直编框 */
.id-badge { background-color: #f1f3f5; color: #6c757d; border: 1px solid #e9ecef; padding: 2px 8px; border-radius: 12px; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.5px; }
.time-micro { font-size: 0.65rem; color: #adb5bd; margin-top: 4px; font-family: monospace; }
.tooltip-icon { cursor: pointer; color: #0d6efd; background: #e7f1ff; padding: 2px 6px; border-radius: 4px; font-size: 0.7rem; font-weight: bold; transition: all 0.2s; }
.tooltip-icon:hover { background: #0d6efd; color: #fff; }

.edit-text-hover { cursor: text; text-decoration: underline dashed #dee2e6; text-underline-offset: 3px; min-height: 20px; display: block; }
.edit-textarea { font-size: 0.85rem; border: 1px solid #0d6efd !important; border-radius: 8px; padding: 8px; box-shadow: 0 4px 12px rgba(13,110,253,0.1); min-height: 70px; resize: vertical; line-height: 1.4; }

/* 模态框长文本编辑区 (旧版降级方案保留) */
.fixed-edit-area { position: fixed !important; z-index: 10001; width: 650px; left: 50%; top: 50%; transform: translate(-50%, -50%); background: #fff; border: 3px solid #3182ce; border-radius: 12px; padding: 25px; box-shadow: 0 0 0 1000px rgba(0,0,0,0.5); }

/* --------------------------------------------------------------------------
   4. 表格悬浮、状态徽章与黑屏终端
   -------------------------------------------------------------------------- */
#taskTable thead th {
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 68px !important; /* 接轨导航栏高度 */
    z-index: 1020 !important;
    background-color: #f8fafc !important; 
    box-shadow: inset 0 -1px 0 #dee2e6, 0 3px 5px rgba(0,0,0,0.04) !important;
    border-bottom: 2px solid #e2e8f0 !important; 
    vertical-align: middle !important;
}

/* 动画特效与工作台状态色 */
@keyframes spin { 100% { transform: rotate(360deg); } } 
.spin-anim { animation: spin 2s linear infinite; display: inline-block; }
.bg-success-subtle { background-color: #dcfce7 !important; color: #15803d !important; }
.bg-warning-subtle { background-color: #fef9c3 !important; color: #854d0e !important; }
.bg-danger-subtle { background-color: #fee2e2 !important; color: #b91c1c !important; }

/* 终端日志监视器 */
.status-box { background: #0f172a; color: #48bb78; border-radius: 8px; padding: 12px; font-family: monospace; height: 140px; overflow-y: auto; font-size: 0.75rem; border: 1px solid #334155; line-height: 1.4; }

/* --------------------------------------------------------------------------
   5. 📱 响应式布局 (Media Queries) - 包含导航栏收缩与卡片式表格
   -------------------------------------------------------------------------- */

/* 尴尬期 (992px-1280px) 导航文字换行防挤压 */
.navbar-nav .nav-link, .btn-action-pill, .dropdown-toggle, .balance-item { white-space: nowrap !important; }
@media (min-width: 992px) and (max-width: 1280px) {
    .navbar-nav .nav-link { padding: 7px 10px !important; font-size: 0.875rem !important; }
    .nav-mobile-row.gap-4 { gap: 0.75rem !important; }
    .bg-dark.rounded-pill { padding-left: 10px !important; padding-right: 10px !important; }
    .balance-item { font-size: 0.75rem !important; }
    .btn-action-pill { padding: 0 12px; font-size: 0.72rem; }
    .nav-mobile-row .dropdown button { padding: 2px 8px; font-size: 0.72rem !important; }
}

/* 移动端主轴适配 (小于 992px) */
@media (max-width: 991.98px) {
    /* 导航下拉层级防穿透 */
    .navbar-collapse { position: absolute; top: 100%; left: 0; right: 0; background: var(--aieo-bg); padding: 1.5rem; box-shadow: 0 15px 35px rgba(0,0,0,0.5); z-index: 1050; border-top: 1px solid rgba(255,255,255,0.05); }
    .mobile-divider { border-top: 1px solid rgba(255,255,255,0.1); margin: 15px 0; width: 100%; }
    .nav-mobile-row { flex-direction: column; width: 100%; align-items: flex-start; gap: 15px; }
    .nav-mobile-row > div { width: 100%; }

    /* 发单表单折叠分割线 */
    .mobile-form-split { border-right: none !important; border-bottom: 1px solid #dee2e6; padding-bottom: 1.5rem; margin-bottom: 1.5rem; }
    
    /* 🌟 核心：移动端表格卡片流转换 */
    .mobile-card-table thead { display: none; }
    .mobile-card-table tbody { display: block; padding: 0; }
    .mobile-card-table tbody tr { 
        display: flex; flex-direction: column; background: #fff; border-radius: 12px; 
        box-shadow: 0 4px 12px rgba(0,0,0,0.04); margin-bottom: 1rem; padding: 15px; border: 1px solid #e9ecef; 
    }
    .mobile-card-table tbody td { 
        display: flex; flex-direction: column; align-items: flex-start; text-align: left; 
        border-bottom: 1px dashed #f1f3f5; padding: 10px 0; width: 100%; 
    }
    .mobile-card-table tbody td::before { 
        content: attr(data-label); font-weight: 600; color: #adb5bd; font-size: 0.8rem; margin-bottom: 8px; 
    }
    .mobile-card-table tbody td:last-child { border-bottom: none; padding-bottom: 0; }
    
    /* 内容防溢出与重新对齐 */
    .td-content-left { width: 100%; }
    .edit-text { max-width: 100% !important; white-space: normal; word-break: break-all; }
    .strategy-capsule-group { justify-content: flex-start !important; }
    .action-column .d-flex { justify-content: flex-start !important; flex-wrap: wrap; gap: 10px !important; }

    /* 🌟 引擎配置：移动端默认折叠，仅显示一行摘要，点开才铺开控件 —— 一屏可显示更多任务 */
    .mobile-card-table td[data-label="⚙️ 引擎策略配置"]::before { display: none; }
    .mobile-card-table td[data-label="⚙️ 引擎策略配置"] { padding-top: 6px; padding-bottom: 6px; }
    .cfg-summary {
        display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%;
        padding: 9px 12px; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 9px;
        font-size: 0.8rem; font-weight: 700; color: #475569; cursor: pointer;
        position: relative; z-index: 6;  /* 高于 locked-mask，锁定任务也能展开查看 */
    }
    .cfg-summary:active { background: #eef2f7; }
    .cfg-summary .cfg-chevron { color: #94a3b8; transition: transform 0.2s ease; flex-shrink: 0; }
    .cfg-controls { display: none; margin-top: 12px; }
    tr.cfg-open .cfg-controls { display: block; }
    tr.cfg-open .cfg-summary .cfg-chevron { transform: rotate(180deg); }
}

/* --------------------------------------------------------------------------
   6. 其他独立模块 (Article, Assets, Support & Sidebar)
   -------------------------------------------------------------------------- */
.view-action-bar { 
    position: sticky; top: 60px; z-index: 1020; 
    background: rgba(255, 255, 255, 0.9); backdrop-filter: blur(12px);
    border-bottom: 1px solid #e2e8f0; padding: 12px 0; margin-top: -1.5rem;
}
.article-container { background: #fff; border-radius: 20px; padding: 40px; border: 1px solid #e2e8f0; }
.article-body { line-height: 1.8; font-size: 1.05rem; }
.article-body h2 { color: #0f172a; font-weight: 800; margin-top: 2rem; border-bottom: 2px solid #f1f5f9; padding-bottom: 10px; }
.article-body img { max-width: 100%; border-radius: 12px; margin: 20px 0; box-shadow: 0 4px 12px rgba(0,0,0,0.05); }

.seo-preview-box { background: #fff; border-radius: 10px; border: 1px solid #dfe1e5; padding: 15px; }
.google-url { color: #202124; font-size: 13px; }
.google-title { color: #1a0dab; font-size: 18px; text-decoration: none; display: block; }
.google-desc { color: #4d5156; font-size: 13px; line-height: 1.4; }
.meta-label { font-size: 0.75rem; font-weight: 700; color: #64748b; text-transform: uppercase; display: block; }

.recharge-card { transition: all 0.3s ease; border: 1px solid #e2e8f0; border-radius: 20px; overflow: hidden; }
.recharge-card:hover { transform: translateY(-8px); box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.08) !important; }
.recharge-card.featured { border: 2px solid #ed8936; }

.stat-card { background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%); color: white; border-radius: 16px; padding: 30px; }
.method-badge { background: #f1f5f9; border: 1px solid #e2e8f0; padding: 4px 10px; border-radius: 6px; font-size: 0.8rem; font-weight: 600; }

.code-container { background-color: #1e293b; border-radius: 12px; padding: 20px; position: relative; }
.code-container pre { color: #e2e8f0; margin: 0; font-size: 0.85rem; font-family: 'Courier New', monospace; overflow-x: auto; }
.btn-copy, .btn-download { position: absolute; top: 15px; font-size: 0.75rem; font-weight: bold; border-radius: 8px; padding: 5px 12px; border: 1px solid rgba(255,255,255,0.2); background: rgba(0,0,0,0.3); color: white; transition: 0.2s; }
.btn-copy { right: 120px; }
.btn-download { right: 15px; background: #0d6efd; border-color: #0d6efd; }

.legal-container { max-width: 900px; margin: 0 auto; }
.legal-card { border: none; border-radius: 16px; box-shadow: 0 10px 40px rgba(0,0,0,0.03); background: #fff; }
.legal-content h3 { font-size: 1.25rem; font-weight: bold; margin-top: 2rem; color: #1e293b; }
.legal-content p, .legal-content li { font-size: 0.95rem; color: #475569; line-height: 1.8; }

.contact-card { background: linear-gradient(145deg, #1a202c 0%, #2d3748 100%); color: white; border-radius: 12px; padding: 25px; text-align: center; }
.qr-box { width: 150px; height: 150px; background: #fff; border-radius: 12px; margin: 0 auto 15px; padding: 10px; }

.bridge-sidebar .nav-link { color: #64748b; font-weight: 600; padding: 12px 20px; border-radius: 12px; margin-bottom: 8px; transition: 0.2s; }
.bridge-sidebar .nav-link.active { background-color: #0f172a; color: #fff; box-shadow: 0 4px 12px rgba(0,0,0,0.1); }

/* --------------------------------------------------------------------------
   7. 全局组件 (Alerts, BackToTop, Popups)
   -------------------------------------------------------------------------- */
.alert-progress-bar { position: absolute; bottom: 0; left: 0; height: 3px; background: rgba(0,0,0,0.1); width: 100%; transform-origin: left; animation: alert-shrink 3s linear forwards; }
@keyframes alert-shrink { from { transform: scaleX(1); } to { transform: scaleX(0); } }

/* 置顶按钮移到 150px 避开页脚 API 中心按钮 */
.back-to-top {
    position: fixed; bottom: 150px; right: 30px; width: 48px; height: 48px;
    background-color: #1e293b; color: #ffffff; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.8rem; opacity: 0; visibility: hidden; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 2000; box-shadow: 0 4px 15px rgba(0,0,0,0.2); text-decoration: none; border: 1px solid rgba(255,255,255,0.1);
}
.back-to-top.show { opacity: 1; visibility: visible; }
.back-to-top:hover { background-color: #3b82f6; transform: translateY(-5px); color: #fff; }
/* ==========================================
   🌟 AIEO 全局高级弹窗 (AieoDialog) 核心样式
   ========================================== */
.aieo-dialog-icon { 
    font-size: 2.5rem; 
    margin-bottom: 0.5rem; 
}
.aieo-dialog-msg { 
    font-size: 0.95rem; 
    color: #475569; 
    line-height: 1.6; 
    white-space: pre-wrap; 
}
.aieo-dialog-msg b { 
    color: #0f172a; 
}
/* 修复如果有多个模态框重叠时的背景变黑问题 */
.modal-backdrop:nth-child(n+2) { display: none !important; }
.modal-backdrop.show { opacity: 0.5 !important; }
/* --------------------------------------------------------------------------
   8. 页脚专项优化 (Footer Refined)
   -------------------------------------------------------------------------- */
.footer-custom {
    background-color: var(--footer-bg); 
    border-top: 1px solid rgba(255,255,255,0.05);
    margin-top: 60px; padding: 20px 0;
    position: relative; width: 100%;
}

.api-link {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important; color: #ffffff !important; padding: 10px 22px !important; border-radius: 12px !important; font-weight: 800 !important; letter-spacing: 0.5px; box-shadow: 0 4px 15px rgba(37, 99, 235, 0.4); border: 1px solid rgba(255,255,255,0.1) !important; transition: all 0.3s ease; display: inline-flex; align-items: center;
}
.api-link:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(37, 99, 235, 0.5); }
.legal-link { color: #3b82f6 !important; text-decoration: none !important; font-weight: 600; transition: 0.2s; font-size: 0.8rem; }
.legal-link:hover { color: #2563eb !important; text-decoration: underline !important; }
.footer-link:not(.api-link) { color: rgba(255,255,255,0.5) !important; text-decoration: none; transition: 0.2s; }
.footer-link:not(.api-link):hover { color: #fff !important; }

.system-status-badge {
    font-size: 0.7rem; color: #4ade80; background: rgba(74, 222, 128, 0.08); border: 1px solid rgba(74, 222, 128, 0.15); padding: 4px 12px; border-radius: 50px; display: inline-flex; align-items: center; gap: 6px;
}
.status-dot { width: 6px; height: 6px; background-color: #4ade80; border-radius: 50%; animation: pulse-green 2s infinite; }
@keyframes pulse-green { 0% { box-shadow: 0 0 0 0 rgba(74, 222, 128, 0.7); } 70% { box-shadow: 0 0 0 6px rgba(74, 222, 128, 0); } 100% { box-shadow: 0 0 0 0 rgba(74, 222, 128, 0); } }