/* ============================================================
   polish.css — 首页板块精修层（叠加在现有样式之上，不破坏原结构）
   原则：延续现有墨绿 #31af99 / 深蓝 #1E293B 品牌色，
   只统一圆角、阴影、间距、悬停反馈与可读性，不做视觉风格重构。
   ============================================================ */

/* ---------- 1. 板块标题：收紧字号层级，装饰线对齐品牌绿 ---------- */
.dyui-main-header .header-title h3 {
    font-size: 22px;
    font-weight: 600;
    letter-spacing: 1px;
}
.dyui-main-header .header-title p {
    font-size: 13px;
    color: #98a2b3;
    letter-spacing: 2px;
}
.dyui-main-header .header-title hr {
    background-color: #31af99;
    height: 3px;
    border: 0 !important;
    border-radius: 2px;
    width: 36px !important;
    opacity: 1;
}

/* ---------- 2. 系统特性卡片：白卡 + 细边 + 圆角 + 悬停浮起 ---------- */
.home-texin ul li .feat-card {
    background: #fff;
    border: 1px solid #eef1f4;
    border-radius: 10px;
    padding: 30px 18px 26px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .04);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.home-texin ul li .feat-card:hover {
    transform: translateY(-4px);
    border-color: #31af99;
    box-shadow: 0 12px 24px rgba(49, 175, 153, .12);
}
.home-texin ul li .feat-card > i {
    color: #31af99;
}
.home-texin ul li .feat-card .t {
    margin-top: 16px;
    margin-bottom: 10px;
}

/* ---------- 3. 模板市场卡片：统一圆角阴影，标题色收紧 ---------- */
.home-moban .moban-list li a {
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .06);
    transition: transform .2s ease, box-shadow .2s ease;
}
.home-moban .moban-list li a:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 24px rgba(15, 23, 42, .12);
}
.home-moban .moban-list li .price {
    color: #d9534f;
    font-weight: 600;
}

/* ---------- 4. 增值服务：头部渐变换成品牌绿系，卡片一体化 ---------- */
.home-zengzhi ul li .img {
    background: linear-gradient(135deg, #35b99f 0%, #1f8a77 100%);
    border-radius: 10px 10px 0 0;
}
.home-zengzhi ul li .box {
    border: 1px solid #eef1f4;
    border-top: 0;
    border-radius: 0 0 10px 10px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .05);
    transition: box-shadow .2s ease;
}
.home-zengzhi ul li:hover .box {
    box-shadow: 0 12px 24px rgba(15, 23, 42, .12);
}
.home-zengzhi ul li .box .price {
    color: #d9534f;
    font-weight: 600;
}

/* ---------- 5. 新闻资讯：头图底部加暗渐变遮罩，标题可读 ---------- */
.home-news .col-md-4 .img::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 55%;
    background: linear-gradient(to top, rgba(15, 23, 42, .78), rgba(15, 23, 42, 0));
    border-radius: 0 0 10px 10px;
    pointer-events: none;
}
.home-news .col-md-4 .img {
    border-radius: 10px;
    overflow: hidden;
}
.home-news .img .tit {
    bottom: 14px;
    z-index: 1;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .4);
}
.home-news ul li a {
    color: #475569;
    transition: color .15s ease;
}
.home-news ul li a:hover {
    color: #31af99;
}

/* ---------- 6. 新闻栏目小标题（home-news-h3）与区块标题统一 ---------- */
.home-news .home-news-h3 h3 {
    font-size: 18px;
    font-weight: 600;
    color: rgba(0, 0, 0, .85);
}
.home-news .home-news-h3 .more {
    color: #98a2b3;
    transition: color .15s ease;
}
.home-news .home-news-h3 .more:hover {
    color: #31af99;
}

/* ---------- 7. 特性面板四格（hero 下方）：图标点与文案对齐 ---------- */
.uc-features .uc-feat-title {
    font-weight: 600;
}

/* ---------- 8. 更多按钮：白底描边转实底品牌绿 ---------- */
.dyui-main-more a {
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.dyui-main-more a:hover {
    background-color: #31af99;
    color: #fff;
    border-color: #31af99;
}

/* ---------- 9. 页脚：链接分隔与标签底色微调 ---------- */
.site-footer .fn-tags span {
    transition: color .15s ease, border-color .15s ease;
}
.site-footer .fn-tags span:hover {
    color: #8b92a5;
    border-color: rgba(255, 255, 255, .18);
}

/* ---------- 10. 新闻资讯：条目带摘要版式 ---------- */
/* 首条大图卡：遮罩内加描述行 */
.home-news .col-md-4 .img .img-desc {
    position: absolute;
    left: 0; right: 0; bottom: 12px;
    padding: 0 16px;
    font-size: 13px;
    line-height: 1.55;
    color: #cbd5e1;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    z-index: 1;
}
/* 标题上移，给描述让位；头条背景图改为整卡明图，文字压在遮罩上 */
.home-news .col-md-4 .img .tit {
    bottom: 58px;
    padding: 0 16px;
    font-size: 15px;
    font-weight: 600;
}
/* 列表条目：标题+两行摘要+日期 */
.home-news ul li.news-item {
    height: auto;
    line-height: 1.5;
    padding: 10px 0;
    border-bottom: 1px dashed #eef1f4;
    display: flex;
    align-items: flex-start;
    gap: 10px;
}
.home-news ul li.news-item:last-child {
    border-bottom: 0;
}
.home-news ul li.news-item .news-item-main {
    flex: 1;
    min-width: 0;
}
.home-news ul li.news-item .news-item-tit {
    display: block;
    font-size: 15px;
    font-weight: 500;
    color: #334155;
    line-height: 1.45;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.home-news ul li.news-item .news-item-tit:hover {
    color: #31af99;
}
.home-news ul li.news-item .news-item-desc {
    margin: 4px 0 0;
    font-size: 13px;
    color: #94a3b8;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.home-news ul li.news-item .time {
    float: none;
    flex-shrink: 0;
    font-size: 12px;
    color: #b0b7c6;
    line-height: 1.45;
    padding-top: 2px;
    white-space: nowrap;
}

/* ---------- 11. 系统特性：图标改黑色系 ---------- */
.home-texin ul li .feat-card > i {
    color: #1e293b;
}

/* ---------- 12. 列表页分页条 ---------- */
.uc-pagebar {
    margin-top: 24px;
    display: flex;
    justify-content: center;
}
.uc-pagebar-list {
    display: flex;
    gap: 8px;
    list-style: none;
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
    justify-content: center;
}
.uc-pagebar-list li a {
    display: block;
    min-width: 36px;
    padding: 7px 12px;
    text-align: center;
    font-size: 14px;
    color: #475569;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    text-decoration: none;
    transition: all .15s ease;
}
.uc-pagebar-list li a:hover {
    color: #31af99;
    border-color: #31af99;
}
.uc-pagebar-list li.active a {
    color: #fff;
    background: #31af99;
    border-color: #31af99;
    font-weight: 600;
}

/* ---------- 13. 顶部导航搜索框 ---------- */
.uc-nav-search {
    display: flex;
    align-items: center;
    margin-left: 16px;
}
.uc-nav-search input {
    width: 170px;
    height: 36px;
    padding: 0 12px;
    font-size: 13px;
    border: 1px solid #e2e8f0;
    border-right: 0;
    border-radius: 8px 0 0 8px;
    outline: none;
    transition: border-color .15s ease, width .2s ease;
    background: #f8fafc;
}
.uc-nav-search input:focus {
    border-color: #31af99;
    background: #fff;
    width: 210px;
}
.uc-nav-search button {
    height: 36px;
    padding: 0 10px;
    border: 1px solid #e2e8f0;
    border-radius: 0 8px 8px 0;
    background: #f8fafc;
    color: #64748b;
    cursor: pointer;
    transition: all .15s ease;
}
.uc-nav-search button:hover {
    background: #31af99;
    border-color: #31af99;
    color: #fff;
}
@media (max-width: 1200px) {
    .uc-nav-search { display: none; }
}

/* 移动端分页：只保留 上一页/首页/当前页/末页/下一页，避免页码铺满 */
@media (max-width: 768px) {
    .uc-pagebar-list li { display: none; }
    .uc-pagebar-list li.uc-pagebar-prev,
    .uc-pagebar-list li.uc-pagebar-next,
    .uc-pagebar-list li.active,
    .uc-pagebar-list li:first-child,
    .uc-pagebar-list li:last-child {
        display: block;
    }
}

/* ---------- 14. 文章页 上一篇/下一篇 ---------- */
.article-pn {
    display: flex;
    gap: 16px;
    margin-top: 28px;
}
.article-pn .pn-item {
    flex: 1;
    min-width: 0;
    display: block;
    padding: 14px 18px;
    background: #f8fafc;
    border: 1px solid #eef1f4;
    border-radius: 10px;
    text-decoration: none;
    transition: border-color .15s ease, background .15s ease;
}
.article-pn .pn-item:hover {
    border-color: #31af99;
    background: #fff;
}
.article-pn .pn-empty { visibility: hidden; }
.article-pn .pn-next { text-align: right; }
.article-pn .pn-label {
    display: block;
    font-size: 12px;
    color: #94a3b8;
    margin-bottom: 6px;
}
.article-pn .pn-title {
    display: block;
    font-size: 14px;
    color: #334155;
    line-height: 1.5;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.article-pn .pn-item:hover .pn-title { color: #31af99; }

/* ---------- 15. 商品详情页 ---------- */
/* 我的订单：与"立即购买"配套的次级描边按钮 */
.store-detail-active .btn-orders {
    display: inline-block;
    margin-left: 10px;
    padding: 0 18px;
    line-height: 38px;
    height: 38px;
    font-size: 14px;
    color: #31af99;
    background: #fff;
    border: 1px solid #31af99;
    border-radius: 4px;
    text-decoration: none;
    vertical-align: middle;
    transition: background .15s ease, color .15s ease;
}
.store-detail-active .btn-orders:hover {
    background: #31af99;
    color: #fff;
}
.store-detail-active .btn-orders i { margin-right: 4px; }
/* 价格数字加重 */
.store-detail-price span { font-weight: 600; }
.store-detail-price { color: #64748b; }

/* ---------- 16. 登录注册弹窗（复刻 kfuu 风格：蓝主色/左图右表单/外侧关闭钮） ---------- */
.ucpop {
    position: fixed; top: 0; left: 0;
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    background-color: rgb(1,1,1,20%);
    z-index: 100000;
    animation: ucpop-fade-in var(--uc-anim, .3s);
}
.ucpop.outing { animation: ucpop-fade-out var(--uc-anim, .3s); }
.ucpop-inner {
    position: relative;
    width: 900px; max-width: calc(100% - 2em);
    background: #fff;
    box-shadow: 0 4px 15px -10px rgb(0 0 0 / 90%);
    border-radius: 4px;
    animation: ucpop-in var(--uc-anim, .3s);
}
.ucpop.outing .ucpop-inner { animation: ucpop-out var(--uc-anim, .3s); }
.ucpop-close {
    position: absolute; left: 100%; top: .3em; margin-left: .5em;
    color: #fff; cursor: pointer;
    display: flex; align-items: center;
    transition: transform .2s;
}
.ucpop-close:hover { transform: rotate(90deg); }
.ucpop-body { padding: 0; }
.ucpop-content { display: flex; border-radius: 4px; overflow: hidden; }
.uc-photo {
    position: relative; flex: 0 0 45%;
    background-color: #edeff2;
}
.uc-photo-bg { height: 100%; overflow: hidden; }
.uc-photo-bg img { width: 100%; height: 100%; object-fit: cover; display: block; }
.uc-photo-gif { position: absolute; right: 1em; top: 5em; width: 57.3%; }
.uc-photo-gif img { width: 100%; display: block; }
.uc-photo-bottom {
    position: absolute; bottom: 0; left: 0; width: 100%;
    padding: 1em; text-align: center; color: #505a63;
}
.uc-right { flex: 1; }
.uc-main {
    text-align: center;
    padding: 3em 2em;
    height: 100%;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.uc-main .tab {
    font-size: 1.3em; color: #9aa5b8; margin: 0 0 2em;
    text-align: left; width: 80%;
}
.uc-main .tab span {
    margin-right: 1.5em; cursor: pointer; padding-bottom: .7em;
}
.uc-main .tab span.active {
    font-weight: bold; color: #2196F3;
    border-bottom: solid .12em #2196F3;
}
.uc-form { width: 80%; }
.uc-form .uc-item { position: relative; margin: 1.5em 0; }
.uc-input {
    width: 100%;
    border: solid 1px #c7c9cb;
    border-radius: 4px;
    height: 3em;
    padding: 1em .7em;
    font-size: 1em;
    outline: none;
    transition: border .2s;
    box-sizing: border-box;
}
.uc-input:focus { border-color: #2196F3; }
.uc-eye {
    position: absolute; height: 100%; top: 0; right: 0;
    display: flex; align-items: center;
    padding: 0 1em;
    color: #666; cursor: pointer; user-select: none;
    background: transparent; border: none;
}
.uc-item-code { display: flex; gap: .6em; }
.uc-item-code .uc-input { flex: 1; min-width: 0; }
.uc-code-img {
    height: 3em; width: 7.2em;
    border: solid 1px #c7c9cb;
    border-radius: 4px;
    cursor: pointer;
    object-fit: cover;
    background: #fff;
}
.uc-button {
    display: block; width: 100%;
    background-color: #2196F3;
    color: #fff;
    border: none;
    line-height: 2.5em;
    margin: .5em 0;
    border-radius: 4px;
    font-size: 1rem;
    cursor: pointer;
    transition: all .2s;
}
.uc-button:hover { background-color: #1E88E5; }
.uc-button:disabled { opacity: .55; cursor: default; }
.uc-last {
    display: flex; justify-content: flex-end;
    margin-top: .6em;
    font-size: .9em;
}
.uc-link-strong { color: #2196F3; cursor: pointer; }
.uc-link-strong:hover { color: #1E88E5; }
@keyframes ucpop-fade-in { 0% { opacity: 0; } 100% { opacity: 1; } }
@keyframes ucpop-fade-out { 0% { opacity: 1; } 100% { opacity: 0; } }
@keyframes ucpop-in { 0% { transform: translateY(-.5em); } 100% { transform: translateY(0); } }
@keyframes ucpop-out { 0% { transform: translateY(0); } 100% { transform: translateY(-.5em); } }
@media (max-width: 640px) {
    .uc-photo { display: none; }
    .ucpop-close { left: auto; right: .3em; top: -2em; color: #fff; }
    .uc-main .tab, .uc-form { width: 100%; }
}

/* ---------- 17. 滑块验证码 ---------- */
.uc-item-slider { margin: 1.5em 0; }
.uc-slider {
    position: relative;
    width: 100%; height: 3em;
    background: #f0f2f5;
    border: solid 1px #e2e6ea;
    border-radius: 4px;
    overflow: hidden;
    user-select: none;
    box-sizing: border-box;
}
.uc-slider-track {
    position: absolute; inset: 0;
    display: flex; align-items: center; justify-content: center;
}
.uc-slider-fill {
    position: absolute; left: 0; top: 0; bottom: 0;
    width: 0;
    background: #e9f5ff;
    transition: none;
}
.uc-slider-handle {
    position: absolute; left: 0; top: 0;
    width: 3em; height: 3em;
    background: #fff;
    border: solid 1px #c7c9cb;
    border-radius: 4px;
    display: flex; align-items: center; justify-content: center;
    color: #9aa5b8;
    cursor: grab;
    z-index: 3;
    box-shadow: 0 1px 3px rgba(0,0,0,.08);
    touch-action: none;
}
.uc-slider-handle:active { cursor: grabbing; }
.uc-slider-tip {
    position: relative; z-index: 2;
    font-size: 13px; color: #9aa5b8;
    pointer-events: none;
}
.uc-slider-ok {
    display: none;
    position: absolute; inset: 0; z-index: 2;
    align-items: center; justify-content: center;
    font-size: 13px; color: #2196F3; font-weight: 600;
    pointer-events: none;
}
.uc-slider.done { border-color: #2196F3; }
.uc-slider.done .uc-slider-fill { background: #e9f5ff; width: 100% !important; }
.uc-slider.done .uc-slider-tip { display: none; }
.uc-slider.done .uc-slider-ok { display: flex; }
.uc-slider.done .uc-slider-handle { color: #2196F3; border-color: #2196F3; }

/* ---------- 18. 商品卡：已售角标 + 已授权域名数 ---------- */
.moban-list > li.app-card { position: relative; }
.uc-sold-badge {
    position: absolute;
    top: 34px; right: 10px;
    z-index: 3;
    background: linear-gradient(135deg, #ff9f43, #ff6b6b);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 999px;
    box-shadow: 0 2px 8px rgba(255, 107, 107, .4);
}
.uc-auth-count {
    display: flex; align-items: center; justify-content: center; gap: 5px;
    margin: 4px 0 10px;
    font-size: 12px;
    color: #94a3b8;
}
.uc-auth-count b { color: #2196F3; font-weight: 700; }

/* ---------- 19. 详情页统计条 ---------- */
.uc-detail-stats {
    display: flex; gap: 18px;
    margin: 4px 0 12px;
}
.uc-stat-item {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 13px;
    color: #64748b;
    background: #f4f7fa;
    border: 1px solid #e8edf3;
    border-radius: 999px;
    padding: 5px 14px;
}
.uc-stat-item b { color: #2196F3; font-weight: 700; }
.uc-stat-item svg { color: #2196F3; }

/* ---------- 20. 滑块条文字排版修正 ---------- */
/* 提示文字整体居中但视觉上要让开手柄：左内边距 = 手柄宽度，文字改为左对齐起点在手柄右侧 */
.uc-slider .uc-slider-tip {
    position: absolute;
    left: 3em;                    /* 手柄宽 3em，文字从手柄右侧开始 */
    right: 0;
    top: 0; bottom: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-left: 4px;
    font-size: 13px;
    color: #9aa5b8;
    letter-spacing: 1px;
    white-space: nowrap;
    overflow: hidden;
}
.uc-slider.done .uc-slider-tip { display: none !important; }
/* 通过后的文案也左对齐到同一位置，保持一致 */
.uc-slider .uc-slider-ok {
    justify-content: flex-start;
    padding-left: calc(3em + 4px);
    font-size: 13px;
    letter-spacing: 1px;
}
/* 手柄内的箭头图标稍微缩小，视觉更轻 */
.uc-slider-handle svg { width: 14px; height: 14px; }
