@charset "utf-8";
/*!
 * 版本：MYUI Copyright © 2019
 * 作者：QQ726662013版权所有
 * 官网：https://www.mytheme.cn
 */

/* style */
.myui-panel,.myui-panel-box{ padding: 0px;}
.myui-panel_hd{ padding: 10px;}
.myui-panel-box.active{ margin: -10px;}
.myui-content__detail .title, .myui-content__detail .data, .myui-content__detail .data a{
	color: #333!important;
}

/* all  */
/* 更像后台：纯白底 + 白卡片 */
body{ background: #fff; color: #334155;}

/* =============================
   更像后台（进一步紧凑化）
   - 字号 13px
   - 输入/按钮高度 32~34px
   - 圆角统一 8~10px
   - hover 动效更克制
   ============================= */
html, body{ font-size: 12px; }
body{ line-height: 1.6; }

/* 标题/正文层级更像后台（更克制） */
h1,h2,h3,h4,h5,h6{ letter-spacing: .2px; }

/* 输入框：更像后台的高度/圆角 */
.form-control{
    border-radius: 10px;
    height: 34px;
    line-height: 34px;
}

/* 按钮：更紧凑、更像后台 */
.btn{
    border-radius: 10px;
    height: 30px;
    line-height: 30px;
    padding: 0 10px;
    /* 文字垂直/水平居中：解决登录/筛选等按钮“文字不居中” */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

/* 大按钮（btn-lg）：mytheme-ui.css 会给 btn-lg 更大的 padding，这里固定高度/对齐方式，避免“看起来不居中” */
.btn.btn-lg{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    line-height: 40px;
    padding: 0 16px;
}
.btn-sm{ height: 28px; line-height: 28px; padding: 0 9px; border-radius: 10px; }
.btn-xs{ height: 26px; line-height: 26px; padding: 0 8px; border-radius: 9px; }


/* 主题变量（浅色）- 供搜索弹窗/片库侧边栏等组件复用 */
:root{
    --wb-overlay: rgba(0,0,0,.30);
    --wb-surface: rgba(255,255,255,.95);
    --wb-surface-2: rgba(31,45,61,.04);
    --wb-border: rgba(31,45,61,.10);
    --wb-border-2: rgba(31,45,61,.12);
    --wb-text: #1f2d3d;
    --wb-muted: rgba(31,45,61,.60);
    --wb-input-bg: rgba(31,45,61,.04);
    --wb-input-border: rgba(31,45,61,.12);
    --wb-accent: #2563eb;
    --wb-accent-soft: rgba(37,99,235,.14);
    --wb-green: rgba(37,99,235,.92);
}

/* text */
a,h1, h2, h3, h4, h5, h6,h1 a, h2 a, h3 a, h4 a, h5 a, h6 a{ color: #333;}
a:hover{ color: #2563eb;}
a.disabled{ cursor: not-allowed; opacity: 0.6;}
.text-333{ color: #333;}
.text-muted{ color: #999;}
.text-red{ color: red;}
.text-link{ color: var(--wb-accent);}
/*.text-fff{ color: #fff;}*/

/* form */
.form-control{ background-color:#fff; color: #333; border: 1px solid #e0e0e0;}
.form-control:focus{
    border-color:#2563eb;
    -webkit-box-shadow: inset 0 1px 1px rgba(37,99,235,.075), 0 0 8px rgba(37,99,235,.28);
    box-shadow: inset 0 1px 1px rgba(37,99,235,.075), 0 0 8px rgba(37,99,235,.28);
}

/* btn */
.btn-default{ background-color: #eee; color: #333; background: linear-gradient(to right,#eeeeee 0,#f6f6f6 100%); box-shadow: 0 2px 5px rgba(0,0,0,.1);}
.btn-warm{ background: linear-gradient(135deg, var(--uc-primary, #2563eb) 0%, #4f46e5 55%, #06b6d4 120%); color: #fff; box-shadow: 0 2px 5px rgba(37,99,235,.22);}
.btn-primary{ background: linear-gradient(135deg, var(--uc-primary, #2563eb) 0%, #4f46e5 55%, #06b6d4 120%); color: #fff; box-shadow: 0 2px 5px rgba(37,99,235,.22);}
.btn-danger{ background-color: #fc000c; background: linear-gradient(to right,#fc000c 0,#f9444d 100%); box-shadow: 0 2px 5px rgba(249,68,77,.25);}
.btn-info{background: linear-gradient(135deg, var(--uc-primary, #2563eb) 0%, #4f46e5 55%, #06b6d4 120%); color: #fff; box-shadow: 0 2px 5px rgba(37,99,235,.22);}
.btn-gray{ background-color: #282828; color: #ddd; background: linear-gradient(to right,#282828 0,#3b3b3b 100%); box-shadow: 0 2px 5px rgba(59,59,59,.25);}
.btn-warm,.btn-primary,.btn-danger,.btn-info{  color: #fff;}
.btn-warm:hover,.btn-primary:hover,.btn-danger:hover,.btn-info:hover,.btn-gray:hover{ color: #fff;}
.btn.disabled{ cursor: not-allowed; opacity: 0.6;}

/* 更像后台：按钮更克制（轻微 hover） */
.btn-warm:hover,.btn-primary:hover,.btn-info:hover{ filter: brightness(1.03); }
.btn-warm:active,.btn-primary:active,.btn-info:active{ filter: brightness(0.98); }

/* border */
.border{ border-color: #e0e0e0;}
.border-primary{ border-color: #2563eb;}
.border-danger{ border-color: red;}
.border-info{ border-color: #2563eb;}

/* line */
.spot{ border-color: #2563eb;}
.split-line{ background-color: #e0e0e0;}
.top-line:before,.bottom-line:after,.top-line-dot:before,.bottom-line-dot:before{ border-color: #e0e0e0;}

/* badge */
.badge{ background-color: #f5f5f5; color: #333;}
.badge-first{ background: linear-gradient(135deg, var(--uc-primary, #2563eb) 0%, #4f46e5 55%, #06b6d4 120%); color: #fff;}
.badge-second{ background-color: #ff7701; color: #fff;}
.badge-third{ background-color: #ffb400; color: #fff;}

/* dropdown */
.dropdown-box .item{ 
    background-color: #fff; 
    border: 1px solid #e6e7eb;
    box-shadow: 0 10px 43px rgba(51, 65, 52, 0.07);
    border-radius: 8px;
    padding: 15px !important;
}

/* 弹窗方式的下拉菜单 */
.category-modal-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--wb-overlay);
    z-index: 9998;
    animation: fadeIn 0.3s ease;
}

.category-modal-overlay.show {
    display: block;
}

.category-modal {
    display: block;
    position: fixed;
    top: 0;
    left: -100%;
    right: auto;
    width: 65%;
    max-width: 500px;
    height: 100vh;
    background: #ffffff;
    z-index: 9999;
    overflow: hidden;
    transition: left 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 4px 0 20px rgba(0, 0, 0, 0.12);
}

.category-modal.show {
    left: 0;
    right: auto;
}

.category-modal-header {
    padding: 0 20px;
    height: var(--myui-header-height, 60px);
    min-height: var(--myui-header-height, 60px);
    border-bottom: 1px solid var(--wb-border);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    position: relative;
    gap: 12px;
    text-align: center;
}

.category-modal-header .header-logo {
    width: auto;
    height: 50px;
    border-radius: 0;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-size: 24px;
    font-weight: bold;
    box-shadow: none;
    overflow: visible;
    padding: 0;
    box-sizing: border-box;
    position: relative;
    flex-shrink: 0;
}

.category-modal-header .header-logo img {
    width: auto;
    height: 100%;
    max-width: 200px;
    object-fit: contain;
    border-radius: 0;
    display: block;
}

.category-modal-header .header-logo .logo-fallback {
    display: none;
    width: auto;
    height: 50px;
    align-items: center;
    justify-content: center;
    color: #333;
    font-size: 24px;
    font-weight: bold;
    padding: 10px 20px;
    background: linear-gradient(135deg, var(--uc-primary, #2563eb) 0%, #4f46e5 55%, #06b6d4 120%);
    border-radius: 6px;
    color: #ffffff;
}

.category-modal-header .header-logo[data-fallback] .logo-fallback,
.category-modal-header .header-logo:not(:has(img)) .logo-fallback {
    display: flex;
}

.category-modal-header .header-logo img[style*="display: none"] ~ .logo-fallback {
    display: flex;
}

.category-modal-header .header-search {
    width: 100%;
    max-width: 100%;
    margin-top: 5px;
}

.category-modal-header .header-search {
    position: relative;
}

.category-modal-header .category-search-select {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 13px;
    color: #666;
    cursor: pointer;
    z-index: 2;
    padding-right: 10px;
    border-right: 1px solid #ddd;
    display: flex;
    align-items: center;
    gap: 4px;
}

.category-modal-header .category-search-select:hover {
    color: #2563eb;
}

.category-modal-header .category-search-select .dropdown-box {
    margin-left: -40px;
    z-index: 101;
}

.category-modal-header .category-search-select .dropdown-box .item {
    width: 80px;
    padding: 10px;
}

.category-modal-header .category-search-select .dropdown-box .item li {
    text-align: center;
    padding: 2px 0;
}

.category-modal-header .header-search form {
    position: relative;
    display: flex;
    width: 100%;
}

.category-modal-header .category-search-input {
    flex: 1;
    height: 40px;
    padding: 0 45px 0 70px;
    border: 1px solid #e0e0e0;
    border-radius: 20px;
    font-size: 14px;
    color: #333;
    background: #f5f5f5;
    outline: none;
    transition: all 0.3s ease;
}

.category-modal-header .category-search-input:focus {
    border-color: #2563eb;
    background: #ffffff;
    box-shadow: 0 0 0 3px rgba(37,99,235, 0.12);
}

.category-modal-header .category-search-submit {
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    border: none;
    background: linear-gradient(135deg, var(--uc-primary, #2563eb) 0%, #4f46e5 55%, #06b6d4 120%);
    color: #ffffff;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    transition: all 0.3s ease;
    outline: none;
}

.category-modal-header .category-search-submit:hover {
    transform: translateY(-50%) scale(1.05);
    box-shadow: 0 2px 8px rgba(37,99,235, 0.28);
}

.category-modal-header .category-search-submit:active {
    transform: translateY(-50%) scale(0.95);
}

.category-modal-close {
    position: absolute;
    top: 25px;
    right: 20px;
    background: #f5f5f5;
    border: none;
    color: #666;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    text-align: center;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    z-index: 10;
}

.category-modal-close:hover {
    background: #e0e0e0;
    color: #333;
    transform: rotate(90deg);
}

.category-modal-body {
    padding: 20px 20px 30px;
    overflow-y: auto;
    height: calc(100vh - 200px);
    -webkit-overflow-scrolling: touch;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translate(-50%, -60%);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%);
    }
}

/* 分类模态框内的列表（保留） */
.category-modal-body .item.nav-list {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 0 !important;
}

.category-modal-body .item.nav-list li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
}

/* 首页按钮样式 - PC端50%宽度，移动端100%宽度 */
.category-modal-body .item.nav-list > li:first-child {
    flex: 0 0 calc(50% - 4px);
    width: calc(50% - 4px);
    margin-bottom: 10px;
    margin-right: 8px;
}

/* 顶级分类样式 - 独占一行 */
.category-modal-body .item.nav-list li.category-parent-item {
    width: 100%;
    flex: 0 0 auto;
    margin-bottom: 8px;
    margin-top: 10px;
}

.category-modal-body .item.nav-list li.category-parent-item:first-of-type {
    margin-top: 0;
}

.category-modal-body .item.nav-list li.category-parent-item .category-parent-btn {
    width: 100%;
    font-size: 14px !important;
    font-weight: 500 !important;
    padding: 8px 16px !important;
    background: transparent !important;
    color: #333 !important;
    border: 1px solid #f4f6f9 !important;
    border-radius: 5px !important;
    box-shadow: none !important;
}

.category-modal-body .item.nav-list li.category-parent-item .category-parent-btn.btn-warm {
    background: transparent !important;
    color: #2563eb !important;
    border-color: #2563eb !important;
}

.category-modal-body .item.nav-list li.category-parent-item .category-parent-btn:hover {
    background: transparent !important;
    border-color: #2563eb !important;
    color: #2563eb !important;
    transform: none !important;
}

/* 二级分类容器 */
.category-modal-body .item.nav-list li.category-children-wrapper {
    width: 100%;
    flex: 0 0 auto;
    margin-bottom: 10px !important;
    margin-top: 6px !important;
}

.category-modal-body .item.nav-list .category-children-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none;
}

/* 二级分类样式 - 每行4个 */
.category-modal-body .item.nav-list .category-children-list li.category-child-item {
    flex: 0 0 calc((100% - 24px) / 4);
    min-width: 0;
    max-width: calc((100% - 24px) / 4);
}

.category-modal-body .item.nav-list .category-children-list li.category-child-item .category-child-btn {
    width: 100%;
    font-size: 12px !important;
    font-weight: 400 !important;
    padding: 6px 8px !important;
    background: transparent !important;
    color: #333 !important;
    border: 1px solid #f4f6f9 !important;
    border-radius: 5px !important;
    box-shadow: none !important;
}

.category-modal-body .item.nav-list .category-children-list li.category-child-item .category-child-btn.btn-warm {
    background: transparent !important;
    color: #2563eb !important;
    border-color: #2563eb !important;
}

.category-modal-body .item.nav-list .category-children-list li.category-child-item .category-child-btn:hover {
    background: transparent !important;
    border-color: #2563eb !important;
    color: #2563eb !important;
    transform: none !important;
}

/* PC端头部菜单下拉：二级分类 - 全新布局和样式 */
.myui-header__menu>li .dropdown-box .item.nav-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    padding: 20px !important; /* 统一 padding，四个方向一致 */
    margin: 0 !important;
    list-style: none;
    overflow: hidden; /* 防止内容超出圆角 */
}

.myui-header__menu>li .dropdown-box .item.nav-list li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
    width: 100%;
}

/* 隐藏空的 li 元素，避免出现空位 */
.myui-header__menu>li .dropdown-box .item.nav-list li:empty {
    display: none !important;
}

/* 确保 li 元素正确参与 grid 布局 */
.myui-header__menu>li .dropdown-box .item.nav-list li {
    display: block !important;
    min-width: 0 !important;
}

.myui-header__menu>li .dropdown-box .item.nav-list li .btn {
    width: 100%;
    margin: 0 !important;
    padding: 12px 16px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.5 !important; /* 确保与暗色主题一致 */
    text-align: center;
    border-radius: 6px !important;
    border: 1px solid #e5e7eb !important;
    background: #ffffff !important;
    color: #374151 !important;
    transition: all 0.2s ease;
    box-shadow: none !important;
    /* 确保文字垂直和水平居中，与暗色主题一致 */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    /* 确保按钮高度一致，防止被其他样式覆盖 */
    min-height: auto !important;
    height: auto !important;
    box-sizing: border-box !important;
    text-decoration: none;
    cursor: pointer;
}

.myui-header__menu>li .dropdown-box .item.nav-list li .btn:hover {
    background: #f3f4f6 !important;
    border-color: #2563eb !important;
    color: #2563eb !important;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.12) !important;
}

.myui-header__menu>li .dropdown-box .item.nav-list li .btn-default {
    background: #ffffff !important;
    color: #374151 !important;
    border-color: #e5e7eb !important;
}

.myui-header__menu>li .dropdown-box .item.nav-list li .btn-warm {
    background: linear-gradient(135deg, var(--uc-primary, #2563eb) 0%, #4f46e5 55%, #06b6d4 120%) !important;
    color: #ffffff !important;
    border-color: transparent !important;
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.2) !important;
}

.myui-header__menu>li .dropdown-box .item.nav-list li .btn-warm:hover {
    background: linear-gradient(135deg, var(--uc-primary, #2563eb) 0%, #4f46e5 55%, #06b6d4 120%) !important;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3) !important;
}

/* 覆盖内联样式 */
.myui-header__menu>li .dropdown-box .item.nav-list li .btn[style*="background"] {
    background: linear-gradient(135deg, var(--uc-primary, #2563eb) 0%, #4f46e5 55%, #06b6d4 120%) !important;
    color: #ffffff !important;
    border-color: transparent !important;
}

/* 分类模态框首页按钮样式 */
.category-modal-body .item.nav-list > li:first-child .btn {
    width: 100%;
    margin: 0 !important;
    border-radius: 5px !important;
    padding: 8px 16px !important;
    font-size: 14px !important;
    transition: all 0.3s ease;
    border: 1px solid #f4f6f9 !important;
    box-shadow: none !important;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    background: transparent !important;
    color: #333 !important;
}

.category-modal-body .item.nav-list > li:first-child .btn.btn-warm {
    background: transparent !important;
    color: #2563eb !important;
    border-color: #2563eb !important;
}

.category-modal-body .item.nav-list > li:first-child .btn:hover {
    background: transparent !important;
    border-color: #2563eb !important;
    color: #2563eb !important;
    transform: none !important;
}

/* 响应式优化 */
@media (max-width: 767px) {
    /* 移动端：分类列表容器布局 */
    .category-modal-body .item.nav-list {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
        padding: 0 !important;
    }
    
    /* 移动端：首页按钮改为100%宽度 */
    .category-modal-body .item.nav-list > li:first-child {
        flex: 0 0 100% !important;
        width: 100% !important;
        margin-bottom: 12px !important;
        margin-right: 0 !important;
    }
    
    /* 移动端：顶级分类保持100%宽度 */
    .category-modal-body .item.nav-list li.category-parent-item {
        width: 100% !important;
        flex: 0 0 auto !important;
        margin-bottom: 10px !important;
        margin-top: 12px !important;
        clear: both !important;
    }
    
    .category-modal-body .item.nav-list li.category-parent-item:first-of-type {
        margin-top: 0 !important;
    }
    
    /* 移动端：二级分类容器 */
    .category-modal-body .item.nav-list li.category-children-wrapper {
        width: 100% !important;
        margin-bottom: 10px !important;
        margin-top: 6px !important;
        clear: both !important;
    }
    
    /* 移动端：二级分类列表 */
    .category-modal-body .item.nav-list .category-children-list {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 10px !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    
    /* 移动端：二级分类每行2个 */
    .category-modal-body .item.nav-list .category-children-list li.category-child-item {
        flex: 0 0 calc(50% - 5px) !important;
        width: calc(50% - 5px) !important;
        min-width: 0 !important;
    }
    
    .category-modal {
        width: 70%;
        max-width: 70%;
    }
    
    .category-modal-header {
        padding: 25px 15px 20px;
    }
    
    .category-modal-header .header-logo {
        width: auto !important;
        height: 45px !important;
        max-width: 150px !important;
    }
    
    .category-modal-header .header-logo img {
        width: auto !important;
        height: 45px !important;
        max-width: 150px !important;
    }
    
    .category-modal-header .header-search {
        margin-top: 8px;
    }
    
    .category-modal-header .category-search-input {
        height: 38px;
        font-size: 14px;
        padding: 0 40px 0 65px;
    }
    
    .category-modal-header .category-search-select {
        left: 10px;
        font-size: 12px;
        padding-right: 8px;
    }
    
    .category-modal-header .category-search-submit {
        width: 28px;
        height: 28px;
        font-size: 13px;
    }
    
    .category-modal-close {
        top: 15px;
        right: 15px;
        width: 32px;
        height: 32px;
        font-size: 18px;
        line-height: 32px;
    }
    
    .category-modal-body {
        padding: 15px;
        height: calc(100vh - 160px);
    }
    
    /* 移动端：确保分类默认图标显示 */
    .category-type-item a .icon {
        display: flex !important;
        visibility: visible !important;
    }
    .category-type-item a .icon svg {
        display: block !important;
        width: 16px !important;
        height: 16px !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
}

@media (max-width: 480px) {
    /* 小屏：分类列表容器布局 */
    .category-modal-body .item.nav-list {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
        padding: 0 !important;
    }
    
    /* 小屏：首页按钮改为100%宽度 */
    .category-modal-body .item.nav-list > li:first-child {
        flex: 0 0 100% !important;
        width: 100% !important;
        margin-bottom: 10px !important;
        margin-right: 0 !important;
    }
    
    /* 小屏：顶级分类保持100%宽度 */
    .category-modal-body .item.nav-list li.category-parent-item {
        width: 100% !important;
        flex: 0 0 auto !important;
        margin-bottom: 8px !important;
        margin-top: 10px !important;
        clear: both !important;
    }
    
    .category-modal-body .item.nav-list li.category-parent-item:first-of-type {
        margin-top: 0 !important;
    }
    
    /* 小屏：二级分类容器 */
    .category-modal-body .item.nav-list li.category-children-wrapper {
        width: 100% !important;
        margin-bottom: 12px !important;
        margin-top: 6px !important;
        clear: both !important;
    }
    
    /* 小屏：二级分类列表 */
    .category-modal-body .item.nav-list .category-children-list {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    
    /* 小屏：二级分类每行2个 */
    .category-modal-body .item.nav-list .category-children-list li.category-child-item {
        flex: 0 0 calc(50% - 4px) !important;
        width: calc(50% - 4px) !important;
        min-width: 0 !important;
    }
    
    .category-modal-body .item.nav-list li.category-parent-item .category-parent-btn {
        padding: 8px 16px !important;
        font-size: 14px !important;
    }
    
    .category-modal-body .item.nav-list .category-children-list li.category-child-item .category-child-btn {
        padding: 6px 8px !important;
        font-size: 12px !important;
    }
    
    .category-modal {
        width: 70%;
        max-width: 70%;
    }
    
    .category-modal-header {
        padding: 20px 15px 18px;
    }
    
    .category-modal-header .header-logo {
        width: auto !important;
        height: 40px !important;
        max-width: 120px !important;
    }
    
    .category-modal-header .header-logo img {
        width: auto !important;
        height: 40px !important;
        max-width: 120px !important;
    }
    
    .category-modal-header .header-search {
        margin-top: 8px;
    }
    
    .category-modal-header .category-search-input {
        height: 36px;
        font-size: 13px;
        padding: 0 38px 0 60px;
    }
    
    .category-modal-header .category-search-select {
        left: 8px;
        font-size: 11px;
        padding-right: 6px;
    }
    
    .category-modal-header .category-search-submit {
        width: 26px;
        height: 26px;
        font-size: 12px;
        right: 4px;
    }
    
    .category-modal-body {
        padding: 10px;
        height: calc(100vh - 150px);
    }
}

/* pic-tag */
.pic-tag{ background-color: rgba(0,0,0,0.6); color: #fff;}
.pic-tag.active,.pic-tag-h{ background: linear-gradient(135deg, var(--uc-primary, #2563eb) 0%, #4f46e5 55%, #06b6d4 120%); color: #fff;}
.pic-text,.pic-title-bottom{ background-repeat: no-repeat; background-image: linear-gradient(transparent,rgba(0,0,0,.5)); color: #fff;}
.pic-text.active{ background: rgba(0,0,0,0.6); color: #fff;}
.pic-title-top{background: linear-gradient(to bottom, rgba(0,0,0,0.7) 0%,rgba(0,0,0,0) 100%); color: #fff;}

/* 视频封面角标样式 - 白色主题 */
.pic-badge {
    position: absolute;
    z-index: 100;
    padding: 2px 6px;
    font-size: 10px;
    line-height: 1.4;
    border-radius: 10px;
    color: #fff;
    white-space: nowrap;
    font-weight: 500;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

/* 评分角标 - 左上角，根据分数不同颜色 */
.pic-badge-score {
    top: 4px;
    left: 4px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

/* 评分颜色：9-10分优秀（绿色） */
.pic-badge-score.score-excellent {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
}

/* 评分颜色：8-9分很好（蓝色） */
.pic-badge-score.score-great {
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
}

/* 评分颜色：7-8分良好（青色） */
.pic-badge-score.score-good {
    background: linear-gradient(135deg, #06b6d4 0%, #0891b2 100%);
}

/* 评分颜色：6-7分一般（黄色） */
.pic-badge-score.score-normal {
    background: linear-gradient(135deg, #eab308 0%, #ca8a04 100%);
}

/* 评分颜色：4-6分较差（橙色） */
.pic-badge-score.score-poor {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
}

/* 评分颜色：0-4分很差（红色） */
.pic-badge-score.score-bad {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
}

/* 时长角标 - 右下角（黑色半透明底，更易读） */
.pic-badge-duration {
    bottom: 4px;
    right: 4px;
    background: rgba(0,0,0,.55);
    box-shadow: 0 2px 8px rgba(0,0,0,.18);
    color: #fff;
    border-radius: 6px;
    padding: 2px 6px;
    line-height: 1.2;
    /* 不要“磨砂”效果，避免兼容问题 */
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    text-shadow: none;
}

/* 集数角标 - 左下角，蓝色 */
.pic-badge-serial {
    bottom: 4px;
    left: 4px;
    background: rgba(37, 99, 235, 0.85);
    box-shadow: 0 1px 3px rgba(37, 99, 235, 0.3);
}

/* link */
.myui-link__pic li img{ display: block; padding: 2px 6px; border-radius: 4px; background-color: #fff;}

/* nav */
.nav li.active a{ border-color: #2563eb; color: #2563eb;}
.nav-tabs li .dropdown-box .item li a{ color: #333;}
.nav-tabs li .dropdown-box .item li.active a{ color: #2563eb;}

/* panel（更像后台卡片） */
.myui-panel-bg,.myui-panel-bg2{
    background-color: #fff;
    border: 1px solid #e6e7eb;
    border-radius: 10px;
    box-shadow: 0 10px 43px rgba(51, 65, 52, 0.07);
}

/* vodlist */
.myui-vodlist__bg{background-color: #fff;}
.myui-vodlist__bg:hover{ box-shadow: 0 10px 36px rgba(51, 65, 52, 0.10);}

/* text-list */
.myui-vodlist__text.striped .striped-head,.myui-vodlist__text.to-color li:nth-of-type(odd){ background-color: #f8f8f8;}

/* table */
.myui-table>thead>tr>th,.myui-table>tbody>tr>td, .myui-table>tbody>tr>th, .myui-table>tfoot>tr>td, .myui-table>tfoot>tr>th, .myui-table>thead>tr>td, .myui-table>thead>tr>th { border-color: #e0e0e0;}

/* playlist */
.myui-content__list::-webkit-scrollbar,.myui-playdown__list::-webkit-scrollbar{ width: 4px; background-color: #f5f5f5;}
.myui-content__list::-webkit-scrollbar-thumb,.myui-playdown__list::-webkit-scrollbar-thumb{background-color: #ccc;}

/* player */
.myui-player__video{ background-color: #000;}
.myui-player__operate > li > a{ color: #999;}

/* popup */
.popup{ background-color: #fff;}
.popup-head{ background-color: #fff;}

/* content */
.myui-content__detail .score .rating li .fa,.myui-content__detail .score .branch{ color: #2563eb;}

/* flickity */
.flickity-page-dots .dot{ background: #2563eb;}

/* carousel */
.carousel-indicators-dots li{ background: #2563eb;}
.carousel-indicators-text li.active .title{ color: #2563eb;}
.carousel-indicators-thumb li.active{ border: 3px solid #2563eb;}

/* extra */
.myui-extra li a{ background-color: #fff; border: 1px solid #e6e7eb; box-shadow: 0 10px 43px rgba(51, 65, 52, 0.07);}
.myui-extra li a.backtop{ background: linear-gradient(135deg, var(--uc-primary, #2563eb) 0%, #4f46e5 55%, #06b6d4 120%); color: #fff; border-color: #2563eb; }

/* autocomplete */
.autocomplete-suggestions{ background-color: #fff; box-shadow: 0 2px 10px rgba(0,0,0,.1);}
.autocomplete-suggestion, .autocomplete-suggestions li,.autocomplete-suggestion, .autocomplete-suggestions li a{ color: #333;}
.autocomplete-suggestions li strong{ color: #2563eb;}

/* tabbar */
.myui-nav__tabbar{background-color: #fff; border-color: #e0e0e0;}
.myui-nav__tabbar .item .title{ color: #999;}

/* footer */
.myui-foot{ background-color: #fff;}