/**
 * 国际物联网卡应用场景 - 专属主题样式
 * 适配 globalsim 页面，突出跨境/全球连接场景视觉 identity
 * 在 sim-scenario.css 之后加载，用于覆盖和扩展
 */

/* ========== 作用域：仅 globalsim 页面 ========== */
body.globalsim-page,
body.globalsim-page.sim-scenario-page {
    /* 国际主题基础变量 */
    --globalsim-accent: #0ea5e9;
    --globalsim-accent-dark: #0284c7;
    --globalsim-overlay: rgba(2, 132, 199, 0.15);
    --globalsim-border: rgba(14, 165, 233, 0.2);
}

/* ========== 场景主题色（国际版 - 融合蓝色调） ========== */
/* 交通运输 - 深蓝+青 */
body.globalsim-page[data-sim-theme="transport"] {
    --sim-primary: #0c8bd4;
    --sim-primary-dark: #0369a1;
    --sim-accent: #38bdf8;
    --sim-gradient: linear-gradient(135deg, #0c8bd4 0%, #0369a1 50%, #0284c7 100%);
}

/* 共享经济 - 紫蓝 */
body.globalsim-page[data-sim-theme="sharing"] {
    --sim-primary: #6366f1;
    --sim-primary-dark: #4f46e5;
    --sim-accent: #818cf8;
    --sim-gradient: linear-gradient(135deg, #6366f1 0%, #4f46e5 50%, #0ea5e9 100%);
}

/* 公用事业 - 青蓝 */
body.globalsim-page[data-sim-theme="utility"] {
    --sim-primary: #0891b2;
    --sim-primary-dark: #0e7490;
    --sim-accent: #22d3ee;
    --sim-gradient: linear-gradient(135deg, #0891b2 0%, #0e7490 50%, #0284c7 100%);
}

/* 智慧城市/安防 - 橙蓝 */
body.globalsim-page[data-sim-theme="city"] {
    --sim-primary: #ea580c;
    --sim-primary-dark: #c2410c;
    --sim-accent: #fb923c;
    --sim-gradient: linear-gradient(135deg, #ea580c 0%, #c2410c 50%, #0284c7 100%);
}

/* 工业 - 灰蓝 */
body.globalsim-page[data-sim-theme="industry"] {
    --sim-primary: #334155;
    --sim-primary-dark: #1e293b;
    --sim-accent: #64748b;
    --sim-gradient: linear-gradient(135deg, #475569 0%, #334155 50%, #0369a1 100%);
}

/* 农业/环保 - 绿蓝 */
body.globalsim-page[data-sim-theme="agriculture"] {
    --sim-primary: #16a34a;
    --sim-primary-dark: #15803d;
    --sim-accent: #4ade80;
    --sim-gradient: linear-gradient(135deg, #16a34a 0%, #15803d 50%, #0891b2 100%);
}

/* 物流 - 金蓝 */
body.globalsim-page[data-sim-theme="logistics"] {
    --sim-primary: #d97706;
    --sim-primary-dark: #b45309;
    --sim-accent: #fbbf24;
    --sim-gradient: linear-gradient(135deg, #d97706 0%, #b45309 50%, #0284c7 100%);
}

/* 医疗 - 红蓝 */
body.globalsim-page[data-sim-theme="healthcare"] {
    --sim-primary: #dc2626;
    --sim-primary-dark: #b91c1c;
    --sim-accent: #f87171;
    --sim-gradient: linear-gradient(135deg, #dc2626 0%, #b91c1c 50%, #0369a1 100%);
}

/* 零售 - 粉蓝 */
body.globalsim-page[data-sim-theme="retail"] {
    --sim-primary: #db2777;
    --sim-primary-dark: #be185d;
    --sim-accent: #f472b6;
    --sim-gradient: linear-gradient(135deg, #db2777 0%, #be185d 50%, #6366f1 100%);
}

/* 教育/文体 - 靛蓝 */
body.globalsim-page[data-sim-theme="education"] {
    --sim-primary: #4f46e5;
    --sim-primary-dark: #4338ca;
    --sim-accent: #818cf8;
    --sim-gradient: linear-gradient(135deg, #4f46e5 0%, #4338ca 50%, #0ea5e9 100%);
}

/* 智能设备 - 青绿蓝 */
body.globalsim-page[data-sim-theme="appliance"] {
    --sim-primary: #0d9488;
    --sim-primary-dark: #0f766e;
    --sim-accent: #2dd4bf;
    --sim-gradient: linear-gradient(135deg, #0d9488 0%, #0f766e 50%, #0891b2 100%);
}

/* 索引页无 data-sim-theme 时使用国际蓝 */
body.globalsim-page:not([data-sim-theme]) {
    --sim-primary: #0ea5e9;
    --sim-primary-dark: #0284c7;
    --sim-accent: #38bdf8;
    --sim-gradient: linear-gradient(135deg, #0ea5e9 0%, #0284c7 100%);
}

/* ========== Hero 区域 - 国际主题增强 ========== */
body.globalsim-page .sim-page-hero {
    position: relative;
}

body.globalsim-page .sim-hero-bg::after {
    background: linear-gradient(
        to top,
        rgba(0, 0, 0, 0.88) 0%,
        rgba(2, 132, 199, 0.25) 30%,
        rgba(0, 0, 0, 0.4) 50%,
        rgba(0, 0, 0, 0.1) 100%
    );
}

/* Hero 底部国际连接线装饰 */
body.globalsim-page .sim-hero-content::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(
        90deg,
        transparent 0%,
        var(--sim-primary, #0ea5e9) 20%,
        var(--sim-accent, #38bdf8) 50%,
        var(--sim-primary, #0ea5e9) 80%,
        transparent 100%
    );
    opacity: 0.8;
}

body.globalsim-page .sim-page-subtitle {
    position: relative;
    padding-left: 1rem;
    border-left: 3px solid rgba(14, 165, 233, 0.8);
}

/* ========== 文章内容区 - 国际主题 ========== */
body.globalsim-page .sim-knowledge-article {
    background: linear-gradient(
        180deg,
        #f0f9ff 0%,
        #e0f2fe 20%,
        #f8fafc 50%,
        #f1f5f9 100%
    );
}

body.globalsim-page .sim-article-content {
    border: 1px solid var(--globalsim-border, rgba(14, 165, 233, 0.15));
    box-shadow: 0 4px 24px rgba(14, 165, 233, 0.08), 0 1px 3px rgba(0, 0, 0, 0.04);
}

body.globalsim-page .sim-article-content h2 {
    position: relative;
    padding-left: 0.75rem;
}

body.globalsim-page .sim-article-content h2::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.3em;
    bottom: 0.3em;
    width: 3px;
    background: var(--sim-gradient, linear-gradient(180deg, #0ea5e9, #0284c7));
    border-radius: 2px;
}

/* 相关链接 - 国际主题 */
body.globalsim-page .sim-related-links a {
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
    border-left-color: var(--sim-primary);
}

body.globalsim-page .sim-related-links a:hover {
    background: linear-gradient(135deg, #e0f2fe 0%, #bae6fd 100%);
    box-shadow: 0 4px 12px rgba(14, 165, 233, 0.15);
}

/* ========== 索引页专属样式 ========== */
body.globalsim-page .sim-scenarios {
    max-width: 1200px;
    margin: 0 auto;
}

body.globalsim-page .sim-intro {
    text-align: center;
    margin-bottom: 2rem;
    color: #475569;
    font-size: 0.95rem;
    line-height: 1.7;
    padding: 1rem 1.5rem;
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
    border-radius: 12px;
    border-left: 4px solid var(--sim-primary, #0ea5e9);
}

body.globalsim-page .sim-category {
    margin-bottom: 2rem;
}

body.globalsim-page .sim-category h3 {
    font-size: 1rem;
    color: #334155;
    margin-bottom: 0.75rem;
    padding-bottom: 0.5rem;
    padding-left: 0.5rem;
    border-bottom: 2px solid #e2e8f0;
    border-left: 4px solid var(--sim-primary, #0ea5e9);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: linear-gradient(90deg, rgba(14, 165, 233, 0.05) 0%, transparent 100%);
    border-radius: 0 8px 8px 0;
}

body.globalsim-page .sim-category h3 i {
    color: var(--sim-primary, #0ea5e9);
    font-size: 0.95rem;
}

body.globalsim-page .sim-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0.5rem;
}

@media (max-width: 1200px) {
    body.globalsim-page .sim-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 768px) {
    body.globalsim-page .sim-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

body.globalsim-page .sim-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border-radius: 10px;
    text-decoration: none;
    color: #334155;
    font-size: 0.9rem;
    transition: all 0.25s ease;
    background: #fff;
    border: 1px solid #e2e8f0;
}

body.globalsim-page .sim-item:hover {
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
    color: var(--sim-primary, #0ea5e9);
    border-color: var(--sim-primary, #0ea5e9);
    box-shadow: 0 4px 12px rgba(14, 165, 233, 0.2);
    transform: translateY(-1px);
}

body.globalsim-page .sim-item i {
    width: 1.25rem;
    text-align: center;
    color: #94a3b8;
    flex-shrink: 0;
    transition: color 0.25s ease;
}

body.globalsim-page .sim-item:hover i {
    color: var(--sim-primary, #0ea5e9);
}

body.globalsim-page .sim-item span {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.globalsim-page .sim-item small {
    color: #94a3b8;
    font-size: 0.75rem;
    flex-shrink: 0;
    padding: 0.15rem 0.4rem;
    background: #f1f5f9;
    border-radius: 4px;
}

body.globalsim-page .sim-item:hover small {
    background: rgba(14, 165, 233, 0.1);
    color: var(--sim-primary, #0ea5e9);
}

/* 国际标识徽章 */
body.globalsim-page .global-badge {
    background: var(--sim-gradient, linear-gradient(135deg, #0ea5e9 0%, #0284c7 100%));
    color: #fff;
    border-radius: 4px;
    padding: 0.15rem 0.4rem;
    font-size: 0.7rem;
    font-weight: 500;
}

/* ========== CTA 区块 - 国际主题 ========== */
body.globalsim-page .cta {
    background: var(--sim-gradient, linear-gradient(135deg, #0ea5e9 0%, #0284c7 100%));
    position: relative;
    overflow: hidden;
}

body.globalsim-page .cta::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: radial-gradient(
        circle at 20% 50%,
        rgba(255, 255, 255, 0.1) 0%,
        transparent 50%
    );
    pointer-events: none;
}

body.globalsim-page .cta .btn-primary:hover {
    background: #fff;
    color: var(--sim-primary-dark, #0284c7);
    box-shadow: 0 4px 20px rgba(255, 255, 255, 0.3);
}

/* ========== 响应式 ========== */
@media (max-width: 768px) {
    body.globalsim-page .sim-page-hero {
        min-height: 320px;
    }

    body.globalsim-page .sim-page-title {
        font-size: 2rem;
    }

    body.globalsim-page .sim-page-subtitle {
        font-size: 1rem;
        padding-left: 0.75rem;
    }

    body.globalsim-page .sim-hero-content {
        padding: 40px 16px 35px;
    }

    body.globalsim-page .sim-article-content {
        padding: 2rem 1.5rem;
        margin: 0 16px;
    }

    body.globalsim-page .sim-article-content h2 {
        font-size: 1.3rem;
    }

    body.globalsim-page .sim-intro {
        padding: 1rem;
    }
}
