/*
Theme Name: OWDIR
Author: Max
Version: 2.0.0
Text Domain: owdir.com
*/


/* 全局样式 */
body, html {
    background-color: transparent; /* 或 #fff 如果想设为白色 */
    color: #333; /* 字体颜色 */
    font-family: Arial, sans-serif; /* 默认字体 */
    margin: 0;
    padding: 0;
    font-size: 16px;
    line-height: 1.5;
}




/* ------------------ header.php 样式 ----------------------- */
/* Header 基本样式 */
.header {
    background-color: #fff;
    padding: 10px 0;
    width: 100%;
}

/* Header 容器，居中对齐 */
.header__container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Logo 样式 */
.header__logo a {
    display: inline-block;
    text-decoration: none;
}

/* 描述文本样式 */
.header__description {
    text-align: center;
    flex: 1;
}

.header__text {
    font-size: 14px;
    color: #075007;
    margin-top: 10px;
    font-weight: bold; /* 强调文本 */
}

/* 搜索框样式 */
.header__search {
    width: 100%;
}

.search-input-container {
    display: flex;
    justify-content: center; /* 默认居中对齐 */
    align-items: center; /* 垂直居中 */
    gap: 10px; /* 设置搜索框和按钮之间的间距 */
    width: 100%;
}

.search-field {
    width: 300px;
    height: 40px;
    padding: 10px;
    font-size: 16px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}

.search-submit {
    font-size: 16px;
    padding: 10px 20px;
    background-color: #0a6b0a;  /* 按钮蓝色背景 */
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

/* PC端右对齐样式 */
@media (min-width: 769px) {
    .header__search {
        display: flex;
        justify-content: flex-end; /* 使搜索框和按钮右对齐 */
    }

    .search-input-container {
        justify-content: flex-end; /* 搜索框和按钮右对齐 */
        width: auto;
    }

    .search-field {
        width: 300px;
    }

    .search-submit {
        width: auto;
    }
}

/* 手机端自适应布局 */
@media (max-width: 768px) {
    /* 居中 logo 和描述文本 */
    .header__container {
        flex-direction: column;
        align-items: center;
        padding: 0 15px;
    }

    /* 搜索框和按钮在同一行居中 */
    .search-input-container {
        justify-content: center; /* 使搜索框和按钮居中 */
        margin-top: 10px;
        gap: 10px; /* 增加搜索框和按钮之间的间距 */
        width: 100%;
    }

    .search-field {
        width: 70%; /* 搜索框宽度占屏幕宽度的 70% */
    }

    .search-submit {
        width: auto;
    }

    /* 描述文本 */
    .header__description {
        text-align: center;
        margin-top: 15px;
    }

    .header__text {
        font-size: 12px;
    }
}

/* 更小屏幕（例如，手机）自适应 */
@media (max-width: 480px) {
    .search-field {
        width: 80%; /* 增加搜索框的宽度 */
    }

    .search-submit {
        width: auto; /* 按钮宽度自适应 */
    }

    .header__text {
        font-size: 11px;
    }
}

/* ----------------------------- navigation.php样式 --------------------------------- */

/* 清除默认的 ul 和 li 内外边距 */
ul, li {
    margin: 0px;  /* 清除默认的外边距 px/em/rem不受影响 */
    padding: 10px;  /* 清除默认的内边距*/
}

/* 强制设置 .header__nav 布局 */
.header__nav {
    background-color: #f4f4f4; /* 设置导航栏背景色 */
    padding: 15px 0; /* 设置导航栏行高 */
    width: 100%;
    display: flex; /* 使用 flex 布局 */
    justify-content: flex-start; /* 保证菜单项左对齐 */
    align-items: center; /* 垂直对齐菜单项 */
}

/* 修改 .nav-menu 样式 */
.header__nav .nav-menu,
.nav-menu {
    list-style-type: none; /* 去除默认的列表样式 */
    margin: 0; /* 移除外边距 */
    padding: 0; /* 移除内边距 */
    display: flex; /* 使用 flex 布局 */
    flex-direction: row; /* 强制菜单项水平排列 */
    flex-wrap: nowrap; /* 防止菜单项换行 */
    width: 100%;
    max-width: 1200px; /* 限制菜单项最大宽度为1200px */
    justify-content: flex-start; /* 强制左对齐菜单项 */
    box-sizing: border-box; /* 确保内边距不会增加元素宽度 */
    margin: 0 auto; /* 保证菜单项在最大宽度内居中 */
}

/* 菜单项样式 */
.header__nav .nav-menu li,
.nav-menu li {
    display: inline-block;
    margin-right: 15px; /* 只保留右边距 */
    padding: 0; /* 移除内边距 */
}

/* 处理第一个菜单项，去除左边距 */
.header__nav .nav-menu li:first-child,
.nav-menu li:first-child {
    margin-left: 0; /* 确保第一个项目没有左边距 */
    padding-left: 0; /* 确保第一个项目没有左内边距 */
}

/* 移除WordPress默认样式的强制覆盖 */
ul.nav-menu {
    padding-left: 0; /* 覆盖WordPress默认的左内边距 */
    margin-left: 0; /* 覆盖WordPress默认的左外边距 */
}

/* 菜单项链接的样式 */
.header__nav .nav-menu a,
.nav-menu a {
    color: #333;
    text-decoration: none;
    font-size: 16px;
    padding: 10px 15px;
    display: inline-block;
    transition: background-color 0.3s ease;
}

/* 为第一个菜单项的链接移除左内边距 */
.header__nav .nav-menu li:first-child a,
.nav-menu li:first-child a {
    padding-left: 0; /* 移除第一个菜单项链接的左内边距 */
}

.nav-menu a:hover {
    background-color: #ffffff;
    border-radius: 4px; /* 悬停时的圆角效果 */
}

/* 手机端自适应导航栏样式 */
@media (max-width: 768px) {
    .nav-menu {
        flex-direction: row !important; /* 强制菜单项在手机端水平排列 */
        gap: 10px; /* 增加菜单项之间的间距 */
    }

    .nav-menu li {
        margin: 0; /* 去除水平间距 */
    }

    .nav-menu a {
        padding: 12px 20px; /* 增加点击区域 */
        font-size: 18px; /* 调整字体大小 */
        width: auto; /* 使菜单项宽度自适应 */
        text-align: center; /* 居中文本 */
    }

    /* 汉堡菜单按钮样式 */
    .hamburger-menu {
        display: none; /* 默认隐藏 */
        flex-direction: column;
        justify-content: space-between;
        height: 20px;
        width: 25px;
        cursor: pointer;
    }

    .hamburger-menu div {
        height: 3px;
        background-color: white;
        width: 100%;
    }

    /* 当屏幕小于768px时显示汉堡菜单 */
    .hamburger-menu {
        display: flex; /* 在手机端显示汉堡菜单 */
    }
    
    /* 隐藏导航菜单，点击汉堡菜单后显示 */
    .nav-menu {
        display: none;
        flex-direction: column;
        width: 100%;
        text-align: center;
    }

    /* 菜单项 */
    .nav-menu li {
        margin: 0;
    }

    .nav-menu.show {
        display: flex; /* 菜单显示 */
    }
}



/* --------------------------- front-page.php首页快审横幅样式 ------------------------------- */

/* 首页置顶模块样式 */
.sticky-sites-container {
    background: none;   /* 去除背景 */
    border: none;       /* 去除边框 */
    box-shadow: none;   /* 去除阴影 */
    padding: 0;
    margin-bottom: 20px;
}

.sticky-sites-container > .container {
    display: grid;
    grid-template-columns: repeat(8, 1fr); /* 每行8个 */
    grid-template-rows: repeat(2, auto);   /* 两行 */
    gap: 20px 20px;                        /* 行间距、列间距 */
    justify-items: center;
    align-items: start;
    width: 100%;
    max-width: 1200px; /* 总宽度1200px */
    margin-left: auto;
    margin-right: auto;
    background: none;  /* 再次确保无背景 */
    border: none;      /* 再次确保无边框 */
    box-shadow: none;
}

.sticky-site-item {
    width: 130px;
    display: flex;
    flex-direction: column;
    align-items: center;
    background: none; /* 无背景 */
    border: none;     /* 无边框 */
    box-shadow: none;
}

.sticky-site-title {
    width: 130px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-align: center;
    margin: 0 auto 6px auto;
}

/* 置顶网站标题链接样式 */
.sticky-site-title a {
    font-size: 14px;          /* 字体大小适中 */
    color: #333;              /* 深灰色字体 */
    text-decoration: none;    /* 去除下划线 */
    font-weight: 500;         /* 稍微加粗 */
    transition: color 0.2s;   /* 颜色过渡效果 */
}

/* 鼠标悬停效果 */
.sticky-site-title a:hover {
    color: #1976d2;           /* 悬停时变蓝色 */
}


/* 最新发布区域三列布局样式 */
.latest-sites-layout {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    max-width: 1200px;
    margin: 0 auto;
}

/* 左侧列 - 最新的1个帖子 */
.latest-sites-left-column {
    flex: 0 0 370px;
}

.featured-site {
    background-color: transparent;
    border-radius: 0;
    box-shadow: none;
    overflow: visible;
    height: 550px;
    display: flex;
    flex-direction: column;
}

/* 让图片链接区域可以伸展 */
.featured-site > a:first-of-type {
    flex-grow: 1;
    min-height: 0; /* 修正flexbox中的图片伸展问题 */
}

.featured-site img {
    width: 100%;
    height: 100%; /* 填充可用空间 */
    object-fit: cover;
    display: block;
}

.featured-site h2 {
    padding: 10px 15px;
    margin: 0;
    font-size: 18px;
}

.featured-site h2 a {
    color: #333;
    text-decoration: none;
}

.featured-site h2 a:hover {
    color: #0a6b0a;
}

.featured-site .site-description {
    padding: 0 15px 15px;
    color: #666;
    font-size: 14px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    max-height: 4.5em;
}

/* 中间列 - 2-5号帖子 */
.latest-sites-middle-column {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.middle-site-item {
    display: flex;
    background-color: transparent;
    border-radius: 0;
    box-shadow: none;
    overflow: visible;
    height: 126.25px;
    align-items: center;
    margin-bottom: 0;
}

.middle-site-item .site-thumb {
    flex: 0 0 120px;
}

.middle-site-item .site-thumb img {
    width: 100%;
    height: 120px;
    object-fit: cover;
    display: block;
}

.middle-site-item .site-content {
    flex: 1;
    padding: 10px;
}

.middle-site-item h3 {
    margin: 0 0 5px;
    font-size: 18px;
    line-height: 1.3;
    font-weight: bold;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    white-space: normal;
}

.middle-site-item h3 a {
    color: #333;
    text-decoration: none;
}

.middle-site-item h3 a:hover {
    color: #0a6b0a;
}

.middle-site-item .site-description {
    color: #666;
    font-size: 15px;
    line-height: 1.5;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    max-height: 4.5em;
}

/* 右侧列 - 6-10号帖子 */
.latest-sites-right-column {
    flex: 0 0 300px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.right-site-item {
    display: flex;
    background-color: transparent;
    border-radius: 0;
    box-shadow: none;
    overflow: visible;
    height: 102px;
    align-items: center;
    margin-bottom: 0;
}

.right-site-item .site-thumb {
    flex: 0 0 100px;
}

.right-site-item .site-thumb img {
    width: 100%;
    height: 100px;
    object-fit: cover;
    display: block;
}

.right-site-item .site-content {
    flex: 1;
    padding: 8px;
}

.right-site-item h3 {
    margin: 0 0 3px;
    font-size: 16px;
    line-height: 1.3;
    font-weight: bold;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    white-space: normal;
}

.right-site-item h3 a {
    color: #333;
    text-decoration: none;
}

.right-site-item h3 a:hover {
    color: #0a6b0a;
}

.right-site-item .site-description {
    color: #666;
    font-size: 14px;
    line-height: 1.5;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    max-height: 3em;
}

/* 响应式布局 */
@media (max-width: 992px) {
    .latest-sites-layout {
        flex-direction: column;
    }
    
    .latest-sites-left-column,
    .latest-sites-right-column {
        flex: 1 1 100%;
        width: 100%;
    }
}

@media (max-width: 768px) {
    .featured-site img {
        height: 200px;
    }
    
    .middle-site-item,
    .right-site-item {
        flex-direction: column;
    }
    
    .middle-site-item .site-thumb,
    .right-site-item .site-thumb {
        flex: 0 0 auto;
        width: 100%;
    }
    
    .middle-site-item .site-thumb img,
    .right-site-item .site-thumb img {
        width: 100%;
        height: auto;
    }
}


/* 横幅容器 */
.banner-container {
    background-color: #fff;
    padding: 20px 0;
    margin-bottom: 20px;
    border: none;
    box-shadow: none !important;
}

.banner-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
    background: #fff;
    box-sizing: border-box;
}

/* 横幅内容 */
.banner-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* 网站标签容器 */
.site-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    line-height: 1.8;
}

/* 网站链接 */
.site-tags a {
    color: #333;
    text-decoration: none;
    font-size: 14px;
    position: relative;
    padding-right: 5px;
}

/* 快审标签 */
.site-tags a .quicktag {
    display: inline-block;
    background-color: #ff6600;
    color: #fff;
    padding: 0 5px;
    border-radius: 2px;
    font-size: 12px;
    line-height: 1.5;
    margin-left: 3px;
}

/* 鼠标悬停效果 */
.site-tags a:hover {
    color: #0066cc;
}

/* 首页置顶模块的响应式样式 */
@media (max-width: 1200px) {
    .sticky-sites-container > .container {
        grid-template-columns: repeat(6, 1fr); /* 每行6个 */
        gap: 20px 20px;                        /* 稍微减小间距 */
        max-width: 900px;                      /* 适应较小屏幕 */
    }
}

@media (max-width: 900px) {
    .sticky-sites-container > .container {
        grid-template-columns: repeat(4, 1fr); /* 每行4个 */
        gap: 15px 15px;                        /* 再减小间距 */
        max-width: 600px;                      /* 适应平板 */
    }
}

@media (max-width: 600px) {
    .sticky-sites-container > .container {
        grid-template-columns: repeat(2, 1fr); /* 每行2个 */
        gap: 10px 10px;                        /* 手机端间距更小 */
        max-width: 300px;                      /* 适应手机 */
    }
    
    .sticky-site-title {
        width: 100%;                           /* 宽度自适应 */
    }
    
    .sticky-site-title a {
        font-size: 13px;                       /* 手机端字体稍小 */
    }
}

/* 移动设备响应式布局 */
@media (max-width: 768px) {
    .site-tags {
        flex-direction: column;
        gap: 5px;
    }
    
    .site-tags a {
        font-size: 13px;
        line-height: 1.5;
    }
}


/* ----------------------------- 70%区域分类导航样式 ------------------------------- */

/* 首页主容器样式 */
.front-page-main-container {
  display: flex;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 15px;
  gap: 20px; /* 保留间距 */
}

/* 主内容区域样式（占70%宽度） */
.front-page-main-content {
  width: 70%; /* 恢复原来的宽度 */
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  padding: 15px;
}

/* 分类导航部分 */
.front-page-category-navigation h2 {
  font-size: 20px;
  color: #333;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 2px solid #f0f0f0;
}

.front-page-category-content {
  margin-top: 10px;
}

/* 顶级分类样式 */
.front-page-top-category {
  margin-bottom: 0; /* 将底部外边距改为0 */
  padding: 0; /* 移除内边距 */
  border-radius: 0; /* 移除圆角 */
}

/* 隐藏顶级分类名称 */
.front-page-top-category h3 {
  display: none;
}

/* 子分类行布局修改 - 确保所有元素在同一行 */
.front-page-subcategory-row {
  display: flex;
  align-items: center; /* 垂直居中对齐 */
  margin-bottom: 0;
  padding: 8px 0;
  border-bottom: 1px solid #eee;
  flex-wrap: nowrap; /* 防止换行 */
}

/* 移除任何可能出现的红框 */
.front-page-top-category,
.front-page-subcategory-row,
.front-page-main-content {
  border: none; /* 移除任何边框 */
}

/* 如果有任何自定义分隔元素，可以隐藏它们 */
.category-separator,
.divider,
hr {
  display: none;
}

/* 确保最后一个元素没有多余的边距 */
.front-page-subcategory-row:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 8px;
}

/* 如果有红框是某个特定元素，可能需要针对性处理 */
.red-box-element, 
.highlighted-category {
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

/* 子分类名称样式 */
.front-page-subcategory-name {
  width: 75px; /* 约5个汉字的宽度 */
  flex-shrink: 0;
  padding-right: 10px;
}

.front-page-subcategory-name a {
  font-size: 15px;
  color: #3273dc;
  text-decoration: none;
  font-weight: 500;
  display: block;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.front-page-subcategory-name a:hover {
  color: #1a56b0;
  text-decoration: underline;
}

/* 子分类网站列表区域 - 修改为水平布局 */
.front-page-subcategory-websites {
  flex-grow: 1;
  display: flex; /* 使用flex布局 */
  align-items: center; /* 垂直居中 */
  position: relative;
  padding-right: 50px; /* 为"更多"链接留出空间 */
}

/* 网站标题列表 - 水平显示 */
.front-page-website-titles {
  display: flex; /* 水平布局 */
  flex-wrap: nowrap; /* 不换行 */
  margin: 0;
  padding: 0;
  list-style: none;
  overflow-x: hidden; /* 超出部分隐藏 */
  width: 100%; /* 占满可用宽度 */
}

.front-page-website-titles li {
  margin-right: 12px;
  white-space: nowrap; /* 站点名称不换行 */
}

.front-page-website-titles li a {
  display: inline;
  color: #666;
  text-decoration: none;
  font-size: 14px;
  padding: 0; /* 移除内边距 */
  transition: all 0.2s ease;
}

.front-page-website-titles li a:hover {
  color: #333;
  text-decoration: underline;
}

/* "更多"链接样式 */
.front-page-more-link {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  margin-left: 10px; /* 与网站列表保持距离 */
}

.front-page-more-link a {
  color: #999;
  text-decoration: none;
  font-size: 12px;
  display: block;
  padding: 2px 6px;
  border: 1px solid #eee;
  border-radius: 3px;
  transition: all 0.2s ease;
}

.front-page-more-link a:hover {
  color: #3273dc;
  border-color: #3273dc;
}

/* 无内容提示样式 */
.front-page-subcategory-websites p,
.front-page-top-category > p,
.front-page-category-content > p {
  color: #999;
  font-size: 13px;
  font-style: italic;
  margin: 5px 0;
}

/* 70%区域的响应式布局 */
@media (max-width: 768px) {
  .front-page-main-container {
    flex-direction: column; /* 在小屏幕上改为垂直排列 */
    gap: 15px;
    padding: 10px; /* 减小容器内边距 */
    max-width: 100%; /* 确保不超过屏幕宽度 */
    box-sizing: border-box; /* 确保内边距计入总宽度 */
    margin: 0 auto; /* 居中显示 */
    width: 100%; /* 设置宽度为100% */
  }
  
  .front-page-main-content {
    width: 100%; /* 在小屏幕上占满宽度 */
    padding: 8px; /* 减小内边距 */
    box-sizing: border-box; /* 确保内边距计入总宽度 */
    margin: 0; /* 移除外边距 */
  }
  
  .front-page-subcategory-row {
    flex-direction: column; /* 子分类行改为垂直排列 */
    align-items: flex-start;
    padding: 8px 0; /* 减小上下内边距 */
    width: 100%; /* 确保宽度不超出 */
    box-sizing: border-box;
    margin: 0; /* 移除外边距 */
  }
  
  .front-page-subcategory-name {
    width: 100%; /* 子分类名称占满宽度 */
    margin-bottom: 5px;
    padding-right: 0;
  }
  
  .front-page-subcategory-websites {
    width: 100%;
    padding-right: 0;
    padding-bottom: 25px; /* 为"更多"链接留出空间 */
    overflow-x: hidden; /* 防止水平溢出 */
  }
  
  .front-page-website-titles {
    flex-wrap: wrap; /* 允许网站标题换行 */
    margin: 0; /* 移除外边距 */
    padding-left: 15px; /* 减小左内边距 */
    width: 100%; /* 确保宽度不超出 */
  }
  
  .front-page-more-link {
    right: 0;
    top: auto;
    bottom: 0;
    transform: none;
  }
  
  /* 侧边栏在移动设备上的样式 */
  .front-page-sidebar {
    width: 100%; /* 在小屏幕上占满宽度 */
    padding: 15px; /* 减小内边距 */
    margin: 0; /* 移除外边距 */
  }
}

/* 增加一个更小屏幕的断点 */
@media (max-width: 480px) {
  .front-page-main-container {
    padding: 5px; /* 进一步减小内边距 */
    width: 100%; /* 确保宽度为100% */
  }
  
  .front-page-main-content {
    padding: 5px; /* 进一步减小内边距 */
  }
  
  /* 更小屏幕上的其他元素调整 */
  .front-page-subcategory-row {
    padding: 5px 0; /* 减小内边距 */
  }
  
  .front-page-website-titles {
    padding-left: 10px; /* 减小左内边距 */
  }
  
  .front-page-sidebar {
    padding: 10px; /* 进一步减小内边距 */
  }
}



/* ----------------------------- 首页30%全分类导航样式 ------------------------------- */

/* 侧边栏基本样式 */
.front-page-sidebar {
    width: calc(30% - 20px); /* 从侧边栏减去全部的间距 */
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

/* 分类导航容器 */
.front-page-category-navigator {
    margin-bottom: 20px;
}

/* 分类部分样式 */
.front-page-category-section {
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid #e5e5e5;
}

.front-page-category-section:last-child {
    border-bottom: none;
}

/* 顶级分类标题 */
.front-page-top-category-title {
    font-size: 18px;
    margin-bottom: 10px;
    padding-bottom: 5px;
    border-bottom: 2px solid #3498db;
    color: #333;
}

.front-page-top-category-title a {
    text-decoration: none;
    color: #333;
    transition: color 0.3s ease;
}

.front-page-top-category-title a:hover {
    color: #3498db;
}

/* 子分类容器 - 使用弹性布局实现两列 */
.front-page-subcategory-container {
    display: flex;
    flex-wrap: wrap;
    margin-top: 10px;
}

/* 子分类列 - 每列占50%宽度 */
.front-page-subcategory-column {
    width: 50%;
    box-sizing: border-box;
    padding-right: 8px;
}

/* 子分类项目 */
.front-page-subcategory-item {
    margin-bottom: 5px;
    display: flex;
    align-items: center;
}

/* 子分类前的圆点 */
.front-page-bullet {
    color: #3498db;
    margin-right: 5px;
    font-size: 16px;
}

/* 子分类链接 */
.front-page-subcategory-item a {
    font-size: 14px;
    color: #666;
    text-decoration: none;
    transition: color 0.2s ease;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.front-page-subcategory-item a:hover {
    color: #3498db;
}

/* 响应式设计 - 移动设备适配 */
@media (max-width: 768px) {
    /* 侧边栏在小屏幕上占满宽度 */
    .front-page-sidebar {
        width: 100%;
        padding: 15px;
        margin: 0;
        box-sizing: border-box;
    }
    
    /* 子分类在小屏幕上改为单列 */
    .front-page-subcategory-column {
        width: 100%;
        padding-right: 0;
    }
    
    /* 顶级分类标题在小屏幕上的样式 */
    .front-page-top-category-title {
        font-size: 16px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    
    /* 子分类项目确保不溢出 */
    .front-page-subcategory-item {
        width: 100%;
        overflow: hidden;
    }
    
    /* 子分类链接文本控制 */
    .front-page-subcategory-item a {
        max-width: calc(100% - 20px);
    }
    
    /* 减小圆点大小 */
    .front-page-bullet {
        font-size: 14px;
        margin-right: 3px;
    }
}

/* 针对更小屏幕的优化 */
@media (max-width: 480px) {
    .front-page-sidebar {
        padding: 10px;
    }
}

/* -------------------------- footer.php样式 -------------------------- */

    .footer {
        background-color: #333;
        color: #fff;
    padding: 20px 0;
        margin-top: 30px;
    }
    
    .footer__container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 15px;
        text-align: center; /* 添加这行使容器内的内容居中 */
    }
    
    .footer__content {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
    }
    
    .footer__text {
        margin: 0;
        font-size: 14px;
        text-align: center; /* 添加这行使文本居中 */
    }
    
    .footer__links {
        display: flex;
        gap: 20px;
    }
    
    .footer__links a {
        color: #fff;
        text-decoration: none;
        font-size: 14px;
        transition: color 0.3s ease;
    }
    
    .footer__links a:hover {
        color: #3498db;
    }
    
    @media (max-width: 768px) {
        .footer__content {
            flex-direction: column;
            text-align: center;
            gap: 15px;
        }
        
        .footer__links {
            justify-content: center;
        }
    }


/* -------------------------- single-website.php详情页样式 -------------------------- */
/* 网站置顶标签和时间样式 */
.website-sticky-label {
    display: inline-block;
    background-color: #ff4757;
    color: #fff;
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 12px;
    font-weight: bold;
    margin-right: 5px;
    vertical-align: middle;
}

.website-sticky-time {
    display: inline-block;
    font-size: 14px;
    color: #666;
    margin-left: 10px;
    background-color: #f8f9fa;
    padding: 2px 8px;
    border-radius: 3px;
    border: 1px solid #e9ecef;
    vertical-align: middle;
    font-weight: normal;
}

/* 标题容器样式，确保标题和置顶信息在一行 */
.website-title-container {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.website-details__title {
    display: inline-flex;
    align-items: center;
    margin: 0;
}

/* 页面整体布局 */
.content-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    padding: 24px 12px;
    background: #fff;
    color: #222;
    font-family: "Segoe UI", "Microsoft YaHei", Arial, sans-serif;
    line-height: 1.7;
}

/* 详情主体 */
.website-details {
    padding: 0;
    background: none;
    box-shadow: none;
    border-radius: 0;
}

/* 标题 */
.website-details__title {
    font-size: 26px;
    font-weight: bold;
    color: #222;
    margin: 0 0 12px 0;
    padding-bottom: 10px;
    width: 100%;
}

/* 分类链接 */
.website-details__category-link {
    color: #1976d2;
    text-decoration: none;
    margin-right: 6px;
    font-weight: 500;
}
.website-details__category-link:hover {
    text-decoration: underline;
    color: #0d47a1;
}

/* 域名网址 */
.website-details__destination-url {
    color: #1976d2;
    text-decoration: none;
    word-break: break-all;
    font-weight: 500;
}
.website-details__destination-url:hover {
    text-decoration: underline;
    color: #0d47a1;
}

/* 暂无数据的占位符样式 */
.no-data {
    color: #999;
    font-style: italic;
    font-size: 14px;
}

/* 关键词标签 */
.keyword-link {
    display: inline-block;
    background: #f5f7fa;
    color: #1976d2;
    border-radius: 3px;
    padding: 2px 10px;
    margin: 2px 4px 2px 0;
    font-size: 14px;
    text-decoration: none;
    border: 1px solid #e3eaf2;
    transition: background 0.2s, color 0.2s;
}
.keyword-link:hover {
    background: #1976d2;
    color: #fff;
}

/* tags标签样式 */
.website-tag {
    display: inline-block;
    background: #fffbe6;
    color: #ff9800;
    border-radius: 3px;
    padding: 2px 10px;
    margin: 2px 4px 2px 0;
    font-size: 14px;
    text-decoration: none;
    border: 1px solid #ffe0b2;
    transition: background 0.2s, color 0.2s;
}
.website-tag:hover {
    background: #ff9800;
    color: #fff;
}

/* 网站ID链接 */
.website-details__id-link {
    color: #1976d2;
    text-decoration: none;
    font-weight: 500;
}
.website-details__id-link:hover {
    text-decoration: underline;
    color: #0d47a1;
}

/* 详情段落 */
.website-details p {
    margin: 8px 0;
    font-size: 15px;
    color: #444;
    line-height: 1.5;
}
.website-details p strong {
    color: #222;
    font-weight: 600;
    margin-right: 8px;
    min-width: 90px;
    display: inline-block;
}

/* 网站描述和截图区域 */
.website-info-container {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin: 12px 0;
    border-bottom: 1px solid #eaeaea;
    padding-bottom: 15px;
}
.website-description {
    flex: 1;
    min-width: 260px;
}
.website-description p {
    margin: 0;
}
.website-screenshot {
    width: 300px;
    height: 220px;
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid #eaeaea;
    background: #fafbfc;
    display: flex;
    align-items: center;
    justify-content: center;
}
.website-screenshot img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 搜索平台链接间距 */
.search-link {
    margin-left: 10px;
}

/* 查询链接区域美化 */
.website-details p:has(.website-details__destination-url) {
    border-bottom: 1px solid #f0f0f0; /* 分隔线 */
    padding-bottom: 10px;
    margin-bottom: 10px;
}

/* 分隔线 */
.website-details__separator {
    margin: 28px 0;
    border: 0;
    height: 1px;
    background-color: #eaeaea; 
}

/* 更明显的分隔线 */
.website-details__separator-highlight {
    margin: 28px 0;
    border: 0;
    height: 2px;
    background-color: #e0e0e0;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

/* SEO和全站概况之间的分隔线 */
.seo-overview-separator {
    width: 100%;
    height: 1px;
    background-color: #eaeaea;
    margin: 20px 0;
    border-bottom: none;
}

/* SEO工具链接 */
.seo-tools-links {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 20px;
}
.seo-tools-links a, .seo-tools-links span {
    margin-right: 10px;
    margin-bottom: 8px;
    white-space: nowrap;
    color: #333333; /* 黑色链接 */
    text-decoration: none;
    width: calc(14.28% - 10px); /* 每行7个链接 */
}
.seo-tools-links a:hover {
    color: #000000; /* 悬停时的颜色为深黑色 */
    text-decoration: underline;
}
.seo-tools-links .disabled {
    color: #999; /* 禁用状态的颜色 */
}

/* 相关文章标题 */
.website-details h3 {
    font-size: 19px;
    font-weight: 600;
    color: #1a1a1a;
    margin: 22px 0 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #eaeaea;
}

/* 相关文章列表 */
.related-posts {
    list-style-type: none;
    padding: 0;
    margin: 10px 0 0 0;
}
.related-posts li {
    padding: 10px 0;
    border-bottom: 1px solid #f0f0f0;
}
.related-posts li:last-child {
    border-bottom: none;
}
.related-posts li a {
    color: #1976d2;
    font-weight: 600;
    font-size: 15px;
    text-decoration: none;
    display: inline-block;
    margin-bottom: 4px;
}
.related-posts li a:hover {
    color: #0d47a1;
    text-decoration: underline;
}
.related-posts li p {
    color: #666;
    font-size: 13px;
    margin: 0;
    line-height: 1.6;
}


/* 相关网站推荐区域样式 */
.related-websites-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-gap: 15px;
    margin: 20px 0;
}

.related-website-item {
    width: 100%;
    border: 1px solid #e9ecef;
    border-radius: 5px;
    overflow: hidden;
    transition: all 0.3s ease;
}

.related-website-item:hover {
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    transform: translateY(-3px);
}

.related-website-image {
    height: 140px;
    overflow: hidden;
    position: relative;
}

.related-website-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.related-website-item:hover .related-website-image img {
    transform: scale(1.05);
}

.related-website-title {
    padding: 8px;
    font-size: 14px;
    color: #333;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    background-color: #f8f9fa;
    border-top: 1px solid #e9ecef;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.related-website-item a {
    text-decoration: none;
    color: #333;
    display: block;
    width: 100%;
    height: 100%;
    background: none;
    box-shadow: none;
    outline: none;
    transition: none;
    -webkit-tap-highlight-color: transparent; /* 去除移动端点击高亮 */
}

.related-website-item a:hover,
.related-website-item a:active,
.related-website-item a:focus {
    text-decoration: none;
    background: none;
    box-shadow: none;
    outline: none;
    color: #333;
}

/* 响应式布局 */
@media (max-width: 1200px) {
    .related-websites-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 992px) {
    .related-websites-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 768px) {
    .related-websites-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .related-websites-grid {
        grid-template-columns: 1fr;
    }
}

/* 统一的响应式适配 */
@media (max-width: 1200px) {
    .seo-tools-links a, .seo-tools-links span {
        width: calc(20% - 10px); /* 每行5个链接 */
    }
}
@media (max-width: 900px) {
    .website-info-container {
        flex-direction: column;
    }
    .website-screenshot {
        width: 100%;
        height: 180px;
        margin-top: 10px;
    }
}
@media (max-width: 768px) {
    .seo-tools-links a, .seo-tools-links span {
        width: calc(33.33% - 10px); /* 每行3个链接 */
    }
}
@media (max-width: 600px) {
    .content-wrapper {
        padding: 10px 2px;
    }
    .website-details__title {
        font-size: 20px;
        padding-bottom: 8px;
    }
    .website-info-container {
        gap: 10px;
        padding-bottom: 10px;
    }
    .website-screenshot {
        height: 120px;
    }
    .website-details h3 {
        font-size: 16px;
        padding-bottom: 5px;
    }
}
@media (max-width: 480px) {
    .seo-tools-links a, .seo-tools-links span {
        width: calc(50% - 10px); /* 每行2个链接 */
    }
}

/* -------------------------- tag.php样式 -------------------------- */
/* 宽度为1200px并居中 */
.content-wrapper.tag-page {
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
}

.tag-side-nav,
.tag-side-sticky,
.tag-side-latest {
    margin-bottom: 10px;
    border: 1px dashed #ccc;
    padding: 8px 10px;
    border-radius: 5px;
    background: none;
}

.tag-side-nav-title,
.tag-side-sticky-title,
.tag-side-latest-title {
    font-size: 16px;
    margin: 0 0 5px 0;
    padding-bottom: 4px;
    line-height: 1.3;
    border-bottom: 1px solid #eaeaea;
    color: #333;
    font-weight: normal;
}

.tag-side-nav-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0;
}
.tag-side-nav-list li {
    width: 49%;
    line-height: 1.4;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
.tag-side-nav-list a {
    color: #333;
    text-decoration: none;
    font-size: 14px;
    display: inline-block;
    padding: 2px 0;
    margin: 0;
}
.tag-side-nav-list a:hover {
    color: #1976d2;
}

.tag-side-sticky-list {
    list-style: none;
    padding: 0;
    margin: 0;
    line-height: 1.5;
}
.tag-side-sticky-list li {
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
}
.tag-side-sticky-label {
    background-color: #ff4757;
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    padding: 2px 8px;
    border-radius: 3px;
    margin-right: 5px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
}
.tag-side-sticky-list a {
    color: #333;
    text-decoration: none;
    font-size: 14px;
    display: inline-block;
    padding: 2px 0;
    margin: 0;
    flex: 1;
}
.tag-side-sticky-list a:hover {
    color: #1976d2;
}

.tag-side-latest-list {
    list-style: none;
    padding: 0;
    margin: 0;
    line-height: 1.5;
}
.tag-side-latest-list li {
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
}
.tag-side-latest-list a {
    color: #333;
    text-decoration: none;
    font-size: 14px;
    display: inline-block;
    padding: 2px 0;
    margin: 0;
    flex: 1;
}
.tag-side-latest-list a:hover {
    color: #1976d2;
}

/*字体调小为14px，提升紧凑感 */
.tag-category-list a,
.tag-recommend-list a,
.tag-latest-list a {
    font-size: 14px;
}
.tag-side-title {
    font-size: 15px; /* 右侧标题也适当调小 */
}
/* tag.php 右侧顶级分类导航更紧凑的两列布局 */
.tag-category-list {
    display: grid;
    grid-template-columns: 1fr 1fr; /* 两列等宽 */
    gap: 0 8px;                    /* 行间距0，列间距8px */
    padding-left: 0;
    margin: 0;
}

.tag-category-list li {
    list-style: none;
    padding-left: 0;
    margin-bottom: 2px;            /* 行间距更小 */
    line-height: 1.3;              /* 行高更紧凑 */
}

.tag-category-list a {
    font-size: 13px;               /* 字体再小一点 */
    padding: 0;
    margin: 0;
}

.tag-result-item {
    border-bottom: 1px solid #f0f0f0;
    padding: 16px 0;
}
.tag-result-title {
    font-size: 18px;
    color: #1976d2;
    font-weight: bold;
    text-decoration: none;
    display: block;
    margin-bottom: 6px;
}
.tag-result-title:hover {
    color: #0d47a1;
    text-decoration: underline;
}
.tag-result-desc {
    color: #555;
    font-size: 15px;
    line-height: 1.6;
}

.tag-page-container {
    display: flex;
    gap: 30px;
}
.tag-page-left {
    flex: 7;
    background: #fff;
    padding: 20px;
    border-radius: 6px;
}
.tag-page-right {
    flex: 3;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
/* tag.php 右侧盒子样式优化：去掉背景色，只保留虚线边框 */
.tag-side-box {
    border: 1px dashed #e3e3e3;
    border-radius: 8px;
    background: none; /* 去掉背景色 */
    margin-bottom: 10px;
}
.tag-side-title {
    font-weight: bold;
    padding: 10px 16px 0 16px;
    font-size: 16px;
}
.tag-side-content {
    padding: 10px 16px 16px 16px;
}
.tag-category-list,
.tag-recommend-list,
.tag-latest-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.tag-category-list li,
.tag-recommend-list li,
.tag-latest-list li {
    margin-bottom: 6px;
}
/* 右侧列表链接去掉下划线、点击留痕等效果 */
.tag-category-list a,
.tag-recommend-list a,
.tag-latest-list a {
    color: #333;
    text-decoration: none; /* 去掉下划线 */
    background: none; /* 去掉点击留痕 */
    box-shadow: none;
    outline: none;
    transition: none;
}

.tag-category-list a:hover,
.tag-recommend-list a:hover,
.tag-latest-list a:hover {
    color: #1976d2; /* 悬停时仅变色，不加下划线 */
    text-decoration: none;
    background: none;
    box-shadow: none;
    outline: none;
}

.tag-sticky-label {
    display: inline-block;
    background: #ff4d4f;
    color: #fff;
    border-radius: 3px;
    padding: 2px 8px;
    font-size: 12px;
    margin-right: 6px;
}

/* 响应式：移动端自适应布局 */
@media (max-width: 900px) {
    .content-wrapper.tag-page {
        max-width: 100%;
        padding: 0 8px;
    }
    .tag-page-container {
        flex-direction: column;
        gap: 0;
    }
    .tag-page-left, .tag-page-right {
        flex: none;
        width: 100%;
        border-radius: 0;
        padding: 12px 0;
    }
    .tag-page-right {
        margin-top: 20px;
    }
}

/* -------------------------- search.php样式 -------------------------- */

/* 搜索结果页面整体布局 */
.search-results-page {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}
.search-page-left {
    background: none;
    border: 1px dashed #ccc;
    border-radius: 8px;
    box-shadow: none;
    padding: 20px 16px;
    display: flex;
    flex-direction: column;
    justify-content: stretch;
}

/* 去掉内层.container的背景和阴影 */
.search-page-left .container {
    background: none;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
}

/* 保证两栏顶部对齐，无多余外边距 */
.search-page-container {
    align-items: flex-start;
    gap: 20px;
    margin-top: 0;
    padding-top: 0;
}
.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    border: none !important;
    box-shadow: none !important;
}

/* 搜索标题样式 */
.search-title {
    font-size: 24px;
    color: #333;
    margin-bottom: 25px;
    padding-bottom: 15px;
    border-bottom: 1px solid #eee;
}

/* 搜索结果列表 */
.search-results-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* 单个搜索结果项 */
.search-result-item {
    margin-bottom: 25px;
    padding-bottom: 20px;
    border-bottom: 1px solid #eee;
}

.search-result-item:last-child {
    border-bottom: none;
}

/* 搜索结果标题 */
.search-result-title {
    margin-bottom: 10px;
}

.search-result-title a {
    color: #0066cc;
    text-decoration: none;
    font-size: 20px;
    font-weight: bold;
    transition: color 0.2s;
}

.search-result-title a:hover {
    color: #004499;
    text-decoration: underline;
}

/* 搜索结果摘要 */
.search-result-excerpt {
    margin-bottom: 12px;
    color: #555;
    line-height: 1.6;
    font-size: 15px;
}

/* 搜索结果元数据区域：三元素一行展示，间距统一，风格一致 */
.search-result-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 18px; /* 三元素间距 */
    font-size: 14px;
    color: #666;
    margin-top: 10px;
    margin-bottom: 0;
    line-height: 1.6;
}

.search-result-label {
    font-weight: bold;
    margin-right: 4px;
    color: #444;
}

.search-result-type,
.search-result-url,
.search-result-keywords,
.search-result-date {
    margin-right: 0; /* 由gap控制间距 */
}

/* 网址样式统一 */
.search-result-url a {
    color: #2a8527;
    text-decoration: none;
    word-break: break-all;
    transition: color 0.2s;
    font-size: 14px;
}
.search-result-url a:hover {
    color: #1c5e1a;
    text-decoration: underline;
}

/* 关键词标签风格统一 */
.search-result-keywords .keyword-link {
    display: inline-block;
    background: #f5f5f5;
    padding: 2px 10px;
    margin: 0 6px 0 0;
    border-radius: 12px;
    color: #555;
    font-size: 13px;
    text-decoration: none;
    border: 1px solid #e0e0e0;
    transition: all 0.3s ease;
}
.search-result-keywords .keyword-link:hover {
    background: #e0e0e0;
    color: #333;
    border-color: #bbb;
}

/* 高亮标记样式 */
mark {
    background-color: #fff3cd;
    padding: 0 2px;
    border-radius: 2px;
    font-weight: bold;
    color: #333;
}

/* 分页导航 */
.pagination {
    margin-top: 30px;
    text-align: center;
}

.pagination .page-numbers {
    display: inline-block;
    padding: 8px 12px;
    margin: 0 3px;
    border: 1px solid #ddd;
    color: #0066cc;
    text-decoration: none;
    border-radius: 3px;
    transition: all 0.2s ease;
}

.pagination .page-numbers.current {
    background-color: #0066cc;
    color: white;
    border-color: #0066cc;
}

.pagination .page-numbers:hover:not(.current) {
    background-color: #f5f5f5;
}

/* 无结果提示 */
.search-results-page p:last-child {
    color: #666;
    font-size: 16px;
    text-align: center;
    margin: 30px 0;
}

/* 右侧栏样式 */
.search-page-right {
    flex: 3;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.search-side-nav,
.search-side-sticky,
.search-side-latest {
    margin-bottom: 10px;
    border: 1px dashed #ccc;
    padding: 8px 10px;
    border-radius: 5px;
    background: none;
}

.search-side-nav-title,
.search-side-sticky-title,
.search-side-latest-title {
    font-size: 16px;
    margin: 0 0 5px 0;
    padding-bottom: 4px;
    line-height: 1.3;
    border-bottom: 1px solid #eaeaea;
    color: #333;
    font-weight: normal;
}

.search-side-nav-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0;
}
.search-side-nav-list li {
    width: 49%;
    line-height: 1.4;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
.search-side-nav-list a {
    color: #333;
    text-decoration: none;
    font-size: 14px;
    display: inline-block;
    padding: 2px 0;
    margin: 0;
}
.search-side-nav-list a:hover {
    color: #1976d2;
}

.search-side-sticky-list {
    list-style: none;
    padding: 0;
    margin: 0;
    line-height: 1.5;
}
.search-side-sticky-list li {
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
}
.search-side-sticky-label {
    background-color: #ff4757;
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    padding: 2px 8px;
    border-radius: 3px;
    margin-right: 5px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
}
.search-side-sticky-list a {
    color: #333;
    text-decoration: none;
    font-size: 14px;
    display: inline-block;
    padding: 2px 0;
    margin: 0;
    flex: 1;
}
.search-side-sticky-list a:hover {
    color: #1976d2;
}

.search-side-latest-list {
    list-style: none;
    padding: 0;
    margin: 0;
    line-height: 1.5;
}
.search-side-latest-list li {
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
}
.search-side-latest-list a {
    color: #333;
    text-decoration: none;
    font-size: 14px;
    display: inline-block;
    padding: 2px 0;
    margin: 0;
    flex: 1;
}
.search-side-latest-list a:hover {
    color: #1976d2;
}

/* search页面7/3分栏布局 */
.search-page-container {
    display: flex;
    gap: 30px;
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
}
.search-page-left {
    flex: 7;
    background: #fff;
    padding: 20px;
    border-radius: 6px;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .search-results-page {
        padding: 15px;
    }
    
    .container {
        padding: 15px;
    }
    
    .search-title {
        font-size: 20px;
        margin-bottom: 20px;
        padding-bottom: 10px;
    }
    
    .search-result-title a {
        font-size: 18px;
    }
    
    .search-result-excerpt {
        font-size: 14px;
    }
    
    .search-result-meta {
        flex-direction: column;
        gap: 8px;
    }
    
    .search-result-type,
    .search-result-url,
    .search-result-keywords,
    .search-result-date {
        margin-right: 0;
        margin-bottom: 5px;
        width: 100%;
    }
    
    .pagination .page-numbers {
        padding: 6px 10px;
        margin: 0 2px;
    }
}


/* -------------------- 顶级分类category-top.php页面样式 ------------------- */

/* CSS变量定义 - 用于统一管理图片块宽度 */
:root {
    --website-item-width: 188.25px;
}

/* 添加面包屑导航的样式 */
.breadcrumb-container {
    width: 100%;
    margin-bottom: 0px; /* 减少底部间距 */
    padding: 5px 0; /* 减少上下内边距 */
}
.breadcrumb-content {
    max-width: 1200px;
    margin: 0 auto;
    font-size: 14px;
}
.breadcrumb-label {
    font-weight: bold;
    margin-right: 5px;
}
.breadcrumb-content a {
    color: #666;
    text-decoration: none;
    font-weight: bold; /* 确保链接文字加粗 */
}
.breadcrumb-content a:hover {
    color: #333;
    text-decoration: underline;
}
.current-category {
    color: #333;
    font-weight: normal; /* 确保不覆盖链接样式 */
}

.category_top_page_container {
    display: flex;
    gap: 20px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}

.category_top_left {
    flex: 7;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.category_top_right {
    flex: 3;
    min-width: 250px;
    width: 30%;
    position: relative;
}

.category_top_subcategories {
    display: flex; /* 使用 flex 布局 */
    flex-wrap: wrap;
    gap: 10px; /* 调整项目间距 */
    margin-bottom: 20px; /* 增加和下方内容的间距 */
    border: 1px solid #eee; /* 将虚线边框改为更柔和的实线 */
    padding: 15px;
    border-radius: 5px;
}

/* 隐藏不再使用的 h2 元素 */
.category_top_subcategories h2 {
    display: none;
}

/* 子分类列表容器 */
.category_top_subcategories ul {
    list-style: none; /* 移除列表的点 */
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 12px; /* 设置标签之间的间距 */
}

/* 子分类项目（标签）样式 */
.category_top_subcategories li {
    padding: 0; /* 移除内边距 */
    border-radius: 0; /* 移除圆角 */
    background-color: transparent; /* 将背景设置为透明 */
    border: none; /* 移除边框 */
    line-height: 1.5;
    margin: 0;
}

/* 鼠标悬停效果 */
.category_top_subcategories li:hover {
    background-color: transparent; /* 确保悬停时也没有背景 */
}

/* 标签内链接样式 */
.category_top_subcategories li a {
    text-decoration: none;
    color: #333;
    font-size: 14px;
    font-weight: 500;
}

/* 统计数字样式 */
.category_top_subcategories .category-count {
    color: #777;
    margin-left: 4px;
    font-size: 13px;
}

.category_top_websites {
    display: flex;
    flex-wrap: wrap;
    border: 1px dashed #ccc;
    padding: 10px;
    border-radius: 5px;
    margin-top: 0px;
}

/* 网站项目网格样式 */
.category_top_website_grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, var(--website-item-width));
    gap: 15px;
    width: 100%;
}

.category_top_pagination {
    margin-top: 20px;
    text-align: center;
}

.category_top_pagination a {
    margin: 0 5px;
    padding: 5px 10px;
    border: 1px solid #ddd;
    text-decoration: none;
    color: #333;
    transition: background-color 0.3s ease;
}

.category_top_pagination a:hover {
    background-color: #f0f0f0;
}

.category_top_pagination .current {
    background-color: #333;
    color: #fff;
    border-color: #333;
}

/* 顶级分类导航样式 */
.category_top_categories_nav {
    margin-bottom: 10px;
    border: 1px dashed #ccc;
    padding: 8px 10px;
    border-radius: 5px;
}

/* 推荐网站区域样式 */
.category_top_sticky_posts {
    margin-bottom: 10px;
    border: 1px dashed #ccc;
    padding: 8px 10px;
    border-radius: 5px;
}

/* 最新发布区块样式 */
.category_top_right .category_top_latest_posts_wrapper {
    margin-bottom: 10px;
    border: 1px dashed #ccc;
    padding: 8px 10px;
    border-radius: 5px;
}

.category_top_right > h2,
.category_top_categories_nav h2,
.category_top_sticky_posts h2,
.category_top_latest_posts_wrapper h2 {
    font-size: 16px;
    margin: 0 0 5px 0;
    padding-bottom: 4px;
    line-height: 1.3;
    border-bottom: 1px solid #eaeaea;
    color: #333;
    font-weight: normal;
}

/* 包装最新发布内容 */
.category_top_latest_posts {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* 顶级分类列表项样式 */
.category_top_categories_list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0;
}

/* 优化分类列样式 */
.category_top_categories_list li {
    width: 49%;
    line-height: 1.4;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    margin-bottom: 4px;
    position: relative;
    padding-left: 0;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
}

.category_top_categories_list a,
.category_top_latest_posts a {
    color: #333;
    text-decoration: none;
    font-size: 14px;
    display: inline-block;
    padding: 2px 0;
    flex: 1;
}

.category_top_categories_list a:hover,
.category_top_latest_posts a:hover {
    color: #1976d2;
}

/* 最新发布列表样式 */
.category_top_latest_posts li {
    margin-bottom: 4px;
    position: relative;
    padding-left: 0;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
}

/* 单个网站项目容器 */
.website-item {
    width: var(--website-item-width);
    height: 220px;
    border: 1px solid #eaeaea;
    border-radius: 4px;
    overflow: hidden;
    background-color: #fff;
    display: flex;
    flex-direction: column;
}

/* 网站标题样式 */
.website-title {
    height: 40px;
    padding: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: center;
    border-bottom: 1px solid #eaeaea;
    width: 100%; /* 使用100%宽度，继承父元素宽度 */
    box-sizing: border-box;
    display: flex; /* 使用 Flexbox 布局 */
    align-items: center; /* 垂直居中对齐 */
    justify-content: flex-start; /* 水平左对齐 */
    flex-wrap: nowrap; /* 防止换行 */
}

/* 列表页的置顶标记样式调整 */
.website-title .website-sticky-label {
    font-size: 12px;
    padding: 2px 6px;
    margin-right: 5px;
    margin-bottom: 0;
    flex-shrink: 0; /* 防止压缩 */
}

.website-title .website-sticky-label:after {
    display: none;
}

.website-title a {
    color: #333;
    font-size: 14px;
    text-decoration: none;
    font-weight: normal;
    text-align: left; /* 文本左对齐 */
    flex: 1; /* 占据剩余空间 */
    min-width: 0; /* 允许内容收缩 */
    overflow: hidden; /* 隐藏溢出内容 */
    text-overflow: ellipsis; /* 显示省略号 */
    white-space: nowrap; /* 强制不换行 */
}

.website-title a:hover {
    color: #1976d2;
}

/* 网站截图链接样式 */
.website-screenshot {
    flex: 1;
    display: block;
    position: relative;
    overflow: hidden;
    width: 100%; /* 使用100%宽度，继承父元素宽度 */
    height: 180px;
}

/* 网站截图图片样式 */
.website-screenshot img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

/* 响应式布局 */
@media (max-width: 992px) {
    .category_top_page_container {
        flex-direction: column;
    }
    
    .category_top_left,
    .category_top_right {
        width: 100%; /* 在小屏幕上占满宽度 */
    }
    
    .category_top_website_grid {
        grid-template-columns: repeat(auto-fill, var(--website-item-width));
        justify-content: center;
    }
}

@media (max-width: 768px) {
    .category_top_website_grid {
        grid-template-columns: repeat(auto-fill, var(--website-item-width));
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .category_top_website_grid {
        grid-template-columns: repeat(auto-fill, var(--website-item-width));
        justify-content: center;
    }
}

/* 网站置顶标记样式 */
.website-sticky-label {
    display: inline-block;
    background: #ff4757;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    padding: 4px 10px;
    border-radius: 4px;
    margin-bottom: 10px;
    box-shadow: 0 2px 4px rgba(0,0,0,.1);
}

/* 详情页标题和置顶标记容器 */
.website-title-container {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    margin-bottom: 15px;
    border-bottom: 1px solid #eaeaea;
    width: 100%;
}

.website-title-container .website-sticky-label {
    flex-shrink: 0;
    margin-bottom: 0;
    position: relative;
    top: -2px; /* 微调垂直位置，向上偏移 */
}

.website-title-container .website-details__title {
    margin-top: 0;
    margin-bottom: 0;
    flex: 1; /* 占据剩余空间 */
}

/* 顶级分类页置顶标签样式 */
.category_top_website-sticky-label {
    background-color: #ff4757;
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    padding: 1px 5px;
    border-radius: 3px;
    margin-right: 5px;
    vertical-align: middle;
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}

/* 推荐网站列表样式 */
.category_top_sticky_posts ul {
    list-style: none;
    padding: 0;
    margin: 0;
    line-height: 1.5;
}

.category_top_sticky_posts li {
    margin-bottom: 4px;
    position: relative;
    padding-left: 0;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
}

.category_top_sticky_posts a {
    color: #333;
    text-decoration: none;
    font-size: 14px;
    display: inline-block;
    padding: 2px 0;
    flex: 1;
}

.category_top_sticky_posts a:hover {
    color: #1976d2;
}

/* 响应式调整 - 确保在小屏幕上置顶标记和标题显示正确 */
@media (max-width: 480px) {
    .website-title {
        height: auto;
        min-height: 40px;
        padding: 5px;
    }
    
    .website-title a {
        width: calc(100% - 40px);
        font-size: 13px;
    }
    
    .website-title .website-sticky-label {
        font-size: 11px;
        padding: 1px 5px;
        margin-right: 3px;
    }
    
    /* 详情页标题响应式 */
    .website-title-container {
        flex-wrap: wrap;
    }
    
    .website-title-container .website-sticky-label {
        font-size: 12px;
        padding: 2px 6px;
        margin-bottom: 5px;
    }
    
    .website-title-container .website-details__title {
        font-size: 18px;
        width: 100%;
    }
}



/* ------------------------子分类category-sub.php页面样式------------------------- */
/* 子分类页面整体容器 */
.content-wrapper.category-sub {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0;
}

.category_sub_page_container {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    width: 100%;
    margin: 0;
    padding: 12px;
    box-sizing: border-box;
}

/* 左侧区域 - 占70% */
.category_sub_left {
    flex: 7;
    min-width: 0;
    width: 70%;
}

/* 右侧区域 - 占30% */
.category_sub_right {
    flex: 3;
    min-width: 250px;
    width: 30%;
    position: relative;
}

/* 面包屑导航 */
.category_sub_breadcrumb-container {
    padding: 10px 20px;
    margin-bottom: 20px;
    width: 100%;
    box-sizing: border-box;
}

.category_sub_breadcrumb-content {
    font-size: 14px;
    color: #666;
    width: 100%;
}

.category_sub_breadcrumb-label {
    font-weight: 500;
    margin-right: 5px;
}

.category_sub_breadcrumb-content a {
    color: #1976d2;
    text-decoration: none;
}

.category_sub_breadcrumb-content a:hover {
    text-decoration: underline;
}

.category_sub_current-category {
    color: #333;
    font-weight: 600;
}

/* 子分类导航区域 */
.category_sub_subcategories {
    margin-bottom: 20px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    border: 1px solid #eee;
    padding: 15px;
    border-radius: 5px;
    width: 100%;
    box-sizing: border-box;
}

.category_sub_subcategories h2 {
    display: none;
}

.category_sub_subcategory-list {
    list-style-type: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.category_sub_subcategory-list li {
    margin-bottom: 10px;
    padding: 0;
    border: none;
    transition: all 0.2s ease;
}

.category_sub_subcategory-list li:hover {
    background-color: transparent;
}

.category_sub_subcategory-list a {
    color: #333;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
}

.category_sub_category-count {
    color: #777;
    font-size: 13px;
    margin-left: 4px;
}

/* 网站列表区域 */
.category_sub_websites {
    margin-bottom: 30px;
    width: 100%;
    box-sizing: border-box;
}

.category_sub_websites h2 {
    font-size: 20px;
    margin: 0 0 20px 0;
    padding-bottom: 10px;
    border-bottom: 1px solid #eaeaea;
    color: #333;
}

/* 网站列表项目样式 */
.category_sub_website_grid {
    display: block;
    width: 100%;
}

.category_sub_website-item {
    display: flex;
    width: 100%;
    min-height: 130px;
    height: auto;
    padding: 0;
    margin-bottom: 15px;
    border: 1px solid #eaeaea;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    border-radius: 4px;
    overflow: hidden;
}

.category_sub_website-item:hover {
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

/* 网站截图容器 */
.category_sub_website-screenshot-container {
    width: 130px;
    min-height: 130px;
    height: auto;
    min-width: 130px;
    margin-right: 0;
    border-right: 1px solid #f0f0f0;
    border-radius: 0;
    overflow: hidden;
}

.category_sub_website-screenshot-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 网站信息样式 */
.category_sub_website-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 0px 15px;
    overflow: hidden;
}

/* 网站标题样式 */
.category_sub_website-title {
    width: 100%;
    padding: 0 0 8px 0;
    margin-bottom: 8px;
    font-size: 16px;
    font-weight: 600;
    text-align: left;
    border-bottom: none;
}

.category_sub_website-sticky-label {
    background-color: #ff4757;
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    padding: 2px 8px;
    border-radius: 3px;
    margin-right: 10px;
    flex-shrink: 0;
}

/* 右侧推荐网站中的置顶标签样式 */
.category_sub_sticky_posts .category_sub_website-sticky-label {
    padding: 1px 5px;
    font-size: 12px;
    margin-right: 5px;
    vertical-align: middle;
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}

.category_sub_website-title a {
    color: #1976d2;
    font-weight: 600;
    font-size: 16px;
    text-decoration: none;
}

.category_sub_website-title a:hover {
    text-decoration: underline;
}

/* 网站描述样式 */
.category_sub_website-description {
    margin: 0 0 10px 0;
    color: #555;
    font-size: 14px;
    line-height: 1.5;
    flex-grow: 1;
    overflow: hidden;
}

/* 网站URL样式 */
.category_sub_website-url {
    margin: 0;
    font-size: 14px;
    word-break: break-all;
}

.category_sub_website-url a {
    color: #666;
    text-decoration: none;
}

.category_sub_website-url a:hover {
    color: #1976d2;
    text-decoration: underline;
}

.category_sub_no-data {
    color: #999;
    font-style: italic;
    font-size: 13px;
}

/* 分页导航 */
.category_sub_pagination {
    margin: 20px 0 30px;
    text-align: center;
}



.category_sub_categories_list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0;
}

/* 优化分类列样式 */
.category_sub_column {
    width: 49%;
    line-height: 1.4;
    margin: 0;
    padding: 0;
}

.category_sub_categories_list a,
.category_sub_sticky_posts a,
.category_sub_latest_posts a {
    color: #333;
    text-decoration: none;
    font-size: 14px;
    display: inline-block;
    padding: 2px 0;
    flex: 1;
}

.category_sub_sticky_posts ul,
.category_sub_latest_posts ul {
    list-style: none;
    padding: 0;
    margin: 0;
    line-height: 1.5;
}

/* 调整最后一项的底部边距 */
.category_sub_categories_list li:last-child,
.category_sub_sticky_posts li:last-child,
.category_sub_latest_posts li:last-child {
    margin-bottom: 0;
}

/* 响应式样式 */
@media (max-width: 992px) {
    .category_sub_page_container {
        flex-direction: column;
    }
    
    .category_sub_left,
    .category_sub_right {
        width: 100%; /* 在小屏幕上占满宽度 */
    }
}

@media (max-width: 768px) {
    .category_sub_website-item {
        padding: 10px;
    }
    
    .category_sub_website-screenshot-container {
        width: 130px;
        height: 130px;
        min-width: 130px;
        margin-right: 15px;
    }
    
    .category_sub_website-title a {
        font-size: 16px;
    }
}

@media (max-width: 480px) {
    .category_sub_website-item {
        flex-direction: column;
    }
    
    .category_sub_website-screenshot-container {
        width: 130px;
        height: 130px;
        min-width: 130px;
        margin: 0 auto 15px;
    }
    
    .category_sub_subcategory-list li {
        width: calc(50% - 5px);
        text-align: center;
    }
}

.category_sub_categories_list a:hover,
.category_sub_sticky_posts a:hover,
.category_sub_latest_posts a:hover {
    color: #1976d2;
}

/* category-sub.php 右侧栏样式*/
.category_sub_side-nav,
.category_sub_side-sticky,
.category_sub_side-latest {
    margin-bottom: 10px;
    border: 1px dashed #ccc;
    padding: 8px 10px;
    border-radius: 5px;
    background: none;
}

.category_sub_side-nav-title,
.category_sub_side-sticky-title,
.category_sub_side-latest-title {
    font-size: 16px;
    margin: 0 0 5px 0;
    padding-bottom: 4px;
    line-height: 1.3;
    border-bottom: 1px solid #eaeaea;
    color: #333;
    font-weight: normal;
}

.category_sub_side-nav-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0;
}
.category_sub_side-nav-list li {
    width: 49%;
    line-height: 1.4;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
.category_sub_side-nav-list a {
    color: #333;
    text-decoration: none;
    font-size: 14px;
    display: inline-block;
    padding: 2px 0;
    margin: 0;
}
.category_sub_side-nav-list a:hover {
    color: #1976d2;
}

.category_sub_side-sticky-list {
    list-style: none;
    padding: 0;
    margin: 0;
    line-height: 1.5;
}
.category_sub_side-sticky-list li {
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
}
.category_sub_side-sticky-label {
    background-color: #ff4757;
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    padding: 2px 8px;
    border-radius: 3px;
    margin-right: 5px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
}
.category_sub_side-sticky-list a {
    color: #333;
    text-decoration: none;
    font-size: 14px;
    display: inline-block;
    padding: 2px 0;
    margin: 0;
    flex: 1;
}
.category_sub_side-sticky-list a:hover {
    color: #1976d2;
}

.category_sub_side-latest-list {
    list-style: none;
    padding: 0;
    margin: 0;
    line-height: 1.5;
}
.category_sub_side-latest-list li {
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
}
.category_sub_side-latest-list a {
    color: #333;
    text-decoration: none;
    font-size: 14px;
    display: inline-block;
    padding: 2px 0;
    margin: 0;
    flex: 1;
}
.category_sub_side-latest-list a:hover {
    color: #1976d2;
}