/* 字体定义 */
@font-face {
    font-family: 'HYWenHei-35W-6';
    src: url('/fonts/HYWenHei-35W-6.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'HYWenHei-45W-5';
    src: url('/fonts/HYWenHei-45W-5.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'HYWenHei-55W-4';
    src: url('/fonts/HYWenHei-55W-4.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'HYWenHei-65W-3';
    src: url('/fonts/HYWenHei-65W-3.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'HYWenHei-75W-2';
    src: url('/fonts/HYWenHei-75W-2.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'HYWenHei-85W-1';
    src: url('/fonts/HYWenHei-85W-1.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
}

/* 应用于除 year-header 和 footer 之外的所有中文区域 */
body {
    background: #EBEDFA; /* Chicago 95 */
    font-family: 'HYWenHei-45W-5', 'HYWenHei-55W-4', 'HYWenHei-65W-3', 'HYWenHei-75W-2', 'HYWenHei-85W-1', sans-serif;
    color: #141F52; /* Chicago 20 */
    padding: 20px;
    margin: 0;
    display: flex;
    flex-direction: column;
    /* min-height: 100vh; 删除此行或调整 */
    /* 保持滚动条始终显示 */
    overflow-y: scroll; 
}

.wrapper {
    width: 100%;
    max-width: 1200px;
    margin: 20px auto;
    padding: 0;
    background: #fff;
    color: #141F52; /* Chicago 20 */
    overflow: hidden;
    max-height: 100%; /* 可以设置为合适的值来控制页面高度 */
    position: relative;
    border: 1px solid #D6DBF5; /* Chicago 90 */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    /* flex-grow: 1; 删除此行或调整 */
}

.year-header {
    font-size: 24px;
    font-weight: 700;
    padding: 15px;
    background: #1F2E7A; /* 背景颜色 */
    color: white;
    cursor: pointer;
    border-bottom: 1px solid #D6DBF5;
    transition: background-color 0.3s ease, color 0.3s ease, font-size 0.3s ease;
    font-family: 'Georgia', serif;
    display: flex;
    justify-content: space-between; /* 使内容左右分布 */
}

/* 默认隐藏 summary-info */
.year-header .summary-info {
    display: none;
}

/* 仅在桌面端显示 summary-info */
@media (min-width: 769px) {
    .year-header .summary-info {
        display: inline-block;
        opacity: 0;
        transition: opacity 0.3s ease;
        white-space: nowrap;
        margin-left: 10px;
    }

    .year-header:hover .summary-info {
        opacity: 1; /* 鼠标悬停时显示 */
    }
}

.year-header:hover {
    background-color: #2E45B8; /* Chicago 45 */
    font-size: 24px;
    color: #EBEDFA; /* Chicago 95 */
}
.year-content {
    display: none;
    padding: 0;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s cubic-bezier(0.68, -0.55, 0.27, 1.55), padding 0.5s ease;
}

.year-content.open {
    max-height: 1000px; /* 你可以根据内容的实际高度调整这个值 */
    padding: 20px;
}

table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 20px;
}
th, td {
    padding: 15px;
    border: 1px solid #D6DBF5; /* Chicago 90 */
    text-align: left;
    position: relative;
    overflow: visible;
}
th {
    background: #D6DBF5; /* Chicago 90 */
    font-weight: 700;
}
tr:hover {
    background: #EBEDFA; /* Chicago 95 */
}
.more-content {
    display: none;
    max-height: 0;
    overflow: hidden;
    background: #EBEDFA; /* Chicago 95 */
    border-top: 1px solid #D6DBF5; /* Chicago 90 */
    transition: max-height 0.6s cubic-bezier(0.68, -0.55, 0.27, 1.55), opacity 0.3s ease;
    opacity: 0.5;
}

.more-content.open {
    display: table-row;
    max-height: none; /* 允许自动调整高度 */
    opacity: 1;
}

.tooltip {
    display: none;
}
td.student-name:hover, .more-content.student-content:hover {
    color: #2E45B8; /* Chicago 45 */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
td.donor:hover, .more-content.donor-content:hover {
    color: #475ED1; /* Chicago 55 */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.highlighted {
    background-color: #D6DBF5; /* Chicago 90 */
    transition: background-color 0.3s ease, color 0.3s ease, font-size 0.3s ease;
}
.small-text {
    font-size: 12px;
    color: gray;
    margin-left: 5px;
}
.footer-title {
    text-align: center;
    font-size: 48px;
    font-weight: 800;
    color: #141F52; /* Chicago 20 */
    margin: 40px 40px 40px 40px;
}

.header-title span {
    display: inline-block;
    opacity: 0.6;  /* 初始透明度为0 */
    animation: fadeInOut 3s ease-in-out infinite;
}

@keyframes fadeInOut {
    0%, 100% {
        opacity: 0.6;
    }
    50% {
        opacity: 1;
    }
}
.header-title .line {
    display: block;
    line-height: 1.2;  /* 调整行间距 */
}
/* Footer 样式 */
.footer {
    text-align: center;
    font-size: 14px;
    color: #141F52; /* Chicago 20 */
    margin-top: 100px; /* 往下移 */
    margin-bottom: 20px;
    font-family: 'Georgia', serif; /* 保持原有的字体 */
}

.header-title {
    text-align: center;
    font-size: clamp(24px, 8vw, 100px); /* 字体大小根据视口宽度调整，最小24px，最大100px */
    font-weight: 600;
    color: #141F52; /* Chicago 20 */
    margin: 40px auto; /* 上下边距增加 */
    padding: 5vw; /* 内边距也使用视口宽度单位 */
    background-color: #EBEDFA; /* 适用于年份宽度的背景颜色 */
    width: 100%;
    max-width: 1200px; /* 确保与.wrapper一致 */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); /* 添加阴影效果 */
    border-radius: 5px; /* 添加圆角 */
    box-sizing: border-box; /* 包含内边距和边框在内 */
}

/* 当视口宽度小于768px时，进一步调整字体大小和内边距 */
@media (max-width: 768px) {
    .header-title {
        font-size: 8vw; /* 字体在小屏幕上相对变大，适应较小屏幕 */
        padding: 8vw; /* 调整内边距 */
    }

    .instructions {
        font-size: 18px; /* 减小提示文字的字体大小以适应窄屏 */
        padding: 15px 20px; /* 调整内边距 */
    }
}

/* 默认隐藏手机端部分列 */
.desktop-only {
    display: table-cell;
}

/* 隐藏手机版中的某些列 */
@media (max-width: 768px) {
    .desktop-only {
        display: none;
    }
}

/* Instructions 样式 */
.instructions {
    text-align: left;
    font-size: 20px; /* 默认字体大小 */
    color: #1F2E7A;
    margin: 40px auto;
    max-width: 800px;
    line-height: 1.8;
    padding: 20px 30px;
}

/* 段落样式 */
.instructions p {
    margin: 15px 0;
}

/* 默认情况下，隐藏手机版提示 */
.mobile-instructions {
    display: none;
}

/* 显示桌面版提示 */
.desktop-instructions {
    display: block;
}

/* 在移动设备上切换提示内容 */
@media (max-width: 768px) {
    .desktop-instructions {
        display: none;
    }
    .mobile-instructions {
        display: block;
    }
}

/* 针对学生姓名和捐助人名字的样式 */
td.student-name, td.donor {
    min-width: 6em; /* 设置一个最小宽度 */
}

td.student-name[data-length="2"], td.donor[data-length="2"] {
    letter-spacing: 1em; /* 调整两个字名字的字间距 */
}

/* 针对小字的标识（如“已毕业”），不受 letter-spacing 影响 */
td.student-name .small-text {
    letter-spacing: normal; /* 确保标识不受 letter-spacing 影响 */
}

td.student-name[data-length="2"] .small-text {
    margin-left: -2.2em; /* 通过负值让标识靠近名字 */
}