/* ============================================================
 * CIIP Industrial Tech Style - Visual Enhancement Layer
 * Only adds visual effects on top of discuzx5 default styles
 * Does NOT override any layout/functional styles
 * ============================================================ */

/* --- Page fade in --- */
body {
    animation: ciip_fadeIn 0.5s ease-out;
}
@keyframes ciip_fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* --- Nav bottom gradient glow line --- */
.dz_layer_top {
    position: relative;
}
.dz_layer_top::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, #2563eb, #7c3aed, #2563eb);
    background-size: 200% 100%;
    animation: ciip_navShimmer 4s linear infinite;
}
@keyframes ciip_navShimmer {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

/* --- Board title left blue accent bar --- */
.bm_h {
    position: relative;
    padding-left: 12px;
}
.bm_h::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 20px;
    background: linear-gradient(180deg, #2563eb, #7c3aed);
    border-radius: 2px;
}

/* --- Card hover glow --- */
.bm, .block, .frame-tab, .dz_zuhe_box {
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}
.bm:hover, .block:hover, .frame-tab:hover {
    box-shadow: 0 4px 20px rgba(37, 99, 235, 0.08);
}

/* --- Button metallic shine --- */
.pgsbtn, .pn, .pnc, a.pnc, .dz_rbox_btn, .login_btn {
    position: relative;
    overflow: hidden;
}
.pgsbtn::after, .pn::after, .pnc::after, .dz_rbox_btn::after, .login_btn::after {
    content: "";
    position: absolute;
    top: -50%;
    left: -75%;
    width: 50%;
    height: 200%;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255, 255, 255, 0.3) 45%,
        rgba(255, 255, 255, 0.5) 50%,
        rgba(255, 255, 255, 0.3) 55%,
        transparent 100%
    );
    transform: skewX(-25deg);
    animation: ciip_btnShine 4s ease-in-out infinite;
}
@keyframes ciip_btnShine {
    0%, 70%, 100% { left: -75%; opacity: 0; }
    80%, 90% { opacity: 1; }
    95% { left: 125%; opacity: 0; }
}

/* --- Border subtle glow --- */
#uhd, .ct1 {
    position: relative;
}
#uhd::after, .ct1::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, #2563eb, #7c3aed, #2563eb, transparent);
    opacity: 0.4;
}

/* --- Link hover transition --- */
a {
    transition: color 0.2s ease;
}

/* --- Post row hover highlight --- */
.forumportal_listc li.kmlist {
    transition: background 0.2s ease;
}

/* --- Post type tag glow --- */
.forumportal_listc .kmtit span.kmico {
    box-shadow: 0 0 8px rgba(37, 99, 235, 0.3);
}

/* --- Post image hover effect --- */
.kmimg:hover img, .kmshowimg:hover img, #focus_con dd.m a:hover img {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

/* --- Avatar hover effect --- */
.avt img, .e-avatar img, .header-user-avatar img {
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.avt:hover img, .e-avatar:hover img {
    transform: scale(1.08);
    box-shadow: 0 2px 12px rgba(37, 99, 235, 0.15);
}

/* --- Custom scrollbar --- */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #2563eb, #7c3aed);
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #1d4ed8, #6d28d9);
}

/* --- Text selection highlight --- */
::selection {
    background: rgba(37, 99, 235, 0.2);
    color: inherit;
}

/* --- Logo hover glow --- */
.dz_nav .dz_nav_logo img {
    transition: filter 0.3s ease, transform 0.3s ease;
}
.dz_nav .dz_nav_logo:hover img {
    filter: drop-shadow(0 0 8px rgba(37, 99, 235, 0.3));
    transform: scale(1.03);
}

/* --- Search input focus enhancement --- */
.header-searcher .search-input {
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}
.header-searcher .search-input:focus {
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

/* --- Sidebar icon hover glow --- */
.dz_rnav a {
    transition: all 0.3s ease;
}
.dz_rnav a:hover, .dz_rnav a.dz_light_on {
    box-shadow: 0 4px 16px rgba(37, 99, 235, 0.2);
    transform: translateY(-2px);
}

/* --- Popup animation --- */
.fwinmask .fwin, #icoImg_image_menu .fwin {
    animation: ciip_fwinIn 0.3s ease-out;
}
@keyframes ciip_fwinIn {
    from { opacity: 0; transform: scale(0.95) translateY(10px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}

/* --- Mobile: disable all animations --- */
@media (max-width: 768px) {
    body, .dz_layer_top::after, .pgsbtn::after, .pn::after, .pnc::after,
    .dz_rbox_btn::after, .login_btn::after, .dz_nav .dz_nav_logo img {
        animation: none !important;
    }
    .bm:hover, .block:hover, .frame-tab:hover {
        box-shadow: var(--dz-shadow);
    }
}

/* --- body 科技网格背景（60px 间距淡蓝网格线） --- */
/* 节点脉冲 + 随机闪电电波信号由 ciip-bg.js Canvas 动态绘制 */
html {
    background-color: #f5f7fa;
}
body {
    position: relative;
    background-color: transparent;
    background-image:
        linear-gradient(rgba(37, 99, 235, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(37, 99, 235, 0.05) 1px, transparent 1px);
    background-size: 60px 60px;
}
/* 移动端关闭网格（Canvas 由 JS 自行检测并停止） */
@media (max-width: 768px) {
    body {
        background-image: none;
    }
}