/* ============================================================
   MUJI 无印良品风格 - 浅色极简版
   米白背景 / 深灰文字 / 无彩色强调 / 大量留白 / 干净无衬线
   搜索栏保留 Google 圆角式样
   ============================================================ */

/* === CSS 变量重写 === */
:root {
    --theme-color: #2b2b2b;
    --theme-background: #faf9f6;
    --theme-muted: #8a8a8a;
    --theme-border: #e6e2da;
    --theme-accent: #2b2b2b;
    --theme-hover: #f3f1ec;
    --theme-theme: #2b2b2b;
    --theme-other_background: #ffffff;
    --theme-shadow: rgba(0,0,0,0.06);
}

/* === 全局字体和配色 === */
html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, 'Hiragino Sans GB', 'PingFang SC', 'Microsoft YaHei', sans-serif !important;
    font-size: 15px !important;
    color: #2b2b2b !important;
    background-color: #faf9f6 !important;
    line-height: 1.8 !important;
    font-weight: 400 !important;
}

/* === 隐藏背景图 === */
.headBg {
    display: none !important;
}

/* === 顶部导航 === */
.headerBox {
    background: #faf9f6 !important;
    border-bottom: 1px solid #e6e2da !important;
    box-shadow: none !important;
}

.headerBox .box {
    background: transparent !important;
}

/* === Logo 区域 === */
.logoBox {
    color: #2b2b2b !important;
    font-weight: 500 !important;
    letter-spacing: 1px !important;
}

/* === 搜索框 - 保留 Google 圆角式样 === */
.searchBox .search {
    background: #ffffff !important;
    border: 1px solid #e6e2da !important;
    border-radius: 24px !important;
    box-shadow: none !important;
    height: 46px !important;
    transition: box-shadow 0.2s, border-color 0.2s !important;
    overflow: hidden !important;
}

.searchBox .search:hover,
.searchBox .search:focus-within {
    box-shadow: 0 1px 6px rgba(0,0,0,0.12) !important;
    border-color: #bcb8b0 !important;
}

.searchBox input[type="text"] {
    border: none !important;
    background: transparent !important;
    font-size: 16px !important;
    color: #2b2b2b !important;
    height: 46px !important;
    padding: 0 16px !important;
    outline: none !important;
}

.searchBox input[type="text"]::placeholder {
    color: #b0aca4 !important;
}

.searchBox .btn,
.searchBox button {
    background: transparent !important;
    border: none !important;
    color: #2b2b2b !important;
    border-radius: 0 24px 24px 0 !important;
    padding: 0 16px !important;
    cursor: pointer !important;
}

/* === 搜索列表页搜索框 === */
.searchList .search {
    border-radius: 24px !important;
}

/* === 筛选侧边栏 === */
.listBox .screen {
    background: transparent !important;
}

.listBox .screen .fixed {
    background: #ffffff !important;
    border: 1px solid #e6e2da !important;
    border-radius: 4px !important;
    box-shadow: none !important;
}

.listBox .screen h3 {
    color: #2b2b2b !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    letter-spacing: 1px !important;
}

.listBox .screen .box a {
    color: #767676 !important;
    font-size: 14px !important;
    padding: 8px 12px !important;
    border-radius: 4px !important;
    transition: background 0.15s !important;
}

.listBox .screen .box a:hover {
    background: #f3f1ec !important;
    color: #2b2b2b !important;
}

.listBox .screen .box a.active {
    color: #2b2b2b !important;
    font-weight: 500 !important;
    background: #f3f1ec !important;
}

/* === 搜索源切换 === */
.source-switch h3 {
    color: #2b2b2b !important;
    font-size: 14px !important;
    letter-spacing: 1px !important;
}

.switch-items a {
    color: #767676 !important;
    font-size: 14px !important;
    padding: 6px 16px !important;
    border-radius: 4px !important;
    border: 1px solid #e6e2da !important;
    background: #ffffff !important;
}

.switch-items a.active {
    color: #2b2b2b !important;
    border-color: #2b2b2b !important;
    background: #f3f1ec !important;
    font-weight: 500 !important;
}

/* === 搜索结果项 === */
.listBox .left .list .item {
    border-bottom: 1px solid #e6e2da !important;
    padding: 20px 0 !important;
}

.listBox .left .list .item .title {
    color: #2b2b2b !important;
    font-size: 18px !important;
    text-decoration: none !important;
}

.listBox .left .list .item .title:hover {
    text-decoration: underline !important;
}

.listBox .left .list .item .pan,
.listBox .left .list .item span[class*="pan"] {
    font-size: 13px !important;
    color: #8a8a8a !important;
}

/* 获取资源按钮 - MUJI 风：深灰底白字 */
.btns2,
.listBox .left .list .item .btns2 {
    background: #2b2b2b !important;
    color: #ffffff !important;
    border-radius: 4px !important;
    padding: 8px 18px !important;
    font-size: 14px !important;
    border: none !important;
    letter-spacing: 1px !important;
}

.btns2:hover {
    background: #000000 !important;
}

/* === 首页区域 === */
.homeBox {
    background: transparent !important;
}

/* 热门搜索词 */
.hot a, .hot span {
    font-size: 14px !important;
    color: #767676 !important;
}

.hot a:hover {
    color: #2b2b2b !important;
}

/* === 通用按钮 MUJI 风 === */
button, .btn, input[type="submit"] {
    font-family: 'Helvetica Neue', Helvetica, Arial, 'Hiragino Sans GB', 'PingFang SC', 'Microsoft YaHei', sans-serif !important;
    font-size: 14px !important;
    border-radius: 4px !important;
    letter-spacing: 1px !important;
}

/* === 链接 === */
a {
    color: #2b2b2b !important;
    text-decoration: none !important;
}

a:hover {
    text-decoration: underline !important;
}

/* === 结果计数 === */
.Qbtn .btn p,
.listBox .left h3 {
    color: #8a8a8a !important;
    font-size: 13px !important;
}

.listBox .left h3 span {
    color: #2b2b2b !important;
}

/* === 空状态 === */
.el-empty {
    color: #8a8a8a !important;
}

/* === 弹窗 === */
.el-dialog .vbtn,
.el-dialog button {
    border-radius: 4px !important;
    font-size: 14px !important;
    letter-spacing: 1px !important;
}

.el-dialog, .el-dialog__wrapper {
    background: #ffffff !important;
}

.el-dialog__title, .el-dialog__body {
    color: #2b2b2b !important;
}

.layerBox .vbtn {
    background-color: #2b2b2b !important;
    color: #ffffff !important;
}

/* === 页脚 === */
.footer, .footerBox {
    color: #8a8a8a !important;
    font-size: 13px !important;
    border-top: 1px solid #e6e2da !important;
    background: #faf9f6 !important;
}

.footer a, .footerBox a {
    color: #767676 !important;
}

.footer a:hover, .footerBox a:hover {
    color: #2b2b2b !important;
}

/* === 分页 === */
.el-pagination button,
.el-pagination .number {
    border-radius: 4px !important;
    font-family: 'Helvetica Neue', Helvetica, Arial, 'PingFang SC', 'Microsoft YaHei', sans-serif !important;
    background: #ffffff !important;
    color: #2b2b2b !important;
    border: 1px solid #e6e2da !important;
}

.el-pagination button:hover,
.el-pagination .number:hover {
    background: #f3f1ec !important;
}

.el-pagination .active {
    background: #2b2b2b !important;
    color: #ffffff !important;
    border-color: #2b2b2b !important;
}

/* === 卡片 / 容器（热门搜索、资源分类）=== */
.listBox .box {
    background-color: #ffffff !important;
    box-shadow: none !important;
    border: 1px solid #e6e2da !important;
}

/* 右侧热门搜索卡片 */
.listBox .right .box {
    background-color: #ffffff !important;
    box-shadow: none !important;
    border: 1px solid #e6e2da !important;
    border-radius: 8px !important;
}

/* 热门搜索标题 */
.listBox .nav,
.home .nav {
    color: #2b2b2b !important;
    letter-spacing: 1px !important;
}

.listBox .nav img,
.home .nav img {
    filter: none;
}

/* 热门搜索列表项文字 */
.listBox .right .list .item p {
    color: #2b2b2b !important;
    font-size: 14px !important;
}

.listBox .right .list .item:hover p {
    color: #000000 !important;
    text-decoration: underline !important;
}

/* 序号颜色（前三名柔和强调） */
.listBox .right .list .item p span {
    color: #b0aca4 !important;
}

.listBox .right .list .item:nth-child(1) p span {
    color: #2b2b2b !important;
}

.listBox .right .list .item:nth-child(2) p span {
    color: #5a5a5a !important;
}

.listBox .right .list .item:nth-child(3) p span {
    color: #8a8a8a !important;
}

/* 首页资源分类卡片 */
.home .content .list .item .img {
    background: #f3f1ec !important;
    border-radius: 4px !important;
}

.home .content .list .item .img span {
    color: #b0aca4 !important;
}

.home .content .list .item p {
    color: #2b2b2b !important;
    font-size: 14px !important;
}

.home .content .list .item:hover p {
    color: #000000 !important;
    text-decoration: underline !important;
}

/* 标题区 */
.listBox h3 span,
.homeBox h3 span {
    color: #2b2b2b !important;
}

/* === 移动端适配 === */
@media (max-width: 768px) {
    .searchBox .search {
        height: 44px !important;
        border-radius: 22px !important;
    }
    .searchBox input[type="text"] {
        height: 44px !important;
        font-size: 16px !important;
    }
}