﻿/* 
 * COC 7版角色卡样式表
 * 组织结构:
 * 1. 变量和基本样式
 * 2. 布局样式
 * 3. 组件样式
 * 4. 打印样式
 */

/* ========== 1. 变量和基本样式 ========== */
:root {
    --text-color: #333;
    --border-color: #666;
    --bg-color: #f5f5f5;
    --section-bg: #e9e9e9;
    --input-bg: #fff;
    --header-bg: #333;
    --header-text: white;
    --table-border: #aaa;
    --table-header-bg: #e0e0e0;
    --table-row-alt: #f2f2f2;
    --title-bg: #333;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: "Microsoft YaHei", Arial, sans-serif;
    font-size: 11px;
}

/* 页面标题样式 */
.page-title {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: var(--header-bg);
    color: var(--header-text);
    padding: 8px 0;
    font-size: 18px;
    font-weight: bold;
    z-index: 1001;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.page-title span {
    margin-left: 20px;
    font-size: 18px;
}

/* 为内容添加足够的上边距，确保标题不在A4幅面内 */
html {
    padding-top: 40px;
}

/* ========== 2. 布局样式 ========== */
body {
    background-color: var(--bg-color);
    color: var(--text-color);
    font-size: 11px !important;
    line-height: 1.2;
    padding: 2px;
    width: 21cm;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
    margin-top: 40px;
    position: relative;
    overflow-x: hidden;
}

/* 角色卡页面样式 */
.character-sheet {
    margin-top: 10px !important;
    border: 1px solid var(--border-color);
    padding: 2px;
    background-color: white;
    width: 100%;
    box-sizing: border-box;
    margin: 2px auto 10px auto;
}

/* 主页面布局 */
#main-sheet {
    display: grid;
    grid-template-columns: 1fr 1.1fr 0.9fr;
    grid-template-rows: auto auto auto auto;
    grid-gap: 2px;
}

/* 自定义技能页面布局 */
#custom-skills {
    display: flex;
    flex-direction: column;
    gap: 0;
}

#custom-skills .basic-info-section {
    margin-bottom: 0;
}

#custom-skills .custom-skills-table {
    flex: 1;
}

.custom-skills-container {
    width: 100%;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box;
}

.custom-skills-container table {
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    border-collapse: collapse;
    table-layout: fixed;
    border-spacing: 0 !important;
    box-sizing: border-box;
    border: 1px solid #ddd;
}

.custom-skills-container thead {
    box-sizing: border-box;
    display: table-header-group;
    margin: 0 !important;
    padding: 0 !important;
}

.custom-skills-container tbody {
    box-sizing: border-box;
    display: table-row-group;
    margin: 0 !important;
    padding: 0 !important;
}

.custom-skills-container tr {
    border-bottom: 1px solid #ddd;
}

.custom-skills-container tr:last-child {
    border-bottom: none;
}

.custom-skills-container th,
.custom-skills-container td {
    padding: 1px !important;
    margin: 0 !important;
    border-right: 1px solid #ddd;
    box-sizing: border-box;
}

.custom-skills-container th:last-child,
.custom-skills-container td:last-child {
    border-right: none;
}

.custom-skills-container th {
    background-color: #f2f2f2;
    border-bottom: 1px solid #ddd;
    padding: 2px;
    font-weight: normal;
    font-size: 11px;
    text-align: center;
    height: 22px;
    border-right: 1px solid #ddd;
}

.custom-skills-container th:first-child {
    text-align: left;
    padding-left: 5px;
}

.custom-skills-container tr.even-row {
    background-color: #f2f2f2;
}

.custom-skills-container tr.odd-row {
    background-color: white;
}

.custom-skills-container input {
    box-sizing: border-box;
    height: 18px;
    padding: 1px 2px;
    font-size: 11px;
    width: 100%;
}

.custom-skills-container td {
    padding: 1px;
    vertical-align: middle;
    height: 22px;
}

.custom-skills-container .skill-name {
    width: 90px;
}

@media print {
    @page {
        size: A4;
        margin: 0.5cm; /* 标准页边距，与其他页面一致 */
    }
    
    body {
        margin: 0;
        padding: 0;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    .page-title {
        display: none !important;
    }

    html {
        padding-top: 0 !important;
    }
    
    /* 确保主页面网格布局与浏览模式一致 */
    #main-sheet {
        display: grid !important;
        grid-template-columns: 1fr 1.1fr 0.9fr !important;
        grid-template-rows: auto auto auto auto !important;
        grid-gap: 2px !important;
    }

    .float-nav, #print-modal, .float-buttons, #edit-modal { 
        display: none !important; 
    }

    .subtype-select-button {
        display: none !important;
    }

    /* 隐藏武器表头文字 */
    .weapons-table .weapon-header {
        display: none !important;
    }

    /* 确保编辑模态框在打印时不可见 */
    .modal, #edit-modal, #edit-modal-content, .modal-content {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        z-index: -1 !important;
    }
    
    /* 恢复重要的通用打印样式 */
    .character-sheet {
        transform: none !important;
        margin: 0 !important;
        padding: 10px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    
    /* 确保所有页面在打印时都有统一内边距 */
    .character-sheet.tab-content#custom-skills,
    .character-sheet.tab-content#items,
    .character-sheet.tab-content#notes {
        padding: 10px !important;
        margin: 0 !important;
    }
    
    /* 确保内容容器也有适当的内边距 */
    .custom-skills-container,
    .items-container {
        padding: 0 !important; /* 移除内边距，使表格与section等宽 */
        box-sizing: border-box !important;
        width: 100% !important;
    }
    
    /* 道具页面充满整个页面的样式 */
    #items {
        page-break-inside: avoid !important;
        break-inside: avoid !important;
        display: block !important;
        position: relative !important;
        overflow: visible !important;
        height: auto !important; /* 改为自适应高度，而不是100vh */
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* 调查员信息区域进一步压缩 */
    #items .basic-info-section {
        margin: 0 !important;
        padding: 0 !important;
        min-height: 0 !important;
        max-height: 22px !important; /* 调整为与自定义技能页一致 */
        height: 22px !important; /* 调整为与自定义技能页一致 */
        overflow: hidden !important;
    }

    #items .basic-info-section .section-title {
        padding: 1px 4px !important;
        margin: 0 !important;
        height: 22px !important; /* 调整为与自定义技能页一致 */
        min-height: 16px !important;
        max-height: 22px !important;
        font-size: 11px !important; /* 调整为与自定义技能页一致 */
        line-height: 22px !important;
    }

    #items .investigator-name {
        font-size: 11px !important;
        margin: 0 !important;
    }
    
    /* 道具区域占据更多空间 */
    .items-section {
        page-break-inside: avoid !important;
        break-inside: avoid !important;
        display: block !important;
        margin: 0 !important;
        border-width: 1px !important;
        height: auto !important; /* 改为自适应高度 */
        overflow: hidden !important;
    }
    
    /* 修改道具和笔记页面的标题样式，保持与其他栏目一致 */
    .items-section .section-title {
        padding: 1px 5px !important;
        margin: 0 !important;
        height: auto !important;
        min-height: 22px !important;
        font-size: 11px !important;
        line-height: 22px !important;
        font-weight: bold !important;
        overflow: hidden !important;
        background-color: var(--section-bg) !important;
    }
    
    /* 表格容器样式 */
    .items-container {
        page-break-inside: avoid !important;
        break-inside: avoid !important;
        width: 100% !important;
        height: auto !important; /* 改为自适应高度 */
        overflow: hidden !important;
    }
    
    /* 表格样式 */
    .items-table {
        page-break-inside: avoid !important;
        break-inside: avoid !important;
        height: auto !important; /* 改为自适应高度 */
        width: 100% !important;
        box-sizing: border-box !important;
        margin: 0 !important;
        border-spacing: 0 !important;
    }
    
    /* 表格体部分 */
    .items-table tbody {
        height: auto !important; /* 改为自适应高度 */
    }
    
    /* 表格头部调整 */
    .items-table thead {
        height: 22px !important; /* 与自定义技能页一致 */
    }
    
    /* 调整表头高度 */
    .items-table th {
        height: 22px !important; /* 与自定义技能页一致 */
        font-size: 11px !important; /* 与自定义技能页一致 */
        padding: 2px !important; /* 与自定义技能页一致 */
    }
    
    /* 调整表格行高 */
    .items-table tr {
        page-break-inside: avoid !important;
        break-inside: avoid !important;
        height: 22px !important; /* 与自定义技能页一致 */
        min-height: 22px !important;
        max-height: 22px !important;
        line-height: 22px !important;
    }
    
    /* 表格单元格调整 */
    .items-table td, 
    .items-table th {
        page-break-inside: avoid !important;
        break-inside: avoid !important;
        padding: 1px !important; /* 与自定义技能页一致 */
        height: 22px !important; /* 与自定义技能页一致 */
        min-height: 22px !important;
        max-height: 22px !important;
        vertical-align: middle !important;
        line-height: 22px !important;
        overflow: hidden !important;
    }
    
    /* 输入框高度调整 */
    .items-table input,
    .items-table textarea {
        height: 18px !important; /* 与自定义技能页一致 */
        min-height: 18px !important;
        max-height: 18px !important;
        line-height: 18px !important;
        font-size: 11px !important; /* 与自定义技能页一致 */
        padding: 1px 2px !important; /* 与自定义技能页一致 */
        color: black !important;
        opacity: 1 !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
        background: transparent !important;
        overflow: hidden !important;
    }
    
    /* 通用样式 */
    .character-sheet table,
    .character-sheet .weapons-table,
    .character-sheet .skills-table {
        page-break-inside: avoid;
        border-collapse: collapse;
        width: 100% !important;
    }
    
    .character-sheet * {
        box-sizing: border-box !important;
    }

    .section-title {
        background-color: var(--section-bg) !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    .weapon-row:nth-child(odd):not(.weapon-header) {
        background-color: white !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }
    
    .weapon-row:nth-child(even):not(.weapon-header) {
        background-color: var(--table-row-alt) !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    .skills-column .skill-row:nth-child(even) {
        background-color: var(--table-row-alt) !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }
    
    .skills-column .skill-row:nth-child(odd) {
        background-color: white !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    /* 确保在打印时所有输入框的占位符都不显示 */
    input::placeholder,
    textarea::placeholder,
    .items-table input::placeholder,
    .items-table textarea::placeholder,
    .custom-skills-container input::placeholder,
    .weapon-cell input::placeholder {
        color: transparent !important;
        opacity: 0 !important;
        display: none !important;
        visibility: hidden !important;
    }
    
    /* 确保所有输入框的文本在打印时是可见的 */
    input[type="text"], textarea {
        color: black !important;
        opacity: 1 !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
        background: transparent !important;
    }
    
    /* 针对道具表特别处理 */
    .items-table .item-name,
    .items-table .item-type-input,
    .items-table .item-note {
        color: black !important;
        opacity: 1 !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
        background: transparent !important;
        -webkit-text-fill-color: black !important; /* Safari和iOS的特殊处理 */
        line-height: 18px;
    }
    
    /* 针对textarea的特殊处理 */
    .items-table .item-note {
        outline: none;
        overflow: hidden;
        vertical-align: middle;
        padding: 0 2px;
        white-space: nowrap; /* 在打印时始终单行显示 */
        text-overflow: ellipsis; /* 溢出内容使用省略号 */
        min-height: 18px;
        max-height: 18px !important;
        height: 18px !important;
        display: block;
        line-height: 18px !important;
    }
    
    /* 确保输入框内容可见 */
    input:not([value=""]) {
        color: black !important;
        opacity: 1 !important;
    }
    
    /* 确保技能表中的0值不显示（除基础值外） */
    .occupation-points[value="0"],
    .interest-points[value="0"],
    .growth-points[value="0"],
    .skill-occupation[value="0"],
    .skill-interest[value="0"],
    .skill-growth[value="0"] {
        color: transparent !important;
        opacity: 0 !important;
    }

    /* 新增精确控制规则 */
    .tab-content:not(.print-visible) {
        display: none !important;
    }
    
    .tab-content.print-visible {
        display: block !important;
        position: static !important; /* 修复定位问题 */
        left: auto !important; /* 重置错误定位 */
        visibility: visible !important;
        opacity: 1 !important;
        height: auto !important;
        overflow: visible !important;
        page-break-after: always;
    }

    /* 隐藏打印控制类 */
    .print-hidden {
        display: none !important;
    }

    /* 修改前 */
    .items-table .item-note {
        height: auto;
        white-space: normal;
        overflow: visible;
    }

    /* 修改后 */
    .items-table .item-note,
    #notes .note-note {
        height: 18px !important;
        max-height: 18px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        -webkit-line-clamp: 1 !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
    }
}

/* 调查员、属性、头像区域布局 */
.basic-info-section,
.characteristics-section,
.avatar-section {
    grid-row: 1;
}

.basic-info-section {
    grid-column: 1;
    text-align: center;
    padding: 5px 0;
}

.characteristics-section {
    grid-column: 2;
}

.avatar-section {
    grid-column: 3;
}

/* 武器和战斗区域布局 */
.weapons-section {
    grid-column: 1 / 3;
    grid-row: 4 / 5;
    margin-bottom: 2px;
    background-color: white;
}

.combat-section {
    grid-column: 3;
    grid-row: 4;
}

/* 状态区域布局 */
.stats-section {
    grid-column: 1 / 4;
    grid-row: 2;
}

/* 技能区域布局 */
.skills-section {
    grid-column: 1 / 4;
    grid-row: 3;
}

/* 区域边框 */
.section-border {
    border: 1px solid var(--border-color);
}

/* 区域标题 */
.section-title {
    background-color: var(--section-bg);
    padding: 1px 5px;
    font-weight: bold;
    border-bottom: 1px solid var(--border-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2px;
}

.section-title .checkbox-row {
    display: flex;
    align-items: center;
    font-size: 10px;
    padding: 0 3px;
}

.section-title .total-attr {
    font-size: 11px;
    margin: 0;
    padding: 0 3px;
}

/* ========== 3. 组件样式 ========== */
/* 基本信息区域样式 */
.basic-info-section {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
    display: flex;
    flex-direction: column;
    background-color: white;
    padding: 5px;
}

/* 调查员区域标题样式 */
.basic-info-section .section-title {
    background-color: var(--section-bg);
    color: #000;
    padding: 4px 6px;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #666;
}

/* 调查员区域表格样式 */
.info-table {
    width: 100%;
    border-collapse: collapse;
    background-color: white;
}

.info-table tr {
    border-bottom: 1px solid #eee;
    height: 22px;
}

.info-table tr:last-child {
    border-bottom: none;
}

.info-table .field-label {
    width: 36px;
    text-align: right;
    padding: 2px 5px 2px 6px;
    font-weight: bold;
    font-size: 11px;
    vertical-align: middle;
    white-space: nowrap;
}

.info-table .field-input {
    width: 100%;
    height: 18px;
    border: none;
    border-bottom: 1px dotted #ccc;
    background-color: transparent;
    font-size: 11px;
    padding: 1px 2px;
}

/* 属性区域样式 */
.characteristics-section {
    grid-column: 2 / 3;
    grid-row: 1 / 2;
    display: flex;
    flex-direction: column;
    background-color: white;
    padding: 5px;
}

/* 头像区域样式 */
.avatar-section {
    grid-column: 3 / 4;
    grid-row: 1 / 2;
    display: flex;
    flex-direction: column;
    background-color: white;
    padding: 5px;
}

.avatar-section .section-title {
    background-color: #e9e9e9;
    color: #000;
    padding: 4px 6px;
    font-weight: bold;
    border-bottom: 1px solid #666;
}

/* 头像容器样式 */
.avatar-container {
    width: 120px;
    height: 120px;
    position: relative;
    border: 1px solid var(--border-color);
    margin: 5px auto;  /* 减少上下间距，从20px改为5px */
    background-color: white;
    max-width: 130px;  /* 限制最大宽度 */
}

.avatar-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain; /* 确保图片完整显示 */
}

.avatar-placeholder {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

/* AI绘制头像链接样式 */
.ai-draw-link {
    font-size: 10px;
    color: #3366cc;
    margin-top: 8px;
    text-decoration: none;
    border-bottom: 1px dotted #3366cc;
}

.ai-draw-link:hover {
    color: #1a4aa3;
    border-bottom: 1px solid #1a4aa3;
}

/* 状态区域样式 */
.stats-section {
    grid-column: 1 / 4;
    grid-row: 2 / 3;
    background-color: white;
    padding: 2px;
}

/* 技能区域样式 */
.skills-section {
    grid-column: 1 / 4;
    grid-row: 3 / 4;
    margin-bottom: 2px;
    background-color: white;
}

/* 技能区域样式 - 更接近表格式布局 */
.skills-header {
    display: flex;
    flex-direction: row; /* 改为横向排列两列 */
    width: 100%;
    background-color: var(--table-header-bg);
    border-bottom: 1px solid #ddd; /* 修改边框颜色为更淡的灰色 */
    font-weight: bold;
    padding: 4px 0;
}

.skills-header-column {
    display: flex;
    width: 50%;
}

.skills-header-column:first-child {
    border-right: 1px solid #ddd; /* 左列表头右侧边框 */
}

.skills-header-item {
    text-align: center;
    border-right: 1px solid #ddd; /* 修改边框颜色为更淡的灰色 */
    font-size: 10px;
    box-sizing: border-box;
    padding: 0 2px;
}

/* 每组的第一个项目（技能名称）占更宽的空间 */
.skills-header-item:first-child {
    flex: 4; /* 技能名称列宽增加，从2改为4 */
    text-align: left;
    padding-left: 25px; /* 为复选框留出空间 */
}

/* 非首个表头项（数值列）宽度调整 */
.skills-header-item:not(:first-child) {
    flex: 0.6; /* 减小数值列宽度 */
    min-width: 30px; /* 确保足够显示3位数字，与内容列一致 */
}

/* 每组的最后一个项目不要右边框 */
.skills-header-column .skills-header-item:last-child {
    border-right: none;
}

.skills-container {
    display: flex;
    flex-direction: column;
    width: 100%;
    border: 1px solid #ddd; /* 修改边框颜色为更淡的灰色 */
    margin: 0;
    background-color: white;
    overflow: hidden;
}

.skills-table {
    display: flex;
    flex-direction: row; /* 改为横向排列两列 */
    width: 100%;
}

.skills-column {
    display: flex;
    flex-direction: column;
    width: 50%;
}

.skill-row {
    display: flex;
    /* 移除 width: 50%; 因为行宽度应该是100%填满列宽 */
    min-height: 22px; /* 减小行高，匹配截图 */
    border-bottom: 1px solid #ddd;
    background-color: white;
}

/* 更新交替背景色规则 */
.left-column .skill-row:nth-child(even),
.right-column .skill-row:nth-child(even) {
    background-color: var(--table-row-alt); /* 每两行交替背景色 */
}

.left-column .skill-row {
    border-right: 1px solid #ddd; /* 左列所有行右侧都有边框 */
}

.skill-cell {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2px;
    border-right: 1px solid #ddd;
    height: 100%;
    min-width: 20px; /* 减小最小宽度 */
    overflow: hidden;
    box-sizing: border-box;
}

.skill-cell:not(.skill-name) {
    flex: 0.6; /* 减小非名称列的宽度 */
    min-width: 30px; /* 增加最小宽度以适应输入框 */
    padding: 0 1px; /* 增加最小内边距 */
}

.skill-name {
    flex: 4; /* 名称列宽增加，从2改为4 */
    justify-content: flex-start; /* 左对齐 */
    padding-left: 0; /* 移除左内边距 */
    white-space: nowrap; /* 防止技能名换行 */
    overflow: hidden; /* 防止溢出 */
}

.skill-name span {
    overflow: hidden;
    text-overflow: ellipsis; /* 文本过长时显示省略号 */
    white-space: nowrap;
}

.skill-check {
    margin: 0 3px; /* 调整复选框间距 */
    flex-shrink: 0;
}

.skill-input {
    width: 100%;
    max-width: 30px; /* 增加输入框宽度，确保能容纳3位数字 */
    min-width: 28px; /* 确保最小宽度足够 */
    text-align: center;
    border: none;
    background: transparent;
    font-size: 10px; /* 减小字体大小 */
    padding: 0 2px; /* 添加水平内边距提高可用性 */
}

/* 添加下拉菜单样式 */
.subtype-select {
    font-size: 10px;
    max-width: 100px;
    border: none;
    background: transparent;
    border-bottom: 1px dotted #ccc;
    padding: 0;
    margin-left: 2px;
}

.skill-success {
    text-align: center;
    width: 100%;
    font-size: 10px; /* 减小字体大小 */
    padding: 0; /* 移除内边距 */
}

/* 武器区域样式 - 更接近表格式布局 */
.weapons-table {
    display: table;
    width: 100%;
    border-collapse: collapse;
}

.weapon-row {
    display: table-row;
    border-bottom: 1px solid #ddd;
    min-height: 22px; /* 与技能表行高一致 */
}

/* 交替背景色通过JavaScript应用 */

.weapon-cell {
    display: table-cell;
    padding: 2px; /* 与技能表单元格内边距一致 */
    border-right: 1px solid #ddd;
    vertical-align: middle;
    height: 22px; /* 固定行高 */
}

.weapon-cell:last-child {
    border-right: none;
}

.weapon-cell input {
    width: 100%;
    padding: 1px 2px; /* 与技能表输入框内边距一致 */
    border: none;
    background: transparent;
    font-size: 11px; /* 与技能表字体大小一致 */
    height: 18px; /* 与技能表输入框高度一致 */
}

.add-button {
    margin: 5px;
    padding: 3px 10px;
    background-color: #f0f0f0;
    border: 1px solid #ccc;
    cursor: pointer;
}

/* 模态窗口样式 */
.modal {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1002;
    justify-content: center;
    align-items: center;
}

.modal-content {
    background-color: white;
    width: 400px;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}

.modal-header {
    padding: 10px;
    background-color: var(--header-bg);
    color: var(--header-text);
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.modal-header h2 {
    margin: 0;
    font-size: 16px;
}

.modal-body {
    padding: 15px;
}

.print-option {
    margin-bottom: 10px;
}

.modal-footer {
    padding: 10px;
    text-align: right;
    border-top: 1px solid #ddd;
}

.modal-button {
    padding: 5px 15px;
    background-color: var(--header-bg);
    color: var(--header-text);
    border: none;
    border-radius: 3px;
    cursor: pointer;
}

/* 物品与自定义技能区域样式 */
.items-section, .custom-skills-section {
    border: 1px solid var(--border-color);
    margin-bottom: 2px;
    background-color: white;
}

.items-grid, .custom-skills-grid {
    display: table;
    width: 100%;
    border-collapse: collapse;
}

.item-row, .custom-skill-row {
    display: table-row;
    border-bottom: 1px solid #ddd;
    background-color: white;
}

.item-row:nth-child(even), .custom-skill-row:nth-child(even) {
    background-color: var(--table-row-alt);
}

.item-header, .custom-skill-header {
    background-color: var(--table-header-bg);
    font-weight: bold;
}

.item-cell, .custom-skill-cell {
    display: table-cell;
    padding: 4px;
    border-right: 1px solid #ddd;
    vertical-align: middle;
}

.item-cell:last-child, .custom-skill-cell:last-child {
    border-right: none;
}

.item-cell input, .custom-skill-cell input, .item-cell select {
    width: 100%;
    border: none;
    background: transparent;
}

/* 打印选项相关的样式 */
.print-hidden {
    display: none !important;
}

/* 在打印时隐藏空技能和道具的值 */
@media print {
    .print-empty-skill {
        color: transparent !important;
        border: none !important;
        background: transparent !important;
    }
}

/* 通用字段样式 */
.field-row {
    height: 22px; /* 固定行高 */
    margin: 0; /* 移除边距 */
}

.field-label {
    font-weight: bold;
    font-size: 11px;
    height: 18px;
    line-height: 18px;
    padding-right: 5px;
    white-space: nowrap;
}

.field-input {
    height: 18px; /* 固定高度 */
    font-size: 11px;
    line-height: 18px;
    text-align: center;
    display: block;
    margin: 0 auto;
}

/* 子技能弹出窗口样式 */
.subtype-modal {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1002;
    justify-content: center;
    align-items: center;
}

.subtype-modal.active {
    display: flex;
}

.subtype-modal-content {
    background-color: white;
    width: 350px;
    max-height: 80vh;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.subtype-modal-header {
    padding: 10px;
    background-color: var(--header-bg);
    color: var(--header-text);
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.subtype-modal-header h2 {
    margin: 0;
    font-size: 14px;
}

.subtype-modal-body {
    padding: 10px;
    overflow-y: auto;
    max-height: 60vh;
}

.subtype-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.subtype-item {
    padding: 8px 10px;
    border-bottom: 1px solid #eee;
    cursor: pointer;
    transition: background-color 0.2s;
}

.subtype-item:hover {
    background-color: #f5f5f5;
}

.subtype-item:last-child {
    border-bottom: none;
}

.subtype-modal-footer {
    padding: 10px;
    border-top: 1px solid #ddd;
    text-align: right;
}

.subtype-modal-button {
    padding: 5px 15px;
    background-color: var(--header-bg);
    color: var(--header-text);
    border: none;
    border-radius: 3px;
    cursor: pointer;
    margin-left: 10px;
}

/* 子技能选择按钮样式 */
.subtype-select-button {
    font-size: 10px;
    padding: 1px 3px;
    background-color: #f0f0f0;
    border: 1px solid #ccc;
    border-radius: 3px;
    cursor: pointer;
    margin-left: 3px;
    display: inline-block;
    white-space: nowrap;
    flex-shrink: 0; /* 防止按钮被压缩 */
}

/* 子技能名称显示区域 */
.selected-subtype {
    margin-left: 3px !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100px; /* 增加子技能名称最大宽度 */
}

.skill-cell:last-child {
    border-right: none;
}

/* 子技能行样式 */
.sub-skill-row {
    background-color: inherit; /* 继承父元素的背景色 */
}

.sub-skill-row .skill-name {
    font-style: italic;
}

.sub-skill-row .subtype-select-button {
    background-color: rgba(232, 240, 255, 0.5); /* 半透明的按钮背景色 */
}

/* 更新交替背景色规则 */
.skills-column .skill-row:nth-child(even) {
    background-color: var(--table-row-alt);
}

.skills-column .skill-row:nth-child(odd) {
    background-color: white;
}

/* 悬浮按钮组样式 */
.float-buttons {
    position: fixed;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    gap: 10px;
    z-index: 1000;
}

.float-button {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: white;
    border: 1px solid var(--border-color);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: all 0.3s ease;
    color: #555;
    font-size: 18px;
    position: relative; /* 为提示文字定位 */
}

.float-button i {
    font-size: 18px; /* 图标大小 */
}

/* 悬浮提示文字 */
.button-tooltip {
    position: absolute;
    right: 50px; /* 位于按钮左侧 */
    background-color: rgba(70, 70, 70, 0.9);
    color: white;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 12px;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transform: translateX(10px);
    transition: all 0.3s ease;
    pointer-events: none; /* 防止提示文字影响鼠标事件 */
    z-index: 1001;
}

/* 提示文字三角形箭头 */
.button-tooltip::after {
    content: '';
    position: absolute;
    top: 50%;
    right: -6px;
    transform: translateY(-50%);
    border-width: 6px 0 6px 6px;
    border-style: solid;
    border-color: transparent transparent transparent rgba(70, 70, 70, 0.9);
}

/* 鼠标悬浮时显示提示文字 */
.float-button:hover .button-tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
}

.float-button:hover {
    background-color: #f0f0f0;
    transform: scale(1.1);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.float-button:active {
    transform: scale(0.95);
}

/* 通用输入框样式 */
input[type="text"],
input[type="number"] {
    margin: 1px;
}

.characteristics-section .section-title {
    background-color: var(--section-bg);
    color: #000;
    padding: 4px 6px;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #666;
}

/* Tab 样式 */
.tab-container {
    display: flex;
    margin: 0;
    margin-right: 20px;
}

.tab {
    padding: 5px 15px;
    cursor: pointer;
    background-color: rgba(245, 245, 245, 0.2);
    border: 1px solid rgba(221, 221, 221, 0.3);
    margin-right: 5px;
    border-radius: 5px;
    color: white;
    font-size: 14px;
}

.tab.active {
    background-color: rgba(255, 255, 255, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.5);
}

/* Tab 内容样式 */
.tab-content {
    display: none !important;
    visibility: hidden;
    opacity: 0;
    height: 0;
    overflow: hidden;
    position: absolute;
    left: -9999px;
}

.tab-content.active {
    display: grid !important;
    visibility: visible;
    opacity: 1;
    height: auto;
    overflow: visible;
    position: relative;
    left: 0;
}

/* 自定义技能页面样式 */
.custom-investigator-section {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.custom-investigator-section .section-title {
    display: flex;
    justify-content: space-between;
    width: 100%;
    align-items: center;
}

.investigator-name {
    font-size: 1.1em;
    margin-right: 20px;
}

.custom-skills-container {
    padding: 15px;
}

/* 自定义技能表头样式 */
.custom-skills-container .skills-header-row {
    display: flex;
    width: 100%;
    background-color: var(--table-header-bg);
    border-bottom: 1px solid #ddd;
    font-weight: bold;
    padding: 4px 0;
    margin-bottom: 5px;
}

.custom-skills-container .skills-header-item {
    display: flex;
    width: 50%;
    box-sizing: border-box;
}

.custom-skills-container .skills-header-item:first-child {
    border-right: 1px solid #ddd;
}

.custom-skills-container .skills-header-name,
.custom-skills-container .skills-header-base,
.custom-skills-container .skills-header-occupation,
.custom-skills-container .skills-header-interest,
.custom-skills-container .skills-header-growth,
.custom-skills-container .skills-header-total,
.custom-skills-container .skills-header-half,
.custom-skills-container .skills-header-fifth {
    text-align: center;
    font-size: 10px;
    padding: 0 2px;
    box-sizing: border-box;
}

.custom-skills-container .skills-header-name {
    width: 95px;
    text-align: left;
}

.custom-skills-container .skills-header-base,
.custom-skills-container .skills-header-occupation,
.custom-skills-container .skills-header-interest,
.custom-skills-container .skills-header-growth,
.custom-skills-container .skills-header-total,
.custom-skills-container .skills-header-half,
.custom-skills-container .skills-header-fifth {
    width: 30px;
}

/* 调整技能项样式 */
.custom-skills-container .skill-item {
    flex: 1;
    display: flex;
    height: 22px;
    align-items: center;
    box-sizing: border-box;
}

.custom-skills-container .skill-name {
    width: 95px;
    box-sizing: border-box;
    padding: 1px 2px;
    font-size: 11px;
    border: none;
    background: transparent;
}

.custom-skills-container .skill-base,
.custom-skills-container .skill-occupation,
.custom-skills-container .skill-interest,
.custom-skills-container .skill-growth,
.custom-skills-container .skill-total,
.custom-skills-container .skill-half,
.custom-skills-container .skill-fifth {
    width: 30px;
    box-sizing: border-box;
    height: 18px;
    text-align: center;
    padding: 1px 2px;
    font-size: 11px;
    border: none;
    background: transparent;
}

/* Tab 内容明确样式 */
#main-sheet.active {
    display: grid !important;
    grid-template-columns: 1fr 1.1fr 0.9fr;
    grid-template-rows: auto auto auto auto;
    grid-gap: 2px;
}

#custom-skills.active {
    display: flex !important;
    flex-direction: column;
    gap: 0;
}

/* 战斗区域样式 */
.combat-stats {
    padding: 2px;
}

.combat-row {
    display: flex;
    margin-bottom: 2px;
    align-items: center;
    min-height: 22px;
}

.combat-label {
    flex: 2;
    font-weight: bold;
    font-size: 11px;
    padding: 1px 2px;
}

.combat-value {
    flex: 1;
}

.combat-input {
    width: 100%;
    border: 1px solid #ccc;
    padding: 1px 2px;
    background-color: white;
    height: 20px;
    font-size: 11px;
}

/* 状态盒子样式 */
.stats-container {
    display: flex;
    justify-content: space-between;
    padding: 1px;
    gap: 1px;
}

.stat-box {
    flex: 1;
    border: 1px solid var(--border-color);
    margin: 0;
    background-color: white;
}

.stat-title {
    background-color: var(--section-bg);
    padding: 1px;
    text-align: center;
    font-weight: bold;
    border-bottom: 1px solid var(--border-color);
}

.stat-grid {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 1px;
}

.stat-row {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 33%;
    border-right: 1px solid #eee;
    padding: 0 1px;
    margin: 1px 0;
}

.stat-label {
    flex: 1;
    padding: 1px 0;
    text-align: center;
    font-size: 9px;
    white-space: nowrap;
    width: 100%;
}

.stat-value {
    width: 100%;
    border: none;
    text-align: center;
    padding: 1px 0;
    margin-top: 0;
    border-bottom: 1px dotted #ccc;
    background-color: transparent;
}

/* 属性网格样式 */
.characteristics-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 2px;
    padding: 2px;
}

.characteristic-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid var(--border-color);
    padding: 4px 8px;
    background-color: white;
}

.char-label {
    font-weight: bold;
    flex: 1;
}

.char-value {
    width: 45px; /* 增加宽度以适应三位数字 */
    text-align: center;
    border: 1px solid #ccc;
    padding: 2px;
    background-color: white;
}

/* 去除数字输入框的上下按钮 */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type="number"] {
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield;
}

/* 隐藏文件上传输入框 */
.hidden-file-input {
    display: none;
}

/* 伙伴复选框样式 */
.checkbox-row {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 5px;
}

/* 总点数显示 */
.total-attr {
    font-size: 10px;
    text-align: right;
    display: flex; /* 使用flex布局 */
    align-items: center; /* 垂直居中 */
    justify-content: flex-end; /* 右对齐 */
}

.points-container {
    display: flex;
    align-items: center;
    margin-left: 15px; /* 增加左侧间距 */
    white-space: nowrap; /* 防止换行 */
}

.points-label {
    margin-right: 5px;
}

.points-input {
    width: 30px; /* 减小宽度 */
    text-align: center;
    margin-right: 5px;
    border: 1px solid #ccc;
    height: 18px; /* 固定高度 */
    font-size: 10px; /* 调整字体大小 */
}

.points-remaining {
    font-size: 10px;
    white-space: nowrap; /* 防止换行 */
}

.sheet-section.custom-skills-section {
    padding: 0;
    margin: 0;
    border-top: 0;
}

.sheet-section.custom-skills-section .section-title {
    margin-bottom: 0;
}

.custom-skills-section.section-border {
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box;
}

.custom-skills-section .section-title {
    margin: 0 !important;
    box-sizing: border-box;
}

#custom-skills .sheet-section {
    margin-bottom: 0 !important;
}

.custom-skills-container th,
.custom-skills-container td {
    padding: 1px !important;
    margin: 0 !important;
}

/* 移除sheet-section可能存在的内边距 */
.sheet-section {
    padding: 0;
}

/* 道具页面样式 */
#items {
    display: flex;
    flex-direction: column;
    gap: 0;
}

#items .basic-info-section {
    margin-bottom: 0;
}

#items.active {
    display: flex !important;
    flex-direction: column;
    gap: 0;
}

.items-container {
    width: 100%;
    padding: 0;
    box-sizing: border-box;
    margin: 0;
}

.items-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    border: 1px solid #ddd;
}

.items-table th {
    background-color: #f2f2f2;
    border-bottom: 1px solid #ddd;
    padding: 2px;
    font-weight: normal;
    font-size: 11px;
    text-align: center;
    height: 22px;
    border-right: 1px solid #ddd;
}

.items-table th:first-child {
    text-align: left;
    padding-left: 5px;
}

.items-table th:last-child {
    border-right: none;
}

.items-table td {
    padding: 1px;
    vertical-align: middle;
}

.items-table input {
    width: 100%;
    border: none;
    background: transparent;
    padding: 2px;
    font-size: 11px;
    box-sizing: border-box;
}

/* 确保右侧道具和左侧道具之间有明显分隔 */
.items-table td:nth-child(3) {
    border-right: 1px solid #ddd;
}

/* 为奇偶行设置不同背景色 */
.items-table tr.even-row {
    background-color: #f2f2f2;
}

.items-table tr.odd-row {
    background-color: white;
}

/* 确保输入框在单元格中垂直居中 */
.items-table .item-name,
.items-table .item-type-input,
.items-table .item-note {
    height: 20px;
    line-height: 20px;
}

.items-table .item-type {
    text-align: center;
    cursor: pointer;
    position: relative;
}

.items-table .item-type input {
    text-align: center;
    cursor: pointer;
    background-color: #f9f9f9;
    border-bottom: none; /* 移除下划线 */
}

.items-table .item-type-button {
    display: inline-block;
    background: #f0f0f0;
    border: 1px solid #ddd;
    border-radius: 3px;
    padding: 0 3px;
    margin-left: 3px;
    font-size: 9px;
    cursor: pointer;
}

@media print {
    .items-container {
        padding: 0;
    }
    
    .items-table {
        page-break-inside: avoid;
    }
    
    .items-table th,
    .items-table td {
        border: 1px solid #ddd !important;
    }
    
    /* 在打印时隐藏道具页输入框的提示文字 */
    .items-container input::placeholder {
        color: transparent !important;
        opacity: 0 !important;
    }
    
    .item-type-button {
        display: none !important;
    }
}

/* 导入/导出下拉菜单样式 */
.float-button-container {
    position: relative;
    display: inline-block;
}

.dropdown-menu {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0 8px 16px rgba(0,0,0,0.2);
    z-index: 1000;
    right: 0;
    border-radius: 4px;
    overflow: hidden;
}

.dropdown-menu button {
    display: block;
    width: 100%;
    padding: 12px 16px;
    border: none;
    background: none;
    text-align: left;
    cursor: pointer;
    font-size: 14px;
    color: #333;
    transition: background-color 0.2s;
}

.dropdown-menu button:hover {
    background-color: #e9e9e9;
}

.dropdown-menu button i {
    margin-right: 8px;
    width: 16px;
    text-align: center;
}

.float-button-container:hover .dropdown-menu {
    display: block;
}

/* 帮助模态框样式 */
#help-modal-content {
    max-width: 600px;
    width: 90%;
}

#help-modal-body {
    max-height: 70vh;
    overflow-y: auto;
    line-height: 1.5;
}

#help-modal-body p {
    margin-bottom: 10px;
}

#help-modal-body h3 {
    margin-top: 15px;
    margin-bottom: 8px;
    color: var(--header-bg);
}

#help-modal-body ul {
    margin: 0;
    padding-left: 20px;
}

#help-modal-body li {
    margin-bottom: 5px;
}

#help-modal-body .credits {
    margin-top: 20px;
    font-style: italic;
    color: #666;
}

/* Tooltip 样式 */
.tooltip {
    position: absolute;
    background-color: rgba(0, 0, 0, 0.8);  /* 增加背景不透明度 */
    color: white;
    padding: 8px 12px;  /* 增加内边距 */
    border-radius: 4px;
    font-size: 13px;  /* 增加字体大小 */
    line-height: 1.4;  /* 添加行高 */
    white-space: pre-wrap;
    z-index: 1001;
    display: none;
    min-width: 300px;     /* 增加最小宽度到300px */
    max-width: 800px;     /* 增加最大宽度到800px */
    word-wrap: break-word;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);  /* 添加阴影 */
}

@media print {
    .tooltip {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
    }
}

/* 编辑模态框样式优化 */
#edit-modal {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1002;
    justify-content: center;
    align-items: center;
    transition: opacity 0.3s ease;
    opacity: 0;
}

#edit-modal.active {
    display: flex;
    opacity: 1;
}

#edit-modal-content {
    background-color: white;
    width: 80%;
    max-width: 600px;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    padding: 20px;
    transition: transform 0.3s ease;
    transform: translateY(-20px);
    box-sizing: border-box;
}

#edit-modal.active #edit-modal-content {
    transform: translateY(0);
}

#edit-modal textarea {
    width: calc(100% - 20px); /* 减去padding的宽度 */
    height: auto;
    min-height: 200px;
    font-size: 14px;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    resize: vertical;
    box-sizing: border-box;
}

#edit-modal .modal-footer {
    text-align: right;
    margin-top: 10px;
}

#edit-modal .modal-button {
    padding: 5px 15px;
    background-color: var(--header-bg);
    color: var(--header-text);
    border: none;
    border-radius: 3px;
    cursor: pointer;
    margin-left: 10px;
}

/* 道具区域标题调整 */
.items-section .section-title {
    padding: 1px 5px !important;
    margin: 0 !important;
    height: auto !important;
    min-height: 22px !important;
    font-size: 11px !important;
    line-height: 22px !important;
    font-weight: bold !important;
    background-color: var(--section-bg);
}

/* 优化单元格比例 - 名称列宽度增加，备注列宽度增加 */
.items-table th:nth-child(1), .items-table td:nth-child(1), 
.items-table th:nth-child(4), .items-table td:nth-child(4) {
    width: 18% !important; /* 名称列宽度 */
}

.items-table th:nth-child(2), .items-table td:nth-child(2),
.items-table th:nth-child(5), .items-table td:nth-child(5) {
    width: 9% !important; /* 类型列宽度 */
}

.items-table th:nth-child(3), .items-table td:nth-child(3),
.items-table th:nth-child(6), .items-table td:nth-child(6) {
    width: 23% !important; /* 备注列宽度 */
}

/* 确保打印时背景色和边框显示 */
.items-table tr.even-row {
    background-color: #f2f2f2 !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
}

.items-table tr.odd-row {
    background-color: white !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
}

.items-table td, .items-table th {
    border: 1px solid #ddd !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
}

/* 添加负数样式 */
.points-remaining span {
    color: #333; /* 默认颜色 */
}
.points-remaining .negative {
    color: #c00; /* 负数显示红色 */
    font-weight: bold;
}

/* 道具备注框样式优化 */
.item-note {
    display: block;
    width: 100%;
    height: 1.5em;        /* 默认只显示一行高度 */
    white-space: nowrap;  /* 文本不换行 */
    overflow: hidden;     /* 隐藏溢出内容 */
    text-overflow: ellipsis; /* 显示省略号 */
    transition: all 0.3s; /* 添加平滑过渡效果 */
    resize: none;         /* 禁用手动调整大小 */
}

/* 聚焦时展开显示所有行 */
.item-note:focus {
    height: 5em;          /* 展开高度 */
    white-space: normal;  /* 恢复正常换行 */
    overflow: auto;       /* 显示滚动条 */
}

/* 打印模式下显示完整内容 */
@media print {
    .item-note {
        height: auto;
        white-space: normal;
        overflow: visible;
    }
}

/* 新增笔记页样式（复制道具页样式修改选择器） */
#notes .items-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

#notes tr.even-row {
    background-color: #f2f2f2;
}

#notes tr.odd-row {
    background-color: white;
}

#notes td, #notes th {
    border: 1px solid #ddd;
    padding: 1px;
    vertical-align: middle;
}

#notes .note-name,
#notes .note-type-input,
#notes .note-note {
    width: 100%;
    border: none;
    background: transparent;
    font-size: 11px;
    height: 18px;
}

/* 打印样式适配 */
@media print {
    #notes .items-table td,
    #notes .items-table th {
        border: 1px solid #ddd !important;
    }
}

/* 修改笔记备注框样式 */
#notes .note-note {
    height: 18px !important;        /* 固定高度 */
    max-height: 18px !important;    /* 禁止扩展 */
    white-space: nowrap;            /* 禁止换行 */
    overflow: hidden;               /* 隐藏溢出内容 */
    text-overflow: ellipsis;        /* 显示省略号 */
    transition: none !important;    /* 禁用过渡效果 */
    resize: none;                   /* 禁用调整手柄 */
}

/* 移除聚焦状态的高度变化 */
#notes .note-note:focus {
    height: 18px !important;
    max-height: 18px !important;
    overflow: hidden;
    white-space: nowrap;
}

/* 打印样式保持固定高度 */
@media print {
    #notes .note-note {
        height: 18px !important;
        white-space: nowrap;
        overflow: hidden;
    }
}

/* 新增打印控制类 */
#print-notes:checked ~ .notes-section {
    display: block !important;
}

/* 统一表头样式 */
.items-table th,
#notes .items-table th {
    background-color: #f2f2f2;
    border-bottom: 1px solid #ddd;
    padding: 2px;
    font-weight: normal;
    font-size: 11px;
    text-align: center;
    height: 22px;
    border-right: 1px solid #ddd;
}

/* 统一首列左对齐 */
.items-table th:first-child,
#notes .items-table th:first-child {
    text-align: left;
    padding-left: 5px;
}

/* 统一最后列边框处理 */
.items-table th:last-child,
#notes .items-table th:last-child {
    border-right: none;
}

/* 新增通用表格样式 */
.data-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    margin: 0;
    border: 1px solid #ddd;
}

/* 统一表头样式 */
.data-table th {
    background-color: #f2f2f2;
    border-bottom: 1px solid #ddd;
    padding: 2px;
    font-weight: normal;
    font-size: 11px;
    text-align: center;
    height: 22px;
    border-right: 1px solid #ddd;
}

.data-table th:first-child {
    text-align: left;
    padding-left: 5px;
}

.data-table th:last-child {
    border-right: none;
}

/* 统一单元格样式 */
.data-table td {
    padding: 1px;
    vertical-align: middle;
    height: 22px;
    border-right: 1px solid #ddd;
}

/* 统一输入框样式 */
.data-table input,
.data-table textarea {
    width: 100%;
    border: none;
    background: transparent;
    font-size: 11px;
    height: 20px;
    line-height: 20px;
    padding: 2px;
    -webkit-text-fill-color: black !important; /* Safari兼容 */
}

/* 统一备注框行为 */
.data-table textarea {
    resize: vertical;
    min-height: 20px;
    max-height: 100px;
    white-space: pre-wrap;
    overflow-y: auto;
}

/* 统一右侧分隔线 */
.data-table td:nth-child(3) {
    border-right: 1px solid #ddd;
}

/* 统一打印样式 */
@media print {
    .data-table textarea {
        height: auto !important;
        white-space: pre-wrap !important;
        overflow: visible !important;
    }
}

/* 1. 确保笔记页容器与页面边缘的边距完全一致 */
#notes .items-container,
#items .items-container {
    width: 100%;
    padding: 0; /* 移除内边距，使表格紧贴容器边缘 */
    box-sizing: border-box;
    overflow-y: auto;
    background-color: #fff;
}

/* 2. 统一表格边框样式，确保表格紧贴页面边缘 */
#notes .items-table,
#items .items-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    margin: 0;
    border: 1px solid #000;
}

/* 3. 确保笔记页的section不添加额外间距 */
#notes .sheet-section,
#items .sheet-section {
    padding: 0;
    margin-bottom: 1px;
}

/* 4. 统一section-title的边距样式 */
#notes .section-title,
#items .section-title {
    padding: 4px 6px;
    margin-bottom: 0;
    border-bottom: 1px solid #000;
}

/* 5. 修正笔记页特有样式，确保与道具页一致 */
#notes.active .items-container {
    margin-top: 0;
    padding-top: 0;
}

/* 统一占位符字体样式 - 参照自定义技能页 */
.items-table input::placeholder,
#notes .items-table input::placeholder,
.items-table textarea::placeholder {
    color: #999 !important;
    font-size: 11px !important;
    font-weight: normal !important;
    font-style: normal !important;
    opacity: 0.75 !important;
    padding-left: 1px !important;
}

/* 统一所有输入框基础样式 */
.items-table input,
#notes .items-table input,
.items-table .item-name,
.items-table .item-type input,
.items-table .item-note {
    font-size: 11px !important; /* 与自定义技能页一致 */
    height: 18px !important;
    line-height: 18px !important;
    padding: 0 2px !important;
    font-family: inherit !important;
}

/* 覆盖旧的不一致样式 */
#notes .note-name,
#notes .note-type-input,
#notes .note-note {
    font-size: 11px !important; /* 与自定义技能页一致 */
}

/* 确保打印时占位符也隐藏一致 */
@media print {
    .items-table input::placeholder,
    #notes .items-table input::placeholder,
    .custom-skills-container input::placeholder {
        color: transparent !important;
        opacity: 0 !important;
    }
}

/* 添加笔记页textarea样式，固定大小但允许存储多行文本 */
#notes .items-table textarea.item-note {
    width: 100%;
    box-sizing: border-box;
    height: 18px !important; /* 固定高度 */
    max-height: 18px !important;
    min-height: 18px !important;
    line-height: 18px !important;
    border: none;
    padding: 0 2px;
    margin: 0;
    background: transparent;
    resize: none; /* 禁止调整大小 */
    overflow: hidden; /* 隐藏溢出内容 */
    white-space: nowrap; /* 单行显示 */
    font-family: inherit;
    font-size: 11px; /* 与道具页一致 */
    vertical-align: middle;
}

/* 确保聚焦时不改变大小 */
#notes .items-table textarea.item-note:focus {
    height: 18px !important;
    max-height: 18px !important;
    min-height: 18px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
}

/* 打印时保持固定大小 */
@media print {
    #notes .items-table textarea.item-note {
        height: 18px !important;
        max-height: 18px !important;
        min-height: 18px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
}

/* 恢复重要的通用打印样式 */
    .character-sheet {
        transform: none !important;
        margin: 0 !important;
        padding: 10px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    
    /* 确保所有页面在打印时都有统一内边距 */
    .character-sheet.tab-content#custom-skills,
    .character-sheet.tab-content#items,
    .character-sheet.tab-content#notes {
        padding: 10px !important;
        margin: 0 !important;
    }
    
    /* 确保内容容器也有适当的内边距 */
    .custom-skills-container,
    .items-container {
        padding: 0 !important; /* 移除内边距，使表格与section等宽 */
        box-sizing: border-box !important;
        width: 100% !important;
    }
    
    /* 优化items特定的character-sheet，但不覆盖内边距 */
    .character-sheet.tab-content#items {
        margin: 0 !important;
    }
    
    /* 确保表格与容器等宽 */
    .custom-skills-container table,
    .items-table {
        width: 100% !important;
        box-sizing: border-box !important;
        margin: 0 !important;
    }


/* 修复CSS语法错误 */
.fix-css-error {
    display: block;
}

/* 统一所有页面的栏目间间隙 */
#custom-skills .sheet-section,
#items .sheet-section,
#notes .sheet-section {
    padding: 0;
    margin-bottom: 1px; /* 确保所有栏目间隙保持一致 */
    border: 1px solid var(--border-color);
}

.dummy-selector {
    /* 空样式，用于修复CSS语法错误 */
    display: block;
}

/* 空样式修复器 */
.css-fix {
    display: block;
}

/* 统一所有页面的栏目间间隙 */
#custom-skills .sheet-section,
#items .sheet-section,
#notes .sheet-section {
    padding: 0;
    margin-bottom: 1px; /* 确保所有栏目间隙保持一致 */
    border: 1px solid var(--border-color);
}

/* 确保所有页面的section-title样式一致 */
#custom-skills .section-title,
#items .section-title,
#notes .section-title {
    padding: 4px 6px;
    margin: 0;
    border-bottom: 1px solid #000;
    background-color: var(--section-bg);
    font-weight: bold;
    font-size: 11px;
    height: 22px;
    line-height: 22px;
}

/* 确保所有页面的内容容器样式一致 */
#custom-skills .custom-skills-container,
#items .items-container,
#notes .items-container {
    margin: 0;
    padding: 0;
    width: 100%;
    box-sizing: border-box;
}

/* 统一表格样式 */
#custom-skills table,
#items .items-table,
#notes .items-table {
    width: 100%;
    border-collapse: collapse;
    margin: 0;
    border: 1px solid #ddd;
}

/* 统一所有页面的容器样式 */
#custom-skills.active .custom-skills-container,
#items.active .items-container,
#notes.active .items-container {
    margin-top: 0;
    padding-top: 0;
}