/*--- V4: 全局 - 现代AI静态光晕背景 (替换V3) ---*/

/* * 这是一个高级的静态渐变背景。
 * 它使用多个径向渐变来模拟光晕，而不是动画。
 * 这种风格更“高大上”且不分散注意力。
 */

/* 亮色模式 (灰色模式) - 柔和的蓝紫色光晕 */
body, .page-container,
.io-grey-mode .page-container .grid-bg {
    background: radial-gradient(at 10% 10%, hsla(280, 60%, 80%, 0.3) 0px, transparent 50%),
                radial-gradient(at 90% 10%, hsla(200, 70%, 75%, 0.3) 0px, transparent 50%),
                radial-gradient(at 70% 80%, hsla(240, 60%, 80%, 0.3) 0px, transparent 50%),
                radial-gradient(at 20% 90%, hsla(180, 60%, 80%, 0.2) 0px, transparent 50%),
                #f0f2f5 !important; /* 基础底色 */
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

/* 黑色模式 - 深邃的蓝紫色光晕 */
.io-black-mode body, 
.io-black-mode .page-container,
.io-black-mode .page-container .grid-bg {
    background: radial-gradient(at 10% 10%, hsla(280, 60%, 30%, 0.3) 0px, transparent 50%),
                radial-gradient(at 90% 10%, hsla(200, 70%, 35%, 0.3) 0px, transparent 50%),
                radial-gradient(at 70% 80%, hsla(240, 60%, 30%, 0.3) 0px, transparent 50%),
                radial-gradient(at 20% 90%, hsla(180, 60%, 30%, 0.2) 0px, transparent 50%),
                #1b1d1f !important; /* 基础底色 */
    background-size: 100% 100%;
    background-repeat: no-repeat;
}


/*--- 你的个性化设置 (已保留) ---*/
body,html{font-size:14px;}
.sidebar-popup.sidebar-menu-inner > div > ul > li.sidebar-item>ul{position:absolute;top:0px;left:10px;width:90px;z-index:99}
.sidebar-popup.sidebar-menu-inner ul{width:90px}
.sidebar-popup.sidebar-menu-inner ul li{width:90px}
.sidebar-menu.flex-fill::-webkit-scrollbar{display:none}
.big-header-banner .page-header{color:#ffffff;background:rgba(255,255,255,0);box-shadow:none;transition:color .3s,background-color .3s}
.big-header-banner:not(.header-bg) .page-header .navbar-nav>li>a,.big-header-banner:not(.header-bg) .navbar-menu a:not(.dropdown-item){color:#ffffff;}
.big-header-banner:not(.header-bg) .page-header .navbar-nav>li>a:hover,.big-header-banner:not(.header-bg) .navbar-menu a:not(.dropdown-item):hover{color:#dc3545;}
.big-header-banner:not(.header-bg) .header-mini-btn path{stroke:#ffffff;}
.big-header-banner:not(.header-bg) .header-mini-btn label:hover path{stroke:#ffffff;}
.header-big .search-type input:checked+label:before{content:'';border-width:8px 8px 0px 8px;border-style:solid;border-color:#ffffff transparent transparent;position:absolute;left:50%;top:0;margin-left:-8px}
.header-big:not(.no-bg) .s-type-list{color:#20c997}
.header-big:not(.no-bg) .text-muted,.header-big:not(.no-bg) .search-type .menu-item a,.header-big:not(.no-bg) .big-title .h1{color:#ffffff!important}
.post-top{padding-bottom:50px}
.sidebar-menu-inner ul li ul li a{margin-left:30px;}
.navbar-collapse ul li.menu-item-has-children:after{content:'\e612';}
.header-big.css-color{background-size:unset;background-position:unset;animation:unset;}
footer.main-footer .footer-text { text-align: center; }
footer.main-footer .footer-text a { color: #007bff; }
footer.main-footer .footer-text a:hover { color: red; }
.panel .panel-body a {color: #007bff;}
.panel .panel-body a:hover {color: #979898;}
/* (你原来的网格背景已被上面的动态背景替换) */


/*--- V3: “AI” 玻璃拟态 (Glassmorphism) 核心 ---*/

/* 1. 顶部导航栏 - 滚动后，呈现“磨砂玻璃”效果 */
.big-header-banner.header-bg .page-header {
    background: rgba(255, 255, 255, 0.5) !important; /* 半透明背景 */
    -webkit-backdrop-filter: blur(15px); /* 核心：背景模糊 */
    backdrop-filter: blur(15px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05) !important; /* 柔和阴影 */
    border: 1px solid rgba(255, 255, 255, 0.1); /* 增加一点边缘，提升质感 */
}
/* 黑色模式 顶部导航栏 */
.io-black-mode .big-header-banner.header-bg .page-header {
    background: rgba(44, 46, 47, 0.5) !important; /* 深色半透明 */
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(15px);
    border: 1px solid rgba(255, 255, 255, 0.05);
}

/* 2. 侧边栏 & 主内容区 - 玻璃拟态与浮动布局 */
@media (min-width: 768px) {
    /* 侧边栏玻璃 */
    .sidebar-nav,
    .sidebar-nav-inner {
        border-radius: 18px !important; 
        margin: 10px; 
        height: calc(100vh - 20px) !important; 
        box-shadow: 0 10px 35px -10px rgba(0, 0, 0, 0.08); 
        
        /* 玻璃效果 */
        background: rgba(255, 255, 255, 0.5) !important; /* 灰色/白色模式 */
        -webkit-backdrop-filter: blur(15px);
        backdrop-filter: blur(15px);
        border: 1px solid rgba(255, 255, 255, 0.1);
    }
    .io-black-mode .sidebar-nav-inner {
        background: rgba(44, 46, 47, 0.5) !important; /* 黑色模式 */
        border: 1px solid rgba(255, 255, 255, 0.05);
    }
    /* 侧边栏的 logo 区域背景必须透明才能透出背景 */
    .sidebar-logo {
        background: transparent !important;
    }

    /* 主内容区玻璃 */
    .main-content {
        margin-left: 190px; 
        border-radius: 18px !important; 
        margin-top: 10px;
        margin-right: 10px;
        height: calc(100vh - 20px); 
        overflow-y: auto; 
        overflow-x: hidden;
        
        /* 玻璃效果 */
        background: rgba(255, 255, 255, 0.5) !important; /* 灰色/白色模式 */
        -webkit-backdrop-filter: blur(15px);
        backdrop-filter: blur(15px);
        border: 1px solid rgba(255, 255, 255, 0.1);
        box-shadow: 0 10px 35px -10px rgba(0, 0, 0, 0.05);
    }
    .io-black-mode .main-content {
        background: rgba(44, 46, 47, 0.5) !important; /* 黑色模式 */
        border: 1px solid rgba(255, 255, 255, 0.05);
    }

    /* 顶部导航栏适配 */
    .page-header {
        left: 190px !important; 
        border-top-left-radius: 18px; 
        border-top-right-radius: 18px;
        margin-right: 10px; 
        width: calc(100% - 190px - 10px); 
    }
    /* 解决主内容滚动时，头部固定的问题 */
    .main-content .sticky {
        position: sticky; 
        top: 0;
        z-index: 1080;
    }
}
@media (max-width: 767.98px) {
    .main-content {
        border-radius: 0;
        overflow: visible;
    }
}

/*--- V3: 现代化交互 (侧边栏) ---*/

/* 一级菜单 - 默认 */
.sidebar-menu-inner > ul > li > a {
    border-radius: 10px !important;
    margin: 3px 10px !important;
    padding-left: 14px !important;
    transition: all 0.25s ease !important;
    background: rgba(0,0,0,0.04); /* 给个默认底色 */
}
.io-black-mode .sidebar-menu-inner > ul > li > a {
    background: rgba(255,255,255,0.05);
}
/* 一级菜单 - 悬停/选中 (使用主题色高亮) */
.sidebar-menu-inner > ul > li > a:hover,
.sidebar-menu-inner > ul > li.sidebar-show > a {
    background: #f1404b !important; /* 主题色 */
    color: #ffffff !important;
    transform: scale(1.03); /* 增加缩放感 */
    box-shadow: 0 5px 15px -5px rgba(241, 64, 75, 0.6);
}
.io-black-mode .sidebar-menu-inner > ul > li > a:hover,
.io-black-mode .sidebar-menu-inner > ul > li.sidebar-show > a {
    background: #f1404b !important;
    color: #ffffff !important;
}

/* 二级菜单容器 */
.sidebar-item ul {
    background: rgba(0, 0, 0, 0.05) !important;
    border-radius: 12px !important;
    margin: 4px 10px !important;
    padding: 4px 0 !important;
    overflow: hidden !important;
}
.io-black-mode .sidebar-item ul {
    background: rgba(255, 255, 255, 0.05) !important;
}

/* 二级菜单项 (你的样式已覆盖 margin-left) */
.sidebar-item ul li a {
    border-radius: 8px !important;
    margin: 3px 8px !important;
    transition: background-color 0.2s ease, transform 0.2s ease !important;
}
/* 二级菜单悬停 (增加 X 轴轻微移动) */
.sidebar-item ul li a:hover {
    background-color: rgba(0, 0, 0, 0.1) !important;
    transform: scale(1.03) translateX(3px) !important; 
}
.io-black-mode .sidebar-item ul li a:hover {
    background-color: rgba(255, 255, 255, 0.1) !important;
}


/*--- V3: 核心卡片“辉光”悬停效果 ---*/

/* 基础卡片 (玻璃感) */
.card, .block {
    border-radius: 18px !important; 
    overflow: hidden; 
    border: 1px solid rgba(255, 255, 255, 0.4) !important; /* 玻璃边框 */
    background-clip: padding-box;
    background: rgba(255, 255, 255, 0.7) !important; /* 更实一点的玻璃 */
    box-shadow: 0 8px 30px -10px rgba(0, 0, 0, 0.1) !important;
    transition: all 0.3s ease;
}
.io-black-mode .card, .io-black-mode .block {
     background: rgba(44, 46, 47, 0.7) !important;
     border-color: rgba(255, 255, 255, 0.1) !important;
     box-shadow: 0 8px 30px -10px rgba(0, 0, 0, 0.2) !important;
}

/* 卡片悬停 - 现代“AI”发光边框 */
.url-card .url-body:hover {
    transform: translateY(-4px) scale(1.02); /* 增加一点缩放 */
    box-shadow: 0 12px 35px -10px rgba(0, 36, 100, 0.2) !important;
    border-color: rgba(241, 64, 75, 0.4) !important; /* 用主题色发光 */
    background: rgba(255, 255, 255, 0.9) !important; /* 悬停时更亮 */
}
.io-black-mode .url-card .url-body:hover {
    border-color: rgba(241, 64, 75, 0.6) !important;
    background: rgba(50, 52, 53, 0.9) !important;
}

/* 卡片内部图标/图片的圆角 */
.url-card .url-img {
    border-radius: 12px; 
    overflow: hidden;
}
/* 增加卡片内边距，显得更大气 */
.url-card .card-body {
    padding: 1.1rem 1.25rem; 
}


/*--- V3: 搜索框区域精炼 (合并) ---*/

/* 搜索框 (使用你的颜色) */
.header-big #search-text {
    border-radius: 18px !important;
    height: 60px !important;
    font-size: 1.1rem !important;
    padding-left: 25px !important;
    background: rgba(255, 255, 255, 0.8) !important;
    border: 1px solid transparent !important;
    transition: all 0.3s ease;
    box-shadow: inset 0 2px 5px rgba(0,0,0,0.05);
    color: #6C757D; /* 你的颜色 */
}
/* 搜索框 聚焦时发光 */
.header-big #search-text:focus {
    background: #ffffff !important;
    border-color: #f1404b !important; /* 你的主题色 */
    box-shadow: 0 0 0 3px rgba(241, 64, 75, 0.2), inset 0 2px 5px rgba(0,0,0,0.05); /* 模拟 focus-visible */
}

/* 黑色模式搜索框 */
.io-black-mode .header-big #search-text {
    background: rgba(30, 30, 30, 0.7) !important;
    color: #fff;
    box-shadow: inset 0 2px 5px rgba(0,0,0,0.1);
}
.io-black-mode .header-big #search-text:focus {
    background: #2c2e2f !important;
    border-color: #f1404b !important;
    box-shadow: 0 0 0 3px rgba(241, 64, 75, 0.2), inset 0 2px 5px rgba(0,0,0,0.1);
}

/* 搜索按钮适配 (使用你的颜色) */
.header-big #search button {
    border-radius: 14px !important; 
    right: 8px !important;
    top: 8px !important;
    height: 44px !important; 
    width: 50px !important;
}
#search button i{
    color:#6C757D;
    font-size:18px
}


/*--- 弹窗和杂项圆角 (V1) ---*/

/* 搜索弹窗 (玻璃) */
.search-modal .modal-content {
    border-radius: 20px !important;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.8) !important;
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(15px);
}
.io-black-mode .search-modal .modal-content {
    background: rgba(44, 46, 47, 0.8) !important;
}

.search-modal #m_search-text {
    border-radius: 16px !important;
    height: 50px !important;
    font-size: 1rem;
}
.search-modal .s-type-list label {
    border-radius: 16px;
    padding: 5px 10px;
}
/* 顶部“一言” (玻璃) */
#hitokoto {
    background: rgba(255, 255, 255, 0.3) !important;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    padding: 8px 16px;
    border-radius: 20px;
    transition: all 0.3s ease;
    border: 1px solid rgba(255, 255, 255, 0.1);
}
#hitokoto:hover {
    background: rgba(255, 255, 255, 0.5) !important;
}
.io-black-mode #hitokoto {
    background: rgba(44, 46, 47, 0.3) !important;
    border: 1px solid rgba(255, 255, 255, 0.05);
}
.io-black-mode #hitokoto:hover {
    background: rgba(44, 46, 47, 0.5) !important;
}

/* 分类标题 */
h4.text-gray {
    padding-top: 1rem; 
    margin-bottom: 1.5rem !important;
    font-size: 1.2rem;
    color: #000 !important; /* 在玻璃上，需要更深的颜色 */
}
.io-black-mode h4.text-gray {
    color: #fff !important;
}


/*--- 你的搜索热词样式 (已合并大气圆角) ---*/
.search-hot-text{
    position: absolute;
    z-index: 100;
    width: 100%;
    border-radius: 18px !important; /* 使用大气圆角 */
    background: #FFF;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1) !important; /* 使用柔和阴影 */
    overflow: hidden;
    margin-top: 5px; /* 增加一点间距 */
}
.search-hot-text ul{
    margin: 0;
    padding: 5px 0;
}
.search-hot-text ul li{
    line-height: 30px;
    font-size: 14px;
    padding: 0px 25px;
    color: #777;
    cursor: pointer;
}
.io-black-mode .search-hot-text ul li{
    color: #fff;
}    
.search-hot-text ul li.current{
    background: #f1f1f1;
    color: #2196f3;
}
.search-hot-text ul li:hover{
    background: #f1f1f1;
    color: #2196f3;
    cursor: pointer;
}
.search-hot-text ul li span{
    display: inline-block;
    width: 20px;
    height: 20px;
    font-size: 12px;
    line-height: 20px;
    text-align: center;
    background: #e5e5e5;
    margin-right: 10px;
    border-radius: 10px;
    color: #999;
}

/* --- V3.1: 修复侧边栏悬停/选中时变方角的问题 --- */

/* * 强制 original.css 中 .sidebar-item:hover 和 .sidebar-show 
 * (也就是 <li> 标签) 的背景色为透明。
 * 这样，只有我们设置的圆角 <a> 标签才有背景色。
 */
.sidebar-show, 
.sidebar-item > a:hover {
    background: transparent !important; 
}