/* ==============================================
  子比主题 Zibll 美化CSS合集｜优化整理版
  模块分组，注释清晰，直接复制使用
============================================== */

/* --------------------------
模块1：文章标题前缀标签 + 扫光动画（ove_prefix 彩色标签）
-------------------------- */
@keyframes sweepTitle {
    0% { left: -100%; }
    100% { left: 100%; }
}
.ove_prefix, .ove_prefix0, .ove_prefix1, .ove_prefix2, .ove_prefix3, .ove_prefix4{
    color: #fff;
    position: relative;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    border-radius: 5px;
    padding: 5px 4px;
    margin-right: 3px;
    height: 19px;
    font-size: 12px;
    clip-path: polygon(7% 0, 99% 0, 93% 100%, 0 100%);
}
.ove_prefix:after, .ove_prefix0:after, .ove_prefix1:after, .ove_prefix2:after, .ove_prefix3:after, .ove_prefix4:after  {
    position: absolute;
    content: " ";
    display: block;
    left: -100%;
    top: -5px;
    width: 15px;
    height: 145%;
    background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
    animation: sweepTitle 3s ease-in-out infinite;
    transform: rotate(28deg);
}
.ove_prefix{ background: linear-gradient(135deg, #60e464 10%, #5cb85b 100%); }/*绿色标签*/
.ove_prefix1{ background: linear-gradient(135deg, #59c3fb 10%, #268df7 100%); }/*蓝色标签*/
.ove_prefix0{ background: linear-gradient(120deg, #6800d9 10%, #4b00fc 100%); }/*紫色标签*/
.ove_prefix2{ background: linear-gradient(135deg, #fd7a64 10%, #fb2d2d 100%); }/*红色标签*/
.ove_prefix3{ background: linear-gradient(317deg, #4d4c4c 30%, #878787 70%, #5f5c5c 100%); }/*灰色标签*/
.ove_prefix4{ background: linear-gradient(135deg, #ffd6b2 10%, #ff651c 100%); }/*橙色标签*/

/* --------------------------
模块2：文章卡片 Mac 三色圆点封面样式
-------------------------- */
.posts-item.card {
    padding: 35px 10px 10px 10px!important;
}
.posts-item {
    position: relative !important;
}
.posts-item.card::before {
    content: "";
    display: block;
    background: #fc625d;
    top: 13px;
    left: 15px;
    border-radius: 50%;
    width: 9px;
    height: 9px;
    box-shadow: 16px 0 #fdbc40, 32px 0 #35cd4b;
    margin: 0px 2px -7px;
    z-index: 1000;
    position: absolute;
}

/* --------------------------
模块3：文章标签随机彩色样式 + hover变色
-------------------------- */
.article-tags{margin-bottom: 10px;}
.article-tags a{
    padding: 4px 10px;
    background-color: #19B5FE;
    color: white;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    margin: 0 5px 5px 0;
    border-radius: 2px;
    display: inline-block;
}
.article-tags a:nth-child(5n){background-color: #4A4A4A;color: #FFF;}
.article-tags a:nth-child(5n+1){background-color: #ff5e5c;color: #FFF;}
.article-tags a:nth-child(5n+2){background-color: #ffbb50;color: #FFF;}
.article-tags a:nth-child(5n+3){background-color: #1ac756;color: #FFF;}
.article-tags a:nth-child(5n+4){background-color: #19B5FE;color: #FFF;}
.article-tags a:hover{background-color: #1B1B1B;color: #FFF;}

/* --------------------------
模块4：加载更多分页按钮样式
-------------------------- */
.theme-pagination .ajax-next a, .theme-pagination .order-ajax-next a{
    border-radius: 30px;
    padding: 15px 0;
    color: var(--muted-color);
    background-color:var(--main-bg-color);
    color: #FF0033;
    display: block;
    opacity: 1;
    font-weight:bold;
}

/* --------------------------
模块5：Logo扫光动画
-------------------------- */
@keyframes searchLights{
    40%{left: -100px; top: 0;}
    60%{left: 120px; top: 100px;}
    80%{left: -100px; top: 0px;}
}
.navbar-brand{
    position:relative;
    overflow:hidden;
    margin: 0px 0 0 0px;
}
.navbar-brand:before{
    content:"";
    position: absolute;
    left: -665px;
    top: -460px;
    width: 200px;
    height: 15px;
    background-color: rgba(255,255,255,.5);
    transform: rotate(-45deg);
    animation: searchLights 6s ease-in 0s infinite;
}

/* --------------------------
模块6：头像呼吸彩虹光环 + hover旋转放大
-------------------------- */
@keyframes light{
    0%{box-shadow: 0 0 4px #f00;}
    25%{box-shadow: 0 0 16px #0f0;}
    50%{box-shadow: 0 0 4px #00f;}
    75%{box-shadow: 0 0 16px #0f0;}
    100%{box-shadow: 0 0 4px #f00;}
}
.avatar{
    border-radius: 50%;
    animation: light 4s ease-in-out infinite;
    transition: 0.5s;
}
.avatar:hover{transform: scale(1.15) rotate(720deg);}

/* --------------------------
模块7：PC端文章卡片hover上浮+阴影
-------------------------- */
@media screen and (min-width: 980px){
    .tab-content .posts-item:not(article){transition: all 0.3s;}
    .tab-content .posts-item:not(article):hover{
        transform: translateY(-10px);
        box-shadow: 0 8px 10px rgba(255, 112, 173, 0.35);
    }
}

/* --------------------------
模块8：底部提示区域样式
-------------------------- */
.lastpagenotice_noticewrap{color:hsla(0, 2.1%, 18.8%, 0.6);}
.lastpagenotice_noticewrap img{height:120px; width:120px; margin:0 auto;}
.lastpagenotice_noticewrap .lastpagenotice_text{
    display:block;
    position:absolute;
    font-size:15px;
    line-height:20px;
    top:50%;
    transform:translateY(-50%);
    left:calc(50% + 60px);
}
.lastpagenotice_noticewrap .lastpagenotice_line{
    width:100%;
    height:1px;
    background-color:hsla(0,0%,100%,.05);
    position:absolute;
    bottom:0;
}
.app_normal{text-align:center; position:relative}

/* --------------------------
模块9：侧边网站统计小组件
-------------------------- */
.widget_Websitestat h3{font-weight:700;}
.widgest-boys{overflow:hidden;}
.widgest-boys .widgest-bg{
    margin: 4px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    cursor: pointer;
    border-radius: 8px;
}
.widgest-boys .widgest-main{align-items: center; place-content: flex-start space-around; display: flex;}
.widgest-boys .widgest-meat{
    display: block;
    margin-block-start: 1em;
    margin-block-end: 1em;
    color: rgb(255, 255, 255);
    font-weight: 700 !important;
    line-height: 1.5 !important;
}
.widgest-bg:not(article){transition: all 0.3s;}
.widgest-bg:not(article):hover{transform: translateX(-10px);}
/*统计背景图-图片路径设置*/
.widgest-bg1{background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),url(http://haik.cn/web/img/cq/0.jpg);}
.widgest-bg2{background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),url(http://haik.cn/web/img/cq/1.jpg);}
.widgest-bg3{background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),url(http://haik.cn/web/img/cq/2.jpg);}
.widgest-bg4{background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),url(http://haik.cn/web/img/cq/3.jpg);}
.widgest-bg5{background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),url(http://haik.cn/web/img/cq/4.jpg);}
.widgest-bg6{background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),url(http://haik.cn/web/img/cq/5.jpg);}
.widgest-bg7{background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),url(http://haik.cn/web/img/cq/6.jpg);}
.widgest-bg8{background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),url(http://haik.cn/web/img/cq/7.jpg);}
.widgest-bg9{background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),url(http://haik.cn/web/img/cq/8.jpg);}
.widgest-bg10{background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),url(http://haik.cn/web/img/cq/9.jpg);}
.widgest-bg11{background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),url(http://haik.cn/web/img/cq/10.jpg);}
/* --------------------------
模块10：导航菜单字体加粗
-------------------------- */
ul.nav {font-weight: 700;}

/* --------------------------
模块11：评论框背景图 + 聚焦动画
-------------------------- */
textarea#comment {
    background-color:transparent;
    background:linear-gradient(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05)),url(http://haik.cn/web/img/pinglu.png) right 10px bottom 10px no-repeat;
    transition:ease-in-out 0.45s;
}
textarea#comment:focus {
    background-position-y:789px;
    transition:ease-in-out 0.45s;
}

/* --------------------------
模块12：侧边小悬浮帮助按钮（移动端隐藏）
-------------------------- */
.contact-help{
    position: fixed;
    z-index: 101;
    left: 0;
    top: calc(50% - 30px);
    margin-top: -36px;
    width: 28px;
    height: 72px;
    transition: all .3s;
    font-size: 12px;
    background: var(--main-bg-color);
    border-radius: 0 5px 5px 0;
    padding: 8px 7px;
    line-height: 14px;
}
@media screen and (max-width: 768px){.contact-help{display:none;}}

/* --------------------------
模块13：过期文章提示框样式
-------------------------- */
.article-timeout{
    position:relative;
    border-radius: 8px;
    margin-bottom: 25px;
    padding: 10px;
    background-color: var(--body-bg-color);
}

/* --------------------------
模块14：百度搜索框样式
-------------------------- */
.searchs{
    background-color:#fff;
    border:1px solid #eaeaea;
    padding:15px;  /* 容器上下左右留白，改这个会改变搜索框组件整体大小 */
    overflow:hidden;
    transition:all 0.3s;
    border-radius:4px;
    position:relative;
    margin:0px 0px 15px 0px;
}
.mip-layout-container,.mip-layout-fixed-height{margin:0px 0px 0px 0px;display:block;position:relative;}
.searchs input[type="text"]{
    border:#45B6F7 1px solid;
    border-radius:4px;
    width:calc( 100% - 2px );
    height:36px; /* ✅ 输入框高度，自行修改，例如32 / 36 /40 */
    padding:0 8px; /* 文字左右内边距，建议加上，文字不会贴边缘 */
    box-sizing: border-box;
}
.searchs input{outline:none;}
.searchs input[type="submit"]{
    position:absolute;
    right:2px;
    top:2px;
    background-color:#45B6F7;
    color:#fff;
    font-size:13px;
    margin:1px;
    height:31px; /* ✅ 按钮高度，必须和上面input高度一致！ */
    line-height:36px; /* ✅ 和height一致，文字垂直居中 */
    padding:0 10px;
}
.tit{
    background-color:#FF5E52;
    position:relative;
    top:-15px;
    display:inline-block;
    color:#fff;
    padding:4px 15px;
    font-size:14px;
}

/* --------------------------
模块15：文章内图片hover发光效果
-------------------------- */
.wp-posts-content img:hover { box-shadow:0px 0px 10px #EF0C7E; }

/* --------------------------
模块16：友链头像圆角
-------------------------- */
.link-only-img img, .link-img img{border-radius: var(--main-radius);}

/* --------------------------
模块17：文章分页样式
-------------------------- */
.post-page-numbers{padding: 4px 10px;text-align:center;display: inline; }
.post-nav-links{background:0;margin-left: -50px;}

/* --------------------------
模块18：轮播图左右按钮美化
-------------------------- */
.swiper-button-next, .swiper-button-prev{height: 70px !important;}
.swiper-button-prev{border-top-right-radius: 8px;border-bottom-right-radius: 8px;}
.swiper-button-next{border-top-left-radius: 8px;border-bottom-left-radius: 8px;}

/* --------------------------
模块19：文章内加密模块样式
-------------------------- */
.mizhi_boy{margin: 0 auto; padding-bottom: 2em;}
.mizhi_boy .mz-bg{
    height: 300px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url(http://haik.cn/web/img/t016fdb7fe821d106c1.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: 8px;
    cursor: pointer;
}
.mizhi_boy .mz-bg-d{height: 100%; align-items: center; place-content: flex-start space-around; display: flex;z-index: 1;}
.mizhi_boy .mz-main{text-align: center;}
.mizhi_boy .mz-ico,.mizhi_boy .mz-ico svg{height: 4rem; width: 4rem;}
.mizhi_boy .mz-ico{display: flex; margin: 0 auto; opacity: 0.8;}
.mizhi_boy .mz-ico svg{align-self: center; fill: transparent; stroke-width: 1.2px;}
.mizhi_boy .mz-ico svg [data-stroke]{stroke: rgb(255, 255, 255);}
.mizhi_boy .mz-button{
    width: 80px;
    margin:2rem;
    border-radius: 10px;
    font-weight: 700 !important;
    border: 1px solid rgb(255, 255, 255);
    padding: 0.46875rem 1rem;
    color: rgb(36, 30, 18) !important;
}
.mizhi_boy .mz-button:hover{background-color: #fff;}
@media screen and (max-width: 980px){
    .mizhi_w{width: 70%;margin:0 auto;text-align:center;}
}

/* --------------------------
模块20：缩略图hover浮层+放大图标
-------------------------- */
.item-thumbnail:before{
    content:'';
    position:absolute;
    top:0;left:0;right:0;bottom:0;
    background:rgba(0,0,0,0);
    transition:background .35s;
    border-radius:8px;
    z-index:2;
    max-width:765px;
    margin:0 auto;
    pointer-events:none;
}
.item-thumbnail:after{
    content:'';
    position:absolute;
    top:50%;left:50%;
    width:50px;height:50px;
    margin:-25px 0 0 -25px;
    background:url(/web/img/ico.png);
    background-repeat:no-repeat;
    background-size:100% 100%;
    z-index:3;
    transform:scale(2);
    transition:transform .75s,opacity .75s;
    opacity:0;
    pointer-events:none;
}
.item-thumbnail:hover:before{background:rgba(0,0,0,.5)}
.item-thumbnail:hover:after{transform:scale(1);opacity:1}

/* --------------------------
模块21：隐藏悬浮私信按钮
-------------------------- */
.more-btn{display: none;}


/* --------------------------
模块22：昵称渐变流动文字
-------------------------- */
@keyframes wzw{
    0%{background-position:0 0;}
    100%{background-position:0 -300%;}
}
.display-name{
    background-image:-webkit-linear-gradient(90deg,#07c160,#fb6bea 25%,#3aedff 50%,#fb6bea 75%,#28d079);
    -webkit-text-fill-color:transparent;
    -webkit-background-clip:text;
    background-size:100% 600%;
    animation:wzw 10s linear infinite;
}