/*--------------------------------------------------------------
# search_tools Section - 搜索工具区域样式
--------------------------------------------------------------*/

/* 搜索工具区域整体上边距 */
#tools_search {
    margin-top: 20px;
}

/* 搜索主菜单列表样式 */
#search_main {
    padding: 0;
    margin: 0 auto 0px auto; /* 水平居中，底部无外边距 */
    list-style: none; /* 移除列表默认样式 */
    text-align: center; /* 文本居中 */
}

/* 搜索菜单项样式 */
#search_main li {
    cursor: pointer; /* 鼠标悬停时显示手型指针 */
    display: inline-block; /* 行内块显示，使列表项水平排列 */
    padding: 8px 20px 10px 20px; /* 内边距：上 右 下 左 */
    font-size: 14px;
    font-weight: 200; /* 字体粗细 */
    line-height: 1; /* 行高为1倍字体大小 */
    text-transform: uppercase; /* 文本转换为大写 */
    color: #4d4643; /* 文本颜色 */
    transition: all 0.3s; /* 所有属性过渡动画，持续0.3秒 */
    border-radius: 50px; /* 圆角边框，50px实现椭圆形 */
}

/* 菜单项悬停及激活状态样式 */
#search_main li:hover,
#search_main li.filter-active {
    color: #fff; /* 文本颜色变为白色 */
    background: #3498db; /* 背景颜色变为蓝色 */
}

/* 最后一个菜单项移除右外边距 */
#search_main li:last-child {
    margin-right: 0;
}

/* 搜索表单样式 */
#tools_search form {
    margin-top: 10px; /* 上边距 */
    background: #3498db; /* 表单背景色 */
    padding: 1px 1px; /* 内边距 */
    position: relative; /* 相对定位，为内部绝对定位元素提供参考 */
    border-radius: 1px 0 0 1px; /* 左上角和左下角圆角 */
    text-align: left; /* 文本左对齐 */
}

/* 搜索关键词输入框样式 */
#tools_search #search_key_word {
    border: 0; /* 无边框 */
    padding: 4px 8px; /* 内边距 */
    width: calc(100% - 100px); /* 宽度计算：100%减去100px，为按钮留出空间 */
    font-size: 14px;
    height: 40px; /* 输入框高度 */
}

/* 搜索按钮样式 */
#tools_search form input[type=button] {
    position: absolute; /* 绝对定位，相对于表单 */
    top: 0;
    right: -4px; /* 向右偏移4px，可能为了视觉对齐 */
    bottom: 0;
    border: 0; /* 无边框 */
    background: none; /* 无背景 */
    font-size: 16px;
    padding: 0 20px; /* 内边距 */
    background: #3498db; /* 背景色 */
    color: #fff; /* 文本颜色 */
    transition: 0.3s; /* 过渡动画 */
    border-radius: 0 4px 4px 0; /* 右上角和右下角圆角 */
    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1); /* 阴影效果 */
}

/* 搜索按钮悬停状态 */
#tools_search form input[type=button]:hover {
    background: #3498db; /* 悬停时背景色变化 */
}

/* 项目详情列表样式 */
.item_details {
    padding: 0;
    margin: 5px auto 0px auto; /* 上边距5px，水平居中，底部无外边距 */
    list-style: none; /* 移除列表默认样式 */
    text-align: center; /* 文本居中 */
}

/* 项目详情项样式 */
.item_details li {
    cursor: pointer; /* 手型指针 */
    display: inline-block; /* 行内块显示 */
    padding: 8px 15px 8px 15px; /* 内边距 */
    font-size: 14px;
    font-weight: 400; /* 字体粗细 */
    line-height: 1;
    text-transform: uppercase; /* 文本大写 */
    color: #4d4643;
    transition: all 0.3s; /* 过渡动画 */
    border-radius: 50px; /* 圆角边框 */
}

/* 项目详情项悬停和激活状态 */
.item_details li:hover,
.item_details li.filter-active {
    color: #fff;
    background: #3498db;
}

/* 最后一个项目详情项移除右外边距 */
.item_details li:last-child {
    margin-right: 0;
}

/************************************************
布局相关样式
************************************************/

/* 搜索布局容器，使用Flexbox实现垂直排列 */
#layoutSearch {
    display: flex;
    flex-direction: column; /* 垂直方向排列 */
    min-height: 100vh; /* 最小高度为视口高度 */
}

/* 搜索内容区域 */
#layoutSearch #layoutSearchContent {
    min-width: 0; /* 最小宽度为0，防止内容溢出 */
    flex-grow: 1; /* 弹性增长，填充剩余空间 */
}

/* 错误页脚布局 */
#layoutSearch #layoutError_footer {
    min-width: 0;
}

/* 管理员页脚样式 */
.footer-admin {
    height: 5rem; /* 固定高度 */
    display: flex;
    align-items: center; /* 垂直居中 */
    background: #dddddd; /* 背景色 */
}

/* 深色主题管理员页脚 */
.footer-admin.footer-dark {
    color: rgba(0, 0, 0, 0.6); /* 文字颜色，半透明黑色 */
}

/* 浅色主题管理员页脚 */
.footer-admin.footer-light {
    color: #a7aeb8; /* 文字颜色 */
}

/************************************************
知识搜索区域样式
************************************************/

/* 知识搜索表单样式 */
#knowledge_search form {
    margin-top: 10px;
    padding: 1px 1px;
    position: relative;
    border-radius: 1px 0 0 1px;
    text-align: left;
}

/* 知识搜索输入框 */
#knowledge_search #search_key_word {
    /* border: 1px; */ /* 注释掉的边框样式 */
    padding: 4px 8px;
    width: calc(100% - 100px); /* 动态宽度计算 */
    font-size: 14px;
    height: 40px;
}

/* 知识搜索按钮 */
#knowledge_search form input[type=button] {
    position: absolute;
    top: 0;
    right: -4px;
    bottom: 0;
    border: 0;
    background: none;
    font-size: 16px;
    padding: 0 20px;
    background: #f03c02;
    color: #fff;
    transition: 0.3s;
    border-radius: 0 4px 4px 0;
    box-shadow: 0px 2px 15px rgba(0, 0, 0.2, 0.1); /* 阴影效果，注意rgba参数可能有误 */
}

/* 知识搜索按钮悬停状态 */
#knowledge_search form input[type=button]:hover {
    background: #fd5c28;
}

/* 知识HTML表格样式 */
#knowledge_html table {
    --bs-table-bg: transparent; /* CSS变量：表格背景透明 */
    --bs-table-accent-bg: transparent; /* 强调行背景透明 */
    --bs-table-striped-color: #69707a; /* 斑马行文字颜色 */
    --bs-table-striped-bg: rgba(0, 0, 0, 0.05); /* 斑马行背景色 */
    --bs-table-active-color: #69707a; /* 激活行文字颜色 */
    --bs-table-active-bg: rgba(0, 0, 0, 0.1); /* 激活行背景色 */
    --bs-table-hover-color: #69707a; /* 悬停行文字颜色 */
    --bs-table-hover-bg: rgba(224, 229, 236, 0.25); /* 悬停行背景色 */
    width: 100%; /* 表格宽度100% */
    margin-bottom: 1rem; /* 底部外边距 */
    color: #69707a; /* 文字颜色 */
    vertical-align: top; /* 垂直对齐方式 */
    border-color: #e0e5ec; /* 边框颜色 */
}

/* 表格单元格样式 */
#knowledge_html table > :not(caption) > * > * {
    padding: 0.75rem 0.75rem; /* 单元格内边距 */
    background-color: var(--bs-table-bg); /* 使用CSS变量设置背景色 */
    border-bottom-width: 1px; /* 底部边框宽度 */
    box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg); /* 内阴影，用于斑马纹效果 */
}

/* 表格主体垂直对齐 */
#knowledge_html table > tbody {
    vertical-align: inherit; /* 继承父元素对齐方式 */
}

/* 表格头部垂直对齐 */
#knowledge_html table > thead {
    vertical-align: bottom; /* 底部对齐 */
}

/* 非第一个子元素的上边框 */
#knowledge_html table > :not(:first-child) {
    border-top: 2px solid currentColor; /* 使用当前文字颜色作为边框色 */
}

/* 表格行和单元格的边框设置 */
#knowledge_html table > :not(caption) > * {
    border-width: 1px 0; /* 上下边框1px，左右无边框 */
}

#knowledge_html table > :not(caption) > * > * {
    border-width: 0 1px; /* 左右边框1px，上下无边框 */
}

/* 表格行悬停效果 */
#knowledge_html table > tbody > tr:hover > * {
    --bs-table-accent-bg: var(--bs-table-hover-bg); /* 悬停时使用悬停背景色 */
    color: var(--bs-table-hover-color); /* 悬停时使用悬停文字颜色 */
}

/************************************************
民法典快速定位表单样式
************************************************/

/* 快速定位表单容器样式 */
#law_position {
    margin-top: 20px;
    margin-bottom: 20px;
}

/* 快速定位表单样式 */
#law_position form {
    display: flex;
    align-items: center;
    background-color: #f8f9fa;
    padding: 15px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

/* 快速定位输入框样式 */
#law_position #law_key_word {
    flex: 1;
    border: 1px solid #ced4da;
    padding: 12px 15px;
    font-size: 14px;
    border-radius: 4px 0 0 4px;
    height: 45px;
    box-sizing: border-box;
    transition: border-color 0.3s ease;
}

/* 输入框聚焦状态 */
#law_position #law_key_word:focus {
    outline: none;
    border-color: #3498db;
    box-shadow: 0 0 0 0.2rem rgba(52, 152, 219, 0.25);
}

/* 快速定位按钮样式 */
#law_position #law_position_button {
    border: none;
    background-color: #3498db;
    color: white;
    padding: 0 20px;
    font-size: 14px;
    font-weight: 500;
    border-radius: 0 4px 4px 0;
    height: 45px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

/* 显示全部按钮样式 */
#law_position #law_reset_button {
    border: none;
    background-color: #95a5a6;
    color: white;
    padding: 0 20px;
    font-size: 14px;
    font-weight: 500;
    border-radius: 0 4px 4px 0;
    height: 45px;
    cursor: pointer;
    transition: background-color 0.3s ease;
    margin-left: 5px;
}

/* 按钮悬停状态 */
#law_position #law_position_button:hover {
    background-color: #2980b9;
}

#law_position #law_reset_button:hover {
    background-color: #7f8c8d;
}

/* 移动端适配 */
@media (max-width: 768px) {
    #law_position form {
        flex-direction: column;
        gap: 10px;
    }
    
    #law_position #law_key_word {
        border-radius: 4px;
        width: 100%;
    }
    
    #law_position #law_position_button {
        border-radius: 4px;
        width: 100%;
    }
    
    #law_position #law_reset_button {
        border-radius: 4px;
        width: 100%;
        margin-left: 0;
    }
}

/************************************************
民法典内容排版优化
************************************************/

/* 章节标题样式优化 */
.entry-content .item_ {
    font-size: 18px;
    font-weight: bold;
    color: #2c3e50;
    margin: 30px 0 20px 0;
    padding: 10px 0;
    border-bottom: 2px solid #3498db;
    text-align: center;
}

/* 法条内容样式优化 */
.entry-content .item1, 
.entry-content .item2, 
.entry-content .item3, 
.entry-content [class^="item"][class$="0"],
.entry-content [class^="item"][class$="1"],
.entry-content [class^="item"][class$="2"],
.entry-content [class^="item"][class$="3"],
.entry-content [class^="item"][class$="4"],
.entry-content [class^="item"][class$="5"],
.entry-content [class^="item"][class$="6"],
.entry-content [class^="item"][class$="7"],
.entry-content [class^="item"][class$="8"],
.entry-content [class^="item"][class$="9"] {
    font-size: 14px;
    line-height: 1.8;
    margin: 10px 0;
    text-indent: 2em;
    color: #34495e;
}

/* 法条号样式优化 */
.entry-content [class^="item"]:not(.item_) {
    font-weight: 500;
}

/* 关键词高亮样式 */
.entry-content strong {
    color: #e74c3c;
    background-color: #fff3cd;
    padding: 2px 4px;
    border-radius: 3px;
    font-weight: bold;
}

/* 整体内容区域优化 */
.entry-content {
    max-width: 100%;
    margin: 0 auto;
    padding: 30px;
    background-color: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    line-height: 1.8;
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif;
}

/* 标题样式优化 */
.entry-title {
    font-size: 28px;
    font-weight: bold;
    color: #2c3e50;
    margin-bottom: 30px;
    text-align: center;
    padding-bottom: 15px;
    border-bottom: 3px solid #3498db;
}

/* 数据来源和施行日期样式 */
.entry-content p:first-of-type {
    color: #7f8c8d;
    font-size: 14px;
    margin-bottom: 10px;
    text-align: center;
}

/* 通过日期样式 */
.entry-content p:nth-of-type(2) {
    color: #2980b9;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 30px;
    text-align: center;
}

/* 移动端内容适配 */
@media (max-width: 768px) {
    .entry-content {
        padding: 10px;
    }
    
    .entry-content .item_ {
        font-size: 16px;
        margin: 20px 0 15px 0;
    }
    
    .entry-content [class^="item"]:not(.item_) {
        font-size: 13px;
        line-height: 1.6;
        text-indent: 1.5em;
    }
}

/* 辅助类：视觉上隐藏元素但保持可访问性 */
.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

